/* EXTRACT reference e26b749. Scoped shared visual rules; source assets retain original bytes. */ body.clinical-workspace{ --ink:#14181F; --ink-2:#1D2430; --ink-line:rgba(214,190,140,0.18); --bg:#EAF5F7; --bg-2:#DCEBEF; --card:#FFFFFF; --card-tint:#FCFAF4; --border:#E6DCC7; --border-soft:#EFE7D6; --text:#221C14; --text-secondary:#7C7264; --text-faint:#A79C8A; --accent:#1F6E8C; --accent-bg:#D9EEF5; --accent-border:#8FC7DE; --accent-deep:#134A5F; --coral:#C1553A; --coral-bg:#F5E1D6; --coral-border:#E0AF98; --coral-deep:#8B2E1A; --amber:#8C5A17; --amber-bg:#F7EAD2; --amber-border:#E0C486; --sage:#3C6E5B; --sage-bg:#E1EEE7; --sage-border:#A9CBBB; --gray-bg:#EFE9DC; --shadow-xs:0 1px 2px rgba(34,28,20,0.06); --shadow-sm:0 2px 6px rgba(34,28,20,0.07), 0 1px 2px rgba(34,28,20,0.06); --shadow-md:0 10px 24px -8px rgba(34,28,20,0.20), 0 2px 8px rgba(34,28,20,0.08); --shadow-lg:0 24px 48px -12px rgba(20,24,31,0.35), 0 4px 12px rgba(34,28,20,0.10); --shadow-ink:0 20px 60px -12px rgba(0,0,0,0.55); --font-display:'Fraunces', Georgia, serif; --font-body:'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; --font-mono:'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace; } body.clinical-workspace *{ box-sizing:border-box; } body.clinical-workspace{ margin:0; padding:2rem 1rem; background: radial-gradient(1200px 500px at 15% -10%, rgba(162,121,61,0.08), transparent 60%), var(--bg); color:var(--text); font-family:var(--font-body); line-height:1.45; -webkit-font-smoothing:antialiased; } body.clinical-workspace #app{ max-width:1800px; margin:0 auto; } body.clinical-workspace h1,body.clinical-workspace h2,body.clinical-workspace h3{ font-family:var(--font-display); font-weight:600; letter-spacing:-0.01em; color:var(--text); } body.clinical-workspace input,body.clinical-workspace select,body.clinical-workspace button,body.clinical-workspace textarea{ font-family:inherit; font-size:14px; padding:9px 11px; border-radius:9px; border:1px solid var(--border); background:var(--card); color:var(--text); transition:border-color 140ms ease, box-shadow 140ms ease, background 140ms ease; } body.clinical-workspace input:focus,body.clinical-workspace select:focus,body.clinical-workspace textarea:focus{ outline:none; border-color:var(--accent-border); box-shadow:0 0 0 3px rgba(162,121,61,0.16); } body.clinical-workspace input[readonly]{ cursor:default; } body.clinical-workspace input[type=number],body.clinical-workspace .num{ font-family:var(--font-mono); font-variant-numeric:tabular-nums; } body.clinical-workspace :focus-visible{ outline:2px solid var(--accent); outline-offset:2px; } body.clinical-workspace button{ cursor:pointer; font-weight:600; letter-spacing:0.01em; position:relative; isolation:isolate; box-shadow: 0 2px 0 rgba(34,28,20,0.16), var(--shadow-sm); transition:transform 140ms ease, box-shadow 140ms ease, background 140ms ease, border-color 140ms ease; } body.clinical-workspace button::after{ content:''; position:absolute; inset:0; border-radius:inherit; pointer-events:none; z-index:1; background:linear-gradient(180deg, rgba(255,255,255,0.55) 0%, rgba(255,255,255,0.12) 42%, rgba(0,0,0,0.05) 60%, rgba(0,0,0,0.16) 100%); box-shadow: inset 0 0 0 1px rgba(255,255,255,0.18); transition:opacity 140ms ease; } body.clinical-workspace button:hover{ background:var(--gray-bg); transform:translateY(-1.5px); box-shadow: 0 4px 0 rgba(34,28,20,0.18), var(--shadow-md); } body.clinical-workspace button:active{ transform:translateY(2px) scale(0.96); box-shadow: 0 0px 0 rgba(34,28,20,0.1), var(--shadow-xs); } body.clinical-workspace button:active::after{ background:linear-gradient(180deg, rgba(0,0,0,0.10) 0%, rgba(0,0,0,0.02) 50%, rgba(255,255,255,0.1) 100%); } body.clinical-workspace button:disabled{ opacity:0.6; cursor:default; transform:none; box-shadow:none; } body.clinical-workspace button:disabled::after{ display:none; } @keyframes piaBotonRebote{ 0%{ transform:scale(1); } 35%{ transform:scale(0.90); } 60%{ transform:scale(1.07); } 80%{ transform:scale(0.97); } 100%{ transform:scale(1); } } body.clinical-workspace button.piaRebote{ animation:piaBotonRebote 380ms cubic-bezier(.34,1.56,.64,1); } body.clinical-workspace .card{ background:var(--card); border:1px solid var(--border-soft); border-radius:16px; padding:1.15rem 1.35rem; box-shadow:var(--shadow-sm); position:relative; } body.clinical-workspace .card-title{ font-family:var(--font-display); font-size:16px; font-weight:600; color:var(--text); margin:0 0 10px; letter-spacing:-0.005em; } body.clinical-workspace .pagosTabs{ display:flex; gap:4px; margin-bottom:20px; background:var(--card-tint); border:1px solid var(--border-soft); border-radius:12px; padding:4px; width:fit-content; } body.clinical-workspace .pagosTab{ padding:8px 20px; border-radius:9px; font-size:13.5px; font-weight:600; cursor:pointer; color:var(--text-secondary); border:none; background:none; box-shadow:none; } body.clinical-workspace .pagosTab:hover{ background:none; transform:none; box-shadow:none; } body.clinical-workspace .pagosTab.active{ background:var(--card); color:var(--accent-deep); box-shadow:0 2px 6px rgba(20,24,31,0.08); } body.clinical-workspace .pagosStatStrip{ display:grid; grid-template-columns:repeat(auto-fit, minmax(140px,1fr)); gap:10px; margin-bottom:20px; } body.clinical-workspace .pagosStatCard{ background:var(--card); border:1px solid var(--border-soft); border-radius:14px; padding:14px 16px; } body.clinical-workspace .pagosStatCard .num{ font-family:var(--font-display); font-size:22px; font-weight:600; color:var(--accent-deep); line-height:1; } body.clinical-workspace .pagosStatCard .lbl{ font-size:11px; color:var(--text-secondary); text-transform:uppercase; letter-spacing:0.04em; margin-top:5px; } body.clinical-workspace .pagosStatCard.warn .num{ color:var(--coral-deep); } body.clinical-workspace .talon{ position:relative; display:flex; justify-content:space-between; align-items:center; gap:14px; background:var(--card); border:1px solid var(--border-soft); border-radius:12px; padding:13px 16px 13px 20px; cursor:pointer; transition:transform 140ms ease, box-shadow 140ms ease, border-color 140ms ease; margin-bottom:9px; flex-wrap:wrap; } body.clinical-workspace .talon::before{ content:''; position:absolute; left:0; top:8px; bottom:8px; width:0; border-left:2px dashed var(--border); } body.clinical-workspace .talon:hover{ transform:translateX(2px); box-shadow:0 6px 16px -6px rgba(20,24,31,0.12); border-color:var(--accent-border); } body.clinical-workspace .talon.deben::before{ border-left-color:var(--coral-border); } body.clinical-workspace .talon.deben{ cursor:default; } body.clinical-workspace .talonMain{ min-width:0; flex:1; } body.clinical-workspace .talonTop{ display:flex; align-items:center; gap:8px; margin-bottom:3px; flex-wrap:wrap; } body.clinical-workspace .numRecibo{ font-family:var(--font-mono); font-size:11px; color:var(--text-faint); } body.clinical-workspace .pacienteNombre{ font-size:14px; font-weight:700; color:var(--text); } body.clinical-workspace .talonConcepto{ font-size:12.5px; color:var(--text-secondary); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } body.clinical-workspace .talonMeta{ display:flex; align-items:center; gap:6px; margin-top:5px; flex-wrap:wrap; } body.clinical-workspace .pagosTag{ font-size:10px; font-weight:700; padding:2px 8px; border-radius:20px; text-transform:uppercase; letter-spacing:0.03em; white-space:nowrap; } body.clinical-workspace .pagosTag.tratamiento{ background:var(--accent-bg); color:var(--accent-deep); } body.clinical-workspace .pagosTag.ortodoncia{ background:var(--sage-bg); color:var(--sage); } body.clinical-workspace .pagosTag.ingreso{ background:var(--amber-bg); color:var(--amber); } body.clinical-workspace .talonMetaTxt{ font-size:11.5px; color:var(--text-faint); } body.clinical-workspace .talonMonto{ flex-shrink:0; text-align:right; } body.clinical-workspace .montoSello{ font-family:var(--font-display); font-weight:700; font-size:18px; color:var(--accent-deep); transform:rotate(-1.2deg); display:inline-block; border:1.5px solid var(--accent-border); border-radius:8px; padding:3px 10px; background:var(--accent-bg); white-space:nowrap; } body.clinical-workspace .talon.deben .montoSello{ color:var(--coral-deep); border-color:var(--coral-border); background:var(--coral-bg); } body.clinical-workspace .talonEditar{ font-size:10.5px; color:var(--text-faint); margin-top:5px; display:block; background:none; border:none; padding:0; cursor:pointer; box-shadow:none; } body.clinical-workspace .talonEditar:hover{ background:none; transform:none; box-shadow:none; text-decoration:underline; } body.clinical-workspace .accionesDeben{ display:flex; gap:6px; margin-top:8px; flex-wrap:wrap; } body.clinical-workspace .pagosMiniBtn{ font-size:11.5px; padding:5px 11px; } body.clinical-workspace .pagosMiniBtn.pagar{ background:var(--sage-bg); border-color:var(--sage-border); color:var(--sage); } body.clinical-workspace .pagosMiniBtn.wsp{ background:#DFF3E3; border-color:#A9CBBB; color:#256B3E; } body.clinical-workspace .pagosMiniBtn.borrar{ background:var(--coral-bg); border-color:var(--coral-border); color:var(--coral-deep); } body.clinical-workspace .label{ font-size:12px; font-weight:600; color:var(--text-secondary); display:block; margin-bottom:5px; text-transform:uppercase; letter-spacing:0.04em; } body.clinical-workspace .patientRow{ padding:11px 13px; border:1px solid var(--border-soft); border-radius:12px; margin-bottom:7px; cursor:pointer; background:var(--card); box-shadow:var(--shadow-xs); transition:transform 140ms ease, box-shadow 140ms ease, border-color 140ms ease; } body.clinical-workspace .patientRow:hover{ background:var(--card); border-color:var(--accent-border); box-shadow:var(--shadow-sm); transform:translateY(-1px); } body.clinical-workspace .patientIdentitySticky{ position:fixed; top:12px; left:50%; transform:translate(-50%,-16px); width:min(720px,calc(100vw - 28px)); z-index:240; display:flex; align-items:center; gap:11px; padding:8px 14px 8px 9px; background: linear-gradient(135deg,rgba(29,36,48,.97) 0%,rgba(19,74,95,.97) 100%); border:1px solid rgba(214,190,140,.72); border-radius:999px; box-shadow: 0 12px 34px rgba(20,24,31,.30), 0 0 0 1px rgba(255,255,255,.035) inset, 0 1px 0 rgba(255,255,255,.10) inset; backdrop-filter:blur(14px) saturate(118%); -webkit-backdrop-filter:blur(14px) saturate(118%); opacity:0; pointer-events:none; transition:opacity 160ms ease, transform 160ms ease, box-shadow 160ms ease; } body.clinical-workspace .patientIdentitySticky::after{ content:''; position:absolute; inset:0; border-radius:inherit; pointer-events:none; background: radial-gradient(220px 48px at 16% 0%,rgba(217,184,124,.16),transparent 72%), linear-gradient(180deg,rgba(255,255,255,.045),transparent 45%); } body.clinical-workspace .patientIdentitySticky.visible{ opacity:1; transform:translate(-50%,0); pointer-events:auto; } body.clinical-workspace .patientIdentityStickyPhoto{ position:relative; z-index:1; width:40px; height:40px; border-radius:50%; overflow:hidden; flex:0 0 40px; background:linear-gradient(145deg,var(--card-tint),var(--accent-bg)); border:2px solid #D6BE8C; display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:700; font-size:13px; color:var(--accent-deep); box-shadow:0 0 0 2px rgba(255,255,255,.08),0 4px 12px rgba(0,0,0,.24); } body.clinical-workspace .patientIdentityStickyPhoto img{ width:100%; height:100%; object-fit:cover; display:block; } body.clinical-workspace .patientIdentityStickyText{ position:relative; z-index:1; min-width:0; flex:1; } body.clinical-workspace .patientIdentityStickyName{ font-family:var(--font-display); font-size:15.5px; font-weight:700; line-height:1.1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#FFF8EA; letter-spacing:.005em; text-shadow:0 1px 8px rgba(0,0,0,.28); } body.clinical-workspace .patientIdentityStickyMeta{ font-size:10.5px; color:rgba(235,245,247,.82); margin-top:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; letter-spacing:.01em; } @media(max-width:768px){body.clinical-workspace .patientIdentitySticky{ top:8px; width:calc(100vw - 16px); padding:7px 11px 7px 8px; gap:9px; } body.clinical-workspace .patientIdentityStickyPhoto{ width:36px; height:36px; flex-basis:36px; } body.clinical-workspace .patientIdentityStickyName{ font-size:14px; } body.clinical-workspace .patientIdentityStickyMeta{ font-size:9.8px; }} body.clinical-workspace .patientIdentityStickyName{ font-size:14px; } body.clinical-workspace .patientIdentityStickyMeta{ font-size:10px; } .piaPatientHero{ margin-bottom:14px; padding:22px; overflow:hidden; } body.clinical-workspace .piaPatientHeroTop{ display:grid; grid-template-columns:minmax(320px,1.25fr) minmax(300px,.9fr); gap:22px; align-items:start; } body.clinical-workspace .piaPatientIdentity{ display:flex; gap:18px; align-items:center; min-width:0; } body.clinical-workspace .piaPatientPhotoWrap{ position:relative; flex:0 0 auto; } body.clinical-workspace .piaPatientPhoto{ width:128px; height:128px; border-radius:50%; overflow:hidden; cursor:pointer; display:flex; align-items:center; justify-content:center; background:var(--gray-bg); border:4px solid #fff; box-shadow:0 10px 28px -12px rgba(20,24,31,.35),0 0 0 1px var(--border-soft); font-family:var(--font-display); font-size:26px; font-weight:700; color:var(--accent-deep); } body.clinical-workspace .piaPatientPhoto img{ width:100%; height:100%; object-fit:cover; display:block; } body.clinical-workspace .piaPatientPhotoCamera{ position:absolute; right:0; bottom:5px; width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:#fff; border:1px solid var(--border-soft); box-shadow:var(--shadow-sm); font-size:16px; pointer-events:none; } body.clinical-workspace .patientIdentityStickyAppointment{font-size:11px;line-height:1.4;color:var(--accent-deep);overflow-wrap:anywhere} body.clinical-workspace .piaPatientNameBlock{ min-width:0; } body.clinical-workspace .piaPatientName{ margin:0; font-size:28px; line-height:1.08; color:var(--accent-deep); overflow-wrap:anywhere; } body.clinical-workspace .piaPatientBadges{ display:flex; flex-wrap:wrap; gap:7px; margin-top:10px; } body.clinical-workspace .piaPatientBadge{ display:inline-flex; align-items:center; gap:5px; padding:5px 11px; border-radius:999px; font-size:11.5px; font-weight:700; border:1px solid var(--border-soft); } body.clinical-workspace .piaPatientBadge.orto{ background:var(--accent-bg); color:var(--accent-deep); border-color:var(--accent-border); } body.clinical-workspace .piaPatientBadge.migrado{ background:var(--sage-bg); color:var(--sage); border-color:var(--sage-border); } body.clinical-workspace .piaPatientAddress{ margin-top:9px; font-size:12px; color:var(--text-secondary); line-height:1.4; } body.clinical-workspace .piaPatientQuickInfo{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); border:1px solid var(--border-soft); border-radius:16px; overflow:hidden; background:linear-gradient(160deg,#fff,var(--card-tint)); } body.clinical-workspace .piaQuickItem{ padding:12px 14px; min-width:0; border-bottom:1px solid var(--border-soft); } body.clinical-workspace .piaQuickItem:nth-child(odd){ border-right:1px solid var(--border-soft); } body.clinical-workspace .piaQuickItem:nth-last-child(-n+2){ border-bottom:none; } body.clinical-workspace .piaQuickLabel{ font-size:10px; text-transform:uppercase; letter-spacing:.045em; color:var(--accent); font-weight:800; margin-bottom:4px; } body.clinical-workspace .piaQuickValue{ font-size:12.5px; color:var(--text); line-height:1.3; overflow-wrap:anywhere; } body.clinical-workspace .piaPatientActions{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:20px; } body.clinical-workspace .piaPatientAction{ min-height:76px; border-radius:14px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; text-align:center; padding:10px 8px; } body.clinical-workspace .piaPatientAction .piaActionIcon{ font-size:20px; line-height:1; } body.clinical-workspace .piaPatientAction.primary{ background:linear-gradient(180deg,#2C89AC,var(--accent-deep)); color:#fff; border-color:var(--accent-deep); } body.clinical-workspace .piaPatientAction.ortho{ background:var(--accent-bg); color:var(--accent-deep); border-color:var(--accent-border); } body.clinical-workspace .piaPatientAction.danger{ background:var(--coral-bg); color:var(--coral-deep); border-color:var(--coral-border); } body.clinical-workspace .piaPatientBirthdayAction{ margin-top:8px; width:100%; font-size:12px; background:var(--amber-bg); color:var(--amber); border-color:var(--amber-border); } body.clinical-workspace .piaNextAppointment{ margin-top:16px; display:grid; grid-template-columns:88px minmax(0,1fr); gap:18px; align-items:center; padding:15px 18px; border:1px solid var(--sage-border); border-radius:16px; background:linear-gradient(135deg,rgba(225,238,231,.75),rgba(255,255,255,.92)); } body.clinical-workspace .piaCalTile{ width:72px; height:72px; border-radius:15px; background:#fff; border:1px solid var(--border-soft); box-shadow:var(--shadow-sm); overflow:hidden; text-align:center; } body.clinical-workspace .piaCalMonth{ background:var(--accent); color:#fff; font-size:10px; font-weight:800; letter-spacing:.05em; padding:5px 2px; text-transform:uppercase; } body.clinical-workspace .piaCalDay{ font-family:var(--font-display); font-size:30px; font-weight:700; color:var(--accent-deep); line-height:45px; } body.clinical-workspace .piaNextTitle{ font-size:12px; text-transform:uppercase; letter-spacing:.045em; color:var(--sage); font-weight:800; margin-bottom:6px; } body.clinical-workspace .piaNextMeta{ display:flex; flex-wrap:wrap; gap:8px 18px; font-size:13px; color:var(--text); } body.clinical-workspace .piaNextMeta span{ display:inline-flex; gap:5px; align-items:center; } body.clinical-workspace .piaNoAppointment{ color:var(--text-secondary); text-decoration:underline dotted; cursor:pointer; } @media(max-width:900px){body.clinical-workspace .piaPatientHeroTop{ grid-template-columns:1fr; } body.clinical-workspace .piaPatientQuickInfo{ grid-template-columns:repeat(4,minmax(0,1fr)); } body.clinical-workspace .piaQuickItem{ border-bottom:none !important; border-right:1px solid var(--border-soft) !important; text-align:center; } body.clinical-workspace .piaQuickItem:last-child{ border-right:none !important; }} @media(max-width:768px){body.clinical-workspace .piaPatientHero{ padding:14px; border-radius:20px; } body.clinical-workspace .piaPatientHeroTop{ gap:14px; } body.clinical-workspace .piaPatientIdentity{ align-items:flex-start; gap:13px; position:relative; } body.clinical-workspace .piaPatientPhoto{ width:92px; height:92px; font-size:20px; } body.clinical-workspace .piaPatientPhotoCamera{ width:29px; height:29px; font-size:14px; bottom:1px; } body.clinical-workspace .piaPatientName{ font-size:22px; padding-right:0; } body.clinical-workspace .piaPatientBadges{ margin-top:8px; gap:5px; } body.clinical-workspace .piaPatientBadge{ font-size:10.5px; padding:4px 8px; } body.clinical-workspace .piaPatientAddress{ font-size:11px; } body.clinical-workspace .piaPatientActions{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin-top:14px; } body.clinical-workspace .piaPatientAction{ min-height:82px; font-size:13px; padding:9px 6px; } body.clinical-workspace .piaPatientAction .piaActionIcon{ font-size:21px; } body.clinical-workspace .piaPatientQuickInfo{ grid-template-columns:repeat(4,minmax(0,1fr)); margin-top:2px; } body.clinical-workspace .piaQuickItem{ padding:10px 4px; } body.clinical-workspace .piaQuickLabel{ font-size:8.5px; letter-spacing:0; text-transform:none; } body.clinical-workspace .piaQuickValue{ font-size:10.5px; } body.clinical-workspace .piaNextAppointment{ grid-template-columns:68px minmax(0,1fr); gap:12px; padding:12px; } body.clinical-workspace .piaCalTile{ width:62px; height:64px; } body.clinical-workspace .piaCalDay{ font-size:26px; line-height:39px; } body.clinical-workspace .piaNextTitle{ font-size:10px; margin-bottom:4px; } body.clinical-workspace .piaNextMeta{ display:grid; grid-template-columns:1fr; gap:3px; font-size:12px; }} @media(max-width:430px){body.clinical-workspace .piaPatientIdentity{ gap:11px; } body.clinical-workspace .piaPatientPhoto{ width:82px; height:82px; } body.clinical-workspace .piaPatientName{ font-size:20px; } body.clinical-workspace .piaPatientQuickInfo{ grid-template-columns:repeat(2,minmax(0,1fr)); } body.clinical-workspace .piaQuickItem{ border-bottom:1px solid var(--border-soft) !important; } body.clinical-workspace .piaQuickItem:nth-child(odd){ border-right:1px solid var(--border-soft) !important; } body.clinical-workspace .piaQuickItem:nth-child(even){ border-right:none !important; } body.clinical-workspace .piaQuickItem:nth-last-child(-n+2){ border-bottom:none !important; }} body.clinical-workspace .tooth{ aspect-ratio:1; border-radius:6px; display:flex; align-items:center; justify-content:center; font-size:10px; font-weight:700; cursor:pointer; color:var(--text); box-shadow:inset 0 0 0 1px rgba(34,28,20,0.05); transition:transform 120ms ease; } body.clinical-workspace .tooth:hover{ transform:scale(1.08); z-index:1; } body.clinical-workspace .c-gray{ background:var(--gray-bg); } body.clinical-workspace .c-coral{ background:var(--coral-bg); color:var(--coral-deep); } body.clinical-workspace .c-amber{ background:var(--amber-bg); color:var(--amber); } body.clinical-workspace .c-teal{ background:var(--sage-bg); color:var(--sage); } body.clinical-workspace #errorBanner{ display:none; background:var(--coral-bg); border:1px solid var(--coral-border); color:var(--coral-deep); padding:11px 15px; border-radius:10px; margin-bottom:1rem; font-size:13px; box-shadow:var(--shadow-xs); } body.clinical-workspace .doctorColGrid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(210px,1fr)); gap:10px; align-items:start; } body.clinical-workspace .doctorCol{ border:1px solid var(--border-soft); border-radius:14px; overflow:hidden; box-shadow:var(--shadow-xs); } body.clinical-workspace .doctorColHead{ padding:8px 10px; color:#fff; font-weight:700; font-size:12.5px; } body.clinical-workspace .doctorColBody{ padding:6px; display:grid; grid-template-columns:38px 1fr; grid-auto-rows:minmax(26px,auto); gap:3px 5px; max-height:66vh; overflow-y:auto; } body.clinical-workspace .agSlotHora{ font-family:var(--font-mono); font-size:9.5px; color:var(--text-faint); padding-top:6px; text-align:right; } body.clinical-workspace .agSlotHora.enPunto{ color:var(--text-secondary); font-weight:700; } body.clinical-workspace .agColCita{ border-radius:8px; padding:5px 7px; color:#fff; cursor:pointer; transition:transform 120ms ease; display:flex; flex-direction:column; justify-content:center; } body.clinical-workspace .agColCita:hover{ transform:translateY(-1px); } body.clinical-workspace .agColNombre{ font-size:11.5px; font-weight:700; line-height:1.15; } body.clinical-workspace .agColActividad{ font-size:10px; opacity:.92; margin-top:1px; } body.clinical-workspace .agColFoot{ display:flex; justify-content:space-between; align-items:center; margin-top:3px; } body.clinical-workspace .agColEstado{ font-size:9px; font-weight:700; background:rgba(255,255,255,0.24); padding:1px 5px; border-radius:20px; } body.clinical-workspace .agColVerFicha{ background:rgba(255,255,255,0.24); border:none; color:#fff; font-size:10px; padding:1px 5px; border-radius:20px; cursor:pointer; box-shadow:none; } body.clinical-workspace .agColVerFicha:hover{ background:rgba(255,255,255,0.42); transform:none; box-shadow:none; } body.clinical-workspace .agColSlotVacio{ border-radius:8px; padding:2px 5px 2px 9px; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:5px; font-size:10.5px; font-weight:700; transition:background 120ms ease, border-color 120ms ease; } body.clinical-workspace .agColSlotVacio .disponibleTxt{ flex:1; text-align:left; } body.clinical-workspace .agColSlotOcuparBtn{ font-size:9px; font-weight:700; padding:2px 6px; border-radius:20px; cursor:pointer; background:rgba(34,28,20,0.06); border:1px solid transparent; box-shadow:none; color:var(--text-secondary); flex-shrink:0; } body.clinical-workspace .agColSlotOcuparBtn:hover{ background:var(--coral-bg); color:var(--coral-deep); transform:none; box-shadow:none; } body.clinical-workspace .agColBloqueo{ border-radius:8px; padding:5px 7px; cursor:pointer; background:var(--gray-bg); border:1px dashed var(--text-faint); transition:transform 120ms ease; display:flex; flex-direction:column; justify-content:center; } body.clinical-workspace .agColBloqueo:hover{ transform:translateY(-1px); } body.clinical-workspace .agColBloqueo .agColNombre{ color:var(--text-secondary); } body.clinical-workspace .semScroller{ display:flex; gap:10px; overflow-x:auto; padding-bottom:10px; scroll-snap-type:x proximity; } body.clinical-workspace .semDayBlock{ flex:0 0 auto; width:600px; scroll-snap-align:start; } body.clinical-workspace .semDayBlock.semDayEstrecho{ width:420px; } body.clinical-workspace .semDayHead{ background:var(--ink); color:#FBF6EC; border-radius:12px 12px 0 0; padding:8px 14px; display:flex; justify-content:space-between; align-items:baseline; } body.clinical-workspace .semDayHead.semHoy{ background:var(--accent-deep); } body.clinical-workspace .semDayHead .semDayNombre{ font-family:var(--font-display); font-weight:700; font-size:14px; } body.clinical-workspace .semDayHead .semDayFecha{ font-size:11px; opacity:.75; } body.clinical-workspace .semColGrid{ display:grid; gap:6px; background:var(--card); border:1px solid var(--border-soft); border-top:none; border-radius:0 0 12px 12px; padding:6px; box-shadow:var(--shadow-xs); } body.clinical-workspace .semColGrid.semCols3{ grid-template-columns:repeat(3,1fr); } body.clinical-workspace .semColGrid.semCols4{ grid-template-columns:repeat(4,1fr); } body.clinical-workspace .semColGrid.semCols5{ grid-template-columns:repeat(5,1fr); } body.clinical-workspace .semDoctorCol{ border-radius:10px; overflow:hidden; } body.clinical-workspace .semDoctorColHead{ padding:5px 6px; color:#fff; font-weight:700; font-size:10px; text-align:center; line-height:1.2; } body.clinical-workspace .semDoctorColBody{ padding:4px; display:grid; grid-template-columns:28px 1fr; grid-auto-rows:minmax(20px,auto); gap:3px; max-height:400px; overflow-y:auto; } body.clinical-workspace .semSlotHora{ font-family:var(--font-mono); font-size:8.5px; color:var(--text-faint); padding-top:5px; text-align:right; } body.clinical-workspace .semSlotHora.semEnPunto{ color:var(--text-secondary); font-weight:700; } body.clinical-workspace .semCita{ border-radius:7px; padding:4px 5px; color:#fff; cursor:pointer; display:flex; flex-direction:column; justify-content:center; } body.clinical-workspace .semCita:hover{ filter:brightness(1.05); } body.clinical-workspace .semNombre{ font-size:9.5px; font-weight:700; line-height:1.1; } body.clinical-workspace .semActividad{ font-size:8.5px; opacity:.9; margin-top:1px; } body.clinical-workspace .semEstado{ font-size:7.5px; font-weight:700; background:rgba(255,255,255,0.25); padding:1px 4px; border-radius:20px; display:inline-block; margin-top:2px; } body.clinical-workspace .semSlotVacio{ border-radius:6px; padding:3px 5px; font-size:8.5px; font-weight:700; text-align:center; cursor:pointer; } body.clinical-workspace .semSlotVacio:hover{ filter:brightness(0.95); } body.clinical-workspace .semBloqueo{ border-radius:7px; padding:4px 5px; cursor:pointer; background:var(--gray-bg); border:1px dashed var(--text-faint); display:flex; flex-direction:column; justify-content:center; } body.clinical-workspace .semBloqueo .semNombre{ color:var(--text-secondary); } body.clinical-workspace .semBloqueo .semActividad{ color:var(--text-faint); } body.clinical-workspace .agColBloqueo .agColActividad{ color:var(--text-faint); } body.clinical-workspace .piaAgendaMobileOnly{display:none;} body.clinical-workspace .piaAgendaDetailCard{background:var(--card);width:90%;max-width:430px;max-height:88vh;overflow-y:auto;border:1px solid var(--border-soft);box-shadow:0 24px 60px rgba(13,38,48,.24);} body.clinical-workspace .piaAgendaDetailHero{padding:2px 0 12px;border-bottom:1px solid var(--border-soft);margin-bottom:12px;} body.clinical-workspace .piaAgendaDetailName{font-family:var(--font-display);font-size:20px;line-height:1.15;color:var(--ink);font-weight:800;margin:0 0 8px;overflow-wrap:anywhere;} body.clinical-workspace .piaAgendaDetailGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:10px 0 12px;} body.clinical-workspace .piaAgendaDetailItem{background:var(--gray-bg);border:1px solid var(--border-soft);border-radius:11px;padding:9px 10px;min-width:0;} body.clinical-workspace .piaAgendaDetailLabel{font-size:9px;letter-spacing:.055em;text-transform:uppercase;color:var(--text-faint);font-weight:800;margin-bottom:3px;} body.clinical-workspace .piaAgendaDetailValue{font-size:12.5px;line-height:1.35;color:var(--text);font-weight:700;overflow-wrap:anywhere;} body.clinical-workspace .piaAgendaDetailProcedure{background:linear-gradient(145deg,var(--accent-bg),rgba(255,255,255,.72));border:1px solid var(--accent-border);border-radius:12px;padding:10px 12px;margin:0 0 10px;font-size:13px;line-height:1.42;color:var(--accent-deep);font-weight:700;overflow-wrap:anywhere;} body.clinical-workspace .piaAgendaDetailNotes{font-size:12px;line-height:1.45;color:var(--text-secondary);background:#fffdf8;border:1px solid var(--border-soft);border-radius:10px;padding:9px 10px;margin-bottom:10px;} body.clinical-workspace .piaAgendaDetailStatus{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:4px 8px;font-size:10px;font-weight:800;background:var(--gray-bg);color:var(--text-secondary);} @media(max-width:720px){body.clinical-workspace .piaAgendaMobileOnly{display:block;font-size:9.5px;line-height:1.2;margin-top:3px;opacity:.88;font-weight:700;} body.clinical-workspace .doctorColGrid{grid-template-columns:1fr!important;gap:12px;} body.clinical-workspace .doctorCol{border-radius:16px;} body.clinical-workspace .doctorColHead{font-size:14px;padding:10px 12px;position:sticky;top:0;z-index:2;} body.clinical-workspace .doctorColBody{grid-template-columns:44px minmax(0,1fr);grid-auto-rows:minmax(34px,auto);gap:4px 7px;max-height:none;overflow-y:visible;padding:7px;} body.clinical-workspace .agSlotHora{font-size:10.5px;padding-top:8px;} body.clinical-workspace .agColCita{padding:8px 10px;min-height:50px;border-radius:10px;box-shadow:0 5px 12px rgba(18,47,58,.10);overflow:visible;} body.clinical-workspace .agColNombre{font-size:13.5px;line-height:1.18;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;} body.clinical-workspace .agColActividad{font-size:11.5px;line-height:1.25;margin-top:3px;white-space:normal;overflow-wrap:anywhere;} body.clinical-workspace .agColEstado{font-size:9.5px;padding:2px 6px;} body.clinical-workspace .agColVerFicha{font-size:11px;padding:2px 7px;} body.clinical-workspace .agColSlotVacio{font-size:11px;min-height:32px;} body.clinical-workspace .semScroller{gap:8px;scroll-snap-type:x mandatory;padding:0 2px 12px;} body.clinical-workspace .semDayBlock,body.clinical-workspace .semDayBlock.semDayEstrecho{width:calc(100vw - 24px)!important;scroll-snap-align:center;} body.clinical-workspace .semDayHead{padding:10px 12px;border-radius:14px 14px 0 0;} body.clinical-workspace .semDayHead .semDayNombre{font-size:15px;} body.clinical-workspace .semDayHead .semDayFecha{font-size:12px;} body.clinical-workspace .semColGrid,body.clinical-workspace .semColGrid.semCols3,body.clinical-workspace .semColGrid.semCols4,body.clinical-workspace .semColGrid.semCols5{display:flex!important;grid-template-columns:none!important;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;padding:8px;-webkit-overflow-scrolling:touch;} body.clinical-workspace .semDoctorCol{flex:0 0 min(82vw,330px);scroll-snap-align:start;border:1px solid var(--border-soft);background:rgba(255,255,255,.72);border-radius:12px;} body.clinical-workspace .semDoctorColHead{font-size:12px;padding:8px 7px;position:sticky;top:0;z-index:2;} body.clinical-workspace .semDoctorColBody{grid-template-columns:38px minmax(0,1fr);grid-auto-rows:minmax(32px,auto);gap:4px 5px;max-height:62vh;padding:6px;} body.clinical-workspace .semSlotHora{font-size:9.5px;padding-top:7px;} body.clinical-workspace .semCita{padding:7px 8px;min-height:48px;border-radius:9px;box-shadow:0 4px 10px rgba(18,47,58,.10);overflow:visible;} body.clinical-workspace .semNombre{font-size:12.5px;line-height:1.18;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;} body.clinical-workspace .semActividad{font-size:11px;line-height:1.22;margin-top:3px;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;} body.clinical-workspace .semEstado{font-size:9px;padding:2px 6px;margin-top:4px;} body.clinical-workspace .semSlotVacio{font-size:10px;padding:5px 6px;} body.clinical-workspace .overlayDetalleCita{align-items:flex-end!important;justify-content:center!important;padding:0!important;background:rgba(9,25,32,.66)!important;} body.clinical-workspace .piaAgendaDetailCard{width:100%!important;max-width:none!important;max-height:88dvh!important;border-radius:24px 24px 0 0!important;padding:18px 16px calc(18px + env(safe-area-inset-bottom))!important;box-shadow:0 -18px 50px rgba(8,25,32,.25)!important;} body.clinical-workspace .piaAgendaDetailCard:before{content:'';display:block;width:44px;height:5px;border-radius:99px;background:#C7D4D8;margin:-6px auto 13px;} body.clinical-workspace .piaAgendaDetailName{font-size:22px;} body.clinical-workspace .piaAgendaDetailGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;} body.clinical-workspace .piaAgendaDetailValue{font-size:13px;} body.clinical-workspace .piaAgendaDetailProcedure{font-size:14px;padding:11px 12px;} body.clinical-workspace .piaAgendaDetailCard button{min-height:42px;font-size:12.5px!important;}} @media(max-width:390px){body.clinical-workspace .semDoctorCol{flex-basis:86vw;} body.clinical-workspace .piaAgendaDetailGrid{grid-template-columns:1fr 1fr;} body.clinical-workspace .agColNombre{font-size:13px;} body.clinical-workspace .agColActividad{font-size:11px;}} body.clinical-workspace .brandHeader{ display:flex; align-items:center; gap:12px; } body.clinical-workspace .brandHeader img{ height:64px; width:auto; filter:drop-shadow(0 2px 6px rgba(34,28,20,0.18)); } body.clinical-workspace .brandHeader h2{ font-family:var(--font-display); } body.clinical-workspace .ink-bar{ background:linear-gradient(180deg, var(--ink-2), var(--ink)); border-radius:18px; padding:14px 18px; box-shadow:var(--shadow-ink); border:1px solid rgba(217,184,124,0.16); position:relative; overflow:hidden; } body.clinical-workspace .ink-bar::after{ content:''; position:absolute; left:0; right:0; bottom:0; height:2px; background:linear-gradient(90deg, transparent, rgba(217,184,124,0.65), transparent); } body.clinical-workspace .navPill{ background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.14); color:#F3EADA; box-shadow:none; } body.clinical-workspace .navPill:hover{ background:rgba(217,184,124,0.18); border-color:rgba(217,184,124,0.5); color:#FBF2DD; transform:translateY(-1px); } body.clinical-workspace .ink-bar::before{ content:''; position:absolute; inset:0; background:radial-gradient(420px 200px at 12% 0%, rgba(217,184,124,0.14), transparent 70%); pointer-events:none; } body.clinical-workspace .piaLogoWrap{ position:relative; flex-shrink:0; } body.clinical-workspace .piaLogoGlow{ position:absolute; inset:-16px; background:radial-gradient(circle, rgba(63,169,196,0.38), transparent 70%); filter:blur(12px); border-radius:50%; animation:piaGlowPulseNav 4.5s ease-in-out infinite; pointer-events:none; } @keyframes piaGlowPulseNav{ 0%,100%{ opacity:0.5; transform:scale(0.94); } 50%{ opacity:0.9; transform:scale(1.06); } } body.clinical-workspace .piaBrandText{ opacity:0; animation:piaBrandIn 900ms cubic-bezier(.22,.61,.36,1) 150ms forwards; } @keyframes piaBrandIn{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:translateY(0); } } body.clinical-workspace .piaFraseNav{ font-family:var(--font-display); font-style:italic; font-weight:500; font-size:12.5px; color:#9FB4BD; margin:4px 0 0; max-width:420px; } body.clinical-workspace .navPillIcon{ display:inline-flex; align-items:center; gap:7px; background:linear-gradient(160deg, rgba(255,255,255,0.09), rgba(255,255,255,0.03)); padding:9px 14px 9px 9px; border-radius:11px; } body.clinical-workspace .navPillIcon .ico{ width:24px; height:24px; border-radius:7px; background:rgba(255,255,255,0.09); display:flex; align-items:center; justify-content:center; font-size:12px; flex-shrink:0; } body.clinical-workspace .navPill.piaGold{ background:linear-gradient(160deg, rgba(217,184,124,0.26), rgba(217,184,124,0.07)); border-color:rgba(217,184,124,0.45); } body.clinical-workspace .navCardGrid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(122px, 1fr)); gap:10px; width:100%; position:relative; z-index:1; } body.clinical-workspace .navCard{ --tiltX:0deg; --tiltY:0deg; position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px; min-height:74px; padding:10px 8px; border-radius:12px; background:linear-gradient(165deg, rgba(31,110,140,0.34), rgba(19,22,29,0.94) 68%); border:1px solid rgba(255,255,255,0.20); color:#F3F7F8; font-family:var(--font-body); font-size:11.5px; font-weight:600; letter-spacing:0.01em; cursor:pointer; text-align:center; overflow:hidden; box-shadow: 0 1.5px 0 rgba(255,255,255,0.28) inset, 0 -1.5px 0 rgba(0,0,0,0.55) inset, 0 -9px 14px -10px rgba(0,0,0,0.6) inset, 0 10px 18px -10px rgba(0,0,0,0.8), 0 2px 3px -1px rgba(0,0,0,0.55); transform:perspective(700px) rotateX(var(--tiltX)) rotateY(var(--tiltY)) translateZ(0); transition:transform 200ms cubic-bezier(.2,.8,.2,1), box-shadow 220ms ease, border-color 220ms ease; -webkit-tap-highlight-color:transparent; } body.clinical-workspace .navCard::after{ content:none; } body.clinical-workspace .navCard:hover{ background:linear-gradient(165deg, rgba(31,110,140,0.40), rgba(19,22,29,0.96) 68%) !important; } body.clinical-workspace .navCard::before,body.clinical-workspace .navCard::after,body.clinical-workspace .navCard .cornerBR,body.clinical-workspace .navCard .cornerBL{ content:''; position:absolute; width:9px; height:9px; opacity:0; transition:opacity 220ms ease; border-color:#5FE3F0; pointer-events:none; } body.clinical-workspace .navCard::before{ top:5px; left:5px; border-top:1.5px solid; border-left:1.5px solid; } body.clinical-workspace .navCard::after{ top:5px; right:5px; border-top:1.5px solid; border-right:1.5px solid; } body.clinical-workspace .navCard .cornerBR{ bottom:5px; right:5px; border-bottom:1.5px solid #5FE3F0; border-right:1.5px solid #5FE3F0; } body.clinical-workspace .navCard .cornerBL{ bottom:5px; left:5px; border-bottom:1.5px solid #5FE3F0; border-left:1.5px solid #5FE3F0; } body.clinical-workspace .navCard:hover::before,body.clinical-workspace .navCard:hover::after,body.clinical-workspace .navCard:hover .cornerBR,body.clinical-workspace .navCard:hover .cornerBL,body.clinical-workspace .navCard:focus-visible::before,body.clinical-workspace .navCard:focus-visible::after,body.clinical-workspace .navCard:focus-visible .cornerBR,body.clinical-workspace .navCard:focus-visible .cornerBL{ opacity:0.85; } body.clinical-workspace .navCardIcoWrap{ width:32px; height:32px; border-radius:9px; position:relative; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); transition:box-shadow 220ms ease, background 220ms ease, border-color 220ms ease; } body.clinical-workspace .navCardIcoWrap::before{ content:''; position:absolute; inset:-3px; border-radius:12px; background:conic-gradient(from 0deg, transparent, #5FE3F0 12%, transparent 24%, transparent 100%); opacity:0; transition:opacity 220ms ease; animation:navCardSpin 2.6s linear infinite; animation-play-state:paused; } body.clinical-workspace .navCard:hover .navCardIcoWrap::before,body.clinical-workspace .navCard:focus-visible .navCardIcoWrap::before{ opacity:0.55; animation-play-state:running; } @keyframes navCardSpin{ to{ transform:rotate(360deg); } } body.clinical-workspace .navCard svg{ width:16px; height:16px; stroke:#F3F7F8; stroke-width:1.7; fill:none; stroke-linecap:round; stroke-linejoin:round; position:relative; z-index:1; transition:stroke 220ms ease, transform 220ms ease, filter 220ms ease; } body.clinical-workspace .navCard .navCardLbl{ line-height:1.2; max-width:100%; position:relative; z-index:1; } body.clinical-workspace .navCard:hover,body.clinical-workspace .navCard:focus-visible{ transform:perspective(700px) rotateX(var(--tiltX)) rotateY(var(--tiltY)) translateY(-4px) scale(1.025); border-color:rgba(95,227,240,0.5); box-shadow: 0 1.5px 0 rgba(255,255,255,0.32) inset, 0 -1.5px 0 rgba(0,0,0,0.55) inset, 0 -9px 14px -10px rgba(0,0,0,0.6) inset, 0 18px 28px -14px rgba(0,0,0,0.85), 0 0 0 1px rgba(95,227,240,0.2), 0 0 20px -6px rgba(95,227,240,0.4); } body.clinical-workspace .navCard:hover .navCardIcoWrap,body.clinical-workspace .navCard:focus-visible .navCardIcoWrap{ background:rgba(95,227,240,0.08); border-color:rgba(95,227,240,0.35); } body.clinical-workspace .navCard:hover svg,body.clinical-workspace .navCard:focus-visible svg{ transform:scale(1.08); filter:drop-shadow(0 0 5px rgba(95,227,240,0.5)); } body.clinical-workspace .navCard:active{ transform:perspective(700px) scale(0.98); } body.clinical-workspace .navCard:focus-visible{ outline:2px solid #5FE3F0; outline-offset:2px; } body.clinical-workspace .navCard.navCardActive{ border-color:rgba(95,227,240,0.55); background:linear-gradient(165deg, rgba(95,227,240,0.14), #12161D 68%); box-shadow:0 1px 0 rgba(255,255,255,0.08) inset, 0 0 0 1px rgba(95,227,240,0.3), 0 0 22px -8px rgba(95,227,240,0.4); } body.clinical-workspace .navCard.navCardActive::before,body.clinical-workspace .navCard.navCardActive::after,body.clinical-workspace .navCard.navCardActive .cornerBR,body.clinical-workspace .navCard.navCardActive .cornerBL{ opacity:0.7; } body.clinical-workspace .navCard.navCardActive .navCardIcoWrap{ background:rgba(95,227,240,0.16); border-color:rgba(95,227,240,0.45); } body.clinical-workspace .navCard.navCardActive svg{ stroke:#CFF7FC; } body.clinical-workspace .navCard.navCardGold{ background:linear-gradient(165deg, rgba(217,184,124,0.20), rgba(19,22,29,0.94) 68%); border-color:rgba(217,184,124,0.32); } body.clinical-workspace .navCard.navCardGold .navCardIcoWrap{ background:rgba(217,184,124,0.09); } body.clinical-workspace .navCard.navCardGold .navCardIcoWrap::before{ background:conic-gradient(from 0deg, transparent, #D9B87C 12%, transparent 24%, transparent 100%); } body.clinical-workspace .navCard.navCardGold:hover,body.clinical-workspace .navCard.navCardGold:focus-visible{ border-color:rgba(217,184,124,0.5); box-shadow:0 1px 0 rgba(255,255,255,0.08) inset, 0 -10px 16px -12px rgba(0,0,0,0.6) inset, 0 16px 26px -14px rgba(0,0,0,0.75), 0 0 0 1px rgba(217,184,124,0.2), 0 0 20px -6px rgba(217,184,124,0.4); } body.clinical-workspace .navCard.navCardGold:hover svg,body.clinical-workspace .navCard.navCardGold:focus-visible svg{ filter:drop-shadow(0 0 5px rgba(217,184,124,0.6)); } body.clinical-workspace .navCard.navCardGold::before,body.clinical-workspace .navCard.navCardGold::after,body.clinical-workspace .navCard.navCardGold .cornerBR,body.clinical-workspace .navCard.navCardGold .cornerBL{ border-color:#D9B87C; } body.clinical-workspace .navCard.navCardWarm{ background:linear-gradient(165deg, rgba(193,85,58,0.20), #12161D 68%); border-color:rgba(224,175,152,0.3); } body.clinical-workspace .navCard.navCardWarm .navCardIcoWrap{ background:rgba(193,85,58,0.12); } body.clinical-workspace .navCardBadge{ position:absolute; top:6px; right:8px; z-index:2; background:#E0503A; color:#fff; font-size:10px; font-weight:700; min-width:16px; height:16px; border-radius:50%; display:flex; align-items:center; justify-content:center; padding:0 3px; box-shadow:0 0 0 2px #12161D, 0 0 8px -1px rgba(224,80,58,0.8); } @media (prefers-reduced-motion: reduce){body.clinical-workspace .navCard,body.clinical-workspace .navCardIcoWrap::before{ transition:none; animation:none; } body.clinical-workspace .navCard:hover,body.clinical-workspace .navCard:focus-visible{ transform:none; }} @media (max-width:768px){body.clinical-workspace .navCardGrid{ grid-template-columns:repeat(2, 1fr); gap:8px; } body.clinical-workspace .navCard{ min-height:66px; }} body.clinical-workspace .piaAvatar{ width:36px; height:36px; border-radius:10px; flex-shrink:0; display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:700; font-size:13px; color:#fff; background:linear-gradient(155deg, #3FA9C4, var(--accent-deep)); box-shadow:0 3px 8px -2px rgba(31,110,140,0.5); } body.clinical-workspace .piaAvatar.piaAvatarMigrado{ background:linear-gradient(155deg, #6FAE94, var(--sage)); box-shadow:0 3px 8px -2px rgba(60,110,91,0.5); } body.clinical-workspace .piaDashStatsRow{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:18px; } body.clinical-workspace .piaStatCard{ border-radius:16px; padding:16px 18px; border:1.5px solid var(--border-soft); background:linear-gradient(160deg, var(--card), var(--card-tint)); box-shadow:var(--shadow-xs); transition:transform 180ms ease, box-shadow 180ms ease; cursor:pointer; } body.clinical-workspace .piaStatCard:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); } body.clinical-workspace .piaStatCard .piaStatLbl{ font-size:11px; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-secondary); font-weight:700; } body.clinical-workspace .piaStatCard .piaStatVal{ font-family:var(--font-mono); font-size:24px; font-weight:600; margin-top:6px; } body.clinical-workspace .piaDashSub{ border-radius:16px; border:1.5px solid var(--border-soft); background:var(--card); box-shadow:var(--shadow-xs); padding:18px 20px; margin-bottom:18px; } body.clinical-workspace .piaDashSub .piaDashHead{ display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; gap:10px; flex-wrap:wrap; } body.clinical-workspace .piaDashSub .piaDashHead h3{ font-size:15.5px; margin:0; font-family:var(--font-display); font-weight:600; } body.clinical-workspace .piaVerMas{ font-size:12px; color:var(--accent); font-weight:700; cursor:pointer; background:none; border:none; padding:0; box-shadow:none; } body.clinical-workspace .piaDot{ width:8px; height:8px; border-radius:50%; flex-shrink:0; } body.clinical-workspace .piaDoctorChipsRow{ display:flex; gap:8px; overflow-x:auto; padding-bottom:8px; margin-bottom:10px; -webkit-overflow-scrolling:touch; } body.clinical-workspace .piaDoctorChip{ display:inline-flex; align-items:center; gap:7px; flex-shrink:0; font-size:12.5px; font-weight:700; padding:7px 13px; border-radius:20px; border:1.5px solid var(--border-soft); background:var(--card-tint); color:var(--text-secondary); cursor:pointer; white-space:nowrap; transition:background 140ms ease, border-color 140ms ease, color 140ms ease; } body.clinical-workspace .piaDoctorChipActivo{ background:var(--accent-bg); border-color:var(--accent-border); color:var(--accent-deep); } body.clinical-workspace .piaAgendaCards{ display:flex; flex-direction:column; gap:8px; } body.clinical-workspace .piaCitaCard{ display:flex; align-items:stretch; gap:9px; cursor:pointer; } body.clinical-workspace .piaCitaCard .piaHora{ font-family:var(--font-mono); font-size:12px; color:var(--text-secondary); width:38px; flex-shrink:0; padding-top:12px; } body.clinical-workspace .piaCitaCardBarra{ width:3px; border-radius:3px; flex-shrink:0; } body.clinical-workspace .piaCitaCardCuerpo{ flex:1; min-width:0; display:flex; align-items:center; gap:10px; border-radius:12px; padding:10px 12px; transition:filter 140ms ease; } body.clinical-workspace .piaCitaCard:hover .piaCitaCardCuerpo{ filter:brightness(0.97); } body.clinical-workspace .piaCitaCardNombre{ margin:0; font-size:13.5px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } body.clinical-workspace .piaCitaCardSub{ margin:2px 0 0; font-size:11px; color:var(--text-secondary); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } body.clinical-workspace .piaDashZona{ border:1.5px solid var(--coral-border); border-left:5px solid var(--coral); border-radius:14px; background:var(--coral-bg); padding:16px 18px 6px; margin-bottom:18px; } body.clinical-workspace .piaDashZona.piaDashZonaSeguimiento{ border-color:var(--accent-border); border-left-color:var(--accent); background:var(--accent-bg); } body.clinical-workspace .piaDashZonaHead{ font-size:14px; font-weight:800; letter-spacing:.02em; margin:0 0 12px; } body.clinical-workspace .piaDeudaFila{ display:flex; align-items:center; justify-content:space-between; padding:9px 2px; border-bottom:1px solid var(--border-soft); border-radius:8px; transition:background 140ms ease; } body.clinical-workspace .piaDeudaFila:hover{ background:var(--coral-bg); } body.clinical-workspace .piaDeudaFila:last-child{ border-bottom:none; } body.clinical-workspace .piaDeudaFila .piaMonto{ font-family:var(--font-mono); font-weight:700; color:var(--coral); font-size:13px; } body.clinical-workspace .piaSinCitaGrid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(230px,1fr)); gap:11px; } body.clinical-workspace .piaSinCitaCard{ display:flex; align-items:center; gap:11px; padding:13px 14px; border-radius:13px; border:1.5px solid var(--border-soft); background:linear-gradient(165deg, var(--card), var(--card-tint)); position:relative; overflow:hidden; transition:transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease; } body.clinical-workspace .piaSinCitaCard:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); border-color:var(--amber-border); } body.clinical-workspace .piaSinCitaCard .piaAvatar{ background:linear-gradient(155deg, #D9B87C, var(--amber)); box-shadow:0 3px 8px -2px rgba(140,90,23,0.45); } body.clinical-workspace .piaSinCitaInfo{ flex:1; min-width:0; transition:margin-right 180ms ease; } body.clinical-workspace .piaSinCitaInfo p{ margin:0; } body.clinical-workspace .piaSinCitaInfo .piaNombreChico{ font-size:12.5px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } body.clinical-workspace .piaSinCitaInfo .piaDesde{ font-size:11px; color:var(--text-secondary); margin-top:2px; } body.clinical-workspace .piaSinCitaAcciones{ position:absolute; right:-80px; top:50%; transform:translateY(-50%); display:flex; gap:6px; transition:right 200ms ease; } body.clinical-workspace .piaSinCitaCard:hover .piaSinCitaAcciones{ right:12px; } body.clinical-workspace .piaSinCitaCard:hover .piaSinCitaInfo{ margin-right:66px; } body.clinical-workspace .piaAccionMini{ width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:13px; box-shadow:0 4px 10px -2px rgba(0,0,0,0.3); cursor:pointer; flex-shrink:0; border:none; padding:0; } body.clinical-workspace .piaAccionMini.piaSage{ background:var(--sage); } body.clinical-workspace .piaAccionMini.piaAccentBtn{ background:var(--accent); } body.clinical-workspace .piaCumpleChip{ display:inline-flex; align-items:center; gap:8px; background:var(--amber-bg); border:1.5px solid var(--amber-border); color:var(--amber); border-radius:22px; padding:7px 7px 7px 13px; font-size:12.5px; font-weight:600; margin:0 8px 8px 0; cursor:pointer; transition:transform 160ms ease, box-shadow 160ms ease; } body.clinical-workspace .piaCumpleChip:hover{ transform:translateY(-2px); box-shadow:0 8px 16px -6px rgba(140,90,23,0.4); } body.clinical-workspace .piaBtnFlyer{ background:var(--amber); color:#fff; border-radius:50%; width:23px; height:23px; display:flex; align-items:center; justify-content:center; font-size:12px; border:none; cursor:pointer; padding:0; } @media (prefers-reduced-motion: reduce){body.clinical-workspace *{ transition-duration:0.001ms !important; animation-duration:0.001ms !important; }} @keyframes piaFadeUp{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:translateY(0); } } @keyframes piaFadeIn{ from{ opacity:0; transform:scale(0.97); } to{ opacity:1; transform:scale(1); } } @media (max-width: 768px){body.clinical-workspace{ padding:0.75rem 0.5rem; } body.clinical-workspace #app{ max-width:100%; } body.clinical-workspace .card{ padding:0.9rem 1rem; } body.clinical-workspace input,body.clinical-workspace select,body.clinical-workspace button{ font-size:15px; padding:10px 12px; } body.clinical-workspace .topNavHeader{ flex-direction:column; align-items:stretch !important; } body.clinical-workspace .topNavButtons{ width:100%; overflow-x:auto; flex-wrap:nowrap !important; padding-bottom:4px; } body.clinical-workspace .topNavButtons button{ flex-shrink:0; white-space:nowrap; } body.clinical-workspace .brandHeader img{ height:48px; } body.clinical-workspace .appShell{ grid-template-columns:minmax(0,1fr) !important; } body.clinical-workspace .volverListaBtn{ display:inline-flex !important; } body.clinical-workspace .globalSearchBarWrap{ padding:10px 10px 14px; } body.clinical-workspace .piaSinCitaAcciones{ position:static !important; transform:none !important; margin-left:auto; } body.clinical-workspace .piaDientesGrid16{ grid-template-columns:repeat(16, 38px) !important; overflow-x:auto; padding-bottom:6px; -webkit-overflow-scrolling:touch; } body.clinical-workspace .piaDashStatsRow{ grid-template-columns:repeat(2,1fr) !important; gap:10px; } body.clinical-workspace .piaStatCard{ padding:12px 10px !important; } body.clinical-workspace .piaStatCard .piaStatVal{ font-size:17px !important; } body.clinical-workspace .globalSearchBar{ flex-wrap:wrap; padding:12px 14px; } body.clinical-workspace .globalSearchBar .searchLabel{ flex:1 1 100%; margin-bottom:2px; } body.clinical-workspace .globalSearchBar input{ max-width:none !important; flex:1 1 100%; } body.clinical-workspace .globalSearchBar button{ flex:1 1 100%; } body.clinical-workspace .doctorColGrid{ display:flex !important; overflow-x:auto; gap:8px; padding-bottom:6px; scroll-snap-type:x proximity; } body.clinical-workspace .doctorColGrid .doctorCol{ flex:0 0 220px; scroll-snap-align:start; } body.clinical-workspace .semDayBlock{ width:290px !important; } body.clinical-workspace .semDayBlock.semDayEstrecho{ width:290px !important; } body.clinical-workspace .semColGrid.semCols4{ width:370px; } body.clinical-workspace .semColGrid.semCols5{ width:450px; }} body.clinical-workspace .gastoRapidoFab{ display:none; } body.clinical-workspace .volverListaBtn{ display:none; } body.clinical-workspace .globalSearchBarWrap{ display:flex; justify-content:center; background:var(--gray-bg); padding:14px 22px 20px; border-bottom:1px solid var(--border-soft); } body.clinical-workspace .globalSearchBar{ position: relative; display:flex; align-items:center; gap:12px; width:100%; max-width:640px; background: linear-gradient(180deg, var(--card-tint), var(--card)); border:3px solid var(--accent); border-radius:16px; padding:12px 18px; box-shadow: var(--shadow-md); } body.clinical-workspace .globalSearchBar .searchLabel{ font-family:var(--font-display); font-weight:700; font-size:13px; color:var(--accent-deep); display:flex; align-items:center; gap:5px; white-space:nowrap; } body.clinical-workspace .globalSearchBar input{ max-width:none; flex:1; margin:0; border-color:var(--accent-border); background:var(--card); font-family:var(--font-body); } body.clinical-workspace .globalSearchBar input:focus{ border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-bg); } body.clinical-workspace .globalSearchBar button{ white-space:nowrap; } body.clinical-workspace #patientList{ position:absolute; top:calc(100% + 6px); left:0; right:0; max-width:none; background:var(--card); border:2px solid var(--accent-border); border-radius:12px; box-shadow: var(--shadow-md); max-height:min(62vh,560px); overflow-y:auto; overscroll-behavior:contain; z-index:120; padding:6px; display:none; } body.clinical-workspace #patientList.piaMostrarLista{ display:block; } body.clinical-workspace .piaCinemaHome.piaBuscandoPacientes{ overflow:visible!important; z-index:90!important; } body.clinical-workspace .piaSearchOverMenu{position:relative;z-index:7;width:100%;display:flex;justify-content:center} body.clinical-workspace .piaSearchOverMenu .globalSearchBar{max-width:760px;min-height:58px} @media (min-width:769px){body.clinical-workspace .piaCinemaHome .piaSearchOverMenu{ position:absolute; left:50%; transform:translateX(-50%); bottom:248px; width:min(760px,calc(100% - 44px)); z-index:8; } body.clinical-workspace .piaCinemaHome .piaSearchOverMenu .globalSearchBar{ background:rgba(250,248,243,.96); box-shadow:0 12px 28px rgba(0,0,0,.28); }} @media (max-width:768px){body.clinical-workspace .piaCinemaHome .piaSearchOverMenu{margin:12px 0 8px}} /* ===== PORTADA CINEMATOGRÁFICA V3 ===== Solo capa visual. Conserva IDs, botones, eventos, estructura y logo existentes. */ .clinical-workspace .brand-panel{ position:relative!important; display:block!important; min-height:650px; padding:16px 24px 18px!important; overflow:hidden; isolation:isolate; border:1px solid rgba(214,177,109,.48)!important; border-radius:24px!important; background: linear-gradient(180deg, rgba(8,10,10,.08) 0%, rgba(8,10,10,.10) 31%, rgba(8,10,10,.23) 45%, rgba(8,10,10,.52) 61%, rgba(5,8,9,.91) 100%), linear-gradient(90deg, rgba(4,7,8,.40) 0%, rgba(4,7,8,.08) 28%, rgba(4,7,8,.02) 68%, rgba(4,7,8,.18) 100%), url("./clinical-menu-202610090001.png") center 50% / cover no-repeat!important; box-shadow: 0 28px 78px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.12)!important; } .clinical-workspace .brand-panel::before{ content:""!important; position:absolute!important; inset:0!important; z-index:-1!important; pointer-events:none; background: radial-gradient(740px 300px at 13% 10%,rgba(229,190,113,.16),transparent 68%), linear-gradient(180deg,transparent 54%,rgba(4,7,9,.34) 75%,rgba(4,7,9,.70) 100%)!important; } .clinical-workspace .brand-panel::after{ content:""!important; position:absolute!important; left:4%; right:4%; bottom:0; height:1px!important; pointer-events:none; background:linear-gradient(90deg,transparent,rgba(226,188,113,.88),transparent)!important; } .clinical-workspace .brand-panel > div:first-child{ position:relative; z-index:3; max-width:710px; padding:2px 8px 0; } .clinical-workspace .brand-panel .brandHeader{ align-items:center!important; filter:drop-shadow(0 4px 14px rgba(0,0,0,.65)); } .clinical-workspace .brand-panel .brandHeader img{ height:76px!important; width:auto!important; max-width:200px; object-fit:contain; } .clinical-workspace .brand-panel .piaBrandText h2{ color:#FFF9EE!important; font-size:clamp(30px,3.1vw,46px)!important; line-height:1.06!important; text-shadow:0 4px 20px rgba(0,0,0,.86)!important; } .clinical-workspace .brand-panel .piaFraseNav{ color:#F5EFE5!important; font-size:13px!important; max-width:600px; text-shadow:0 2px 12px rgba(0,0,0,.95)!important; } .clinical-workspace .brand-panel .navPill{ color:#F8F1E6!important; background:rgba(8,11,12,.52)!important; border:1px solid rgba(223,187,116,.42)!important; backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); } /* Los botones pasan a ser el protagonista, como en la referencia aprobada. */ .clinical-workspace .brand-panel .navCardGrid{ position:relative; z-index:4; grid-template-columns:repeat(6,minmax(0,1fr))!important; gap:14px!important; margin-top:165px!important; padding:0!important; background:transparent!important; border:0!important; box-shadow:none!important; backdrop-filter:none!important; } .clinical-workspace .brand-panel .navCard{ min-height:124px!important; padding:14px 10px 12px!important; gap:12px!important; border-radius:18px!important; color:#FFF9EF!important; background: linear-gradient(160deg,rgba(16,19,18,.64),rgba(5,9,10,.86))!important; border:1px solid rgba(225,187,113,.68)!important; backdrop-filter:blur(11px) saturate(110%)!important; -webkit-backdrop-filter:blur(11px) saturate(110%)!important; box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 14px 32px rgba(0,0,0,.38)!important; } .clinical-workspace .brand-panel .navCard .navCardIcoWrap{ width:42px!important; height:42px!important; border-radius:16px!important; background:linear-gradient(145deg,rgba(225,185,108,.17),rgba(255,255,255,.035))!important; border:1px solid rgba(226,190,119,.50)!important; box-shadow: inset 0 1px 0 rgba(255,255,255,.13), 0 8px 20px rgba(0,0,0,.22)!important; } .clinical-workspace .brand-panel .navCard svg{ width:22px!important; height:22px!important; stroke:#E8C787!important; stroke-width:1.7!important; } .clinical-workspace .brand-panel .navCard .navCardLbl{ font-size:14px!important; font-weight:700!important; letter-spacing:.005em; text-shadow:0 2px 9px rgba(0,0,0,.90); } .clinical-workspace .brand-panel .navCard:hover, .clinical-workspace .brand-panel .navCard:focus-visible{ transform:perspective(900px) translateY(-7px) scale(1.025)!important; border-color:#F0C871!important; background:linear-gradient(160deg,rgba(36,33,26,.74),rgba(6,10,11,.90))!important; box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 22px 44px rgba(0,0,0,.48), 0 0 30px rgba(224,180,96,.20)!important; } .clinical-workspace .brand-panel .navCard.navCardActive{ border-color:#F2C567!important; box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 0 0 1px rgba(242,197,103,.28), 0 0 30px rgba(234,185,88,.28), 0 20px 40px rgba(0,0,0,.48)!important; } .clinical-workspace .brand-panel .navCard.navCardActive .navCardIcoWrap{ background:linear-gradient(145deg,rgba(238,192,101,.26),rgba(255,255,255,.045))!important; border-color:#F2C567!important; } /* Segunda fila algo más compacta para mantener la composición de la referencia. */ .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7){ min-height:104px!important; padding-top:12px!important; padding-bottom:10px!important; } .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7) .navCardIcoWrap{ width:48px!important; height:48px!important; } .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7) svg{ width:25px!important; height:25px!important; } @media (max-width:1200px){ .clinical-workspace .brand-panel{min-height:690px} .clinical-workspace .brand-panel .navCardGrid{ grid-template-columns:repeat(4,minmax(0,1fr))!important; margin-top:150px!important; } } @media (max-width:768px){ .clinical-workspace .brand-panel{ min-height:auto; padding:15px 10px 18px!important; border-radius:18px!important; background: linear-gradient(180deg,rgba(5,8,9,.12),rgba(5,8,9,.17) 30%,rgba(5,8,9,.52) 56%,rgba(5,8,9,.94) 100%), url("./clinical-menu-202610090001.png") center center / cover no-repeat!important; } .clinical-workspace .brand-panel > div:first-child{padding:2px 4px 0} .clinical-workspace .brand-panel .brandHeader img{height:58px!important;max-width:150px} .clinical-workspace .brand-panel .piaBrandText h2{font-size:25px!important} .clinical-workspace .brand-panel .piaFraseNav{font-size:12.5px!important} .clinical-workspace .brand-panel .navCardGrid{ grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:10px!important; margin-top:185px!important; } .clinical-workspace .brand-panel .navCard, .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7){ min-height:112px!important; padding:13px 8px!important; border-radius:15px!important; } .clinical-workspace .brand-panel .navCard .navCardIcoWrap, .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7) .navCardIcoWrap{ width:44px!important; height:44px!important; } .clinical-workspace .brand-panel .navCard svg, .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7) svg{ width:23px!important; height:23px!important; } } @media (max-width:430px){ .clinical-workspace .brand-panel .navCardGrid{margin-top:205px!important} } /* ===== COMPACTACIÓN POR ALTURA DE PANTALLA ===== Objetivo: que las DOS filas completas del menú entren en una sola pantalla de laptop. */ @media (min-width:769px) and (max-height:900px){ .clinical-workspace .brand-panel{ min-height:575px!important; padding:10px 20px 12px!important; border-radius:20px!important; } .clinical-workspace .brand-panel > div:first-child{ padding:0 6px!important; max-width:650px!important; } .clinical-workspace .brand-panel .brandHeader img{ height:58px!important; max-width:160px!important; } .clinical-workspace .brand-panel .piaBrandText h2{ font-size:34px!important; line-height:1!important; margin:0!important; } .clinical-workspace .brand-panel .piaFraseNav{ font-size:12px!important; margin-top:3px!important; line-height:1.25!important; } .clinical-workspace .brand-panel .navPill{ padding:6px 10px!important; font-size:12px!important; } .clinical-workspace .brand-panel .navCardGrid{ margin-top:78px!important; gap:9px!important; grid-template-columns:repeat(6,minmax(0,1fr))!important; } .clinical-workspace .brand-panel .navCard{ min-height:94px!important; padding:9px 7px 8px!important; gap:7px!important; border-radius:14px!important; } .clinical-workspace .brand-panel .navCard .navCardIcoWrap{ width:38px!important; height:38px!important; border-radius:11px!important; } .clinical-workspace .brand-panel .navCard svg{ width:20px!important; height:20px!important; } .clinical-workspace .brand-panel .navCard .navCardLbl{ font-size:12px!important; line-height:1.05!important; } .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7){ min-height:82px!important; padding:8px 7px!important; } .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7) .navCardIcoWrap{ width:34px!important; height:34px!important; } .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7) svg{ width:18px!important; height:18px!important; } } /* Laptop aún más baja: 1366x768, 1440x810, etc. */ @media (min-width:769px) and (max-height:780px){ .clinical-workspace .brand-panel{ min-height:520px!important; padding:8px 18px 10px!important; } .clinical-workspace .brand-panel .brandHeader img{ height:50px!important; } .clinical-workspace .brand-panel .piaBrandText h2{ font-size:30px!important; } .clinical-workspace .brand-panel .piaFraseNav{ font-size:11px!important; } .clinical-workspace .brand-panel .navCardGrid{ margin-top:52px!important; gap:8px!important; } .clinical-workspace .brand-panel .navCard{ min-height:84px!important; padding:7px 6px!important; gap:5px!important; } .clinical-workspace .brand-panel .navCard .navCardIcoWrap{ width:34px!important; height:34px!important; } .clinical-workspace .brand-panel .navCard svg{ width:18px!important; height:18px!important; } .clinical-workspace .brand-panel .navCard .navCardLbl{ font-size:11.5px!important; } .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7){ min-height:74px!important; padding:6px 6px!important; } .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7) .navCardIcoWrap{ width:30px!important; height:30px!important; } .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7) svg{ width:16px!important; height:16px!important; } } /* ===== MENÚ ANCLADO ABAJO — V4 ===== Solo disposición visual; no altera HTML funcional, IDs ni eventos. */ @media (min-width:769px){ .clinical-workspace .brand-panel{ height:calc(100vh - 86px)!important; min-height:560px!important; max-height:760px!important; box-sizing:border-box!important; padding:12px 22px 14px!important; } .clinical-workspace .brand-panel .navCardGrid{ position:absolute!important; left:22px!important; right:22px!important; bottom:18px!important; margin:0!important; width:auto!important; grid-template-columns:repeat(6,minmax(0,1fr))!important; gap:9px!important; align-content:end!important; } .clinical-workspace .brand-panel .navCard{ min-height:92px!important; padding:8px 7px!important; gap:6px!important; } .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7){ min-height:76px!important; padding:6px 7px!important; } .clinical-workspace .brand-panel .navCard .navCardIcoWrap{ width:36px!important; height:36px!important; } .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7) .navCardIcoWrap{ width:31px!important; height:31px!important; } .clinical-workspace .brand-panel .navCard svg{ width:19px!important; height:19px!important; } .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7) svg{ width:16px!important; height:16px!important; } .clinical-workspace .brand-panel .navCard .navCardLbl{ font-size:11.5px!important; line-height:1.05!important; } } /* Pantallas de laptop con poca altura: conserva espacio para ver la clínica y mantiene ambas filas completas pegadas al borde inferior. */ @media (min-width:769px) and (max-height:800px){ .clinical-workspace .brand-panel{ height:calc(100vh - 62px)!important; min-height:510px!important; padding-top:8px!important; } .clinical-workspace .brand-panel .brandHeader img{ height:48px!important; } .clinical-workspace .brand-panel .piaBrandText h2{ font-size:29px!important; } .clinical-workspace .brand-panel .piaFraseNav{ font-size:11px!important; } .clinical-workspace .brand-panel .navCardGrid{ left:18px!important; right:18px!important; bottom:12px!important; gap:7px!important; } .clinical-workspace .brand-panel .navCard{ min-height:80px!important; padding:6px!important; } .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7){ min-height:68px!important; padding:5px 6px!important; } .clinical-workspace .brand-panel .navCard .navCardIcoWrap{ width:31px!important; height:31px!important; } .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7) .navCardIcoWrap{ width:27px!important; height:27px!important; } .clinical-workspace .brand-panel .navCard svg{ width:16px!important; height:16px!important; } .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7) svg{ width:14px!important; height:14px!important; } .clinical-workspace .brand-panel .navCard .navCardLbl{ font-size:10.8px!important; } } /* ===== PORTADA MÓVIL V5 ===== Diseño propio para celular: hero corto + menú compacto 3 columnas. */ @media (max-width:768px){ .clinical-workspace .brand-panel{ position:relative!important; height:auto!important; min-height:0!important; max-height:none!important; padding:8px 8px 10px!important; border-radius:16px!important; overflow:hidden!important; background-position:center top!important; background-size:auto 285px!important; background-repeat:no-repeat!important; background-color:#071014!important; } .clinical-workspace .brand-panel > div:first-child{ position:relative!important; z-index:3!important; min-height:150px!important; max-width:none!important; padding:2px 4px 0!important; } .clinical-workspace .brand-panel .brandHeader{ gap:8px!important; align-items:flex-start!important; } .clinical-workspace .brand-panel .brandHeader img{ height:42px!important; max-width:118px!important; } .clinical-workspace .brand-panel .piaBrandText h2{ font-size:21px!important; line-height:1.02!important; margin:0!important; } .clinical-workspace .brand-panel .piaFraseNav{ font-size:10.5px!important; line-height:1.22!important; margin-top:3px!important; max-width:92%!important; } .clinical-workspace .brand-panel .navPill{ padding:4px 7px!important; font-size:10px!important; border-radius:10px!important; } .clinical-workspace .brand-panel .navCardGrid{ position:relative!important; left:auto!important; right:auto!important; bottom:auto!important; width:100%!important; margin:2px 0 0!important; padding:7px!important; display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:7px!important; border-radius:14px!important; background:linear-gradient(180deg,rgba(4,9,12,.52),rgba(4,9,12,.92))!important; border:1px solid rgba(226,193,128,.16)!important; backdrop-filter:blur(8px)!important; -webkit-backdrop-filter:blur(8px)!important; } .clinical-workspace .brand-panel .navCard, .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7){ min-height:78px!important; height:78px!important; padding:7px 4px 6px!important; gap:5px!important; border-radius:12px!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; } .clinical-workspace .brand-panel .navCard .navCardIcoWrap, .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7) .navCardIcoWrap{ width:31px!important; height:31px!important; min-width:31px!important; min-height:31px!important; border-radius:9px!important; } .clinical-workspace .brand-panel .navCard svg, .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7) svg{ width:16px!important; height:16px!important; } .clinical-workspace .brand-panel .navCard .navCardLbl{ font-size:10.3px!important; line-height:1.05!important; text-align:center!important; white-space:normal!important; overflow:visible!important; text-overflow:clip!important; max-width:100%!important; } .clinical-workspace .brand-panel .navCard:hover, .clinical-workspace .brand-panel .navCard:focus-visible{ transform:none!important; } } /* Teléfonos angostos: mantiene 3 columnas, pero todavía más compacto. */ @media (max-width:390px){ .clinical-workspace .brand-panel{ background-size:auto 260px!important; } .clinical-workspace .brand-panel > div:first-child{ min-height:138px!important; } .clinical-workspace .brand-panel .piaBrandText h2{ font-size:19px!important; } .clinical-workspace .brand-panel .piaFraseNav{ font-size:9.8px!important; } .clinical-workspace .brand-panel .navCardGrid{ gap:6px!important; padding:6px!important; } .clinical-workspace .brand-panel .navCard, .clinical-workspace .brand-panel .navCardGrid .navCard:nth-child(n+7){ min-height:72px!important; height:72px!important; } .clinical-workspace .brand-panel .navCard .navCardLbl{ font-size:9.6px!important; } }