/* V10 — selector de tratamientos visible y consistente en Aura y Dental */
.native-service-select {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  overflow: hidden !important;
}
.service-picker { position: relative; width: 100%; z-index: 18; }
.service-picker.is-open { z-index: 250; }
.service-picker-button {
  width: 100%;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0;
  border: 0;
  border-bottom: 1px solid rgba(255,255,255,.4);
  background: transparent;
  color: #fff;
  font: inherit;
  font-size: 13px;
  text-align: left;
  cursor: pointer;
}
.service-picker-button > span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.service-picker-button i { font-style:normal; font-size:18px; transition:transform .22s ease; }
.service-picker.is-open .service-picker-button i { transform:rotate(180deg); }
.service-picker-button:focus-visible { outline:2px solid rgba(255,255,255,.72); outline-offset:4px; border-radius:4px; }
.service-picker-button.is-invalid { border-color:#ffe2d2; }
.service-picker-panel {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  z-index: 300;
  max-height: 360px;
  overflow: auto;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 16px;
  background: #34201c;
  color: #fff;
  box-shadow: 0 28px 70px rgba(20,11,9,.38);
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
.service-picker-title {
  position: sticky;
  top: -12px;
  z-index: 2;
  margin: -12px -12px 8px;
  padding: 14px 16px 12px;
  background: #34201c;
  border-bottom: 1px solid rgba(255,255,255,.1);
  color: rgba(255,255,255,.68);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.service-picker-group + .service-picker-group { margin-top: 12px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.1); }
.service-picker-group small { display:block; padding:4px 8px 7px; color:#d8aa8c; font-size:9px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.service-picker-group button {
  width:100%;
  min-height:42px;
  padding:10px 12px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:rgba(255,255,255,.88);
  font:inherit;
  font-size:12px;
  line-height:1.3;
  text-align:left;
  cursor:pointer;
}
.service-picker-group button:hover,
.service-picker-group button:focus-visible { background:rgba(255,255,255,.1); color:#fff; outline:none; }
.service-picker-group button.is-selected { background:#fff; color:#34201c; font-weight:650; }

body[data-brand="dental"] .service-picker-panel,
.dental-agenda-page .service-picker-panel { background:#123545; border-color:rgba(91,169,214,.35); box-shadow:0 28px 70px rgba(3,24,34,.46); }
body[data-brand="dental"] .service-picker-title,
.dental-agenda-page .service-picker-title { background:#123545; }
body[data-brand="dental"] .service-picker-group small,
.dental-agenda-page .service-picker-group small { color:#75c1e9; }
body[data-brand="dental"] .service-picker-group button.is-selected,
.dental-agenda-page .service-picker-group button.is-selected { background:#5ba9d6; color:#082838; }

@media (max-width:760px) {
  .service-picker-panel { position:fixed; left:12px; right:12px; top:auto; bottom:12px; max-height:min(70svh,520px); border-radius:20px; }
}


/* V11 — capa flotante sólida y scroll estable */
.booking-picker-backdrop {
  position: fixed;
  inset: 0;
  z-index: 4990;
  background: rgba(30, 20, 17, .26);
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
}
.booking-picker-backdrop[hidden] { display: none !important; }
body.booking-picker-open { overflow: hidden; }
.service-picker-panel.is-portal {
  position: fixed !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 5000 !important;
  display: block !important;
  min-height: 0;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  scrollbar-gutter: stable;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  isolation: isolate;
  contain: layout paint;
  border-width: 1px;
  border-style: solid;
  background-color: #fffaf6 !important;
  background-image: none !important;
  box-shadow: 0 28px 90px rgba(38, 20, 16, .34), 0 0 0 1px rgba(255,255,255,.55) inset !important;
  pointer-events: auto !important;
  touch-action: pan-y;
}
.service-picker-panel.is-portal::-webkit-scrollbar { width: 10px; }
.service-picker-panel.is-portal::-webkit-scrollbar-track { background: #efe1d8; border-radius: 999px; }
.service-picker-panel.is-portal::-webkit-scrollbar-thumb { background: #8c5a47; border: 2px solid #efe1d8; border-radius: 999px; }
.service-picker-panel.is-portal .service-picker-title {
  top: 0 !important;
  margin: -12px -12px 10px !important;
  background-color: #fffaf6 !important;
  background-image: none !important;
  box-shadow: 0 8px 18px rgba(65,38,29,.08);
}
.service-picker-panel.is-portal .service-picker-options,
.service-picker-panel.is-portal .service-picker-group,
.service-picker-panel.is-portal .service-picker-group button {
  opacity: 1 !important;
  visibility: visible !important;
}
.service-picker-panel.is-portal[data-placement="top"] { transform-origin: bottom center; }
.service-picker-panel.is-portal[data-placement="bottom"] { transform-origin: top center; }

.dental-agenda-page .service-picker-panel.is-portal,
body[data-brand="dental"] .service-picker-panel.is-portal {
  background-color: #f9fdff !important;
  border-color: rgba(62,152,196,.36) !important;
  box-shadow: 0 28px 90px rgba(10,48,68,.3), 0 0 0 1px rgba(255,255,255,.75) inset !important;
}
.dental-agenda-page .service-picker-panel.is-portal .service-picker-title,
body[data-brand="dental"] .service-picker-panel.is-portal .service-picker-title {
  background-color: #f9fdff !important;
}
.dental-agenda-page .service-picker-panel.is-portal::-webkit-scrollbar-track { background: #dceef7; }
.dental-agenda-page .service-picker-panel.is-portal::-webkit-scrollbar-thumb { background: #3c91bb; border-color: #dceef7; }

.booking-picker-panel.is-portal { padding-bottom: 12px; }
.booking-picker-panel.is-portal .service-picker-group button { min-height: 46px; font-size: 13px; }

@media (max-width: 760px) {
  .service-picker-panel.is-portal {
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    top: auto !important;
    bottom: 12px !important;
    max-height: min(72svh, 560px) !important;
    border-radius: 22px !important;
  }
  .booking-picker-backdrop { background: rgba(26,17,15,.44); backdrop-filter: blur(3px); }
}
