/* Fuentes locales (2026-10-06): antes se cargaban desde Google Fonts, lo que dejaba la app con
   tipografía de reemplazo cuando no hay internet (p. ej. presentando en una laptop sin conexión). */
@font-face{font-family:'Fraunces';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/fraunces-latin-500.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/fraunces-latin-ext-500.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/fraunces-latin-600.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/fraunces-latin-ext-600.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/fraunces-latin-700.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/fraunces-latin-ext-700.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/public-sans-latin-400.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/public-sans-latin-ext-400.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/public-sans-latin-500.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/public-sans-latin-ext-500.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/public-sans-latin-600.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/public-sans-latin-ext-600.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/public-sans-latin-700.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/public-sans-latin-ext-700.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/ibm-plex-mono-latin-400.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/ibm-plex-mono-latin-ext-400.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/ibm-plex-mono-latin-500.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/ibm-plex-mono-latin-ext-500.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/ibm-plex-mono-latin-600.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/ibm-plex-mono-latin-ext-600.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}

:root{
  --canvas:#eef1ea; --surface:#ffffff; --surface-2:#e4e8de;
  --ink:#16241f; --ink-soft:#4b564e; --ink-faint:#7c8579; --line:#d6dccc;
  --forest:#24594a; --forest-light:#3f7f6c; --forest-wash:#e2ede7;
  --ochre:#a5762b; --ochre-wash:#f4e9d4; --clay:#9c4a3c; --clay-wash:#f4e0dc;
  --shadow: 0 1px 2px rgba(22,36,31,.06), 0 8px 24px -12px rgba(22,36,31,.18);
  --radius: 10px;
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark){
  :root{
    --canvas:#111712; --surface:#171f1a; --surface-2:#1e2820;
    --ink:#e9ede5; --ink-soft:#a9b3a2; --ink-faint:#7c8779; --line:#2b342c;
    --forest:#72b79c; --forest-light:#8fcab3; --forest-wash:#1c2c26;
    --ochre:#d9ac5e; --ochre-wash:#2c2417; --clay:#dd9686; --clay-wash:#2e1e1a;
    --shadow: 0 1px 2px rgba(0,0,0,.3), 0 8px 24px -12px rgba(0,0,0,.5);
  }
}
*{ box-sizing:border-box; }
html,body{ height:100%; }
body{ margin:0; background:var(--canvas); color:var(--ink); font-family:'Public Sans',system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
h1,h2,h3{ font-family:'Fraunces',Georgia,serif; text-wrap:balance; }
.mono{ font-family:'IBM Plex Mono',monospace; font-variant-numeric:tabular-nums; }
a{ color:var(--forest); }
button{ font-family:inherit; }

/* ---- login ---- */
.login-wrap{ min-height:100vh; display:flex; align-items:center; justify-content:center; padding:32px 20px; }
.login-card{ width:100%; max-width:400px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); padding:32px; }
.login-brand{ display:flex; align-items:center; gap:9px; margin-bottom:22px; }
.login-brand .mark{ width:32px; height:32px; border-radius:8px; background:var(--forest); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-family:'Fraunces',serif; }
.login-brand .nm{ font-family:'Fraunces',serif; font-weight:600; font-size:18px; }
.login-card h1{ font-size:21px; font-weight:600; margin:0 0 4px; }
.login-sub{ color:var(--ink-soft); font-size:13.5px; margin-bottom:22px; }
.field{ display:flex; flex-direction:column; gap:5px; margin-bottom:14px; }
.field label{ font-size:11.5px; font-weight:600; color:var(--ink-soft); text-transform:uppercase; letter-spacing:.03em; }
.field input, .field select, .field textarea{ border:1px solid var(--line); border-radius:7px; padding:10px 11px; font-size:14px; background:var(--surface); color:var(--ink); font-family:inherit; }
.field.span2{ grid-column:span 2; }
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:6px; border:1px solid var(--line); background:var(--surface); color:var(--ink); border-radius:8px; padding:9px 16px; font-size:13.5px; font-weight:600; cursor:pointer; }
.btn:hover{ border-color:var(--forest); }
.btn.primary{ background:var(--forest); border-color:var(--forest); color:#fff; }
.btn.primary:hover{ background:var(--forest-light); border-color:var(--forest-light); }
.btn.block{ width:100%; padding:11px; }
.btn.sm{ padding:5px 10px; font-size:12.5px; }
.btn[disabled]{ opacity:.5; cursor:not-allowed; }
.login-error{ background:var(--clay-wash); color:var(--clay); border-radius:8px; padding:9px 12px; font-size:13px; margin-bottom:14px; }
.login-switch{ text-align:center; font-size:13.5px; margin-top:16px; color:var(--ink-soft); }
.demo-hint{ margin-top:18px; font-size:11.5px; color:var(--ink-faint); background:var(--surface-2); border-radius:8px; padding:10px 12px; line-height:1.5; }

/* ---- app shell ---- */
.shell{ display:grid; grid-template-columns:240px 1fr; min-height:100vh; }
.sidebar{ background:var(--surface); border-right:1px solid var(--line); display:flex; flex-direction:column; padding:20px 14px; gap:4px; position:sticky; top:0; height:100vh; }
.brand{ padding:4px 10px 18px; display:flex; align-items:center; gap:9px; cursor:pointer; border-radius:8px; }
.brand:hover{ background:var(--surface-2); }
.brand .logo-img{ height:28px; width:auto; max-width:72px; border-radius:5px; object-fit:contain; flex-shrink:0; }
.brand .mark{ width:26px; height:26px; border-radius:7px; background:var(--forest); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:12px; font-family:'Fraunces',serif; }
.brand .name{ font-family:'Fraunces',serif; font-weight:600; font-size:17px; line-height:1.1; }
.nav-item{ display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:8px; color:var(--ink-soft); font-size:14px; font-weight:500; cursor:pointer; border:none; background:none; text-align:left; width:100%; }
.nav-item:hover{ background:var(--surface-2); color:var(--ink); }
.nav-item.active{ background:var(--forest-wash); color:var(--forest); font-weight:600; }
.nav-item .ic{ width:17px; text-align:center; font-size:14px; }
.nav-spacer{ flex:1; }
.who{ border-top:1px solid var(--line); padding-top:12px; margin-top:8px; }
.who .nm{ font-weight:600; font-size:13.5px; }
.who .rl{ font-size:11.5px; color:var(--ink-faint); }
.who .lnk{ font-size:11.5px; margin-top:6px; display:inline-block; cursor:pointer; color:var(--forest); margin-right:10px; }

.main{ padding:26px 34px 60px; max-width:1180px; }
.topbar{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:22px; flex-wrap:wrap; gap:10px; }
.topbar h1{ font-size:26px; font-weight:600; margin:0; }
.topbar .meta{ color:var(--ink-faint); font-size:13px; }

.banner{ background:var(--forest-wash); border:1px solid color-mix(in srgb, var(--forest) 30%, transparent); color:var(--ink); border-radius:var(--radius); padding:12px 14px; font-size:13.5px; margin-bottom:18px; line-height:1.5; }
.banner.warn{ background:var(--ochre-wash); border-color: color-mix(in srgb, var(--ochre) 35%, transparent); }

.cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:14px; margin-bottom:26px; }
.card{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:16px; box-shadow:var(--shadow); }
.card .lbl{ font-size:12px; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em; font-weight:600; }
.card .val{ font-family:'IBM Plex Mono'; font-size:26px; font-weight:600; margin-top:6px; font-variant-numeric:tabular-nums; }
.card .sub{ font-size:12.5px; color:var(--ink-soft); margin-top:3px; }

.section-t{ font-size:12px; text-transform:uppercase; letter-spacing:.06em; font-weight:700; color:var(--ink-faint); margin:0 0 10px 2px; }
.panel{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); margin-bottom:20px; }
.panel-h{ display:flex; align-items:center; justify-content:space-between; padding:14px 16px; border-bottom:1px solid var(--line); gap:10px; flex-wrap:wrap; }
.panel-h h2{ font-size:17px; margin:0; font-weight:600; }
.panel-body{ padding:16px; }
.panel-body.tight{ padding:0; }

table{ width:100%; border-collapse:collapse; font-size:13.5px; }
th{ text-align:left; font-size:11.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-faint); font-weight:600; padding:10px 14px; border-bottom:1px solid var(--line); }
td{ padding:11px 14px; border-bottom:1px solid var(--line); vertical-align:middle; }
tr:last-child td{ border-bottom:none; }
tr.clickable{ cursor:pointer; }
tr.clickable:hover{ background:var(--surface-2); }
.tbl-wrap{ overflow-x:auto; }
td.num, th.num{ text-align:right; font-family:'IBM Plex Mono'; font-variant-numeric:tabular-nums; }

.badge{ display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:600; padding:3px 9px; border-radius:99px; white-space:nowrap; }
.badge.green{ background:var(--forest-wash); color:var(--forest); }
.badge.ochre{ background:var(--ochre-wash); color:var(--ochre); }
.badge.clay{ background:var(--clay-wash); color:var(--clay); }
.badge.grey{ background:var(--surface-2); color:var(--ink-soft); }

.tabs{ display:flex; gap:4px; border-bottom:1px solid var(--line); margin-bottom:18px; flex-wrap:wrap; }
.tab{ padding:9px 14px; font-size:13.5px; font-weight:600; color:var(--ink-faint); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-1px; }
.tab.active{ color:var(--forest); border-color:var(--forest); }

form.inline{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:12px; padding:16px; background:var(--surface-2); border-radius:var(--radius); margin-bottom:16px; }
form.inline .field.span2{ grid-column:span 2; }
form.inline .actions{ grid-column:1/-1; display:flex; gap:8px; margin-top:2px; }

.empty{ padding:34px 16px; text-align:center; color:var(--ink-faint); font-size:14px; }
.stat-row{ display:flex; gap:22px; flex-wrap:wrap; margin-bottom:18px; }
.stat-row .stat .n{ font-family:'IBM Plex Mono'; font-size:20px; font-weight:600; }
.stat-row .stat .l{ font-size:12px; color:var(--ink-faint); }

.detail-back{ font-size:13px; color:var(--forest); cursor:pointer; display:inline-flex; align-items:center; gap:5px; margin-bottom:14px; }
.kv{ display:grid; grid-template-columns:150px 1fr; gap:8px 14px; font-size:13.5px; }
.kv dt{ color:var(--ink-faint); }
.kv dd{ margin:0; }
.note{ font-size:12.5px; color:var(--ink-faint); margin-top:6px; }
.toast{ position:fixed; bottom:20px; right:20px; background:var(--ink); color:var(--canvas); padding:11px 16px; border-radius:8px; font-size:13.5px; box-shadow:var(--shadow); z-index:50; }

/* ---- modal ---- */
.modal-overlay{ position:fixed; inset:0; background:rgba(22,36,31,.45); display:flex; align-items:center; justify-content:center; padding:20px; z-index:100; }
.modal{ width:100%; max-width:520px; max-height:90vh; overflow-y:auto; background:var(--surface); border-radius:var(--radius); box-shadow:var(--shadow); }
.modal-h{ display:flex; align-items:flex-start; justify-content:space-between; padding:16px 20px; border-bottom:1px solid var(--line); gap:10px; }
.modal-h h3{ font-size:17px; margin:0 0 3px; font-weight:600; }
.modal-h .sub{ font-size:12.5px; color:var(--ink-faint); }
.modal-close{ background:none; border:none; color:var(--ink-faint); font-size:20px; line-height:1; cursor:pointer; padding:2px 4px; }
.modal-close:hover{ color:var(--ink); }
.modal-body{ padding:18px 20px; }
.modal-body .field textarea{ resize:vertical; min-height:120px; line-height:1.5; }
.modal-foot{ display:flex; justify-content:flex-end; gap:8px; padding:14px 20px; border-top:1px solid var(--line); }
.modal-locked{ background:var(--surface-2); border-radius:8px; padding:10px 12px; font-size:13px; color:var(--ink-soft); margin-bottom:14px; }
.evid-current{ display:flex; align-items:center; gap:8px; font-size:13px; background:var(--surface-2); border-radius:8px; padding:8px 10px; margin-bottom:8px; }
.evid-current a{ font-weight:600; }

/* ---- timesheet grid ---- */
.ts-week-nav{ display:flex; align-items:center; gap:10px; margin-bottom:16px; flex-wrap:wrap; }
.ts-week-nav .lbl{ font-weight:600; font-size:14.5px; }
.ts-status-pill{ display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:600; padding:5px 12px; border-radius:99px; }
.ts-status-pill.aprobado{ background:var(--forest-wash); color:var(--forest); }
.ts-status-pill.enviar{ background:var(--clay-wash); color:var(--clay); }
.ts-status-pill.sometido{ background:var(--forest-wash); color:var(--forest); }
.ts-table{ min-width:900px; }
.ts-table th, .ts-table td{ font-size:12.5px; padding:9px 8px; }
.ts-table th.day, .ts-table td.day{ text-align:center; min-width:52px; }
.ts-table td.day-cell{ cursor:pointer; text-align:center; border-radius:6px; }
.ts-table td.day-cell:hover{ background:var(--surface-2); }
.ts-table td.day-cell.filled{ background:var(--forest-wash); color:var(--forest); font-weight:700; }
.ts-table td.day-cell.aprobado{ background:var(--forest-wash); color:var(--forest); font-weight:700; }
.ts-table td.day-cell.rechazado{ background:var(--clay-wash); color:var(--clay); font-weight:700; }
.ts-table td.day-cell.pendiente{ background:var(--ochre-wash); color:var(--ochre); font-weight:700; }
.ts-table td.day-cell .ev{ font-size:9px; display:block; margin-top:1px; }
.ts-table td.day-cell.locked{ cursor:not-allowed; opacity:.75; }
.ts-table tr.ts-totals td{ background:var(--ochre-wash); font-weight:700; border-top:2px solid var(--ochre); border-bottom:2px solid var(--ochre); }
.ts-day-head{ display:flex; flex-direction:column; align-items:center; line-height:1.2; }
.ts-day-head .n{ font-family:'IBM Plex Mono'; font-size:13px; }
.ts-actions-row{ display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:18px; flex-wrap:wrap; }
.ts-deadline-note{ font-size:12.5px; color:var(--ink-faint); }
.ts-table td.day-cell.devuelto{ background:var(--clay-wash); color:var(--clay); font-weight:700; }
.modal-locked.devuelto{ background:var(--clay-wash); color:var(--clay); }

/* ---- notificaciones ---- */
.notif-bell-wrap{ position:relative; margin:0 10px 10px; }
.notif-bell{ position:relative; width:100%; text-align:left; background:none; border:1px solid var(--line); border-radius:8px; padding:8px 10px; font-size:14px; cursor:pointer; color:var(--ink-soft); }
.notif-bell:hover{ background:var(--surface-2); }
.notif-count{ position:absolute; top:4px; left:26px; background:var(--clay); color:#fff; font-size:10px; font-weight:700; border-radius:99px; padding:1px 6px; }
.notif-panel{ position:absolute; top:calc(100% + 6px); left:0; width:320px; max-width:80vw; background:var(--surface); border:1px solid var(--line); border-radius:10px; box-shadow:var(--shadow); z-index:40; overflow:hidden; }
.notif-panel-h{ padding:10px 14px; font-weight:600; font-size:13px; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; }
.notif-panel-h .lnk{ font-weight:500; font-size:11.5px; color:var(--forest); cursor:pointer; }
.notif-list{ max-height:360px; overflow-y:auto; }
.notif-item{ padding:10px 14px; border-bottom:1px solid var(--line); cursor:pointer; font-size:12.5px; }
.notif-item:hover{ background:var(--surface-2); }
.notif-item.unread{ background:var(--forest-wash); }
.notif-item:last-child{ border-bottom:none; }
.notif-title{ font-weight:600; margin-bottom:2px; }
.notif-msg{ color:var(--ink-soft); margin-bottom:3px; }
.notif-when{ color:var(--ink-faint); font-size:11px; }
.notif-empty{ padding:20px 14px; color:var(--ink-faint); font-size:12.5px; text-align:center; }

/* ---- kit de Project Manager: tarjetas de listas (hitos, riesgos, decisiones, etc.) ---- */
.pm-list{ display:flex; flex-direction:column; gap:10px; margin-top:12px; }
.pm-card{ border:1px solid var(--line); border-radius:8px; padding:12px 14px; display:flex; justify-content:space-between; align-items:flex-start; gap:12px; flex-wrap:wrap; }
.pm-card-body{ flex:1; min-width:220px; font-size:13.5px; }
.pm-card-body .note{ margin-top:4px; }
.pm-card-actions{ display:flex; gap:6px; flex-shrink:0; }
.chk{ display:flex; align-items:center; gap:6px; font-size:12.5px; font-weight:400; }

/* ---- RRHH y Gobernanza: expedientes digitales por persona + bóveda institucional, agrupados por categoría ---- */
.rrhh-cat{ margin-top:16px; }
.rrhh-cat:first-child{ margin-top:0; }
.rrhh-cat-t{ font-size:11.5px; text-transform:uppercase; letter-spacing:.05em; font-weight:700; color:var(--ink-faint); margin-bottom:6px; }
tr.row-flagged td{ background:var(--clay-wash); }
.ts-deadline-note.late{ color:var(--clay); font-weight:600; }

/* ==================================================================================
   PANEL "BI" (estilo Power BI) — SIEMPRE OSCURO, independiente del tema claro/oscuro
   del resto de la app (decisión explícita del usuario). Paleta categórica, de estatus
   y superficies tomadas tal cual de la instancia de referencia ya validada del método
   de data-viz (columna oscura) — no se inventaron ni retocaron valores a ojo.
   ================================================================================== */
.bi-dash{
  --bi-bg:#0d0d0d; --bi-surface:#1a1a19; --bi-surface-2:#232322; --bi-inset:#141413;
  --bi-line:#2c2c2a; --bi-ink:#ffffff; --bi-ink-soft:#c3c2b7; --bi-ink-faint:#898781;
  --bi-ring:rgba(255,255,255,0.10);
  /* estatus (fijo, nunca temático) */
  --bi-good:#0ca30c; --bi-warning:#fab219; --bi-serious:#ec835a; --bi-critical:#d03b3b; --bi-neutral:#5b5d6b;
  /* categórico (orden fijo — nunca ciclar) */
  --bi-c1:#3987e5; --bi-c2:#d95926; --bi-c3:#199e70; --bi-c4:#c98500; --bi-c5:#d55181; --bi-c6:#008300; --bi-c7:#9085e9; --bi-c8:#e66767;
  /* secuencial azul (2 matices, para el dumbbell) */
  --bi-seq-light:#86b6ef; --bi-seq-dark:#3987e5;
  color-scheme: dark;
  background:var(--bi-bg); border-radius:calc(var(--radius) + 4px); padding:18px; margin-top:2px;
  color:var(--bi-ink); font-variant-numeric:proportional-nums;
}
.bi-dash h3, .bi-dash .bi-t{ font-family:'Public Sans',system-ui,sans-serif; }

.bi-section-t{ font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--bi-ink-faint); margin:22px 2px 10px; }
.bi-section-t:first-child{ margin-top:2px; }

/* ---- fila de KPI: medidores circulares + tarjetas de número grande ---- */
.bi-kpi-row{ display:grid; grid-template-columns:repeat(auto-fit, minmax(190px, 1fr)); gap:14px; }
.bi-card{ background:var(--bi-surface); border:1px solid var(--bi-ring); border-radius:12px; padding:16px; }
.bi-gauge-card{ display:flex; align-items:center; gap:14px; }
.bi-gauge-wrap{ position:relative; width:76px; height:76px; flex:none; }
.bi-gauge-wrap svg{ width:100%; height:100%; }
.bi-gauge-pct{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:18px; font-weight:700; color:var(--bi-ink); }
.bi-gauge-info .bi-l{ font-size:11.5px; color:var(--bi-ink-faint); text-transform:uppercase; letter-spacing:.03em; }
.bi-gauge-info .bi-d{ font-size:12px; color:var(--bi-ink-soft); margin-top:3px; }
.bi-num-card .bi-icon{ color:var(--bi-ink-faint); margin-bottom:10px; }
.bi-num-card .bi-n{ font-size:26px; font-weight:700; line-height:1.1; color:var(--bi-ink); }
.bi-num-card .bi-l{ font-size:12px; color:var(--bi-ink-soft); margin-top:4px; }

/* ---- cuadrícula de 2 columnas para las gráficas ---- */
.bi-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; align-items:start; margin-top:14px; }
@media (max-width: 860px){ .bi-grid{ grid-template-columns:1fr; } }
.bi-col{ display:flex; flex-direction:column; gap:14px; }
.bi-block-t{ font-size:13px; font-weight:600; margin-bottom:11px; color:var(--bi-ink); }
.bi-block-total{ font-weight:400; color:var(--bi-ink-faint); }
.bi-empty{ color:var(--bi-ink-faint); font-size:12.5px; padding:10px 0; }

.bi-legend{ display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:10px; font-size:12px; color:var(--bi-ink-soft); }
.bi-legend-item{ display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
.bi-dot{ width:9px; height:9px; border-radius:2.5px; display:inline-block; flex:none; }

/* ---- barra apilada de estatus ---- */
.bi-stack-bar{ display:flex; height:15px; border-radius:8px; overflow:hidden; background:var(--bi-inset); }
.bi-stack-seg{ height:100%; box-sizing:border-box; border-right:2px solid var(--bi-surface); }
.bi-stack-seg:last-child{ border-right:none; }

/* ---- barras horizontales de magnitud (un solo tono) ---- */
.bi-hbars{ display:flex; flex-direction:column; gap:9px; }
.bi-hbar-row{ display:grid; grid-template-columns:104px 1fr 56px; align-items:center; gap:9px; }
.bi-hbar-label{ font-size:12.5px; color:var(--bi-ink-soft); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bi-hbar-track{ background:var(--bi-inset); border-radius:5px; height:11px; overflow:hidden; }
.bi-hbar-fill{ background:var(--bi-c1); height:100%; border-radius:5px; }
.bi-hbar-value{ font-size:12px; text-align:right; color:var(--bi-ink-soft); }

/* ---- dumbbell (antes/después, 2 matices de un tono) ---- */
.bi-dumbbells{ display:flex; flex-direction:column; gap:16px; margin-top:2px; }
.bi-dumbbell-row{ display:grid; grid-template-columns:96px 1fr 140px; align-items:center; gap:9px; }
.bi-dumbbell-label{ font-size:12.5px; color:var(--bi-ink-soft); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bi-dumbbell-track{ position:relative; height:16px; }
.bi-dumbbell-line{ position:absolute; top:7px; height:2px; background:var(--bi-line); }
.bi-dumbbell-dot{ position:absolute; top:3px; width:10px; height:10px; border-radius:50%; transform:translateX(-50%); border:2px solid var(--bi-surface); }
.bi-dumbbell-values{ font-size:12px; text-align:right; color:var(--bi-ink-soft); white-space:nowrap; }

/* ---- dona (conic-gradient) para reparto categórico o de estatus ---- */
.bi-donut-wrap{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.bi-donut-ring{ width:112px; height:112px; border-radius:50%; position:relative; flex:none; }
.bi-donut-hole{ position:absolute; inset:16px; background:var(--bi-surface); border-radius:50%; display:flex; align-items:center; justify-content:center; }
.bi-donut-total{ font-size:20px; font-weight:700; color:var(--bi-ink); }
.bi-donut-legend{ display:flex; flex-direction:column; gap:6px; font-size:12.5px; color:var(--bi-ink-soft); flex:1; min-width:140px; }
.bi-donut-legend-item{ display:flex; align-items:center; gap:7px; justify-content:space-between; }
.bi-donut-legend-item .lbl{ display:flex; align-items:center; gap:7px; }

/* ---- matriz de riesgos (probabilidad × impacto) ---- */
.bi-risk-matrix{ display:flex; flex-direction:column; gap:2px; margin-top:2px; }
.bi-risk-row{ display:grid; grid-template-columns:52px repeat(3, 1fr); gap:2px; }
.bi-risk-row-label{ font-size:11.5px; color:var(--bi-ink-faint); display:flex; align-items:center; }
.bi-risk-col-label{ font-size:11px; color:var(--bi-ink-faint); text-align:center; padding-bottom:2px; }
.bi-risk-cell{ height:32px; border-radius:6px; display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; color:var(--bi-ink-faint); }

/* ---- franja de historial de semáforo ---- */
.bi-strip{ display:flex; gap:4px; flex-wrap:wrap; }
.bi-chip{ width:16px; height:16px; border-radius:4px; }
.bi-chip-named{ padding:4px 9px; border-radius:99px; font-size:11.5px; font-weight:600; color:#0d0d0d; white-space:nowrap; }

/* ---- listas clickeables: personal asignado (mensaje directo) y timesheets pendientes ---- */
.bi-person-list{ display:flex; flex-direction:column; gap:2px; }
.bi-person-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 4px; border-radius:8px; cursor:pointer; transition:background .12s; }
.bi-person-row:hover{ background:var(--bi-inset); }
.bi-person-row:not(:last-child){ border-bottom:1px solid var(--bi-line); }
.bi-person-meta{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.bi-person-name{ font-size:13px; color:var(--bi-ink); font-weight:600; }
.bi-person-role{ font-size:11.5px; color:var(--bi-ink-faint); font-weight:400; }
.bi-person-ic{ color:var(--bi-ink-faint); font-size:13px; flex:none; }
.bi-person-row:hover .bi-person-ic{ color:var(--bi-c1); }

/* ---- accesos rápidos (fichas oscuras de navegación dentro del panel BI) ---- */
.bi-nav-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:10px; }
.bi-nav-card{ border:1px solid var(--bi-ring); border-radius:10px; padding:12px 14px; cursor:pointer; background:var(--bi-surface); transition:border-color .15s; }
.bi-nav-card:hover{ border-color:var(--bi-c1); }
.bi-nav-card .bi-h{ font-size:10.5px; font-weight:700; color:var(--bi-ink-faint); text-transform:uppercase; letter-spacing:.04em; margin-bottom:5px; }
.bi-nav-card .bi-n{ font-size:15.5px; font-weight:600; color:var(--bi-ink); margin-bottom:3px; }
.bi-nav-card .bi-d{ font-size:11.5px; color:var(--bi-ink-soft); line-height:1.4; }

/* ---- sub-tabs de Proyectos: Vista general / Lista ---- */
.subtabs{ display:flex; gap:6px; margin-bottom:14px; }
.subtabs .subtab{ padding:7px 14px; border-radius:8px; border:1px solid var(--line); background:var(--surface); font-size:13px; font-weight:600; color:var(--ink-soft); cursor:pointer; }
.subtabs .subtab.active{ background:var(--forest); border-color:var(--forest); color:#fff; }

/* ---- reapertura de reportes rechazados ---- */
.readonly-box{ border:1px solid var(--line); border-radius:7px; padding:10px 11px; font-size:13.5px; background:var(--surface-2); color:var(--ink-soft); }

/* ---- Mensajes (notificaciones + mensajería interna) ---- */
.nav-item .nav-badge{ margin-left:auto; background:var(--clay); color:#fff; font-size:10px; font-weight:700; border-radius:99px; padding:2px 7px; }
.msg-shell{ display:grid; grid-template-columns:280px 1fr; gap:16px; margin-top:14px; min-height:420px; }
@media (max-width: 720px){ .msg-shell{ grid-template-columns:1fr; } }
.msg-list{ border:1px solid var(--line); border-radius:10px; overflow:hidden; background:var(--surface); height:fit-content; }
.msg-list-h{ padding:12px 14px; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; font-weight:600; font-size:13.5px; }
.msg-thread-item{ padding:11px 14px; border-bottom:1px solid var(--line); cursor:pointer; }
.msg-thread-item:hover{ background:var(--surface-2); }
.msg-thread-item.active{ background:var(--forest-wash); }
.msg-thread-item .nm{ font-weight:600; font-size:13px; display:flex; justify-content:space-between; }
.msg-thread-item .prev{ font-size:12px; color:var(--ink-faint); margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.msg-thread-panel{ border:1px solid var(--line); border-radius:10px; background:var(--surface); display:flex; flex-direction:column; }
.msg-thread-panel-h{ padding:12px 14px; border-bottom:1px solid var(--line); font-weight:600; font-size:13.5px; }
.msg-bubbles{ padding:14px; flex:1; display:flex; flex-direction:column; gap:10px; overflow-y:auto; max-height:420px; }
.msg-bubble{ max-width:75%; padding:9px 12px; border-radius:10px; font-size:13.5px; line-height:1.45; }
.msg-bubble.mine{ align-self:flex-end; background:var(--forest-wash); }
.msg-bubble.theirs{ align-self:flex-start; background:var(--surface-2); }
.msg-bubble .who-when{ font-size:10.5px; color:var(--ink-faint); margin-top:4px; }
.msg-reply{ display:flex; gap:8px; padding:12px 14px; border-top:1px solid var(--line); }
.msg-reply textarea{ flex:1; border:1px solid var(--line); border-radius:7px; padding:8px 10px; font-family:inherit; font-size:13.5px; resize:vertical; min-height:44px; }
.notif-history-item{ padding:10px 14px; border-bottom:1px solid var(--line); }
.notif-history-item:last-child{ border-bottom:none; }

/* ---- Mercadeo y Ventas: tablero (Kanban) del Pipeline de Propuestas y Licitaciones ---- */
.kanban{ display:grid; grid-template-columns:repeat(4,minmax(230px,1fr)); gap:12px; align-items:start; overflow-x:auto; }
@media (max-width: 900px){ .kanban{ grid-template-columns:1fr; } }
.kanban-col{ background:var(--surface-2); border:1px solid var(--line); border-radius:10px; padding:10px; min-height:80px; }
.kanban-col-h{ display:flex; justify-content:space-between; align-items:center; font-size:12.5px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-soft); padding:2px 4px 10px; }
.kanban-card{ background:var(--surface); border:1px solid var(--line); border-radius:9px; padding:11px 12px; margin-bottom:9px; box-shadow:var(--shadow); }
.kanban-card:last-child{ margin-bottom:0; }
.kanban-card .cli{ font-weight:600; font-size:13.5px; margin-bottom:2px; }
.kanban-card .meta{ font-size:12px; color:var(--ink-faint); margin-bottom:6px; }
.kanban-card .team{ font-size:11.5px; color:var(--ink-soft); margin:6px 0; }
.kanban-card select{ width:100%; margin-top:6px; }
.kanban-empty{ color:var(--ink-faint); font-size:12px; padding:6px 4px; }
.kanban-team-edit{ background:var(--surface-2); border:1px solid var(--line); border-radius:8px; padding:8px; }
.asset-cat{ margin-top:16px; }
.asset-cat:first-child{ margin-top:0; }
/* Envoltorio genérico para cualquier tarjeta/gráfica "BI" que lleva a otra pantalla (ver biClickable() en
   app.js) — el mismo tratamiento visual en TODOS los paneles oscuros del sistema (Administración, RRHH,
   Nómina, Contabilidad, Finanzas, Mercadeo, Proyectos), para que un usuario aprenda una sola vez que "lo
   que se ilumina al pasar el cursor, se puede hacer clic". */
.bi-clickable{ cursor:pointer; border-radius:14px; transition:background-color .12s ease, transform .12s ease; }
.bi-clickable:hover{ background:rgba(255,255,255,0.045); transform:translateY(-1px); }
.bi-clickable:active{ transform:translateY(0); }
.bi-hbar-row.bi-clickable{ border-radius:8px; padding:2px 4px; margin:-2px -4px; }
/* Enlace de texto genérico (antes solo existía dentro de .who y .notif-panel-h) — usado ahora también
   dentro de las tarjetas del Kanban de Mercadeo para el toggle de "editar equipo". */
.lnk{ cursor:pointer; color:var(--forest); }
.notif-history-item .row1{ display:flex; justify-content:space-between; gap:10px; align-items:flex-start; }

/* ================= HUB CENTRAL (página de inicio, 2026-09-14) =================
   Fondo oscuro (actualizado 2026-09-14 a pedido del usuario): toda la página vive ahora dentro de la misma
   ".bi-dash" oscura que usan los paneles del resto de los módulos — mismos tokens --bi-* (ver más abajo,
   junto a .bi-card), en vez de las tarjetas claras (--surface/--ink) de la primera versión. El Tablero de
   Ideas y el modal "More Apps" se retiraron de la interfaz (sus estilos se quitaron junto con ellos). */
.hub-wrap{ display:flex; flex-direction:column; gap:26px; }
/* A pedido del usuario (2026-09-15) se quitó el degradado verde institucional que iba ENCIMA de la foto
   — ahora se ve la foto original completa, sin ningún tinte de color — y la legibilidad del texto blanco
   se logra solo con `text-shadow` (varias capas, para que se lea bien tanto sobre el cielo claro como
   sobre la parte más oscura de las montañas), sin tapar la imagen con ninguna capa semitransparente. */
.hub-banner{ background:url('images/hub-banner.jpg') center 38%/cover no-repeat; color:#fff; border-radius:var(--radius); padding:28px 30px; box-shadow:var(--shadow); }
.hub-banner h1{ margin:0 0 4px; font-size:28px; color:#fff; text-shadow:0 1px 3px rgba(0,0,0,.9), 0 2px 14px rgba(0,0,0,.75), 0 0 2px rgba(0,0,0,.9); }
.hub-banner-sub{ font-size:13.5px; opacity:.95; text-shadow:0 1px 3px rgba(0,0,0,.9), 0 2px 12px rgba(0,0,0,.75); }

.hub-wrap .section-t{ color:var(--bi-ink-faint); }
.section-t-row{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; gap:10px; flex-wrap:wrap; }
.hub-edit-lnk{ background:none; border:none; font-size:12px; font-weight:600; color:var(--bi-c1); cursor:pointer; padding:2px 0; }
.hub-inline-form{ background:var(--bi-surface-2); border:1px solid var(--bi-line); border-radius:var(--radius); padding:14px; margin-bottom:14px; display:flex; flex-direction:column; gap:10px; }
.hub-inline-form textarea, .hub-inline-form input, .hub-inline-form select{ border:1px solid var(--bi-line); border-radius:7px; padding:9px 10px; font-size:13.5px; font-family:inherit; background:var(--bi-surface); color:var(--bi-ink); resize:vertical; }
.hub-inline-form .field label{ color:var(--bi-ink-faint); }

/* ---- Mensaje del CEO + anuncios ---- */
.hub-row{ display:grid; grid-template-columns:2fr 1fr; gap:16px; align-items:stretch; }
@media (max-width: 860px){ .hub-row{ grid-template-columns:1fr; } }
.hub-ceo-card, .hub-anuncios-card{ background:var(--bi-surface); border:1px solid var(--bi-line); border-radius:12px; padding:18px 20px; color:var(--bi-ink); }
.hub-ceo-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:10px; }
.hub-ceo-body{ display:flex; gap:16px; align-items:flex-start; }
.hub-ceo-photo{ width:96px; height:96px; border-radius:12px; background-color:var(--bi-surface-2); background-size:cover; background-position:center; flex-shrink:0; }
.hub-ceo-photo-empty{ display:flex; align-items:center; justify-content:center; color:var(--bi-ink-faint); }
.hub-ceo-text{ flex:1; min-width:0; }
.hub-ceo-quote{ margin:0 0 8px; font-family:'Fraunces',serif; font-size:16px; line-height:1.5; color:var(--bi-ink); font-style:italic; }
.hub-ceo-author{ font-size:12.5px; color:var(--bi-ink-faint); font-weight:600; margin-bottom:10px; }
.hub-anuncios-card{ display:flex; flex-direction:column; }
.hub-anuncio-item{ padding:10px 0; border-top:1px solid var(--bi-line); position:relative; }
.hub-anuncio-item:first-of-type{ border-top:none; padding-top:0; }
.hub-anuncio-item .t{ font-size:13.5px; font-weight:600; margin-bottom:2px; color:var(--bi-ink); }
.hub-anuncio-item .d{ font-size:12.5px; color:var(--bi-ink-soft); line-height:1.4; }

/* ---- Accesos rápidos: mosaico oscuro (misma paleta --bi-*, ya heredada de .hub-wrap.bi-dash) ---- */
.hub-quicklinks-wrap{ background:var(--bi-surface); border:1px solid var(--bi-line); border-radius:12px; padding:16px; }
.hub-quicklinks-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(96px, 1fr)); gap:10px; }
.hub-qlink-tile{ display:flex; flex-direction:column; align-items:center; gap:8px; background:var(--bi-surface-2); border:1px solid var(--bi-line); border-radius:10px; padding:14px 8px; color:var(--bi-ink); font-size:12px; font-weight:600; cursor:pointer; transition:background-color .12s ease, transform .12s ease; }
.hub-qlink-tile:hover{ background:var(--bi-inset); transform:translateY(-1px); }
.hub-qlink-ic{ color:var(--bi-ink-soft); }

/* ---- Top Resources ---- */
.hub-resources-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(160px, 1fr)); gap:12px; }
.hub-res-tile{ position:relative; display:flex; align-items:center; gap:10px; border-radius:12px; padding:16px 26px 16px 16px; color:#fff; text-decoration:none; font-size:13.5px; font-weight:600; box-shadow:var(--shadow); min-height:24px; }
.hub-res-tile[data-bi-goto]{ cursor:pointer; }
.hub-res-tile-empty{ opacity:.75; }
.hub-res-ic{ flex-shrink:0; opacity:.92; }
.hub-res-t{ flex:1; line-height:1.3; overflow-wrap:break-word; word-break:break-word; }
.hub-res-pending{ position:absolute; bottom:8px; left:16px; font-size:10.5px; font-weight:500; opacity:.8; }
.hub-res-del{ position:absolute; top:6px; right:9px; font-size:15px; line-height:1; cursor:pointer; opacity:.7; }
.hub-res-del:hover{ opacity:1; }
.hub-tile-forest{ background:var(--forest); }
.hub-tile-forest-light{ background:var(--forest-light); }
.hub-tile-ochre{ background:var(--ochre); }
.hub-tile-clay{ background:var(--clay); }
.hub-tile-sage{ background:#7c9070; }
.hub-tile-ink{ background:#3a4a40; }

/* ---- Noticias y Eventos ---- */
.hub-news-events-grid{ display:grid; grid-template-columns:2fr 1fr; gap:20px; align-items:start; }
@media (max-width: 860px){ .hub-news-events-grid{ grid-template-columns:1fr; } }
.hub-news-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width: 620px){ .hub-news-grid{ grid-template-columns:1fr; } }
.hub-news-card{ background:var(--bi-surface); border:1px solid var(--bi-line); border-radius:12px; overflow:hidden; color:var(--bi-ink); }
.hub-news-img{ height:130px; background-color:var(--bi-surface-2); background-size:cover; background-position:center; }
.hub-news-img-empty{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:var(--bi-ink-faint); }
.hub-news-fetch-thumb{ background:none; border:1px solid var(--bi-line); border-radius:20px; padding:4px 10px; font-size:11px; font-weight:600; color:var(--bi-c1); cursor:pointer; }
.hub-news-fetch-thumb:hover{ border-color:var(--bi-c1); }
.hub-news-fetch-thumb:disabled{ opacity:.6; cursor:default; }
.hub-news-body{ padding:14px; position:relative; }
.hub-news-body .t{ font-size:14.5px; font-weight:600; margin-bottom:4px; }
.hub-news-body .d{ font-size:12.5px; color:var(--bi-ink-soft); line-height:1.5; margin-bottom:6px; }
.hub-events-col{ background:var(--bi-surface); border:1px solid var(--bi-line); border-radius:12px; padding:16px; color:var(--bi-ink); }
.hub-events-h{ font-size:12px; text-transform:uppercase; letter-spacing:.05em; font-weight:700; color:var(--bi-ink-faint); margin-bottom:12px; display:flex; align-items:center; justify-content:space-between; }
.hub-event-item{ display:flex; gap:12px; padding:10px 0; border-top:1px solid var(--bi-line); align-items:flex-start; position:relative; }
.hub-event-item:first-of-type{ border-top:none; padding-top:0; }
.hub-event-date{ width:42px; flex-shrink:0; text-align:center; background:var(--bi-inset); color:var(--bi-c1); border-radius:8px; padding:5px 0; }
.hub-event-date .d{ font-size:16px; font-weight:700; line-height:1.1; }
.hub-event-date .m{ font-size:10px; font-weight:700; letter-spacing:.03em; }
.hub-event-body .t{ font-size:13px; font-weight:600; margin-bottom:2px; color:var(--bi-ink); }
.hub-event-body .h{ font-size:11.5px; color:var(--bi-ink-faint); margin-bottom:4px; }

/* ---- Mini-calendario del mes corriente (debajo de "Próximos Eventos Internos") ---- */
.hub-events-right{ display:flex; flex-direction:column; gap:16px; }
.hub-cal-card{ background:var(--bi-surface); border:1px solid var(--bi-line); border-radius:12px; padding:16px; color:var(--bi-ink); }
.hub-cal-head{ font-size:12px; text-transform:uppercase; letter-spacing:.05em; font-weight:700; color:var(--bi-ink-faint); margin-bottom:12px; text-align:center; }
.hub-cal-dow{ display:grid; grid-template-columns:repeat(7, 1fr); gap:2px; margin-bottom:4px; }
.hub-cal-dow div{ text-align:center; font-size:10.5px; font-weight:700; color:var(--bi-ink-faint); }
.hub-cal-grid{ display:grid; grid-template-columns:repeat(7, 1fr); gap:2px; }
.hub-cal-cell{ position:relative; aspect-ratio:1; display:flex; align-items:center; justify-content:center; font-size:12px; color:var(--bi-ink-soft); border-radius:8px; }
.hub-cal-empty{ visibility:hidden; }
.hub-cal-today{ background:var(--bi-c1); color:#fff; font-weight:700; }
.hub-cal-clickable{ cursor:pointer; }
.hub-cal-clickable:hover{ background:var(--bi-inset); color:var(--bi-ink); }
.hub-cal-today.hub-cal-clickable:hover{ background:var(--bi-c1); color:#fff; opacity:.85; }
.hub-cal-dot{ position:absolute; bottom:3px; left:50%; transform:translateX(-50%); width:4px; height:4px; border-radius:50%; background:var(--bi-c2, var(--bi-ink-faint)); }
.hub-cal-today .hub-cal-dot{ background:#fff; }
.hub-cal-hint{ font-size:11px; color:var(--bi-ink-faint); margin-top:10px; text-align:center; }

/* ---- Empleados y equipos destacados (carrusel) ---- */
.hub-spot-row{ display:flex; gap:14px; overflow-x:auto; padding-bottom:4px; }
.hub-spot-card{ flex:0 0 220px; background:var(--bi-surface); border:1px solid var(--bi-line); border-radius:12px; overflow:hidden; color:var(--bi-ink); }
.hub-spot-img{ height:150px; background-color:var(--bi-surface-2); background-size:cover; background-position:center; }
.hub-spot-img-empty{ display:flex; align-items:center; justify-content:center; color:var(--bi-ink-faint); }
.hub-spot-cap{ padding:12px 14px; font-size:13px; font-weight:600; line-height:1.4; position:relative; }

/* ---- Buzón de Sugerencias (el Tablero de Ideas se retiró de esta página) ---- */
.hub-suggestion-card{ background:var(--bi-surface); border:1px solid var(--bi-line); border-radius:12px; padding:18px 20px; color:var(--bi-ink); max-width:640px; }
.hub-anon-check{ font-size:12.5px; color:var(--bi-ink-soft); display:flex; align-items:center; gap:6px; }
.hub-suggestions-list{ margin-top:10px; display:flex; flex-direction:column; gap:8px; max-height:280px; overflow-y:auto; }
.hub-suggestion-item{ border:1px solid var(--bi-line); border-radius:9px; padding:9px 11px; }
.hub-suggestion-item .txt{ font-size:13px; line-height:1.4; margin-bottom:4px; }
.hub-suggestion-item .meta{ font-size:11px; color:var(--bi-ink-faint); }

/* ---- Ajustes de contraste para clases compartidas con el resto de la app (claras por defecto) cuando
   aparecen dentro del fondo oscuro del Hub — sin tocar su estilo en ningún otro módulo. ---- */
.hub-wrap .empty{ color:var(--bi-ink-faint); }
.hub-wrap .lnk{ color:var(--bi-c1); }
.hub-wrap .btn:not(.primary){ background:var(--bi-surface-2); border-color:var(--bi-line); color:var(--bi-ink); }
.hub-wrap .btn:not(.primary):hover{ border-color:var(--bi-c1); }

/* ---- Proceso de Inducción (Onboarding) ----
   Usa los mismos tokens (--surface/--ink/--line/--forest...) que el resto de la app fuera del Hub —
   incluye el modo oscuro automático de :root ya definido arriba (@media prefers-color-scheme:dark), sin
   necesidad de un tema aparte. Se usa tanto en el candado de pantalla completa (dentro de .login-card)
   como en la vista normal dentro de la app (dentro de .panel), por eso no depende de ninguno de los dos
   contenedores. */
.onb-card{ max-width:560px; }
.onb-steps{ display:flex; gap:6px; margin:4px 0 22px; }
.onb-step{ flex:1; display:flex; flex-direction:column; align-items:center; gap:6px; cursor:pointer; text-align:center; padding:6px 4px; border-radius:8px; }
.onb-step:hover{ background:var(--surface-2); }
.onb-step-n{ width:26px; height:26px; border-radius:50%; background:var(--surface-2); color:var(--ink-faint); display:flex; align-items:center; justify-content:center; font-size:12.5px; font-weight:700; font-family:'IBM Plex Mono',monospace; }
.onb-step.done .onb-step-n{ background:var(--forest-wash); color:var(--forest); }
.onb-step.active .onb-step-n{ background:var(--forest); color:#fff; }
.onb-step-lbl{ font-size:11px; color:var(--ink-faint); font-weight:600; line-height:1.3; }
.onb-step.active .onb-step-lbl{ color:var(--ink); }
.onb-form{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.onb-form h2{ grid-column:1/-1; font-size:18px; margin:0 0 2px; }
.onb-sub{ grid-column:1/-1; color:var(--ink-soft); font-size:13px; margin:0 0 6px; }
.onb-form .actions{ grid-column:1/-1; display:flex; justify-content:flex-end; margin-top:4px; }
.onb-form .note.span2{ grid-column:span 2; }
.onb-agreement{ grid-column:1/-1; background:var(--surface-2); border:1px solid var(--line); border-radius:8px; padding:14px 16px; font-size:13px; line-height:1.55; color:var(--ink-soft); max-height:260px; overflow-y:auto; margin-bottom:4px; }
.onb-agreement p{ margin:0 0 10px; }
.onb-agreement p:last-child{ margin-bottom:0; }
.checkbox-field label{ display:flex; align-items:center; gap:8px; text-transform:none; font-size:13.5px; font-weight:500; color:var(--ink); }
.checkbox-field input[type="checkbox"]{ width:16px; height:16px; }
@media (max-width: 560px){
  .onb-form{ grid-template-columns:1fr; }
  .onb-form .field.span2{ grid-column:span 1; }
  .onb-steps{ flex-wrap:wrap; }
}

/* Modo desarrollo plegado en la pantalla de inicio de sesión (2026-10-06) */
.dev-panel{ margin-top:18px; font-size:12.5px; color:var(--ink-faint); }
.dev-panel > summary{ cursor:pointer; user-select:none; }