/*
Theme Name: Divi Child
Template: Divi
Version: 1.0
*/

/* ======================================================
   Global Typography – Bröllopsdrömmar (Divi)
   Desktop first (Divi breakpoint: 980px)
   ====================================================== */

/* ---------- HEADINGS (Divi modules) ---------- */

.et_pb_module h1,
.et_pb_module h2,
.et_pb_module h3,
.et_pb_module h4 {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
}

.et_pb_module h1 { font-size: 40px !important; line-height: 1.2 !important; }
.et_pb_module h2 { font-size: 34px !important; line-height: 1.25 !important; }
.et_pb_module h3 { font-size: 24px !important; line-height: 1.3 !important; }
.et_pb_module h4 { font-size: 20px !important; line-height: 1.35 !important; }

/* H5 (label-stil) */
.et_pb_module h5{
  font-family: 'DM Sans', sans-serif !important;
  font-weight: 400 !important;
  font-size: 14px !important;
  text-transform: uppercase !important;
  letter-spacing: 2px !important;
  line-height: 1.4 !important;
}

/* ---------- BODY TEXT ---------- */

body {
  font-family: 'DM Sans', sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.6;
}

/* Se till att p ärver body men kan tvingas om Divi sätter annat */
.et_pb_module p {
  font-family: 'DM Sans', sans-serif !important;
  font-weight: 400 !important;
  font-size: 18px;
  line-height: 1.6 !important;
}
/* ---------- RESPONSIVE ---------- */

/* Tablet + mobil */
@media (max-width: 980px){

  .et_pb_module p { font-size: 17px !important; }
}

/* Mobil */
@media (max-width: 767px){

  .et_pb_module h5 { font-size: 12px !important; letter-spacing: 1.5px !important; }

  .et_pb_module p { font-size: 16px !important; line-height: 1.65 !important; }
}


/* ---------- BLURB TITLES (Divi-specific) ---------- */
/* Om blurb-titlarna inte respekterar h3/h4-stylingen */
.et_pb_blurb .et_pb_module_header{
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
}

/* ======================================================
   Desktop only: Center content horizontally in 2-column row
   (Keeps Divi default stacking on tablet and mobile)
   ====================================================== */

@media (min-width: 981px){
  .bd-center-row {
    display: flex;
    justify-content: center;
    align-items: center;
  }
}

/* ======================================================
   Newsletter form – Bröllopsdrömmar
   Desktop: inputs on one row, button below
   Tablet/mobile: stacked
   ====================================================== */

.bd-newsletter{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
}

/* Inputs rad */
.bd-newsletter .bd-fields{
  display: flex;
  gap: 15px;
  justify-content: center;
  align-items: center;
}

/* Dölj labels visuellt men behåll för tillgänglighet */
.bd-newsletter label{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Fältens utseende */
.bd-newsletter input[type="text"],
.bd-newsletter input[type="email"]{
  width: 300px;
  height: 54px;
  background: #fff;
  border: 0;
  border-radius: 999px;

  padding: 10px 30px;

  font-family: 'DM Sans', sans-serif;
  font-size: 16px;
  line-height: 1.4;

  color: #1e1e1e;

  outline: none;
  box-shadow: none;
}

/* Placeholder */
.bd-newsletter input::placeholder{
  color: #1e1e1e;
  opacity: 0.6;
}

/* Knappen */
.bd-newsletter .bd-submit{
  display: flex;
  justify-content: center;
}

.bd-newsletter input[type="submit"]{
  background: transparent;
  border: 0;
  padding: 10px 0;
  cursor: pointer;

  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700;
  font-size: 24px;
  text-transform: uppercase;
  letter-spacing: 0.5px;

  color: #1e1e1e;
}

/* Pil efter texten */
/* Knapptext */
.bd-newsletter .bd-button{
  background: transparent;
  border: 0;
  padding: 10px 0;
  cursor: pointer;

  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700;
  font-size: 24px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #1e1e1e;

  display: inline-flex;
  align-items: center;
}

/* Divi-ikonpil som matchar övriga */
.bd-newsletter .bd-button{
  background: transparent;
  border: 0;
  padding: 10px 0;
  cursor: pointer;

  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700;
  font-size: 24px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #1e1e1e;

  display: inline-flex;
  align-items: center;
}

/* Exakt samma pil som dina andra knappar */
.bd-newsletter .bd-button::after{
  font-family: "ETmodules" !important;
  content: "\24";
  font-weight: 400 !important;   /* ← gör pilen tunn */
  font-style: normal !important;
  font-variant: normal !important;
  text-transform: none !important;

  font-size: 24px;
  margin-left: 12px;
  line-height: 1;
  position: relative;
  top: 2px;
}

/* Tablet + mobil: stacka allt */
@media (max-width: 980px){
  .bd-newsletter .bd-fields{
    flex-direction: column;
    align-items: center;
  }

  .bd-newsletter input[type="text"],
  .bd-newsletter input[type="email"]{
    width: 200px;
  }
}

/* ======================================================
   Blog Module – Replace "Read More" with "Läs mer"
   (Language independent override)
   ====================================================== */

.et_pb_blog_grid .more-link{
  font-size: 0 !important;      /* döljer originaltexten */
}

.et_pb_blog_grid .more-link::after{
  content: "Läs mer";
  font-size: 16px;
  text-decoration: underline;
}

/* ======================================================
   Mobile menu – full width edge to edge
   ====================================================== */

@media (max-width: 980px){

  /* Divi Menu Module + ev Fullwidth Menu */
  .et_pb_menu .et_mobile_menu,
  .et_pb_fullwidth_menu .et_mobile_menu{
    width: 100vw !important;
    max-width: 100vw !important;

    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;

    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;

    border-radius: 0 !important;
    box-sizing: border-box !important;
  }

  /* Om Divi lägger en fast bredd på wrappern runt själva hamburgermenyn */
  .et_pb_menu .mobile_nav,
  .et_pb_fullwidth_menu .mobile_nav{
    width: 100% !important;
  }
}
/* ======================================================
   Filterable Portfolio – byt "All" till "Alla"
   utan att påverka boxens storlek
   ====================================================== */

.et_pb_filterable_portfolio .et_pb_portfolio_filters li:first-child a{
  position: relative;
  color: transparent;      /* göm originaltexten */
}

.et_pb_filterable_portfolio .et_pb_portfolio_filters li:first-child a::after{
  content: "a";
  color: inherit;
}
/* ======================================================
   Filterable Portfolio – ta bort ALLA borders
   + sätt aktiv bakgrund
   ====================================================== */

/* Ta bort borders på filterknappar */
.et_pb_filterable_portfolio .et_pb_portfolio_filter,
.et_pb_filterable_portfolio .et_pb_portfolio_filter a{
  border: 0 !important;
  border-width: 0 !important;
  border-bottom: 0 !important;
}

/* Ta bort eventuell linje under hela filterraden */
.et_pb_filterable_portfolio .et_pb_portfolio_filters{
  border: 0 !important;
  border-bottom: 0 !important;
}

/* Aktiv knapp */
.et_pb_filterable_portfolio .et_pb_portfolio_filter a.active{
  background-color: #ecede7 !important;
}

/* Om Divi även sätter bakgrund på li när aktiv */
.et_pb_filterable_portfolio .et_pb_portfolio_filter.active{
  background-color: #ecede7 !important;
}

/* ======================================================
   Filterable Portfolio – hover = samma som aktiv
   ====================================================== */

.et_pb_filterable_portfolio .et_pb_portfolio_filter a:hover{
  background-color: #ecede7 !important;
}

/* Om Divi även sätter hover på li */
.et_pb_filterable_portfolio .et_pb_portfolio_filter:hover a{
  background-color: #ecede7 !important;
}

/* ======================================================
   Filterable Portfolio – lika höga kort
   ====================================================== */

/* Gör grid-raden flexibel */
.et_pb_filterable_portfolio .et_pb_portfolio_items{
  display: flex;
  flex-wrap: wrap;
}

/* Varje kort */
.et_pb_filterable_portfolio .et_pb_portfolio_item{
  display: flex;
  flex-direction: column;
}

/* Textdelen ska expandera lika */
.et_pb_filterable_portfolio .et_pb_portfolio_description{
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* ======================================================
   Portfolio Grid (ej filterable) – lika höga kort
   Bygger på din struktur: .et_pb_portfolio_grid_items > .et_pb_portfolio_item
   ====================================================== */

/* Gör själva grid-listan till flex så alla items i en rad kan stretchas */
.et_pb_portfolio_grid .et_pb_portfolio_grid_items{
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}

/* Behåll Divis kolumnbredd, men gör varje item till flex-kort */
.et_pb_portfolio_grid .et_pb_portfolio_item{
  display: flex;
  flex-direction: column;
  height: auto;
}

/* Länken (bilddelen) ska inte sträcka sig konstigt */
.et_pb_portfolio_grid .et_pb_portfolio_item > a{
  display: block;
}

/* Titel + meta ska ligga “längst ner” om något kort har kortare innehåll */
.et_pb_portfolio_grid .et_pb_portfolio_item .et_pb_module_header,
.et_pb_portfolio_grid .et_pb_portfolio_item .post-meta{
  margin-top: 0;
}

/* Lägg en flexibel “spacer” mellan bild och text om du vill att text alltid hamnar längst ner */
.et_pb_portfolio_grid .et_pb_portfolio_item::after{
  content: "";
  margin-top: auto;
  display: block;
  height: 0;
}

/* Viktigt: låt inte bilderna bestämma höjd genom konstiga line-height/margins */
.et_pb_portfolio_grid .et_portfolio_image{
  display: block;
}
/* =========================================
   Portfolio Grid – justera spacing runt titel
   ========================================= */

.et_pb_portfolio_grid .et_pb_portfolio_item .et_pb_module_header{
  margin-top: 10px;
  margin-bottom: 5px;
}

/* Om du även vill ha lite luft mellan titel och meta */
.et_pb_portfolio_grid .et_pb_portfolio_item .post-meta{
  margin-top: 0;
  margin-bottom: 5px;
}
/* ======================================================
   Portfolio Grid – mer luft under meta-text
   ====================================================== */

/* Lägg mer padding längst ner i kortet */
.et_pb_portfolio_item{
  padding-bottom: 15px !important;  
}

/* ======================================================
   Filterable Portfolio – 30px mellanrum
   ====================================================== */

.et_pb_filterable_portfolio .et_pb_portfolio_items{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 30px !important; /* 30px både horisontellt och vertikalt */
}

/* 4 kolumner med 30px gap */
.et_pb_filterable_portfolio .et_pb_portfolio_item{
  width: calc((100% - 90px) / 4) !important; 
  margin: 0 !important;
}

/* Tablet – 2 kolumner */
@media (max-width: 980px){
  .et_pb_filterable_portfolio .et_pb_portfolio_item{
    width: calc((100% - 30px) / 2) !important;
  }
}

/* Mobil – 1 kolumn */
@media (max-width: 767px){
  .et_pb_filterable_portfolio .et_pb_portfolio_item{
    width: 100% !important;
  }
}

/* =========================================
   Filterable Portfolio – 15px luft runt titel
   ========================================= */

.et_pb_filterable_portfolio .et_pb_module_header{
  padding-left: 15px !important;
  padding-right: 15px !important;
}
.et_pb_filterable_portfolio .post-meta{
  padding-left: 15px !important;
  padding-right: 15px !important;
}


/* =========================================
   Ta bort linjer i mobil / dropdown-meny
   ========================================= */

/* Mobilmeny */
.et_mobile_menu li{
  border-bottom: none !important;
}

.et_mobile_menu li a{
  border-bottom: none !important;
}

/* Dropdown i desktop */
.nav li ul li{
  border-bottom: none !important;
}

.nav li ul li a{
  border-bottom: none !important;
}

/* ======================================================
   Mobile menu – större hamburgarikon (Divi Menu Module + Theme Builder)
   ====================================================== */

.mobile_menu_bar:before {
    font-size: 46px !important;
}