@import url("/++theme++barceloneta/css/barceloneta.min.css");

/* ==========================================================
   Tema Grazzano Visconti
   Base: Barceloneta (importata sopra, mai modificata)
   Palette Verde / Pietra / Ottone - derivata da #016333
   ========================================================== */

:root {
  --gz-verde-50:  #F0F9F5;
  --gz-verde-100: #DEF2E8;
  --gz-verde-200: #C0E3D1;
  --gz-verde-300: #8DC4A9;
  --gz-verde-400: #3EA371;
  --gz-verde-500: #188B53;
  --gz-verde-600: #05763E;
  --gz-verde-700: #016333;
  --gz-verde-800: #024A27;
  --gz-verde-900: #01331B;

  --gz-pietra-50:  #FAF8F5;
  --gz-pietra-100: #F1EFE9;
  --gz-pietra-200: #E2DED5;
  --gz-pietra-300: #C5C0B5;
  --gz-pietra-400: #979082;
  --gz-pietra-500: #6E695E;
  --gz-pietra-700: #464239;
  --gz-pietra-900: #28251F;

  --gz-ottone-300: #DCB86A;
  --gz-ottone-500: #B58B30;
  --gz-ottone-700: #84641F;

  --gz-rosso-500: #B2242B;
  --gz-rosso-700: #8B181E;
}

/* --- 1. colore primario e testo --- */
:root {
  --bs-primary: #016333;
  --bs-primary-rgb: 1, 99, 51;
  --bs-body-color: #464239;
  --bs-link-color: #016333;
  --bs-link-hover-color: #05763E;
  --bs-link-color-rgb: 1, 99, 51;
  --bs-link-hover-color-rgb: 5, 118, 62;
  --bs-border-color: #E2DED5;
}
a { color: var(--gz-verde-700); }
a:hover, a:focus { color: var(--gz-verde-600); }

.btn-primary {
  --bs-btn-bg: #016333;
  --bs-btn-border-color: #016333;
  --bs-btn-hover-bg: #05763E;
  --bs-btn-hover-border-color: #05763E;
  --bs-btn-active-bg: #024A27;
  --bs-btn-active-border-color: #024A27;
  --bs-btn-disabled-bg: #8DC4A9;
  --bs-btn-disabled-border-color: #8DC4A9;
}
.btn-outline-primary {
  --bs-btn-color: #016333;
  --bs-btn-border-color: #016333;
  --bs-btn-hover-bg: #016333;
  --bs-btn-hover-border-color: #016333;
  --bs-btn-active-bg: #024A27;
  --bs-btn-disabled-color: #016333;
}
.pagination {
  --bs-pagination-color: #016333;
  --bs-pagination-hover-color: #05763E;
  --bs-pagination-hover-bg: #F0F9F5;
  --bs-pagination-active-bg: #016333;
  --bs-pagination-active-border-color: #016333;
}
.nav-pills { --bs-nav-pills-link-active-bg: #016333; }
.dropdown-menu { --bs-dropdown-link-active-bg: #016333; }
.form-check-input:checked { background-color: #016333; border-color: #016333; }
.form-range::-webkit-slider-thumb { background-color: #016333; }
.form-range::-moz-range-thumb { background-color: #016333; }

/* --- 2. barra di navigazione --- */
.navbar-barceloneta {
  --bs-navbar-background: var(--gz-verde-700);
  --bs-navbar-hover-background: var(--gz-verde-800);
  --bs-navbar-active-background: var(--gz-verde-900);
}
#portal-globalnav-wrapper { background-color: var(--gz-verde-700); }

/* --- 3. desktop: pannelli color pietra --- */
@media (min-width: 992px) {
  #portal-globalnav > li.inPath > a,
  #portal-globalnav > li.current > a,
  #portal-globalnav > li.active > a,
  #portal-globalnav > li.selected > a {
    background-color: var(--gz-verde-900);
    box-shadow: inset 0 -3px 0 var(--gz-ottone-300);
  }
  #portal-globalnav ul.dropdown {
    border: 1px solid var(--gz-pietra-200);
    border-top: 3px solid var(--gz-ottone-500);
    box-shadow: 0 12px 28px rgba(40, 37, 31, 0.22);
  }
  #portal-globalnav ul.dropdown li {
    background-color: var(--gz-pietra-50);
    color: var(--gz-pietra-900);
  }
  #portal-globalnav ul.dropdown li > a { color: var(--gz-pietra-900); }
  #portal-globalnav ul.dropdown li > a:hover,
  #portal-globalnav ul.dropdown li > a:focus {
    background-color: var(--gz-pietra-100);
    color: var(--gz-verde-800);
    box-shadow: inset 3px 0 0 var(--gz-ottone-500);
  }
  #portal-globalnav ul.dropdown li.current > a,
  #portal-globalnav ul.dropdown li.inPath > a,
  #portal-globalnav ul.dropdown li.active > a,
  #portal-globalnav ul.dropdown li.selected > a {
    background-color: var(--gz-pietra-50);
    color: var(--gz-rosso-700);
    box-shadow: inset 3px 0 0 var(--gz-rosso-700);
  }
  #portal-globalnav ul.dropdown li label:after {
    color: var(--gz-pietra-900);
    background: transparent;
  }
}

/* --- 4. mobile: pannello a scomparsa color pietra --- */
@media (max-width: 991.98px) {
  #offcanvasNavbar {
    --bs-offcanvas-bg: var(--gz-pietra-50);
    background-color: var(--gz-pietra-50);
  }
  #offcanvasNavbar .offcanvas-header { background-color: var(--gz-verde-700); }
  #offcanvasNavbar .navbar-nav li {
    background-color: var(--gz-pietra-50);
    color: var(--gz-pietra-900);
  }
  #offcanvasNavbar .navbar-nav li > a { color: var(--gz-pietra-900); }
  #offcanvasNavbar .navbar-nav li > a:hover,
  #offcanvasNavbar .navbar-nav li > a:focus {
    background-color: var(--gz-pietra-100);
    color: var(--gz-verde-800);
  }
  #offcanvasNavbar .navbar-nav li.current > a,
  #offcanvasNavbar .navbar-nav li.inPath > a,
  #offcanvasNavbar .navbar-nav li.active > a,
  #offcanvasNavbar .navbar-nav li.selected > a {
    background-color: var(--gz-pietra-100);
    color: var(--gz-rosso-700);
    box-shadow: inset 3px 0 0 var(--gz-rosso-700);
  }
  #offcanvasNavbar ul.dropdown { border: 0; box-shadow: none; }
  #offcanvasNavbar li label:after {
    color: var(--gz-pietra-900);
    background-color: var(--gz-pietra-100);
  }
}

/* --- 5. pie di pagina --- */
#portal-footer-wrapper {
  background-color: var(--gz-verde-900);
  color: var(--gz-verde-200);
}
#portal-footer-wrapper a { color: #fff; }
#portal-footer-wrapper a:hover { color: var(--gz-ottone-300); }

/* --- 6. tocchi di ottone --- */
.documentByLine { color: var(--gz-pietra-500); }
blockquote { border-left: 4px solid var(--gz-ottone-500); }