/*
 Theme Name:     Divi Child Theme
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    Divi Child Theme
 Author:         Elegant Themes
 Author URI:     https://www.elegantthemes.com
 Template:       Divi
 Version:        1.0.0
*/
 
/* =Theme customization starts here
------------------------------------------------------- */

[data-id="info_click_to"] .et_pb_contact_field_checkbox {
display: none!important;
}
/*place button modules next to each other in the same column*/
.pa-inline-buttons .et_pb_button_module_wrapper {
    display: inline-block;
}
.pa-inline-buttons {
    text-align: center !important;
}

.et_contact_bottom_container {
    float: none;
    text-align: left;
    display: block !important;
}

/* Divi Engine CTA 1 Button in the Divi Menu */

.et_pb_menu__menu>nav>ul>li.de-menu-cta a {
    color: black !important;
}

.btn-homepage .et_pb_button_module_wrapper{
	display: inline-block;
}

.btn-homepage a{
	margin-right: 10px;
}

#mobile_menu1 li.de-menu-cta a { 
	color: black !important;
}

/* CTA button styles */
.de-menu-cta a {
    background-color: #9DB883; /* Change button background color here */
    border-radius: 50px; /* Set this to 0px if you want a square CTA button */
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
	text-transform: uppercase;
    text-align: center;
    line-height: 9px;
    font-weight: 600;
    padding: 16px 14px!important;
    display: block;
    padding-left: 30px!important;
    padding-right: 30px!important;
    border: 0px;
}


/* Media query to ensure hover styles are only applied to desktop */

@media (min-width: 981px) {
    
    /* Hover styles for our CTA Button */
    .de-menu-cta a:hover {
        opacity: 1!important;
        color: #fff!important; /* Change hover button text color here */
        background-color: #9DB883; /* Change hover button background color here */
    }
}
    
/* Fix the padding in the primary menu to accomodate the button */
.et_pb_menu--with-logo .et_pb_menu__menu>nav>ul>li>a {
    padding-top: 0px;
    padding-bottom: 0px;
}
 
/* Make sure that the alignment in the menu is correct */
.et_pb_menu .et_pb_menu__menu>nav>ul>li {
    align-items: center;
}

/* Space runt bloggsektionen*/
.news-custom .et_pb_image_container {
    padding: 15px;
	padding-bottom: 0px;
}
 /* Linje under H1 */
.underline-custom h1 {
	border-bottom: 3px solid #798a7e;
	display: inline;
}

/*style the Divi Blurb link as a button*/

a.pa-blurb-button {
	color: #000000;
	background: #9DB883;
	border: 2px solid #9DB883;
	padding: 5px 40px;
	margin-top: 20px;
	border-radius: 50px;
	font-weight: bold;
	text-transform: uppercase;
	display: inline-block;
	transition: all 0.2s ease-in-out;
}


/*style the Divi Blurb link text as a button on hover*/

a.pa-blurb-button:hover {
	background: transparent;
	color: #9DB883;
	border: 2px solid #9DB883;
	cursor: pointer;
	transition: all 0.2s ease-in-out;
}


/*Tabeller i LCA*/

/* WRAPPER – gör tabellen scrollbar på små skärmar */
.gwp-table-wrapper {
  max-width: 100%;
  overflow-x: auto;
  margin: 2rem 0;
  position: relative; /* behövs för pil-overlay */
}

/* TABELL */
.gwp-table {
  width: 100%;
  max-width: 100%;
  min-width: 900px;                  /* bred tabell => horis. scroll på mobil */
  table-layout: fixed;
  border-collapse: collapse;
  border-top: none;
  border-right: 2px solid #849584;
  border-bottom: 2px solid #849584;
  border-left: none;
  font-family: inherit;
  font-size: 15px;                   /* grundstorlek (siffror m.m.) */
  background: transparent;
}

.gwp-table th,
.gwp-table td {
  border: none;
  padding: 0.5rem 0.7rem;
  white-space: normal;
  text-align: right;
}

/* FÖRSTA KOLUMNEN – PHASE + fasnamn */
.gwp-table .phase-header,
.gwp-table .phase-col {
  text-align: left;
  padding-right: 1.5rem;
  border-left: 2px solid #849584;
  border-right: 2px solid #849584;
  min-width: 140px;
  font-size: 0.9em;
}

/* Hur texten i fas-kolumnen får radbrytas */
.gwp-table .phase-col {
  line-height: 1.3;
  white-space: normal;
  word-break: normal !important;   /* bryt inte mitt i ord */
  overflow-wrap: break-word;       /* bryt långa ord innan de sticker ut */
  hyphens: auto;                   /* ev. bindestreck vid brytning */
}

/* “Phase”-rutan (andra raden) – lock + text lite längre ner */
.gwp-table .phase-header {
  font-weight: 600;
  padding-top: 0.9rem;
  padding-bottom: 0.4rem;
  vertical-align: middle;
  border-top: 2px solid #849584;   /* locket runt Phase */
  border-bottom: 1px solid #849584;
}

/* ÖVERSTA TOMMA HÖRNRUTAN – helt “osynlig” */
.gwp-table .corner-top {
  border: none;
  padding: 0;
}

/* HUVUDBLOCKENS RUBRIKER (grön rad: Bio / Fossil) */
.gwp-table .header-main {
  background: #849584;
  color: #ffffff;
  text-align: center;
  font-weight: 600;
  border-top: 2px solid #849584;   /* toppkant för de gröna blocken */
}

.gwp-table .header-bio {
  border-right: 2px solid #849584;
}

.gwp-table .header-fossil {
  border-left: 2px solid #849584;
}

/* Översta raden i sista kolumnen – tom och kantlös */
.gwp-table .compare-top {
  border: none;
  padding: 0;
}

/* “Bio vs, Fossil-based”-rutan (andra raden) – som Phase */
.gwp-table .compare-header {
  text-align: center;
  font-weight: 600;
  padding-top: 0.9rem;
  padding-bottom: 0.4rem;
  vertical-align: middle;
  border-top: 2px solid #849584;   /* locket runt Bio vs-kolumnen */
  border-left: 2px solid #849584;
  border-right: 2px solid #849584;
  border-bottom: 1px solid #849584;
  min-width: 90px;
  font-size: 0.9em;                /* mindre text här också */
}

/* ANDRA RUBRIKSRADEN: GWP-fossil, GWP-biogenic osv. */
.gwp-table .header-sub {
  text-align: center;
  font-weight: 600;
  border-bottom: 1px solid #849584;
  font-size: 0.9em;                /* mindre text än siffror och huvudrubrik */
}

/* SKILJE-LINJE MELLAN GWP-luluc OCH GWP-total */
.gwp-table .inner-sep {
  border-left: 1px solid #849584;
}

/* FÖRSTA & SISTA KOLUMNEN I VARJE MITTBLOCK – ram */
.gwp-table .group1-first,
.gwp-table .group2-first {
  border-left: 2px solid #849584;
}

.gwp-table .group1-last,
.gwp-table .group2-last {
  border-right: 2px solid #849584;
}

/* “Bio vs, Fossil-based”-kolumnen i kroppen */
.gwp-table .compare-col {
  text-align: center;
  border-left: 2px solid #849584;
  border-right: 2px solid #849584;
}

/* TOTAL-RADEN – hela raden grön */
.gwp-table .total-row th,
.gwp-table .total-row td {
  background: #849584;
  color: #ffffff;
  font-weight: 600;
}

/* Bildtext under tabellen (valfri) */
.gwp-caption {
  margin-top: 0.5rem;
  font-size: 0.9rem;
  font-style: italic;
}

/* ---------- SCROLL-HINT: FADE + PILAR PÅ MOBIL ---------- */

/* Fade (bakgrund) – stilla */
.gwp-table-wrapper::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 60px;
  height: 100%;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 1;
}

/* Pilar – separat lager ovanpå faden */
.gwp-table-wrapper::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 60px;
  height: 100%;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Animation för pilarna (bara pilarna, inte faden) */
@keyframes gwp-scroll-hint {
  0%, 100% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(-6px); /* liten knuff åt vänster */
  }
}

/* ------------ RESPONSIVT + SCROLL-HINT ------------ */

/* Tablet/mindre skärmar */
@media (max-width: 768px) {

  /* Fade synlig när .scroll-hint finns */
  .gwp-table-wrapper.scroll-hint::after {
    opacity: 1;
    background:
      linear-gradient(to left,
        rgba(244, 245, 241, 0.95),   /* #F4F5F1 med alpha */
        rgba(244, 245, 241, 0));
  }

  /* Pilar synliga + animerade */
  .gwp-table-wrapper.scroll-hint::before {
    opacity: 1;
    content: "➡︎➡︎";               /* tjocka pilar åt höger */
    font-size: 1.6rem;
    color: #849584;
    animation: gwp-scroll-hint 1.2s ease-in-out infinite;
  }

  /* Tabell-typografi på tablet */
  .gwp-table {
    font-size: 13px;
    /* min-width: 900px gäller fortfarande */
  }

  .gwp-table th,
  .gwp-table td {
    padding: 0.4rem 0.4rem;
  }

  /* fas-kolumnen får mer bredd och snyggare radbrytning */
  .gwp-table .phase-col {
    font-size: 0.85em;
    line-height: 1.4;
    min-width: 190px;
  }

  /* rubriker: Phase-rutan, GWP-rubrikerna och Bio vs */
  .gwp-table .phase-header,
  .gwp-table .header-sub,
  .gwp-table .compare-header {
    font-size: 0.85em;
  }
}

/* Smal mobil */
@media (max-width: 480px) {

  .gwp-table {
    font-size: 12px;
  }

  .gwp-table th,
  .gwp-table td {
    padding: 0.35rem 0.35rem;
  }

  .gwp-table .phase-col {
    font-size: 0.8em;
    line-height: 1.4;
    min-width: 200px;        /* ännu bredare fas-kolumn på mobil */
  }

  .gwp-table .phase-header,
  .gwp-table .header-sub,
  .gwp-table .compare-header {
    font-size: 0.8em;
  }
}

/* Stäng av all in/ut- och scroll-animation på huvudmenyn */
.et-l--header .et_pb_menu__menu > nav > ul > li,
.et-l--header .et_pb_menu__menu > nav > ul > li > a {
    animation: none !important;
    transform: none !important;
    transition: none !important;
}

/*Fullbredd*/
.wp-block-group.alignfull,
.wp-block-cover.alignfull {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

/*Library*/


/* --- Hela filhanteraren i en rundad box med bakgrundsfärg --- */
.library-viewer--container {
    background-color: rgb(219, 222, 210);
    border-radius: 16px;
    padding: 24px;
    box-sizing: border-box;
}

/* --- Grid-layout: 3 kolumner på desktop --- */
.library-viewer--container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    align-items: start;
}

/* Allt som INTE är en mapp eller fil (brödsmulor, meddelanden, text osv)
   ska spänna över hela bredden istället för att bli en rutnätsruta */
.library-viewer--container > *:not(.library-viewer--folder):not(.library-viewer--file) {
    grid-column: 1 / -1;
}

/* --- Mapp/fil-block fyller alltid hela sin rutnätscell, samma höjd/bredd --- */
.library-viewer--folder,
.library-viewer--file {
    width: 100%;
    box-sizing: border-box;
}

.library-viewer--folder .entry-title {
    margin: 0;
    width: 100%;
    font-size: 15px;
    font-weight: 500;
}

.library-viewer--file > a,
.library-viewer--folder .entry-title > a {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    text-decoration: none;
    color: inherit;
    gap: 8px;
    word-break: break-word;
}

.library-viewer--file {
    text-align: center;
    font-size: 15px;
}

/* --- Ikon/förhandsgranskning: större, kvadratisk, robust mot pluginets egen CSS --- */
.library-viewer--folder .library-viewer--folder__icon,
.library-viewer--file .library-viewer--preview {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    max-width: 240px;
    margin: 0 auto 10px !important;
    border-radius: 8px;
    background-color: #f2f2f2;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.library-viewer--preview img,
.library-viewer--preview video,
.library-viewer--preview canvas {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}
.library-viewer--pdf-preview canvas {
    display: none; /* visas via JS när PDF-sidan renderats */
}

/* --- Mobil: 2 kolumner, stora ikoner (~50% av bredden) --- */
@media (max-width: 600px) {
    .library-viewer--container {
        grid-template-columns: repeat(2, 1fr);
        gap: 14px;
        padding: 16px;
        border-radius: 12px;
    }
    .library-viewer--folder .library-viewer--folder__icon,
    .library-viewer--file .library-viewer--preview {
        max-width: none !important;
        width: 92% !important;
    }
    .library-viewer--file,
    .library-viewer--folder .entry-title {
        font-size: 13px;
        line-height: 1.3;
    }
}

/*Design av ikonerna*/
.library-viewer--folder .library-viewer--folder__icon, .library-viewer--file .library-viewer--preview
 {
    background-color: #fff;
    border-radius: 8px;
    padding: 0px;
    box-shadow: 6px 6px 0px rgba(0, 0, 0, 0.15);
}

.library-viewer--breadcrumb_delimiter,.library-viewer--breadcrumb-item:hover, .library-viewer--breadcrumb-item:visited, .library-viewer--breadcrumb-item{
color: #acacac;
}
.library-viewer--breadcrumb_delimiter:first-of-type {
    display: none;
}

.library-viewer--breadcrumb-item:first-of-type {
    display: none;
}

/* --- Hover-zoom ENDAST på ikonen --- */
.library-viewer--folder .library-viewer--folder__icon,
.library-viewer--file .library-viewer--preview {
    transition: transform 0.2s ease;
}

@media (hover: hover) {
    .library-viewer--folder .library-viewer--folder__icon:hover,
    .library-viewer--file .library-viewer--preview:hover {
        transform: scale(1.08);
    }
}

/* --- Download-knapp: liten, diskret ikon --- */
/* --- Download-knapp: diskret, i flödet under titeln, ingen hover-effekt --- */
.library-viewer--download-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    margin: 6px auto 0;
    color: #888;
    opacity: 0.6;
}
.library-viewer--download-btn:hover {
    opacity: 1;
    color: #222;
}

/* Knappen positioneras relativt filkortet, inte hela sidan */
.library-viewer--file {
    position: relative;
}
.library-viewer--breadcrumb{
  border:none;
}