:root {
      --agenda-visible-height: 100vh;
      --agenda-visible-top: 0px;
      --agenda-visible-bottom: 0px;
    }
    @supports (height: 100dvh) { :root { --agenda-visible-height: 100dvh; } }

    :is(#citaDetailOverlay, #perfilOverlay, #actividadOverlay) { z-index: 40000 !important; }
    :is(#citaDetailSheet, #perfilModal, #actividadModal) { z-index: 40001 !important; }
    :is(#freeSlotModal, #proyeccionModal:not(.mobile-projection-view)) { z-index: 41000 !important; }
    :is(#agendarModal, #blockRangeModal, #calendarModal, #comisionesModal, #propinasModal) { z-index: 42000 !important; }
    #editCitaOverlay { z-index: 43000 !important; }
    #comprobanteAgendaOverlay { z-index: 44000 !important; }
    #pwaModalIOS { z-index: 44500 !important; }
    #notifPermModal { z-index: 45000 !important; }
    #tuuAgendaOverlay { z-index: 46000 !important; }
    #mtbOverlay { z-index: 47000 !important; }
    #packModalOverlayAgenda { z-index: 48000 !important; }
    :is(#errBanner, #connBanner, #agendaSinConexion) { z-index: 49000 !important; }

    html.agenda-modal-open, body.agenda-modal-open { overflow: hidden !important; }
    body.agenda-modal-open :is(#bottomNav, #fabNuevaCita, #btnScrollAhora, #pwaBanner,
        #kebabMenuPanel, #kebabMenuOverlay) {
      visibility: hidden !important;
      pointer-events: none !important;
    }
    .agenda-form-body { min-height: 0; min-width: 0; overscroll-behavior: contain; }
    .agenda-form-footer { flex-shrink: 0; }
    #ecServicioBuscar { padding-left: 36px; padding-right: 56px; }
    /* Combo de servicios de Nueva cita (ver _manualSvcRender). */
    #manualSvcLista .svc-opt { border-bottom: 1px solid rgba(255,255,255,0.05); }
    #manualSvcLista .svc-opt:last-child { border-bottom: 0; }
    #manualSvcLista .svc-opt:hover,
    #manualSvcLista .svc-opt.is-activo { background: rgba(255,255,255,0.07); }
    #manualSvcLista .svc-opt[aria-selected="true"] { background: rgba(52,211,153,0.08); }
    html.light-mode #manualSvcLista .svc-opt { border-bottom-color: #f1f5f9; }
    html.light-mode #manualSvcLista .svc-opt:hover,
    html.light-mode #manualSvcLista .svc-opt.is-activo { background: #f1f5f9; }
    html.light-mode #manualSvcLista .svc-opt[aria-selected="true"] { background: #ecfdf5; }
    html.light-mode #manualSvcToggle { color: #64748b; }
    html.light-mode #editCitaSheet .agenda-form-footer {
      background: var(--elev-surface) !important;
      border-top-color: #e2e8f0;
    }
    html.light-mode #ecServicioBuscarWrap > i { color: #64748b; }
    html.light-mode :is(#agendarModal, #editCitaOverlay, #blockRangeModal,
        #comisionesModal) :is(input, select) { color-scheme: light; }
    :is(#manualSaveBtn, #ecSaveBtn, #blockRangeSaveBtn) { min-height: 48px; }
    #manualError { max-height: 64px; overflow-y: auto; overflow-wrap: anywhere; }
    :is(#freeSlotModal, #calendarModal, #blockRangeModal, #pwaModalIOS, #notifPermModal,
        #tuuAgendaOverlay, #packModalOverlayAgenda, #proyeccionModal:not(.mobile-projection-view)) > div {
      max-height: calc(var(--agenda-visible-height) - 48px);
      overflow-y: auto;
      overscroll-behavior: contain;
    }

    @media (max-width: 639.98px), (max-width: 1023.98px) and (max-height: 500px) {
      :is(#agendarModal, #freeSlotModal, #blockRangeModal, #calendarModal, #editCitaOverlay,
          #pwaModalIOS, #notifPermModal, #tuuAgendaOverlay, #mtbOverlay, #packModalOverlayAgenda,
          #comprobanteAgendaOverlay, #comisionesModal, #propinasModal,
          #proyeccionModal:not(.mobile-projection-view)) {
        top: var(--agenda-visible-top) !important;
        bottom: auto !important;
        height: var(--agenda-visible-height) !important;
        min-height: 0;
        box-sizing: border-box;
      }
      :is(#freeSlotModal, #blockRangeModal, #calendarModal, #pwaModalIOS, #notifPermModal,
          #tuuAgendaOverlay, #mtbOverlay, #packModalOverlayAgenda,
          #proyeccionModal:not(.mobile-projection-view)) {
        padding-top: max(12px, env(safe-area-inset-top, 0px)) !important;
        padding-bottom: max(16px, env(safe-area-inset-bottom, 0px)) !important;
      }
      :is(#freeSlotModal, #blockRangeModal, #calendarModal, #pwaModalIOS, #notifPermModal,
          #tuuAgendaOverlay, #mtbOverlay, #packModalOverlayAgenda,
          #proyeccionModal:not(.mobile-projection-view)) > div {
        max-height: 100%;
        min-height: 0;
      }
      #agendarModal {
        align-items: center;
        padding: max(12px, env(safe-area-inset-top, 0px))
                 max(12px, env(safe-area-inset-right, 0px))
                 max(12px, env(safe-area-inset-bottom, 0px))
                 max(12px, env(safe-area-inset-left, 0px));
      }
      #agendarModal > div {
        width: 100%; max-width: 480px;
        max-height: min(760px, 100%);
        padding: 16px;
        border-radius: 24px;
        overflow: hidden;
      }
      #agendarModal > div > :first-child { flex-shrink: 0; margin-bottom: 16px; }
      #agendarModal .agenda-form-footer { background: var(--elev-surface); }
      #editCitaSheet {
        max-height: calc(var(--agenda-visible-height) - max(12px, env(safe-area-inset-top, 0px))) !important;
      }
      #editCitaSheet .agenda-form-footer {
        padding-bottom: max(16px, env(safe-area-inset-bottom, 0px));
      }
      :is(#agendarModal, #editCitaOverlay, #blockRangeModal, #comisionesModal,
          #perfilModal, #citaDetailSheet, #mtbOverlay) :is(input, select, textarea) {
        font-size: 16px !important;
        min-width: 0; max-width: 100%;
      }
      :is(#agendarModal, #editCitaOverlay, #blockRangeModal, #comisionesModal) .grid > div {
        min-width: 0;
      }
      :is(#agendarModal, #editCitaOverlay, #calendarModal, #blockRangeModal,
          #perfilModal, #actividadModal) button[aria-label] {
        min-width: 44px; min-height: 44px; flex-shrink: 0;
      }
      :is(#citaDetailSheet, #perfilModal, #actividadModal) {
        bottom: var(--agenda-visible-bottom) !important;
        max-height: calc(var(--agenda-visible-height) - max(12px, env(safe-area-inset-top, 0px))) !important;
      }
      #citaDetailSheet {
        display: flex; flex-direction: column;
        max-height: calc(var(--agenda-visible-height) * .55) !important;
      }
      #citaDetailSheet[data-state="expanded"], #citaDetailSheet:focus-within {
        max-height: calc(var(--agenda-visible-height) - 12px) !important;
      }
      #citaSheetHandle { flex-shrink: 0; }
      #citaDetailSheet [data-cd-inner] {
        min-height: 0; max-height: none !important;
        padding-bottom: max(24px, env(safe-area-inset-bottom, 0px));
        overscroll-behavior: contain;
      }
      #citaDetailSheet .agenda-detail-header {
        position: sticky; top: 0; z-index: 1;
        background: var(--elev-surface); padding-bottom: 12px;
      }
      #citaDetailSheet .cd-acciones { flex-wrap: wrap; }
      #citaDetailSheet [data-cd-inner] > div:has(.cd-acciones) { flex-wrap: wrap; }
      #perfilModal > .overflow-y-auto {
        max-height: calc(var(--agenda-visible-height) - 48px) !important;
        overscroll-behavior: contain;
      }
      #actividadModal:not(.hidden) { display: flex; flex-direction: column; }
      #actividadModal > :not(#actividadLista) { flex-shrink: 0; }
      #actividadLista { min-height: 0; max-height: none !important; overscroll-behavior: contain; }
      #actividadFiltros button { min-height: 44px; }
      :is(#comisionesModal, #propinasModal) > .flex-1 {
        min-height: 0; overscroll-behavior: contain;
        padding-bottom: max(24px, env(safe-area-inset-bottom, 0px));
      }
      :is(#comisionesModal, #propinasModal) > :first-child {
        padding-top: max(16px, env(safe-area-inset-top, 0px));
      }
      #calendarModal > div { padding: 16px; }
      #calendarMonthLabel { min-width: 0; text-align: center; overflow-wrap: normal; line-height: 1.35; }
      #calendarGrid button { min-width: 0; width: 100%; max-width: 44px; min-height: 40px; }
      #kebabMenuPanel {
        max-height: calc(var(--agenda-visible-height) - var(--bottom-nav-h) - 24px);
        overflow-y: auto; overscroll-behavior: contain;
      }
      #mtbOverlay .mtb-card { max-height: 100%; }
      #mtbOverlay .mtb-body { min-height: 0; overscroll-behavior: contain; }
      #mtbOverlay .mtb-foot { flex-wrap: wrap; }
      #tuuAgendaOverlay > div { overflow-y: auto; }
      #tuuAgendaOverlay button { flex-wrap: wrap; }
      #comprobanteAgendaOverlay { padding-top: 64px; }
      #comprobanteAgendaOverlay img { max-height: 100%; }
      #agendaSinConexion {
        bottom: calc(var(--bottom-nav-h) + env(safe-area-inset-bottom, 0px)) !important;
      }
      body.agenda-modal-open :is(#errBanner, #agendaSinConexion) {
        top: calc(var(--agenda-visible-top) + max(8px, env(safe-area-inset-top, 0px))) !important;
        bottom: auto !important;
      }
    }
    @media (max-width: 1023.98px) and (max-height: 500px) {
      #agendarModal > div > :first-child { margin-bottom: 8px; }
      #agendarModal > div { padding-top: 12px; padding-bottom: 12px; }
      #editCitaSheet > :first-child { padding-top: 8px; padding-bottom: 8px; }
      #agendarModal .agenda-form-footer { padding-top: 8px; }
    }
    @media (max-width: 359.98px) {
      #editCitaSheet .grid:has(> #ecTelWrap) { grid-template-columns: 1fr; }
    }