/**
 * Sabiana Drupal Theme - Override e adattamento
 * Questo file contiene solo gli override necessari per Drupal.
 * Il CSS principale è app.css (dal template Laravel).
 */

/* Fix navbar offset per admin toolbar Drupal */
body.toolbar-fixed {
  padding-top: 39px; /* Drupal admin toolbar */
}
body.toolbar-fixed.toolbar-tray-open {
  padding-top: 79px; /* Drupal admin toolbar expanded */
}
body.toolbar-fixed .navbar-fixed-top {
  top: 39px;
}
body.toolbar-fixed.toolbar-tray-open .navbar-fixed-top {
  top: 79px;
}

/* Drupal tabs (edit, view, etc.) */
.tabs {
  margin-bottom: 20px;
}
.tabs ul.primary {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
  border-bottom: 1px solid #ddd;
}
.tabs ul.primary li a {
  padding: 8px 16px;
  text-decoration: none;
  color: #333;
  border: 1px solid transparent;
  border-bottom: none;
  margin-bottom: -1px;
}
.tabs ul.primary li a.is-active,
.tabs ul.primary li a:hover {
  background: #fff;
  border-color: #ddd;
  border-bottom-color: #fff;
}

/* Drupal messages */
.messages {
  margin: 10px 0;
  padding: 15px;
  border-radius: 4px;
}
.messages--status {
  background: #dff0d8;
  border: 1px solid #d6e9c6;
  color: #3c763d;
}
.messages--warning {
  background: #fcf8e3;
  border: 1px solid #faebcc;
  color: #8a6d3b;
}
.messages--error {
  background: #f2dede;
  border: 1px solid #ebccd1;
  color: #a94442;
}

/* Visually hidden (Drupal a11y) */
.visually-hidden {
  position: absolute !important;
  clip: rect(1px, 1px, 1px, 1px);
  overflow: hidden;
  height: 1px;
  width: 1px;
  word-wrap: normal;
}
.visually-hidden.focusable:focus {
  position: static !important;
  clip: auto;
  overflow: visible;
  height: auto;
  width: auto;
}

/* Fix per form Drupal dentro Bootstrap 3 */
.form-item {
  margin-bottom: 15px;
}
.form-item label {
  display: block;
  font-weight: bold;
  margin-bottom: 5px;
}
.form-item .description {
  font-size: 12px;
  color: #737373;
  margin-top: 5px;
}

/* ========================== */
/* Drupal menu → Bootstrap 3 nav integration */
/* ========================== */

/* Drupal 11 generates <nav><ul><li> without .menu class.
   Target by block ID or nav[role=navigation] inside .top-menu__right */
.top-menu__right nav[role="navigation"] > ul,
.top-menu__right [id^="block-sabiana-main-menu"] > ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
}

/* Top-level menu items */
.top-menu__right nav[role="navigation"] > ul > li {
  float: left;
  position: relative;
}

.top-menu__right nav[role="navigation"] > ul > li > a {
  display: block;
  padding: 10px 12px;
  color: #FFF;
  text-decoration: none;
  font-size: 13px;
  text-transform: none !important;
  letter-spacing: 0.3px;
  transition: color 0.2s;
}

.top-menu__right nav[role="navigation"] > ul > li > a:hover,
.top-menu__right nav[role="navigation"] > ul > li > a:focus {
  color: #FFF;
  font-weight: bold;
  background: transparent;
}

/* Active trail */
.top-menu__right nav[role="navigation"] > ul > li.menu-item--active-trail > a {
  color: #FFF;
  font-weight: bold;
}

/* Dropdown submenus (nested <ul> inside <li>) */
.top-menu__right nav[role="navigation"] ul ul {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  min-width: 200px;
  padding: 5px 0;
  margin: 0;
  list-style: none;
  background-color: #fff;
  border: 1px solid rgba(0,0,0,.15);
  border-radius: 4px;
  box-shadow: 0 6px 12px rgba(0,0,0,.175);
}

.top-menu__right nav[role="navigation"] > ul > li:hover > ul {
  display: block;
}

.top-menu__right nav[role="navigation"] ul ul > li > a {
  display: block;
  padding: 5px 20px;
  color: #404041;
  text-decoration: none;
  font-size: 13px;
  font-weight: normal;
  text-transform: none !important;
  white-space: nowrap;
}

.top-menu__right nav[role="navigation"] ul ul > li > a:hover,
.top-menu__right nav[role="navigation"] ul ul > li > a:focus {
  color: #3565B4;
  background: none;
}

/* Mobile: vertical menu */
@media (max-width: 767px) {
  .top-menu__right nav[role="navigation"] > ul {
    flex-direction: column;
  }
  .top-menu__right nav[role="navigation"] > ul > li {
    float: none;
  }
  .top-menu__right nav[role="navigation"] ul ul {
    position: static;
    border: none;
    box-shadow: none;
    padding-left: 15px;
    display: block;
    background: rgba(0,0,0,.1);
  }
  .top-menu__right nav[role="navigation"] ul ul > li > a {
    color: #fff;
  }
}

/* Hide Drupal block titles in nav regions (visually-hidden covers it, but be safe) */
.top-menu__right h2.visually-hidden,
.top-menu__right nav > h2,
.top-bar .block > h2,
.top-bar h2.visually-hidden {
  display: none;
}

/* Fix top-bar Drupal blocks */
.top-bar .block-search {
  display: inline-block;
}
.top-bar .block-search .form-item {
  margin: 0;
}
.top-bar .block-search input[type="search"],
.top-bar .block-search input[type="text"] {
  height: 30px;
  font-size: 12px;
  padding: 2px 8px;
  border-radius: 3px;
  border: 1px solid #ccc;
}
.top-bar .block-search .form-actions {
  display: none;
}

/* Language switcher in top-bar */
.top-bar .block-language ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  gap: 5px;
}
.top-bar .block-language ul li a {
  color: #fff;
  text-decoration: none;
  padding: 2px 5px;
  font-size: 12px;
  text-transform: uppercase;
}
.top-bar .block-language ul li.is-active a {
  font-weight: bold;
}

/* Hide page title block on front page */
.path-frontpage .block-page-title-block {
  display: none;
}

/* Node content pages - proper spacing */
.node--type-page .node__content {
  padding: 20px 0;
}

/* Views: fix unformatted list rendering */
.view-content .views-row {
  margin-bottom: 20px;
}

/* Webform inside Bootstrap theme */
.webform-submission-form .form-item input[type="text"],
.webform-submission-form .form-item input[type="email"],
.webform-submission-form .form-item textarea,
.webform-submission-form .form-item select {
  width: 100%;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  height: auto;
}
.webform-submission-form .form-actions input[type="submit"] {
  background: #3565B4;
  color: #fff;
  border: none;
  padding: 8px 20px;
  border-radius: 4px;
  cursor: pointer;
  text-transform: uppercase;
  max-width: 200px;
}
.webform-submission-form .form-actions input[type="submit"]:hover {
  background: #2a4f8f;
}

/* Drupal pager inside Bootstrap grid */
.pager {
  text-align: center;
}
.pager__items {
  display: inline-flex;
  list-style: none;
  padding: 0;
  gap: 5px;
}
.pager__item a {
  padding: 6px 12px;
  border: 1px solid #ddd;
  border-radius: 4px;
  text-decoration: none;
  color: #333;
}
.pager__item.is-active a,
.pager__item--active a,
.pager__item a:hover {
  background: #00457c;
  color: #fff;
  border-color: #00457c;
}

/* ========================== */
/* Carousel fixes */
/* ========================== */
#carousel-home {
  position: relative;
  overflow: hidden;
}
#carousel-home .carousel-inner {
  position: relative;
  width: 100%;
  overflow: hidden;
}
#carousel-home .carousel-inner > .item {
  display: none;
  position: relative;
  -webkit-transition: 0.6s ease-in-out left;
  transition: 0.6s ease-in-out left;
}
#carousel-home .carousel-inner > .item.active {
  display: block;
}
#carousel-home .carousel-inner > .item > img {
  width: 100%;
  height: auto;
  display: block;
}
#carousel-home .carousel-caption {
  position: absolute;
  bottom: 20%;
  left: 15%;
  right: 15%;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0,0,0,.6);
}
#carousel-home .carousel-caption h3 {
  color: #fff;
  font-size: 36px;
  margin-bottom: 10px;
}
#carousel-home .carousel-caption p {
  color: #fff;
  font-size: 18px;
}
#carousel-home .carousel-caption .read-more a {
  color: #fff;
  text-decoration: none;
}

/* ========================== */
/* Homepage category tiles */
/* ========================== */
.home-category-list .category-tile {
  display: block;
  text-align: center;
  padding: 20px 10px;
  margin-bottom: 15px;
  color: #fff;
  text-decoration: none;
  min-height: 120px;
  transition: opacity 0.2s;
}
.home-category-list .category-tile:hover {
  opacity: 0.85;
  text-decoration: none;
  color: #fff;
}
.home-category-list .category-tile span {
  display: block;
  margin-bottom: 10px;
}
.home-category-list .category-tile h4 {
  color: #fff;
  font-size: 13px;
  text-transform: none !important;
  letter-spacing: 0.5px;
  margin: 0;
}

/* ========================== */
/* Homepage tweaks */
/* ========================== */

/* Product Categories section heading */
.products-categories {
  padding: 30px 0 10px;
}
.products-categories h1 {
  font-size: 24px;
  text-transform: none !important;
  letter-spacing: 2px;
  color: #f7f7f7 !important;
}
.products-categories .glyphicon {
  display: block;
  text-align: center;
  margin-top: 10px;
  color: #f7f7f7 !important;
}

/* Indoor Air Quality jumbotron */
.indoor-air-quality {
  background: #f5f5f5;
  padding: 40px 0;
  margin: 30px 0;
}
.indoor-air-quality h3 {
  text-transform: none !important;
  letter-spacing: 2px;
  color: #404041;
}

/* News & Events */
.box_news {
  padding: 30px 0 10px;
}
.box_news h2 {
  text-transform: none !important;
  letter-spacing: 2px;
  color: #404041;
}

/* Partners */
.partners {
  padding: 30px 30px;
  background: #f9f9f9;
}
.partners h2 {
  text-transform: none !important;
  letter-spacing: 2px;
  color: #404041;
}

/* Downloads section */
.downloads {
  margin: 30px 0;
}
.downloads .dark {
  color: #fff;
  padding: 20px;
}
.downloads .dark h3 {
  color: #fff;
}
.downloads .dark p {
  color: rgba(255,255,255,.8);
}

/* Newsletter section */
.forms {
  padding: 20px 0;
  background: #f5f5f5;
}

/* Top bar content fix */
.top-bar {
  min-height: 30px;
}
.top-bar .navbar-right {
  margin-right: 0;
}

/* Fix Views output wrapper divs */
.home-category-list .views-element-container,
.home-category-list [class^="js-view-dom-id"] {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}
.home-category-list .views-row {
  display: contents; /* Remove wrapper div from layout flow */
}

/* Fix Views row wrappers for news/events */
.view-latest-news .views-row,
.view-upcoming-events .views-row {
  display: contents;
}
.view-latest-news .view-content,
.view-upcoming-events .view-content {
  display: flex;
  flex-wrap: wrap;
}

/* Override app.css IAQ background path (was /img/..., now in theme) */
.jumbotron.indoor-air-quality {
  background: url('/themes/custom/sabiana/images/indoor-air-quality/indoor-air-quality_bg.jpg') bottom center no-repeat !important;
  background-size: cover !important;
}

/* Carousel: ensure images are visible */
#carousel-home .carousel-inner > .item > img {
  width: 100%;
  height: auto;
  display: block !important;
}

/* ========================== */
/* Login dropdown in top bar */
/* ========================== */
.top-bar .dropdown-menu .form.login {
  padding: 15px;
  min-width: 250px;
}
.top-bar .dropdown-menu .form.login .form-control {
  margin-bottom: 8px;
}
.top-bar .dropdown-menu .form.login .help-block {
  font-size: 12px;
  margin-top: 3px;
}
.top-bar .dropdown-menu .form.login .btn {
  margin-bottom: 5px;
}
.top-bar .dropdown-menu .form.login .btn.sign {
  background: transparent;
  border: 1px solid #3565B4;
  color: #3565B4;
}
.top-bar .dropdown-menu .form.login .btn.sign:hover {
  background: #3565B4;
  color: #fff;
}

/* Language switcher dropdown */
.top-bar .dropdown-menu li a img {
  width: 16px;
  height: 11px;
  margin-right: 5px;
  vertical-align: middle;
}

/* Bootstrap 3 dropdown fallback (jQuery 4 compatible) */
.dropdown.open > .dropdown-menu {
  display: block !important;
}

/* Collapse fallback */
.collapse:not(.in) {
  display: none;
}
.collapse.in {
  display: block !important;
}
@media (min-width: 768px) {
  .navbar-collapse.collapse {
    display: block !important;
  }
}

/* Search form inline */
.top-bar .navbar-form.search {
  padding: 0;
  margin: 0;
  border: none;
  box-shadow: none;
}
.top-bar .navbar-form.search .form-control {
  height: 30px;
  font-size: 12px;
  padding: 2px 8px;
  border-radius: 3px;
  border: 1px solid #ccc;
  width: 150px;
}

/* ========================== */
/* TypeKit font fallback & overrides */
/* ========================== */

/* When TypeKit loads successfully (wf-active), fonts apply via app.css.
   When it fails (wf-inactive or no class), provide close visual match. */
html.wf-inactive body,
html:not(.wf-active) body {
  font-family: "Myriad Pro", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* Ensure body text color matches original */
body {
  color: #636b6f;
  background-color: #fff;
}

/* Fix body background - original uses white, not #f5f8fa */
body.path-frontpage {
  background-color: #fff;
}

/* ========================== */
/* Internal pages styling */
/* ========================== */

/* Page content container */
.node--type-page .node__content,
.node--type-news .node__content,
.node--type-event .node__content,
.node--type-product .node__content {
  padding: 30px 15px;
  max-width: 1200px;
  margin: 0 auto;
}

/* Page title */
.page-title {
  font-family: "myriad-pro-semi-condensed", sans-serif;
  font-weight: 600;
  font-size: 28px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #404041;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 2px solid #3565B4;
}

/* Company pages */
.company-page h3,
.history-page h3,
.sustainability-page h3 {
  font-family: "myriad-pro-semi-condensed", sans-serif;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #3565B4;
  font-size: 20px;
  margin-top: 30px;
}

/* Timeline */
.timeline .timeline-entry {
  padding: 15px 0;
  border-bottom: 1px solid #eee;
}
.timeline .year {
  font-family: "myriad-pro-semi-condensed", sans-serif;
  font-size: 36px;
  font-weight: 700;
  color: #3565B4;
}

/* Sustainability pillars */
.sustainability-page .pillars {
  margin-top: 20px;
}
.sustainability-page .pillars h3 i {
  margin-right: 8px;
  color: #3565B4;
}

/* Partner pages */
.partner-page h2 {
  color: #3565B4;
}
.partner-page .lead {
  font-size: 18px;
  color: #636b6f;
}

/* Academy events */
.academy-page .academy-event {
  padding: 15px 0;
  border-bottom: 1px solid #eee;
}
.academy-page .academy-event .date {
  display: inline-block;
  background: #3565B4;
  color: #fff;
  padding: 3px 10px;
  font-size: 12px;
  border-radius: 3px;
  margin-bottom: 5px;
}

/* Certifications list */
.certifications-list li {
  padding: 8px 0;
  border-bottom: 1px solid #eee;
}
.certifications-list li i {
  color: #3565B4;
  margin-right: 10px;
}

/* Footer icon spacing fix */
.footer-icon-fa6 {
  margin: 0 3px;
}

/* Products listing page */
.view-products .views-row {
  margin-bottom: 15px;
  padding-bottom: 15px;
  border-bottom: 1px solid #eee;
}

/* News listing */
.view-news .views-row,
.view-events .views-row {
  margin-bottom: 20px;
}

/* Downloads listing */
.view-downloads .views-row {
  padding: 10px 0;
  border-bottom: 1px solid #eee;
}

/* Fix Drupal block title visibility */
.region-content h2.block-title {
  font-family: "myriad-pro-semi-condensed", sans-serif;
  font-size: 24px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #404041;
  margin-bottom: 20px;
}

/* ==============================================
 * FIX A1: Menu bar - azure background + spacing
 * Append to sabiana-drupal.css
 * ============================================== */

/* Fix navbar-default Bootstrap override: remove grey background and border */
.navbar.navbar-default {
  background-color: transparent;
  border-color: transparent;
  border: none;
  margin-bottom: 0;
  box-shadow: none;
}

/* Ensure .top-menu azure background fills properly */
.top-menu {
  background-color: #6CA2F3 !important;
}

/* Fix menu item spacing to match live site:
   Live uses .nav > li > a padding: 14px 15px (Bootstrap navbar-nav at >=768px)
   plus font-size: 16px from .top-menu in style-2025.css.
   Drupal generates nav[role=navigation] > ul > li without .nav class. */
.top-menu__right nav[role="navigation"] > ul > li > a {
  padding: 14px 15px;
  font-size: 14px;
  line-height: 22px;
  text-transform: none !important;
  letter-spacing: 0.5px;
}

/* Vertically center the menu with the logo (logo area has padding: 25px 0) */
@media (min-width: 768px) {
  /* BUG #2 FIX: Logo and menu on same row, items aligned to bottom-left */
  .top-menu {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-end;
    min-height: 132px;
  }
  .top-menu > .navbar-header {
    flex: 0 0 auto;
    float: none;
    align-self: center;
    padding: 15px 15px;
  }
  .top-menu > .collapse.navbar-collapse.top-menu__right {
    display: flex !important;
    flex: 1 1 auto;
    float: none;
    align-items: flex-end;
    align-self: stretch;
  }
  .top-menu__right nav[role="navigation"],
  .top-menu__right [id^="block-sabiana-main-menu"] {
    display: flex;
    align-items: flex-end;
    width: 100%;
  }
  .top-menu__right nav[role="navigation"] > ul {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
    width: 100%;
  }
  .top-menu__right nav[role="navigation"] > ul > li > a {
    padding: 14px 15px;
    font-size: 13px;
    line-height: 22px;
  }
}

/* Dropdown submenu links keep original size */
.top-menu__right nav[role="navigation"] ul ul > li > a {
  font-size: 13px;
  text-transform: none !important;
  letter-spacing: normal;
}

/* ==============================================
 * FIX A6: News images - work with app.css .panel img rules
 * ============================================== */

/* app.css already has: .panel img { width: 44%; float: left; } at >=480px
   We just need to ensure small images stretch to fill and display properly */
.panel-news .panel-header {
  overflow: hidden;
}

.panel-news .panel-header a {
  display: block;
}

/* Make images fill the available space even when source is small */
.panel-news .panel-header img,
.panel-news img {
  min-height: 180px;
  object-fit: cover;
}

/* Date badge overlay on top of image */
.panel-news .panel-heading {
  position: absolute;
  z-index: 2;
}

.panel-news {
  position: relative;
}
/* ============================================
   NEWSLETTER FORM - Horizontal Layout
   ============================================ */
.webform-submission-newsletter-form {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px;
}
.webform-submission-newsletter-form > .form-item-first-name,
.webform-submission-newsletter-form > .form-item-last-name,
.webform-submission-newsletter-form > .form-item-email {
  flex: 1;
  min-width: 150px;
}
.webform-submission-newsletter-form > .form-item label {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-family: "myriad-pro-semi-condensed", sans-serif;
  color: #fff;
}
.webform-submission-newsletter-form .form-text,
.webform-submission-newsletter-form .form-email {
  width: 100%;
  height: 38px;
  border: 1px solid rgba(255,255,255,0.3);
  border-radius: 3px;
  background: rgba(255,255,255,0.15);
  color: #fff;
  padding: 6px 12px;
}
.webform-submission-newsletter-form .form-text::placeholder,
.webform-submission-newsletter-form .form-email::placeholder {
  color: #999 !important;
}
.webform-submission-newsletter-form > .form-item-privacy {
  flex-basis: 100%;
  margin-top: 5px;
}
.webform-submission-newsletter-form > .form-item-privacy label {
  color: rgba(255,255,255,0.8);
  font-size: 12px;
}
.webform-submission-newsletter-form > .form-actions {
  flex-basis: auto;
}
.webform-submission-newsletter-form .webform-button--submit {
  background: #6CA2F3;
  border: none;
  color: #fff;
  padding: 8px 30px;
  text-transform: uppercase;
  font-family: "myriad-pro-semi-condensed", sans-serif;
  font-weight: 600;
  letter-spacing: 1px;
  border-radius: 3px;
  height: 38px;
}
@media (max-width: 767px) {
  .webform-submission-newsletter-form > .form-item-first-name,
  .webform-submission-newsletter-form > .form-item-last-name,
  .webform-submission-newsletter-form > .form-item-email {
    flex-basis: 100%;
  }
}

/* Hide breadcrumb on Storia, Dove Siamo, Certificazioni */
.path-node-45 .breadcrumb,
.path-node-45 .block-system-breadcrumb-block,
.path-node-48 .breadcrumb,
.path-node-48 .block-system-breadcrumb-block,
.path-node-46 .breadcrumb,
.path-node-46 .block-system-breadcrumb-block {
  display: none;
}


/* Hide breadcrumb on Sostenibilita, Accademia, Whistleblowing, Accessibilita */
.path-node-47 .breadcrumb,
.path-node-47 .block-system-breadcrumb-block,
.path-node-54 .breadcrumb,
.path-node-54 .block-system-breadcrumb-block,
.path-node-62 .breadcrumb,
.path-node-62 .block-system-breadcrumb-block,
.path-node-57 .breadcrumb,
.path-node-57 .block-system-breadcrumb-block {
  display: none;
}


/* Hide breadcrumb globally on views pages and contact form */
.view-references-map .breadcrumb,
.view-sales-support .breadcrumb,
.view-news .breadcrumb,
.view-events .breadcrumb,
.path-form .breadcrumb,
.path-form .block-system-breadcrumb-block,
.view-references-map .block-system-breadcrumb-block,
.view-sales-support .block-system-breadcrumb-block,
.view-news .block-system-breadcrumb-block,
.view-events .block-system-breadcrumb-block {
  display: none;
}


/* Fix ALL CAPS: override app.css navbar-right and top-bar uppercase */
.top-menu .navbar-right {
  text-transform: none !important;
}
.top-menu .navbar-right > li > a {
  text-transform: none !important;
}
/* Fix page title, block titles, section titles - remove uppercase */
.page-title {
  text-transform: none !important;
}
.region-content h2.block-title {
  text-transform: none !important;
}
/* Fix news section title */
.loop_news h2,
.loop_news h1 {
  text-transform: none !important;
}
/* Fix partner section */
.partners h2 {
  text-transform: none !important;
}