/* OdontoNic v1.1 Evolución · build 41.87.0
 * CSS legacy consolidado. El orden de las secciones replica exactamente index.html v41.73.93.
 * No editar este archivo a mano. Ejecutar: npm run css:bundle
 */


/* ===== BEGIN styles.css ===== */

/* OdontoNic · Centro Legal */
@media (max-width: 980px) {
  .legal-layout { grid-template-columns: 1fr !important; }
  .legal-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 560px) {
  .legal-kpis { grid-template-columns: 1fr !important; }
}

/* v41.9 Product UX - Documentos: lista por defecto y miniaturas como opción */
@media (max-width: 980px) {
  .docs-list-head { display: none !important; }
  .docs-list-row {
    grid-template-columns: 1fr auto !important;
    gap: 10px !important;
  }
  .docs-list-row > div:nth-child(2),
  .docs-list-row > div:nth-child(3),
  .docs-list-row > span:nth-child(4),
  .docs-list-row > div:nth-child(5) {
    display: none !important;
  }
}

/* v41.73.4 · Selector de clínica mobile-first */
.om-clinic-picker-backdrop {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
  background: oklch(0.18 0.02 250 / 0.42);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.om-clinic-picker-shell {
  width: min(760px, 100%);
  max-height: min(860px, calc(100dvh - 36px));
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: 28px;
  padding: 24px;
  box-shadow: 0 30px 90px oklch(0.22 0.03 250 / 0.24);
}

.om-clinic-picker-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
  flex: 0 0 auto;
}

.om-clinic-picker-icon {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  flex: 0 0 48px;
  display: grid;
  place-items: center;
  background: var(--accent-soft);
  color: var(--accent);
}

.om-clinic-picker-copy { min-width: 0; }

.om-clinic-picker-title {
  color: var(--ink);
  font-size: clamp(25px, 3vw, 30px);
  line-height: 1.05;
}

.om-clinic-picker-subtitle {
  color: var(--ink-3);
  font-size: 14px;
  line-height: 1.45;
  margin-top: 5px;
}

.om-clinic-picker-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 2px 3px 4px 2px;
  scrollbar-gutter: stable;
}

.om-clinic-picker-card {
  appearance: none;
  width: 100%;
  min-width: 0;
  min-height: 130px;
  text-align: left;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 14px;
  padding: 16px;
  border: 1px solid var(--line-soft);
  border-radius: 18px;
  background: var(--surface-2);
  color: var(--ink);
  cursor: pointer;
  box-shadow: 0 10px 28px oklch(0.25 0.03 250 / 0.06);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.om-clinic-picker-card:hover:not(:disabled),
.om-clinic-picker-card:focus-visible {
  transform: translateY(-2px);
  border-color: color-mix(in oklab, var(--accent), var(--line-soft) 45%);
  background: color-mix(in oklab, var(--accent-soft), var(--surface-2) 78%);
  box-shadow: 0 16px 34px oklch(0.25 0.03 250 / 0.10);
  outline: none;
}

.om-clinic-picker-card:disabled {
  cursor: wait;
  opacity: .72;
}

.om-clinic-picker-card-main { min-width: 0; }

.om-clinic-picker-name {
  font-weight: 900;
  font-size: 17px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.om-clinic-picker-contact {
  color: var(--ink-3);
  font-size: 12px;
  line-height: 1.35;
  margin-top: 7px;
  overflow-wrap: anywhere;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.om-clinic-picker-card-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.om-clinic-picker-role {
  display: inline-flex;
  min-width: 0;
  max-width: 65%;
  padding: 5px 9px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-weight: 800;
  font-size: 11px;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.om-clinic-picker-enter {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--ink-2);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.om-clinic-picker-enter > span {
  font-size: 20px;
  line-height: 12px;
  color: var(--accent);
}

.om-clinic-picker-note {
  flex: 0 0 auto;
  margin-top: 14px;
  padding: 11px 13px;
  border-radius: 15px;
  background: var(--surface-2);
  color: var(--ink-3);
  font-size: 12.5px;
  line-height: 1.4;
}

@media (max-width: 700px) {
  .om-clinic-picker-backdrop {
    align-items: stretch;
    padding: 0;
    background: var(--bg);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .om-clinic-picker-shell {
    width: 100%;
    height: 100dvh;
    max-height: 100dvh;
    border: 0;
    border-radius: 0;
    padding: max(18px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));
    box-shadow: none;
  }

  .om-clinic-picker-header {
    align-items: flex-start;
    gap: 11px;
    margin-bottom: 14px;
  }

  .om-clinic-picker-icon {
    width: 42px;
    height: 42px;
    flex-basis: 42px;
    border-radius: 14px;
  }

  .om-clinic-picker-title {
    font-size: clamp(24px, 7vw, 28px);
    line-height: 1.08;
  }

  .om-clinic-picker-subtitle {
    font-size: 13px;
    line-height: 1.4;
    margin-top: 6px;
  }

  .om-clinic-picker-grid {
    grid-template-columns: 1fr;
    gap: 10px;
    padding-right: 1px;
  }

  .om-clinic-picker-card {
    min-height: 0;
    padding: 14px;
    border-radius: 16px;
    gap: 12px;
  }

  .om-clinic-picker-name { font-size: 16px; }
  .om-clinic-picker-contact { -webkit-line-clamp: 1; }

  .om-clinic-picker-note {
    margin-top: 10px;
    padding: 10px 11px;
    font-size: 11.5px;
  }
}

@media (max-width: 380px) {
  .om-clinic-picker-shell { padding-left: 12px; padding-right: 12px; }
  .om-clinic-picker-subtitle { font-size: 12.5px; }
  .om-clinic-picker-card { padding: 13px; }
  .om-clinic-picker-note { display: none; }
}

/* v41.73.41 · Ajustes QA responsive plataforma */
@media (max-width: 980px) {
  .sa-top-tabs { overflow-x: auto; scrollbar-width: thin; }
}
@media (max-width: 720px) {
  .legal-actions-stack { width: 100%; }
  .legal-actions-stack > * { width: 100%; }
}

/* v41.73.50 · Centro de notificaciones y mensajes */
.om-notifications-page{max-width:1280px;margin:0 auto;padding:28px 32px 96px}.om-notif-hero{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:22px;flex-wrap:wrap}.om-notif-hero h1{font-size:48px;margin:8px 0 0;font-weight:400;line-height:1.02}.om-notif-toolbar{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px;flex-wrap:wrap}.om-notif-tabs{display:flex;gap:8px;flex-wrap:wrap}.om-notif-tabs button{border:1px solid var(--line);background:var(--surface);color:var(--ink-3);border-radius:14px;padding:10px 14px;font:inherit;font-weight:800;cursor:pointer}.om-notif-tabs button.active{background:var(--accent);border-color:var(--accent);color:#fff}.om-notif-tabs span{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;margin-left:6px;border-radius:999px;background:color-mix(in oklab,currentColor,transparent 85%);font-size:11px}.om-notif-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.om-notif-actions select,.om-notif-compose-grid select,.om-notif-compose-grid input,.om-notif-compose-grid textarea{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:14px;padding:10px 12px;font:inherit;outline:none}.om-notif-list-card{overflow:hidden}.om-notif-row{width:100%;border:0;border-bottom:1px solid var(--line-soft);background:var(--surface);display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:14px 18px;text-align:left;cursor:pointer;color:inherit}.om-notif-row:last-child{border-bottom:0}.om-notif-row:hover{background:var(--surface-2)}.om-notif-row.read{opacity:.78}.om-notif-row.unread{background:color-mix(in oklab,var(--accent-soft),var(--surface) 58%)}.om-notif-row-title{font-size:14px;font-weight:900;color:var(--ink)}.om-notif-row-preview{font-size:13px;color:var(--ink-3);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.om-notif-row-meta{font-size:10.5px;color:var(--ink-4);margin-top:5px}.om-notif-unread-dot{width:9px;height:9px;border-radius:50%;background:var(--accent)}.om-notif-delete,.om-notif-icon-btn{width:34px;height:34px;border-radius:11px;border:1px solid var(--line-soft);background:var(--surface);color:var(--ink-3);display:grid;place-items:center;cursor:pointer}.om-notif-preview-backdrop{position:fixed;inset:0;z-index:120;background:oklch(0.16 0.02 250/.46);backdrop-filter:blur(7px);display:flex;justify-content:flex-end}.om-notif-preview{width:min(520px,100%);height:100%;background:var(--surface);box-shadow:-24px 0 70px rgba(15,23,42,.22);padding:24px;overflow:auto;display:flex;flex-direction:column}.om-notif-preview-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}.om-notif-preview-title{font-size:30px;margin-top:6px;line-height:1.08}.om-notif-preview-meta{color:var(--ink-4);font-size:12px;margin-top:18px}.om-notif-preview-body{font-size:15px;color:var(--ink-2);line-height:1.7;margin-top:22px;white-space:pre-wrap}.om-notif-preview-summary{margin-top:18px;padding:14px;border-radius:16px;background:var(--surface-2);color:var(--ink-3);font-size:13px;line-height:1.55}.om-notif-preview-actions{display:flex;gap:9px;justify-content:flex-end;flex-wrap:wrap;margin-top:auto;padding-top:24px}.om-notif-compose-grid{display:grid;gap:14px;margin-top:22px}.om-notif-compose-grid label{display:grid;gap:7px}.om-notif-compose-grid textarea{resize:vertical;min-height:150px}.om-notif-bell-wrap{position:relative}.om-notif-bell{width:38px;height:38px;border-radius:12px;border:1px solid var(--line-soft);background:oklch(from var(--surface) l c h/.9);color:var(--ink-3);display:grid;place-items:center;cursor:pointer;position:relative;box-shadow:0 10px 24px oklch(0.22 0.02 250/.08)}.om-notif-bell>span{position:absolute;top:-6px;right:-6px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:var(--danger);color:#fff;font-size:10px;font-weight:900;display:grid;place-items:center;border:2px solid var(--surface)}.om-notif-popover-backdrop{position:fixed;inset:0;z-index:38}.om-notif-popover{position:absolute;right:0;top:46px;width:360px;max-height:460px;overflow:auto;background:var(--surface);border:1px solid var(--line-soft);border-radius:18px;box-shadow:0 24px 70px rgba(15,23,42,.22);z-index:39}.om-notif-popover-head{display:flex;justify-content:space-between;gap:12px;padding:14px 15px;border-bottom:1px solid var(--line-soft)}.om-notif-popover-head button{border:0;background:transparent;color:var(--accent);font:inherit;font-size:11px;font-weight:800;cursor:pointer}.om-notif-popover-row{width:100%;display:grid;grid-template-columns:8px 1fr;gap:10px;padding:12px 15px;border:0;border-bottom:1px solid var(--line-soft);background:var(--surface);text-align:left;color:inherit;cursor:pointer}.om-notif-popover-row:hover{background:var(--surface-2)}.om-notif-popover-row .dot{width:7px;height:7px;border-radius:50%;background:var(--accent);margin-top:5px}.om-notif-popover-row b{display:block;font-size:12.5px;color:var(--ink)}.om-notif-popover-row small{display:block;font-size:11.5px;color:var(--ink-3);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.om-notif-popover-all{width:100%;border:0;background:var(--surface-2);color:var(--accent);padding:12px;font:inherit;font-weight:900;cursor:pointer}.om-notif-popover-empty{padding:22px;text-align:center;color:var(--ink-4);font-size:13px}
@media(max-width:900px){.om-notifications-page{padding:22px 18px 90px}.om-notif-hero h1{font-size:40px}.om-notif-popover{position:fixed;right:12px;left:12px;top:64px;width:auto}.om-notif-preview{width:min(480px,100%)}}
@media(max-width:600px){.om-notifications-page{padding:18px 12px 86px}.om-notif-hero{align-items:stretch}.om-notif-hero h1{font-size:34px}.om-notif-hero>button{width:100%}.om-notif-toolbar,.om-notif-actions{align-items:stretch}.om-notif-tabs,.om-notif-tabs button,.om-notif-actions,.om-notif-actions select,.om-notif-actions button{width:100%}.om-notif-tabs{display:grid;grid-template-columns:1fr 1fr}.om-notif-row{grid-template-columns:auto minmax(0,1fr) auto;padding:13px 12px}.om-notif-delete{grid-column:3;grid-row:1}.om-notif-unread-dot{position:absolute}.om-notif-row-preview{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.om-notif-preview{padding:18px}.om-notif-preview-title{font-size:25px}.om-notif-preview-actions>*{width:100%}}
/* ===== END styles.css ===== */


/* ===== BEGIN responsive-fix.css ===== */
/* responsive-fix.css — OdontoNic v1.8.5 */
/* Fix real aplicado al componente Tabs de ui.jsx. */

html,
body,
#root {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

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

input,
select,
textarea,
button {
  max-width: 100%;
}

main,
section,
aside,
article,
.page-pad,
.r-wrap,
.r-actions,
.r-stack,
.r-full-phone {
  min-width: 0;
  max-width: 100%;
}

.r-wrap > *,
.r-actions > *,
.r-stack > *,
.r-full-phone > * {
  min-width: 0;
}

.mono,
.tnum,
td,
th,
p,
span,
div {
  overflow-wrap: anywhere;
}

/* Tabs: scroll horizontal propio y scrollbar visible */
.r-scroll.om-tab-scroll,
.om-tab-scroll,
.patient-tabs-scroll {
  display: flex !important;
  flex-wrap: nowrap !important;
  max-width: 100% !important;
  width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-width: thin !important;
  scrollbar-color: color-mix(in oklab, var(--accent), transparent 25%) transparent !important;
  padding-bottom: 7px !important;
}

.r-scroll.om-tab-scroll::-webkit-scrollbar,
.om-tab-scroll::-webkit-scrollbar,
.patient-tabs-scroll::-webkit-scrollbar {
  height: 8px !important;
  display: block !important;
}

.r-scroll.om-tab-scroll::-webkit-scrollbar-track,
.om-tab-scroll::-webkit-scrollbar-track,
.patient-tabs-scroll::-webkit-scrollbar-track {
  background: color-mix(in oklab, var(--surface-2), transparent 10%) !important;
  border-radius: 999px !important;
}

.r-scroll.om-tab-scroll::-webkit-scrollbar-thumb,
.om-tab-scroll::-webkit-scrollbar-thumb,
.patient-tabs-scroll::-webkit-scrollbar-thumb {
  background: var(--accent) !important;
  border-radius: 999px !important;
}

.r-scroll.om-tab-scroll > *,
.om-tab-scroll > *,
.patient-tabs-scroll > *,
.r-scroll.om-tab-scroll button,
.om-tab-scroll button,
.patient-tabs-scroll button {
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}

/* Tablas/listas anchas: scroll interno */
.om-scroll-x,
.table-wrap,
.data-wrap,
.report-table,
.caja-table {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
}

.om-scroll-x table,
.table-wrap table,
.data-wrap table,
.report-table table,
.caja-table table {
  min-width: 680px;
}

.card,
.Card,
[class*="card"],
[class*="Card"] {
  min-width: 0;
  max-width: 100%;
}

@media (max-width: 1180px) {
  .page-pad {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  .r-wrap {
    flex-wrap: wrap !important;
  }

  .r-actions {
    flex-wrap: wrap !important;
  }
}

@media (max-width: 860px) {
  .page-pad {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .r-stack {
    display: flex !important;
    flex-direction: column !important;
  }

  .r-actions {
    width: 100%;
  }

  .r-actions > button,
  .r-actions > a {
    flex: 1 1 150px;
  }
}

@media (max-width: 560px) {
  .page-pad {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .r-hero {
    font-size: clamp(30px, 10vw, 42px) !important;
  }

  .r-full-phone {
    width: 100% !important;
  }

  .r-scroll.om-tab-scroll button,
  .om-tab-scroll button,
  .patient-tabs-scroll button {
    font-size: 13px !important;
  }
}


/* v41.6 visual polish: tabs, KPI cards and modal recipes */
.r-scroll.om-tab-scroll,
.om-tab-scroll,
.patient-tabs-scroll {
  scrollbar-width: thin !important;
  scrollbar-color: color-mix(in oklab, var(--accent), transparent 55%) transparent !important;
  padding-bottom: 4px !important;
}
.r-scroll.om-tab-scroll::-webkit-scrollbar,
.om-tab-scroll::-webkit-scrollbar,
.patient-tabs-scroll::-webkit-scrollbar { height: 5px !important; }
.r-scroll.om-tab-scroll::-webkit-scrollbar-thumb,
.om-tab-scroll::-webkit-scrollbar-thumb,
.patient-tabs-scroll::-webkit-scrollbar-thumb {
  background: color-mix(in oklab, var(--accent), transparent 48%) !important;
}
.om-premium-card,
.om-card,
[class*="Card"] { overflow: visible; }
.om-kpi-value,
.mono.tnum {
  overflow-wrap: normal !important;
  word-break: normal !important;
}
.om-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 9998;
  display: grid;
  place-items: center;
  padding: 24px;
  background: color-mix(in oklab, var(--ink), transparent 72%);
  backdrop-filter: blur(10px);
}
.om-modal-card {
  width: min(920px, 100%);
  max-height: min(88vh, 860px);
  overflow: auto;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 28px;
  box-shadow: 0 30px 90px rgba(15, 23, 42, .22);
  padding: 24px;
}
.om-modal-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line-soft);
  margin-bottom: 16px;
}
.om-modal-x {
  width: 38px;
  height: 38px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface-2);
  color: var(--ink-2);
  font: inherit;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}
.om-receta-templates {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}
.om-receta-templates button {
  border: 0;
  cursor: pointer;
  border-radius: 999px;
  padding: 8px 13px;
  background: var(--surface-2);
  color: var(--ink-2);
  font-family: inherit;
  font-size: 12.5px;
}
.om-receta-templates button:hover { background: var(--accent-soft); color: var(--accent); }
.om-receta-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 13px;
}
.om-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--line-soft);
}
@media (max-width: 760px) {
  .om-modal-backdrop { padding: 12px; place-items: end center; }
  .om-modal-card { width: 100%; max-height: 92vh; border-radius: 22px 22px 0 0; padding: 18px; }
  .om-receta-grid { grid-template-columns: 1fr; }
}


/* v41.7 navegación: top automático y flechas/scrollbars más visibles */
.r-scroll.om-tab-scroll,
.om-tab-scroll,
.patient-tabs-scroll {
  scrollbar-width: auto !important;
  padding-bottom: 8px !important;
}
.r-scroll.om-tab-scroll::-webkit-scrollbar,
.om-tab-scroll::-webkit-scrollbar,
.patient-tabs-scroll::-webkit-scrollbar {
  height: 10px !important;
}
.r-scroll.om-tab-scroll::-webkit-scrollbar-button:single-button,
.om-tab-scroll::-webkit-scrollbar-button:single-button,
.patient-tabs-scroll::-webkit-scrollbar-button:single-button {
  display: block !important;
  width: 18px !important;
  height: 10px !important;
  background-color: transparent !important;
}
.r-scroll.om-tab-scroll::-webkit-scrollbar-button:single-button:horizontal:decrement,
.om-tab-scroll::-webkit-scrollbar-button:single-button:horizontal:decrement,
.patient-tabs-scroll::-webkit-scrollbar-button:single-button:horizontal:decrement {
  background: linear-gradient(135deg, transparent 45%, var(--accent) 46% 58%, transparent 59%) center / 12px 12px no-repeat !important;
}
.r-scroll.om-tab-scroll::-webkit-scrollbar-button:single-button:horizontal:increment,
.om-tab-scroll::-webkit-scrollbar-button:single-button:horizontal:increment,
.patient-tabs-scroll::-webkit-scrollbar-button:single-button:horizontal:increment {
  background: linear-gradient(315deg, transparent 45%, var(--accent) 46% 58%, transparent 59%) center / 12px 12px no-repeat !important;
}
.r-scroll.om-tab-scroll::-webkit-scrollbar-thumb,
.om-tab-scroll::-webkit-scrollbar-thumb,
.patient-tabs-scroll::-webkit-scrollbar-thumb {
  min-width: 46px !important;
  background: color-mix(in oklab, var(--accent), transparent 22%) !important;
}
.om-sidebar-section-chevron {
  font-size: 22px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
}
.sidebar-collapse-btn span,
button[aria-label="Contraer menú"] span,
button[aria-label="Expandir menú"] span {
  font-size: 22px !important;
  font-weight: 800 !important;
}
/* ===== END responsive-fix.css ===== */


/* ===== BEGIN premium-ui.css ===== */
/* premium-ui.css — OdontoNic V3.0 UI/UX Premium */

:root {
  --premium-shadow: 0 24px 70px oklch(0.25 0.03 55 / 0.12);
  --premium-shadow-soft: 0 12px 35px oklch(0.25 0.03 55 / 0.08);
  --premium-glass: oklch(from var(--surface) l c h / 0.78);
  --premium-border: color-mix(in oklab, var(--line-soft), transparent 15%);
}

body {
  background:
    radial-gradient(circle at 12% 8%, color-mix(in oklab, var(--accent-soft), transparent 35%), transparent 32vw),
    radial-gradient(circle at 88% 12%, color-mix(in oklab, var(--sage-soft), transparent 42%), transparent 30vw),
    var(--bg);
}

.app-sidebar {
  box-shadow: 8px 0 40px oklch(0.25 0.03 55 / 0.045);
}

.page-pad {
  animation: omFadeUp .32s ease both;
}

@keyframes omFadeUp {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

.om-premium-hero {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--premium-border);
  background:
    linear-gradient(135deg, color-mix(in oklab, var(--surface), transparent 0%), color-mix(in oklab, var(--surface-2), transparent 18%)),
    radial-gradient(circle at 12% 18%, color-mix(in oklab, var(--accent-soft), transparent 15%), transparent 45%),
    radial-gradient(circle at 86% 20%, color-mix(in oklab, var(--sage-soft), transparent 15%), transparent 40%);
  box-shadow: var(--premium-shadow);
  border-radius: 28px;
}

.om-premium-hero::after {
  content: "";
  position: absolute;
  inset: -60% auto auto 45%;
  width: 520px;
  height: 520px;
  background: radial-gradient(circle, color-mix(in oklab, var(--accent), transparent 86%), transparent 62%);
  pointer-events: none;
}

.om-premium-card {
  border: 1px solid var(--premium-border) !important;
  background: var(--premium-glass) !important;
  backdrop-filter: blur(14px);
  box-shadow: var(--premium-shadow-soft);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.om-premium-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--premium-shadow);
  border-color: color-mix(in oklab, var(--accent), transparent 65%) !important;
}

.om-kpi-value {
  font-size: clamp(21px, 1.65vw, 30px);
  line-height: 1;
  letter-spacing: -0.035em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.om-section-title {
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1.05;
  letter-spacing: -0.035em;
}

.om-quick-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 14px;
}

.om-action-tile {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid var(--premium-border);
  background: var(--surface);
  cursor: pointer;
  transition: .18s ease;
  text-align: left;
  color: var(--ink);
  font-family: inherit;
}

.om-action-tile:hover {
  transform: translateY(-2px);
  background: var(--surface-2);
  border-color: color-mix(in oklab, var(--accent), transparent 62%);
}

.om-icon-bubble {
  width: 42px;
  height: 42px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: var(--accent-soft);
  color: var(--accent-2);
  flex: 0 0 auto;
}

.om-timeline {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.om-timeline-item {
  position: relative;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line-soft);
  border-radius: 18px;
  background: var(--surface);
}

.om-timeline-dot {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--sage-soft);
  color: var(--sage);
}

.om-patient-portal-shell {
  min-height: 100vh;
  background:
    radial-gradient(circle at 16% 0%, color-mix(in oklab, var(--accent-soft), transparent 18%), transparent 42vw),
    radial-gradient(circle at 86% 10%, color-mix(in oklab, var(--sage-soft), transparent 15%), transparent 36vw),
    linear-gradient(180deg, var(--bg), var(--surface-2));
}

.om-portal-card {
  border: 1px solid var(--premium-border);
  box-shadow: var(--premium-shadow-soft);
  border-radius: 26px;
}

.om-empty-state {
  padding: 34px 22px;
  text-align: center;
  color: var(--ink-4);
}

.om-empty-state .serif {
  color: var(--ink);
  font-size: 24px;
  margin-bottom: 6px;
}

@media (max-width: 760px) {
  .om-premium-hero {
    border-radius: 22px;
  }

  .om-action-tile {
    padding: 14px;
  }

  .om-kpi-value {
    font-size: 24px;
  }
}


/* ─────────────────────────────────────────────────────────────
   OdontoNic V3.2.2 Restore Fix · Sidebar agrupado premium
   ───────────────────────────────────────────────────────────── */

.om-sidebar-grouped {
  background:
    linear-gradient(180deg, color-mix(in oklab, var(--surface), transparent 0%), color-mix(in oklab, var(--surface-2), transparent 65%));
}

.om-sidebar-grouped nav {
  scrollbar-width: thin;
  scrollbar-color: color-mix(in oklab, var(--ink-4), transparent 65%) transparent;
}

.om-sidebar-grouped nav::-webkit-scrollbar {
  width: 6px;
}

.om-sidebar-grouped nav::-webkit-scrollbar-thumb {
  background: color-mix(in oklab, var(--ink-4), transparent 65%);
  border-radius: 999px;
}

.om-sidebar-section {
  position: relative;
  padding-top: 10px;
  margin-top: 8px;
}

.om-sidebar-section:not(:first-child)::before {
  content: "";
  position: absolute;
  left: 8px;
  right: 8px;
  top: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--line-soft), transparent);
}

.om-sidebar-section-head {
  width: 100%;
  border: none;
  background: transparent;
  color: var(--ink-4);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 7px 9px;
  cursor: pointer;
  font-size: 10px;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  font-weight: 750;
  border-radius: 12px;
}

.om-sidebar-section-head:hover {
  background: color-mix(in oklab, var(--surface-2), transparent 20%);
  color: var(--ink-2);
}

.om-sidebar-section-chevron {
  display: inline-block;
  transition: transform .22s ease;
}

.om-sidebar-section-chevron.open {
  transform: rotate(90deg);
}

.om-sidebar-section-body {
  display: grid;
  overflow: hidden;
  transition: grid-template-rows .24s ease, opacity .22s ease, transform .22s ease;
}

.om-sidebar-section-body.open {
  grid-template-rows: 1fr;
  opacity: 1;
  transform: translateY(0);
}

.om-sidebar-section-body.closed {
  grid-template-rows: 0fr;
  opacity: .25;
  transform: translateY(-3px);
}

.om-sidebar-section-body-inner {
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.om-clinic-card {
  margin: 0 4px 14px;
  padding: 10px 12px;
  border: 1px solid var(--line-soft);
  border-radius: 16px;
  background: color-mix(in oklab, var(--accent-soft), var(--surface-2) 72%);
}

.om-clinic-card-title {
  font-size: 10px;
  color: var(--ink-3);
  text-transform: uppercase;
  letter-spacing: .12em;
}

.om-clinic-card-name {
  font-size: 13px;
  color: var(--ink);
  font-weight: 700;
  margin-top: 4px;
  overflow-wrap: anywhere;
}

.om-clinic-card-plan {
  font-size: 11px;
  color: var(--ink-2);
  margin-top: 3px;
}

.om-premium-card {
  border: 1px solid var(--line-soft);
  box-shadow: 0 18px 55px oklch(0.25 0.03 55 / 0.08);
}

.om-empty-state {
  padding: 32px 20px;
  text-align: center;
  color: var(--ink-4);
}

.om-empty-state .serif {
  color: var(--ink);
  font-size: 24px;
  margin-bottom: 6px;
}

@media (max-width: 760px) {
  .om-sidebar-section {
    margin-top: 6px;
    padding-top: 8px;
  }
}


/* V3.3 Plataforma vs Clínica */
.om-sidebar-section {
  position: relative;
  padding-top: 10px;
  margin-top: 8px;
}

.om-sidebar-section:not(:first-child)::before {
  content: "";
  position: absolute;
  left: 8px;
  right: 8px;
  top: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--line-soft), transparent);
}

.om-sidebar-section-head {
  width: 100%;
  border: none;
  background: transparent;
  color: var(--ink-4);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 7px 9px;
  cursor: pointer;
  font-size: 10px;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  font-weight: 750;
  border-radius: 12px;
}

.om-sidebar-section-head:hover {
  background: color-mix(in oklab, var(--surface-2), transparent 20%);
  color: var(--ink-2);
}

.om-sidebar-section-chevron {
  display: inline-block;
  transition: transform .22s ease;
}

.om-sidebar-section-chevron.open {
  transform: rotate(90deg);
}

.om-sidebar-section-body {
  display: grid;
  overflow: hidden;
  transition: grid-template-rows .24s ease, opacity .22s ease, transform .22s ease;
}

.om-sidebar-section-body.open {
  grid-template-rows: 1fr;
  opacity: 1;
  transform: translateY(0);
}

.om-sidebar-section-body.closed {
  grid-template-rows: 0fr;
  opacity: .25;
  transform: translateY(-3px);
}

.om-sidebar-section-body-inner {
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.om-clinic-card {
  margin: 0 4px 14px;
  padding: 10px 12px;
  border: 1px solid var(--line-soft);
  border-radius: 16px;
  background: color-mix(in oklab, var(--accent-soft), var(--surface-2) 72%);
}

.om-clinic-card-title {
  font-size: 10px;
  color: var(--ink-3);
  text-transform: uppercase;
  letter-spacing: .12em;
}

.om-clinic-card-name {
  font-size: 13px;
  color: var(--ink);
  font-weight: 700;
  margin-top: 4px;
  overflow-wrap: anywhere;
}

.om-clinic-card-plan {
  font-size: 11px;
  color: var(--ink-2);
  margin-top: 3px;
}

/* V3.4.4 User Management — la tabla ahora scrollea en horizontal dentro de su
   card (overflowX:auto + minWidth), así que la cabecera permanece visible y
   alineada con las filas en cualquier ancho. Se elimina el ocultado previo. */

/* OdontoNic V11 · Sidebar fijo/contraíble */
.app-sidebar {
  position: sticky;
  top: 0;
  align-self: flex-start;
  height: 100dvh;
  max-height: 100dvh;
}

.om-sidebar-grouped.is-collapsed nav::-webkit-scrollbar {
  width: 0;
}

.om-sidebar-section.is-collapsed {
  padding-top: 4px;
  margin-top: 4px;
}

.om-sidebar-section.is-collapsed:not(:first-child)::before {
  left: 17px;
  right: 17px;
  opacity: .65;
}

.om-sidebar-grouped.is-collapsed .om-sidebar-section-body {
  grid-template-rows: 1fr !important;
  opacity: 1 !important;
  transform: none !important;
}

.om-sidebar-grouped.is-collapsed .nav-item {
  min-height: 42px;
}


/* OdontoNic V16 · Sidebar realmente fijo en escritorio */
@media (min-width: 921px) {
  .app-sidebar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow: hidden !important;
  }
}

/* Portal público de Turnos online: la grilla hero + formulario debe colapsar
   a una sola columna en celular (la usa el paciente desde el teléfono). Sin
   esto, la columna del formulario (minmax(320px,…)) desbordaba a < ~700px. */
@media (max-width: 700px) {
  .portal-reserva-grid {
    grid-template-columns: 1fr !important;
  }
}
/* ===== END premium-ui.css ===== */


/* ===== BEGIN tablet-qa.css ===== */
/* OdontoNic v41.28 · Tablet QA / Responsive Pro
   Capa de ajustes para tablets 8"-13". No agrega funcionalidad: mejora tacto,
   modales, agenda, listados y navegación para uso diario en consultorio. */

:root {
  --om-touch-target: 44px;
  --om-tablet-sidebar: 232px;
}

button,
[role="button"],
input,
select,
textarea,
a {
  -webkit-tap-highlight-color: transparent;
}

button,
[role="button"] {
  touch-action: manipulation;
}

/* Zonas táctiles mínimas: evita botones microscópicos en tablet */
button,
.button,
.om-action-tile,
.om-modal-x,
.om-tab-scroll button,
.patient-tabs-scroll button,
.r-scroll.om-tab-scroll button {
  min-height: var(--om-touch-target);
}

input,
select,
textarea {
  min-height: var(--om-touch-target);
}

/* Modales: siempre usables en tablet, con acciones visibles y scroll interno. */
.om-modal-backdrop,
.om-portal-backdrop,
[class*="modal-backdrop"],
[class*="ModalBackdrop"] {
  overscroll-behavior: contain;
}

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

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

/* Listados y tablas: scroll horizontal controlado, no toda la página convertida en pista de patinaje. */
.om-data-table,
.om-scroll-x,
.table-wrap,
.data-wrap,
.report-table,
.caja-table,
[class*="table"],
[class*="Table"] {
  max-width: 100%;
}

.om-data-table,
.om-scroll-x,
.table-wrap,
.data-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* Agenda: la tablet necesita ver controles y grilla sin que todo se escape al margen. */
.agenda-day-scroll,
.r-scroll.agenda-day-scroll,
[class*="agenda-day-scroll"] {
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-width: thin;
}

.agenda-day-scroll::-webkit-scrollbar,
.r-scroll.agenda-day-scroll::-webkit-scrollbar {
  height: 8px;
}

.agenda-day-scroll::-webkit-scrollbar-thumb,
.r-scroll.agenda-day-scroll::-webkit-scrollbar-thumb {
  background: color-mix(in oklab, var(--accent), transparent 45%);
  border-radius: 999px;
}

/* Pestañas clínicas en paciente: usables con dedo. */
.om-tab-scroll,
.patient-tabs-scroll,
.r-scroll.om-tab-scroll {
  gap: 8px !important;
  scroll-snap-type: x proximity;
}

.om-tab-scroll > *,
.patient-tabs-scroll > *,
.r-scroll.om-tab-scroll > * {
  scroll-snap-align: start;
}

/* iPad landscape / tablets grandes */
@media (min-width: 861px) and (max-width: 1180px) {
  :root {
    --om-sidebar-width: var(--om-tablet-sidebar) !important;
  }

  .app-sidebar {
    width: var(--om-tablet-sidebar) !important;
    flex-basis: var(--om-tablet-sidebar) !important;
  }

  main {
    margin-left: var(--om-tablet-sidebar) !important;
  }

  .page-pad {
    padding: 26px 22px 42px !important;
  }

  .r-hero,
  h1.serif,
  h1 {
    font-size: clamp(42px, 5.2vw, 68px) !important;
    line-height: .98 !important;
  }

  .om-premium-hero {
    border-radius: 24px;
  }

  .om-quick-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  /* KPIs: 2/3 columnas antes que números cortados como ticket mojado. */
  .om-kpi-grid,
  .dashboard-kpis,
  .finance-kpis,
  [class*="kpi-grid"],
  [class*="KpiGrid"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  /* Formularios de dos columnas siguen, pero sin aplastar inputs. */
  .om-form-grid,
  [class*="form-grid"],
  [class*="FormGrid"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* iPad portrait / tablets angostas */
@media (min-width: 700px) and (max-width: 860px) {
  :root {
    --om-sidebar-width: 92px !important;
  }

  .app-sidebar {
    width: 92px !important;
    flex-basis: 92px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  main {
    margin-left: 92px !important;
  }

  .app-sidebar .om-sidebar-section-head,
  .app-sidebar .om-sidebar-section-body-inner,
  .app-sidebar nav a,
  .app-sidebar nav button {
    max-width: 100% !important;
  }

  .app-sidebar .om-sidebar-section-head span:not(.om-sidebar-section-chevron),
  .app-sidebar nav a span:not(:first-child),
  .app-sidebar nav button span:not(:first-child) {
    display: none !important;
  }

  .page-pad {
    padding: 22px 18px 40px !important;
  }

  .r-hero,
  h1.serif,
  h1 {
    font-size: clamp(38px, 7vw, 58px) !important;
    line-height: 1 !important;
  }

  .r-wrap,
  .r-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"] {
    grid-template-columns: 1fr !important;
  }

  .om-modal-card,
  .om-receta-modal,
  .r-full-phone,
  [class*="modal-card"],
  [class*="ModalCard"] {
    width: calc(100vw - 28px) !important;
    border-radius: 24px !important;
    padding: 20px !important;
  }

  /* Agenda diaria: permitir columnas anchas sin romper el viewport. */
  .agenda-day-scroll > div,
  .r-scroll.agenda-day-scroll > div {
    min-width: 760px !important;
  }
}

/* Tablets chicas o navegador partido: comportamiento cercano a móvil, pero sin romper modales. */
@media (max-width: 699px) {
  .om-modal-card,
  .om-receta-modal,
  .r-full-phone,
  [class*="modal-card"],
  [class*="ModalCard"] {
    width: calc(100vw - 20px) !important;
    max-height: calc(100dvh - 20px) !important;
    border-radius: 22px !important;
    padding: 18px !important;
  }

  .om-modal-head {
    gap: 10px !important;
  }

  .om-modal-actions,
  .modal-actions,
  [class*="modal-actions"],
  [class*="ModalActions"] {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
    gap: 10px !important;
  }

  .om-modal-actions button,
  .modal-actions button,
  [class*="modal-actions"] button,
  [class*="ModalActions"] button {
    flex: 1 1 140px;
  }
}

/* Orientación horizontal: agenda prioritaria para consultorio/tablet en escritorio. */
@media (orientation: landscape) and (min-width: 900px) and (max-width: 1180px) {
  .agenda-day-scroll > div,
  .r-scroll.agenda-day-scroll > div {
    min-width: 900px;
  }
}

/* Reduce animaciones para tablets con menos potencia o usuarios sensibles. */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
  }
}

/* v41.31 Drag Scroll UX */
.om-drag-scroll-ready {
  cursor: grab;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  scroll-behavior: auto;
}
.om-drag-scroll-ready.om-drag-scroll-dragging {
  cursor: grabbing !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}
.om-drag-scroll-ready.om-drag-scroll-dragging * {
  cursor: grabbing !important;
}
.om-drag-scroll-ready button,
.om-drag-scroll-ready a,
.om-drag-scroll-ready input,
.om-drag-scroll-ready textarea,
.om-drag-scroll-ready select,
.om-drag-scroll-ready [role="button"],
.om-drag-scroll-ready [draggable="true"],
.om-drag-scroll-ready .om-no-drag-scroll,
.om-drag-scroll-ready canvas {
  cursor: auto;
}
.r-scroll.om-drag-scroll-ready,
.om-scroll-x.om-drag-scroll-ready,
.agenda-day-scroll.om-drag-scroll-ready,
.table-scroll.om-drag-scroll-ready,
.om-data-table-wrap.om-drag-scroll-ready {
  scrollbar-width: thin;
}
@media (hover: hover) and (pointer: fine) {
  .om-drag-scroll-ready:hover {
    box-shadow: inset 0 -1px 0 color-mix(in oklab, var(--accent, #0f766e) 18%, transparent);
  }
}
/* ===== END tablet-qa.css ===== */


/* ===== BEGIN responsive-final.css ===== */
/* 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:1280px;margin:0 auto;padding:28px 32px 96px;}
.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}}

/* v41.70.5 — edición de clínica: accesos compactos */
@media (max-width: 720px) {
  .sa-clinic-toggle-grid {
    grid-template-columns: 1fr !important;
  }
}

/* v41.71 — prioridad QA: compactación de formularios y receta */
.sa-clinic-toggle-item input[type="checkbox"] {
  width: 15px;
  height: 15px;
  margin: 0;
  flex: 0 0 auto;
  accent-color: var(--accent);
}
.om-receta-medication-fields > * { min-width: 0; }
@media (max-width: 760px) {
  .om-receta-medication-fields { grid-template-columns: 1fr !important; }
}

/* v41.73.44 · Suscripciones compactas tipo acordeón */
.om-subscription-accordion{overflow:hidden}
.om-subscription-summary{width:100%;display:grid;grid-template-columns:minmax(220px,1.2fr) minmax(140px,.55fr) minmax(260px,.8fr) auto 34px;gap:16px;align-items:center;padding:16px 20px;border:0;background:var(--surface);color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.om-subscription-summary:hover{background:color-mix(in oklab,var(--surface),var(--surface-2) 34%)}
.om-subscription-accordion.is-open .om-subscription-summary{background:var(--accent-soft);border-bottom:1px solid var(--line-soft)}
.om-subscription-summary-plan{display:flex;flex-direction:column;gap:4px}.om-subscription-summary-plan strong{font-size:13px}
.om-subscription-summary-usage{display:flex;gap:14px;flex-wrap:wrap;color:var(--ink-3);font-size:12px}
.om-subscription-chevron{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:var(--surface-2);font-size:22px;transform:rotate(0deg);transition:transform .18s ease}
.om-subscription-chevron.is-open{transform:rotate(90deg)}
.om-subscription-expanded{padding:16px 20px 20px;background:var(--surface)}
.om-subscription-expanded .om-subscription-main{grid-template-columns:minmax(280px,1fr) minmax(180px,.45fr)}
@media(max-width:980px){.om-subscription-summary{grid-template-columns:minmax(0,1fr) auto 34px}.om-subscription-summary-plan,.om-subscription-summary-usage{display:none}.om-subscription-expanded .om-subscription-main{grid-template-columns:1fr}}
@media(max-width:620px){.om-subscription-summary{padding:14px 15px;gap:10px}.om-subscription-summary .om-pill{display:none}.om-subscription-expanded{padding:14px}.om-subscription-details{grid-template-columns:1fr!important}}
/* ===== END responsive-final.css ===== */


/* ===== BEGIN regression-visual-fix-v41-41.css ===== */
/* OdontoNic v41.41 · Regression visual fixes
   Mantiene los ajustes premium previos: no achica columnas hasta romper datos, no convierte paneles en modales gigantes y no deja previews viejas pisando el flujo nuevo. */

/* 1) La capa responsive anterior trató .r-full-phone como si fuera modal. No. Es un panel lateral de ficha paciente. */
.r-full-phone {
  width: auto !important;
  max-width: 100% !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

/* 2) Ficha paciente: layout estable, sin nombres partidos letra por letra. */
.patient-header {
  display: grid !important;
  grid-template-columns: 86px minmax(340px, 1fr) minmax(235px, 320px) !important;
  align-items: start !important;
  gap: 20px !important;
}
.patient-header-main,
.patient-header-side {
  min-width: 0 !important;
}
.patient-header .r-hero,
.patient-header h1,
.patient-header .serif {
  overflow-wrap: normal !important;
  word-break: normal !important;
  text-wrap: balance;
  hyphens: none !important;
}
.patient-header .r-hero span {
  overflow-wrap: normal !important;
  word-break: normal !important;
}
.patient-header-side {
  width: 100% !important;
}
.patient-header-side .om-patient-actions,
.patient-header-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr auto !important;
  gap: 8px !important;
}

@media (max-width: 1180px) {
  .patient-header {
    grid-template-columns: 80px minmax(0, 1fr) !important;
  }
  .patient-header-side {
    grid-column: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: minmax(220px, 320px) minmax(0, 1fr) !important;
    align-items: start !important;
  }
}
@media (max-width: 720px) {
  .patient-header {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  .patient-header > * { justify-self: start; }
  .patient-header-side { grid-template-columns: 1fr !important; }
  .patient-header .r-hero { font-size: clamp(34px, 10vw, 44px) !important; }
}

/* 3) Disponibilidad: franjas contenidas y legibles, sin columnas escapadas detrás del preview. */
.om-availability-day {
  display: grid !important;
  grid-template-columns: 46px minmax(96px, 130px) minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: start !important;
}
.om-availability-day-body {
  display: grid !important;
  grid-template-columns: minmax(230px, 310px) minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: start !important;
  min-width: 0 !important;
}
.om-availability-timebox {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  min-width: 0 !important;
}
.om-availability-slots {
  min-width: 0 !important;
}
.om-availability-slot-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)) !important;
  gap: 8px !important;
  max-height: 154px !important;
  overflow: auto !important;
  padding: 8px !important;
  background: var(--surface) !important;
  border-radius: 14px !important;
  box-shadow: inset 0 0 0 1px var(--line) !important;
  scrollbar-width: thin !important;
}
.om-availability-slot-grid button {
  min-height: 38px !important;
  height: auto !important;
  line-height: 1 !important;
}
.om-availability-actions {
  display: flex !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin-top: 8px !important;
}
.om-availability-actions button {
  min-height: 34px !important;
  height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.om-availability-summary {
  margin-top: 7px !important;
  font-size: 11.5px !important;
  color: var(--ink-4) !important;
  line-height: 1.35 !important;
  max-height: 42px !important;
  overflow: hidden !important;
}
@media (max-width: 1040px) {
  .om-availability-day { grid-template-columns: 44px minmax(90px, 120px) minmax(0, 1fr) !important; }
  .om-availability-day-body { grid-template-columns: 1fr !important; }
}
@media (max-width: 640px) {
  .om-availability-day { grid-template-columns: 44px minmax(0, 1fr) !important; }
  .om-availability-day-body { grid-column: 1 / -1; }
}

/* 4) Portal preview embebido: no debe aplastar contenido ni mostrar scrolls ridículos. */
.om-portal-preview-card iframe {
  height: min(540px, calc(100dvh - 260px)) !important;
  min-height: 420px !important;
  background: #f6f9fb !important;
}

/* 5) Badges amarillos centrados: que dejen de parecer etiquetas pegadas con saliva. */
.om-legal-badge,
.om-legal-badge-big {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 26px !important;
  line-height: 1 !important;
  text-align: center !important;
  vertical-align: middle !important;
}
.om-legal-badge-big { min-height: 34px !important; }

/* 6) Visor de documentos/recetas/reportes: pantalla completa real, por encima de sidebar y overlays. */
.om-doc-viewer-root {
  position: fixed !important;
  inset: 0 !important;
  z-index: 5000 !important;
  display: flex !important;
  flex-direction: column !important;
  background: var(--bg, #EFE7DC) !important;
}
.om-doc-viewer-root iframe {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  border: 0 !important;
  display: block !important;
}
.om-doc-viewer-toolbar {
  flex: 0 0 auto !important;
}
.om-doc-viewer-framewrap {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

/* 7) Turnos online como bandeja: filas respirables y acciones sin aplastar. */
.om-online-row {
  display: grid !important;
  grid-template-columns: minmax(260px, 1fr) minmax(150px, 180px) minmax(180px, 220px) minmax(260px, auto) !important;
  gap: 16px !important;
  align-items: center !important;
}
@media (max-width: 980px) {
  .om-online-row { grid-template-columns: 1fr !important; }
  .om-online-actions { justify-content: flex-start !important; }
}

/* v41.42 · Estabilidad portal/autoagenda */
.om-portal-access-card {
  max-width: 360px !important;
}
.om-portal-access-card .om-portal-link-box {
  max-height: 92px !important;
  overflow: auto !important;
}
.om-portal-preview-card,
.om-portal-preview-card iframe {
  display: none !important;
}
.om-availability-day {
  overflow: hidden !important;
}
.om-availability-day-body {
  grid-template-columns: minmax(220px, 270px) minmax(220px, 1fr) auto !important;
  max-width: 100% !important;
  overflow: hidden !important;
}
.om-availability-timebox {
  min-width: 0 !important;
}
.om-availability-slots {
  min-width: 0 !important;
  max-width: 100% !important;
}
.om-availability-slot-grid {
  grid-template-columns: repeat(auto-fill, minmax(70px, 1fr)) !important;
  max-height: 104px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
.om-availability-summary {
  max-width: 100% !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}
.om-availability-actions {
  position: static !important;
  align-self: stretch !important;
  justify-content: flex-start !important;
}
@media (max-width: 1280px) {
  .om-availability-day-body {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .om-availability-actions {
    flex-direction: row !important;
    flex-wrap: wrap !important;
  }
  .om-availability-actions button {
    flex: 0 0 auto !important;
  }
}
@media (max-width: 780px) {
  .om-availability-day {
    grid-template-columns: 44px minmax(0, 1fr) !important;
    padding: 12px !important;
  }
  .om-availability-day-body {
    grid-column: 1 / -1 !important;
    margin-top: 8px !important;
  }
  .om-availability-timebox input[type="time"] {
    width: 112px !important;
  }
}
/* ===== END regression-visual-fix-v41-41.css ===== */


/* ===== BEGIN portal-turnos-ui-fix-v41-45.css ===== */
/* OdontoNic v41.45 — Mi disponibilidad + Turnos online visual stability */
.om-mi-disponibilidad-layout {
  display: flex !important;
  flex-direction: column !important;
  gap: 18px !important;
  width: 100% !important;
  max-width: 1320px !important;
}
.om-mi-disponibilidad-layout > div:first-child {
  width: 100% !important;
  display: contents !important;
}
.om-mi-disponibilidad-layout .om-portal-link-row {
  order: -1;
  width: 100% !important;
  position: static !important;
  top: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 14px 16px !important;
  border-radius: 22px !important;
  background: var(--surface) !important;
  box-shadow: inset 0 0 0 1px var(--line-soft), var(--shadow-xs) !important;
}
.om-portal-link-row__text { min-width: 0; flex: 1 1 auto; display: flex; align-items: center; gap: 12px; }
.om-portal-link-row__title { font-weight: 900; color: var(--ink); white-space: nowrap; }
.om-portal-link-row__url {
  min-width: 0; flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  padding: 10px 12px; border-radius: 14px; background: var(--bg-tint); color: var(--ink-3);
  box-shadow: inset 0 0 0 1px var(--line-soft); font-family: var(--font-mono); font-size: 12px;
}
.om-portal-link-row__actions { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.om-mi-disponibilidad-layout .om-availability-day {
  grid-template-columns: 46px 120px minmax(0, 1fr) !important;
  padding: 12px !important;
  gap: 12px !important;
  overflow: visible !important;
}
.om-mi-disponibilidad-layout .om-availability-day-body {
  display: grid !important;
  grid-template-columns: minmax(240px, 340px) minmax(340px, 1fr) 92px !important;
  gap: 12px !important;
  width: 100% !important;
  min-width: 0 !important;
  align-items: start !important;
}
.om-mi-disponibilidad-layout .om-availability-slot-grid {
  grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)) !important;
  max-height: 126px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
.om-mi-disponibilidad-layout .om-availability-actions {
  position: static !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  align-self: start !important;
}
.om-mi-disponibilidad-layout .om-availability-summary {
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
.om-turnos-online-page {
  max-width: 1320px !important;
  padding: 32px 36px 100px !important;
}
.om-turnos-online-page > div:first-child {
  padding: 20px 22px !important;
  border-radius: 26px !important;
  background: linear-gradient(135deg, rgba(255,255,255,.92), rgba(240,246,255,.72)) !important;
  box-shadow: inset 0 0 0 1px var(--line-soft), var(--shadow-xs) !important;
}
.om-turnos-online-page .r-hero { letter-spacing: -.035em !important; }
.om-turnos-online-page .om-premium-card,
.om-turnos-online-page .om-empty-state {
  border-radius: 24px !important;
  background: var(--surface) !important;
  box-shadow: inset 0 0 0 1px var(--line-soft), var(--shadow-xs) !important;
}
.om-turnos-online-page .om-empty-state {
  margin: 0 !important;
  padding: 54px 28px !important;
  min-height: 230px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
  color: var(--ink-3) !important;
}
.om-turnos-online-page .om-empty-state .serif { color: var(--ink) !important; font-size: 30px !important; margin-bottom: 8px !important; }
.om-turnos-online-page button,
.om-turnos-online-page select,
.om-turnos-online-page input { font-family: inherit !important; }
.om-turnos-online-page select,
.om-turnos-online-page input {
  min-height: 44px !important;
  border-radius: 16px !important;
  box-shadow: inset 0 0 0 1px var(--line-soft) !important;
  border: none !important;
}
.om-turnos-online-page .om-online-row:hover { background: rgba(15, 76, 129, .035) !important; }
@media (max-width: 1050px) {
  .om-portal-link-row__text { flex-direction: column; align-items: stretch; gap: 8px; }
  .om-portal-link-row__title { white-space: normal; }
  .om-mi-disponibilidad-layout .om-availability-day-body { grid-template-columns: 1fr !important; }
  .om-mi-disponibilidad-layout .om-availability-actions { flex-direction: row !important; }
}
@media (max-width: 720px) {
  .om-mi-disponibilidad-layout .om-portal-link-row { flex-direction: column !important; align-items: stretch !important; }
  .om-portal-link-row__actions { display: grid !important; grid-template-columns: 1fr 1fr; }
  .om-mi-disponibilidad-layout .om-availability-day { grid-template-columns: 42px minmax(0,1fr) !important; }
  .om-mi-disponibilidad-layout .om-availability-day > span { grid-column: 2; }
  .om-mi-disponibilidad-layout .om-availability-day-body { grid-column: 1 / -1; }
  .om-turnos-online-page { padding: 20px 14px 90px !important; }
}
/* ===== END portal-turnos-ui-fix-v41-45.css ===== */


/* ===== BEGIN visual-stability-v41-46.css ===== */
/* OdontoNic v41.46 - Visual Stability Guard
   Capa final para recuperar patrones visuales ya consolidados: modales, overlays,
   documentos/PDF, botones sticky y grillas que no deben desbordarse. */

:root {
  --om-shell-sidebar-w: 312px;
  --om-modal-z: 99990;
  --om-viewer-z: 100000;
}

/* No permitir que overlays queden atrapados visualmente bajo sidebar/topbar. */
.om-modal-backdrop,
.om-global-modal-backdrop,
.om-portal-backdrop,
.modal-backdrop,
[class*="modal-backdrop"],
[class*="ModalBackdrop"] {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100dvh !important;
  z-index: var(--om-modal-z) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: clamp(12px, 2.2vw, 28px) !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  background: rgba(15, 23, 42, .58) !important;
  -webkit-backdrop-filter: blur(14px) saturate(115%) !important;
  backdrop-filter: blur(14px) saturate(115%) !important;
  overscroll-behavior: contain !important;
}

/* Patrón único de modal premium. */
.om-modal-card,
.om-receta-modal,
.modal-card,
[class*="modal-card"],
[class*="ModalCard"] {
  position: relative !important;
  width: min(1120px, calc(100vw - 36px)) !important;
  max-width: calc(100vw - 36px) !important;
  max-height: calc(100dvh - 36px) !important;
  box-sizing: border-box !important;
  background: var(--surface, #fff) !important;
  border: 1px solid var(--line, #d9e2ec) !important;
  border-radius: clamp(18px, 2vw, 30px) !important;
  box-shadow: 0 34px 110px rgba(15, 23, 42, .32) !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 0 !important;
  transform: none !important;
}

.om-modal-head,
.om-global-modal-card > .om-modal-head,
.om-receta-modal > .om-modal-head {
  flex: 0 0 auto !important;
  padding: clamp(18px, 2vw, 26px) clamp(18px, 2.2vw, 30px) 16px !important;
  border-bottom: 1px solid var(--line-soft, rgba(148,163,184,.22)) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.94)) !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
}

.om-modal-x,
.om-global-modal-card .om-modal-x,
.om-receta-modal .om-modal-x {
  flex: 0 0 auto !important;
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  border-radius: 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid var(--line, #d9e2ec) !important;
  background: var(--surface-2, #f3f6fa) !important;
  color: var(--ink, #172033) !important;
  cursor: pointer !important;
  font-size: 26px !important;
  line-height: 1 !important;
}

.om-modal-card > :not(.om-modal-head):not(.om-modal-actions),
.om-receta-modal > :not(.om-modal-head):not(.om-modal-actions) {
  min-width: 0 !important;
}

/* Receta: contenido con scroll interno, footer siempre visible. */
.om-receta-modal {
  width: min(1140px, calc(100vw - 38px)) !important;
}

.om-receta-modal .om-receta-templates {
  flex: 0 0 auto !important;
  padding: 18px clamp(18px, 2.2vw, 30px) 10px !important;
  display: flex !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  overflow: visible !important;
  border-bottom: 1px solid var(--line-soft, rgba(148,163,184,.18)) !important;
}

.om-receta-modal .om-receta-templates button {
  min-height: 42px !important;
  border-radius: 999px !important;
  border: 1px solid transparent !important;
  background: var(--surface-2, #eef3f8) !important;
  color: var(--ink-2, #40536b) !important;
  padding: 0 16px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

.om-receta-modal .om-receta-grid {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: auto !important;
  -webkit-overflow-scrolling: touch !important;
  padding: 18px clamp(18px, 2.2vw, 30px) 22px !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

.om-receta-modal .om-receta-grid > * {
  min-width: 0 !important;
}

.om-receta-modal .om-receta-grid [style*="grid-column: span 2"],
.om-receta-modal .om-receta-grid .span-2,
.om-receta-modal .om-receta-grid [data-span="2"] {
  grid-column: 1 / -1 !important;
}

.om-modal-actions,
.om-receta-modal .om-modal-actions,
.om-global-modal-card .om-modal-actions,
.modal-actions,
[class*="modal-actions"],
[class*="ModalActions"] {
  flex: 0 0 auto !important;
  position: sticky !important;
  bottom: 0 !important;
  z-index: 5 !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  padding: 16px clamp(18px, 2.2vw, 30px) !important;
  margin: 0 !important;
  border-top: 1px solid var(--line-soft, rgba(148,163,184,.22)) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.92), var(--surface, #fff) 45%) !important;
  box-shadow: 0 -14px 32px rgba(15,23,42,.06) !important;
}

/* Inputs de modal: consistencia y sin cortes. */
.om-receta-modal input,
.om-receta-modal select,
.om-receta-modal textarea,
.om-modal-card input,
.om-modal-card select,
.om-modal-card textarea {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Selector de medicamento: tarjetas contenidas, no cortadas bajo el footer. */
.om-receta-modal [class*="catalog"],
.om-receta-modal [class*="Catalog"],
.om-receta-modal [class*="medic"] {
  min-width: 0 !important;
}

.om-receta-modal .om-receta-grid button,
.om-receta-modal .om-receta-grid .om-card,
.om-receta-modal .om-receta-grid .om-premium-card {
  min-width: 0 !important;
}

/* Viewer/documentos/PDF por encima de todo, full-screen real. */
.om-doc-viewer-root,
.om-document-viewer,
.om-pdf-viewer,
[class*="doc-viewer"],
[class*="DocViewer"],
[class*="pdf-viewer"],
[class*="PdfViewer"] {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100dvh !important;
  z-index: var(--om-viewer-z) !important;
  background: var(--bg, #eef3f8) !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

.om-doc-viewer-toolbar,
.om-doc-viewer-root > .om-doc-viewer-toolbar {
  flex: 0 0 auto !important;
  min-height: 58px !important;
  padding: 12px 18px !important;
  background: var(--surface, #fff) !important;
  border-bottom: 1px solid var(--line, #d9e2ec) !important;
  box-shadow: 0 8px 26px rgba(15,23,42,.06) !important;
}

.om-doc-viewer-framewrap,
.om-doc-viewer-root > .om-doc-viewer-framewrap {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: auto !important;
  background: #f4f7fb !important;
}

.om-doc-viewer-root iframe,
.om-document-viewer iframe,
.om-pdf-viewer iframe {
  width: 100% !important;
  min-height: 100% !important;
  border: 0 !important;
  background: #fff !important;
}

/* Tables/listados: scroll local elegante. */
.om-data-table,
.om-table-wrap,
.om-list-table,
[class*="data-table"],
[class*="table-wrap"] {
  max-width: 100% !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

/* Pills/globos amarillos centrados. */
.pill,
.om-pill,
[class*="Pill"],
[class*="badge"],
[class*="Badge"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1.2 !important;
  text-align: center !important;
}

/* Disponibilidad: franjas siempre dentro del bloque. */
.om-portal-slot-grid,
.om-availability-slots,
.portal-slot-grid,
[class*="slot-grid"],
[class*="SlotGrid"] {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

/* Evitar que títulos o nombres largos rompan layouts premium. */
.patient-hero,
.patient-header,
.om-patient-header,
.om-premium-card,
.om-card {
  min-width: 0 !important;
}
.patient-hero h1,
.patient-header h1,
.om-patient-header h1,
.serif {
  overflow-wrap: normal !important;
  word-break: normal !important;
}

@media (max-width: 860px) {
  .om-modal-backdrop,
  .om-global-modal-backdrop,
  .modal-backdrop,
  [class*="modal-backdrop"] {
    align-items: flex-end !important;
    padding: 10px !important;
  }

  .om-modal-card,
  .om-global-modal-card,
  .om-receta-modal,
  .modal-card,
  [class*="modal-card"] {
    width: 100% !important;
    max-width: 100% !important;
    max-height: calc(100dvh - 20px) !important;
    border-radius: 24px 24px 16px 16px !important;
  }

  .om-receta-modal .om-receta-grid {
    grid-template-columns: 1fr !important;
  }

  .om-modal-actions,
  .om-receta-modal .om-modal-actions {
    justify-content: stretch !important;
  }

  .om-modal-actions > *,
  .om-receta-modal .om-modal-actions > * {
    flex: 1 1 160px !important;
  }
}

@media print {
  .om-modal-backdrop,
  .om-global-modal-backdrop,
  .modal-backdrop,
  .sidebar,
  .app-sidebar,
  .topbar,
  .floating-help,
  .om-help-button {
    display: none !important;
  }
}

/* v41.48 — Mi disponibilidad full width y sin card de portal */
.om-mi-disponibilidad-page {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}
.om-mi-disponibilidad-layout,
.om-mi-disponibilidad-layout--full {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
}
.om-mi-disponibilidad-main {
  width: 100% !important;
  max-width: none !important;
}
.om-mi-disponibilidad-layout .om-card,
.om-mi-disponibilidad-main > .om-card,
.om-mi-disponibilidad-main > [class*="card"] {
  width: 100% !important;
  max-width: none !important;
}
.om-mi-disponibilidad-layout .om-portal-link-row {
  display: none !important;
}
@media (max-width: 900px) {
  .om-mi-disponibilidad-page {
    padding: 20px 16px 72px !important;
  }
}
/* ===== END visual-stability-v41-46.css ===== */


/* ===== BEGIN docs-visual-v41-49.css ===== */
/* v41.49 - Documentos: previews contenidas + visor/acciones restauradas.
   Esta capa protege las miniaturas de imágenes reales para que nunca invadan
   los datos de la tarjeta. Sí, al parecer había que explicarle a una imagen
   que no es dueña del layout. */
.om-docs-thumb-grid {
  align-items: stretch;
}
.om-doc-thumb-card {
  position: relative;
  min-width: 0;
  overflow: hidden !important;
  isolation: isolate;
}
.om-doc-thumb-preview {
  position: relative;
  overflow: hidden !important;
  contain: paint;
  flex: 0 0 auto;
}
.om-doc-thumb-preview > img,
.om-doc-thumb-img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  min-width: 0 !important;
  object-fit: cover !important;
  object-position: center center !important;
  transform: none !important;
  position: static !important;
  inset: auto !important;
  border-radius: 0 !important;
  z-index: 0 !important;
}
.om-doc-thumb-card .pill,
.om-doc-thumb-card [class*="pill"] {
  position: relative;
  z-index: 2;
}
@media (max-width: 780px) {
  .om-docs-thumb-grid {
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
  }
  .om-doc-thumb-preview {
    height: 112px !important;
  }
}
/* ===== END docs-visual-v41-49.css ===== */


/* ===== BEGIN evolucion-v41-50.css ===== */
/* v41.50 — Evolución clínica: estilos acotados. No pisa modales globales. */
.om-evo{display:flex;flex-direction:column;gap:18px;width:100%;}
.om-evo-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.om-evo-head h2{margin:0;color:var(--ink);font-size:clamp(28px,4vw,44px);letter-spacing:-.04em;line-height:1.02;}
.om-evo-head p{margin:8px 0 0;color:var(--ink-3);font-size:15px;line-height:1.45;max-width:780px;}
.om-evo-eyebrow{font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.16em;color:var(--ink-4);margin-bottom:8px;}
.om-evo-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;}
.om-evo-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.om-evo-kpis span{display:block;font-size:11px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-4);}
.om-evo-kpis b{display:block;margin-top:8px;color:var(--ink);font-size:28px;line-height:1;}
.om-evo-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;}
.om-evo-chips{display:flex;gap:7px;flex-wrap:wrap;}
.om-evo-chips button{border:0;border-radius:999px;background:var(--surface-2);color:var(--ink-3);font-family:inherit;font-weight:850;padding:10px 14px;cursor:pointer;box-shadow:inset 0 0 0 1px var(--line-soft);}
.om-evo-chips button.is-active{background:var(--ink);color:var(--bg);box-shadow:none;}
.om-evo-toolbar input{min-width:240px;flex:0 1 340px;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:12px 16px;font:inherit;color:var(--ink);outline:none;}
.om-evo-timeline{position:relative;display:flex;flex-direction:column;gap:14px;padding-left:18px;}
.om-evo-timeline::before{content:"";position:absolute;left:4px;top:8px;bottom:8px;width:2px;background:linear-gradient(to bottom,transparent,var(--line),var(--line),transparent);}
.om-evo-event{position:relative;overflow:hidden;}
.om-evo-event::before{content:"";position:absolute;left:-20px;top:24px;width:12px;height:12px;border-radius:50%;background:var(--bg);box-shadow:0 0 0 3px var(--brand);}
.om-evo-event__top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;}
.om-evo-event__main{min-width:0;flex:1;}
.om-evo-event__meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px;color:var(--ink-4);margin-bottom:6px;}
.om-evo-event h3{margin:0;color:var(--ink);font-size:20px;line-height:1.2;letter-spacing:-.01em;}
.om-evo-delete{width:34px;height:34px;border:0;border-radius:12px;background:var(--surface-2);color:var(--danger);display:grid;place-items:center;cursor:pointer;}
.om-evo-event__body{display:flex;flex-direction:column;gap:10px;margin-top:12px;color:var(--ink-2);font-size:14px;line-height:1.55;}
.om-evo-event__body p{margin:0;white-space:pre-wrap;}
.om-evo-piece,.om-evo-state{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;border:1px solid var(--line-soft);background:var(--surface-2);border-radius:999px;padding:7px 10px;color:var(--ink-3);font-size:12px;}
.om-evo-piece b{color:var(--ink);}
.om-evo-state b{color:var(--ink-4);}
.om-evo-empty{text-align:center;color:var(--ink-4);display:flex;flex-direction:column;gap:7px;align-items:center;}
.om-evo-empty b{font-size:20px;color:var(--ink);}
.om-evo-compare{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:6px;}
.om-evo-doc{max-width:420px;}
.om-evo-imgbox{border:1px solid var(--line-soft);border-radius:18px;background:var(--surface-2);overflow:hidden;min-width:0;}
.om-evo-imgbox__label{padding:9px 12px;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-4);border-bottom:1px solid var(--line-soft);}
.om-evo-imgbox img{display:block;width:100%;height:220px;object-fit:contain;background:var(--surface);}
.om-evo-imgbox__empty{height:220px;display:grid;place-items:center;color:var(--ink-4);background:var(--surface);}
.om-evo-imgbox__meta{padding:10px 12px;font-size:12px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.om-evo-form{display:flex;flex-direction:column;gap:14px;}
.om-evo-form-preview{margin-top:4px;}
@media (max-width:900px){.om-evo-kpis{grid-template-columns:1fr}.om-evo-toolbar input{flex:1 1 100%;}.om-evo-actions{justify-content:flex-start}.om-evo-compare{grid-template-columns:1fr}.om-evo-timeline{padding-left:0}.om-evo-timeline::before,.om-evo-event::before{display:none}}
@media print{.om-evo-actions,.om-evo-toolbar{display:none!important}.om-evo-timeline::before,.om-evo-event::before{display:none}.om-evo-event{break-inside:avoid}}
/* ===== END evolucion-v41-50.css ===== */


/* ===== BEGIN communications-v41-72.css ===== */
/* OdontoNic v41.72 · Central de comunicaciones visual unificada */
.om-comms-page {
  width: 100%;
  max-width: 1340px;
  min-width: 0;
  margin: 0 auto;
  padding: 28px 36px 100px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.om-comms-page-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 20px;
  margin-bottom: 6px;
}
.om-comms-page-head-copy { flex: 1 1 260px; min-width: 0; }
.om-comms-page-head h1 {
  margin: 6px 0 0;
  color: var(--ink);
  font-size: 44px;
  line-height: 1.04;
  letter-spacing: -.01em;
  font-weight: 400;
}
.om-comms-page-subtitle {
  margin-top: 8px;
  color: var(--ink-3);
  font-size: 13px;
  line-height: 1.5;
}
.om-comms-head-actions { flex: 0 0 auto; }

.om-comms-alert {
  padding: 14px 16px;
  border: 1px solid color-mix(in oklab, var(--danger), transparent 72%);
  border-radius: 16px;
  color: var(--danger);
  background: var(--danger-soft);
  font-size: 13px;
}

.om-comms-tabs {
  display: flex !important;
  gap: 8px !important;
  align-items: center;
  width: 100%;
  border: 0 !important;
  padding: 2px 0 9px !important;
}
.om-comms-tab {
  flex: 0 0 auto;
  min-height: 40px !important;
  padding: 0 15px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  color: var(--ink-3);
  font: inherit;
  font-size: 12.5px;
  font-weight: 700;
  cursor: pointer;
  transition: background .16s ease, color .16s ease, border-color .16s ease, transform .12s ease;
}
.om-comms-tab:hover { background: var(--surface-2); color: var(--ink); }
.om-comms-tab.is-active {
  background: var(--accent);
  border-color: var(--accent);
  color: white;
  box-shadow: none;
}
.om-comms-tab:active { transform: scale(.98); }

.om-comms-section-stack { display: grid; gap: 16px; min-width: 0; }
.om-comms-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.om-comms-kpi {
  min-height: 118px;
  padding: 18px 20px !important;
  position: relative;
  overflow: hidden !important;
}
.om-comms-kpi-top {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--ink-4);
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: .09em;
  font-weight: 900;
}
.om-comms-kpi-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); flex: 0 0 auto; }
.tone-warn .om-comms-kpi-dot { background: var(--warn); }
.tone-sage .om-comms-kpi-dot { background: var(--sage); }
.tone-danger .om-comms-kpi-dot { background: var(--danger); }
.om-comms-kpi-value { margin-top: 18px; color: var(--ink); font-size: clamp(28px, 3vw, 42px); line-height: 1; font-weight: 600; }

.om-comms-provider-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  min-width: 0;
}
.om-comms-provider-card { padding: 0 !important; overflow: hidden !important; min-width: 0; }
.om-comms-provider-head {
  padding: 20px;
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  gap: 13px;
  align-items: center;
  border-bottom: 1px solid var(--line-soft);
}
.om-comms-channel-icon {
  width: 46px;
  height: 46px;
  border-radius: 15px;
  display: grid;
  place-items: center;
  background: var(--accent-soft);
  color: var(--accent);
  font-weight: 900;
  font-size: 15px;
  letter-spacing: -.03em;
}
.om-comms-channel-icon.whatsapp { background: var(--sage-soft); color: var(--sage); font-size: 12px; }
.om-comms-provider-copy { min-width: 0; }
.om-comms-provider-title { color: var(--ink); font-size: 18px; font-weight: 800; letter-spacing: -.02em; }
.om-comms-provider-subtitle { margin-top: 4px; color: var(--ink-4); font-size: 11.5px; line-height: 1.4; }
.om-comms-provider-details { padding: 16px 20px; display: grid; gap: 10px; }
.om-comms-detail-line {
  display: grid;
  grid-template-columns: minmax(90px, .35fr) minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-width: 0;
}
.om-comms-detail-line > span { color: var(--ink-4); font-size: 11.5px; }
.om-comms-detail-line strong { color: var(--ink-2); font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.om-comms-detail-line em { font-size: 10.5px; font-style: normal; font-weight: 800; color: var(--ink-4); }
.om-comms-detail-line em.tone-sage { color: var(--sage); }
.om-comms-detail-line em.tone-warn { color: var(--warn); }
.om-comms-provider-actions { padding: 0 20px 20px; }

.om-comms-template-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  min-width: 0;
}
.om-comms-template-card { padding: 18px !important; min-width: 0; }
.om-comms-template-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.om-comms-template-name-wrap { min-width: 0; }
.om-comms-template-name { color: var(--ink); font-size: 14px; font-weight: 850; line-height: 1.35; }
.om-comms-template-code { margin-top: 5px; color: var(--ink-4); font-size: 10.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.om-comms-template-subject { margin-top: 13px; color: var(--ink-3); font-size: 12.5px; line-height: 1.5; }
.om-comms-template-meta { margin-top: 10px; color: var(--ink-4); font-size: 11.5px; }
.om-comms-empty { grid-column: 1 / -1; padding: 34px !important; text-align: center; color: var(--ink-4); font-size: 13px; }

.om-comms-table-card { padding: 0 !important; overflow: hidden !important; min-width: 0; }
.om-comms-table-scroll { width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.om-comms-table-inner { min-width: 840px; }
.om-comms-table-events .om-comms-table-inner { min-width: 940px; }
.om-comms-table-head,
.om-comms-table-row {
  display: grid;
  grid-template-columns: var(--om-comms-cols);
  gap: 12px;
  align-items: center;
}
.om-comms-table-head {
  padding: 12px 18px;
  background: var(--surface-2);
  color: var(--ink-4);
  font-size: 9.5px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .09em;
}
.om-comms-table-row { padding: 14px 18px; border-top: 1px solid var(--line-soft); font-size: 12.5px; min-width: 0; }
.om-comms-table-row:hover { background: color-mix(in oklab, var(--surface), var(--surface-2) 34%); }
.om-comms-table-row > div { min-width: 0; }
.om-comms-cell-strong { color: var(--ink); font-weight: 800; }
.om-comms-cell-muted { color: var(--ink-4); }
.om-comms-cell-ellipsis { color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.om-comms-empty-row { padding: 34px 18px; text-align: center; color: var(--ink-4); font-size: 13px; }

.om-comms-editor-card { width: min(860px, calc(100vw - 40px)) !important; max-height: min(88dvh, 820px) !important; padding: 0 !important; overflow: hidden !important; display: grid !important; grid-template-rows: auto minmax(0, 1fr) auto; }
.om-comms-editor-card .om-modal-head { margin: 0; padding: 22px 24px 18px; }
.om-comms-editor-card .om-modal-head h2 { margin: 5px 0 0; color: var(--ink); font-size: clamp(27px, 3vw, 36px); line-height: 1.05; font-weight: 400; }
.om-comms-editor-card .om-modal-head p { margin: 7px 0 0; color: var(--ink-3); font-size: 12.5px; line-height: 1.45; }
.om-comms-editor-body { padding: 20px 24px; overflow-y: auto; min-height: 0; overscroll-behavior: contain; scrollbar-gutter: stable; }
.om-comms-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.om-comms-form-grid .span-2 { grid-column: 1 / -1; }
.om-comms-field { display: grid; gap: 7px; min-width: 0; }
.om-comms-field > span { color: var(--ink-4); font-size: 10px; font-weight: 900; text-transform: uppercase; letter-spacing: .08em; }
.om-comms-field input,
.om-comms-test-row input {
  width: 100%;
  height: 46px;
  padding: 0 13px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  color: var(--ink);
  font: inherit;
  font-size: 13px;
  outline: none;
}
.om-comms-field input:focus,
.om-comms-test-row input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent), transparent 86%); }
.om-comms-info { padding: 12px 14px; border-radius: 15px; background: var(--surface-2); color: var(--ink-3); font-size: 11.5px; line-height: 1.55; }
.om-comms-check {
  display: flex;
  gap: 9px;
  align-items: flex-start;
  padding: 12px 13px;
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  background: var(--surface-2);
  color: var(--ink-3);
  font-size: 11.5px;
  line-height: 1.4;
}
.om-comms-check input { width: 17px; height: 17px; min-height: 0 !important; margin: 0; accent-color: var(--accent); flex: 0 0 auto; }
.om-comms-test-box { margin-top: 18px; padding: 15px; border: 1px solid var(--line-soft); border-radius: 18px; background: var(--surface-2); display: grid; gap: 12px; }
.om-comms-test-box > div:first-child { display: grid; gap: 3px; }
.om-comms-test-box strong { color: var(--ink); font-size: 13px; }
.om-comms-test-box span { color: var(--ink-4); font-size: 11px; }
.om-comms-test-row { display: grid; grid-template-columns: minmax(0, 1fr) 112px; gap: 9px; align-items: center; }
.om-comms-test-row button { width: 112px !important; min-width: 112px !important; white-space: nowrap; }
.om-comms-message { margin-top: 14px; padding: 12px 14px; border-radius: 14px; background: var(--accent-soft); color: var(--accent-2); font-size: 12px; }
.om-comms-editor-actions { margin: 0 !important; padding: 14px 24px 18px !important; background: var(--surface) !important; border-top: 1px solid var(--line-soft); position: relative; z-index: 2; }

@media (max-width: 1180px) {
  .om-comms-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .om-comms-template-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 860px) {
  .om-comms-provider-grid { grid-template-columns: 1fr; }
  .om-comms-provider-card { width: 100%; }
  .om-comms-template-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .om-comms-page { gap: 14px; padding: 20px 14px 88px; }
  .om-comms-page-head { flex-direction: column; align-items: stretch; gap: 14px; margin-bottom: 2px; }
  .om-comms-page-head h1 { font-size: clamp(34px, 10vw, 42px) !important; }
  .om-comms-head-actions button { width: 100% !important; }
  .om-comms-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .om-comms-kpi { min-height: 105px; padding: 14px !important; }
  .om-comms-kpi-top { font-size: 9px; letter-spacing: .06em; }
  .om-comms-kpi-value { margin-top: 13px; font-size: 30px; }
  .om-comms-provider-head { grid-template-columns: 42px minmax(0, 1fr); padding: 16px; }
  .om-comms-provider-head > span { grid-column: 2; justify-self: start; }
  .om-comms-channel-icon { width: 42px; height: 42px; border-radius: 13px; }
  .om-comms-provider-details { padding: 14px 16px; }
  .om-comms-detail-line { grid-template-columns: 1fr; gap: 3px; padding-bottom: 8px; border-bottom: 1px solid var(--line-soft); }
  .om-comms-detail-line:last-child { border-bottom: 0; padding-bottom: 0; }
  .om-comms-detail-line strong { white-space: normal; }
  .om-comms-provider-actions { padding: 0 16px 16px; }
  .om-comms-provider-actions button { width: 100% !important; }
  .om-comms-template-grid { grid-template-columns: 1fr; gap: 10px; }

  /* En teléfono las tablas se convierten en cards, no en trenes de carga horizontales. */
  .om-comms-table-card { background: transparent !important; box-shadow: none !important; }
  .om-comms-table-scroll { overflow: visible; }
  .om-comms-table-inner,
  .om-comms-table-events .om-comms-table-inner { min-width: 0; display: grid; gap: 10px; }
  .om-comms-table-head { display: none; }
  .om-comms-table-row {
    display: grid;
    grid-template-columns: 1fr !important;
    gap: 9px;
    padding: 15px;
    border: 1px solid var(--line-soft);
    border-radius: 18px;
    background: var(--surface);
    box-shadow: var(--shadow-sm);
  }
  .om-comms-table-row > div {
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
  }
  .om-comms-table-row > div::before {
    content: attr(data-label);
    color: var(--ink-4);
    font-size: 9px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .07em;
    padding-top: 2px;
  }
  .om-comms-cell-ellipsis { white-space: normal; overflow: visible; text-overflow: clip; }
  .om-comms-empty-row { border: 1px solid var(--line-soft); border-radius: 18px; background: var(--surface); padding: 28px 16px; }

  .om-comms-editor-card { width: calc(100vw - 14px) !important; max-height: calc(100dvh - 14px) !important; border-radius: 20px !important; }
  .om-comms-editor-card .om-modal-head { padding: 18px 17px 14px; }
  .om-comms-editor-body { padding: 16px 17px; }
  .om-comms-form-grid { grid-template-columns: 1fr; gap: 12px; }
  .om-comms-form-grid .span-2 { grid-column: auto; }
  .om-comms-test-row { flex-direction: column; align-items: stretch; }
  .om-comms-test-row button { width: 100% !important; }
  .om-comms-editor-actions { padding: 12px 17px 15px !important; display: grid !important; grid-template-columns: 1fr !important; }
  .om-comms-editor-actions button { width: 100% !important; }
}

@media (min-width: 641px) and (max-width: 1100px) {
  .om-comms-page { padding: 24px 24px 96px; }
}

/* v41.73.12 · Sprint 1 WhatsApp: estado, prueba y diagnóstico */
.om-comms-provider-actions { display:flex; flex-wrap:wrap; gap:10px; }
.om-comms-detail-line strong { max-width:58%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.om-comms-detail-line .tone-danger, .om-comms-detail-line em.tone-danger { color:var(--danger, #b42318); }
.om-comms-detail-line .tone-sage, .om-comms-detail-line em.tone-sage { color:var(--sage-700, #287a55); }
.om-comms-test-modal { width:min(560px, calc(100vw - 28px)); }
.om-comms-test-modal .om-comms-field { max-width:none; }
@media (max-width: 680px) {
  .om-comms-provider-actions > button { flex:1 1 100%; width:100%; }
  .om-comms-detail-line { align-items:flex-start; }
  .om-comms-detail-line strong { max-width:100%; white-space:normal; overflow-wrap:anywhere; text-align:right; }
}

/* v41.73.24 · historial y trazabilidad WhatsApp */
.om-comms-history-stack { display: grid; gap: 16px; }
.om-comms-history-toolbar { display: grid; grid-template-columns: 180px 180px minmax(260px,1fr); gap: 12px; align-items: end; }
.om-comms-history-toolbar label { display: grid; gap: 6px; min-width: 0; }
.om-comms-history-toolbar label > span { color: var(--ink-4); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.om-comms-history-toolbar select,
.om-comms-history-toolbar input { width: 100%; min-height: 44px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); color: var(--ink); padding: 0 12px; font: inherit; }
.om-comms-history-mini-kpis { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.om-comms-history-error { margin-top: 6px; color: var(--danger, #b42318); font-size: 11.5px; line-height: 1.35; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.om-comms-history-id { margin-top: 5px; color: var(--ink-4); font-size: 10.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 820px) {
  .om-comms-history-toolbar { grid-template-columns: 1fr 1fr; }
  .om-comms-history-search { grid-column: 1 / -1; }
  .om-comms-history-mini-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 520px) {
  .om-comms-history-toolbar { grid-template-columns: 1fr; }
  .om-comms-history-search { grid-column: auto; }
}
/* ===== END communications-v41-72.css ===== */


/* ===== BEGIN responsive-audit-v41-72.css ===== */
/* OdontoNic v41.72 · Auditoría responsive transversal
   Prioridad: mobile, tablet y notebook. Capa final y deliberadamente conservadora:
   arregla shell, acciones, cards, formularios, modales y módulos con clases estables. */

:root {
  --om-r-page-x: clamp(14px, 2vw, 32px);
  --om-r-page-y: clamp(16px, 2.2vw, 34px);
  --om-r-gap: clamp(10px, 1.35vw, 18px);
}

html, body, #root, #vite-root { width: 100%; max-width: 100%; min-width: 0; }
body { overflow-x: hidden !important; }
main { width: auto; max-width: 100%; min-width: 0; overflow-x: clip; }
.page-pad { width: 100%; max-width: 100%; min-width: 0; }
.page-pad > * { max-width: 100%; min-width: 0; }

/* Contenido multimedia y campos nunca deben agrandar el viewport. */
img, svg, video, canvas, iframe { max-width: 100%; }
input, select, textarea { min-width: 0; max-width: 100%; }
label { min-width: 0; }

/* Acciones de cabecera y grupos de controles. */
.r-wrap, .r-actions, .om-chip-row, .om-table-tools { min-width: 0; }
.r-actions > *, .om-table-tools > * { min-width: 0; }

/* Scroll local: las tablas pueden ser anchas, la página completa no. */
.r-scroll,
.om-scroll-x,
.table-wrap,
.data-wrap,
.report-table,
.caja-table,
.om-data-table,
.om-data-table-wrap,
.om-plans-table-wrap,
.docs-table-wrap,
.recetas-table-wrap,
.agenda-day-scroll {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-inline: contain;
}

/* Modal base: scroll interno y acciones alcanzables incluso en notebook baja. */
.om-modal-backdrop,
.om-global-modal-backdrop,
.om-portal-backdrop,
[class*="modal-backdrop"],
[class*="ModalBackdrop"] {
  overflow: auto !important;
  overscroll-behavior: contain;
}
.om-modal-card,
.om-global-modal-card,
.om-receta-modal,
.r-full-phone,
[class*="modal-card"],
[class*="ModalCard"] {
  min-width: 0 !important;
  max-width: calc(100vw - 24px) !important;
  max-height: calc(100dvh - 24px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.om-modal-actions,
.modal-actions,
[class*="modal-actions"],
[class*="ModalActions"] {
  z-index: 8;
}

/* Ficha del paciente. */
.patient-header { width: 100%; min-width: 0; }
.patient-header-main, .patient-header-side, .patient-header-actions { min-width: 0; }
.patient-header-actions { flex-wrap: wrap !important; }

/* Documentos, evolución y disponibilidad. */
.om-docs-thumb-grid { width: 100%; min-width: 0; }
.om-evo, .om-evo-head, .om-evo-toolbar, .om-evo-compare { min-width: 0; }
.om-evo-imgbox img { max-width: 100%; }
.om-availability-day,
.om-availability-day-body,
.om-availability-slots,
.om-availability-slot-grid,
.om-availability-summary,
.om-availability-actions { min-width: 0; }

/* Portal paciente y portal público. */
.pp-wrap, .pp-main, .pp-grid, .pp-stack, .pp-section, .pp-row,
.portal-reserva-grid, .om-portal-card { min-width: 0; max-width: 100%; }
.pp-row > * { min-width: 0; }

/* Grillas con clases compartidas. */
.om-quick-grid,
.om-kpi-grid,
.dashboard-kpis,
.finance-kpis,
.legal-kpis,
.om-form-grid,
.om-plan-kpis,
.om-usage-grid { min-width: 0; }

/* ===========================
   NOTEBOOK · 1101 a 1480 px
   =========================== */
@media (min-width: 1101px) and (max-width: 1480px) {
  :root { --om-r-page-x: 24px; --om-r-page-y: 24px; }
  .page-pad { padding-left: var(--om-r-page-x) !important; padding-right: var(--om-r-page-x) !important; }
  .r-hero { font-size: clamp(40px, 4.6vw, 66px) !important; line-height: 1 !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-global-modal-card,
  .om-receta-modal,
  [class*="modal-card"],
  [class*="ModalCard"] {
    max-width: min(960px, calc(100vw - 36px)) !important;
  }
}

/* =====================================
   TABLET · 641 a 1100 px (drawer real)
   ===================================== */
@media (max-width: 1100px) {
  /* Alineado con matchMedia("max-width: 1100px") de app.jsx. */
  .mobile-topbar { display: flex !important; }
  main { margin-left: 0 !important; width: 100% !important; }
  .app-sidebar {
    width: min(86vw, 288px) !important;
    max-width: 288px !important;
    flex-basis: min(86vw, 288px) !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  .sidebar-backdrop.show {
    display: block !important;
    position: fixed;
    inset: 0;
    z-index: 55;
    background: oklch(0.2 0.02 60 / .42);
    backdrop-filter: blur(3px);
  }

  .page-pad {
    padding: var(--om-r-page-y) var(--om-r-page-x) 44px !important;
  }
  .r-hero { font-size: clamp(36px, 6vw, 56px) !important; line-height: 1 !important; }

  .r-stack { grid-template-columns: 1fr !important; }
  .r-wrap, .r-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;
  }

  .portal-reserva-grid,
  .pp-grid,
  .legal-layout { grid-template-columns: 1fr !important; }

  .patient-header { grid-template-columns: 1fr !important; gap: 18px !important; }
  .patient-header-side { width: 100% !important; max-width: 100% !important; justify-self: stretch !important; }
  .patient-header-actions { justify-content: flex-start !important; }

  .om-evo-compare { grid-template-columns: 1fr !important; }
  .om-evo-toolbar input { flex: 1 1 100% !important; width: 100% !important; min-width: 0 !important; }

  .om-modal-card,
  .om-global-modal-card,
  .om-receta-modal,
  [class*="modal-card"],
  [class*="ModalCard"] {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
    max-height: calc(100dvh - 24px) !important;
  }
}

/* Tablet landscape/notebook bajo: menos aire sin sacrificar tacto. */
@media (min-width: 861px) and (max-width: 1100px) {
  :root { --om-r-page-x: 22px; --om-r-page-y: 20px; }
  .mobile-topbar { padding-left: 20px !important; padding-right: 20px !important; }
  .om-form-grid,
  [class*="form-grid"],
  [class*="FormGrid"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .agenda-day-scroll > div { min-width: 900px !important; }
}

/* Tablet portrait. */
@media (min-width: 641px) and (max-width: 860px) {
  :root { --om-r-page-x: 18px; --om-r-page-y: 18px; }
  .om-form-grid,
  [class*="form-grid"],
  [class*="FormGrid"] { grid-template-columns: 1fr !important; }
  .legal-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .om-docs-thumb-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .om-evo-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  .agenda-day-scroll > div { min-width: 820px !important; }
}

/* ===========================
   MOBILE · hasta 640 px
   =========================== */
@media (max-width: 640px) {
  :root { --om-r-page-x: 13px; --om-r-page-y: 14px; }

  .mobile-topbar {
    padding: 9px 12px !important;
    gap: 9px !important;
  }
  .mobile-topbar .serif { font-size: 16px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

  .page-pad { padding: var(--om-r-page-y) var(--om-r-page-x) 82px !important; }
  .r-hero { font-size: clamp(30px, 10vw, 42px) !important; line-height: 1.02 !important; }

  .r-stack,
  .om-quick-grid,
  .om-kpi-grid,
  .dashboard-kpis,
  .finance-kpis,
  .legal-kpis,
  .om-form-grid,
  [class*="form-grid"],
  [class*="FormGrid"],
  [class*="kpi-grid"],
  [class*="KpiGrid"],
  .portal-reserva-grid,
  .pp-grid,
  .om-evo-kpis,
  .om-evo-compare,
  .om-docs-thumb-grid {
    grid-template-columns: 1fr !important;
  }

  /* Acciones: en móvil usan el ancho disponible, pero permiten dos botones cortos juntos. */
  .r-actions,
  .om-modal-actions,
  .modal-actions,
  [class*="modal-actions"],
  [class*="ModalActions"] {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 9px !important;
  }
  .r-actions > button,
  .r-actions > a,
  .om-modal-actions > button,
  .modal-actions > button,
  [class*="modal-actions"] > button,
  [class*="ModalActions"] > button {
    flex: 1 1 140px;
  }

  .patient-header { gap: 14px !important; }
  .patient-header-main { align-items: flex-start !important; }
  .patient-header-actions { width: 100%; gap: 8px !important; }
  .patient-header-actions button, .patient-header-actions a { flex: 1 1 120px; }

  .pp-main { padding-left: 13px !important; padding-right: 13px !important; }
  .pp-row { align-items: flex-start !important; gap: 10px !important; }
  .pp-row > div { min-width: 0 !important; }
  .pp-row .mono, .pp-row a { overflow-wrap: anywhere; word-break: break-word; }

  .om-availability-day { grid-template-columns: 40px minmax(0, 1fr) !important; }
  .om-availability-day-body { grid-column: 1 / -1 !important; grid-template-columns: 1fr !important; }
  .om-availability-actions { flex-direction: column !important; align-items: stretch !important; }
  .om-availability-actions button { width: 100% !important; }

  .om-evo-actions { width: 100%; justify-content: stretch !important; }
  .om-evo-actions button { flex: 1 1 100%; }
  .om-evo-toolbar { align-items: stretch !important; }
  .om-evo-chips { flex-wrap: nowrap !important; overflow-x: auto; padding-bottom: 5px; }

  .om-modal-backdrop,
  .om-global-modal-backdrop,
  .om-portal-backdrop,
  [class*="modal-backdrop"],
  [class*="ModalBackdrop"] {
    padding: 7px !important;
    align-items: flex-end !important;
  }
  .om-modal-card,
  .om-global-modal-card,
  .om-receta-modal,
  [class*="modal-card"],
  [class*="ModalCard"] {
    width: calc(100vw - 14px) !important;
    max-width: calc(100vw - 14px) !important;
    max-height: calc(100dvh - 14px) !important;
    border-radius: 20px 20px 14px 14px !important;
  }

  /* Agenda conserva densidad, pero con scroll propio y anclaje táctil. */
  .agenda-day-scroll { scroll-snap-type: x proximity; }
  .agenda-day-scroll > div { min-width: 740px !important; }

  /* Listados tabulares nunca arrastran al body. */
  .docs-list-head,
  .docs-list-row,
  .om-data-table-head,
  .om-data-table-row,
  .desktop-table-head { min-width: 700px; }
}

/* Teléfonos angostos. */
@media (max-width: 390px) {
  :root { --om-r-page-x: 10px; }
  .page-pad { padding-left: 10px !important; padding-right: 10px !important; }
  .om-kpi-grid, .dashboard-kpis, .finance-kpis { grid-template-columns: 1fr !important; }
  .r-actions > button, .r-actions > a { flex-basis: 100%; }
}

/* Notebook de poca altura: prioridad a contenido y botones, no a espacios vacíos. */
@media (min-width: 900px) and (max-height: 800px) {
  .page-pad { padding-top: 18px !important; padding-bottom: 28px !important; }
  .om-modal-card,
  .om-global-modal-card,
  .om-receta-modal,
  [class*="modal-card"],
  [class*="ModalCard"] { max-height: calc(100dvh - 14px) !important; }
  .om-modal-head { padding-bottom: 11px !important; margin-bottom: 11px !important; }
  .om-modal-actions { padding-top: 10px !important; margin-top: 10px !important; }
}

/* Pantallas grandes: centrado cómodo sin hacer líneas de texto kilométricas. */
@media (min-width: 1680px) {
  .page-pad > .om-comms-page,
  .page-pad > .om-evo,
  .page-pad > .om-plans-page { max-width: 1540px; margin-left: auto; margin-right: auto; }
}

/* Grillas marcadas durante auditoría módulo por módulo. */
.om-responsive-2col,
.om-responsive-2col-tablet { min-width: 0; }
.om-responsive-2col > *,
.om-responsive-2col-tablet > * { min-width: 0; }
@media (max-width: 860px) {
  .om-responsive-2col-tablet { grid-template-columns: 1fr !important; }
}
@media (max-width: 640px) {
  .om-responsive-2col { grid-template-columns: 1fr !important; }
}

/* v41.72.1 — disponibilidad: 1 franja = 1 turno y controles compactos */
.om-availability-toggle {
  padding: 0 !important;
  min-width: 44px !important;
  max-width: 44px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  line-height: 0 !important;
  overflow: visible !important;
}
.om-availability-count {
  flex: 0 0 auto;
}
.om-availability-actions button {
  border-radius: 10px !important;
  min-height: 34px !important;
  height: 34px !important;
}
@media (max-width: 1280px) {
  .om-mi-disponibilidad-layout .om-availability-day-body,
  .om-availability-day-body {
    grid-template-columns: 1fr !important;
  }
  .om-availability-actions {
    flex-direction: row !important;
    align-items: center !important;
  }
}
@media (max-width: 640px) {
  .om-availability-timebox {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) auto minmax(0,1fr) !important;
  }
  .om-availability-timebox input[type="time"] {
    width: 100% !important;
    min-width: 0 !important;
  }
  .om-availability-count {
    grid-column: 1 / -1;
    justify-self: start;
  }
  .om-availability-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    width: 100% !important;
  }
  .om-availability-actions button {
    width: 100% !important;
    white-space: normal !important;
    height: auto !important;
    min-height: 40px !important;
  }
}

/* QA v41.73.55: reserva el área superior derecha para controles globales */
@media (min-width: 901px) {
  .legal-actions-stack { margin-top: 56px; }
}
@media (max-width: 900px) {
  .legal-actions-stack { margin-top: 8px; }
}


/* QA v41.73.59 · ficha paciente compacta */
@media (min-width: 901px) {
  .patient-header { align-items: flex-start !important; gap: 18px !important; margin-bottom: 12px !important; padding-bottom: 12px !important; }
  .patient-header-side { min-width: 250px !important; max-width: 250px !important; }
  .patient-header-actions { display: grid !important; grid-template-columns: minmax(0,1fr) minmax(0,1fr) auto !important; flex-wrap: nowrap !important; gap: 6px !important; }
  .patient-header-actions > button { min-width: 0 !important; white-space: nowrap !important; }
}
@media (max-width: 900px) {
  .patient-header-side { max-width: none !important; }
  .patient-header-actions { display: grid !important; grid-template-columns: minmax(0,1fr) minmax(0,1fr) auto !important; }
}
@media (max-width: 520px) {
  .patient-header-actions { grid-template-columns: 1fr 1fr !important; }
  .patient-header-actions > :last-child { grid-column: 1 / -1; justify-self: end; }
}

/* v41.73.90 · Asistente rápido móvil */
@media (max-width: 640px) {
  button[aria-label="Asistente rápido"] { right: 76px !important; bottom: 16px !important; width: 48px !important; height: 48px !important; }
  .om-assistant-dialog { left: 10px !important; right: 10px !important; bottom: 76px !important; width: auto !important; max-width: none !important; max-height: calc(100dvh - 96px) !important; border-radius: 18px !important; }
  .om-assistant-dialog > div:nth-child(2) { padding: 10px !important; min-width: 0 !important; }
  .om-assistant-dialog input, .om-assistant-dialog button { min-width: 0 !important; max-width: 100% !important; }
}
/* ===== END responsive-audit-v41-72.css ===== */


/* ===== BEGIN ui-consistency-v41-73-33.css ===== */
/* OdontoNic v41.73.33 · coherencia visual y QA productiva */
.om-account-page {
  width: min(100%, 1120px);
  margin: 0 auto;
  padding: 28px 36px 110px;
}

/* Control de búsqueda unificado */
.om-unified-input{border:1px solid var(--line)!important;box-shadow:none!important;background:var(--surface-2)!important;overflow:hidden}
.om-unified-input:focus-within{border-color:var(--accent)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 12%,transparent)!important}
.om-unified-input .om-unified-input-control{width:100%!important;min-width:0!important;height:100%!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;padding:0!important;outline:0!important}
[data-theme="dark"]{--bg:#0d1817;--bg-tint:#132421;--surface:#172a27;--surface-2:#1d3430;--surface-3:#25413c;--ink:#eef9f7;--ink-2:#d2e6e2;--ink-3:#9fbab5;--ink-4:#77958f;--line:rgba(185,226,219,.17);--line-soft:rgba(185,226,219,.1);--accent-soft:rgba(37,192,178,.18);--sage-soft:rgba(86,175,140,.17)}
[data-theme="dark"] :where(.app-sidebar,.om-sidebar-section,.om-global-modal-card,.om-assistant-dialog,.menu-popover,[role="menu"],.om-premium-card,.card){background-color:var(--surface)!important;color:var(--ink)!important;border-color:var(--line)!important}
[data-theme="dark"] :where(input,select,textarea,.om-input){background-color:var(--surface-2)!important;color:var(--ink)!important;border-color:var(--line)!important}
.om-account-title { font-size: clamp(38px, 4vw, 52px); margin: 8px 0 8px; font-weight: 400; }
.om-account-subtitle { color: var(--ink-3); font-size: 15px; margin-bottom: 24px; }
.om-account-card { border-radius: 22px; }
.om-account-card-title { font-size: clamp(25px, 2.5vw, 31px); }

.om-rx-mode-option {
  appearance: none;
  border: 1px solid transparent;
  border-radius: 999px;
  min-width: 104px;
  padding: 9px 14px;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  background: transparent;
  color: var(--ink-3);
  transition: background .16s ease, color .16s ease, box-shadow .16s ease;
}
.om-rx-mode-option:hover { color: var(--ink); background: var(--surface-2); }
.om-rx-mode-option.is-active {
  background: var(--accent, #1f5aa6);
  color: #fff;
  box-shadow: 0 4px 14px rgba(31, 90, 166, .18);
}
.om-rx-mode-option:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 30%, transparent); outline-offset: 2px; }

.om-agenda-month-day { background: var(--surface); color: var(--ink); transition: background .15s ease; }
.om-agenda-month-day:hover { background: color-mix(in srgb, var(--accent-soft) 55%, var(--surface)); }
.om-agenda-month-day.is-adjacent-month {
  background: color-mix(in srgb, var(--bg-tint) 78%, #dfe6ef);
  color: var(--ink-4);
  box-shadow: inset 0 0 0 999px rgba(238, 242, 247, .25);
}
.om-agenda-month-day.is-adjacent-month .om-agenda-month-number { color: var(--ink-4); }
.om-agenda-month-day.is-adjacent-month .om-agenda-month-add,
.om-agenda-month-day.is-adjacent-month > div:not(:first-child) { opacity: .48; }
.om-agenda-month-day.is-today {
  background: var(--accent-soft);
  box-shadow: inset 4px 0 0 var(--accent);
}
.om-agenda-month-day.is-today .om-agenda-month-number { color: var(--accent-2); font-weight: 700; }
.om-agenda-month-number { color: var(--ink); }
.om-agenda-month-add {
  border: 0;
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--ink-2);
  width: 30px;
  height: 30px;
  cursor: pointer;
  font-weight: 800;
}
.om-agenda-month-add:hover { background: var(--accent); color: #fff; }

@media (max-width: 720px) {
  .om-account-page { padding: 22px 16px 96px; }
  .om-account-card { border-radius: 18px; }
  .om-rx-mode-option { min-width: 96px; padding-inline: 11px; }
}


/* v41.73.40 · Base visual coherente para módulos autenticados */
.om-app-main .page-pad {
  width: min(100%, 1280px) !important;
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 28px 32px 96px !important;
  box-sizing: border-box;
}
.om-app-main .page-pad > h1,
.om-app-main .page-pad .r-hero {
  font-size: clamp(38px, 4vw, 50px) !important;
  line-height: 1.04 !important;
  letter-spacing: -0.025em !important;
  margin-top: 7px !important;
}
.om-app-main .page-pad > .card,
.om-app-main .page-pad .om-premium-card {
  border-radius: 22px !important;
  box-shadow: inset 0 0 0 1px var(--line-soft), 0 8px 24px oklch(0.22 0.025 250 / .055) !important;
}
.om-app-main .om-card-head-row {
  min-height: 76px;
  padding: 18px 22px !important;
  align-items: center !important;
}
.om-app-main .om-section-title {
  font-size: 21px !important;
  line-height: 1.2;
  letter-spacing: -.015em;
}
.om-app-main button:focus-visible,
.om-app-main select:focus-visible,
.om-app-main input:focus-visible,
.om-app-main textarea:focus-visible {
  outline: 3px solid color-mix(in oklab, var(--accent), transparent 72%) !important;
  outline-offset: 2px;
}
.om-app-main .om-comms-tab.is-active {
  box-shadow: 0 8px 18px color-mix(in oklab, var(--accent), transparent 78%) !important;
}
.om-app-main .om-comms-tab:not(.is-active) {
  color: var(--ink-3);
  background: var(--surface);
}
.om-app-main .om-comms-tab:not(.is-active):hover {
  border-color: color-mix(in oklab, var(--accent), transparent 65%);
  color: var(--ink);
}
.om-app-main .om-subscription-card,
.om-app-main .om-plan-row,
.om-app-main .om-comms-provider-card {
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.om-app-main .om-subscription-card:hover,
.om-app-main .om-plan-row:hover {
  background: color-mix(in oklab, var(--surface), var(--surface-2) 24%);
}
@media (max-width: 1180px) {
  .om-app-main .page-pad { padding: 22px 18px 90px !important; }
}
@media (max-width: 720px) {
  .om-app-main .page-pad { padding: 18px 12px 84px !important; }
  .om-app-main .page-pad > h1,
  .om-app-main .page-pad .r-hero { font-size: clamp(32px, 10vw, 42px) !important; }
  .om-app-main .page-pad > .card,
  .om-app-main .page-pad .om-premium-card { border-radius: 18px !important; }
}

/* v41.73.43 · Ritmo vertical consistente entre módulos */
.om-app-main .page-pad {
  --om-page-gap-sm: 12px;
  --om-page-gap-md: 20px;
  --om-page-gap-lg: 26px;
}

/* Encabezados de página: separar título, bajada, estados y acciones. */
.om-app-main .page-pad > .om-plans-hero,
.om-app-main .page-pad > .om-premium-hero,
.om-app-main .page-pad > header,
.om-app-main .page-pad > [class*="-hero"] {
  margin-bottom: var(--om-page-gap-lg) !important;
}
.om-app-main .page-pad .om-chip-row {
  margin-top: var(--om-page-gap-sm);
}

/* KPIs y bloques principales nunca deben quedar pegados. */
.om-app-main .page-pad > [class*="-kpis"],
.om-app-main .page-pad > [class*="-grid"] {
  margin-bottom: var(--om-page-gap-md);
}
.om-app-main .page-pad > [class*="-kpis"] + .om-premium-card,
.om-app-main .page-pad > [class*="-kpis"] + .card,
.om-app-main .page-pad > .om-premium-card + .om-premium-card,
.om-app-main .page-pad > .card + .card {
  margin-top: var(--om-page-gap-md) !important;
}

/* Planes: jerarquía clara entre cabecera, KPIs y catálogo. */
.om-app-main .om-plans-page .om-plans-hero {
  margin-bottom: 24px !important;
}
.om-app-main .om-plans-page .om-plan-kpis {
  margin-bottom: 24px !important;
}
.om-app-main .om-plans-page .om-plan-catalog-card,
.om-app-main .om-plans-page .om-clinic-plans-card {
  margin-bottom: 24px !important;
}
.om-app-main .om-plans-page .om-card-head-row {
  padding-block: 20px !important;
}

/* Evitar que cards internas pierdan aire por reglas heredadas. */
.om-app-main .page-pad .om-premium-card > *:first-child {
  margin-top: 0;
}
.om-app-main .page-pad .om-premium-card > *:last-child {
  margin-bottom: 0;
}

@media (max-width: 1180px) {
  .om-app-main .page-pad {
    --om-page-gap-sm: 10px;
    --om-page-gap-md: 18px;
    --om-page-gap-lg: 22px;
  }
}
@media (max-width: 720px) {
  .om-app-main .page-pad {
    --om-page-gap-sm: 9px;
    --om-page-gap-md: 16px;
    --om-page-gap-lg: 20px;
  }
  .om-app-main .om-plans-page .om-plan-kpis {
    gap: 12px !important;
    margin-bottom: 20px !important;
  }
  .om-app-main .om-plans-page .om-plans-hero {
    margin-bottom: 20px !important;
  }
}
/* ===== END ui-consistency-v41-73-33.css ===== */


/* ===== BEGIN notifications-v41-73-51.css ===== */
/* OdontoNic v41.73.51 · Centro de notificaciones + enlace portal */

.om-notifications-page {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 28px 32px 96px;
}

.om-notif-hero {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 20px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}
.om-notif-hero h1 {
  margin: 6px 0 8px;
  font-size: clamp(38px, 4vw, 58px);
  line-height: 1.02;
}
.om-notif-hero > button {
  min-height: 46px;
  padding-inline: 20px;
}

.om-notif-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.om-notif-tabs {
  display: inline-flex;
  gap: 8px;
  padding: 5px;
  border: 1px solid var(--line-soft);
  border-radius: 16px;
  background: var(--surface-2);
}
.om-notif-tabs button {
  min-height: 42px;
  padding: 9px 15px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  color: var(--ink-3);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  transition: background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.om-notif-tabs button:hover {
  background: var(--surface);
  color: var(--ink-2);
}
.om-notif-tabs button.active {
  border-color: color-mix(in oklab, var(--accent), transparent 72%);
  background: var(--accent);
  color: #fff;
  box-shadow: 0 8px 18px color-mix(in oklab, var(--accent), transparent 78%);
}
.om-notif-tabs span {
  display: inline-grid;
  place-items: center;
  min-width: 22px;
  height: 22px;
  margin-left: 7px;
  padding: 0 6px;
  border-radius: 999px;
  background: color-mix(in oklab, currentColor, transparent 84%);
  font-size: 11px;
}

.om-notif-actions {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
}
.om-notif-actions select,
.om-notif-compose-grid select,
.om-notif-compose-grid input,
.om-notif-compose-grid textarea {
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--surface);
  color: var(--ink);
  padding: 9px 13px;
  font: inherit;
  outline: none;
}
.om-notif-actions select:focus,
.om-notif-compose-grid select:focus,
.om-notif-compose-grid input:focus,
.om-notif-compose-grid textarea:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-soft);
}

.om-notif-list-card {
  overflow: hidden;
  border: 1px solid var(--line-soft);
  border-radius: var(--r-xl);
  background: var(--surface);
  box-shadow: var(--shadow-md);
}
.om-notif-row {
  position: relative;
  width: 100%;
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto auto;
  align-items: center;
  gap: 13px;
  padding: 15px 18px;
  border: 0;
  border-bottom: 1px solid var(--line-soft);
  background: var(--surface);
  color: inherit;
  text-align: left;
  cursor: pointer;
  transition: background .14s ease;
}
.om-notif-row:last-child { border-bottom: 0; }
.om-notif-row:hover { background: var(--surface-2); }
.om-notif-row.read { opacity: .76; }
.om-notif-row.unread {
  background: color-mix(in oklab, var(--accent-soft), var(--surface) 62%);
}
.om-notif-row-title {
  color: var(--ink);
  font-size: 14px;
  font-weight: 900;
}
.om-notif-row-preview {
  margin-top: 3px;
  overflow: hidden;
  color: var(--ink-3);
  font-size: 13px;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.om-notif-row-meta {
  margin-top: 5px;
  color: var(--ink-4);
  font-size: 10.5px;
}
.om-notif-unread-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 4px var(--accent-soft);
}
.om-notif-delete,
.om-notif-icon-btn {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  background: var(--surface);
  color: var(--ink-3);
  cursor: pointer;
}
.om-notif-delete:hover,
.om-notif-icon-btn:hover {
  background: var(--surface-2);
  color: var(--ink);
}

.om-notif-preview-backdrop {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 24px;
  background: oklch(0.16 0.02 250 / .48);
  backdrop-filter: blur(8px);
}
.om-notif-preview {
  width: min(680px, 100%);
  height: auto;
  max-height: min(86vh, 820px);
  display: flex;
  flex-direction: column;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 26px;
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: 24px;
  box-shadow: 0 28px 90px rgba(15,23,42,.28);
}
.om-notif-preview-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}
.om-notif-preview-title {
  margin-top: 6px;
  font-size: 30px;
  line-height: 1.08;
}
.om-notif-preview-meta {
  margin-top: 18px;
  color: var(--ink-4);
  font-size: 12px;
}
.om-notif-preview-body {
  margin-top: 22px;
  color: var(--ink-2);
  font-size: 15px;
  line-height: 1.7;
  white-space: pre-wrap;
}
.om-notif-preview-summary {
  margin-top: 18px;
  padding: 14px;
  border-radius: 16px;
  background: var(--surface-2);
  color: var(--ink-3);
  font-size: 13px;
  line-height: 1.55;
}
.om-notif-preview-actions {
  display: flex;
  justify-content: flex-end;
  gap: 9px;
  margin-top: auto;
  padding-top: 26px;
  flex-wrap: wrap;
}
.om-notif-compose-grid {
  display: grid;
  gap: 14px;
  margin-top: 22px;
}
.om-notif-compose-grid label { display: grid; gap: 7px; }
.om-notif-compose-grid textarea { min-height: 150px; resize: vertical; }

.om-notif-bell-wrap { position: relative; }
.om-notif-bell {
  position: relative;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  background: oklch(from var(--surface) l c h / .92);
  color: var(--ink-3);
  cursor: pointer;
  box-shadow: 0 10px 24px oklch(0.22 0.02 250 / .08);
}
.om-notif-bell:hover { color: var(--accent); background: var(--surface); }
.om-notif-bell > span {
  position: absolute;
  top: -6px;
  right: -6px;
  min-width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  padding: 0 5px;
  border: 2px solid var(--surface);
  border-radius: 999px;
  background: var(--danger);
  color: #fff;
  font-size: 10px;
  font-weight: 900;
}
.om-notif-popover-backdrop { position: fixed; inset: 0; z-index: 38; }
.om-notif-popover {
  position: absolute;
  top: 48px;
  right: 0;
  z-index: 39;
  width: 370px;
  max-height: 470px;
  overflow: auto;
  border: 1px solid var(--line-soft);
  border-radius: 18px;
  background: var(--surface);
  box-shadow: 0 24px 70px rgba(15,23,42,.24);
}
.om-notif-popover-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 15px 16px;
  border-bottom: 1px solid var(--line-soft);
}
.om-notif-popover-head strong { color: var(--ink); font-size: 14px; }
.om-notif-popover-head button {
  border: 0;
  background: transparent;
  color: var(--accent);
  font: inherit;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}
.om-notif-popover-row {
  width: 100%;
  display: grid;
  grid-template-columns: 9px minmax(0,1fr);
  gap: 10px;
  padding: 13px 16px;
  border: 0;
  border-bottom: 1px solid var(--line-soft);
  background: var(--surface);
  color: inherit;
  text-align: left;
  cursor: pointer;
}
.om-notif-popover-row:hover { background: var(--surface-2); }
.om-notif-popover-row .dot {
  width: 7px;
  height: 7px;
  margin-top: 6px;
  border-radius: 50%;
  background: var(--accent);
}
.om-notif-popover-row b { display: block; color: var(--ink); font-size: 12.5px; }
.om-notif-popover-row small {
  display: block;
  margin-top: 3px;
  overflow: hidden;
  color: var(--ink-3);
  font-size: 11.5px;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.om-notif-popover-all {
  width: 100%;
  padding: 13px;
  border: 0;
  background: var(--surface-2);
  color: var(--accent);
  font: inherit;
  font-weight: 900;
  cursor: pointer;
}
.om-notif-popover-empty {
  padding: 26px 20px;
  color: var(--ink-4);
  font-size: 13px;
  text-align: center;
}

/* Portal paciente: recuperación como link, no botón de formulario */
.pp-forgot-link {
  display: block;
  width: fit-content;
  margin: 12px auto 0;
  padding: 2px 4px;
  border: 0 !important;
  border-radius: 6px;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--pp-green-dark, #08775d) !important;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
  text-decoration: none;
  cursor: pointer;
}
.pp-forgot-link:hover { text-decoration: underline; }
.pp-forgot-link:focus-visible {
  outline: 2px solid var(--pp-green, #1fa77e);
  outline-offset: 3px;
}

@media (max-width: 900px) {
  .om-notifications-page { padding: 22px 18px 90px; }
  .om-notif-popover { position: fixed; top: 64px; right: 12px; left: 12px; width: auto; }
  .om-notif-preview { width: min(480px,100%); }
}

@media (max-width: 600px) {
  .om-notifications-page { padding: 18px 12px 86px; }
  .om-notif-hero { align-items: stretch; }
  .om-notif-hero > button { width: 100%; }
  .om-notif-toolbar { align-items: stretch; }
  .om-notif-tabs { width: 100%; display: grid; grid-template-columns: 1fr 1fr; }
  .om-notif-tabs button { width: 100%; }
  .om-notif-actions { width: 100%; align-items: stretch; }
  .om-notif-actions select,
  .om-notif-actions button { width: 100%; }
  .om-notif-row { grid-template-columns: auto minmax(0,1fr) auto; padding: 13px 12px; }
  .om-notif-delete { grid-column: 3; grid-row: 1; }
  .om-notif-unread-dot { position: absolute; top: 14px; left: 13px; }
  .om-notif-row-preview {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
  .om-notif-preview { padding: 18px; }
  .om-notif-preview-title { font-size: 25px; }
  .om-notif-preview-actions > * { width: 100%; }
  .pp-forgot-link { margin-top: 10px; font-size: 12.5px; }
}

.om-notif-compose { width: min(620px, 100%); }

.om-notif-thread { display:grid; gap:12px; margin-top:20px; max-height:48vh; overflow:auto; padding:4px; }
.om-notif-thread-item { max-width:86%; padding:12px 14px; border:1px solid var(--line-soft); border-radius:16px 16px 16px 5px; background:var(--surface-2); }
.om-notif-thread-item.mine { margin-left:auto; border-radius:16px 16px 5px 16px; background:var(--accent-soft); }
.om-notif-thread-item b { display:block; font-size:12px; }
.om-notif-thread-item small { display:block; margin-top:2px; color:var(--ink-4); font-size:10px; }
.om-notif-thread-item p { margin:8px 0 0; white-space:pre-wrap; line-height:1.55; }
.om-notif-reply-to { padding:12px 14px; border-radius:14px; background:var(--surface-2); color:var(--ink-3); }
@media (max-width: 640px) { .om-notif-preview-backdrop { align-items:flex-end; padding:0; } .om-notif-preview { width:100%; max-height:92vh; border-radius:22px 22px 0 0; padding:20px; } }
/* ===== END notifications-v41-73-51.css ===== */


/* ===== BEGIN mobile-clinic-lite-v41-73-90.css ===== */
/* OdontoNic v41.73.92 · Modo móvil operativo reducido para la app clínica */
@media (max-width: 767px) {
  html.om-clinic-mobile-lite,
  html.om-clinic-mobile-lite body { overflow-x: hidden !important; }

  /* En celular: Agenda, Notificaciones y resumen esencial del paciente. */

  html.om-clinic-mobile-lite .page-pad {
    padding-left: 10px !important;
    padding-right: 10px !important;
    padding-bottom: 92px !important;
  }

  /* Agenda: la página maneja el desplazamiento vertical. */
  html.om-clinic-mobile-lite .agenda-day-scroll,
  html.om-clinic-mobile-lite .r-scroll.agenda-day-scroll {
    overflow-x: auto !important;
    overflow-y: visible !important;
    max-height: none !important;
    height: auto !important;
    touch-action: pan-x pan-y !important;
    overscroll-behavior-x: contain;
    overscroll-behavior-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  html.om-clinic-mobile-lite .agenda-day-scroll > div,
  html.om-clinic-mobile-lite .r-scroll.agenda-day-scroll > div {
    min-width: 680px !important;
    max-height: none !important;
    overflow-y: visible !important;
  }
  html.om-clinic-mobile-lite .agenda-day-scroll [style*="height"],
  html.om-clinic-mobile-lite .r-scroll.agenda-day-scroll [style*="height"] {
    touch-action: pan-y !important;
  }

  /* Vista diaria como formato operativo del teléfono. */
  html.om-clinic-mobile-lite .om-agenda-month-grid { display: none !important; }
  html.om-clinic-mobile-lite .mobile-topbar { min-height: 58px; }
  html.om-clinic-mobile-lite .mobile-topbar + * { min-width: 0; }

  /* Menú móvil limpio: el script marca lo permitido. */
  html.om-clinic-mobile-lite .app-sidebar .nav-item.om-mobile-hidden,
  html.om-clinic-mobile-lite .app-sidebar .om-sidebar-section.om-mobile-empty,
  html.om-clinic-mobile-lite .app-sidebar [data-om-mobile-hide="1"] { display: none !important; }
  html.om-clinic-mobile-lite .app-sidebar .om-sidebar-section-body,
  html.om-clinic-mobile-lite .app-sidebar .om-sidebar-section-body-inner { min-width: 0; }

  /* Evita que tarjetas y controles creen scroll lateral accidental. */
  html.om-clinic-mobile-lite main,
  html.om-clinic-mobile-lite .om-app-main,
  html.om-clinic-mobile-lite .page-pad,
  html.om-clinic-mobile-lite .page-pad > * { width: 100%; max-width: 100%; min-width: 0; }

  html.om-clinic-mobile-lite .om-mobile-mode-notice { display:flex; gap:10px; align-items:flex-start; margin:10px 10px 0; padding:11px 12px; border:1px solid color-mix(in oklab,var(--accent) 28%,var(--line)); border-radius:14px; background:color-mix(in oklab,var(--accent-soft) 58%,var(--surface)); color:var(--ink-2); }
  html.om-clinic-mobile-lite .om-mobile-mode-notice-icon { flex:0 0 22px; width:22px; height:22px; display:grid; place-items:center; border-radius:50%; background:var(--accent); color:white; font-weight:800; font-size:12px; }
  html.om-clinic-mobile-lite .om-mobile-mode-notice div { display:grid; gap:2px; min-width:0; }
  html.om-clinic-mobile-lite .om-mobile-mode-notice strong { font-size:12px; color:var(--ink); }
  html.om-clinic-mobile-lite .om-mobile-mode-notice span { font-size:11px; line-height:1.4; }
  html.om-clinic-mobile-lite .om-mobile-clinical-limit { display:grid; gap:4px; margin-top:12px; padding:13px 14px; border-radius:14px; background:var(--surface-2); border:1px solid var(--line-soft); color:var(--ink-3); }
  html.om-clinic-mobile-lite .om-mobile-clinical-limit strong { color:var(--ink); font-size:12.5px; }
  html.om-clinic-mobile-lite .om-mobile-clinical-limit span { font-size:11.5px; line-height:1.5; }
  html.om-clinic-mobile-lite .patient-header-side { min-width:100% !important; max-width:100% !important; }
  html.om-clinic-mobile-lite .om-mobile-patient-summary [style*="repeat(2"] { grid-template-columns:1fr !important; }
}
/* ===== END mobile-clinic-lite-v41-73-90.css ===== */


/* ===== BEGIN portal-base-v41-73-99.css ===== */
/* portal-base-v41-73-99.css — estilos base del Portal Paciente.
   Consolidados desde el <style> que portal-pacientes-login.jsx inyectaba
   en runtime (v41.73.98 y anteriores). Fuente única de verdad del portal:
   editar acá, no reintroducir <style> inyectado. */
:root { --pp-green: #1d9e75; --pp-green-dark: #12523d; --pp-green-soft: #e7f6f0; --pp-ink: #17243a; --pp-muted: #6a778a; --pp-line: rgba(24, 39, 67, .11); }
.pp-wrap { min-height: 100vh; min-height: 100dvh; background: linear-gradient(145deg, #f6f9fb 0%, #eef6f4 58%, #f8fbfc 100%); color: var(--ink, var(--pp-ink)); }
.pp-login-shell { min-height: 100vh; min-height: 100dvh; display: grid; place-items: center; padding: 26px; }
.pp-login { width: min(1040px, 100%); min-height: min(720px, calc(100dvh - 52px)); background: #fff; border: 1px solid var(--pp-line); border-radius: 34px; overflow: hidden; box-shadow: 0 34px 95px rgba(26, 42, 68, .15); display: grid; grid-template-columns: minmax(360px, .86fr) minmax(360px, 1fr); }
.pp-login-panel { padding: clamp(28px, 5vw, 58px); display: flex; flex-direction: column; justify-content: flex-start; scroll-behavior: smooth; }
.pp-brand { display: flex; align-items: center; gap: 12px; margin-bottom: 34px; }
.pp-logo-tile { width: 54px; height: 54px; border-radius: 16px; background: #fff; box-shadow: inset 0 0 0 1px var(--pp-line), 0 12px 26px rgba(17, 82, 61, .12); display: grid; place-items: center; flex: 0 0 auto; }
.pp-brand-title { font-size: 22px; font-weight: 900; letter-spacing: -.03em; color: var(--pp-ink); line-height: 1; }
.pp-brand-sub { color: var(--pp-muted); font-size: 12px; letter-spacing: .13em; text-transform: uppercase; margin-top: 4px; }
.pp-login h1 { font-size: clamp(34px, 5vw, 54px); line-height: .95; margin: 0 0 14px; letter-spacing: -.055em; color: var(--pp-ink); }
.pp-lead { color: var(--pp-muted); font-size: 15px; line-height: 1.65; margin: 0 0 24px; max-width: 440px; }
.pp-field { display: grid; gap: 7px; font-size: 11px; color: #7a8798; text-transform: uppercase; letter-spacing: .11em; font-weight: 800; }
.pp-input { width: 100%; box-sizing: border-box; border: 1px solid var(--pp-line); border-radius: 17px; background: #f9fbfc; color: var(--pp-ink); padding: 15px 16px; font: inherit; outline: none; transition: border-color .15s, box-shadow .15s, background .15s; }
.pp-input:focus { border-color: var(--pp-green); background: #fff; box-shadow: 0 0 0 4px rgba(29, 158, 117, .14); }
.pp-btn { border: 0; border-radius: 17px; padding: 15px 18px; background: var(--pp-green); color: #fff; font-weight: 900; font-size: 15px; cursor: pointer; box-shadow: 0 14px 28px rgba(29, 158, 117, .23); transition: transform .1s ease, filter .15s ease, opacity .15s ease; }
.pp-btn:hover { filter: brightness(1.04); transform: translateY(-1px); } .pp-btn:active { transform: translateY(0); }
.pp-btn[disabled] { opacity: .62; cursor: wait; transform: none; }
.pp-btn-soft { border: 1px solid var(--pp-line); background: #fff; color: var(--pp-ink); box-shadow: none; }
.pp-login-note { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--pp-line); color: #8a96a7; font-size: 12.5px; line-height: 1.5; }
.pp-footer { color: #8a96a7; font-size: 11.5px; line-height: 1.4; text-align: center; letter-spacing: .02em; }
.pp-footer strong { color: var(--pp-ink); font-weight: 900; }
.pp-login-footer { margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(24,39,67,.07); }
.pp-app-footer { max-width: 1100px; margin: -48px auto 0; padding: 0 22px 24px; }
.pp-error { padding: 12px 14px; border-radius: 15px; background: #fff1f1; color: #b42333; font-size: 13px; line-height: 1.45; }
.pp-success { padding: 12px 14px; border-radius: 15px; background: var(--pp-green-soft); color: var(--pp-green-dark); font-size: 13px; line-height: 1.45; }
.pp-choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 4px 0 14px; }
.pp-access-card { text-align: left; border: 1px solid var(--pp-line); background: #fff; border-radius: 18px; padding: 14px; cursor: pointer; color: var(--pp-ink); transition: border-color .15s, box-shadow .15s, transform .1s; }
.pp-access-card:hover, .pp-access-card.active { border-color: rgba(29,158,117,.55); box-shadow: 0 12px 28px rgba(29,158,117,.12); transform: translateY(-1px); }
.pp-access-card b { display: block; font-size: 14px; margin-bottom: 3px; }
.pp-access-card small { color: var(--pp-muted); line-height: 1.35; }
.pp-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.pp-form-grid .span2 { grid-column: 1 / -1; }
.pp-back { border: 0; background: transparent; color: var(--pp-green-dark); font-weight: 900; cursor: pointer; padding: 0; width: max-content; }
.pp-muted-box { border: 1px dashed rgba(24,39,67,.18); background: #fbfcfd; border-radius: 16px; padding: 12px 14px; color: var(--pp-muted); font-size: 12.5px; line-height: 1.45; }
.pp-login-visual { position: relative; overflow: hidden; background: radial-gradient(120% 95% at 12% 10%, rgba(42, 179, 137, .95) 0%, transparent 56%), radial-gradient(110% 110% at 92% 90%, rgba(9, 72, 54, .88) 0%, transparent 62%), linear-gradient(160deg, #1d9e75 0%, #12523d 100%); display: flex; align-items: flex-end; padding: clamp(32px, 5vw, 58px); color: #fff; }
.pp-arcada { display: none; }
.pp-visual-logo { position: absolute; left: 50%; top: 28%; transform: translate(-50%, -50%); width: clamp(150px, 18vw, 210px); height: clamp(150px, 18vw, 210px); border-radius: 42px; display: grid; place-items: center; background: rgba(255,255,255,.94); border: 1px solid rgba(255,255,255,.58); box-shadow: 0 28px 70px rgba(4,46,34,.28), inset 0 0 0 1px rgba(20,80,62,.08); backdrop-filter: blur(10px); }
.pp-visual-logo img { width: 78%; height: 78%; object-fit: contain; }
.pp-tooth { position: absolute; width: 30px; height: 42px; border-radius: 40% 40% 55% 55%; background: rgba(255,255,255,.13); border: 1px solid rgba(255,255,255,.24); backdrop-filter: blur(2px); animation: ppfloat 6s ease-in-out infinite; transform: rotate(var(--rot, 0deg)); }
@keyframes ppfloat { 0%,100% { translate: 0 0; } 50% { translate: 0 -9px; } }
.pp-visual-copy { position: relative; max-width: 430px; display: grid; gap: 14px; }
.pp-visual-copy h2 { color: #fff; font-size: clamp(25px, 3vw, 36px); line-height: 1.05; margin: 0; letter-spacing: -.04em; }
.pp-visual-copy p { color: rgba(255,255,255,.84); margin: 0; line-height: 1.6; }
.pp-pasos { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 4px; }
.pp-pasos span { background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.26); padding: 7px 12px; border-radius: 999px; font-size: 12px; font-weight: 800; }
.pp-topbar { position: sticky; top: 0; z-index: 20; background: rgba(255,255,255,.84); backdrop-filter: blur(16px); border-bottom: 1px solid var(--pp-line); }
.pp-topbar-inner { max-width: 1100px; margin: 0 auto; padding: 14px 22px; display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.pp-top-user { display: flex; align-items: center; gap: 11px; min-width: 0; }
.pp-avatar { width: 40px; height: 40px; border-radius: 50%; background: var(--pp-green-soft); color: var(--pp-green-dark); display: grid; place-items: center; font-weight: 900; flex: 0 0 auto; }
.pp-main { max-width: 1100px; margin: 0 auto; padding: 32px 22px 84px; display: grid; gap: 30px; }
.pp-hero { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 18px; }
.pp-hero h1 { font-size: clamp(34px, 6vw, 58px); line-height: .95; margin: 0; letter-spacing: -.055em; color: var(--pp-ink); }
.pp-hero p { color: var(--pp-muted); margin: 9px 0 0; font-size: 15px; }
.pp-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(330px, .76fr); gap: 18px; align-items: start; }
.pp-stack { display: grid; gap: 18px; }
.pp-section { background: #fff; border: 1px solid var(--pp-line); border-radius: 24px; box-shadow: 0 18px 55px rgba(25, 41, 68, .07); overflow: hidden; }
.pp-section-head { display: flex; align-items: center; gap: 11px; padding: 18px 20px 14px; border-bottom: 1px solid var(--pp-line); }
.pp-section-ico { width: 38px; height: 38px; border-radius: 13px; display: grid; place-items: center; background: var(--pp-green-soft); color: var(--pp-green); flex: 0 0 auto; }
.pp-section-title { font-size: 18px; color: var(--pp-ink); font-weight: 900; letter-spacing: -.02em; }
.pp-count { margin-left: auto; padding: 3px 10px; border-radius: 999px; background: var(--pp-green-soft); color: var(--pp-green-dark); font-weight: 900; font-size: 12px; }
.pp-row { display: flex; align-items: center; gap: 14px; padding: 15px 20px; border-top: 1px solid rgba(24,39,67,.07); }
.pp-section-body > .pp-row:first-child { border-top: 0; }
.pp-datebadge { width: 58px; flex: 0 0 auto; text-align: center; background: var(--pp-green-soft); border-radius: 15px; padding: 8px 4px; }
.pp-datebadge .dia { font-size: 22px; font-weight: 950; color: var(--pp-green-dark); line-height: 1; }
.pp-datebadge .mes { font-size: 10px; font-weight: 900; color: var(--pp-green); text-transform: uppercase; letter-spacing: .08em; }
.pp-empty { border: 1.5px dashed rgba(24,39,67,.14); border-radius: 18px; padding: 28px; margin: 18px 20px 20px; text-align: center; color: var(--pp-muted); font-size: 14px; }
.pp-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px; border-radius: 999px; border: 0; font-size: 12px; font-weight: 900; font-family: inherit; cursor: pointer; text-decoration: none; }
.pp-reserva { padding: 18px 20px 20px; display: grid; gap: 16px; }
.pp-reserva-steps { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; color: #8a96a7; font-size: 12px; font-weight: 900; }
.pp-reserva-steps span { display: inline-flex; align-items: center; gap: 6px; }
.pp-reserva-steps span::before { content: attr(data-n); width: 20px; height: 20px; border-radius: 50%; background: #e7edf2; color: #6b788b; display: grid; place-items: center; font-size: 11px; }
.pp-reserva-steps span.activo { color: var(--pp-green-dark); } .pp-reserva-steps span.activo::before { background: var(--pp-green); color: #fff; }
.pp-reserva-steps i { width: 20px; height: 1px; background: rgba(24,39,67,.16); }
.pp-prof-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px; }
.pp-choice { border: 1.5px solid var(--pp-line); background: #fff; border-radius: 18px; padding: 14px; text-align: left; color: var(--pp-ink); cursor: pointer; transition: border-color .15s, box-shadow .15s, transform .1s; }
.pp-choice:hover { border-color: var(--pp-green); transform: translateY(-1px); }
.pp-choice.active { border-color: var(--pp-green); box-shadow: 0 0 0 4px rgba(29,158,117,.13); background: linear-gradient(0deg, rgba(29,158,117,.035), rgba(29,158,117,.035)), #fff; }
.pp-days, .pp-hours { display: flex; gap: 9px; overflow-x: auto; padding-bottom: 3px; -webkit-overflow-scrolling: touch; }
.pp-day { flex: 0 0 auto; min-width: 86px; text-align: center; }
.pp-hour { flex: 0 0 auto; }
.pp-resumen { border: 1px solid var(--pp-line); border-radius: 18px; padding: 14px; background: #f8fbfa; display: grid; gap: 10px; }
.pp-mini-label { font-size: 10px; text-transform: uppercase; letter-spacing: .11em; color: #8a96a7; font-weight: 900; }
.pp-request-card { border: 1px solid var(--pp-line); border-radius: 18px; padding: 14px; background: #fff; display: grid; gap: 8px; }

/* v41.40 · ajuste viewport portal paciente: entra en pantalla siempre que el contenido lo permita */
.pp-wrap { min-height: 100dvh; overflow-x: hidden; }
.pp-login-shell { min-height: 100dvh; padding: clamp(12px, 2.4vh, 24px); align-items: center; }
.pp-login { min-height: 0; height: min(690px, calc(100dvh - clamp(24px, 4.8vh, 48px))); max-height: calc(100dvh - clamp(24px, 4.8vh, 48px)); }
.pp-login-panel { padding: clamp(22px, 4vh, 44px); overflow: auto; scrollbar-width: thin; }
.pp-login-visual { padding: clamp(24px, 4vh, 44px); }
.pp-brand { margin-bottom: clamp(18px, 3vh, 30px); }
.pp-login h1 { font-size: clamp(32px, 4.4vw, 50px); margin-bottom: 10px; }
.pp-lead { margin-bottom: 18px; line-height: 1.52; }
.pp-login-note { margin-top: 16px; padding-top: 14px; }
.pp-topbar-inner { padding-block: 10px; }
.pp-main { min-height: calc(100dvh - 63px); padding-block: clamp(18px, 3vh, 28px) clamp(30px, 5vh, 58px); gap: clamp(16px, 2.5vh, 24px); }
.pp-hero h1 { font-size: clamp(32px, 5.2vw, 52px); }
.pp-hero p { margin-top: 6px; }
.pp-grid { gap: 16px; }
.pp-stack { gap: 16px; }
.pp-section { border-radius: 22px; }
.pp-section-head { padding: 14px 18px 12px; }
.pp-row { padding: 12px 18px; }
.pp-empty { padding: 22px; margin: 14px 18px 18px; }
.pp-reserva { padding: 16px 18px 18px; }
.pp-prof-grid { gap: 9px; }
.pp-choice { padding: 11px; }
.pp-days, .pp-hours { max-width: 100%; }
@media (min-width: 901px) and (max-height: 760px) {
  .pp-login { height: calc(100dvh - 24px); max-height: calc(100dvh - 24px); border-radius: 28px; }
  .pp-login-panel { padding: 22px 30px; }
  .pp-brand { margin-bottom: 16px; }
  .pp-logo-tile { width: 46px; height: 46px; border-radius: 14px; }
  .pp-logo-tile img { width: 34px !important; height: 34px !important; }
  .pp-login h1 { font-size: 40px; }
  .pp-lead { font-size: 14px; margin-bottom: 14px; }
  .pp-input, .pp-btn { padding: 12px 14px; border-radius: 14px; }
  .pp-login-note { font-size: 12px; margin-top: 12px; padding-top: 12px; }
  .pp-visual-copy h2 { font-size: 28px; }
  .pp-visual-copy p { font-size: 14px; line-height: 1.45; }
}
@media (min-width: 901px) and (max-height: 820px) {
  .pp-main { padding-top: 18px; gap: 16px; }
  .pp-hero h1 { font-size: 42px; }
  .pp-section-head { padding-block: 12px 10px; }
  .pp-row { padding-block: 11px; }
}

/* v41.73.7 · Portal Paciente responsive mobile-first */
@media (max-width: 1100px) {
  .pp-main, .pp-topbar-inner { max-width: 100%; }
  .pp-main { padding-left: clamp(18px, 3vw, 26px); padding-right: clamp(18px, 3vw, 26px); }
  .pp-grid { grid-template-columns: minmax(0, 1fr); }
  .pp-stack { min-width: 0; }
  .pp-section { width: 100%; min-width: 0; }
}

@media (max-width: 900px) {
  .pp-login-shell { display: block; padding: 18px; }
  .pp-login {
    width: min(680px, 100%);
    margin: 0 auto;
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
    height: auto;
    max-height: none;
    border-radius: 28px;
  }
  .pp-login-panel { overflow: visible; padding: clamp(26px, 6vw, 44px); }
  .pp-login-visual { display: none; }
  .pp-grid { grid-template-columns: minmax(0, 1fr); }
  .pp-hero { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .pp-hero > div:last-child { justify-content: flex-start; }
  .pp-prof-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
  .pp-choice-grid, .pp-form-grid { grid-template-columns: minmax(0, 1fr); }
  .pp-form-grid .span2 { grid-column: auto; }
  .pp-login-shell { padding: 0; background: #fff; }
  .pp-login {
    width: 100%;
    min-height: 100dvh;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }
  .pp-login-panel {
    justify-content: flex-start;
    padding: max(24px, env(safe-area-inset-top)) 18px max(28px, env(safe-area-inset-bottom));
  }
  .pp-brand { margin-bottom: 22px; }
  .pp-login h1 { font-size: clamp(32px, 11vw, 44px); line-height: 1; }
  .pp-lead { font-size: 14px; line-height: 1.5; }
  .pp-access-card { min-height: 74px; padding: 13px 14px; }
  .pp-input { min-height: 48px; font-size: 16px; }
  .pp-btn { min-height: 48px; }
  .pp-app-footer { margin-top: -34px; padding-bottom: max(22px, env(safe-area-inset-bottom)); }

  .pp-topbar { position: sticky; }
  .pp-topbar-inner { padding: 10px 12px; gap: 8px; }
  .pp-top-user { gap: 8px; }
  .pp-topbar-inner > .pp-top-user:first-child { min-width: 0; flex: 1 1 auto; }
  .pp-topbar-inner > .pp-top-user:last-child { flex: 0 0 auto; }
  .pp-topbar-inner > .pp-top-user:last-child > div:first-child { display: none; }
  .pp-topbar .pp-logo-tile { width: 38px !important; height: 38px !important; border-radius: 11px !important; }
  .pp-topbar .pp-logo-tile img { width: 27px !important; height: 27px !important; }
  .pp-topbar .pp-avatar { width: 36px; height: 36px; font-size: 12px; }
  .pp-topbar .pp-btn { width: auto; min-height: 38px; padding: 8px 11px !important; }

  .pp-main { padding: 20px 12px max(64px, env(safe-area-inset-bottom)); gap: 16px; }
  .pp-hero { gap: 12px; }
  .pp-hero h1 { font-size: clamp(32px, 11vw, 46px); }
  .pp-hero p { font-size: 14px; line-height: 1.5; }
  .pp-hero > div:last-child { gap: 6px !important; }
  .pp-chip { font-size: 11px; padding: 5px 9px; }

  .pp-stack { gap: 14px; }
  .pp-section { border-radius: 18px; box-shadow: 0 10px 34px rgba(25,41,68,.06); }
  .pp-section-head { padding: 13px 14px 11px; gap: 9px; }
  .pp-section-ico { width: 34px; height: 34px; border-radius: 11px; }
  .pp-section-title { font-size: 16px; }
  .pp-row { padding: 13px 14px; gap: 10px; align-items: flex-start; flex-wrap: wrap; }
  .pp-row > .pp-chip:last-child { margin-left: 68px; }
  .pp-datebadge { width: 50px; border-radius: 13px; padding: 7px 3px; }
  .pp-datebadge .dia { font-size: 20px; }
  .pp-empty { margin: 12px 14px 14px; padding: 20px 14px; }

  .pp-reserva { padding: 14px; gap: 14px; }
  .pp-reserva-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .pp-reserva-steps span { display: grid; grid-template-columns: 20px minmax(0, 1fr); align-items: center; gap: 5px; font-size: 10px; line-height: 1.15; }
  .pp-reserva-steps i { display: none; }
  .pp-prof-grid { grid-template-columns: minmax(0, 1fr); }
  .pp-choice { border-radius: 15px; }
  .pp-days, .pp-hours { margin-inline: -2px; padding: 2px 2px 6px; scroll-snap-type: x proximity; }
  .pp-day, .pp-hour { scroll-snap-align: start; }
  .pp-day { min-width: 76px; }
  .pp-resumen { padding: 12px; border-radius: 15px; }
  .pp-resumen .pp-btn { width: 100% !important; }
}

@media (max-width: 380px) {
  .pp-login-panel { padding-left: 14px; padding-right: 14px; }
  .pp-brand-title { font-size: 19px; }
  .pp-brand-sub { font-size: 10px; letter-spacing: .09em; }
  .pp-logo-tile { width: 48px; height: 48px; border-radius: 14px; }
  .pp-access-card { min-height: 68px; }
  .pp-main { padding-left: 9px; padding-right: 9px; }
  .pp-topbar-inner { padding-left: 9px; padding-right: 9px; }
  .pp-topbar-inner > .pp-top-user:first-child > div:nth-child(2) > div:last-child { display: none; }
  .pp-topbar .pp-avatar { display: none; }
  .pp-section-head { padding-left: 12px; padding-right: 12px; }
  .pp-row { padding-left: 12px; padding-right: 12px; }
  .pp-row > .pp-chip:last-child { margin-left: 60px; }
  .pp-reserva-steps { grid-template-columns: 1fr; }
  .pp-reserva-steps span { grid-template-columns: 20px 1fr; }
}


/* v41.73.7 · Login Portal Paciente realmente mobile-first */
.pp-login-form, .pp-prereg-form, .pp-token-form, .pp-token-completion { display: grid; gap: 12px; min-width: 0; }
.pp-login-panel > * { min-width: 0; }
.pp-login-panel { min-width: 0; }
.pp-choice-grid { width: 100%; min-width: 0; }
.pp-access-card { min-width: 0; overflow: hidden; }
.pp-access-card b, .pp-access-card small { overflow-wrap: anywhere; }

@media (max-width: 1100px) {
  .pp-login-shell { display: block; padding: 18px; }
  .pp-login {
    width: min(720px, 100%);
    margin: 0 auto;
    grid-template-columns: minmax(0, 1fr) !important;
    min-height: 0;
    height: auto;
    max-height: none;
    border-radius: 28px;
  }
  .pp-login-panel { overflow: visible; justify-content: flex-start; padding: clamp(26px, 5vw, 42px); }
  .pp-login-visual { display: none !important; }
}

@media (max-width: 700px) {
  .pp-login-shell {
    display: block;
    padding: 0;
    min-height: 100svh;
    background: #fff;
  }
  .pp-login {
    width: 100%;
    min-height: 100svh;
    min-height: 100dvh;
    margin: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    overflow: visible;
  }
  .pp-login-panel {
    width: 100%;
    box-sizing: border-box;
    padding: max(18px, env(safe-area-inset-top)) 16px max(24px, env(safe-area-inset-bottom));
    overflow: visible;
  }
  .pp-brand { margin-bottom: 16px; gap: 10px; }
  .pp-logo-tile { width: 46px; height: 46px; border-radius: 13px; }
  .pp-logo-tile img { width: 34px !important; height: 34px !important; }
  .pp-brand-title { font-size: 20px; line-height: 1.05; overflow-wrap: anywhere; }
  .pp-brand-sub { font-size: 10px; letter-spacing: .09em; }
  .pp-login h1 { font-size: clamp(30px, 9.5vw, 42px); line-height: 1.02; margin-bottom: 10px; }
  .pp-lead { font-size: 14px; line-height: 1.45; margin-bottom: 16px; }
  .pp-choice-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin: 0 0 14px;
  }
  .pp-access-card {
    min-height: 78px;
    padding: 11px 12px;
    border-radius: 15px;
  }
  .pp-access-card b { font-size: 13px; line-height: 1.15; margin-bottom: 4px; }
  .pp-access-card small { display: block; font-size: 11px; line-height: 1.28; }
  .pp-form-grid { grid-template-columns: minmax(0, 1fr) !important; gap: 10px; }
  .pp-form-grid .span2 { grid-column: auto !important; }
  .pp-field { font-size: 10px; gap: 6px; }
  .pp-input, .pp-btn { min-height: 48px; font-size: 16px; border-radius: 14px; }
  .pp-input { padding: 12px 13px; }
  .pp-btn { width: 100%; padding: 12px 14px; }
  .pp-muted-box, .pp-error, .pp-success { font-size: 12px; border-radius: 13px; }
  .pp-login-note { margin-top: 16px; padding-top: 14px; font-size: 11.5px; line-height: 1.45; }
  .pp-prereg-form > label[style] { align-items: flex-start !important; font-size: 12px !important; line-height: 1.4; }
  .pp-prereg-form > label[style] input { margin-top: 2px; flex: 0 0 auto; }
}

@media (max-width: 390px) {
  .pp-login-panel { padding-left: 13px; padding-right: 13px; }
  .pp-choice-grid { grid-template-columns: minmax(0, 1fr); }
  .pp-access-card { min-height: 64px; }
  .pp-login h1 { font-size: clamp(29px, 10.5vw, 38px); }
}

@media (max-width: 340px) {
  .pp-brand-title { font-size: 18px; }
  .pp-brand-sub { font-size: 9px; }
  .pp-logo-tile { width: 42px; height: 42px; }
  .pp-logo-tile img { width: 30px !important; height: 30px !important; }
  .pp-login-panel { padding-left: 10px; padding-right: 10px; }
}

/* v41.73.98 · Portal móvil: controles sin desbordes */
@media (max-width: 680px) {
  .pp-reserva { min-width: 0; overflow: hidden; }
  .pp-days, .pp-hours { width: 100%; max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
  .pp-choice { min-width: 0; }
  .pp-resumen > div:last-of-type { width: 100%; display: grid !important; grid-template-columns: 1fr !important; }
  .pp-resumen .pp-btn, .pp-resumen .pp-btn-soft { width: 100% !important; min-width: 0 !important; }
  .pp-prof-grid { grid-template-columns: 1fr !important; }
}
/* ===== END portal-base-v41-73-99.css ===== */


/* ===== BEGIN portal-paciente-v41-73-86.css ===== */
/* OdontoNic v41.73.86 · estabilidad visual Portal Paciente */
.pp-wrap { overflow-x: hidden; }
.pp-main { width: 100%; box-sizing: border-box; }
.pp-grid, .pp-stack, .pp-section, .pp-section-body, .pp-reserva { min-width: 0; max-width: 100%; }
.pp-section { width: 100%; box-sizing: border-box; }
.pp-days, .pp-hours { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.pp-resumen { min-width: 0; overflow-wrap: anywhere; }
.pp-resumen > div:last-of-type { min-width: 0; }

@media (min-width: 1101px) {
  .pp-main { max-width: 1180px !important; padding-left: 24px !important; padding-right: 24px !important; }
  .pp-grid { grid-template-columns: minmax(0, 1.35fr) minmax(320px, .85fr) !important; align-items: start !important; }
}

@media (max-width: 1100px) {
  .pp-grid { grid-template-columns: minmax(0, 1fr) !important; }
}

@media (max-width: 680px) {
  .pp-main { padding-left: 12px !important; padding-right: 12px !important; }
  .pp-section-head, .pp-row, .pp-reserva { padding-left: 14px !important; padding-right: 14px !important; }
  .pp-reserva .pp-btn { width: 100%; }
  .pp-reserva .pp-btn.pp-btn-soft { width: 100% !important; }
  .pp-resumen > div[style*="display: flex"] { display: grid !important; grid-template-columns: minmax(0,1fr) !important; }
}

/* v41.73.90 · Reserva portal móvil */
@media (max-width: 680px) {
  .pp-reserva { min-width: 0 !important; overflow: hidden !important; }
  .pp-days, .pp-hours { width: 100% !important; max-width: 100% !important; overflow-x: auto !important; }
  .pp-prof-grid { grid-template-columns: 1fr !important; }
  .pp-resumen > div:last-of-type { width: 100% !important; display: grid !important; grid-template-columns: 1fr !important; }
  .pp-resumen .pp-btn, .pp-resumen .pp-btn-soft { width: 100% !important; min-width: 0 !important; }
}
/* ===== END portal-paciente-v41-73-86.css ===== */


/* ===== BEGIN portal-mobile-v41-73-89.css ===== */
/* OdontoNic v41.73.90 · Portal paciente mobile y reprogramación */
@media (max-width: 700px) {
  .pp-main { width: 100%; max-width: 100%; box-sizing: border-box; overflow-x: clip; }
  .pp-grid, .pp-stack, .pp-section, .pp-section-body, .pp-reserva { min-width: 0; max-width: 100%; }
  .pp-section-head { align-items: center; flex-wrap: wrap; }
  .pp-section-title { min-width: 0; flex: 1 1 auto; }
  .pp-prof-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .pp-choice { min-width: 0; max-width: 100%; overflow: hidden; }
  .pp-days, .pp-hours { width: 100%; max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: thin; padding: 3px 1px 10px; }
  .pp-day { min-width: 92px !important; width: 92px; flex: 0 0 92px; }
  .pp-hour { min-width: 92px; flex: 0 0 92px; text-align: center; }
  .pp-resumen { min-width: 0; overflow: hidden; }
  .pp-resumen .pp-input { font-size: 16px; }
  .pp-resumen > div:last-of-type { display: grid !important; grid-template-columns: minmax(0,1fr); width: 100%; }
  .pp-resumen .pp-btn { width: 100% !important; min-width: 0; }
  .pp-row { display: grid !important; grid-template-columns: 54px minmax(0,1fr); align-items: start !important; }
  .pp-turno-actions { grid-column: 2; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
  .pp-reprogram-btn { background: var(--pp-green-soft); color: var(--pp-green-dark); border: 1px solid rgba(29,158,117,.2); }
  .pp-cancel-reprogram { margin-left: auto; background: #eef2f6; color: #5f6f83; }
  .pp-datebadge { width: 48px !important; box-sizing: border-box; }
}
@media (max-width: 390px) {
  .pp-main { padding-inline: 8px !important; }
  .pp-reserva { padding-inline: 12px !important; }
  .pp-day { min-width: 84px !important; width: 84px; flex-basis: 84px; }
  .pp-hour { min-width: 82px; flex-basis: 82px; }
}

/* App móvil · asistente rápido contenido dentro del viewport */
@media (max-width: 700px) {
  html, body, #root { max-width: 100%; overflow-x: hidden !important; }
  .om-assistant-dialog {
    position: fixed !important;
    left: 8px !important;
    right: 8px !important;
    bottom: calc(72px + env(safe-area-inset-bottom)) !important;
    width: auto !important;
    max-width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - 92px - env(safe-area-inset-bottom)) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    transform: none !important;
  }
  .om-assistant-dialog * { box-sizing: border-box; min-width: 0; }
  .om-assistant-dialog > div:nth-child(2) { width: 100% !important; overflow: hidden !important; }
  .om-assistant-dialog > div:nth-child(2) > div:nth-child(2) { width: 100%; overflow-x: auto !important; }
  .om-assistant-dialog > div:nth-child(2) > div:nth-child(3) { width: 100%; max-height: min(48dvh, 390px) !important; }
  .om-assistant-dialog input { width: 100% !important; max-width: 100% !important; font-size: 16px !important; }
  .om-assistant-dialog button { min-width: 0 !important; }
  button[aria-label="Asistente rápido"] { right: 72px !important; bottom: calc(14px + env(safe-area-inset-bottom)) !important; }
}
/* ===== END portal-mobile-v41-73-89.css ===== */


/* ===== BEGIN portal-mobile-v41-73-98.css ===== */
/* OdontoNic v41.73.98 · Portal Paciente mobile-first definitivo */
@media (max-width: 700px) {
  html, body, #root { width: 100%; max-width: 100%; overflow-x: hidden !important; }

  .pp-wrap,
  .pp-wrap * { box-sizing: border-box; }

  .pp-wrap {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  .pp-wrap .pp-main {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 14px 10px max(76px, env(safe-area-inset-bottom)) !important;
    overflow-x: hidden !important;
  }

  .pp-wrap .pp-grid,
  .pp-wrap .pp-stack,
  .pp-wrap .pp-section,
  .pp-wrap .pp-section-body,
  .pp-wrap .pp-reserva,
  .pp-wrap .pp-resumen {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .pp-wrap .pp-section {
    overflow: hidden !important;
    border-radius: 18px !important;
  }

  .pp-wrap .pp-section-head {
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 13px 14px !important;
    gap: 9px !important;
  }

  .pp-wrap .pp-section-title {
    min-width: 0 !important;
    overflow-wrap: anywhere;
  }

  .pp-wrap .pp-cancel-reprogram {
    margin-left: auto !important;
    flex: 0 0 auto !important;
  }

  .pp-wrap .pp-reserva {
    display: grid !important;
    gap: 14px !important;
    padding: 14px !important;
    overflow: visible !important;
  }

  .pp-wrap .pp-reserva > div,
  .pp-wrap .pp-reserva label,
  .pp-wrap .pp-prof-grid,
  .pp-wrap .pp-choice,
  .pp-wrap .pp-resumen > * {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .pp-wrap .pp-prof-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
  }

  .pp-wrap .pp-prof-grid .pp-choice {
    width: 100% !important;
    padding: 13px !important;
    text-align: left !important;
    overflow: hidden !important;
  }

  .pp-wrap .pp-days,
  .pp-wrap .pp-hours {
    display: grid !important;
    grid-auto-flow: column !important;
    grid-auto-columns: minmax(84px, 27vw) !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 3px 2px 10px !important;
    gap: 8px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    scroll-padding-inline: 2px;
    -webkit-overflow-scrolling: touch;
  }

  .pp-wrap .pp-day,
  .pp-wrap .pp-hour {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    scroll-snap-align: start;
  }

  .pp-wrap .pp-day {
    min-height: 104px !important;
    padding: 12px 8px !important;
  }

  .pp-wrap .pp-hour {
    min-height: 58px !important;
    padding: 12px 8px !important;
  }

  .pp-wrap .pp-resumen {
    display: grid !important;
    gap: 12px !important;
    padding: 13px !important;
    overflow: hidden !important;
  }

  .pp-wrap .pp-field,
  .pp-wrap .pp-input {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .pp-wrap .pp-input {
    font-size: 16px !important;
    padding: 12px 13px !important;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .pp-wrap .pp-resumen > div:last-of-type {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    gap: 10px !important;
  }

  .pp-wrap .pp-resumen .pp-btn,
  .pp-wrap .pp-resumen .pp-btn-soft {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 52px !important;
    margin: 0 !important;
    padding: 13px 14px !important;
    white-space: normal !important;
    text-align: center !important;
    line-height: 1.2 !important;
  }

  .pp-wrap .pp-resumen .pp-btn-soft {
    color: var(--pp-ink) !important;
    background: #fff !important;
  }

  .pp-wrap .pp-row {
    display: grid !important;
    grid-template-columns: 52px minmax(0, 1fr) !important;
    width: 100% !important;
    padding: 13px 14px !important;
    column-gap: 12px !important;
    row-gap: 8px !important;
    overflow: hidden !important;
  }

  .pp-wrap .pp-row > div:not(.pp-datebadge),
  .pp-wrap .pp-row b,
  .pp-wrap .pp-row small {
    min-width: 0 !important;
    overflow-wrap: anywhere;
  }

  .pp-wrap .pp-turno-actions {
    grid-column: 2 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin: 2px 0 0 !important;
  }

  .pp-wrap .pp-turno-actions .pp-chip {
    margin: 0 !important;
  }

  .pp-wrap .pp-empty {
    width: auto !important;
    max-width: calc(100% - 28px) !important;
  }
}

@media (max-width: 380px) {
  .pp-wrap .pp-main { padding-inline: 7px !important; }
  .pp-wrap .pp-reserva { padding-inline: 11px !important; }
  .pp-wrap .pp-days,
  .pp-wrap .pp-hours { grid-auto-columns: minmax(78px, 30vw) !important; }
  .pp-wrap .pp-reserva-steps { grid-template-columns: 1fr !important; }
}
/* ===== END portal-mobile-v41-73-98.css ===== */


/* ===== BEGIN portal-mobile-v41-73-105.css ===== */
/* OdontoNic v41.73.105 · Portal Paciente mobile polish */
@media (max-width: 760px) {
  .pp-wrap .pp-datebadge {
    width: 56px !important;
    min-width: 56px !important;
    height: 64px !important;
    padding: 8px 4px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    overflow: hidden !important;
    white-space: nowrap !important;
  }
  .pp-wrap .pp-datebadge .dia,
  .pp-wrap .pp-datebadge .mes {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
  }
  .pp-wrap .pp-datebadge .dia {
    font-size: 24px !important;
    line-height: .92 !important;
    letter-spacing: -.04em !important;
  }
  .pp-wrap .pp-datebadge .mes {
    font-size: 10px !important;
    line-height: 1 !important;
    letter-spacing: .08em !important;
  }
  .pp-wrap .pp-row {
    grid-template-columns: 56px minmax(0, 1fr) !important;
  }
  .pp-wrap .pp-list-controls {
    padding: 12px 14px 15px;
    border-top: 1px solid var(--pp-line);
    display: flex;
    justify-content: center;
  }
  .pp-wrap .pp-list-more {
    width: 100%;
    min-height: 44px;
    border: 1px solid rgba(24,167,122,.22);
    border-radius: 14px;
    background: var(--pp-green-soft);
    color: var(--pp-green-dark);
    font: inherit;
    font-weight: 900;
    cursor: pointer;
  }
  .pp-wrap .pp-booking-toast {
    position: fixed;
    left: max(12px, env(safe-area-inset-left));
    right: max(12px, env(safe-area-inset-right));
    bottom: calc(14px + env(safe-area-inset-bottom));
    z-index: 9999;
    display: grid;
    grid-template-columns: 42px minmax(0,1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 12px;
    border: 1px solid rgba(24,167,122,.25);
    border-radius: 18px;
    background: rgba(255,255,255,.98);
    box-shadow: 0 18px 48px rgba(14,45,65,.24);
  }
  .pp-wrap .pp-booking-toast-icon {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--pp-green);
    color: #fff;
    font-size: 22px;
    font-weight: 950;
  }
  .pp-wrap .pp-booking-toast-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
    color: var(--pp-ink);
  }
  .pp-wrap .pp-booking-toast-copy b { font-size: 14px; line-height: 1.2; }
  .pp-wrap .pp-booking-toast-copy small { color: var(--pp-muted); font-size: 11px; line-height: 1.3; }
  .pp-wrap .pp-booking-toast button {
    border: 0;
    border-radius: 12px;
    background: var(--pp-green-soft);
    color: var(--pp-green-dark);
    padding: 10px 11px;
    font: inherit;
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
  }
}
@media (max-width: 380px) {
  .pp-wrap .pp-booking-toast { grid-template-columns: 38px minmax(0,1fr); }
  .pp-wrap .pp-booking-toast-icon { width: 38px; height: 38px; }
  .pp-wrap .pp-booking-toast button { grid-column: 1 / -1; width: 100%; }
}
/* ===== END portal-mobile-v41-73-105.css ===== */


/* ===== BEGIN soft-clinical-v41-74.css ===== */
/* OdontoNic Soft Clinical v41.74
 * Direccion visual inspirada en superficies clinicas suaves, vidrio calido y turquesa.
 * Esta capa vive al final del bundle para unificar la UI legacy sin alterar su logica.
 */

:root {
  --sc-mint: #24b8ae;
  --sc-mint-deep: #0d8f89;
  --sc-mint-dark: #086b68;
  --sc-mint-soft: #dff7f3;
  --sc-aqua: #bfeee8;
  --sc-peach: #ffd7c5;
  --sc-cream: #fbf8f1;
  --sc-ink: #153c3a;
  --sc-muted: #667c79;
  --sc-line: rgba(20, 92, 87, .11);
  --sc-line-bright: rgba(255, 255, 255, .72);
  --sc-glass: rgba(255, 255, 255, .72);
  --sc-glass-strong: rgba(255, 255, 255, .88);
  --sc-shadow-xs: 0 5px 16px rgba(31, 91, 86, .06);
  --sc-shadow-sm: 0 12px 30px rgba(31, 91, 86, .09);
  --sc-shadow-md: 0 22px 55px rgba(31, 91, 86, .13);
  --sc-shadow-button: 0 12px 24px rgba(20, 174, 165, .26), inset 0 1px 0 rgba(255,255,255,.34);
  --sc-radius-sm: 14px;
  --sc-radius-md: 20px;
  --sc-radius-lg: 28px;
  --sc-radius-xl: 36px;

  --accent: var(--sc-mint);
  --accent-2: var(--sc-mint-deep);
  --accent-soft: var(--sc-mint-soft);
  --bg: #f2f7f4;
  --bg-tint: #edf6f2;
  --surface: #fffdfa;
  --surface-2: #f3f8f5;
  --ink: var(--sc-ink);
  --ink-2: #365956;
  --ink-3: var(--sc-muted);
  --ink-4: #8a9d9a;
  --line: var(--sc-line);
  --line-soft: rgba(20, 92, 87, .075);
  --premium-glass: var(--sc-glass);
  --premium-border: rgba(255,255,255,.72);
  --premium-shadow: var(--sc-shadow-md);
  --premium-shadow-soft: var(--sc-shadow-sm);
}

body {
  color: var(--sc-ink);
  background:
    radial-gradient(circle at 8% 3%, rgba(110, 221, 211, .28), transparent 28vw),
    radial-gradient(circle at 96% 8%, rgba(255, 207, 184, .28), transparent 30vw),
    linear-gradient(145deg, #eff9f6 0%, #faf8f2 50%, #fff5ed 100%) fixed;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .22;
  background-image: radial-gradient(rgba(12, 126, 119, .18) .55px, transparent .55px);
  background-size: 7px 7px;
  mask-image: linear-gradient(to bottom, black, transparent 48%);
  z-index: -1;
}

/* App shell */
.om-app-main {
  background: transparent !important;
}

.app-sidebar {
  background: rgba(250, 253, 250, .78) !important;
  border-right: 1px solid rgba(255,255,255,.78) !important;
  box-shadow: 14px 0 46px rgba(27, 90, 84, .07) !important;
  backdrop-filter: blur(22px) saturate(130%);
  -webkit-backdrop-filter: blur(22px) saturate(130%);
}

.app-sidebar button,
.om-sidebar-section-head {
  border-radius: 14px !important;
}

.app-sidebar button:hover,
.app-sidebar button.active,
.app-sidebar [aria-current="page"] {
  background: linear-gradient(135deg, rgba(213, 247, 242, .94), rgba(255,255,255,.82)) !important;
  color: var(--sc-mint-dark) !important;
  box-shadow: inset 0 0 0 1px rgba(31, 179, 169, .12), var(--sc-shadow-xs) !important;
}

.mobile-topbar {
  background: rgba(255,255,255,.76) !important;
  border-color: rgba(255,255,255,.78) !important;
  box-shadow: var(--sc-shadow-xs) !important;
  backdrop-filter: blur(18px) saturate(125%);
  -webkit-backdrop-filter: blur(18px) saturate(125%);
}

/* Surfaces */
.om-premium-card,
.om-account-card,
.om-subscription-card,
.om-clinic-picker-shell,
.om-global-modal-card,
.om-modal-card {
  border: 1px solid var(--sc-line-bright) !important;
  border-radius: var(--sc-radius-md) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.88), rgba(250,252,247,.69)) !important;
  box-shadow: var(--sc-shadow-sm), inset 0 0 0 1px rgba(25, 125, 118, .035) !important;
  backdrop-filter: blur(18px) saturate(122%);
  -webkit-backdrop-filter: blur(18px) saturate(122%);
}

.om-premium-card:hover {
  transform: translateY(-2px);
  border-color: rgba(255,255,255,.9) !important;
  box-shadow: var(--sc-shadow-md), inset 0 0 0 1px rgba(28,171,161,.08) !important;
}

.om-premium-hero {
  isolation: isolate;
  border: 1px solid rgba(255,255,255,.82) !important;
  border-radius: var(--sc-radius-lg) !important;
  background:
    radial-gradient(circle at 87% 24%, rgba(255,255,255,.72), transparent 16%),
    radial-gradient(circle at 84% 34%, rgba(62, 205, 195, .23), transparent 30%),
    radial-gradient(circle at 13% 8%, rgba(155, 236, 226, .52), transparent 35%),
    linear-gradient(135deg, rgba(239,252,248,.94), rgba(255,250,243,.84)) !important;
  box-shadow: var(--sc-shadow-md), inset 0 1px 0 rgba(255,255,255,.88) !important;
  backdrop-filter: blur(18px);
}

.om-premium-hero::before {
  content: "";
  position: absolute;
  right: clamp(18px, 5vw, 82px);
  top: 50%;
  width: clamp(95px, 12vw, 168px);
  aspect-ratio: 1;
  transform: translateY(-50%);
  border-radius: 48% 52% 45% 55%;
  background:
    radial-gradient(circle at 36% 28%, rgba(255,255,255,.96) 0 12%, transparent 13%),
    radial-gradient(circle at 50% 44%, #fff 0 38%, #dcefeb 64%, #8edbd2 100%);
  filter: drop-shadow(0 24px 24px rgba(27, 132, 125, .18));
  opacity: .42;
  z-index: -1;
}

.om-premium-hero::after {
  inset: auto -8% -60% auto;
  width: 430px;
  height: 430px;
  background: radial-gradient(circle, rgba(255, 203, 179, .26), transparent 64%);
  z-index: -2;
}

.om-action-tile,
.om-timeline-item,
.om-clinic-picker-card,
.pp-choice,
.pp-request-card {
  border: 1px solid rgba(255,255,255,.88) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.7) !important;
  box-shadow: var(--sc-shadow-xs), inset 0 0 0 1px rgba(20,92,87,.04) !important;
}

.om-action-tile:hover,
.om-clinic-picker-card:hover:not(:disabled) {
  background: linear-gradient(135deg, rgba(225,249,245,.94), rgba(255,255,255,.84)) !important;
  border-color: rgba(120, 218, 208, .48) !important;
  box-shadow: var(--sc-shadow-sm) !important;
}

.om-icon-bubble,
.om-timeline-dot,
.om-clinic-picker-icon,
.pp-section-ico {
  background: linear-gradient(145deg, #e7faf6, #ccefe9) !important;
  color: var(--sc-mint-deep) !important;
  border: 1px solid rgba(255,255,255,.8);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8), 0 8px 18px rgba(23,150,141,.12);
}

/* Controls */
input:not([type="checkbox"]):not([type="radio"]),
select,
textarea {
  border-color: rgba(20,92,87,.1) !important;
  border-radius: var(--sc-radius-sm) !important;
  background: rgba(255,255,255,.68) !important;
  box-shadow: inset 0 2px 8px rgba(31,91,86,.035), 0 1px 0 rgba(255,255,255,.85) !important;
  backdrop-filter: blur(10px);
}

input:not([type="checkbox"]):not([type="radio"]):focus,
select:focus,
textarea:focus {
  border-color: rgba(36,184,174,.55) !important;
  background: rgba(255,255,255,.9) !important;
  box-shadow: 0 0 0 4px rgba(36,184,174,.12), var(--sc-shadow-xs) !important;
}

button[style*="var(--accent)"],
.login-submit,
.pp-btn:not(.pp-btn-soft) {
  border-radius: 999px !important;
  background: linear-gradient(135deg, #25c5ba 0%, #17aaa1 58%, #0b8d88 100%) !important;
  color: white !important;
  box-shadow: var(--sc-shadow-button) !important;
  border: 1px solid rgba(255,255,255,.28) !important;
}

button[style*="var(--accent)"]:hover,
.login-submit:hover,
.pp-btn:not(.pp-btn-soft):hover {
  filter: brightness(1.035) saturate(1.04);
  transform: translateY(-1px) !important;
  box-shadow: 0 16px 29px rgba(20,174,165,.31), inset 0 1px 0 rgba(255,255,255,.4) !important;
}

/* Login */
.login-root {
  position: relative;
  isolation: isolate;
  gap: clamp(16px, 2vw, 30px);
  padding: clamp(14px, 2.2vw, 30px);
  background:
    radial-gradient(circle at 7% 12%, rgba(75,206,196,.38), transparent 30%),
    radial-gradient(circle at 94% 12%, rgba(255,198,172,.38), transparent 32%),
    linear-gradient(135deg, #dff5f1 0%, #f7f7ef 48%, #fff0e8 100%) !important;
}

.login-root::before,
.login-root::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  filter: blur(1px);
  z-index: -1;
}

.login-root::before {
  width: 180px;
  height: 180px;
  left: -45px;
  bottom: 8%;
  background: rgba(48,190,179,.18);
  box-shadow: 42px -65px 0 -28px rgba(255,255,255,.62);
}

.login-root::after {
  width: 145px;
  height: 145px;
  right: -36px;
  bottom: 11%;
  background: rgba(255,191,160,.2);
  box-shadow: -54px 54px 0 -35px rgba(255,255,255,.7);
}

.login-brand {
  border-radius: var(--sc-radius-xl) !important;
  padding: clamp(34px, 4vw, 56px) !important;
  background:
    radial-gradient(circle at 86% 15%, rgba(255,255,255,.35), transparent 24%),
    radial-gradient(circle at 72% 84%, rgba(255,217,198,.22), transparent 30%),
    linear-gradient(150deg, rgba(34,190,179,.95), rgba(18,155,149,.94) 58%, rgba(11,116,112,.96)) !important;
  border: 1px solid rgba(255,255,255,.46);
  box-shadow: 0 28px 72px rgba(22,112,106,.22), inset 0 1px 0 rgba(255,255,255,.42);
}

.login-form-panel {
  border-radius: var(--sc-radius-xl);
  border: 1px solid rgba(255,255,255,.72);
  background: rgba(255,255,255,.52);
  box-shadow: var(--sc-shadow-md), inset 0 1px 0 rgba(255,255,255,.8);
  backdrop-filter: blur(24px) saturate(120%);
  -webkit-backdrop-filter: blur(24px) saturate(120%);
}

.login-divider-wave {
  position: absolute;
  z-index: 4;
  top: 18px;
  bottom: 18px;
  left: calc(51.22% - 42px);
  width: 84px;
  pointer-events: none;
  filter: drop-shadow(8px 0 18px rgba(20, 109, 103, .1));
}

.login-divider-wave svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.login-divider-wave-glow { fill: rgba(215, 246, 240, .28); }
.login-divider-wave-core {
  fill: rgba(255, 253, 249, .86);
  stroke: rgba(255, 255, 255, .72);
  stroke-width: 1.2;
}
.login-divider-wave-line {
  fill: none;
  stroke: rgba(48, 190, 179, .3);
  stroke-width: 1.25;
  stroke-linecap: round;
  stroke-dasharray: 5 12;
}

.login-divider-orb {
  position: absolute;
  display: block;
  border: 1px solid rgba(255,255,255,.82);
  border-radius: 50%;
  background: linear-gradient(145deg, rgba(255,255,255,.86), rgba(126,225,215,.35));
  box-shadow: 0 8px 20px rgba(18,112,106,.13), inset 0 1px 2px rgba(255,255,255,.92);
  backdrop-filter: blur(5px);
}
.login-divider-orb.orb-one { top: 18%; right: 2px; width: 13px; height: 13px; }
.login-divider-orb.orb-two { top: 52%; left: 15px; width: 8px; height: 8px; }
.login-divider-orb.orb-three {
  right: 7px;
  bottom: 15%;
  width: 18px;
  height: 18px;
  background: linear-gradient(145deg, rgba(255,255,255,.9), rgba(255,205,181,.4));
}

.login-form-card {
  max-width: 390px !important;
  padding: clamp(8px, 2vw, 20px);
}

.login-form-card h2 {
  color: var(--sc-ink);
  letter-spacing: -.035em !important;
}

.login-submit {
  height: 50px !important;
  font-weight: 700 !important;
}

/* Portal paciente */
.pp-shell,
.om-patient-portal-shell {
  background:
    radial-gradient(circle at 8% 0%, rgba(95,218,207,.27), transparent 34vw),
    radial-gradient(circle at 94% 5%, rgba(255,203,179,.25), transparent 34vw),
    linear-gradient(145deg, #eef9f5, #fbf8f1 55%, #fff3eb) !important;
}

.pp-topbar {
  background: rgba(255,255,255,.72) !important;
  border-color: rgba(255,255,255,.72) !important;
  backdrop-filter: blur(20px) saturate(125%);
}

.pp-section {
  border: 1px solid rgba(255,255,255,.82) !important;
  border-radius: 24px !important;
  background: rgba(255,255,255,.72) !important;
  box-shadow: var(--sc-shadow-sm), inset 0 0 0 1px rgba(20,92,87,.035) !important;
  backdrop-filter: blur(16px);
}

@media (max-width: 980px) {
  .login-root {
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 14px;
  }

  .login-brand { display: none !important; }
  .login-divider-wave { display: none !important; }

  .login-form-panel {
    width: min(520px, 100%);
    min-height: min(680px, calc(100dvh - 28px));
    padding: 34px 24px !important;
  }

  .login-mobile-logo { display: flex !important; }
}

@media (max-width: 620px) {
  :root {
    --sc-radius-md: 18px;
    --sc-radius-lg: 22px;
  }

  .login-root { padding: 0; }
  .login-form-panel {
    width: 100%;
    min-height: 100dvh;
    border-radius: 0;
    border: 0;
    box-shadow: none;
    padding: 26px 20px !important;
  }

  .login-form-card { padding: 0; }

  .om-premium-hero::before { opacity: .2; right: -24px; }

  .om-premium-card,
  .om-account-card,
  .pp-section { border-radius: 18px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .om-premium-card,
  .om-action-tile,
  .login-submit { transition: none !important; }
}

/* ================================================================
   Phase 2: pantallas clinicas de alta densidad
   ================================================================ */

.sc-patients-page,
.sc-agenda-page,
.sc-patient-detail {
  position: relative;
}

.sc-patients-page::before,
.sc-agenda-page::before,
.sc-patient-detail::before {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  width: min(520px, 45vw);
  height: 230px;
  top: -55px;
  right: 0;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(92, 217, 207, .14), transparent 68%);
}

.sc-patients-page > .r-wrap:first-child,
.sc-agenda-page > div:first-child,
.sc-patient-detail .patient-header {
  position: relative;
  padding: 20px 22px !important;
  margin-bottom: 18px !important;
  border: 1px solid rgba(255,255,255,.78) !important;
  border-radius: 24px;
  background:
    radial-gradient(circle at 92% 20%, rgba(255,213,193,.2), transparent 26%),
    linear-gradient(140deg, rgba(255,255,255,.79), rgba(239,251,247,.66));
  box-shadow: var(--sc-shadow-sm), inset 0 1px 0 rgba(255,255,255,.86);
  backdrop-filter: blur(16px) saturate(118%);
}

.sc-patients-page h1,
.sc-agenda-page h1,
.sc-patient-detail h1 {
  color: var(--sc-ink) !important;
  letter-spacing: -.035em !important;
}

/* Patient directory */
.sc-data-shell {
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.84) !important;
  border-radius: 24px !important;
  background: rgba(255,255,255,.74) !important;
  box-shadow: var(--sc-shadow-md), inset 0 1px 0 rgba(255,255,255,.92) !important;
  backdrop-filter: blur(18px) saturate(118%);
}

.sc-data-toolbar {
  min-height: 70px;
  padding: 14px 18px !important;
  border-bottom: 1px solid var(--sc-line);
  background: linear-gradient(135deg, rgba(235,250,246,.72), rgba(255,252,247,.62));
}

.sc-data-toolbar select {
  min-height: 34px;
  padding-inline: 12px !important;
  border: 1px solid rgba(23,145,137,.1) !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.78) !important;
}

.sc-data-row {
  transition: background-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.sc-data-head {
  color: #718783 !important;
  background: rgba(235,246,242,.65) !important;
  border-bottom-color: var(--sc-line) !important;
  font-weight: 750 !important;
}

.sc-patient-row {
  cursor: pointer;
  background: rgba(255,255,255,.42) !important;
  border-bottom-color: rgba(20,92,87,.07) !important;
}

.sc-patient-row:nth-of-type(even) {
  background: rgba(241,249,246,.5) !important;
}

.sc-patient-row:hover {
  position: relative;
  z-index: 1;
  transform: translateY(-1px);
  background: linear-gradient(90deg, rgba(219,247,242,.84), rgba(255,255,255,.8)) !important;
  box-shadow: inset 4px 0 0 var(--sc-mint), 0 9px 20px rgba(31,91,86,.07);
}

.sc-patient-row [class*="avatar"],
.sc-patients-page [class*="avatar"] {
  box-shadow: 0 7px 16px rgba(23,116,109,.14), inset 0 0 0 1px rgba(255,255,255,.6);
}

/* Agenda */
.sc-agenda-toolbar {
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,.78);
  border-radius: 18px;
  background: rgba(255,255,255,.63);
  box-shadow: var(--sc-shadow-xs), inset 0 1px 0 rgba(255,255,255,.9);
  backdrop-filter: blur(14px);
}

.sc-agenda-page .om-agenda-month-grid,
.sc-agenda-grid,
.sc-agenda-page .agenda-day-scroll {
  border-radius: 22px !important;
}

.sc-agenda-page .om-agenda-month-day {
  background: rgba(255,255,255,.55) !important;
  border-color: rgba(20,92,87,.075) !important;
  transition: background .14s ease, box-shadow .14s ease;
}

.sc-agenda-page .om-agenda-month-day:hover {
  background: rgba(226,248,244,.88) !important;
  box-shadow: inset 0 0 0 1px rgba(36,184,174,.16);
}

.sc-agenda-page .om-agenda-month-day.is-today {
  background: linear-gradient(145deg, rgba(204,243,237,.92), rgba(255,255,255,.72)) !important;
  box-shadow: inset 4px 0 0 var(--sc-mint), inset 0 0 0 1px rgba(36,184,174,.13);
}

.sc-agenda-page .om-agenda-month-add {
  background: linear-gradient(135deg, #e5faf6, #caf1eb) !important;
  color: var(--sc-mint-deep) !important;
  box-shadow: 0 5px 12px rgba(25,145,137,.13);
}

.sc-agenda-page .agenda-day-scroll,
.sc-agenda-grid {
  border: 1px solid rgba(255,255,255,.84) !important;
  background: rgba(255,255,255,.68) !important;
  box-shadow: var(--sc-shadow-sm), inset 0 1px 0 rgba(255,255,255,.92) !important;
  backdrop-filter: blur(14px);
}

.sc-agenda-page [draggable="true"] {
  border-radius: 13px !important;
  border-color: rgba(255,255,255,.65) !important;
  box-shadow: 0 7px 15px rgba(31,91,86,.12), inset 0 1px 0 rgba(255,255,255,.42) !important;
}

/* Patient file */
.sc-patient-detail .patient-header {
  align-items: stretch !important;
  border-bottom: 1px solid rgba(255,255,255,.78) !important;
}

.sc-patient-detail .patient-header-side {
  padding: 13px;
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 18px;
  background: rgba(255,255,255,.6);
  box-shadow: var(--sc-shadow-xs);
}

.sc-patient-detail [role="tablist"] {
  padding: 5px !important;
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 18px !important;
  background: rgba(238,248,245,.72) !important;
  box-shadow: inset 0 1px 4px rgba(31,91,86,.035);
}

.sc-patient-detail [role="tab"] {
  border-radius: 13px !important;
}

.sc-patient-detail [role="tab"][aria-selected="true"] {
  background: rgba(255,255,255,.92) !important;
  color: var(--sc-mint-deep) !important;
  box-shadow: var(--sc-shadow-xs), inset 0 0 0 1px rgba(36,184,174,.1) !important;
}

/* Odontogram */
.sc-odontogram-card {
  border: 1px solid rgba(255,255,255,.84) !important;
  border-radius: 24px !important;
  background: rgba(255,255,255,.76) !important;
  box-shadow: var(--sc-shadow-md), inset 0 1px 0 rgba(255,255,255,.94) !important;
}

.sc-odontogram-stage {
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 50% 48%, rgba(82,210,199,.17), transparent 37%),
    linear-gradient(145deg, rgba(224,247,243,.76), rgba(255,252,247,.86)) !important;
  box-shadow: inset 0 2px 12px rgba(21,111,104,.055), 0 10px 24px rgba(31,91,86,.07);
}

.sc-odontogram-stage button {
  transition: transform .12s ease, filter .12s ease;
}

.sc-odontogram-stage button:hover {
  transform: translateY(-2px) scale(1.025);
  filter: drop-shadow(0 7px 7px rgba(21,119,112,.16));
}

.sc-odontogram-layout > div:last-child > * {
  border: 1px solid rgba(255,255,255,.82) !important;
  background: rgba(255,255,255,.7) !important;
  box-shadow: var(--sc-shadow-sm) !important;
}

/* Treatments */
.sc-treatments-toolbar {
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(255,255,255,.82);
  border-radius: 18px;
  background: rgba(255,255,255,.63);
  box-shadow: var(--sc-shadow-xs);
  backdrop-filter: blur(12px);
}

.sc-treatment-table {
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.86) !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,.72) !important;
  box-shadow: var(--sc-shadow-sm), inset 0 1px 0 rgba(255,255,255,.92) !important;
}

.sc-treatment-head {
  background: linear-gradient(135deg, rgba(228,247,243,.76), rgba(255,251,246,.64));
  border-bottom: 1px solid rgba(20,92,87,.07);
  color: #718783 !important;
}

.sc-treatment-row {
  background: rgba(255,255,255,.46);
  border-top-color: rgba(20,92,87,.07) !important;
  transition: background .15s ease, box-shadow .15s ease;
}

.sc-treatment-row:hover {
  background: linear-gradient(90deg, rgba(224,248,244,.74), rgba(255,255,255,.72));
  box-shadow: inset 4px 0 0 rgba(36,184,174,.7);
}

.sc-treatment-row + div[style*="var(--bg-tint)"] {
  background: rgba(231,248,244,.64) !important;
  box-shadow: inset 0 9px 18px rgba(31,91,86,.035);
}

.sc-treatment-row div[style*="height: 3"] {
  height: 5px !important;
  background: rgba(20,92,87,.08) !important;
  box-shadow: inset 0 1px 2px rgba(20,92,87,.06);
}

@media (max-width: 900px) {
  .sc-patients-page > .r-wrap:first-child,
  .sc-agenda-page > div:first-child,
  .sc-patient-detail .patient-header {
    padding: 17px !important;
    border-radius: 20px;
  }

  .sc-treatments-toolbar {
    align-items: flex-start !important;
    flex-direction: column;
  }

  .sc-treatments-toolbar > div {
    width: 100%;
    flex-wrap: wrap;
  }

  .sc-treatment-table {
    overflow-x: auto;
  }

  .sc-treatment-head,
  .sc-treatment-row {
    min-width: 780px;
  }
}

@media (max-width: 640px) {
  .sc-patients-page::before,
  .sc-agenda-page::before,
  .sc-patient-detail::before { display: none; }

  .sc-data-shell,
  .sc-odontogram-card,
  .sc-treatment-table { border-radius: 18px !important; }

  .sc-data-toolbar,
  .sc-agenda-toolbar {
    padding: 10px !important;
    border-radius: 16px;
  }

  .sc-patient-detail .patient-header-side {
    min-width: 100% !important;
    max-width: 100% !important;
  }

  .sc-odontogram-stage {
    padding-inline: 9px !important;
    border-radius: 18px !important;
  }
}

/* ================================================================
   Responsive v41.74.2: rangos de pantalla y ancho mínimo utilizable
   Desktop: >= 1101 | Tablet: 700-1100 | Mobile: 360-699
   ================================================================ */

.om-min-viewport-guard {
  display: none;
}

.om-min-copy-tiny {
  display: none;
}

@media (min-width: 1101px) and (max-width: 1379px) {
  .om-app-main .page-pad {
    padding-inline: clamp(18px, 2.1vw, 28px) !important;
  }
}

@media (min-width: 700px) and (max-width: 1100px) {
  .om-app-main {
    width: 100% !important;
    margin-left: 0 !important;
  }

  .om-app-main .page-pad {
    width: 100% !important;
    max-width: 100% !important;
    padding: 20px 18px 88px !important;
  }

  .mobile-topbar {
    display: flex !important;
  }
}

@media (min-width: 360px) and (max-width: 699px) {
  html,
  body,
  #root,
  #vite-root,
  .om-app-main {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .om-app-main {
    margin-left: 0 !important;
  }

  .om-app-main .page-pad {
    padding: 16px 12px 82px !important;
  }

  .mobile-topbar {
    display: flex !important;
    min-width: 0;
    padding-inline: 12px !important;
  }

  .mobile-topbar > div:nth-of-type(2) {
    min-width: 0;
    overflow: hidden;
  }

  .om-global-modal-card {
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
  }
}

@media (max-width: 359px) {
  html,
  body,
  #root,
  #vite-root {
    min-width: 0 !important;
    overflow: hidden !important;
  }

  .om-min-viewport-guard {
    position: fixed;
    inset: 0;
    z-index: 2147483647;
    display: grid;
    place-items: center;
    padding: 14px;
    overflow: auto;
    color: var(--sc-ink, #173f3b);
    background:
      radial-gradient(circle at 12% 12%, rgba(76, 207, 197, .28), transparent 42%),
      radial-gradient(circle at 92% 92%, rgba(255, 198, 170, .25), transparent 46%),
      #eef8f4;
  }

  .om-min-viewport-card {
    width: 100%;
    padding: 22px 18px;
    display: grid;
    gap: 16px;
    justify-items: center;
    text-align: center;
    border: 1px solid rgba(255, 255, 255, .9);
    border-radius: 24px;
    background: rgba(255, 253, 249, .9);
    box-shadow: 0 24px 70px rgba(20, 72, 68, .2), inset 0 1px 0 rgba(255,255,255,.95);
    backdrop-filter: blur(18px);
  }

  .om-min-viewport-kicker {
    margin-bottom: 6px;
    color: var(--sc-mint-deep, #0d8f89);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
  }

  .om-min-viewport-card h1 {
    margin: 0;
    font-size: clamp(22px, 8vw, 28px);
    line-height: 1.08;
    letter-spacing: -.035em;
  }

  .om-min-viewport-card p {
    margin: 10px 0 0;
    color: var(--ink-3, #607a76);
    font-size: 13px;
    line-height: 1.55;
  }
}

@media (max-width: 239px) {
  .om-min-viewport-guard {
    padding: 6px;
  }

  .om-min-viewport-card {
    min-width: 0;
    padding: 12px 7px;
    gap: 9px;
    border-radius: 15px;
  }

  .om-min-viewport-card > svg,
  .om-min-viewport-card > img {
    width: 30px !important;
    height: 30px !important;
  }

  .om-min-copy-normal {
    display: none !important;
  }

  .om-min-copy-tiny {
    display: block;
  }

  .om-min-viewport-kicker {
    margin-bottom: 5px;
    font-size: 7px;
    line-height: 1.25;
    letter-spacing: .06em;
  }

  .om-min-viewport-card h1 {
    font-size: clamp(13px, 11vw, 19px);
    line-height: 1.08;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
  }

  .om-min-viewport-card p {
    margin-top: 7px;
    font-size: 10px;
    line-height: 1.35;
  }
}

/* ================================================================
   Refinamiento visual v41.74.1: escala, formularios y overflow
   ================================================================ */

html,
body,
#root {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Escala general algo mas compacta */
.page-pad {
  padding-top: 22px !important;
}

.page-pad h1.r-hero {
  font-size: clamp(34px, 3.4vw, 44px) !important;
}

.om-premium-card {
  border-radius: 18px !important;
}

/* Inputs claramente reconocibles */
input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
select,
textarea {
  color: var(--sc-ink) !important;
  border: 1px solid rgba(27, 112, 105, .2) !important;
  background: #f2f8f6 !important;
  box-shadow: inset 0 1px 2px rgba(25,76,72,.055), 0 1px 0 rgba(255,255,255,.88) !important;
}

input::placeholder,
textarea::placeholder {
  color: #829692 !important;
  opacity: 1;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):hover,
select:hover,
textarea:hover {
  border-color: rgba(24,145,137,.32) !important;
  background: #f7fbfa !important;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):focus,
select:focus,
textarea:focus {
  outline: none !important;
  border-color: var(--sc-mint) !important;
  background: #fff !important;
  box-shadow: inset 0 0 0 1px var(--sc-mint), inset 0 1px 2px rgba(25,76,72,.035) !important;
}

input:disabled,
select:disabled,
textarea:disabled {
  color: #758783 !important;
  background: #eaf0ee !important;
  opacity: .78;
}

/* Login mas proporcionado */
.login-root {
  gap: 18px;
  padding: 18px;
}

.login-brand,
.login-form-panel {
  border-radius: 28px !important;
}

.login-brand {
  padding: clamp(30px, 3vw, 46px) !important;
}

.login-brand h1 {
  font-size: clamp(36px, 3.25vw, 52px) !important;
  line-height: 1.04 !important;
}

.login-form-panel {
  padding: clamp(26px, 3vw, 38px) !important;
}

.login-form-card {
  max-width: 350px !important;
  padding: 4px !important;
}

.login-form-card input {
  min-height: 44px;
  background: #eef6f3 !important;
}

.login-submit {
  height: 46px !important;
  margin-top: 2px;
}

.login-progress {
  margin: 0 0 12px;
}

.login-progress-copy {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 6px;
  color: var(--sc-muted);
  font-size: 11px;
}

.login-progress-copy strong {
  color: var(--sc-mint-deep);
  font-variant-numeric: tabular-nums;
}

.login-progress-track {
  position: relative;
  height: 5px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(21,120,113,.1);
}

.login-progress-track span {
  position: absolute;
  inset: 0 auto 0 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #34c9be, #0e9891);
  box-shadow: 0 0 10px rgba(36,184,174,.24);
  transition: width .18s ease-out;
}

/* Modal armonizado y con ancho real de cada formulario */
.om-global-modal-backdrop {
  background: rgba(22, 57, 54, .42) !important;
  backdrop-filter: blur(12px) saturate(105%) !important;
  -webkit-backdrop-filter: blur(12px) saturate(105%) !important;
}

.om-global-modal-card {
  width: min(100%, var(--modal-requested-width, 760px));
  max-width: calc(100vw - 32px) !important;
  max-height: calc(100dvh - 32px) !important;
  border: 1px solid rgba(255,255,255,.9) !important;
  border-radius: 22px !important;
  background: #fbfdfb !important;
  box-shadow: 0 26px 72px rgba(18,66,62,.22), inset 0 1px 0 rgba(255,255,255,.96) !important;
}

.om-global-modal-head {
  padding: 20px 22px 13px !important;
  border-bottom: 1px solid rgba(27,112,105,.07);
  background: linear-gradient(135deg, #f0faf7 0%, #fbfdfb 58%, #fff8f3 100%) !important;
}

.om-global-modal-head h2 {
  font-size: clamp(23px, 2.4vw, 28px) !important;
  color: var(--sc-ink) !important;
}

.om-global-modal-head button {
  width: 34px !important;
  height: 34px !important;
  border: 1px solid rgba(27,112,105,.12) !important;
  background: #f2f8f6 !important;
  box-shadow: none !important;
}

.om-global-modal-body {
  padding: 14px 22px 16px !important;
  background: #fbfdfb;
  scrollbar-gutter: stable;
}

.om-global-modal-body input,
.om-global-modal-body select {
  min-height: 40px !important;
}

.om-global-modal-footer {
  margin-top: 0 !important;
  padding: 13px 22px 16px !important;
  border-top: 0 !important;
  background: linear-gradient(180deg, rgba(251,253,251,.65), #f5faf7 48%, #f2f8f5) !important;
  box-shadow: inset 0 1px 0 rgba(27,112,105,.055) !important;
}

.om-plan-editor-grid {
  gap: 11px 14px !important;
  padding-bottom: 2px !important;
}

.om-plan-editor-grid textarea {
  min-height: 72px !important;
  max-height: 112px;
}

.om-plan-editor-grid .om-plan-check {
  padding-top: 18px !important;
}

/* Sidebar: sin scroll lateral ni sombras cortadas */
.app-sidebar,
.om-sidebar-grouped,
.om-sidebar-grouped nav,
.om-sidebar-section,
.om-sidebar-section-body,
.om-sidebar-section-body-inner {
  max-width: 100%;
  overflow-x: hidden !important;
}

.om-sidebar-grouped nav {
  width: 100%;
  padding: 4px 3px 8px 2px !important;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.om-sidebar-grouped nav::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
}

.om-sidebar-search {
  width: 100%;
  padding: 0 2px;
}

.om-sidebar-search-field {
  width: 100%;
  height: 38px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  border: 1px solid rgba(35, 128, 120, .08);
  border-radius: 13px;
  background: rgba(237, 247, 244, .58);
  box-shadow: none;
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.om-sidebar-search-field:focus-within {
  border-color: rgba(35, 176, 166, .22);
  background: rgba(240, 249, 247, .88);
  box-shadow: inset 0 0 0 1px rgba(35, 176, 166, .08);
}

.om-sidebar-search-icon {
  display: inline-flex;
  flex: 0 0 auto;
  color: var(--ink-4);
}

.om-sidebar-search-field input {
  width: 100% !important;
  min-width: 0 !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  color: var(--ink) !important;
  background: transparent !important;
  box-shadow: none !important;
  font: inherit;
  font-size: 12.5px;
}

.om-sidebar-search-field input::placeholder {
  color: var(--ink-4) !important;
  opacity: .86;
}

.app-sidebar .nav-item {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding: 8px 10px !important;
  border-radius: 13px !important;
  font-size: 12.5px !important;
}

.app-sidebar .nav-item.active,
.app-sidebar .nav-item[style*="var(--accent-soft)"] {
  box-shadow: inset 0 0 0 1px rgba(35,176,166,.16), inset 3px 0 0 var(--sc-mint) !important;
}

.om-sidebar-section-head {
  width: 100%;
  min-width: 0;
  padding: 8px 9px !important;
}

.om-sidebar-section-body.open {
  overflow: hidden !important;
}

/* Sidebar v41.83: un único scroll y grupos sin barras internas. */
.om-sidebar-grouped .om-sidebar-section {
  overflow: visible !important;
  margin: 3px 0 !important;
  padding: 0 !important;
}

.om-sidebar-grouped .om-sidebar-section::before {
  display: none !important;
}

.om-sidebar-grouped .om-sidebar-section-head {
  min-height: 34px;
  padding: 8px 10px !important;
  border: 1px solid transparent !important;
  border-radius: 12px !important;
  color: #78908d !important;
  box-shadow: none !important;
}

.om-sidebar-grouped .om-sidebar-section-head:hover,
.om-sidebar-grouped .om-sidebar-section.is-open > .om-sidebar-section-head {
  border-color: rgba(35, 176, 166, .1) !important;
  background: rgba(235, 247, 244, .72) !important;
  color: var(--sc-mint-dark) !important;
  box-shadow: none !important;
}

.om-sidebar-grouped .om-sidebar-section-chevron {
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  color: #8ea4a1;
  font-size: 15px;
  line-height: 1;
  transform: rotate(0deg) !important;
  transition: transform .18s ease;
}

.om-sidebar-grouped .om-sidebar-section-chevron.open {
  transform: rotate(180deg) !important;
}

.om-sidebar-grouped .om-sidebar-section-body {
  overflow: hidden !important;
  scrollbar-width: none !important;
}

.om-sidebar-grouped .om-sidebar-section-body-inner {
  overflow: visible !important;
  scrollbar-width: none !important;
}

.om-sidebar-grouped .om-sidebar-section-body::-webkit-scrollbar,
.om-sidebar-grouped .om-sidebar-section-body-inner::-webkit-scrollbar {
  display: none !important;
}

.om-sidebar-grouped .om-sidebar-section.is-advanced.is-open {
  margin-top: 6px !important;
  padding: 4px 5px 7px !important;
  border: 1px solid rgba(35, 176, 166, .1);
  border-radius: 17px;
  background: linear-gradient(145deg, rgba(230, 247, 243, .72), rgba(255, 253, 249, .6));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8);
}

.om-sidebar-grouped .om-sidebar-section.is-advanced.is-open > .om-sidebar-section-head {
  margin-bottom: 3px;
  background: transparent !important;
  border-color: transparent !important;
}

.om-sidebar-grouped .om-sidebar-section.is-advanced .om-sidebar-section-body-inner {
  gap: 2px;
}

.om-sidebar-grouped .om-sidebar-section.is-advanced .nav-item {
  min-height: 36px;
  padding: 7px 9px !important;
  border-radius: 11px !important;
  font-size: 12px !important;
}

.om-sidebar-grouped .om-sidebar-section.is-advanced .nav-item:hover {
  background: rgba(255, 255, 255, .74) !important;
  box-shadow: inset 0 0 0 1px rgba(35, 176, 166, .08) !important;
}

.app-sidebar > div:last-child {
  border-top-color: rgba(27,112,105,.08) !important;
  box-shadow: 0 -10px 24px rgba(31,91,86,.035);
}

/* La barra contraída es una lista plana: sin grupos, líneas ni scrolls internos. */
.om-sidebar-grouped.is-collapsed nav {
  gap: 5px !important;
  padding: 4px 2px 8px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scrollbar-width: none;
}

.om-sidebar-grouped.is-collapsed nav::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
}

.om-sidebar-grouped.is-collapsed .nav-item {
  width: 46px !important;
  min-height: 42px;
  margin: 0 auto;
  padding: 0 !important;
  border-radius: 13px !important;
}

.om-sidebar-grouped.is-collapsed .om-sidebar-section,
.om-sidebar-grouped.is-collapsed .om-sidebar-section::before,
.om-sidebar-grouped.is-collapsed .om-sidebar-section-head {
  display: none !important;
}

/* Mi cuenta mas compacto */
.om-account-page {
  max-width: 980px !important;
  padding-top: 24px !important;
}

.om-account-title {
  font-size: clamp(34px, 4vw, 48px) !important;
}

.om-account-card {
  padding: 20px !important;
}

.om-account-card-title {
  font-size: clamp(23px, 2.2vw, 28px) !important;
}

.om-account-card input {
  min-height: 42px !important;
  background: #edf6f3 !important;
}

@media (max-width: 760px) {
  .login-root { padding: 0; }
  .login-form-panel { border-radius: 0 !important; }

  .om-global-modal-card {
    max-width: calc(100vw - 18px) !important;
    max-height: calc(100dvh - 18px) !important;
    border-radius: 18px !important;
  }

  .om-global-modal-head,
  .om-global-modal-body,
  .om-global-modal-footer {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .om-plan-editor-grid {
    grid-template-columns: 1fr !important;
  }

  .om-plan-editor-grid .span-2 {
    grid-column: auto !important;
  }
}

/* ================================================================
   Phase 4: configuracion, seguridad, onboarding y estados de sistema
   ================================================================ */

.sc-system-page {
  position: relative;
}

.sc-system-page::before {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  right: 0;
  top: -45px;
  width: min(560px, 46vw);
  height: 250px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 70% 30%, rgba(255,207,184,.14), transparent 30%),
    radial-gradient(ellipse, rgba(79,209,199,.15), transparent 70%);
}

.sc-system-page > div:first-child:not(.om-premium-card),
.sc-system-page > .r-wrap:first-child {
  padding: 20px 22px !important;
  margin-bottom: 20px !important;
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 24px;
  background:
    radial-gradient(circle at 91% 18%, rgba(255,211,191,.17), transparent 25%),
    linear-gradient(138deg, rgba(255,255,255,.8), rgba(235,250,246,.66));
  box-shadow: var(--sc-shadow-sm), inset 0 1px 0 rgba(255,255,255,.9);
  backdrop-filter: blur(16px) saturate(120%);
}

.sc-system-page h1 {
  color: var(--sc-ink) !important;
  letter-spacing: -.04em !important;
}

.sc-system-page .om-premium-card,
.sc-settings-page > div > div,
.sc-security-page > div:not(:first-child) {
  border-color: rgba(255,255,255,.84) !important;
}

.sc-settings-page .om-availability-day {
  border: 1px solid rgba(255,255,255,.74);
  background: rgba(240,249,246,.66) !important;
  box-shadow: var(--sc-shadow-xs), inset 0 1px 0 rgba(255,255,255,.86);
}

.sc-settings-page .om-availability-day[style*="opacity: 0.7"] {
  background: rgba(247,249,247,.48) !important;
  box-shadow: inset 0 0 0 1px rgba(20,92,87,.04);
}

.sc-settings-page .om-availability-slot-grid {
  border: 1px solid rgba(255,255,255,.8) !important;
  background: rgba(255,255,255,.72) !important;
  box-shadow: inset 0 2px 9px rgba(31,91,86,.04) !important;
}

.sc-clinic-settings .r-scroll,
.sc-users-page .om-premium-card[style*="overflowX"],
.sc-backup-page .om-premium-card[style*="overflow"] {
  border: 1px solid rgba(255,255,255,.86) !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,.72) !important;
  box-shadow: var(--sc-shadow-sm), inset 0 1px 0 rgba(255,255,255,.94) !important;
}

.sc-system-table-head,
.sc-clinic-settings .r-min > div:first-child {
  color: #708581 !important;
  background: linear-gradient(135deg, rgba(225,246,241,.76), rgba(255,250,245,.66)) !important;
  border-bottom-color: rgba(20,92,87,.07) !important;
}

.sc-users-page .om-premium-card[style*="overflowX"] > div:not(.desktop-table-head),
.sc-backup-page .om-premium-card > .r-stack {
  border-color: rgba(20,92,87,.07) !important;
  transition: background .15s ease, box-shadow .15s ease;
}

.sc-users-page .om-premium-card[style*="overflowX"] > div:not(.desktop-table-head):hover,
.sc-backup-page .om-premium-card > .r-stack:hover {
  background: rgba(223,248,243,.74) !important;
  box-shadow: inset 4px 0 0 rgba(36,184,174,.72);
}

.sc-security-page > div:not(:first-child) {
  border-radius: 22px !important;
  background: rgba(255,255,255,.72) !important;
  box-shadow: var(--sc-shadow-sm) !important;
}

.sc-security-page div[style*="var(--danger-soft)"] {
  border: 1px solid rgba(214,75,75,.1) !important;
  background: linear-gradient(145deg, rgba(255,239,238,.9), rgba(255,255,255,.72)) !important;
}

.sc-security-page div[style*="var(--sage-soft)"] {
  border: 1px solid rgba(36,184,132,.1) !important;
  background: linear-gradient(145deg, rgba(231,249,240,.9), rgba(255,255,255,.72)) !important;
}

.sc-legal-page .legal-layout > .om-premium-card:first-child {
  background: rgba(242,250,247,.74) !important;
}

.sc-legal-page .om-legal-badge,
.sc-legal-page .om-legal-badge-big {
  border: 1px solid rgba(255,255,255,.72) !important;
  box-shadow: var(--sc-shadow-xs);
}

/* Onboarding */
.sc-onboarding-card {
  border: 1px solid rgba(255,255,255,.88) !important;
  border-radius: 30px !important;
  background: rgba(255,253,249,.88) !important;
  box-shadow: 0 34px 100px rgba(19,78,73,.28), inset 0 1px 0 rgba(255,255,255,.96) !important;
  backdrop-filter: blur(24px) saturate(120%);
}

.sc-onboarding-card > div:first-child {
  background:
    radial-gradient(circle at 90% 10%, rgba(255,211,190,.24), transparent 30%),
    linear-gradient(140deg, rgba(210,247,241,.88), rgba(255,252,246,.68)) !important;
  border-bottom: 1px solid rgba(20,92,87,.06);
}

.sc-onboarding-card > div:first-child > div:first-child {
  background: linear-gradient(145deg, #28c5ba, #0d918a) !important;
  border: 1px solid rgba(255,255,255,.36);
  box-shadow: var(--sc-shadow-button) !important;
}

/* Empty, loading and feedback states */
.om-empty-state {
  margin: 12px;
  border: 1px dashed rgba(36,184,174,.2);
  border-radius: 20px;
  background:
    radial-gradient(circle at 50% 10%, rgba(89,214,203,.11), transparent 35%),
    rgba(250,253,250,.58);
}

.om-empty-state .serif {
  color: var(--sc-ink) !important;
}

[role="alert"] {
  border: 1px solid currentColor;
  border-color: color-mix(in oklab, currentColor, transparent 82%);
  border-radius: 16px !important;
  box-shadow: var(--sc-shadow-xs);
}

.sc-connection-banner {
  border-bottom-color: rgba(255,255,255,.72) !important;
  box-shadow: 0 8px 22px rgba(31,91,86,.09), inset 0 1px 0 rgba(255,255,255,.72);
  backdrop-filter: blur(16px) saturate(120%);
}

.sc-error-page {
  background:
    radial-gradient(circle at 14% 10%, rgba(79,210,200,.26), transparent 32vw),
    radial-gradient(circle at 90% 8%, rgba(255,201,176,.24), transparent 32vw),
    linear-gradient(145deg, #edf9f5, #fbf8f1 55%, #fff2ea) !important;
}

.sc-error-card {
  border: 1px solid rgba(255,255,255,.88) !important;
  border-radius: 28px !important;
  background: rgba(255,255,255,.76) !important;
  box-shadow: 0 28px 78px rgba(25,87,82,.18), inset 0 1px 0 rgba(255,255,255,.94) !important;
  backdrop-filter: blur(20px);
}

/* Help and support */
.sc-help-trigger {
  background: linear-gradient(145deg, #28c5ba, #0c918a) !important;
  border: 1px solid rgba(255,255,255,.35) !important;
  box-shadow: 0 14px 30px rgba(18,147,139,.3), inset 0 1px 0 rgba(255,255,255,.38) !important;
}

.sc-help-panel {
  border: 1px solid rgba(255,255,255,.88) !important;
  border-radius: 24px !important;
  background: rgba(255,253,249,.88) !important;
  box-shadow: 0 28px 78px rgba(18,71,67,.24), inset 0 1px 0 rgba(255,255,255,.94) !important;
  backdrop-filter: blur(22px) saturate(120%);
}

.sc-help-panel > div:first-child {
  background: linear-gradient(140deg, rgba(214,247,242,.88), rgba(255,250,244,.7)) !important;
}

/* Focus and accessibility polish */
:where(button, a, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid rgba(36,184,174,.28) !important;
  outline-offset: 2px !important;
}

::selection {
  color: var(--sc-mint-dark);
  background: rgba(94,218,207,.34);
}

@media (max-width: 900px) {
  .sc-system-page > div:first-child:not(.om-premium-card),
  .sc-system-page > .r-wrap:first-child {
    padding: 17px !important;
    border-radius: 20px;
  }

  .sc-onboarding-card {
    border-radius: 24px !important;
  }
}

@media (max-width: 640px) {
  .sc-system-page::before { display: none; }

  .sc-clinic-settings .r-scroll,
  .sc-users-page .om-premium-card[style*="overflowX"],
  .sc-backup-page .om-premium-card[style*="overflow"] {
    border-radius: 18px !important;
  }

  .sc-onboarding-card {
    max-height: 100dvh !important;
    border: 0 !important;
    border-radius: 0 !important;
  }

  .sc-help-trigger {
    right: 16px !important;
    bottom: 16px !important;
  }

  .sc-help-panel {
    right: 12px !important;
    bottom: 78px !important;
    width: calc(100vw - 24px) !important;
    border-radius: 20px !important;
  }
}

/* ================================================================
   Phase 3: finanzas, reportes, comunicaciones y gestion
   ================================================================ */

.sc-finance-page,
.om-comms-page {
  position: relative;
}

.sc-finance-page::before,
.om-comms-page::before {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  inset: -40px 0 auto auto;
  width: min(580px, 48vw);
  height: 260px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 65% 38%, rgba(255,205,181,.13), transparent 34%),
    radial-gradient(ellipse, rgba(78,208,198,.14), transparent 70%);
}

.sc-finance-page > .r-wrap:first-child,
.sc-budgets-page > div:first-child,
.sc-reports-page > .r-wrap:first-child,
.om-comms-page-head {
  padding: 20px 22px !important;
  margin-bottom: 20px !important;
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 24px;
  background:
    radial-gradient(circle at 91% 18%, rgba(255,211,191,.18), transparent 24%),
    linear-gradient(138deg, rgba(255,255,255,.8), rgba(235,250,246,.67));
  box-shadow: var(--sc-shadow-sm), inset 0 1px 0 rgba(255,255,255,.9);
  backdrop-filter: blur(16px) saturate(120%);
}

.sc-finance-page h1,
.om-comms-page h1 {
  color: var(--sc-ink) !important;
  letter-spacing: -.04em !important;
}

.sc-finance-page > div:not(.r-wrap),
.sc-finance-page > div.r-stack {
  position: relative;
}

.sc-finance-page .om-premium-card,
.sc-cash-page [class*="card"],
.sc-budgets-page [class*="card"] {
  border-color: rgba(255,255,255,.82) !important;
}

.sc-finance-page .r-stack > .om-premium-card,
.sc-cash-page .r-stack > div,
.sc-budgets-page > div[style*="repeat(auto-fit"] > div {
  background:
    linear-gradient(145deg, rgba(255,255,255,.82), rgba(246,251,247,.68)) !important;
  box-shadow: var(--sc-shadow-sm), inset 0 1px 0 rgba(255,255,255,.88) !important;
}

.sc-finance-page .tnum {
  letter-spacing: -.025em;
}

.sc-finance-table {
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.86) !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,.73) !important;
  box-shadow: var(--sc-shadow-md), inset 0 1px 0 rgba(255,255,255,.94) !important;
  backdrop-filter: blur(15px);
}

.sc-finance-head {
  color: #708581 !important;
  background: linear-gradient(135deg, rgba(225,246,241,.76), rgba(255,250,245,.68));
  border-bottom: 1px solid rgba(20,92,87,.07);
  font-weight: 750 !important;
}

.sc-finance-row {
  background: rgba(255,255,255,.44) !important;
  border-top-color: rgba(20,92,87,.07) !important;
  transition: background .15s ease, box-shadow .15s ease, transform .15s ease;
}

.sc-finance-row:hover {
  position: relative;
  z-index: 1;
  background: linear-gradient(90deg, rgba(221,247,242,.82), rgba(255,255,255,.76)) !important;
  box-shadow: inset 4px 0 0 rgba(36,184,174,.75), 0 8px 18px rgba(31,91,86,.055);
}

.sc-cash-page > div:nth-child(2) {
  border: 1px solid rgba(255,255,255,.82) !important;
  border-radius: 20px !important;
  background: rgba(255,255,255,.67) !important;
  box-shadow: var(--sc-shadow-xs) !important;
  backdrop-filter: blur(12px);
}

.sc-cash-page .caja-table > div:not(.sc-finance-row),
.sc-cash-page .sc-finance-row {
  border-color: rgba(20,92,87,.07) !important;
}

.sc-budgets-page > div[style*="repeat(auto-fit"] > div:first-child {
  background: linear-gradient(145deg, rgba(255,249,227,.88), rgba(255,255,255,.72)) !important;
}

.sc-budgets-page > div[style*="repeat(auto-fit"] > div:nth-child(2) {
  background: linear-gradient(145deg, rgba(224,248,239,.9), rgba(255,255,255,.74)) !important;
}

.sc-budgets-page button[style*="var(--ink)"] {
  background: linear-gradient(135deg, var(--sc-mint-deep), var(--sc-mint-dark)) !important;
  color: white !important;
  box-shadow: 0 7px 16px rgba(13,143,137,.18);
}

/* Report charts and KPI surfaces */
.sc-reports-page .om-premium-card {
  overflow: hidden;
}

.sc-reports-page .om-premium-card > div:first-child {
  border-bottom-color: rgba(20,92,87,.07) !important;
}

.sc-reports-page div[style*="height: 8"] {
  height: 9px !important;
  background: rgba(20,92,87,.075) !important;
  box-shadow: inset 0 1px 2px rgba(20,92,87,.06);
}

.sc-reports-page div[style*="height: 8"] > div {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.38), 0 3px 7px rgba(24,139,132,.12);
}

.sc-reports-page svg,
.sc-commissions-page svg {
  filter: drop-shadow(0 5px 8px rgba(31,91,86,.07));
}

/* Communications */
.om-comms-tabs {
  padding: 5px !important;
  border: 1px solid rgba(255,255,255,.82) !important;
  border-radius: 18px !important;
  background: rgba(239,249,246,.72) !important;
  box-shadow: var(--sc-shadow-xs), inset 0 1px 4px rgba(31,91,86,.035) !important;
  backdrop-filter: blur(12px);
}

.om-comms-tab {
  border-radius: 13px !important;
}

.om-comms-tab.is-active {
  color: var(--sc-mint-deep) !important;
  background: rgba(255,255,255,.92) !important;
  box-shadow: var(--sc-shadow-xs), inset 0 0 0 1px rgba(36,184,174,.1) !important;
}

.om-comms-kpi,
.om-comms-provider-card,
.om-comms-template-card,
.om-comms-table-card,
.om-comms-empty {
  border: 1px solid rgba(255,255,255,.84) !important;
  border-radius: 22px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.82), rgba(246,251,247,.67)) !important;
  box-shadow: var(--sc-shadow-sm), inset 0 1px 0 rgba(255,255,255,.92) !important;
  backdrop-filter: blur(14px);
}

.om-comms-channel-icon {
  border: 1px solid rgba(255,255,255,.84) !important;
  box-shadow: 0 9px 20px rgba(25,145,137,.14), inset 0 1px 0 rgba(255,255,255,.64);
}

.om-comms-channel-icon.email {
  background: linear-gradient(145deg, #dff8f3, #bdece5) !important;
  color: var(--sc-mint-deep) !important;
}

.om-comms-table-head {
  color: #708581 !important;
  background: linear-gradient(135deg, rgba(226,246,242,.78), rgba(255,250,245,.66)) !important;
  border-bottom-color: rgba(20,92,87,.07) !important;
}

.om-comms-table-row {
  border-bottom-color: rgba(20,92,87,.07) !important;
  background: rgba(255,255,255,.4) !important;
  transition: background .15s ease, box-shadow .15s ease;
}

.om-comms-table-row:hover {
  background: rgba(224,248,244,.72) !important;
  box-shadow: inset 4px 0 0 rgba(36,184,174,.72);
}

.om-comms-history-toolbar,
.om-comms-history-mini-kpis,
.om-comms-test-box,
.om-comms-info {
  border-color: rgba(255,255,255,.8) !important;
  border-radius: 18px !important;
  background: rgba(244,251,248,.72) !important;
  box-shadow: var(--sc-shadow-xs) !important;
}

.om-comms-editor-card,
.om-comms-test-modal {
  border: 1px solid rgba(255,255,255,.86) !important;
  border-radius: 26px !important;
  background: rgba(255,253,249,.88) !important;
  box-shadow: 0 34px 90px rgba(20,72,68,.24), inset 0 1px 0 rgba(255,255,255,.96) !important;
  backdrop-filter: blur(22px);
}

@media (max-width: 900px) {
  .sc-finance-page > .r-wrap:first-child,
  .sc-budgets-page > div:first-child,
  .sc-reports-page > .r-wrap:first-child,
  .om-comms-page-head {
    padding: 17px !important;
    border-radius: 20px;
  }

  .sc-budget-table {
    overflow-x: auto;
  }

  .sc-budget-table .sc-finance-head,
  .sc-budget-table .sc-finance-row {
    min-width: 760px;
  }
}

@media (max-width: 640px) {
  .sc-finance-page::before,
  .om-comms-page::before { display: none; }

  .sc-finance-table,
  .om-comms-kpi,
  .om-comms-provider-card,
  .om-comms-template-card,
  .om-comms-table-card { border-radius: 18px !important; }

  .om-comms-tabs {
    border-radius: 16px !important;
  }

  .om-comms-editor-card,
  .om-comms-test-modal {
    border-radius: 22px 22px 0 0 !important;
  }
}
/* ===== END soft-clinical-v41-74.css ===== */


/* ===== BEGIN design-system-v41-75.css ===== */
/* OdontoNic v41.75 · Sistema visual definitivo
   Esta capa contiene decisiones reutilizables. No debe incluir reglas de negocio. */

:root {
  color-scheme: light;
  --ds-font-size-xs: 11px;
  --ds-font-size-sm: 12.5px;
  --ds-font-size-md: 14px;
  --ds-font-size-lg: 18px;
  --ds-space-1: 4px;
  --ds-space-2: 8px;
  --ds-space-3: 12px;
  --ds-space-4: 16px;
  --ds-space-5: 20px;
  --ds-space-6: 24px;
  --ds-control-sm: 36px;
  --ds-control-md: 42px;
  --ds-control-lg: 48px;
  --ds-radius-sm: 10px;
  --ds-radius-md: 14px;
  --ds-radius-lg: 20px;
  --ds-radius-xl: 26px;
  --ds-border: rgba(29, 105, 99, .13);
  --ds-border-strong: rgba(24, 127, 119, .25);
  --ds-surface: rgba(255, 255, 255, .82);
  --ds-surface-solid: #fbfdfb;
  --ds-surface-muted: #edf6f3;
  --ds-text: #173f3b;
  --ds-text-muted: #5d7470;
  --ds-accent: #1ab5ab;
  --ds-accent-strong: #087b76;
  --ds-focus: rgba(26, 181, 171, .3);
  --ds-success: #348b68;
  --ds-warning: #ae7427;
  --ds-danger: #c94f55;
  --ds-shadow-1: 0 8px 20px rgba(21, 78, 73, .055);
  --ds-shadow-2: 0 18px 45px rgba(21, 78, 73, .09);
  --ds-shadow-3: 0 28px 75px rgba(21, 72, 68, .17);
  --ds-transition: 160ms cubic-bezier(.2,.8,.2,1);
}

[data-theme="dark"]{--bg:#0d1817;--bg-tint:#132421;--surface:#172a27;--surface-2:#1d3430;--surface-3:#25413c;--ink:#eef9f7;--ink-2:#d2e6e2;--ink-3:#9fbab5;--ink-4:#77958f;--line:rgba(185,226,219,.17);--line-soft:rgba(185,226,219,.1)}
[data-theme="dark"] :where(.app-sidebar,.om-sidebar-section,.om-global-modal-card,.om-assistant-dialog,.menu-popover,[role="menu"],.om-premium-card,.card){background-color:var(--surface)!important;color:var(--ink)!important;border-color:var(--line)!important}

/* Reportes operativos v41.85 */
.om-report-filter-grid { display:grid; grid-template-columns:minmax(300px,1fr) 150px 150px minmax(210px,.65fr); gap:12px; align-items:end; }
.om-report-presets { display:flex; gap:5px; padding:4px; border:1px solid var(--line-soft); background:var(--surface-2); border-radius:var(--r-md); min-width:0; }
.om-report-preset { flex:1; min-height:36px; padding:6px 9px; border:0; border-radius:calc(var(--r-md) - 4px); background:transparent; color:var(--ink-3); font:600 12px/1 var(--font-sans); cursor:pointer; }
.om-report-preset.active { background:var(--surface); color:var(--accent-strong); box-shadow:var(--shadow-xs); }
.om-report-filter-grid label { display:grid; gap:5px; color:var(--ink-3); font-size:11px; font-weight:700; }
.om-report-filter-grid input { width:100%; min-height:44px; box-sizing:border-box; border:1px solid var(--line); border-radius:var(--r-md); background:var(--surface); color:var(--ink); padding:8px 10px; font:inherit; }
.om-report-source { min-height:44px; display:flex; flex-direction:column; justify-content:center; padding:0 12px; border-left:1px solid var(--line-soft); }
.om-report-source strong { color:var(--ink-2); font-size:12px; }
.om-report-source span { color:var(--ink-4); font-size:11px; margin-top:3px; }
.om-report-alerts { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:10px; padding:0 22px 22px; }
.om-report-alert { display:flex; gap:11px; padding:14px; border:1px solid var(--line-soft); border-radius:var(--r-md); background:var(--surface-2); }
.om-report-alert-dot { width:10px; height:10px; margin-top:4px; flex:0 0 auto; border-radius:50%; background:var(--ink-4); box-shadow:0 0 0 5px color-mix(in srgb,var(--ink-4) 12%,transparent); }
.om-report-alert.warn .om-report-alert-dot { background:var(--warn); box-shadow:0 0 0 5px color-mix(in srgb,var(--warn) 13%,transparent); }
.om-report-alert.danger .om-report-alert-dot { background:var(--danger); box-shadow:0 0 0 5px color-mix(in srgb,var(--danger) 13%,transparent); }
.om-report-alert.sage .om-report-alert-dot { background:var(--sage); box-shadow:0 0 0 5px color-mix(in srgb,var(--sage) 13%,transparent); }
.om-report-alert strong { display:block; color:var(--ink); font-size:13px; }
.om-report-alert p { margin:4px 0 0; color:var(--ink-3); font-size:12px; line-height:1.45; }
@media (max-width:1100px) { .om-report-filter-grid { grid-template-columns:1fr 1fr; } .om-report-presets,.om-report-source { grid-column:1 / -1; } }
@media (max-width:620px) { .om-report-filter-grid { grid-template-columns:1fr; } .om-report-presets { grid-column:auto; overflow-x:auto; } .om-report-preset { min-width:62px; } .om-report-source { grid-column:auto; border-left:0; border-top:1px solid var(--line-soft); padding:10px 0 0; } .om-report-alerts { grid-template-columns:1fr; padding:0 14px 16px; } }

[data-theme="dark"] {
  color-scheme: dark;
  --ds-border: rgba(190, 230, 224, .13);
  --ds-border-strong: rgba(91, 213, 201, .28);
  --ds-surface: rgba(24, 45, 43, .86);
  --ds-surface-solid: #172d2b;
  --ds-surface-muted: #203b38;
  --ds-text: #edf9f6;
  --ds-text-muted: #a9bfbb;
  --ds-focus: rgba(78, 214, 201, .38);
}

/* Tipografía y ritmo */
body { color: var(--ds-text); text-rendering: optimizeLegibility; }
:where(p, li, label, input, select, textarea, button) { line-height: 1.45; }
:where(h1, h2, h3, .serif) { text-wrap: balance; }
:where(p, .om-field-hint) { text-wrap: pretty; }

/* Campos compartidos */
.om-field { min-width: 0; }
.om-field-label {
  margin-bottom: 7px !important;
  color: var(--ds-text-muted) !important;
  font-size: var(--ds-font-size-xs) !important;
  font-weight: 750 !important;
  letter-spacing: .025em !important;
}
.om-field-hint { margin-top: 6px !important; color: var(--ds-text-muted) !important; line-height: 1.4; }
.om-input {
  min-width: 0 !important;
  min-height: var(--ds-control-md) !important;
  border: 1px solid var(--ds-border) !important;
  border-radius: var(--ds-radius-md) !important;
  color: var(--ds-text) !important;
  background: var(--ds-surface-muted) !important;
  box-shadow: inset 0 1px 2px rgba(20, 70, 66, .035) !important;
  transition: border-color var(--ds-transition), background var(--ds-transition), box-shadow var(--ds-transition) !important;
}
.om-input:hover:not(:disabled) { border-color: var(--ds-border-strong) !important; }
.om-input:focus,
.om-input:focus-visible {
  outline: 0 !important;
  border-color: var(--ds-accent) !important;
  background: var(--ds-surface-solid) !important;
  box-shadow: inset 0 0 0 1px var(--ds-accent), 0 0 0 3px var(--ds-focus) !important;
}
.om-input::placeholder { color: color-mix(in oklab, var(--ds-text-muted), transparent 16%) !important; opacity: 1; }
.om-input:disabled { cursor: not-allowed; opacity: .7; }
.om-textarea { min-height: 92px !important; }
.om-select { cursor: pointer; }

/* Botones: comportamiento base sin borrar los tonos de cada módulo */
:where(.om-app-main, .om-global-modal-card, .om-assistant-dialog) button {
  font-family: inherit;
  -webkit-tap-highlight-color: transparent;
}
:where(.om-app-main, .om-global-modal-card, .om-assistant-dialog) button:not(:disabled) {
  transition: transform var(--ds-transition), box-shadow var(--ds-transition), background-color var(--ds-transition), border-color var(--ds-transition), color var(--ds-transition);
}
:where(.om-app-main, .om-global-modal-card, .om-assistant-dialog) button:active:not(:disabled) { transform: translateY(1px); }
:where(button, a, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid var(--ds-focus) !important;
  outline-offset: 2px !important;
}
:where(button, input, select, textarea):disabled { cursor: not-allowed !important; }

/* Tarjetas, modales y tablas */
:where(.om-premium-card, .card, .om-account-card, .om-comms-kpi, .om-comms-provider-card) {
  border-color: var(--ds-border) !important;
  background-color: var(--ds-surface) !important;
  box-shadow: var(--ds-shadow-1), inset 0 1px 0 rgba(255,255,255,.68) !important;
}
.om-global-modal-backdrop { overscroll-behavior: contain; }
.om-global-modal-card { border-color: rgba(255,255,255,.9) !important; box-shadow: var(--ds-shadow-3) !important; }
.om-global-modal-body { scrollbar-gutter: stable; }

:where(table, [role="table"]) { border-collapse: separate; border-spacing: 0; }
:where(th, [role="columnheader"]) {
  color: var(--ds-text-muted);
  font-size: var(--ds-font-size-xs);
  font-weight: 800;
  letter-spacing: .045em;
}
:where(tr, [role="row"]) { transition: background-color var(--ds-transition); }

/* Estados del producto */
.om-empty-state,
.om-ui-state {
  min-height: 150px;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: var(--ds-space-2);
  padding: var(--ds-space-6);
  border: 1px dashed var(--ds-border-strong);
  border-radius: var(--ds-radius-lg);
  color: var(--ds-text-muted);
  background: color-mix(in oklab, var(--ds-surface-muted), transparent 25%);
  text-align: center;
}
.om-ui-state[data-tone="success"] { border-color: color-mix(in oklab, var(--ds-success), transparent 60%); color: var(--ds-success); }
.om-ui-state[data-tone="warning"] { border-color: color-mix(in oklab, var(--ds-warning), transparent 60%); color: var(--ds-warning); }
.om-ui-state[data-tone="danger"] { border-color: color-mix(in oklab, var(--ds-danger), transparent 60%); color: var(--ds-danger); }

.om-toast { border: 1px solid rgba(255,255,255,.22); box-shadow: var(--ds-shadow-2) !important; }
.om-toast-success { background: var(--ds-success) !important; }
.om-toast-danger { background: var(--ds-danger) !important; }

.skeleton,
[data-loading="true"] .om-loading-block {
  position: relative;
  overflow: hidden;
  background: var(--ds-surface-muted) !important;
}
.skeleton::after,
[data-loading="true"] .om-loading-block::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.62), transparent);
  animation: dsShimmer 1.35s infinite;
}
@keyframes dsShimmer { to { transform: translateX(100%); } }

/* Accesibilidad y responsive */
@media (max-width: 640px) {
  .sc-clinical-entry-grid {
    grid-template-columns: 1fr !important;
  }

  .sc-agenda-status-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .sc-agenda-status-summary button {
    min-height: 54px !important;
  }

  :root { --ds-control-md: 44px; --ds-radius-lg: 18px; --ds-radius-xl: 22px; }
  .om-field-label { font-size: 11.5px !important; }
}
@media (forced-colors: active) {
  .om-input, button, .om-premium-card, .card { border: 1px solid CanvasText !important; }
  :focus-visible { outline: 2px solid Highlight !important; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
/* ===== END design-system-v41-75.css ===== */