/* OftalmoCorePro · Professional interface · 2026-10-11
   Screen-only presentation: printed clinical documents retain their layout. */
@media screen {
  :root {
    --navy:#172e44; --teal:#087f79; --teal-dark:#07665f;
    --mint:#eaf6f3; --line:#dce5eb; --muted:#607487;
    --shadow:0 4px 20px rgba(27,50,73,.045);
    color:#243b50; font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    font-size:15px; line-height:1.5; color-scheme:light;
  }
  body {background:#f2f5f8;color:#243b50}
  .topbar {position:sticky;top:0;z-index:30;height:78px;padding:0 28px;background:#fff;color:var(--navy);border-bottom:1px solid var(--line);box-shadow:none}
  .brand {gap:12px}.brand-logo {width:46px;height:46px;filter:none}
  .brand h1 {font-size:1.22rem;letter-spacing:-.035em;font-weight:800}
  .brand small {font-size:.76rem;opacity:1;color:var(--muted)}
  .top-actions {gap:14px}.location {font-size:.78rem;color:var(--muted);opacity:1}
  .user-chip {padding:8px 12px;border:1px solid #d8eae5;border-radius:10px;background:#f0f8f5;color:#285b55;opacity:1;font-weight:650}
  .logout {background:#fff;color:#486174;border:1px solid var(--line);padding:8px 14px}
  .logout:hover {background:#f0f4f7;color:var(--navy)}
  .app-layout {max-width:1800px;grid-template-columns:230px minmax(0,1fr);min-height:calc(100vh - 78px)}
  .sidebar {position:sticky;top:78px;align-self:start;height:calc(100vh - 78px);min-height:0;overflow:auto;background:var(--navy);border:0;padding:26px 14px 20px}
  .sidebar-label {font-size:.67rem;color:#91a9be;letter-spacing:.16em;padding:0 16px 18px}
  .sidebar nav {gap:6px}
  .sidebar nav button {display:flex;align-items:center;gap:12px;padding:11px 14px;min-height:48px;border-radius:10px;color:#c8d6e3;font-size:.91rem;font-weight:550;border:1px solid transparent;background:transparent}
  .sidebar nav button:hover {color:#fff;background:#233d54}
  .sidebar nav button.active {background:#087f79;border-color:#16918a;color:#fff;box-shadow:0 4px 12px #0b233c33;font-weight:750}
  .sidebar nav button[data-page="Inventario"] {margin-top:16px}
  .nav-icon {display:inline-flex;flex:0 0 22px;width:22px;height:22px;margin:0;background:transparent!important;border-radius:0;color:inherit!important}
  .nav-icon svg {width:22px;height:22px}
  .sidebar-footer {margin-top:auto;padding:22px 14px 0;border-color:#365064;color:#9db2c5;font-size:.72rem}
  .sidebar-product {color:#edf5fb;font-size:.83rem;letter-spacing:-.01em}
  .content {padding:24px clamp(20px,3vw,48px) 60px;min-width:0}
  #view,.notice {max-width:1340px}
  .notice {border:0;background:transparent;padding:0;margin-bottom:22px;color:#687d8e;font-size:.75rem;align-items:center;gap:8px}
  .notice-icon {width:18px;height:18px;flex-basis:18px;background:#dcece8;color:#277569}
  .workspace-heading {display:flex;align-items:center;gap:16px;margin:0 0 26px}
  .workspace-mark {display:grid;place-items:center;flex:0 0 52px;height:52px;background:#fff;border:1px solid var(--line);border-radius:14px;color:var(--teal);box-shadow:var(--shadow)}
  .workspace-mark svg {width:25px;height:25px}
  .workspace-heading h2 {font-size:1.9rem;line-height:1.2;margin:0 0 5px;color:var(--navy);font-weight:800;letter-spacing:-.04em}
  .workspace-heading p {margin:0;color:var(--muted);font-size:.88rem}
  .workspace-heading .access-label {margin-left:auto;flex-shrink:0;padding:6px 10px;border:1px solid #d8e1ea;border-radius:8px;font-size:.7rem;color:#5b7287;background:#eaf0f5}
  .card {border:1px solid var(--line);border-radius:16px;background:#fff;padding:26px 28px;margin-bottom:22px;box-shadow:var(--shadow)}
  .card h3 {font-size:1.08rem;color:var(--navy);font-weight:750;letter-spacing:-.02em;margin:0 0 18px}
  .card .card {background:#f8fafc;border:1px solid #e3eaf0;padding:20px;margin:18px 0;box-shadow:none}
  .grid {gap:16px 22px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
  label {font-size:.81rem;font-weight:650;color:#435c70;margin:13px 0 6px;line-height:1.4}
  input,select,textarea {min-height:46px;background:#fff;border:1px solid #ccd9e3;border-radius:9px;padding:11px 13px;color:#243b50;font-size:.94rem;box-shadow:0 1px 2px #152e4410}
  input::placeholder,textarea::placeholder {color:#8495a4}
  input:hover,select:hover,textarea:hover {border-color:#92b6b8}
  input:focus,select:focus,textarea:focus {border-color:var(--teal);box-shadow:0 0 0 3px #087f791c;outline:none}
  input[readonly] {background:#f0f4f7;border-color:#dce5eb;color:#536c80}
  input[type="checkbox"],input[type="radio"] {accent-color:var(--teal);box-shadow:none}
  textarea {line-height:1.6;min-height:100px}
  button {min-height:44px;border-radius:9px;padding:10px 16px;font-size:.87rem;font-weight:700;background:var(--teal);box-shadow:0 2px 5px #087f7918;transition:background .15s,color .15s,box-shadow .15s}
  button:hover {transform:none;background:var(--teal-dark)}
  button.secondary {background:#f3f8f7;color:#23635d;border:1px solid #d4e7e2;box-shadow:none}
  button.secondary:hover {background:#e5f2ee;border-color:#a6cfc4}
  button.secondary.danger {color:#aa3737;background:#fff6f6;border-color:#efcccc}
  button.secondary.danger:hover {color:#8d2222;background:#ffeaea}
  button:focus-visible,a:focus-visible,summary:focus-visible {outline:3px solid #48a79d;outline-offset:3px}
  button:disabled {opacity:.5;box-shadow:none}
  .actions,.row {gap:10px;margin-top:22px}
  .table-wrap {border:1px solid #dee7ed;border-radius:12px;background:#fff;scrollbar-color:#a3bac7 #f3f6f8;scrollbar-width:thin}
  table {font-variant-numeric:tabular-nums}
  th {padding:13px 16px;font-size:.7rem;letter-spacing:.045em;background:#f3f6f9;color:#577086;font-weight:750;white-space:nowrap}
  td {padding:14px 16px;font-size:.87rem;border-color:#eaf0f5;line-height:1.55}
  td strong {color:var(--navy);font-weight:700}
  tbody tr:hover {background:#f2f8f7}
  td button {min-height:36px;padding:6px 11px;margin:3px;font-size:.77rem}
  .pill,.status-badge {display:inline-flex;align-items:center;gap:5px;border-radius:7px;font-size:.75rem;font-weight:700;padding:4px 9px;line-height:1.4;background:#e8f5f0;color:#28694f}
  .agenda-attended td {background:#e9f6ed}.pill.attended {background:#daf0e0;color:#216535;border-color:#abd4b5}
  .agenda-no-show td {background:#fff5e4}.pill.no-show {background:#ffebc7;color:#7d4b00;border-color:#e0bb7d}
  .empty {padding:30px 16px;color:#6a8091;font-size:.9rem;text-align:center;background:#f8fafc;border:1px dashed #d9e4ec;border-radius:10px}
  .tabs {gap:8px;padding:5px;border:1px solid #dfe8ed;border-radius:11px;background:#eaf0f4;width:fit-content;max-width:100%}
  .tabs button {background:transparent;color:#536b7f;box-shadow:none}
  .tabs button.active {background:#fff;color:var(--teal-dark);box-shadow:0 2px 6px #203a5110}
  .patient-summary {background:#f4f8fb!important;border-color:#dae5ef!important;border-left:3px solid #498aab!important}
  .patient-summary .muted {font-size:.74rem;color:#647d91}
  .patient-summary strong {color:var(--navy)}
  .clinical-section {border-left:3px solid #198d83}
  .measurement-panel,.rx-section {background:#f7fafc!important;border-color:#dde7ee}
  .measurement-panel {padding:16px;border-radius:12px}
  .measurement-panel input,.measurement-panel select {min-height:42px}
  .matrix-heading,.matrix-row-label {color:#48667c}
  .treatment-options {gap:8px}.treatment-options label {padding:10px 12px;background:#f9fbfc;border-color:#dce6ed;min-height:42px}
  .treatment-options label:has(input:checked) {background:#edf8f4;border-color:#82bfb0;color:#1d6553}
  .diagnosis-chip-list {gap:7px}.diagnosis-chip button {min-height:36px}
  .agenda-toolbar {gap:14px}.agenda-count {padding:8px 12px;background:#eaf3f7;color:#476c83;border-radius:8px}
  details {border-radius:10px}
  details>summary {cursor:pointer;padding:12px 4px;color:#236760;font-weight:700;min-height:44px}
  details>summary:hover {color:var(--teal);background:#f4faf8;border-radius:8px}
  .dashboard-hero {padding:30px 32px;border-radius:18px;background:linear-gradient(115deg,#172e44 0%,#1c4e5d 65%,#15756b 100%);box-shadow:0 8px 22px #203f5512;margin-bottom:22px;min-height:160px}
  .dashboard-hero h2 {font-size:2rem;margin:8px 0;letter-spacing:-.04em}
  .dashboard-hero p {font-size:.89rem;color:#c9dfdf}
  .eyebrow {font-size:.66rem;letter-spacing:.15em;color:#76b9b0}
  .dashboard-hero .hero-action {padding:12px 20px;border-radius:10px;color:#195955}
  .stat-grid {gap:16px;grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:22px}
  .stat-card {padding:22px;margin:0;min-height:145px;border-radius:14px}
  .stat-card:before {inset:22px auto 22px 0;width:3px;border-radius:4px}
  .stat-label {font-size:.81rem;color:#5e7487}.stat-card .stat {font-size:1.9rem;color:var(--navy);margin:10px 0 5px;letter-spacing:-.04em}
  .stat-detail {font-size:.73rem;color:#768b9c}
  .section-heading {margin-bottom:20px}.section-heading h3 {margin:5px 0 0}
  .auth-screen {background:radial-gradient(ellipse at 85% 15%,#1c6c6e55,transparent 55%),linear-gradient(130deg,#142b42,#1c4653);padding:40px 20px}
  .auth-card {width:min(460px,100%);padding:34px;border-radius:22px;border:1px solid #e3ebef;box-shadow:0 30px 90px #071d3455}
  .auth-brand.login-logo {margin-bottom:26px}.auth-brand.login-logo img {width:300px;max-width:100%;margin-bottom:15px}
  .auth-brand .muted {font-size:.82rem}
  .auth-card input {min-height:50px}.auth-card>button[type="submit"] {min-height:50px;font-size:.94rem}
  .auth-card h2 {font-size:1.5rem}.auth-card label {margin-top:18px}
  .auth-link {min-height:44px;margin-top:12px;background:transparent}
  .auth-error:empty,.auth-status:empty {min-height:0;margin:18px 0}
  .auth-error {color:#b13e37;line-height:1.5}.auth-status {color:#247257}
  .security-note {font-size:.75rem;line-height:1.65;padding-top:18px;border-top:1px solid #e7edf2;color:#6c8192;margin-top:22px}
  .password-toggle {min-height:0;box-shadow:none;background:transparent}
  @media(min-width:1800px) {.app-layout {border-left:1px solid var(--line);border-right:1px solid var(--line)}}
  @media(max-width:1150px) {.top-actions {gap:10px}.location {display:none}.content {padding:24px 22px 50px}.card {padding:22px}.stat-grid {grid-template-columns:repeat(2,minmax(0,1fr))}}
  @media(max-width:900px) {
    .topbar {height:72px;min-height:72px;padding:12px 20px}
    .app-layout {display:block}.sidebar {position:sticky;top:72px;z-index:20;align-self:auto;height:auto;min-height:0;padding:9px 14px;background:#fff;border-bottom:1px solid var(--line);overflow:visible}
    .sidebar-label,.sidebar-footer {display:none}
    .sidebar nav {flex-direction:row;gap:7px;overflow-x:auto;padding-bottom:2px;scrollbar-width:thin}
    .sidebar nav button {width:auto;flex-shrink:0;padding:9px 12px;min-height:42px;background:#f2f6f8;border-color:#e2e9ef;color:#4d687d;font-size:.8rem;gap:7px}
    .sidebar nav button[data-page="Inventario"] {margin-top:0}
    .sidebar nav button:hover {background:#eaf4f1;color:#236760}
    .sidebar nav button.active {color:#fff;background:var(--teal);border-color:var(--teal);box-shadow:none}
    .nav-icon {display:inline-flex;flex-basis:18px;width:18px;height:18px}.nav-icon svg {width:18px;height:18px}
    .content {padding:22px 20px 40px}.user-chip {max-width:260px;font-size:.73rem}.notice {margin-bottom:20px}
    .workspace-heading h2 {font-size:1.7rem}
  }
  @media(max-width:560px) {
    .topbar {padding:10px 14px;gap:10px}.brand {gap:8px}.brand-logo {width:35px;height:35px}.brand h1 {font-size:1rem}.brand small {display:none}
    .top-actions {gap:7px}.user-chip {max-width:110px;font-size:.67rem;padding:6px 8px}.logout {padding:6px 10px;font-size:.76rem;min-height:38px}
    .sidebar {padding:8px 10px}.content {padding:18px 12px 32px}.notice {font-size:.7rem;line-height:1.4}
    .workspace-heading {gap:10px;align-items:flex-start;margin-bottom:20px}.workspace-mark {flex-basis:42px;height:42px;border-radius:11px}.workspace-mark svg {width:22px;height:22px}
    .workspace-heading h2 {font-size:1.5rem}.workspace-heading p {font-size:.79rem}.workspace-heading .access-label {display:none}
    .card {padding:20px 16px;border-radius:13px;margin-bottom:16px}.card .card {padding:16px}.grid {grid-template-columns:1fr;gap:10px}
    input,select,textarea {font-size:16px}.actions {gap:8px}.actions>button {flex-grow:1}
    .stat-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:16px}.stat-card {min-height:125px;padding:18px 14px}.stat-card .stat {font-size:1.4rem}.stat-label {font-size:.74rem}
    .dashboard-hero {padding:24px 20px;gap:20px;margin-bottom:16px;align-items:flex-start;flex-direction:column}.dashboard-hero h2 {font-size:1.65rem}.dashboard-hero .hero-action {width:100%}
    .table-wrap {border-radius:9px}.section-heading {align-items:flex-start;gap:10px}.section-heading button {font-size:.75rem;padding:8px 10px}
    .auth-card {padding:28px 24px}.auth-screen {padding:24px 16px}.auth-brand.login-logo img {width:280px}
    .rx-grid {grid-template-columns:repeat(3,minmax(0,1fr))}
  }
  @media(prefers-reduced-motion:reduce) {*,*::before,*::after {transition:none!important;scroll-behavior:auto!important}}
}