/*
-------------------------------------------
wf-footer.css
-------------------------------------------

  Beskrivning: Stilregler för sidfot
  Skapad av: Webbfröken AB
  Webbadress: https://webbfroken.se

------------------------------------------- */


/*
-------------------------------------------
Sidfot - Delområden - Samarbetspartners
------------------------------------------- */

.wf-partners {
  padding: var(--wf-spacing-80) var(--wf-page-edge-spacing);
  background-color: var(--color-block-secondary);
}

.wf-partners > .sv-layout {
  max-width: var(--wf-grid-size);
  margin: 0 auto;
}

.wf-partners .env-text-heading-02 {
  color: inherit;
  margin: 0 0 var(--wf-spacing-40);
}

.wf-partners > .sv-layout > .sv-layout {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--wf-spacing-80) var(--wf-spacing-120);
  align-items: center;
  justify-items: center;
}

.wf-partners > .sv-layout > .sv-layout .sv-image-portlet img {
  max-height: clamp(80px, 15vw, 200px) !important;
  max-width: max-content !important;
  padding: 0 var(--wf-spacing-20);
  box-sizing: border-box;
  height: 100%;
}


/*
-------------------------------------------
Sidfot - SMUAB - Prenumeration
------------------------------------------- */

.sv-theme-smuab footer .wf-box-secondary {
  padding: var(--wf-spacing-80) var(--wf-page-edge-spacing);
  margin-bottom: 0;
}

.sv-theme-smuab footer .wf-box-secondary > .sv-layout {
  max-width: var(--wf-grid-size);
  margin: 0 auto;
  display: flex;
  gap: var(--wf-spacing-80);
  padding: 0 var(--wf-spacing-80);
  box-sizing: border-box;
}


/* Bild */
.sv-theme-smuab footer .wf-box-secondary > .sv-layout > .sv-image-portlet {
  aspect-ratio: 1 / 1;
  max-width: var(--wf-grid-4-col);
}

.sv-theme-smuab footer .wf-box-secondary > .sv-layout > .sv-image-portlet > img {
  object-fit: cover;
  height: 100%;
  width: 100%;
  max-height: unset;
  max-width: unset;
}


/* Formuläret */
.sv-theme-smuab footer .wf-box-secondary > .sv-layout > .sv-layout {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
}

.sv-theme-smuab footer .wf-box-secondary > .sv-layout > .sv-layout form > div {
  display: flex;
  align-items: center;
  gap: var(--wf-spacing-10);
}

.sv-theme-smuab footer .wf-box-secondary > .sv-layout > .sv-layout form {
  --wf-label-height: 2em;
}

.sv-theme-smuab footer .wf-box-secondary > .sv-layout > .sv-layout form label {
  height: var(--wf-label-height);
  margin: 0;
}

.sv-theme-smuab footer .wf-box-secondary > .sv-layout > .sv-layout form input[type='email'] {
  margin: 0;
}

.sv-theme-smuab footer .wf-box-secondary > .sv-layout > .sv-layout form input[type='submit'] {
  margin-top: var(--wf-label-height);
}

.sv-theme-smuab footer .wf-box-secondary > .sv-layout > .sv-layout > .sv-text-portlet:last-child {
  max-width: var(--wf-grid-6-col);
}


/*
-------------------------------------------
Sidfot - Innehåll
------------------------------------------- */

.wf-footer {
  padding: var(--wf-spacing-120) var(--wf-page-edge-spacing);
  background-color: var(--color-brand);
}

.wf-footer > .sv-layout {
  display: flex;
  flex-direction: column;
  gap: var(--wf-spacing-80);
  max-width: var(--wf-grid-size);
  margin: 0 auto;
}

.wf-footer > .sv-layout > .sv-layout:first-child { 
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--wf-spacing-80) var(--wf-spacing-40);
}

.wf-footer > .sv-layout > .sv-layout:nth-child(2) { 
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--wf-spacing-40);
  padding-left: var(--wf-spacing-40);
  border-left: 1px solid var(--color-brand-contrast);
}

/* Logotyp */
.wf-footer .wf-logo img {
  display: block;
  height: auto !important;
  max-height: 100%;
  max-width: 100%;
  width: 250px !important;
}

.wf-footer .wf-logo > a  {
  display: inline-block;
}

/* Text och länkar */
.wf-footer .env-text-heading-02,
.wf-footer .env-text-body-01,
.wf-footer .env-text-body-01 a:not([class^=env-]):not([class*=" env-"]),
.wf-footer .env-text-body-01 a:not([class^=env-]):not([class*=" env-"]):hover {
  color: var(--color-brand-contrast);
}

.wf-footer .env-text-heading-02 {
  font-size: var(--wf-font-size-h3);
  border-bottom: 1px solid var(--color-brand-secondary);
  padding-bottom: .5em;
  margin: 0 0 .5em;
}

.wf-footer .env-text-body-01 a:not([class^=env-]):not([class*=" env-"]),
.wf-footer .sv-jcrmenu-portlet a {
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
  margin-bottom: var(--wf-spacing-10);
}

.wf-footer .env-text-body-01 a:not([class^=env-]):not([class*=" env-"]):hover,
.wf-footer .sv-jcrmenu-portlet a:hover {
  color: var(--color-brand-contrast);
  text-decoration-thickness: 2px;
}


 
/*
-------------------------------------------
Undantag per delområde
------------------------------------------- */

.sv-theme-skeppsbron .wf-footer .env-text-heading-02 {
  border-bottom-color: var(--env-element-primary-background-color);
}

.sv-theme-solasen-fridhem .wf-footer .env-text-heading-02 {
  border-bottom-color: var(--color-brand-contrast);
}


/* Logotyp */
.sv-theme-skeppsbron .wf-footer.wf-logo img {
  width: 350px !important;
}

.sv-theme-munksjostaden .wf-footer .wf-logo img {
  width: 350px !important;
}

.sv-theme-stationsomradet .wf-footer .wf-logo img {
  width: 350px !important;
}

/* Bild */
.sv-theme-skeppsbron .wf-footer > .sv-layout > .sv-image-portlet  {
  max-width: 352px;
  max-height: unset;
}



/*
-------------------------------------------
Läsplatta
------------------------------------------- */

@media screen and (min-width: 768px) and (max-width: 1024px) {

  /* Partners */
  .wf-partners > .sv-layout > .sv-layout {
    grid-template-columns: repeat(3, 1fr);
  }

  /* Prenumeration */
  .sv-theme-smuab footer .wf-box-secondary > .sv-layout > .sv-layout form > div {
    display: block;
  }

  .sv-theme-smuab footer .wf-box-secondary > .sv-layout > .sv-layout form input[type='submit'] {
    margin-top: 0;
  }

  /* Sidfot */
  .wf-footer > .sv-layout > .sv-layout:first-child {
    grid-template-columns: repeat(3, 1fr);
    grid-template-areas:
      "col1 col1 col1"
      "col2 col3 col4";
  }

  .wf-footer > .sv-layout > .sv-layout:first-child > .sv-layout:first-child { 
    grid-area: col1; 
  }
  
  .wf-footer > .sv-layout > .sv-layout:first-child > .sv-layout:nth-child(2) { 
    grid-area: col2; 
  }
  
  .wf-footer > .sv-layout > .sv-layout:first-child > .sv-layout:nth-child(3) { 
    grid-area: col3; 
  }
  
  .wf-footer footer > .sv-layout > .sv-layout > .sv-layout:first-child > .sv-layout:last-child { 
    grid-area: col4; 
  }

}


/*
-------------------------------------------
Mobil
------------------------------------------- */

@media screen and (max-width: 767px) {
  
  /* Partners */
  .wf-partners > .sv-layout > .sv-layout {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Prenumeration */
  .sv-theme-smuab footer .wf-box-secondary > .sv-layout {
    display: block;
    padding: 0;
  }

  .sv-theme-smuab footer .wf-box-secondary > .sv-layout > .sv-image-portlet {
    display: none;
  }

  /* Sidfot */
  .wf-footer > .sv-layout > .sv-layout:first-child { 
    grid-template-columns: 1fr;
  }

  .wf-footer > .sv-layout > .sv-layout:nth-child(2) { 
    display: block;
    padding-left: 0;
    border-left: none;
  }

}