/* ==========================================================================
   BEWA Components — Mobilekit reskin + shell iOS
   ========================================================================== */

/* ---- Header glass iOS ---- */
.appHeader,
.appHeader.bg-primary,
.appHeader.bg-primary.scrolled,
.appHeader.scrolled.bg-primary,
.appHeader.scrolled.bg-primary.is-active,
.appHeader.scrolled.is-active {
  background: var(--bewa-glass) !important;
  backdrop-filter: saturate(1.8) blur(20px);
  -webkit-backdrop-filter: saturate(1.8) blur(20px);
  border: 0 !important;
  border-bottom: 0.5px solid var(--bewa-line) !important;
  box-shadow: none !important;
  z-index: 1200 !important;
  isolation: isolate;
  transition: background var(--bewa-dur) var(--bewa-ease-ios),
              border-color var(--bewa-dur) var(--bewa-ease-ios),
              box-shadow var(--bewa-dur) var(--bewa-ease-ios);
}

.appHeader.is-scrolled,
.appHeader.scrolled.is-active {
  background: var(--bewa-glass-strong) !important;
  box-shadow: 0 1px 0 var(--bewa-line), 0 8px 24px rgba(20, 21, 21, 0.04) !important;
}

.extraHeader {
  z-index: 1190 !important;
  background: var(--bewa-glass) !important;
  backdrop-filter: saturate(1.8) blur(20px);
  -webkit-backdrop-filter: saturate(1.8) blur(20px);
  border-bottom: 0.5px solid var(--bewa-line) !important;
}

/* Sticky sotto header: mai sopra .appHeader */
.bewa-place-tabs,
.bewa-ts-dates,
.fixed-calendar-bar,
.bewa-sticky-under-header,
.listview-title.sticky-title,
#appCapsule .sticky-top {
  z-index: 20 !important;
}

html.is-webview .bewa-sticky-under-header {
  top: 56px !important;
}

.listview-title.sticky-title {
  top: calc(56px + env(safe-area-inset-top, 0px)) !important;
  z-index: 20 !important;
}

html.is-webview .listview-title.sticky-title {
  top: 56px !important;
}

/* WebView Capacitor: il padding nativo della status bar e' gia' applicato
   dall'Activity, quindi l'header non deve sommare env(safe-area-inset-top). */
html.is-webview .appHeader {
  height: 56px !important;
  min-height: 56px !important;
  padding-top: 0 !important;
}

/* Anche gli interni della header (style.css 137/147/155 usano top: env())
   scendevano dentro l'header a 56px: in WebView il padding nativo e'
   gia' applicato dall'Activity, quindi top = 0. */
html.is-webview .appHeader .left,
html.is-webview .appHeader .right,
html.is-webview .appHeader .pageTitle {
  top: 0 !important;
}

/* WebView: anche la sidebar (#sidebarPanel) ha padding-top/bottom env()
   in style.css (851/855) e .modal-content (861); il padding nativo della
   status bar e' gia' applicato dall'Activity, quindi qui va azzerato
   per non aggiungere spazio sopra il menu del drawer. */
html.is-webview #sidebarPanel {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
html.is-webview #sidebarPanel .modal-content {
  padding-top: 0 !important;
}

/* WebView: il profileBox nella sidebar ha margin-top: env() e :before
   con height: env() (style.css 708-733) → crea la barra blu scuro e
   sposta il profilo giù. Il padding nativo della status bar e' gia'
   applicato dall'Activity, quindi qui azzeriamo entrambi. */
html.is-webview #sidebarPanel .profileBox {
  position: relative !important;
  top: auto !important;
  margin-top: 0 !important;
  z-index: auto !important;
}
html.is-webview #sidebarPanel .profileBox:before {
  height: 0 !important;
  display: none !important;
}

/* WebView: il margin-top: 74px su .offcanvas-body (pages.css 2716)
   crea troppo spazio sopra il menu nella sidebar. Lo riduciamo a 0. */
html.is-webview #sidebarPanel .offcanvas-body {
  margin-top: 0 !important;
}

/* WebView: anche il padding iniziale di #appCapsule (prima dell'offset JS,
   header.php applyGlobalHeaderOffset) usa calc(... + env(safe-area-inset-top))
   -> i pill Tutto/Uomo/Donna partono un po' piu' giu' al primo paint.
   Questo override azzera il valore iniziale; le regole per-pagina piu'
   specifiche (108/102/112) restano piu' specifiche e continuano a vincere,
   e l'inline style (!important) del JS prevale su tutte. */
html.is-webview #appCapsule {
  padding-top: 56px !important;
}

.appHeader .pageTitle {
  font-family: var(--bewa-display);
  font-weight: 700;
  font-size: var(--bewa-fs-headline);
  letter-spacing: -0.02em;
  color: var(--bewa-ink) !important;
  -webkit-text-fill-color: var(--bewa-ink);
}

.appHeader.home-header {
  background: transparent !important;
  border-bottom-color: transparent !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.appHeader.home-header .pageTitle {
  font-size: var(--bewa-fs-title-3);
  color: var(--bewa-brand) !important;
  -webkit-text-fill-color: var(--bewa-brand);
}

.appHeader.home-header.is-scrolled {
  background: var(--bewa-glass-strong) !important;
  border-bottom: 0.5px solid var(--bewa-line) !important;
  backdrop-filter: saturate(1.8) blur(20px);
  -webkit-backdrop-filter: saturate(1.8) blur(20px);
  box-shadow: 0 8px 24px rgba(20, 21, 21, 0.04) !important;
}

.appHeader.home-header.is-scrolled .pageTitle {
  color: var(--bewa-ink) !important;
  -webkit-text-fill-color: var(--bewa-ink);
}

.appHeader .headerButton,
.appHeader.bg-primary .headerButton,
.appHeader.bg-primary .left .headerButton,
.appHeader.bg-primary .right .headerButton {
  min-width: var(--bewa-tap);
  min-height: var(--bewa-tap);
  border-radius: var(--bewa-radius-pill);
  color: var(--bewa-ink) !important;
  -webkit-text-fill-color: var(--bewa-ink);
  background: none !important;
  transition: background var(--bewa-dur-fast) var(--bewa-ease-ios),
              transform var(--bewa-dur-fast) var(--bewa-ease-ios);
}

.appHeader .headerButton i,
.appHeader.bg-primary .headerButton i,
.appHeader.bg-primary .left i,
.appHeader.bg-primary .right i,
.appHeader.scrolled.bg-primary .headerButton,
.appHeader.scrolled.bg-primary .pageTitle {
  color: var(--bewa-ink) !important;
  -webkit-text-fill-color: var(--bewa-ink);
  background: none !important;
}

.appHeader.home-header .headerButton,
.appHeader.home-header .headerButton i {
  color: var(--bewa-ink) !important;
  -webkit-text-fill-color: var(--bewa-ink);
}

.appHeader.home-header.is-scrolled .headerButton,
.appHeader.home-header.is-scrolled .headerButton i {
  color: var(--bewa-brand) !important;
  -webkit-text-fill-color: var(--bewa-brand);
}

.appHeader .headerButton:active {
  background: var(--bewa-brand-soft) !important;
  transform: scale(0.94);
}

/* ---- Bewa alert/confirm dialog (sostituisce alert() di sistema) ---- */
#bewaAlertModal .bewa-alert-icon {
  display: block;
  text-align: center;
  font-size: 44px;
  line-height: 1;
  margin: 4px 0 6px;
}
#bewaAlertModal .bewa-alert-icon.is-success { color: var(--bewa-success); }
#bewaAlertModal .bewa-alert-icon.is-error { color: var(--bewa-danger); }
#bewaAlertModal .bewa-alert-icon.is-info { color: var(--bewa-brand); }
#bewaAlertModal .bewa-alert-title {
  text-align: center;
  font-weight: 700;
  margin: 0 0 4px;
}
#bewaAlertModal .bewa-alert-msg {
  text-align: center;
  margin: 0;
}

/* Evita linea grigia del listview subito sotto l'header */
#appCapsule > .section.full.bg-white:first-child > .listview,
#appCapsule > .section.full.bg-white:first-child > ul.listview,
#appCapsule .bewa-ts-listview {
  border-top: 0 !important;
  box-shadow: none !important;
}

#appCapsule > .section.full.bg-white:first-child {
  border-top: 0 !important;
  box-shadow: none !important;
}

/* ---- Capsule / content ---- */
#appCapsule {
  background: var(--bewa-bg);
  min-height: 100vh;
  padding-bottom: calc(var(--bewa-bottom-h) + 8px);
}

#appCapsule .section + .section {
  margin-top: 8px;
}

.header-large-title .title {
  font-family: var(--bewa-display);
  font-size: var(--bewa-fs-large-title);
  font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--bewa-ink);
  line-height: 1.15;
}

.header-large-title .subtitle {
  font-size: var(--bewa-fs-subhead);
  color: var(--bewa-ink-muted);
  font-weight: 400;
}

/* ---- Bottom nav — floating glass pill ---- */
.appBottomMenu.bewa-bottom-nav,
.appBottomMenu {
  left: 12px !important;
  right: 12px !important;
  bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important;
  width: auto !important;
  height: var(--bewa-tab-h) !important;
  min-height: var(--bewa-tab-h) !important;
  padding: 6px 8px !important;
  margin: 0 !important;
  border: 0.5px solid rgba(255, 255, 255, 0.55) !important;
  border-radius: var(--bewa-radius-xl) !important;
  background: var(--bewa-glass-strong) !important;
  backdrop-filter: saturate(1.8) blur(24px);
  -webkit-backdrop-filter: saturate(1.8) blur(24px);
  box-shadow: 0 12px 40px rgba(20, 21, 21, 0.14),
              0 2px 8px rgba(20, 21, 21, 0.06) !important;
  display: flex !important;
  align-items: center;
  justify-content: space-around;
  gap: 2px;
  z-index: 1100 !important;
}

.appBottomMenu.bewa-bottom-nav .item,
.appBottomMenu .item {
  position: relative;
  flex: 1 1 0;
  min-height: 52px;
  height: 52px;
  margin: 0;
  padding: 0;
  border-radius: 22px;
  color: var(--bewa-ink);
  transition: background var(--bewa-dur) var(--bewa-ease-ios),
              transform var(--bewa-dur-fast) var(--bewa-ease-ios);
}

.appBottomMenu.bewa-bottom-nav .item .col,
.appBottomMenu .item .col {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  position: relative;
  height: 100%;
}

.appBottomMenu.bewa-bottom-nav .item strong,
.appBottomMenu .item strong {
  display: none !important;
}

.appBottomMenu.bewa-bottom-nav .item i,
.appBottomMenu.bewa-bottom-nav .item i.bi,
.appBottomMenu .item i,
.appBottomMenu .item i.bi {
  font-size: 1.35rem;
  color: var(--bewa-ink) !important;
  transition: transform var(--bewa-dur-fast) var(--bewa-ease-ios),
              color var(--bewa-dur) var(--bewa-ease-ios);
}

.appBottomMenu.bewa-bottom-nav .item .footer-logo-icon,
.appBottomMenu .item .footer-logo-icon {
  width: 24px;
  height: 24px;
  margin: 0;
  background-color: var(--bewa-ink) !important;
  background-image: none !important;
  transition: transform var(--bewa-dur-fast) var(--bewa-ease-ios),
              background-color var(--bewa-dur) var(--bewa-ease-ios);
}

.appBottomMenu.bewa-bottom-nav .item:active,
.appBottomMenu .item:active {
  transform: scale(0.94);
}

.appBottomMenu.bewa-bottom-nav .item.active,
.appBottomMenu .item.active {
  background: var(--bewa-brand-soft);
  color: var(--bewa-brand);
}

.appBottomMenu.bewa-bottom-nav .item.active i,
.appBottomMenu.bewa-bottom-nav .item.active i.bi,
.appBottomMenu .item.active i,
.appBottomMenu .item.active i.bi {
  color: var(--bewa-brand) !important;
}

.appBottomMenu.bewa-bottom-nav .item.active .footer-logo-icon,
.appBottomMenu .item.active .footer-logo-icon {
  background-color: var(--bewa-brand) !important;
  background-image: none !important;
}

.appBottomMenu.bewa-bottom-nav .item:hover i,
.appBottomMenu .item:hover i,
.appBottomMenu.bewa-bottom-nav .item:hover i.bi,
.appBottomMenu .item:hover i.bi {
  color: var(--bewa-ink) !important;
}

.appBottomMenu.bewa-bottom-nav .item.active:hover i,
.appBottomMenu .item.active:hover i,
.appBottomMenu.bewa-bottom-nav .item.active:hover i.bi,
.appBottomMenu .item.active:hover i.bi {
  color: var(--bewa-brand) !important;
}

.appBottomMenu.bewa-bottom-nav .item:hover .footer-logo-icon,
.appBottomMenu .item:hover .footer-logo-icon {
  background-color: var(--bewa-ink) !important;
}

.appBottomMenu.bewa-bottom-nav .item.active:hover .footer-logo-icon,
.appBottomMenu .item.active:hover .footer-logo-icon {
  background-color: var(--bewa-brand) !important;
}

.appBottomMenu .item .badge,
.appBottomMenu .item .badge.badge-danger {
  top: 4px;
  right: calc(50% - 16px);
  font-size: 0.65rem;
  min-width: 16px;
  height: 16px;
  line-height: 16px;
  border-radius: var(--bewa-radius-pill);
  background: var(--bewa-danger) !important;
  border: 2px solid #fff;
}

.appBottomMenu.bg-primary {
  background: var(--bewa-glass-strong) !important;
  border-top-color: transparent;
}

/* Indicatore tab attivo (animato da bewa-motion.js) */
.bewa-tab-indicator {
  position: absolute;
  top: 6px;
  bottom: 6px;
  width: 0;
  left: 0;
  border-radius: 20px;
  background: var(--bewa-brand-soft);
  pointer-events: none;
  transition: transform var(--bewa-dur) var(--bewa-ease-ios),
              width var(--bewa-dur) var(--bewa-ease-ios);
  z-index: 0;
}

.appBottomMenu .item {
  z-index: 1;
}

/* ---- Global bg-primary surfaces ---- */
.bg-primary,
a.bg-primary,
.badge-primary,
a.badge-primary,
.chip.bg-primary,
.chip.chip-primary,
.icon-box.bg-primary,
.image-listview > li .item .icon-box.bg-primary,
.card.bg-primary,
.listview .item .icon-box.bg-primary,
.progress-bar.bg-primary,
.form-check-input:checked,
.custom-control-input:checked ~ .custom-control-label::before,
.page-item.active .page-link,
.nav-pills .nav-link.active {
  background: hsla(202, 60%, 35%, 1) !important;
  background: -webkit-linear-gradient(90deg, hsla(202, 60%, 35%, 1) 0%, hsla(202, 85%, 18%, 1) 100%) !important;
  background: -moz-linear-gradient(90deg, hsla(202, 60%, 35%, 1) 0%, hsla(202, 85%, 18%, 1) 100%) !important;
  background: var(--bewa-brand-gradient) !important;
  border-color: transparent !important;
  color: #fff !important;
}

a.bg-primary:hover,
a.bg-primary:active {
  background: var(--bewa-brand-gradient-hover) !important;
  color: #fff !important;
}

/* ---- Text / link primary ---- */
.text-primary,
a.text-primary,
.btn-text-primary,
.action-button-list > li .btn.text-primary {
  color: var(--bewa-brand) !important;
}

a.text-primary:hover,
.btn-text-primary:hover {
  color: var(--bewa-brand-deep) !important;
}

/* ---- Borders primary / accenti ---- */
.border-primary,
.border.border-primary {
  border-color: var(--bewa-brand) !important;
}

.btn-outline-primary {
  border-radius: 999px !important;
  border-width: 1.5px !important;
  border-color: var(--bewa-brand) !important;
  color: var(--bewa-brand) !important;
  font-weight: 600;
  background: transparent !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active,
.btn-outline-primary.active {
  background: var(--bewa-brand-gradient) !important;
  border-color: transparent !important;
  color: #fff !important;
}

/* ---- Buttons ---- */
.btn-primary,
.btn.bg-primary,
.btn-primary.btn-lg,
a.btn-primary,
button.btn-primary,
input.btn-primary,
.btn.btn-primary.shadowed,
.btn.bg-primary.shadowed {
  background: hsla(202, 60%, 35%, 1) !important;
  background: -webkit-linear-gradient(90deg, hsla(202, 60%, 35%, 1) 0%, hsla(202, 85%, 18%, 1) 100%) !important;
  background: -moz-linear-gradient(90deg, hsla(202, 60%, 35%, 1) 0%, hsla(202, 85%, 18%, 1) 100%) !important;
  background: var(--bewa-brand-gradient) !important;
  border-color: transparent !important;
  border-radius: 999px !important;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(7, 58, 87, 0.32);
  transition: transform 0.12s ease, box-shadow 0.15s ease, filter 0.15s ease;
}

.btn-primary:hover,
.btn.bg-primary:hover,
.btn-primary:focus,
.btn.bg-primary:focus,
.btn-primary:active,
.btn.bg-primary:active,
.btn-primary.active,
.btn.bg-primary.active {
  background: var(--bewa-brand-gradient-hover) !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 8px 20px rgba(7, 58, 87, 0.38);
}

.btn-primary:active,
.btn.bg-primary:active {
  transform: scale(0.98);
  filter: brightness(0.96);
}

/* ---- Cards / lists ---- */
.card,
.place-card,
.listview .item,
.image-listview > li {
  border-radius: var(--bewa-radius) !important;
}

.card {
  border: 1px solid var(--bewa-line);
  box-shadow: none;
  background: var(--bewa-surface);
  overflow: hidden;
}

.card:active {
  transform: scale(0.985);
}

.card.bg-primary .card-title,
.card.bg-primary .card-text,
.card.bg-primary .card-header {
  color: #fff !important;
}

/* ---- Section headings ---- */
.section .section-title,
#appCapsule h1,
#appCapsule > .section > h1 {
  font-weight: 700;
  color: var(--bewa-ink);
}

#appCapsule h4,
.section h4 {
  color: var(--bewa-ink-muted);
  font-weight: 500;
}

/* ---- Form controls (iOS fields) ---- */
.form-group.basic {
  padding: 4px 0 10px;
}

.form-group.basic .form-label,
.form-label {
  font-size: var(--bewa-fs-footnote);
  font-weight: 600;
  color: var(--bewa-ink-muted);
  margin-bottom: 6px;
  letter-spacing: 0.01em;
}

.form-control,
.form-group.basic .form-control,
.form-group.basic textarea.form-control {
  border-radius: var(--bewa-radius-sm) !important;
  background: var(--bewa-surface) !important;
  border: 1px solid var(--bewa-line) !important;
  border-bottom: 1px solid var(--bewa-line) !important;
  min-height: 48px;
  height: auto !important;
  padding: 12px 14px !important;
  font-size: var(--bewa-fs-body);
  color: var(--bewa-ink);
  box-shadow: none !important;
  transition: border-color var(--bewa-dur-fast) var(--bewa-ease-ios),
              box-shadow var(--bewa-dur-fast) var(--bewa-ease-ios);
}

.form-group.basic textarea.form-control {
  min-height: 96px;
}

.form-control:focus,
.form-group.basic .form-control:focus {
  border-color: var(--bewa-brand) !important;
  box-shadow: 0 0 0 4px var(--bewa-brand-soft) !important;
}

.form-check-input:checked {
  border-color: transparent !important;
}

.form-check-input:focus {
  box-shadow: 0 0 0 0.2rem var(--bewa-brand-soft);
  border-color: var(--bewa-brand);
}

/* Inset grouped lists (iOS) */
.listview.image-listview,
.listview.flush.transparent,
ul.listview {
  background: transparent;
}

.listview.image-listview > li,
.image-listview > li {
  background: var(--bewa-surface);
}

.card,
.bewa-account-card,
.bewa-booking-card {
  border-radius: var(--bewa-radius-lg) !important;
}

/* Action sheet grabber */
.offcanvas.action-sheet .offcanvas-header::before,
.offcanvas-bottom .offcanvas-header::before {
  content: "";
  display: block;
  width: 36px;
  height: 5px;
  margin: 0 auto 10px;
  border-radius: 999px;
  background: rgba(20, 21, 21, 0.18);
}

.offcanvas.action-sheet,
.offcanvas-bottom {
  border-radius: 20px 20px 0 0 !important;
}

/* Segmented tabs (iOS) */
.nav-tabs.lined,
.nav-tabs.lined.iconed {
  display: flex;
  width: auto !important;
  gap: 2px;
  padding: 3px;
  margin: 10px 16px 12px;
  border: 0 !important;
  border-radius: 12px;
  background: rgba(20, 21, 21, 0.06);
}

.wide-block.p-0 > .nav-tabs.lined {
  margin-left: 16px;
  margin-right: 16px;
}

.nav-tabs.lined .nav-item {
  flex: 1 1 0;
  min-width: 0;
}

.nav-tabs.lined .nav-item .nav-link,
.nav-tabs.lined.iconed .nav-item .nav-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  min-height: 36px;
  text-align: center;
  border: 0 !important;
  border-bottom: 0 !important;
  border-radius: 10px !important;
  padding: 7px 10px !important;
  font-weight: 600;
  font-size: var(--bewa-fs-footnote);
  line-height: 1.2;
  color: var(--bewa-ink-muted) !important;
  background: transparent !important;
  box-shadow: none !important;
  border-image: none !important;
  white-space: nowrap;
  transition: background var(--bewa-dur) var(--bewa-ease-ios),
              color var(--bewa-dur) var(--bewa-ease-ios),
              box-shadow var(--bewa-dur) var(--bewa-ease-ios);
}

.nav-tabs.lined .nav-item .nav-link i.bi,
.nav-tabs.lined.iconed .nav-item .nav-link i.bi {
  margin: 0;
  font-size: 1rem;
  line-height: 1;
}

.nav-tabs.lined .nav-item .nav-link.active,
.nav-tabs.lined.iconed .nav-item .nav-link.active {
  color: var(--bewa-ink) !important;
  background: var(--bewa-surface) !important;
  box-shadow: 0 1px 3px rgba(20, 21, 21, 0.12), 0 3px 8px rgba(20, 21, 21, 0.06) !important;
  border-bottom: 0 !important;
  border-image: none !important;
}

.nav-tabs.lined .nav-item .nav-link.active i.bi {
  color: var(--bewa-brand);
}

/* ---- Skeleton ---- */
.bewa-skeleton {
  border-radius: var(--bewa-radius-sm);
  background: linear-gradient(90deg, #ebe7e1 25%, #f4f1ec 50%, #ebe7e1 75%);
  background-size: 200% 100%;
  animation: bewa-shimmer 1.1s ease-in-out infinite;
}

@keyframes bewa-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ---- Booking / selezione ---- */
.card-button {
  border-radius: var(--bewa-radius-sm) !important;
  border: 1px solid var(--bewa-line);
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.card-button.selected-day,
.selected-day,
.card-active.selected-day {
  background: var(--bewa-brand-gradient) !important;
  color: #fff !important;
  border-color: transparent !important;
}

.card.selected,
.employ_card.selected,
.selected {
  border: 2px solid var(--bewa-brand) !important;
  box-shadow: 0 0 0 3px var(--bewa-brand-soft);
}

.text-red {
  color: var(--bewa-brand) !important;
}

/* ==========================================================================
   BEWA target filter — Tutto / Uomo / Donna
   ========================================================================== */

/* Chips filtro home (stessa base di .bewa-place-chip) */
.bewa-filter-section {
  padding-left: 16px;
  padding-right: 16px;
}
.bewa-filter-chips {
  display: flex;
  align-items: stretch;
  gap: 8px;
  width: 100%;
}
.bewa-place-chip.bewa-filter-chip {
  flex: 1 1 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  text-decoration: none !important;
  cursor: pointer;
  padding: 9px 10px;
  background: rgba(118, 118, 118, 0.14);
  border: 1px solid transparent;
  color: var(--bewa-ink) !important;
  -webkit-text-fill-color: var(--bewa-ink);
}
html[data-bewa-target="female"] .bewa-place-chip.bewa-filter-chip {
  background: rgba(118, 118, 118, 0.14);
  color: var(--bewa-ink);
  -webkit-text-fill-color: var(--bewa-ink);
}
html[data-bewa-target="female"] .bewa-place-chip.bewa-filter-chip.active[data-bewa-filter="both"] {
  background: #141515;
  color: #fff;
  -webkit-text-fill-color: #fff;
}
html[data-bewa-target="female"] .bewa-place-chip.bewa-filter-chip.active[data-bewa-filter="male"] {
  background: linear-gradient(90deg, hsla(202, 60%, 35%, 1) 0%, hsla(202, 85%, 18%, 1) 100%);
  color: #fff;
  -webkit-text-fill-color: #fff;
}
html[data-bewa-target="female"] .bewa-place-chip.bewa-filter-chip.active[data-bewa-filter="female"] {
  background: linear-gradient(90deg, #9F019F 0%, #790179 100%);
  color: #fff;
  -webkit-text-fill-color: #fff;
}
@media (min-width: 768px) {
  .bewa-filter-chips {
    justify-content: center;
  }
  .bewa-filter-chip {
    flex: 0 0 auto;
    min-width: 140px;
    padding: 9px 28px;
  }
}
.bewa-filter-chip.active[data-bewa-filter="both"] {
  background: #141515 !important;
  border-color: transparent !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff;
}
.bewa-filter-chip.active[data-bewa-filter="male"] {
  background: linear-gradient(90deg, hsla(202, 60%, 35%, 1) 0%, hsla(202, 85%, 18%, 1) 100%) !important;
  border-color: transparent !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff;
}
.bewa-filter-chip.active[data-bewa-filter="female"] {
  background: linear-gradient(90deg, #9F019F 0%, #790179 100%) !important;
  border-color: transparent !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff;
}

/* Pill Rivolta a sulle card (stessa riga di "Prenota ora", lato sinistro) */
.bewa-target-pill {
  position: absolute;
  left: 5px;
  margin-top: 5px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 600;
  line-height: 1;
  box-shadow: 0 4px 14px rgba(20, 21, 21, 0.18);
}
.bewa-target-pill--both {
  background: rgba(241, 245, 249, 0.95) !important;
  color: #000 !important;
}

/* ==========================================================================
   BEWA top loading bar (stile YouTube) — colore dal tema filtro
   ========================================================================== */
.bewa-topbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  z-index: 200000;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.25s ease;
  background: transparent;
}
.bewa-topbar.is-loading {
  opacity: 1;
}
.bewa-topbar i {
  display: block;
  height: 100%;
  width: 35%;
  border-radius: 0 3px 3px 0;
  background: var(--bewa-brand-gradient);
  transform: translateX(-100%);
}
.bewa-topbar.is-loading i {
  animation: bewa-topbar-slide 1.1s ease-in-out infinite;
}
@keyframes bewa-topbar-slide {
  0% { transform: translateX(-110%); }
  100% { transform: translateX(310%); }
}
@media (prefers-reduced-motion: reduce) {
  .bewa-topbar.is-loading i { animation-duration: 2s; }
}

/* ==========================================================================
   Skeleton panna/grigi come l'app (mai azzurrini) + anti-flicker card
   ========================================================================== */
.placeholder-glow .placeholder {
  background-color: #e4e0d9 !important;
  opacity: 1 !important;
}
.placeholder-glow .bg-secondary {
  background-color: #d9d4cb !important;
}
/* Le immagini delle card occupano subito il loro spazio: niente salti di layout */
#main_content .card .card-img-top {
  aspect-ratio: 16 / 10;
  object-fit: cover;
  background: #ece8e1;
}
/* Ingresso morbido delle card al posto dello swap secco skeleton → contenuto */
@keyframes bewa-card-in {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
.bewa-home-page #main_content .card {
  animation: bewa-card-in 0.3s ease;
}
/* Skeleton coverflow: stessa forma delle card, panna + spinner centrale nel tema filtro */
.bewa-coverflow--loading .bewa-coverflow-track {
  justify-content: center;
}
.bewa-coverflow--loading .bewa-coverflow-item {
  margin: 0;
}
.bewa-coverflow-skel {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, #efece5 0%, #ddd7cc 100%);
}
.bewa-coverflow-spin {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2rem;
  height: 2rem;
  margin: -1rem 0 0 -1rem;
  color: var(--bewa-brand);
}
.bewa-target-pill--male {
  background: linear-gradient(90deg, hsla(202, 60%, 35%, 1) 0%, hsla(202, 85%, 18%, 1) 100%) !important;
  color: #fff !important;
}
.bewa-target-pill--female {
  background: linear-gradient(90deg, #9F019F 0%, #790179 100%) !important;
  color: #fff !important;
}

/* Pill Rivolta a nel profilo sede (Entrambi = stesso stile coverflow home) */
.bewa-target-chip--both {
  background: rgba(241, 245, 249, 0.95) !important;
  color: #000 !important;
  -webkit-text-fill-color: #000;
}
.bewa-target-chip--male {
  background: linear-gradient(90deg, hsla(202, 60%, 35%, 1) 0%, hsla(202, 85%, 18%, 1) 100%) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff;
}
.bewa-target-chip--female {
  background: linear-gradient(90deg, #9F019F 0%, #790179 100%) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff;
}

/* ==========================================================================
   BEWA female theme — Donna: tutto il blu diventa magenta
   ========================================================================== */
html[data-bewa-target="female"] {
  --bewa-brand: #9F019F;
  --bewa-brand-deep: #790179;
  --bewa-brand-soft: rgba(159, 1, 159, 0.14);
  --bewa-brand-soft-2: rgba(159, 1, 159, 0.22);
  --bewa-brand-gradient: linear-gradient(90deg, #9F019F 0%, #790179 100%);
  --bewa-brand-gradient-v: linear-gradient(180deg, #9F019F 0%, #790179 100%);
  --bewa-brand-gradient-hover: linear-gradient(90deg, #8a018a 0%, #660166 100%);
  --bewa-shadow-brand: 0 10px 28px rgba(121, 1, 121, 0.32);
  --bs-primary: #9F019F;
  --bs-primary-rgb: 159, 1, 159;
  --bewa-accent: #9F019F;
  --bewa-accent-deep: #790179;
  --bewa-accent-gradient: linear-gradient(90deg, #9F019F 0%, #790179 100%);
  --bewa-accent-shadow: 121, 1, 121;
}
/* Tema Tutto: nero gradient come colore principale (stesse regole del magenta) */
html[data-bewa-target="both"] {
  --bewa-brand: #2b2f34;
  --bewa-brand-deep: #000000;
  --bewa-brand-soft: rgba(20, 21, 21, 0.12);
  --bewa-brand-soft-2: rgba(20, 21, 21, 0.2);
  --bewa-brand-gradient: linear-gradient(90deg, #3a3f45 0%, #000000 100%);
  --bewa-brand-gradient-v: linear-gradient(180deg, #3a3f45 0%, #000000 100%);
  --bewa-brand-gradient-hover: linear-gradient(90deg, #23262b 0%, #000000 100%);
  --bewa-shadow-brand: 0 10px 28px rgba(0, 0, 0, 0.35);
  --bs-primary: #2b2f34;
  --bs-primary-rgb: 43, 47, 52;
  --bewa-accent: #2b2f34;
  --bewa-accent-deep: #000000;
  --bewa-accent-gradient: linear-gradient(90deg, #3a3f45 0%, #000000 100%);
  --bewa-accent-shadow: 0, 0, 0;
}
html[data-bewa-target="female"] .bg-primary:not(.appHeader):not(.extraHeader),
html[data-bewa-target="both"] .bg-primary:not(.appHeader):not(.extraHeader),
html[data-bewa-target="female"] a.bg-primary:not(.appHeader):not(.extraHeader),
html[data-bewa-target="both"] a.bg-primary:not(.appHeader):not(.extraHeader),
html[data-bewa-target="female"] .badge-primary,
html[data-bewa-target="both"] .badge-primary,
html[data-bewa-target="female"] a.badge-primary,
html[data-bewa-target="both"] a.badge-primary,
html[data-bewa-target="female"] .chip.bg-primary,
html[data-bewa-target="both"] .chip.bg-primary,
html[data-bewa-target="female"] .chip.chip-primary,
html[data-bewa-target="both"] .chip.chip-primary,
html[data-bewa-target="female"] .icon-box.bg-primary,
html[data-bewa-target="both"] .icon-box.bg-primary,
html[data-bewa-target="female"] .image-listview > li .item .icon-box.bg-primary,
html[data-bewa-target="both"] .image-listview > li .item .icon-box.bg-primary,
html[data-bewa-target="female"] .card.bg-primary,
html[data-bewa-target="both"] .card.bg-primary,
html[data-bewa-target="female"] .listview .item .icon-box.bg-primary,
html[data-bewa-target="both"] .listview .item .icon-box.bg-primary,
html[data-bewa-target="female"] .progress-bar.bg-primary,
html[data-bewa-target="both"] .progress-bar.bg-primary,
html[data-bewa-target="female"] .form-check-input:checked,
html[data-bewa-target="both"] .form-check-input:checked,
html[data-bewa-target="female"] .custom-control-input:checked ~ .custom-control-label::before,
html[data-bewa-target="both"] .custom-control-input:checked ~ .custom-control-label::before,
html[data-bewa-target="female"] .page-item.active .page-link,
html[data-bewa-target="both"] .page-item.active .page-link,
html[data-bewa-target="female"] .nav-pills .nav-link.active,
html[data-bewa-target="both"] .nav-pills .nav-link.active,
html[data-bewa-target="female"] .btn-primary,
html[data-bewa-target="both"] .btn-primary,
html[data-bewa-target="female"] .btn.bg-primary,
html[data-bewa-target="both"] .btn.bg-primary,
html[data-bewa-target="female"] a.btn-primary,
html[data-bewa-target="both"] a.btn-primary,
html[data-bewa-target="female"] button.btn-primary,
html[data-bewa-target="both"] button.btn-primary,
html[data-bewa-target="female"] input.btn-primary,
html[data-bewa-target="both"] input.btn-primary {
  background: var(--bewa-accent) !important;
  background: var(--bewa-accent-gradient) !important;
  border-color: transparent !important;
  color: #fff !important;
}
html[data-bewa-target="female"] .text-primary,
html[data-bewa-target="both"] .text-primary,
html[data-bewa-target="female"] a.text-primary,
html[data-bewa-target="both"] a.text-primary,
html[data-bewa-target="female"] .btn-text-primary,
html[data-bewa-target="both"] .btn-text-primary {
  color: var(--bewa-accent) !important;
}
html[data-bewa-target="female"] .spinner-border.text-primary,
html[data-bewa-target="both"] .spinner-border.text-primary,
html[data-bewa-target="female"] .text-primary.spinner-border,
html[data-bewa-target="both"] .text-primary.spinner-border {
  color: var(--bewa-accent) !important;
}
html[data-bewa-target="female"] .btn-outline-primary,
html[data-bewa-target="both"] .btn-outline-primary {
  border-color: var(--bewa-accent) !important;
  color: var(--bewa-accent) !important;
}
html[data-bewa-target="female"] .bewa-place-address i,
html[data-bewa-target="both"] .bewa-place-address i,
html[data-bewa-target="female"] .bewa-place-chip,
html[data-bewa-target="both"] .bewa-place-chip {
  color: var(--bewa-brand-deep);
}
html[data-bewa-target="female"] .bewa-place-chip,
html[data-bewa-target="both"] .bewa-place-chip {
  background: var(--bewa-brand-soft);
}

/* Legacy style.css blues → colore tema */
html[data-bewa-target="female"] a,
html[data-bewa-target="both"] a,
html[data-bewa-target="female"] a:hover,
html[data-bewa-target="both"] a:hover,
html[data-bewa-target="female"] a:active,
html[data-bewa-target="both"] a:active,
html[data-bewa-target="female"] a:focus,
html[data-bewa-target="both"] a:focus {
  color: var(--bewa-accent) !important;
}
/* Voci menu profilo/account: sempre nere come Notifiche (tranne Rimuovi Account rossa) */
html[data-bewa-target="female"] a.bewa-profile-action,
html[data-bewa-target="both"] a.bewa-profile-action,
html[data-bewa-target="female"] a.bewa-profile-action .bewa-profile-action-label,
html[data-bewa-target="both"] a.bewa-profile-action .bewa-profile-action-label,
html[data-bewa-target="female"] a.bewa-account-link:not(.bewa-account-link--danger),
html[data-bewa-target="both"] a.bewa-account-link:not(.bewa-account-link--danger),
html[data-bewa-target="female"] a.bewa-account-link:not(.bewa-account-link--danger) span,
html[data-bewa-target="both"] a.bewa-account-link:not(.bewa-account-link--danger) span {
  color: var(--bewa-ink) !important;
  -webkit-text-fill-color: var(--bewa-ink);
}
/* Badge contatore nelle voci profilo: testo sempre bianco */
html[data-bewa-target="female"] a.bewa-profile-action .badge,
html[data-bewa-target="both"] a.bewa-profile-action .badge {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
html[data-bewa-target="female"] .appBottomMenu .item.active i.bi,
html[data-bewa-target="both"] .appBottomMenu .item.active i.bi,
html[data-bewa-target="female"] .appBottomMenu .item.active i.icon,
html[data-bewa-target="both"] .appBottomMenu .item.active i.icon,
html[data-bewa-target="female"] .appBottomMenu .item.active ion-icon,
html[data-bewa-target="both"] .appBottomMenu .item.active ion-icon,
html[data-bewa-target="female"] .appBottomMenu .item.active strong,
html[data-bewa-target="both"] .appBottomMenu .item.active strong {
  color: var(--bewa-accent) !important;
}
html[data-bewa-target="female"] .appBottomMenu .item.active .footer-logo-icon,
html[data-bewa-target="both"] .appBottomMenu .item.active .footer-logo-icon,
html[data-bewa-target="female"] .appBottomMenu.text-light .item.active .footer-logo-icon,
html[data-bewa-target="both"] .appBottomMenu.text-light .item.active .footer-logo-icon {
  background-color: var(--bewa-accent) !important;
}
html[data-bewa-target="female"] .nav-tabs.lined .nav-item .nav-link.active,
html[data-bewa-target="both"] .nav-tabs.lined .nav-item .nav-link.active {
  color: var(--bewa-accent) !important;
  border-bottom-color: var(--bewa-accent) !important;
}
html[data-bewa-target="female"] .btn-gr,
html[data-bewa-target="both"] .btn-gr,
html[data-bewa-target="female"] a.btn-gr,
html[data-bewa-target="both"] a.btn-gr {
  background: var(--bewa-accent-gradient) !important;
  color: #fff !important;
}
html[data-bewa-target="female"] .btn-text-gr,
html[data-bewa-target="both"] .btn-text-gr,
html[data-bewa-target="female"] .text-gr,
html[data-bewa-target="both"] .text-gr {
  color: var(--bewa-accent) !important;
}
html[data-bewa-target="female"] input[type="checkbox"]:checked,
html[data-bewa-target="both"] input[type="checkbox"]:checked,
html[data-bewa-target="female"] .form-check-input:checked ~ .form-check-label:after,
html[data-bewa-target="both"] .form-check-input:checked ~ .form-check-label:after {
  background-color: var(--bewa-accent) !important;
}
html[data-bewa-target="female"] .form-range::-webkit-slider-thumb,
html[data-bewa-target="both"] .form-range::-webkit-slider-thumb,
html[data-bewa-target="female"] .form-range::-moz-range-thumb,
html[data-bewa-target="both"] .form-range::-moz-range-thumb,
html[data-bewa-target="female"] .form-range::-ms-thumb,
html[data-bewa-target="both"] .form-range::-ms-thumb {
  background: var(--bewa-accent) !important;
}
html[data-bewa-target="female"] .message-item.user .bubble,
html[data-bewa-target="both"] .message-item.user .bubble {
  background: var(--bewa-accent) !important;
}
html[data-bewa-target="female"] .story-block .splide__slide img,
html[data-bewa-target="both"] .story-block .splide__slide img {
  box-shadow: 0 0 0 3px #ffffff, 0 0 0 5px var(--bewa-accent) !important;
}

/* Ombra coverflow in base al filtro (Uomo resta blu di default) */
html[data-bewa-target="female"] .bewa-coverflow-item .card,
html[data-bewa-target="both"] .bewa-coverflow-item .card {
  box-shadow: 0 12px 22px rgba(var(--bewa-accent-shadow), 0.3) !important;
}
html[data-bewa-target="female"] .bewa-coverflow-item.is-active .card,
html[data-bewa-target="both"] .bewa-coverflow-item.is-active .card {
  box-shadow: 0 16px 28px rgba(var(--bewa-accent-shadow), 0.38) !important;
}
html[data-bewa-target="female"] .bewa-coverflow-item .badge.badge-primary,
html[data-bewa-target="both"] .bewa-coverflow-item .badge.badge-primary {
  box-shadow: 0 4px 14px rgba(var(--bewa-accent-shadow), 0.32) !important;
}

/* ==========================================================================
   Eccezioni sempre nere (mai magenta/gradient): sottocategorie cerca + login
   ========================================================================== */
/* Cerca categorie: sottocategorie nelle collapse sempre nere */
html[data-bewa-target="female"] #categories .link-listview > li a,
html[data-bewa-target="both"] #categories .link-listview > li a,
html[data-bewa-target="male"] #categories .link-listview > li a,
html[data-bewa-target="female"] #categories .link-listview > li a:hover,
html[data-bewa-target="both"] #categories .link-listview > li a:hover,
html[data-bewa-target="male"] #categories .link-listview > li a:hover,
html[data-bewa-target="female"] #categories .link-listview > li a:active,
html[data-bewa-target="both"] #categories .link-listview > li a:active,
html[data-bewa-target="male"] #categories .link-listview > li a:active,
html[data-bewa-target="female"] #categories .link-listview > li a:focus,
html[data-bewa-target="both"] #categories .link-listview > li a:focus,
html[data-bewa-target="male"] #categories .link-listview > li a:focus {
  color: var(--bewa-ink) !important;
  -webkit-text-fill-color: var(--bewa-ink);
}

/* Modale login: link "Hai dimenticato la password?" sempre nero */
#loginModal .btn-link,
html[data-bewa-target="female"] #loginModal .btn-link,
html[data-bewa-target="both"] #loginModal .btn-link,
html[data-bewa-target="male"] #loginModal .btn-link,
#loginModal .btn-link:hover,
html[data-bewa-target="female"] #loginModal .btn-link:hover,
html[data-bewa-target="both"] #loginModal .btn-link:hover,
#loginModal .btn-link:active,
html[data-bewa-target="female"] #loginModal .btn-link:active,
html[data-bewa-target="both"] #loginModal .btn-link:active,
#loginModal .btn-link:focus,
html[data-bewa-target="female"] #loginModal .btn-link:focus,
html[data-bewa-target="both"] #loginModal .btn-link:focus {
  color: var(--bewa-ink) !important;
  -webkit-text-fill-color: var(--bewa-ink);
  text-decoration: none;
}

/* Modale login/registrazione: header NON fixed, spinge il body sotto (no gap) */
#loginModal.modalbox .modal-dialog .modal-content .modal-header,
#registerModal.modalbox .modal-dialog .modal-content .modal-header {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  width: auto !important;
  z-index: auto !important;
}
.modalbox .modal-dialog .modal-content {
  padding-top: 0 !important;
}

#loginModal.modalbox .modal-dialog .modal-content .modal-header,
#registerModal.modalbox .modal-dialog .modal-content .modal-header {
  border-bottom: 0.5px solid var(--bewa-line) !important;
}

/* Logo B come fallback avatar: sfondo panna di default (logo con trasparenza),
   mai tagliata: contenuta e centrata con padding intorno */
img[src*="bewa-b.png"] {
  background: var(--bewa-bg) !important;
  background-color: var(--bewa-bg) !important;
  object-fit: contain !important;
  object-position: center center !important;
  padding: 12% !important;
  box-sizing: border-box !important;
}

/* Scheda sede: indirizzo sempre come tema blu (testo muted + icona blu) */
html[data-bewa-target="female"] a.bewa-place-address,
html[data-bewa-target="both"] a.bewa-place-address,
html[data-bewa-target="male"] a.bewa-place-address,
html[data-bewa-target="female"] a.bewa-place-address:hover,
html[data-bewa-target="both"] a.bewa-place-address:hover,
html[data-bewa-target="female"] a.bewa-place-address:active,
html[data-bewa-target="both"] a.bewa-place-address:active,
html[data-bewa-target="female"] a.bewa-place-address:focus,
html[data-bewa-target="both"] a.bewa-place-address:focus,
html[data-bewa-target="female"] .bewa-place-address span,
html[data-bewa-target="both"] .bewa-place-address span {
  color: var(--bewa-ink-muted) !important;
  -webkit-text-fill-color: var(--bewa-ink-muted);
}
html[data-bewa-target="female"] .bewa-place-address i,
html[data-bewa-target="both"] .bewa-place-address i,
html[data-bewa-target="male"] .bewa-place-address i {
  color: #23678d !important;
  -webkit-text-fill-color: #23678d;
}

/* Scheda sede: chip "Entrambi" come pill coverflow home (vince sul tema) */
html[data-bewa-target="female"] .bewa-target-chip--both,
html[data-bewa-target="both"] .bewa-target-chip--both,
html[data-bewa-target="male"] .bewa-target-chip--both {
  background: rgba(241, 245, 249, 0.95) !important;
  color: #000 !important;
  -webkit-text-fill-color: #000;
}


