/* OdontoNic v41.34 · Responsive QA Final
   Capa final de compatibilidad visual para desktop, notebook, tablet y mobile.
   No agrega lógica: evita cortes, scrolls dobles, modales imposibles y layouts suicidas. */

:root {
  --om-safe-page-x: clamp(14px, 2.2vw, 34px);
  --om-safe-page-y: clamp(18px, 2.6vw, 40px);
  --om-min-tap: 44px;
}

html, body, #root, #vite-root { min-width: 0; }
body { overflow-x: hidden; }
main { min-width: 0; overflow-x: clip; }

img, svg, canvas, video { max-width: 100%; }

/* Textos largos y mails: que no empujen la UI al abismo. */
.serif, h1, h2, h3, h4, p, span, button, a, label, div {
  overflow-wrap: anywhere;
}
input, select, textarea {
  max-width: 100%;
}

/* Layout base: más margen seguro en pantallas raras. */
.page-pad,
.om-page-pad,
[class*="page-pad"],
[class*="PagePad"] {
  padding-left: var(--om-safe-page-x) !important;
  padding-right: var(--om-safe-page-x) !important;
}

/* Títulos gigantes premium: bonitos, pero sin comerse media tablet. */
h1,
.r-hero,
.serif[style*="font-size"] {
  max-width: 100%;
}

/* Botones y acciones táctiles. */
button,
[role="button"],
.btn,
.om-btn,
.pill,
.nav-item {
  min-height: var(--om-min-tap);
}

/* Contenedores horizontales: scroll local antes que romper el viewport entero. */
.r-scroll,
.om-scroll-x,
.table-wrap,
.data-wrap,
.table-scroll,
.om-data-table,
.om-data-table-wrap,
.docs-table-wrap,
.recetas-table-wrap,
.agenda-day-scroll,
.patient-tabs-scroll,
.om-tab-scroll {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-inline: contain;
  scrollbar-width: thin;
}

/* Pestañas: no envolver raro, desplazamiento táctil limpio. */
.patient-tabs-scroll,
.om-tab-scroll,
.r-scroll.om-tab-scroll {
  white-space: nowrap;
  scroll-padding-inline: 12px;
}
.patient-tabs-scroll > *,
.om-tab-scroll > *,
.r-scroll.om-tab-scroll > * {
  flex: 0 0 auto;
}

/* Modales globales: entran en pantalla y los botones no se pierden abajo. */
.om-modal-backdrop,
.om-portal-backdrop,
[class*="modal-backdrop"],
[class*="ModalBackdrop"] {
  padding: max(10px, env(safe-area-inset-top)) max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left)) !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: auto !important;
  overscroll-behavior: contain;
}

.om-modal-card,
.om-receta-modal
[class*="modal-card"],
[class*="ModalCard"] {
  width: min(960px, calc(100vw - 24px)) !important;
  max-width: calc(100vw - 24px) !important;
  max-height: calc(100dvh - 24px) !important;
  overflow: auto !important;
  -webkit-overflow-scrolling: touch;
}

.om-modal-actions,
.modal-actions,
[class*="modal-actions"],
[class*="ModalActions"] {
  position: sticky;
  bottom: 0;
  z-index: 4;
  background: linear-gradient(180deg, transparent 0%, var(--surface) 26%, var(--surface) 100%);
  padding-top: 14px !important;
  margin-bottom: -2px;
}

/* Grillas genéricas: bajar columnas antes de cortar cards. */
.r-stack,
.om-quick-grid,
.om-kpi-grid,
.dashboard-kpis,
.finance-kpis,
[class*="kpi-grid"],
[class*="KpiGrid"] {
  min-width: 0;
}

/* Agenda: prioridad absoluta porque la usan todos los días, pobres criaturas. */
.agenda-day-scroll,
.r-scroll.agenda-day-scroll {
  overflow-x: auto !important;
  overflow-y: visible !important;
  padding-bottom: 8px;
}
.agenda-day-scroll > div,
.r-scroll.agenda-day-scroll > div {
  min-width: 860px;
}

/* Evita que columnas/eventos de agenda se hagan microscópicos. */
.agenda-day-scroll [style*="grid-template-columns"],
.r-scroll.agenda-day-scroll [style*="grid-template-columns"] {
  min-width: 760px;
}

/* Listados tipo documentos/recetas/usuarios: respiración y scroll local. */
.docs-list-head,
.docs-list-row,
.om-data-table-head,
.om-data-table-row,
.desktop-table-head {
  min-width: 760px;
}

/* Portal paciente: columnas se apilan antes de quedar ilegibles. */
.portal-reserva-grid,
.pp-grid {
  min-width: 0;
}

/* Desktop chico / notebook 1366 y 1280 */
@media (min-width: 1101px) and (max-width: 1380px) {
  :root { --om-safe-page-x: 24px; }
  h1, .r-hero { font-size: clamp(46px, 5.4vw, 74px) !important; line-height: .98 !important; }
  .om-quick-grid,
  .om-kpi-grid,
  .dashboard-kpis,
  .finance-kpis,
  [class*="kpi-grid"],
  [class*="KpiGrid"] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  .om-modal-card,
  .om-receta-modal,
  [class*="modal-card"],
  [class*="ModalCard"] {
    max-width: min(900px, calc(100vw - 32px)) !important;
  }
}

/* Tablet landscape y notebooks bajos: compactar sin parecer app de juguete. */
@media (min-width: 861px) and (max-width: 1100px) {
  :root { --om-safe-page-x: 20px; --om-safe-page-y: 22px; }
  h1, .r-hero { font-size: clamp(40px, 6vw, 62px) !important; line-height: 1 !important; }
  .page-pad, .om-page-pad, [class*="page-pad"], [class*="PagePad"] {
    padding-top: var(--om-safe-page-y) !important;
    padding-bottom: 34px !important;
  }
  .om-quick-grid,
  .om-kpi-grid,
  .dashboard-kpis,
  .finance-kpis,
  [class*="kpi-grid"],
  [class*="KpiGrid"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .portal-reserva-grid,
  .pp-grid {
    grid-template-columns: 1fr !important;
  }
  .agenda-day-scroll > div,
  .r-scroll.agenda-day-scroll > div { min-width: 880px !important; }
}

/* Tablet portrait / mobile grande */
@media (min-width: 641px) and (max-width: 860px) {
  :root { --om-safe-page-x: 18px; --om-safe-page-y: 20px; }
  h1, .r-hero { font-size: clamp(36px, 7vw, 54px) !important; line-height: 1.02 !important; }
  .page-pad, .om-page-pad, [class*="page-pad"], [class*="PagePad"] {
    padding-top: var(--om-safe-page-y) !important;
    padding-bottom: 34px !important;
  }
  .r-wrap,
  .r-actions,
  .om-modal-actions,
  .modal-actions { flex-wrap: wrap !important; }
  .om-quick-grid,
  .om-kpi-grid,
  .dashboard-kpis,
  .finance-kpis,
  [class*="kpi-grid"],
  [class*="KpiGrid"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .om-form-grid,
  [class*="form-grid"],
  [class*="FormGrid"],
  .portal-reserva-grid,
  .pp-grid {
    grid-template-columns: 1fr !important;
  }
  .om-modal-card,
  .om-receta-modal,
  [class*="modal-card"],
  [class*="ModalCard"] {
    width: calc(100vw - 22px) !important;
    max-height: calc(100dvh - 22px) !important;
    border-radius: 22px !important;
    padding: 18px !important;
  }
  .agenda-day-scroll > div,
  .r-scroll.agenda-day-scroll > div { min-width: 780px !important; }
}

/* Mobile: usable para consulta rápida, no para cirugía de planillas. */
@media (max-width: 640px) {
  :root { --om-safe-page-x: 14px; --om-safe-page-y: 16px; --om-min-tap: 46px; }
  body { font-size: 14px; }
  h1, .r-hero { font-size: clamp(34px, 11vw, 46px) !important; line-height: 1.02 !important; }
  h2 { font-size: clamp(24px, 7vw, 32px) !important; }
  .page-pad, .om-page-pad, [class*="page-pad"], [class*="PagePad"] {
    padding: var(--om-safe-page-y) var(--om-safe-page-x) 28px !important;
  }
  .mobile-topbar { display: flex !important; }
  .r-stack,
  .om-quick-grid,
  .om-kpi-grid,
  .dashboard-kpis,
  .finance-kpis,
  [class*="kpi-grid"],
  [class*="KpiGrid"],
  .om-form-grid,
  [class*="form-grid"],
  [class*="FormGrid"],
  .portal-reserva-grid,
  .pp-grid {
    grid-template-columns: 1fr !important;
  }
  .r-actions,
  .r-wrap,
  .om-modal-actions,
  .modal-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
  }
  .r-actions > *,
  .om-modal-actions > button,
  .modal-actions > button {
    flex: 1 1 100%;
  }
  .om-modal-card,
  .om-receta-modal,
  [class*="modal-card"],
  [class*="ModalCard"] {
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - 16px) !important;
    border-radius: 20px !important;
    padding: 16px !important;
  }
  .agenda-day-scroll > div,
  .r-scroll.agenda-day-scroll > div { min-width: 720px !important; }
  .docs-list-head,
  .docs-list-row,
  .om-data-table-head,
  .om-data-table-row,
  .desktop-table-head { min-width: 720px; }
}

/* Muy bajo de alto: modales más compactos para notebooks 1366x768. */
@media (max-height: 780px) and (min-width: 900px) {
  .om-modal-card,
  .om-receta-modal,
  [class*="modal-card"],
  [class*="ModalCard"] {
    max-height: calc(100dvh - 18px) !important;
  }
  .om-modal-card h1,
  .om-modal-card h2,
  .om-modal-card .serif,
  [class*="modal-card"] h1,
  [class*="modal-card"] h2 {
    line-height: 1.05 !important;
  }
}

/* Print no debe heredar sombras/overflows raros. */
@media print {
  .app-sidebar,
  .mobile-topbar,
  .floating-help,
  .om-drag-scroll-ready { display: none !important; }
  main { margin-left: 0 !important; overflow: visible !important; }
}

/* v41.37 · Planes SaaS dinámicos y lista respirable */
.om-plans-page{max-width:1480px;margin:0 auto;padding:28px 34px 100px;}
.om-plans-hero{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:flex-end;margin-bottom:18px;}
.om-plans-hero .r-hero{font-size:clamp(34px,4vw,48px);margin:8px 0 0;font-weight:400;}
.om-muted{color:var(--ink-3);font-size:14px;line-height:1.45;}.om-muted.small{font-size:12.5px}.om-muted.tiny,.tiny{font-size:11px}.strong{font-weight:900;color:var(--ink)}
.om-chip-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.om-plans-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.om-plan-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:16px}.om-plan-kpi .tnum{font-size:28px;font-weight:900}.om-plan-catalog-card,.om-clinic-plans-card{margin-bottom:18px;overflow:hidden}.om-card-head-row{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;flex-wrap:wrap;padding:18px 20px;border-bottom:1px solid var(--line-soft);background:color-mix(in oklab,var(--surface),var(--surface-2) 26%)}.om-section-title{font-size:20px;font-weight:900;color:var(--ink);margin-top:3px}.om-plan-list{display:grid;gap:0}.om-plan-row{display:grid;grid-template-columns:minmax(260px,1.05fr) minmax(310px,1.1fr) minmax(150px,.45fr) auto;gap:14px;align-items:center;padding:16px 20px;border-bottom:1px solid var(--line-soft)}.om-plan-row:last-child{border-bottom:0}.om-plan-row-main{display:flex;gap:12px;align-items:flex-start;min-width:0}.om-icon-bubble.small{width:36px;height:36px;min-width:36px}.om-plan-title{font-size:18px;font-weight:900;color:var(--ink)}.om-plan-limits-inline{display:grid;grid-template-columns:repeat(4,minmax(68px,1fr));gap:8px}.om-plan-mini{padding:8px 10px;border-radius:14px;background:var(--surface-2);min-width:0}.om-plan-mini>div{color:var(--ink-4);font-size:9.5px;text-transform:uppercase;letter-spacing:.08em;font-weight:900}.om-plan-mini strong{display:block;color:var(--ink);font-size:13px;font-weight:900;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.om-plan-price-block{display:flex;gap:8px;flex-direction:column;align-items:flex-start}.om-plan-price-block .strong{font-size:13px}.om-plan-row-actions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.om-mini-btn{border:1px solid var(--line);background:var(--surface);color:var(--ink-2);border-radius:12px;padding:8px 10px;font:inherit;font-size:12px;font-weight:800;display:inline-flex;align-items:center;gap:6px;cursor:pointer}.om-mini-btn:hover{background:var(--surface-2)}.om-mini-btn.danger{color:var(--danger)}.om-mini-btn:disabled{opacity:.45;cursor:not-allowed}.om-table-tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.om-plans-table-wrap{overflow:auto;max-width:100%;}.om-plans-table-head,.om-plans-table-row{min-width:1180px;display:grid;grid-template-columns:minmax(230px,1fr) 150px minmax(280px,1.1fr) minmax(260px,.9fr) 140px 130px;gap:16px;align-items:center}.om-plans-table-head{padding:12px 20px;background:var(--surface-2);color:var(--ink-4);font-size:10px;text-transform:uppercase;letter-spacing:.1em;font-weight:900;border-bottom:1px solid var(--line-soft)}.om-plans-table-row{padding:18px 20px;border-bottom:1px solid var(--line-soft);background:var(--surface)}.om-plans-table-row:hover{background:color-mix(in oklab,var(--surface),var(--surface-2) 35%)}.om-clinic-cell{min-width:0}.om-source-ok,.om-source-warn{font-size:11px;margin-top:3px;font-weight:800}.om-source-ok{color:var(--sage)}.om-source-warn{color:var(--warn)}.om-billing-cell{min-width:0}.om-usage-grid{display:grid;grid-template-columns:repeat(2,minmax(90px,1fr));gap:8px}.om-plans-pager{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:13px 20px;border-top:1px solid var(--line-soft);color:var(--ink-4);font-size:12px;background:color-mix(in oklab,var(--surface),var(--surface-2) 22%)}.om-plan-editor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding-bottom:12px}.om-plan-editor-grid label{display:block}.om-plan-editor-grid .span-2{grid-column:span 2}.om-plan-check{display:flex!important;align-items:center;gap:9px;padding-top:22px;color:var(--ink-2);font-weight:800}.om-plan-check input{width:18px;height:18px}
@media (max-width: 1180px){.om-plans-page{padding:22px 18px 90px}.om-plan-row{grid-template-columns:1fr;align-items:start}.om-plan-limits-inline{grid-template-columns:repeat(4,minmax(72px,1fr))}.om-plan-row-actions{justify-content:flex-start}.om-plans-table-head,.om-plans-table-row{min-width:980px;grid-template-columns:220px 140px 260px 240px 130px 120px}.om-card-head-row{padding:16px}}
@media (max-width: 720px){.om-plans-page{padding:18px 12px 86px}.om-plans-actions,.om-plans-actions button{width:100%}.om-plan-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.om-plan-limits-inline{grid-template-columns:repeat(2,minmax(0,1fr))}.om-plan-editor-grid{grid-template-columns:1fr}.om-plan-editor-grid .span-2{grid-column:span 1}.om-table-tools,.om-table-tools input{width:100%}.om-card-head-row{display:block}.om-plans-pager{align-items:flex-start}.om-plans-table-head,.om-plans-table-row{min-width:900px}.om-section-title{font-size:18px}}

/* v41.38 · Planes SaaS visual reset + modal global hardening */
.om-global-modal-backdrop{z-index:2147483000!important;overscroll-behavior:contain;}
.om-global-modal-card{max-width:calc(100vw - 24px)!important;}
@media (max-width:720px){.om-global-modal-card{border-radius:22px!important;max-height:calc(100dvh - 20px)!important}.om-global-modal-card h2{font-size:24px!important}.om-global-modal-card>div{padding-left:18px!important;padding-right:18px!important}}

.om-subscription-list{display:grid;gap:14px;padding:18px;background:color-mix(in oklab,var(--surface),var(--surface-2) 16%)}
.om-subscription-card{display:grid;gap:16px;padding:18px;border:1px solid var(--line-soft);border-radius:24px;background:var(--surface);box-shadow:0 16px 44px -34px oklch(0.24 0.03 250/.35)}
.om-subscription-main{display:grid;grid-template-columns:minmax(240px,1.05fr) minmax(220px,.75fr) minmax(170px,.5fr);gap:18px;align-items:start}
.om-subscription-title{font-size:17px;line-height:1.2;color:var(--ink)}
.om-subscription-plan select{height:48px;font-size:15px;border-radius:16px!important;background:var(--surface)!important}
.om-subscription-state{display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap}.om-subscription-state .eyebrow{width:100%}
.om-subscription-details{display:grid;grid-template-columns:minmax(340px,1.2fr) minmax(300px,.9fr);gap:18px;align-items:start}
.om-subscription-block{padding:14px;border-radius:20px;background:var(--surface-2);border:1px solid var(--line-soft);min-width:0}
.om-subscription-block .om-billing-cell{margin-top:8px}.om-subscription-block .om-usage-grid{margin-top:8px}
.om-clinic-plans-card{overflow:hidden!important}.om-clinic-plans-card .om-card-head-row{position:sticky;top:0;z-index:1}
.om-plan-editor-grid{gap:16px!important}.om-plan-editor-grid textarea{min-height:96px}.om-plan-editor-grid input,.om-plan-editor-grid textarea{font-size:14px!important}
@media (max-width:1180px){.om-subscription-main{grid-template-columns:1fr 1fr}.om-subscription-state{grid-column:1/-1}.om-subscription-details{grid-template-columns:1fr}}
@media (max-width:720px){.om-subscription-list{padding:12px;gap:12px}.om-subscription-card{padding:14px;border-radius:20px}.om-subscription-main{grid-template-columns:1fr;gap:14px}.om-subscription-details{gap:12px}.om-subscription-block{padding:12px}.om-subscription-state button{width:100%;justify-content:center}.om-usage-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.om-plan-kpis{grid-template-columns:1fr 1fr!important}.om-plan-row{padding:14px!important}}