/* Accessibility and responsive interaction safeguards.
 * Final, low-regression override layer for readability, tablet layout,
 * touch targets, focus visibility, and Live OPD drawer behavior.
 */

:root {
    --rx36-focus: #0b6ec8;
    --rx36-touch: 44px;
}

body.rx-v36 :where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 3px solid var(--rx36-focus) !important;
    outline-offset: 2px !important;
}

body.rx-v36 .rx-content,
body.rx-v36 .rx-billing-content {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}

body.rx-v36 .rx-dashboard,
body.rx-v36 .rx30-dashboard {
    width: 100% !important;
    max-width: none !important;
}

/* Top navigation: readable and touch-safe. */
body.rx-v36 .rx-topbar :where(a, button, select),
body.rx-v36 .rx-sidebar :where(a, button),
body.rx-v36 .rx32-topbar-control {
    min-height: var(--rx36-touch) !important;
    height: auto !important;
    font-size: 12px !important;
}

body.rx-v36 .rx32-brand-copy > small,
body.rx-v36 .rx32-brand-copy > em,
body.rx-v36 .rx32-brand-copy > strong,
body.rx-v36 .rx32-brand-login .rx32-brand-copy > em,
body.rx-v36 .rx32-brand-login .rx32-brand-copy > strong,
body.rx-v36 .rx32-brand-dashboard .rx32-brand-copy > em,
body.rx-v36 .rx32-brand-dashboard .rx32-brand-copy > strong {
    font-size: 11px !important;
    line-height: 1.3 !important;
}

body.rx-v36 .rx-statusbar,
body.rx-v36 .rx30-bottom-status {
    font-size: 11px !important;
}

/* Login: remove miniature controls and provide reliable tap targets. */
body.rx-v36 .rx30-login-panel {
    padding: clamp(24px, 3.2vw, 48px) !important;
}

body.rx-v36 .rx30-login-form {
    gap: 16px !important;
}

body.rx-v36 .rx30-input {
    min-height: 72px !important;
    grid-template-columns: 44px minmax(0, 1fr) auto auto !important;
}

body.rx-v36 .rx30-field-code {
    width: 40px !important;
    height: 40px !important;
    font-size: 12px !important;
}

body.rx-v36 .rx30-field-copy small,
body.rx-v36 .rx30-login-context label > span {
    font-size: 11px !important;
    line-height: 1.35 !important;
}

body.rx-v36 .rx30-field-copy input,
body.rx-v36 .rx30-login-context select,
body.rx-v36 .rx30-show-password,
body.rx-v36 .rx30-submit {
    min-height: var(--rx36-touch) !important;
    height: auto !important;
}

body.rx-v36 .rx30-field-copy input {
    font-size: 16px !important;
}

body.rx-v36 .rx30-login-context select,
body.rx-v36 .rx30-show-password,
body.rx-v36 .rx30-form-options,
body.rx-v36 .rx30-form-options label,
body.rx-v36 .rx30-form-options a {
    font-size: 12px !important;
}

body.rx-v36 .rx30-show-password {
    padding-inline: 12px !important;
}

body.rx-v36 .rx30-form-options label {
    min-height: var(--rx36-touch) !important;
}

body.rx-v36 .rx30-form-options input {
    width: 20px !important;
    height: 20px !important;
}

body.rx-v36 .rx30-input kbd,
body.rx-v36 .rx30-submit kbd {
    font-size: 11px !important;
}

/* Dashboard hierarchy: primary work first, without transform-based shrinking. */
body.rx-v36 .rx30-dashboard {
    overflow: clip !important;
}

body.rx-v36 .rx30-dashboard-lockup {
    transform: none !important;
}

body.rx-v36 .rx30-dashboard-head {
    align-items: flex-start !important;
}

body.rx-v36 .rx30-business-copy > span,
body.rx-v36 .rx30-system-state b,
body.rx-v36 .rx30-system-state small,
body.rx-v36 .rx30-primary-action small,
body.rx-v36 .rx30-primary-action kbd,
body.rx-v36 .rx30-kpi-grid b,
body.rx-v36 .rx30-kpi-grid small,
body.rx-v36 .rx30-integrity,
body.rx-v36 .rx30-keyboard-strip,
body.rx-v36 .rx30-data-panel p,
body.rx-v36 .rx30-data-panel header > a {
    font-size: 12px !important;
    line-height: 1.45 !important;
}

body.rx-v36 .rx30-business-copy p {
    font-size: 14px !important;
    line-height: 1.55 !important;
}

body.rx-v36 .rx30-primary-actions {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
    gap: 16px !important;
    padding-top: 20px !important;
}

body.rx-v36 .rx30-primary-action {
    min-height: 124px !important;
    border-width: 2px !important;
    padding: 18px !important;
}

body.rx-v36 .rx30-primary-action b {
    font-size: 17px !important;
    line-height: 1.25 !important;
}

body.rx-v36 .rx30-primary-action .rx30-action-icon {
    width: 56px !important;
    height: 56px !important;
    font-size: 17px !important;
}

body.rx-v36 .rx30-dashboard-partners {
    grid-template-columns: repeat(3, minmax(0, 180px)) !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    padding-top: 18px !important;
}

body.rx-v36 .rx30-dashboard-partners a {
    min-height: var(--rx36-touch) !important;
    box-shadow: none !important;
}

body.rx-v36 .rx30-dashboard-partners img {
    aspect-ratio: 3.2 / 1 !important;
    max-height: 64px !important;
}

body.rx-v36 .rx30-kpi-grid article,
body.rx-v36 .rx30-kpi-grid > a {
    min-height: 104px !important;
}

body.rx-v36 .rx30-keyboard-strip {
    gap: 12px 18px !important;
}

body.rx-v36 .rx30-keyboard-strip kbd,
body.rx-v36 .rx-command-bar kbd {
    font-size: 12px !important;
    min-height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
}

body.rx-v36 .rx-table-wrap,
body.rx-v36 .rx-purchase-grid-wrap {
    max-width: 100% !important;
    overflow: auto !important;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
}

/* Live OPD: compact desktop rail, drawer on tablet/mobile. */
@media (min-width: 1200px) {
    body.rx-v36 .rx-billing-stage {
        grid-template-columns: minmax(0, 1fr) minmax(240px, 280px) !important;
        gap: 12px !important;
    }
}

body.rx-v36 .rx-live-opd-filter label span,
body.rx-v36 .rx-live-opd-empty span,
body.rx-v36 .rx-live-session-card p,
body.rx-v36 .rx-live-session-meta span,
body.rx-v36 .rx-live-recent-bookings > strong,
body.rx-v36 .rx-live-recent-bookings > div,
body.rx-v36 .rx-live-session-no-token,
body.rx-v36 .rx-live-opd-form-message {
    font-size: 11px !important;
    line-height: 1.4 !important;
}

body.rx-v36 .rx-live-opd-filter :where(select, button),
body.rx-v36 .rx-live-token-grid button,
body.rx-v36 .rx-live-opd-booking-form :where(input, select),
body.rx-v36 .rx-live-opd-booking-form > footer button,
body.rx-v36 .rx-live-opd-booking-form > header button,
body.rx-v36 .rx-live-opd-mobile-toggle {
    min-height: var(--rx36-touch) !important;
    height: auto !important;
    touch-action: manipulation;
}

body.rx-v36 .rx-live-token-grid button {
    font-size: 12px !important;
}

@media (max-width: 1199px) {
    body.rx-v36 .rx-billing-stage {
        display: block !important;
        padding-right: 0 !important;
    }

    body.rx-v36 .rx-live-opd-rail {
        position: fixed !important;
        inset: 0 0 0 auto !important;
        width: min(420px, 92vw) !important;
        max-width: 420px !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        min-height: 0 !important;
        z-index: 120 !important;
        border-radius: 18px 0 0 18px !important;
        box-shadow: -20px 0 55px rgba(7, 30, 61, .28) !important;
        transform: translate3d(105%, 0, 0) !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transition: transform .22s ease, visibility .22s ease !important;
        overscroll-behavior: contain;
    }

    body.rx-v36 .rx-live-opd-rail.is-open {
        transform: translate3d(0, 0, 0) !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    body.rx-v36 .rx-live-opd-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 119;
        background: rgba(7, 24, 45, .58);
        opacity: 0;
        transition: opacity .2s ease;
        backdrop-filter: blur(2px);
    }

    body.rx-v36 .rx-live-opd-backdrop[hidden] {
        display: none !important;
    }

    body.rx-v36 .rx-live-opd-backdrop.is-open {
        opacity: 1;
    }

    body.rx-v36 .rx-live-opd-head {
        position: sticky !important;
        top: 0;
        z-index: 4;
        min-height: 64px !important;
        padding: calc(10px + env(safe-area-inset-top, 0px)) max(12px, env(safe-area-inset-right, 0px)) 10px 14px !important;
    }

    body.rx-v36 .rx-live-opd-head button {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        min-width: 80px !important;
        padding-inline: 12px !important;
    }

    body.rx-v36 .rx-live-opd-mobile-toggle {
        display: inline-flex !important;
        align-items: center;
        right: max(12px, env(safe-area-inset-right, 0px));
        bottom: calc(60px + env(safe-area-inset-bottom, 0px));
    }
}

@media (max-width: 980px) {
    body.rx-v36 .rx30-dashboard-head,
    body.rx-v36 .rx30-dashboard-brand {
        align-items: flex-start !important;
    }

    body.rx-v36 .rx30-dashboard-head {
        flex-direction: column !important;
    }

    body.rx-v36 .rx30-system-state {
        width: 100% !important;
    }

    body.rx-v36 .rx30-primary-actions,
    body.rx-v36 .rx30-kpi-grid,
    body.rx-v36 .rx30-recent-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 720px) {
    body.rx-v36 .rx30-login-page {
        padding: 0 !important;
    }

    body.rx-v36 .rx30-login-shell {
        min-height: 100dvh !important;
        border-radius: 0 !important;
        border-inline: 0 !important;
    }

    body.rx-v36 .rx30-login-body {
        grid-template-columns: 1fr !important;
    }

    body.rx-v36 .rx30-feature-row,
    body.rx-v36 .rx30-login-context,
    body.rx-v36 .rx30-primary-actions,
    body.rx-v36 .rx30-kpi-grid,
    body.rx-v36 .rx30-recent-grid {
        grid-template-columns: 1fr !important;
    }

    body.rx-v36 .rx30-dashboard-brand {
        flex-direction: column !important;
        gap: 14px !important;
    }

    body.rx-v36 .rx30-dashboard-partners {
        display: flex !important;
        overflow-x: auto !important;
        padding-bottom: 6px !important;
        scroll-snap-type: x proximity;
    }

    body.rx-v36 .rx30-dashboard-partners a {
        flex: 0 0 min(180px, 72vw) !important;
        scroll-snap-align: start;
    }

    body.rx-v36 .rx30-form-options {
        align-items: flex-start !important;
        flex-direction: column !important;
    }
}

@media (max-width: 420px) {
    body.rx-v36 .rx30-input {
        grid-template-columns: 40px minmax(0, 1fr) auto !important;
    }

    body.rx-v36 .rx30-input kbd {
        display: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.rx-v36 *,
    body.rx-v36 *::before,
    body.rx-v36 *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

/* 2026-08-07 targeted repair of the EXISTING RX Billing dashboard.
   Keep the three primary work actions together on every viewport and stop older
   accessibility/responsive layers from collapsing them to 2/1 columns. */
body.rx-v36 .rx30-primary-actions.rx41-dashboard-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: clamp(6px, .9vw, 14px) !important;
  width: 100% !important;
  min-width: 0 !important;
}

body.rx-v36 .rx30-primary-actions.rx41-dashboard-actions > .rx30-primary-action {
  min-width: 0 !important;
  width: 100% !important;
}

/* Desktop/tablet: retain the existing card language, only normalize geometry. */
@media (min-width: 721px) {
  body.rx-v36 .rx30-primary-actions.rx41-dashboard-actions > .rx30-primary-action {
    min-height: 112px !important;
    padding: 14px !important;
  }
}

/* Mobile: three compact actions remain side-by-side rather than becoming a long list. */
@media (max-width: 720px) {
  body.rx-v36 .rx30-primary-actions.rx41-dashboard-actions {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 5px !important;
    padding-top: 0 !important;
  }

  body.rx-v36 .rx30-primary-actions.rx41-dashboard-actions > .rx30-primary-action {
    min-height: 78px !important;
    display: grid !important;
    grid-template-columns: 30px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 5px !important;
    padding: 7px 6px !important;
    border-width: 1px !important;
    border-top-width: 3px !important;
    border-radius: 10px !important;
    overflow: hidden !important;
  }

  body.rx-v36 .rx30-primary-actions.rx41-dashboard-actions .rx30-action-icon {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    font-size: 11px !important;
    border-radius: 9px !important;
  }

  body.rx-v36 .rx30-primary-actions.rx41-dashboard-actions b {
    display: -webkit-box !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    font-size: clamp(8px, 2.35vw, 10px) !important;
    line-height: 1.08 !important;
  }

  body.rx-v36 .rx30-primary-actions.rx41-dashboard-actions small,
  body.rx-v36 .rx30-primary-actions.rx41-dashboard-actions kbd {
    display: none !important;
  }
}

/* Very narrow phones still preserve all three actions without horizontal page scroll. */
@media (max-width: 390px) {
  body.rx-v36 .rx30-primary-actions.rx41-dashboard-actions {
    gap: 3px !important;
  }
  body.rx-v36 .rx30-primary-actions.rx41-dashboard-actions > .rx30-primary-action {
    min-height: 72px !important;
    grid-template-columns: 24px minmax(0, 1fr) !important;
    gap: 4px !important;
    padding: 5px 4px !important;
  }
  body.rx-v36 .rx30-primary-actions.rx41-dashboard-actions .rx30-action-icon {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    font-size: 9px !important;
  }
  body.rx-v36 .rx30-primary-actions.rx41-dashboard-actions b {
    font-size: 7.5px !important;
  }
}

/* Existing Billing topbar: prevent medium widths from wrapping or pushing controls
   into the content. This does not replace the header; it only fixes its geometry. */
body.rx-v36 .rx41-topbar {
  z-index: 320 !important;
}
@media (min-width: 900px) {
  body.rx-v36 .rx41-topbar {
    grid-template-columns: minmax(280px, 1fr) auto auto !important;
    align-items: center !important;
    gap: 8px !important;
    overflow: visible !important;
  }
  body.rx-v36 .rx41-topbar-brand,
  body.rx-v36 .rx41-runtime-context,
  body.rx-v36 .rx41-topbar-actions {
    min-width: 0 !important;
  }
  body.rx-v36 .rx41-runtime-context {
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
  }
}
@media (max-width: 899px) {
  body.rx-v36 .rx41-topbar {
    position: sticky !important;
    top: 0 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    width: 100% !important;
    min-width: 0 !important;
    overflow: visible !important;
  }
}


/* R18 authoritative Live OPD drawer geometry: controls must remain visible above the billing shell. */
@media(max-width:1199px){
  body.rx-v36 .rx-live-opd-rail,
  body.rx-v32 .rx-live-opd-rail{
    top:8px!important;right:8px!important;bottom:calc(var(--rx-mobile-statusbar-h,34px) + 8px)!important;left:auto!important;
    width:min(430px,calc(100vw - 16px))!important;height:auto!important;max-height:none!important;min-height:0!important;
    border-radius:16px!important;z-index:420!important;overflow:hidden!important;background:#fff!important
  }
  body.rx-v36 .rx-live-opd-backdrop,
  body.rx-v32 .rx-live-opd-backdrop{inset:0!important;z-index:410!important}
  body.rx-v36 .rx-live-opd-head,
  body.rx-v32 .rx-live-opd-head{
    display:flex!important;position:sticky!important;top:0!important;z-index:12!important;min-height:58px!important;
    padding:8px 9px!important;visibility:visible!important;opacity:1!important
  }
  body.rx-v36 .rx41-live-opd-controls,
  body.rx-v32 .rx41-live-opd-controls{display:flex!important;align-items:center!important;gap:6px!important;flex:0 0 auto!important}
  body.rx-v36 .rx41-live-opd-controls button,
  body.rx-v32 .rx41-live-opd-controls button{
    display:inline-flex!important;align-items:center!important;justify-content:center!important;width:40px!important;min-width:40px!important;
    height:40px!important;min-height:40px!important;padding:0!important;border:1px solid rgba(255,255,255,.48)!important;border-radius:10px!important;
    font-size:21px!important;line-height:1!important
  }
  body.rx-v36 .rx-live-opd-health,
  body.rx-v32 .rx-live-opd-health{flex:0 0 auto!important}
  body.rx-v36 .rx-live-opd-filter,
  body.rx-v32 .rx-live-opd-filter{flex:0 0 auto!important}
  body.rx-v36 .rx-live-doctor-filter,
  body.rx-v32 .rx-live-doctor-filter{flex:0 0 auto!important}
  body.rx-v36 .rx-live-opd-policy,
  body.rx-v32 .rx-live-opd-policy{flex:0 0 auto!important}
  body.rx-v36 .rx-live-opd-sessions,
  body.rx-v32 .rx-live-opd-sessions{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;overscroll-behavior:contain!important}
}
@media(max-width:520px){
  body.rx-v36 [data-r41-opd-minimize],body.rx-v32 [data-r41-opd-minimize]{display:none!important}
  body.rx-v36 .rx41-live-opd-controls button,body.rx-v32 .rx41-live-opd-controls button{width:42px!important;min-width:42px!important;height:42px!important;min-height:42px!important}
}

/* R19 creator-owned ticket cancellation in Live OPD */
.rx-live-recent-row{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto auto!important;align-items:center!important;gap:6px!important}
.rx-live-cancel-booking{min-height:28px!important;padding:4px 9px!important;border:1px solid #fecaca!important;border-radius:8px!important;background:#fff1f2!important;color:#b91c1c!important;font-weight:800!important;font-size:11px!important;cursor:pointer!important}
.rx-live-cancel-booking:hover{background:#fee2e2!important}.rx-live-cancel-booking:disabled{opacity:.6!important;cursor:wait!important}
@media(max-width:520px){.rx-live-recent-row{grid-template-columns:auto minmax(0,1fr) auto!important}.rx-live-recent-row em{grid-column:2}.rx-live-cancel-booking{grid-column:3;grid-row:1 / span 2}}