label{
  text-transform: unset !important;
}
#user-login-form .form-item label{
  font-weight: 600;
}
.branding.compass4d {
    margin-bottom: 20px;
    max-width: 50%;
    padding-top: 20px;
}
.header-one{
  border-bottom: none;
  box-shadow: none;
}
.header-one__main.gv-sticky-menu{
  background-color: #2e5be3 !important;
}
.header-one .search-one__icon{
  color: #FFFFFF;
}
.header-one .search-one__icon:hover{
  color: #faaa1e;
}
.header-one .quick-side-icon{
  display: none !important;
}
.search-one__content{
  background-color: #2e5be3;
  border: none;
  box-shadow: none;
}
.search-one__content form.search-block-form input#edit-keys {
  height: 35px;
  padding: 5px;
  border: 1px solid #FFFFFF;
  background-color: #2e5be3;
  color: #FFFFFF;
  width: 100%;
}
.js-form-item.form-item.form-type-search.js-form-type-search.form-item-keys.js-form-item-keys.form-no-label{
  width: 180px;
}

.search-one__content .search-form__submit.button.js-form-submit.form-submit{
  background-color: #FFFFFF;
  color: #2e5be3;
  font-size: 1.2rem;
}

@media (min-width: 1024.1px) {
    .navigation .gva_menu > li > a:hover > span:first-child:before, .navigation .gva_menu > li > a:focus > span:first-child:before {
        opacity: 0;
        bottom: 1px;
    }
    .navigation .gva_menu > li.menu-item--active-trail > a {
        color: #faa91e !important;
    }
}



.breadcrumb-style.gva-parallax-background{
  background-color: #2e5be3 !important;
  background-image: none !important;
}
.breadcrumb-style.gva-parallax-background .breadcrumb-content-main{
  padding-top: 50px;
  padding-bottom: 50px;
}
.logo-site{
    padding-top: 4px;
}
#customize-gavias-preivew .form-group .colorselector {
    width: 100%;
    position: relative;
}

/*
 *  Estils de l'acordió horitzontal
 */

/* 1. Forçar el contenidor principal a ser Flex Horitzontal */
.acordio-wrapper,
.field--name-field-elements {
  display: flex !important;
  flex-direction: row !important;
  width: 100%;
  height: 350px; /* Alçada fixa de l'acordió */
  overflow: hidden;
  box-sizing: border-box;
}

/* Els wrappers de Drupal han de permetre l'expansió flex */
.field--name-field-elements > .field__item {
  display: flex !important;
  flex: 0 0 80px; /* Amplada per defecte tancat */
  /*transition: flex 0.1s ease;*/
}

/* Quan la pestanya interna té .is-active, el wrapper creix */
.field--name-field-elements > .field__item:has(.is-active) {
  flex: 1 1 100% !important;
}

/* Assegurem que el contingut no estigui ocultat pel flexbox */
.accordion-item {
  display: flex !important;
  flex-direction: row !important;
  flex: 0 0 80px !important; /* Amplada tancat */
  height: 100% !important;
  /*transition: flex 0.5s ease, min-width 0.5s ease;*/
  overflow: hidden;
  background-color: #f4f4f4;
  cursor: pointer;
  box-sizing: border-box;
}

/* Quan està ACTIU, s'amplia per ocupar tot l'espai */
.accordion-item.is-active {
  flex: 1 1 100% !important; /* Es fa gran */
  min-width: 300px; /* Amplada mínima quan està obert */
}

/* 3. Franja lateral de color (ARREGLA QUE NO ARRIBI A BAIX) */
.accordion-tab {
  width: 80px !important;
  min-width: 80px !important;
  height: 100% !important; /* Ocupa el 100% de l'alçada del pare */
  display: flex !important;
  align-items: flex-end !important; /* Número a baix de tot */
  justify-content: center !important;
  padding-bottom: 25px !important;
  box-sizing: border-box !important;
}

/* 4. Estil del número */
.accordion-number {
  color: #ffffff;
  font-size: 4rem;
  font-weight: 800;
  line-height: 1;
  user-select: none;
}

/* 5. Contingut intern */
/*.accordion-content {
  padding: 30px 40px;
  flex: 1;
  opacity: 0;
  white-space: nowrap;
  transition: opacity 0.3s ease;
  overflow-y: auto;
}

.accordion-item.is-active .accordion-content {
  opacity: 1;
  white-space: normal;
}*/

/* Mostrar/ocultar el contingut */
.accordion-content {
  display: none;
  padding: 30px 40px;
  flex: 1;
  overflow-y: auto;
}

.accordion-item.is-active .accordion-content {
  display: block !important;
}

.accordion-title {
  margin-top: 0;
  font-size: 1.8rem;
  font-weight: bold;
}

.accordion-item .accordion-body{
  padding-left: 0;
}


/*
 *  Estils del tipus de contingut "situacions d'aprenentatge"
 */

.node--type-situacions-d-aprenentatge .zona-nivell{
  background-color: #feb000;
}
.node--type-situacions-d-aprenentatge .zona-nivell .contingut{
  padding: 0 0 20px 0;
}

.node--type-situacions-d-aprenentatge .zona-nivell .contingut .field__item{
  color: #000000;
  line-height: 1.4rem;
}

@media (min-width: 1200px) {
  .node--type-situacions-d-aprenentatge .zona-taronja h2{
    font-size: 1.8rem;
    font-weight: bold;
  }
  .node--type-situacions-d-aprenentatge .section-title h2{
    font-size: 2.4rem;
    font-weight: bold;
  }
  .node--type-situacions-d-aprenentatge .section-title h3 {
      font-size: 2rem;
      font-weight: normal;
  }
}

/*
 * Arxius descarregables
 */

/* Contenidor principal */
.download-buttons-list, .link-buttons-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}

/* Botó de descàrrega */
.download-btn {
  display: flex;
  align-items: center;
  gap: 16px;
  background-color: #2b56d9; /* Blau de la imatge */
  color: #ffffff !important;
  text-decoration: none !important;
  padding: 16px 24px;
  border-radius: 2px;
  width: 100%;
  box-sizing: border-box;
  transition: background-color 0.2s ease, transform 0.1s ease;
}

.download-btn:hover {
  background-color: #1e42b2; /* Blau una mica més fosc al passar el cursor */
  text-decoration: none;
}

.vermell .download-btn {
  background-color: #EF3B4F;

}

.vermell .download-btn:hover {
  background-color: #d83749;
}

.blau .download-btn {
  background-color: #2b56d9;

}

.blau .download-btn:hover {
  background-color: #264ab4;
}

.taronja .download-btn {
  background-color: #FEB000;

}

.taronja .download-btn:hover {
  background-color: #d99803;
}

/* Icona */
.download-btn__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.download-btn__icon svg {
  width: 48px;
  height: 48px;
  fill: #ffffff;
}

/* Contingut del text */
.download-btn__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
}

/* Títol */
.download-btn__title {
  font-weight: 700;
  font-size: 1.1rem;
  line-height: 1.2;
}

/* Descripció */
.download-btn__description {
  font-weight: 300;
  font-size: 0.95rem;
  opacity: 0.9;
  line-height: 1.3;
}

/*
* estils Breadcrumb
*/
/* Fons blau full-width */
.header-situacio-aprenentatge {
  background-color: #2e5be3; /* El blau de la imatge */
  color: #ffffff;
  padding-bottom: 75px;
  padding-top: 25px;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;

  /* Tècnica per sortir del contenidor pare i ocupar el 100% de la pantalla */
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  box-sizing: border-box;
  margin-bottom: 5rem;
}

.header-situacio-aprenentatge.has-edit-permission {
  padding-top: 75px;
}

.header-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
}

/* Etiqueta taronja superior */
.content-type-badge {
  background-color: #ff9900; /* Ajusta aquest taronja al teu codi de color */
  color: #ffffff;
  font-weight: bold;
  font-size: 0.9rem;
  padding: 6px 16px;
  border-radius: 2px;
  text-transform: uppercase;
  display: inline-block;
}

/* Títol */
.header-title {
  color: #ffffff;
  font-size: 2.2rem;
  font-weight: bold;
  margin: 0;
  line-height: 1.2rem;
}


/* Banner Blau Full-Width */
.cta-banner-docent {
  background-color: #3164e6; /* Blau d'alta intensitat */
  color: #ffffff;
  text-align: center;
  padding: 50px 20px 45px 20px;

  /* Rompre el contenidor per anar de cap a cap */
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  margin-top: 60px;    /* Espai respecte als pestanyes de números superior */
  margin-bottom: 60px; /* Espai respecte al títol "Guía del docent" inferior */
  box-sizing: border-box;
}

/* Títol principal del banner */
.cta-banner-docent h2 {
  color: #ffffff !important;
  font-size: 2rem;
  font-weight: 700;
  margin: 0 0 10px 0;
  line-height: 1.2rem;
}

/* Paràgraf/Subtítol */
.cta-banner-docent p {
  color: #ffffff !important;
  font-size: 1rem;
  margin: 0 0 25px 0;
  opacity: 0.95;
}

/* Botó 'Accedir' d'estil caixa blanca */
.cta-banner-docent a.btn-accedir,
.cta-banner-docent a.btn-accedir:visited {
  display: inline-block !important;
  background-color: #ffffff !important;
  color: #000000 !important;
  font-weight: 800 !important;
  font-size: 1rem !important;
  padding: 12px 38px !important;
  text-decoration: none !important;
  border-radius: 0px !important; /* Totalment rectangular com a la imatge */
  line-height: 1 !important;
  box-shadow: none !important;
  border: none !important;
  transition: opacity 0.2s ease;
}

.cta-banner-docent a.btn-accedir:hover {
  background-color: #ffffff !important;
  color: #000000 !important;
  opacity: 0.9;
  text-decoration: none !important;
}


.footer-text p{
  font-family: var(--notech-heading-font-family);
  font-size: 15px;
}


/*
* colors pels checks
*/
.color-groc .iconbox-seven__icon-inner .icon{
  color: #FFFFFF;
  background-color: #f9ca05;
}
.color-taronja .iconbox-seven__icon-inner .icon{
  color: #FFFFFF;
  background-color: #e78209;
}
.color-vermell .iconbox-seven__icon-inner .icon{
  color: #FFFFFF;
  background-color: #e52522;
}
.color-verd .iconbox-seven__icon-inner .icon{
  color: #FFFFFF;
  background-color: #14883e;
}
.color-blau .iconbox-seven__icon-inner .icon{
  color: #FFFFFF;
  background-color: #2e5be3;
}
.color-lila .iconbox-seven__icon-inner .icon{
  color: #FFFFFF;
  background-color: #7e3e85;
}
.color-negre .iconbox-seven__icon-inner .icon{
  color: #FFFFFF;
  background-color: #040404;
}

.color-groc.iconbox-seven__single:hover .iconbox-seven__icon-inner .icon{
  color: #f9ca05;
  background-color: #f7f7f9;
}
.color-taronja.iconbox-seven__single:hover .iconbox-seven__icon-inner .icon{
  color: #e78209;
  background-color: #f7f7f9;
}
.color-vermell.iconbox-seven__single:hover .iconbox-seven__icon-inner .icon{
  color: #e52522;
  background-color: #f7f7f9;
}
.color-verd.iconbox-seven__single:hover .iconbox-seven__icon-inner .icon{
  color: #14883e;
  background-color: #f7f7f9;
}
.color-blau.iconbox-seven__single:hover .iconbox-seven__icon-inner .icon{
  color: #2e5be3;
  background-color: #f7f7f9;
}
.color-lila.iconbox-seven__single:hover .iconbox-seven__icon-inner .icon{
  color: #7e3e85;
  background-color: #f7f7f9;
}
.color-negre.iconbox-seven__single:hover .iconbox-seven__icon-inner .icon{
  color: #040404;
  background-color: #f7f7f9;
}

.rs-background-video-layer:after{
  background: none !important;
}