/* Reservas de salas · hoja de estilos
   Modo oscuro: <html data-theme="dark"> (lo fija el script de includes/layout.php) */
:root, .theme-light-scope {
  --bg: #f4f5fa;
  --surface: #ffffff;
  --surface-2: #f8f9fc;
  --border: #e6e8f0;
  --border-strong: #d4d8e4;
  --text: #171a2b;
  --text-2: #4b5168;
  --muted: #7c8299;
  --primary: #4f46e5;
  --primary-600: #4338ca;
  --primary-soft: #eef0ff;
  --success: #059669;
  --success-soft: #e7f8f1;
  --warning: #d97706;
  --danger: #dc2626;
  --danger-soft: #fdeeee;
  --radius: 14px;
  --radius-sm: 10px;
  --shadow: 0 1px 2px rgba(23, 26, 43, .04), 0 4px 16px rgba(23, 26, 43, .05);
  --shadow-lg: 0 12px 48px rgba(23, 26, 43, .18);
  --sidebar: 280px;
  color-scheme: light;
}
:root[data-theme="dark"], .theme-dark-scope {
  --bg: #0e1020;
  --surface: #161a2e;
  --surface-2: #1b2036;
  --border: #262c46;
  --border-strong: #343b5a;
  --text: #eceefa;
  --text-2: #b4b9d3;
  --muted: #8a90ad;
  --primary: #7c7cff;
  --primary-600: #6b6bf5;
  --primary-soft: #23264a;
  --success: #34d399;
  --success-soft: #11302a;
  --danger: #f87171;
  --danger-soft: #3a1c22;
  --shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 4px 16px rgba(0, 0, 0, .25);
  color-scheme: dark;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 15px;
  line-height: 1.5;
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
}
a { color: var(--primary); text-decoration: none; }
h1, h2, h3 { margin: 0; letter-spacing: -.01em; }
h1 { font-size: 28px; font-weight: 800; letter-spacing: -.02em; }
h2 { font-size: 17px; font-weight: 700; }
h3 { font-size: 15px; font-weight: 700; }
p { margin: 0; }
code { background: var(--surface-2); padding: 1px 6px; border-radius: 6px; font-size: .9em; }
.ico { flex-shrink: 0; vertical-align: middle; }
.muted { color: var(--muted); }
.small { font-size: 13px; }
.center { text-align: center; }
.nowrap { white-space: nowrap; }
.strike { text-decoration: line-through; text-decoration-thickness: 2px; color: var(--muted); }
.eyebrow { color: var(--muted); font-size: 13px; font-weight: 600; display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
.spacer { flex: 1; }

/* ---------- Layout ---------- */
.app { display: flex; min-height: 100vh; }
.sidebar {
  width: var(--sidebar); flex-shrink: 0; position: sticky; top: 0; height: 100vh;
  background: var(--sb-bg, var(--surface)); border-right: 1px solid var(--sb-border, var(--border));
  display: flex; flex-direction: column; padding: 20px 14px; gap: 16px; z-index: 40;
}
.brand { display: flex; align-items: center; gap: 10px; padding: 4px 8px; color: var(--text); }
.sidebar .brand { color: var(--sb-text, var(--text)); }
.brand-mark {
  width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; color: var(--on-brand, #fff);
  background: linear-gradient(135deg, var(--brand-from, #6366f1), var(--brand, #4f46e5) 55%, var(--secondary, #7c3aed));
  box-shadow: 0 6px 16px color-mix(in srgb, var(--brand, #4f46e5) 35%, transparent);
}
.brand-name { font-weight: 800; font-size: 15px; line-height: 1.2; }
.new-btn { margin: 4px 0; }
.nav { display: flex; flex-direction: column; gap: 2px; flex: 1; overflow-y: auto; }
.nav a {
  display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px;
  color: var(--sb-text-2, var(--text-2)); font-weight: 600; font-size: 14px; transition: background .15s, color .15s;
}
.nav a:hover { background: var(--sb-hover, var(--surface-2)); color: var(--sb-text, var(--text)); }
.nav a.active { background: var(--sb-active-bg, var(--primary-soft)); color: var(--sb-active-text, var(--primary)); }
.nav-label {
  display: flex; align-items: center; gap: 6px; margin: 18px 12px 6px;
  font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--sb-muted, var(--muted));
}
.sidebar-foot { display: flex; align-items: center; gap: 6px; border-top: 1px solid var(--sb-border, var(--border)); padding-top: 14px; }
.me { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; padding: 6px; border-radius: 10px; color: var(--sb-text, var(--text)); }
.me:hover { background: var(--sb-hover, var(--surface-2)); }
.sidebar .me-text small { color: var(--sb-muted, var(--muted)); }
.sidebar .new-btn { outline: 1px solid var(--sb-btn-ring, transparent); outline-offset: -1px; }
.sidebar .icon-btn { color: var(--sb-text-2, var(--text-2)); }
.sidebar .icon-btn:hover { background: var(--sb-hover, var(--surface-2)); color: var(--sb-text, var(--text)); }
.me-text { display: flex; flex-direction: column; min-width: 0; }
.me-text strong, .me-text small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.me-text strong { font-size: 13.5px; }
.me-text small { color: var(--muted); font-size: 12px; }

.main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.content { padding: 32px 36px 60px; max-width: 1380px; width: 100%; margin: 0 auto; }
/* Barra superior: dónde estás, campana, tema y menú de la persona */
.topbar {
  display: flex; align-items: center; gap: 12px; position: sticky; top: 0; z-index: 25; height: 60px; padding: 0 36px;
  background: color-mix(in srgb, var(--bg) 85%, transparent); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
}
.topbar .menu-btn { display: none; }
.crumbs { flex: 1; min-width: 0; }
.crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 4px; min-width: 0; font-size: 13.5px; color: var(--muted); }
.crumbs li { display: flex; align-items: center; gap: 4px; min-width: 0; white-space: nowrap; }
.crumbs li span { overflow: hidden; text-overflow: ellipsis; }
.crumbs li .ico { flex: none; opacity: .6; }
.crumbs li[aria-current] { color: var(--text); font-weight: 700; }
.topbar-tools { display: flex; align-items: center; gap: 4px; margin-left: auto; flex: none; }
.umenu { position: relative; margin-left: 6px; }
.umenu-btn {
  display: flex; align-items: center; gap: 9px; max-width: 260px; padding: 4px 10px 4px 4px; border: 1px solid transparent; border-radius: 99px;
  background: transparent; color: var(--text); font: inherit; cursor: pointer; text-align: left;
}
.umenu-btn:hover, .umenu-btn[aria-expanded="true"] { background: var(--surface); border-color: var(--border); }
.umenu-btn > .ico { color: var(--muted); flex: none; }
.umenu-btn .me-text small { font-size: 11.5px; }
.umenu-pop {
  position: absolute; right: 0; top: calc(100% + 8px); width: 270px; z-index: 60; padding: 6px; background: var(--surface); color: var(--text);
  border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow-lg); animation: np-in .14s ease-out;
}
.umenu-pop[hidden] { display: none; }
.umenu-head { display: flex; align-items: center; gap: 10px; padding: 10px 10px 12px; margin-bottom: 4px; border-bottom: 1px solid var(--border); }
.umenu-head .me-text small { line-height: 1.35; }
.umenu-pop a, .umenu-pop button { display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 10px; border: 0; border-radius: 9px; background: none; color: var(--text-2); font: inherit; font-size: 14px; font-weight: 600; text-align: left; cursor: pointer; text-decoration: none; }
.umenu-pop a:hover, .umenu-pop button:hover { background: var(--surface-2); color: var(--text); }
.umenu-pop form { margin: 4px 0 0; padding-top: 4px; border-top: 1px solid var(--border); }
.umenu-out:hover { color: var(--danger) !important; }
.scrim { display: none; }

.page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 24px; }
.page-head .muted { margin-top: 4px; }
.head-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.head-meta { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 10px; }
.back { display: inline-flex; align-items: center; gap: 4px; color: var(--muted); font-weight: 600; font-size: 13px; margin-bottom: 6px; }
.back:hover { color: var(--text); }

/* ---------- Componentes ---------- */
.card {
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 22px; box-shadow: var(--shadow);
}
.card.flush { padding: 0; overflow: hidden; }
.card.narrow { max-width: 720px; }
.card + .card { margin-top: 18px; }
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.card-title { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; }
.small-title { font-size: 13px; display: flex; align-items: center; gap: 6px; color: var(--muted); margin-bottom: 12px; text-transform: uppercase; letter-spacing: .06em; }
.step { width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; background: var(--primary-soft); color: var(--primary); font-size: 13px; font-weight: 800; }
.link { display: inline-flex; align-items: center; gap: 2px; font-weight: 600; font-size: 13px; }
.count { background: var(--surface-2); border: 1px solid var(--border); border-radius: 99px; padding: 0 10px; font-size: 13px; font-weight: 700; color: var(--text-2); }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 40px; padding: 0 16px; border-radius: 10px; border: 1px solid transparent;
  font: inherit; font-weight: 700; font-size: 14px; cursor: pointer; white-space: nowrap;
  transition: background .15s, border-color .15s, transform .05s, box-shadow .15s;
}
.btn:active { transform: translateY(1px); }
.btn-primary { background: var(--primary); color: var(--on-primary, #fff); box-shadow: 0 4px 12px color-mix(in srgb, var(--brand, #4f46e5) 25%, transparent); }
.btn-primary:hover { background: var(--primary-600); }
.btn-soft { background: var(--primary-soft); color: var(--primary); }
.btn-soft:hover { filter: brightness(.97); }
.btn-ghost { background: var(--surface); color: var(--text-2); border-color: var(--border); }
.btn-ghost:hover { border-color: var(--border-strong); color: var(--text); }
.btn-danger { background: var(--danger); color: #fff; }
.btn-danger:hover { filter: brightness(.95); }
.btn-sm { height: 32px; padding: 0 12px; font-size: 13px; border-radius: 8px; }
.btn-lg { height: 48px; padding: 0 22px; font-size: 15px; }
.btn-block { width: 100%; }
.danger-text { color: var(--danger) !important; }
.icon-btn {
  display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 9px;
  border: 0; background: transparent; color: var(--text-2); cursor: pointer;
}
.icon-btn:hover { background: var(--surface-2); color: var(--text); }

.badge {
  display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px;
  border-radius: 99px; font-size: 12px; font-weight: 700; white-space: nowrap;
}
.badge-ok, .badge-free { background: var(--success-soft); color: var(--success); }
.badge-busy { background: #fff1e6; color: #c2410c; }
.badge-muted { background: var(--surface-2); color: var(--muted); border: 1px solid var(--border); }
.badge-off { background: var(--danger-soft); color: var(--danger); }
.badge-admin { background: var(--secondary-soft, var(--primary-soft)); color: var(--secondary-ink, var(--primary)); }
.badge-live { background: #fff1e6; color: #c2410c; }
.badge-live i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; animation: pulse 1.6s infinite; }
[data-theme="dark"] .badge-busy, [data-theme="dark"] .badge-live { background: #3b2416; color: #fdba74; }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }
.tag { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 6px; background: var(--surface-2); border: 1px solid var(--border); color: var(--text-2); font-size: 11.5px; font-weight: 700; }
.chip {
  display: inline-flex; align-items: center; gap: 7px; height: 26px; padding: 0 11px 0 9px; border-radius: 99px;
  background: color-mix(in srgb, var(--c) 12%, transparent); color: color-mix(in srgb, var(--c) 80%, var(--text));
  font-size: 12.5px; font-weight: 700; white-space: nowrap;
}
.chip i { width: 8px; height: 8px; border-radius: 50%; background: var(--c); }
.avatar {
  width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; flex-shrink: 0;
  background: color-mix(in srgb, var(--c) 18%, var(--surface)); color: color-mix(in srgb, var(--c) 85%, var(--text));
  font-weight: 800; font-size: 13px; border: 2px solid var(--surface); box-shadow: 0 0 0 1px var(--border);
}
.avatar.sm { width: 32px; height: 32px; font-size: 12px; }
.avatar.xl { width: 64px; height: 64px; font-size: 22px; }
.room-dot { display: inline-block; width: 10px; height: 10px; border-radius: 3px; background: var(--c); flex-shrink: 0; }

.alert {
  display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 12px; margin-bottom: 16px;
  font-weight: 600; font-size: 14px; border: 1px solid transparent;
}
.alert span { flex: 1; }
.alert-success { background: var(--success-soft); color: var(--success); }
.alert-error { background: var(--danger-soft); color: var(--danger); }
.alert-info { background: var(--primary-soft); color: var(--primary); }
.alert-x { border: 0; background: none; color: inherit; cursor: pointer; opacity: .6; padding: 2px; }
.alert-x:hover { opacity: 1; }
.alert.hide { opacity: 0; transform: translateY(-6px); transition: .3s; }

.empty { text-align: center; padding: 40px 20px; color: var(--muted); display: flex; flex-direction: column; align-items: center; gap: 12px; }
.empty.small { padding: 24px 10px; }
.empty .ico { color: var(--border-strong); }
.empty-row { text-align: center; color: var(--muted); padding: 40px !important; }

/* ---------- Formularios ---------- */
.form { display: flex; flex-direction: column; gap: 16px; }
.field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.field > span { font-size: 13px; font-weight: 700; color: var(--text-2); display: flex; align-items: center; gap: 6px; }
input[type=text], input[type=email], input[type=password], input[type=number], input[type=date], input[type=time], input[type=url], input[type=tel], input[type=search], input:not([type]), select, textarea {
  width: 100%; height: 42px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--border-strong);
  background: var(--surface); color: var(--text); font: inherit; font-size: 14.5px; transition: border-color .15s, box-shadow .15s;
}
textarea { height: auto; padding: 10px 12px; resize: vertical; line-height: 1.5; }
select {
  appearance: none; padding-right: 34px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237c8299' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center;
}
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary) 18%, transparent); }
.check { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 500; cursor: pointer; color: var(--text-2); }
.check input { width: 18px; height: 18px; accent-color: var(--primary); }
fieldset { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
legend { font-weight: 800; font-size: 14px; margin-bottom: 12px; padding: 0; }
.hint { font-size: 13px; color: var(--muted); display: flex; gap: 6px; align-items: flex-start; }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 16px; }
.span-2 { grid-column: span 2; }
.form-actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 4px; }
.form-actions.stack { flex-direction: column; align-items: stretch; margin-top: 18px; }
.cap-hint { font-size: 12px; color: var(--muted); }
.cap-hint.warn { color: var(--danger); font-weight: 700; }

.toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 18px; }
.toolbar.filters { justify-content: flex-start; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px; }
.toolbar.filters select, .toolbar.filters input { width: auto; height: 38px; }
.toolbar.filters .search-box { flex: 1; min-width: 200px; }
.toolbar.filters .list-count { flex: 1 1 100%; margin: 0; }
.mini-field { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--muted); }
.inline-form { display: flex; gap: 8px; }
.inline-form select, .inline-form input { width: auto; height: 38px; }
.search-box { position: relative; display: flex; align-items: center; }
.search-box .ico { position: absolute; left: 12px; color: var(--muted); pointer-events: none; }
.search-box input { padding-left: 36px; }

.seg { display: inline-flex; background: var(--surface); border: 1px solid var(--border); border-radius: 11px; padding: 3px; gap: 2px; }
.seg a { padding: 7px 14px; border-radius: 8px; font-weight: 700; font-size: 13.5px; color: var(--text-2); white-space: nowrap; }
.seg a.on { background: var(--primary); color: var(--on-primary, #fff); }
.seg.sm a { padding: 5px 12px; font-size: 13px; }
.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--border); }
.tabs a { padding: 10px 14px; font-weight: 700; color: var(--muted); border-bottom: 2px solid transparent; margin-bottom: -1px; display: flex; gap: 8px; align-items: center; }
.tabs a span { background: var(--surface-2); border: 1px solid var(--border); border-radius: 99px; padding: 0 8px; font-size: 12px; }
.tabs a.on { color: var(--primary); border-color: var(--primary); }
.date-nav { display: flex; align-items: center; gap: 6px; }
.date-nav .range { margin-left: 10px; font-size: 17px; }

/* ---------- Dashboard ---------- */
.stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 22px; }
.stat { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 18px; display: flex; gap: 14px; align-items: center; box-shadow: var(--shadow); }
.stat strong { display: block; font-size: 26px; font-weight: 800; line-height: 1.1; letter-spacing: -.02em; }
.stat strong small { font-size: 15px; color: var(--muted); font-weight: 700; }
.stat span:not(.stat-ico) { font-size: 13px; color: var(--muted); font-weight: 600; }
.stat-ico { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; flex-shrink: 0; }
.stat-ico.i1 { background: #e7f8f1; color: #059669; }
.stat-ico.i2 { background: var(--stat2-bg, #eef0ff); color: var(--stat2-fg, #4f46e5); }
.stat-ico.i3 { background: #fff4e5; color: #d97706; }
.stat-ico.i4 { background: #fdeef7; color: #db2777; }
[data-theme="dark"] .stat-ico.i1 { background: #11302a; color: #34d399; }
[data-theme="dark"] .stat-ico.i2 { background: var(--stat2-bg, #23264a); color: var(--stat2-fg, #a5b4fc); }
[data-theme="dark"] .stat-ico.i3 { background: #35260f; color: #fbbf24; }
[data-theme="dark"] .stat-ico.i4 { background: #3a1730; color: #f472b6; }

.dash-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 20px; align-items: start; }
.dash-side { display: flex; flex-direction: column; gap: 18px; }
.dash-side .card + .card { margin-top: 0; }

.rooms-today { display: flex; flex-direction: column; gap: 6px; }
.room-row { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 16px; align-items: center; padding: 10px 0; border-bottom: 1px dashed var(--border); }
.room-row:last-of-type { border-bottom: 0; }
.room-info { display: flex; align-items: center; gap: 10px; }
.room-info > div { flex: 1; min-width: 0; }
.room-info strong { display: block; font-size: 14.5px; }
.room-info small { color: var(--muted); font-size: 12.5px; display: flex; align-items: center; gap: 4px; }
.room-info .room-dot { width: 12px; height: 34px; border-radius: 4px; }
.timeline { position: relative; height: 42px; background: repeating-linear-gradient(90deg, var(--surface-2) 0 calc(100% / 12 - 1px), var(--border) calc(100% / 12 - 1px) calc(100% / 12)); border-radius: 10px; border: 1px solid var(--border); overflow: hidden; }
.tl-block {
  position: absolute; top: 4px; bottom: 4px; border-radius: 7px; padding: 0 8px; display: flex; align-items: center; overflow: hidden;
  background: color-mix(in srgb, var(--c) 20%, var(--surface)); border-left: 3px solid var(--c);
  color: color-mix(in srgb, var(--c) 70%, var(--text)); font-size: 12px; font-weight: 700; transition: filter .15s;
}
.tl-block span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tl-block.mine { background: var(--c); color: #fff; }
.tl-block:hover { filter: brightness(.95); z-index: 2; }
.tl-now { position: absolute; top: 0; bottom: 0; width: 2px; background: var(--danger); z-index: 3; }
.tl-now::before { content: ""; position: absolute; top: -3px; left: -3px; width: 8px; height: 8px; border-radius: 50%; background: var(--danger); }
.tl-add { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 26px; height: 26px; border-radius: 7px; display: grid; place-items: center; background: var(--surface); color: var(--primary); border: 1px solid var(--border); opacity: 0; transition: opacity .15s; z-index: 4; }
.room-row:hover .tl-add { opacity: 1; }
.tl-scale { position: relative; height: 18px; margin-left: 296px; font-size: 11px; color: var(--muted); font-weight: 600; }
.tl-scale span { position: absolute; transform: translateX(-50%); }
.tl-scale span:first-child { transform: none; }
.tl-scale span:last-child { transform: translateX(-100%); }

.agenda { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.agenda-day { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin: 10px 0 2px; }
.agenda-day:first-child { margin-top: 0; }
.agenda-item { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 11px; background: var(--surface-2); border: 1px solid var(--border); color: var(--text); position: relative; transition: border-color .15s, transform .15s; }
.agenda-item::before { content: ""; position: absolute; left: 0; top: 10px; bottom: 10px; width: 3px; border-radius: 0 3px 3px 0; background: var(--c); }
.agenda-item:hover { border-color: var(--border-strong); transform: translateX(2px); }
.agenda-time { display: flex; flex-direction: column; font-weight: 800; font-size: 14px; min-width: 46px; }
.agenda-time small { font-weight: 600; color: var(--muted); font-size: 12px; }
.agenda-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.agenda-body strong { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.agenda-body small { color: var(--muted); font-size: 12.5px; display: flex; align-items: center; gap: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.bars { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; height: 150px; }
.bar { display: flex; flex-direction: column; align-items: center; gap: 4px; color: var(--text); }
.bar-track { flex: 1; width: 100%; max-width: 30px; background: var(--surface-2); border-radius: 8px; display: flex; align-items: flex-end; overflow: hidden; border: 1px solid var(--border); }
.bar-fill { width: 100%; background: linear-gradient(180deg, #818cf8, var(--primary)); border-radius: 6px; transition: height .4s; }
.bar b { font-size: 11.5px; }
.bar small { font-size: 11px; color: var(--muted); font-weight: 600; white-space: nowrap; }
.bar:hover .bar-fill { filter: brightness(1.1); }

/* ---------- Ocupación (agenda) ---------- */
.sched-wrap { overflow-x: auto; }
.sched { min-width: calc(64px + var(--cols) * 150px); }
.sched-head { display: grid; grid-template-columns: 64px repeat(var(--cols), minmax(150px, 1fr)); position: sticky; top: 0; background: var(--surface); z-index: 5; border-bottom: 1px solid var(--border); }
.col-head { padding: 12px; display: flex; gap: 8px; align-items: center; border-left: 1px solid var(--border); }
.col-head strong { display: block; font-size: 14px; }
.col-head small { color: var(--muted); font-size: 12px; }
.col-head.today strong { color: var(--primary); }
.col-head .room-dot { width: 10px; height: 26px; }
.sched-body { display: grid; grid-template-columns: 64px repeat(var(--cols), minmax(150px, 1fr)); }
.sched-body .gutter { position: relative; }
.sched-body .gutter span { position: absolute; right: 10px; transform: translateY(-50%); font-size: 11.5px; color: var(--muted); font-weight: 600; }
.sched-body .gutter span:first-child { transform: translateY(2px); }
.col {
  position: relative; border-left: 1px solid var(--border); cursor: crosshair;
  background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(color-mix(in srgb, var(--border) 50%, transparent) 1px, transparent 1px);
  background-size: 100% var(--hour), 100% calc(var(--hour) / 2);
}
.col.today { background-color: color-mix(in srgb, var(--primary) 3%, transparent); }
.col.past { background-color: var(--surface-2); cursor: default; }
.ev {
  position: absolute; left: 4px; right: 4px; border-radius: 9px; padding: 6px 9px; overflow: hidden; z-index: 2;
  background: color-mix(in srgb, var(--c) 16%, var(--surface)); border-left: 4px solid var(--c);
  color: var(--text); display: flex; flex-direction: column; gap: 1px; box-shadow: 0 1px 2px rgba(0,0,0,.05);
  transition: transform .12s, box-shadow .12s;
}
.ev:hover { transform: scale(1.015); box-shadow: 0 6px 18px rgba(0,0,0,.12); z-index: 3; }
.ev strong { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ev small { font-size: 11.5px; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; align-items: center; gap: 3px; }
.ev.mine { background: var(--c); color: #fff; }
.ev.mine small { color: rgba(255,255,255,.85); }
.ev.compact { flex-direction: row; align-items: center; gap: 6px; padding: 2px 8px; }
.now-line { position: absolute; left: 0; right: 0; height: 2px; background: var(--danger); z-index: 4; pointer-events: none; }
.now-line::before { content: ""; position: absolute; left: -5px; top: -4px; width: 10px; height: 10px; border-radius: 50%; background: var(--danger); }
.ghost {
  position: absolute; left: 4px; right: 4px; border-radius: 9px; border: 2px dashed var(--primary); background: color-mix(in srgb, var(--primary) 8%, transparent);
  pointer-events: none; display: flex; align-items: flex-start; padding: 4px 8px; font-size: 12px; font-weight: 700; color: var(--primary); z-index: 1;
}
.legend { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 14px; font-size: 13px; color: var(--muted); }
.legend span { display: flex; align-items: center; gap: 6px; }
.lg { width: 14px; height: 14px; border-radius: 4px; display: inline-block; }
.lg.mine { background: var(--primary); }
.lg.other { background: color-mix(in srgb, var(--primary) 18%, var(--surface)); border-left: 3px solid var(--primary); }
.lg.free { border: 2px dashed var(--primary); }

/* ---------- Formulario de reserva ---------- */
.booking { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 20px; align-items: start; }
.booking-main { display: flex; flex-direction: column; gap: 18px; }
.booking-main .card + .card { margin-top: 0; }
.sticky { position: sticky; top: 24px; }
.room-picker { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; margin-bottom: 18px; }
.room-opt { position: relative; cursor: pointer; }
.room-opt input { position: absolute; opacity: 0; pointer-events: none; }
.room-opt-body { display: flex; flex-direction: column; gap: 3px; padding: 12px 14px 12px 18px; border-radius: 12px; border: 1.5px solid var(--border); background: var(--surface); height: 100%; position: relative; transition: border-color .15s, box-shadow .15s; }
.room-opt-body::before { content: ""; position: absolute; left: 0; top: 12px; bottom: 12px; width: 4px; border-radius: 0 4px 4px 0; background: var(--c); }
.room-opt-body strong { font-size: 14px; }
.room-opt-body small { color: var(--muted); font-size: 12px; display: flex; align-items: center; gap: 4px; }
.room-opt-body .equip { display: block; }
.room-opt:hover .room-opt-body { border-color: var(--border-strong); }
.room-opt input:checked + .room-opt-body { border-color: var(--c); box-shadow: 0 0 0 3px color-mix(in srgb, var(--c) 20%, transparent); background: color-mix(in srgb, var(--c) 5%, var(--surface)); }
.room-opt input:focus-visible + .room-opt-body { outline: 2px solid var(--primary); outline-offset: 2px; }

.availability { margin-top: 16px; }
.av-track { position: relative; height: 34px; background: var(--success-soft); border-radius: 9px; overflow: hidden; border: 1px solid var(--border); }
.av-blocks .b { position: absolute; top: 0; bottom: 0; background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--muted) 30%, var(--surface)) 0 6px, color-mix(in srgb, var(--muted) 18%, var(--surface)) 6px 12px); border-left: 1px solid var(--surface); border-right: 1px solid var(--surface); }
.av-sel { position: absolute; top: 3px; bottom: 3px; border-radius: 6px; background: var(--primary); opacity: .85; transition: left .2s, width .2s, background .2s; }
.av-sel.clash { background: var(--danger); }
.av-scale { position: relative; height: 18px; font-size: 11px; color: var(--muted); font-weight: 600; margin-top: 4px; }
.av-scale span { position: absolute; transform: translateX(-50%); }
.av-scale span:first-child { transform: none; }
.av-scale span:last-child { transform: translateX(-100%); }
.av-msg { font-size: 13px; font-weight: 600; margin-top: 8px; display: flex; align-items: center; gap: 6px; min-height: 20px; }
.av-msg.ok { color: var(--success); }
.av-msg.ko { color: var(--danger); }
.conflict-card { border-color: var(--danger); background: var(--danger-soft); color: var(--danger); margin-bottom: 18px; }
.conflict-card ul { margin: 6px 0 0; padding-left: 20px; }

.people-picker { position: relative; display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chips:empty { display: none; }
.pchip { display: inline-flex; align-items: center; gap: 6px; padding: 3px 4px 3px 10px; border-radius: 99px; background: var(--primary-soft); color: var(--primary); font-size: 13px; font-weight: 700; }
.pchip button { border: 0; background: none; color: inherit; cursor: pointer; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; }
.pchip button:hover { background: color-mix(in srgb, var(--primary) 15%, transparent); }
.suggest { position: absolute; left: 0; right: 0; top: 100%; margin: 4px 0 0; padding: 6px; list-style: none; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; box-shadow: var(--shadow-lg); max-height: 280px; overflow-y: auto; z-index: 20; }
.suggest li { padding: 8px 10px; border-radius: 8px; cursor: pointer; display: flex; flex-direction: column; }
.suggest li small { color: var(--muted); font-size: 12px; }
.suggest li.on, .suggest li:hover { background: var(--primary-soft); }
.suggest li.none { color: var(--muted); cursor: default; background: none; }

/* ---------- Detalle ---------- */
.detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 20px; align-items: start; }
.detail-grid aside { display: flex; flex-direction: column; gap: 18px; }
.detail-grid aside .card + .card { margin-top: 0; }
.detail-grid aside form + form { margin-top: 8px; }
.when { display: flex; gap: 18px; align-items: center; padding-bottom: 20px; border-bottom: 1px solid var(--border); margin-bottom: 20px; }
.when-date { width: 68px; height: 72px; border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; text-align: center; border: 1px solid var(--border); flex-shrink: 0; }
.when-date span { background: var(--c); color: #fff; font-size: 12px; font-weight: 800; text-transform: uppercase; padding: 3px 0; }
.when-date strong { flex: 1; display: grid; place-items: center; font-size: 28px; font-weight: 800; }
.lead { font-size: 18px; font-weight: 700; margin-top: 2px; }
.facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; margin: 0; }
.facts dt { font-size: 12px; font-weight: 700; color: var(--muted); display: flex; gap: 6px; align-items: center; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 4px; }
.facts dd { margin: 0; font-weight: 600; display: flex; align-items: center; gap: 8px; }
.desc { margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--border); }
.desc h3 { margin-bottom: 8px; }
.desc p { color: var(--text-2); }
.meta-line { margin-top: 22px; }
.people { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.people li { display: flex; align-items: center; gap: 10px; }
.people li > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.people strong { font-size: 14px; }
.people small { font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.danger-zone h2 { margin-bottom: 4px; }
.danger-zone form { margin-top: 14px; display: flex; flex-direction: column; gap: 12px; }

/* ---------- Mis reuniones ---------- */
.res-list { display: flex; flex-direction: column; gap: 8px; }
.list-day { margin: 18px 0 4px; font-size: 14px; display: flex; align-items: baseline; gap: 8px; }
.list-day:first-child { margin-top: 0; }
.list-day small { color: var(--muted); font-weight: 600; font-size: 12.5px; }
.res-card { display: flex; align-items: center; gap: 16px; padding: 14px 18px; background: var(--surface); border: 1px solid var(--border); border-radius: 13px; color: var(--text); box-shadow: var(--shadow); position: relative; transition: border-color .15s, transform .15s; }
.res-card::before { content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 4px; border-radius: 0 4px 4px 0; background: var(--c); }
.res-card:hover { border-color: var(--border-strong); transform: translateY(-1px); }
.res-card.cancelled { opacity: .6; }
.res-card.cancelled strong { text-decoration: line-through; }
.res-time { display: flex; flex-direction: column; min-width: 52px; }
.res-time strong { font-size: 16px; }
.res-time small { color: var(--muted); font-weight: 600; }
.res-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.res-body strong { font-size: 15px; }
.res-body small { color: var(--muted); font-size: 13px; display: flex; align-items: center; gap: 4px; }
.res-side { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }

/* ---------- Tablas de administración ---------- */
.table-wrap { overflow-x: auto; }
.table { width: 100%; border-collapse: collapse; font-size: 14px; }
.table th { text-align: left; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); font-weight: 700; padding: 12px 16px; background: var(--surface-2); border-bottom: 1px solid var(--border); white-space: nowrap; }
.table td { padding: 12px 16px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.table tr:last-child td { border-bottom: 0; }
.table tbody tr:hover { background: var(--surface-2); }
.table tr.inactive td { opacity: .55; }
.table .actions { text-align: right; }
.table .actions form { display: inline; }
.person { display: flex; align-items: center; gap: 10px; }
.person > span:last-child { display: flex; flex-direction: column; }
.person small { color: var(--muted); font-size: 12.5px; }
.strong-link { font-weight: 700; color: var(--text); }
.strong-link:hover { color: var(--primary); }
.pager { display: flex; justify-content: center; align-items: center; gap: 14px; margin-top: 18px; }
.usage { display: flex; flex-direction: column; gap: 4px; min-width: 160px; }
.usage small { color: var(--muted); font-size: 12px; }

.room-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.room-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 20px; box-shadow: var(--shadow); border-top: 4px solid var(--c); display: flex; flex-direction: column; gap: 14px; }
.room-card.inactive { opacity: .6; }
.room-card-top { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; }
.room-card-top p { display: flex; align-items: center; gap: 4px; margin-top: 2px; }
.room-card-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.room-card-stats div { background: var(--surface-2); border-radius: 10px; padding: 10px; text-align: center; }
.room-card-stats strong { display: block; font-size: 20px; font-weight: 800; }
.room-card-stats small { font-size: 11.5px; color: var(--muted); font-weight: 600; }
.meter { display: block; height: 6px; border-radius: 99px; background: var(--surface-2); overflow: hidden; border: 1px solid var(--border); }
.meter span { display: block; height: 100%; background: var(--c, var(--primary)); border-radius: 99px; }
.equip { color: var(--text-2); }
.room-card-actions { display: flex; gap: 8px; margin-top: auto; }

/* ---------- Modal ---------- */
.modal-wrap { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 20px; overflow-y: auto; }
.modal-scrim { position: fixed; inset: 0; background: rgba(15, 17, 35, .5); backdrop-filter: blur(3px); animation: fade .2s; }
.modal { position: relative; width: 100%; max-width: 680px; box-shadow: var(--shadow-lg); animation: pop .22s cubic-bezier(.2, .9, .3, 1.2); }
.modal.narrow { max-width: 480px; }
@keyframes fade { from { opacity: 0; } }
@keyframes pop { from { opacity: 0; transform: translateY(12px) scale(.98); } }

.swatches { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.swatch { position: relative; cursor: pointer; }
.swatch input[type=radio] { position: absolute; opacity: 0; pointer-events: none; }
.swatch span { display: block; width: 30px; height: 30px; border-radius: 9px; background: var(--c); border: 3px solid var(--surface); box-shadow: 0 0 0 1px var(--border); transition: box-shadow .15s; }
.swatch input:checked + span { box-shadow: 0 0 0 2px var(--c); }
.swatch.custom input[type=color] { width: 34px; height: 34px; border: 1px dashed var(--border-strong); border-radius: 9px; padding: 2px; background: var(--surface); cursor: pointer; }
.swatch.custom:has(input[type=radio]:checked) input[type=color] { border: 2px solid var(--primary); }

/* ---------- Perfil ---------- */
.profile-head { display: flex; gap: 16px; align-items: center; margin-bottom: 22px; padding-bottom: 22px; border-bottom: 1px solid var(--border); }
.profile-head h2 { font-size: 20px; }
.profile-head .chip { margin-top: 8px; }

/* ---------- Acceso e instalador ---------- */
body.bare { background: radial-gradient(1200px 600px at 10% -10%, #e0e7ff 0, transparent 60%), radial-gradient(900px 600px at 110% 110%, #fce7f3 0, transparent 55%), var(--bg); }
[data-theme="dark"] body.bare { background: radial-gradient(1200px 600px at 10% -10%, #1e1b4b 0, transparent 60%), radial-gradient(900px 600px at 110% 110%, #3b0d2e 0, transparent 55%), var(--bg); }
.auth-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; gap: 60px; padding: 24px; }
.auth-card { width: 100%; max-width: 420px; background: var(--surface); border: 1px solid var(--border); border-radius: 20px; padding: 34px; box-shadow: var(--shadow-lg); display: flex; flex-direction: column; gap: 18px; }
.auth-card.wide { max-width: 720px; }
.auth-brand { display: flex; gap: 14px; align-items: center; margin-bottom: 4px; }
.auth-brand .brand-mark { width: 48px; height: 48px; border-radius: 14px; }
.auth-brand h1 { font-size: 22px; }
.auth-art { position: relative; width: 340px; height: 440px; }
.art-card { position: absolute; width: 280px; background: var(--surface); border: 1px solid var(--border); border-radius: 16px; padding: 14px 18px 14px 22px; box-shadow: var(--shadow-lg); display: flex; align-items: center; gap: 12px; animation: float 6s ease-in-out infinite; }
.art-card > div { display: flex; flex-direction: column; min-width: 0; }
.art-ico { width: 38px; height: 38px; border-radius: 11px; flex-shrink: 0; display: grid; place-items: center; font-style: normal; background: color-mix(in srgb, var(--k) 14%, var(--surface)); color: var(--k); }
.art-card span { position: absolute; left: 0; top: 14px; bottom: 14px; width: 5px; border-radius: 0 5px 5px 0; }
.art-card b { font-size: 14px; }
.art-card small { color: var(--muted); }
.art-card.c1 { top: 10px; left: 0; --k: var(--brand, #4f46e5); } .art-card.c1 span { background: var(--k); }
.art-card.c2 { top: 120px; left: 60px; animation-delay: -2s; --k: #ec4899; } .art-card.c2 span { background: var(--k); }
.art-card.c3 { top: 230px; left: 20px; animation-delay: -4s; --k: #10b981; } .art-card.c3 span { background: var(--k); }
.art-card.c4 { top: 340px; left: 70px; animation-delay: -1s; --k: #f59e0b; } .art-card.c4 span { background: var(--k); }
@keyframes float { 50% { transform: translateY(-8px); } }
.checks { list-style: none; padding: 0; margin: 0; display: grid; gap: 4px; font-size: 14px; font-weight: 600; }
.checks .ok { color: var(--success); }
.checks .ko { color: var(--danger); }
textarea.code { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 12.5px; }

/* ---------- Responsive ---------- */
@media (max-width: 1180px) {
  .dash-grid, .booking, .detail-grid { grid-template-columns: minmax(0, 1fr); }
  .sticky { position: static; }
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .sidebar { position: fixed; left: 0; top: 0; bottom: 0; transform: translateX(-100%); transition: transform .25s ease; box-shadow: var(--shadow-lg); }
  body.nav-open .sidebar { transform: none; }
  body.nav-open .scrim { display: block; position: fixed; inset: 0; background: rgba(15, 17, 35, .45); z-index: 30; }
  .topbar { height: 56px; padding: 0 10px; gap: 6px; background: var(--surface); }
  .topbar .menu-btn { display: inline-grid; }
  .crumbs li:not([aria-current]) { display: none; }
  .crumbs li[aria-current] .ico { display: none; }
  .crumbs ol { font-size: 15.5px; }
  .crumbs li[aria-current] { font-weight: 800; }
  .umenu { margin-left: 2px; }
  .umenu-btn { padding: 2px; }
  .umenu-btn .me-text, .umenu-btn > .ico { display: none; }
  .content { padding: 20px 16px 48px; }
  h1 { font-size: 23px; }
  .room-row { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .tl-scale { margin-left: 0; }
  .tl-add { opacity: 1; }
  .auth-art { display: none; }
}
@media (max-width: 640px) {
  .grid-2, .grid-3, .facts { grid-template-columns: minmax(0, 1fr); }
  .span-2 { grid-column: auto; }
  .stats { gap: 10px; }
  .stat { padding: 14px; gap: 10px; }
  .stat-ico { width: 38px; height: 38px; }
  .stat strong { font-size: 22px; }
  .card { padding: 18px; }
  .page-head > .btn { display: none; }
  .res-card { flex-wrap: wrap; }
  .res-side { width: 100%; justify-content: flex-start; padding-left: 68px; }
  .date-nav .range { font-size: 15px; width: 100%; margin: 6px 0 0; }
  .date-nav { flex-wrap: wrap; }
  .auth-card { padding: 24px; }
  .toolbar.filters > * { flex: 1 1 100%; }
  .toolbar.filters select, .toolbar.filters input { width: 100%; }
}

/* ---------- Ajustes ---------- */
[hidden] { display: none !important; }
.col ~ .col .now-line::before { display: none; }
.booking .card { display: flex; flex-direction: column; gap: 16px; }
.booking .card-title { margin-bottom: 2px; }
.booking .room-picker { margin-bottom: 2px; }
.booking .availability { margin-top: 0; }
.toolbar.filters .search-box input { width: 100%; min-width: 0; }
@media (max-width: 640px) {
  .room-picker { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .room-opt-body { padding: 10px 10px 10px 14px; }
  .room-opt-body .equip { display: none; }
}
@media (max-width: 640px) {
  .av-scale span:nth-child(even), .tl-scale span:nth-child(even) { display: none; }
}

/* ---------- v1.1: logotipos, fotos de perfil ---------- */
.avatar.has-img { padding: 0; overflow: hidden; background: var(--surface-2); }
.avatar.has-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.avatar.xs { width: 24px; height: 24px; font-size: 10px; border-width: 1px; }
.facts dd .avatar.xs { margin-right: 2px; }

.chip.has-logo { padding-left: 4px; }
.chip img { height: 18px; width: auto; max-width: 54px; border-radius: 4px; object-fit: contain; background: #fff; padding: 1px 3px; }

.logo-box { width: 64px; height: 44px; border-radius: 11px; border: 1px solid var(--border); background: #fff; display: inline-grid; place-items: center; overflow: hidden; flex-shrink: 0; vertical-align: middle; }
.logo-box img { max-width: 86%; max-height: 86%; object-fit: contain; }
.logo-box.noimg { background: color-mix(in srgb, var(--c) 14%, var(--surface)); color: color-mix(in srgb, var(--c) 85%, var(--text)); font-weight: 800; font-size: 14px; border-color: transparent; }
.logo-box.sm { width: 44px; height: 28px; border-radius: 7px; font-size: 11px; }
.company-cell { display: flex; align-items: center; gap: 12px; }
.company-cell > div { display: flex; flex-direction: column; }
.company-cell small { color: var(--muted); font-size: 12px; display: flex; align-items: center; gap: 6px; }
.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--c); display: inline-block; }

.badge-warn { background: #fff4e5; color: #b45309; }
[data-theme="dark"] .badge-warn { background: #35260f; color: #fbbf24; }

.uploader { display: flex; align-items: center; gap: 16px; }
.uploader-body { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.uploader-body .btn { cursor: pointer; }
.uploader-preview { display: grid; place-items: center; color: var(--muted); transition: opacity .2s; }
.uploader-preview.logo { width: 120px; height: 72px; border: 1.5px dashed var(--border-strong); border-radius: 12px; background: #fff; overflow: hidden; }
.uploader-preview.logo img { max-width: 90%; max-height: 85%; object-fit: contain; }
.uploader-preview.removed { opacity: .3; }

.profile-head { align-items: center; }
.avatar-edit { position: relative; display: block; cursor: pointer; border-radius: 50%; }
.avatar-edit .avatar.xl { width: 88px; height: 88px; font-size: 28px; }
.avatar-edit-badge { position: absolute; right: 0; bottom: 0; width: 30px; height: 30px; border-radius: 50%; background: var(--primary); color: var(--on-primary, #fff); display: grid; place-items: center; border: 3px solid var(--surface); transition: transform .15s; }
.avatar-edit:hover .avatar-edit-badge { transform: scale(1.1); }
.avatar-edit:focus-within { outline: 2px solid var(--primary); outline-offset: 3px; }
.profile-id { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.photo-actions { display: flex; align-items: center; gap: 14px; margin-top: 6px; }
.link-btn { color: var(--primary); font-weight: 700; font-size: 13.5px; cursor: pointer; }
.link-btn:hover { text-decoration: underline; }
.dirty-note.warn { color: var(--warning); font-weight: 600; }
.btn:disabled { opacity: .45; cursor: not-allowed; box-shadow: none; transform: none; }
.company-hint { font-size: 12px; color: var(--muted); min-height: 16px; }
.company-hint a { font-weight: 700; }

/* ---------- Selector de tema claro / oscuro ---------- */
.theme-toggle .ico-sun { display: none; }
[data-theme="dark"] .theme-toggle .ico-sun { display: block; }
[data-theme="dark"] .theme-toggle .ico-moon { display: none; }
.theme-toggle svg { transition: transform .35s ease; }
.theme-toggle:hover svg { transform: rotate(-20deg); }
.theme-float { position: fixed; top: 16px; right: 16px; z-index: 30; background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow); }
html.theme-anim, html.theme-anim *, html.theme-anim *::before, html.theme-anim *::after {
  transition: background-color .3s ease, border-color .3s ease, color .3s ease, fill .3s ease !important;
}

/* ---------- Reservar en nombre de otra persona (admin) ---------- */
.behalf-card { display: flex; gap: 14px; align-items: flex-start; border-style: dashed; transition: border-color .2s, background-color .2s; }
.behalf-card .field { flex: 1; margin: 0; }
.behalf-ico { flex: none; width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; background: var(--surface-2); color: var(--muted); transition: inherit; }
.behalf-card.on { border-style: solid; border-color: var(--primary); background: linear-gradient(0deg, var(--primary-soft), var(--primary-soft)) padding-box; }
.behalf-card.on .behalf-ico { background: var(--primary); color: var(--on-primary, #fff); }
.behalf-hint { color: var(--primary); font-weight: 600; }

/* ---------- Ajustes responsive (v1.4) ---------- */
.booking .behalf-card { flex-direction: row; }
.nav-switch { margin-top: 10px; border: 1px dashed var(--border-strong); }
.tabs { overflow-x: auto; scrollbar-width: none; max-width: 100%; }
.tabs::-webkit-scrollbar { display: none; }
.tabs a { white-space: nowrap; flex: none; }
.toolbar > * { min-width: 0; max-width: 100%; }
.sched-body .gutter, .sched-head .gutter { position: sticky; left: 0; z-index: 4; background: var(--surface); }
@media (max-width: 900px) {
  .sidebar { box-shadow: none; visibility: hidden; transition: transform .25s ease, visibility 0s .25s; }
  body.nav-open .sidebar { box-shadow: var(--shadow-lg); visibility: visible; transition: transform .25s ease; }
  .page-head { margin-bottom: 18px; }
  .head-actions { width: 100%; }
  .head-actions .btn { flex: 1; }
}
@media (max-width: 640px) {
  .sched { min-width: calc(52px + var(--cols) * 130px); }
  .sched-head, .sched-body { grid-template-columns: 52px repeat(var(--cols), minmax(130px, 1fr)); }
  .table-wrap, .card.flush { overflow-x: auto; }
}
@media (hover: none) and (pointer: coarse) {
  /* Evita el zoom automático de iOS al enfocar campos */
  input[type=text], input[type=email], input[type=password], input[type=number], input[type=date], input[type=time], input[type=url], input[type=tel], input[type=search], input:not([type]), select, textarea { font-size: 16px; }
  .btn, .icon-btn, .tabs a, .seg a { touch-action: manipulation; }
}

/* ---------- Versión móvil reducida (body.lite) ---------- */
body.lite { padding-bottom: calc(84px + env(safe-area-inset-bottom)); }
.lite-top {
  position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 4px;
  height: calc(58px + env(safe-area-inset-top)); padding: env(safe-area-inset-top) 12px 0 14px;
  background: color-mix(in srgb, var(--surface) 88%, transparent); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--border);
}
.lite-top .brand { flex: 1; min-width: 0; padding: 0; }
.lite-top .brand-mark { width: 32px; height: 32px; border-radius: 9px; box-shadow: 0 4px 12px color-mix(in srgb, var(--brand, #4f46e5) 30%, transparent); }
.lite-top .brand-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lite-me { display: flex; padding: 2px; margin-left: 2px; border-radius: 50%; }
.lite-main .content { padding: 18px 16px 8px; max-width: 640px; }
.lite h1 { font-size: 24px; }
.lite .card { padding: 18px; }
.lite .card + .card { margin-top: 14px; }
.lite .page-head { margin-bottom: 16px; }
.lite .page-head > .btn, .lite .page-head p.muted { display: none; }
.lite-hello { margin-bottom: 16px; }

.lite-rooms { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.lite-rooms a {
  display: flex; align-items: center; gap: 12px; padding: 12px 10px 12px 12px; border-radius: 12px;
  background: var(--surface-2); border: 1px solid var(--border); color: var(--text); transition: border-color .15s, transform .1s;
}
.lite-rooms a:active { transform: scale(.98); }
.lite-rooms > li > a > .ico { color: var(--muted); }
.lite-rooms .room-dot { width: 10px; height: 46px; border-radius: 4px; }
.lr-body { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 3px; }
.lr-body strong { font-size: 15px; }
.lr-body small { color: var(--muted); font-size: 12.5px; display: flex; align-items: center; gap: 4px; }
.lr-body .badge { margin-top: 3px; height: 22px; font-size: 11.5px; }

.tabbar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 25;
  display: flex; justify-content: space-around; align-items: center; gap: 6px;
  padding: 8px 10px calc(8px + env(safe-area-inset-bottom));
  background: color-mix(in srgb, var(--surface) 92%, transparent); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  border-top: 1px solid var(--border);
}
.tabbar a { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 4px; min-width: 64px; font-size: 11.5px; font-weight: 700; color: var(--muted); -webkit-tap-highlight-color: transparent; }
.tabbar a.active { color: var(--primary); }
.tabbar .tab-new {
  flex-direction: row; gap: 6px; height: 48px; padding: 0 20px; border-radius: 99px; font-size: 15px;
  background: var(--primary); color: var(--on-primary, #fff); box-shadow: 0 8px 20px color-mix(in srgb, var(--primary) 38%, transparent);
}
.tabbar .tab-new.active { color: var(--on-primary, #fff); background: var(--primary-600); }
.lite-foot { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px 22px; padding: 18px 16px 12px; }
.lite-foot form { margin: 0; }
.lite-foot a, .lite-foot button { display: inline-flex; align-items: center; gap: 6px; padding: 6px 2px; background: none; border: 0; font: inherit; font-size: 13px; font-weight: 600; color: var(--muted); cursor: pointer; }

/* Formulario de reserva en móvil */
.lite .booking { grid-template-columns: minmax(0, 1fr); }
.lite .booking-main { gap: 14px; }
.lite .room-picker { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.lite .room-opt-body .equip { display: none; }
.lite .when-fields { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.lite .when-fields .field-date { grid-column: 1 / -1; }
.lite-booking .grid-3 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.lite-booking .grid-3 > .field:first-child { grid-column: 1 / -1; }
.more { gap: 0 !important; }
.more > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 12px; font-weight: 700; -webkit-tap-highlight-color: transparent; }
.more > summary::-webkit-details-marker { display: none; }
.more > summary > span:nth-child(2) { flex: 1; display: flex; flex-direction: column; }
.more > summary small { color: var(--muted); font-weight: 600; font-size: 12.5px; }
.more > summary > .ico:last-child { color: var(--muted); transition: transform .2s; }
.more[open] > summary > .ico:last-child { transform: rotate(90deg); }
.more-body { display: flex; flex-direction: column; gap: 16px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--border); }
.more-title { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--text-2); margin-top: 4px; }
.more .behalf-card { padding: 14px; box-shadow: none; }
.lite .form-actions.stack { display: flex; flex-direction: column; gap: 8px; margin-top: 4px; }

/* Detalle y listados en móvil */
.lite .detail-grid { grid-template-columns: minmax(0, 1fr); }
.lite .res-side .chip, .lite .res-side .muted { display: none; }
.lite .toolbar .seg { width: 100%; }
.lite .toolbar .seg a { flex: 1; text-align: center; }
.lite .tabs { gap: 0; }
.lite .tabs a { flex: 1 1 auto; justify-content: center; padding: 10px 8px; font-size: 14px; gap: 6px; }

/* ---------- Ajustes (v1.5) ---------- */
.h-ico { display: flex; align-items: center; gap: 8px; }
.h-ico .ico { color: var(--primary); }
.smtp-grid { display: grid; grid-template-columns: minmax(0, 1fr) 96px 150px; gap: 8px; }
.presets { display: inline-flex; flex-wrap: wrap; gap: 4px; margin-left: auto; }
.field > span .presets { font-weight: 500; }
.ph {
  display: inline-flex; align-items: center; height: 24px; padding: 0 8px; border-radius: 6px; cursor: pointer;
  border: 1px solid var(--border); background: var(--surface-2); color: var(--text-2);
  font: 600 12px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; transition: border-color .15s, color .15s, background .15s;
}
.presets .ph { font-family: inherit; font-size: 11.5px; }
.ph:hover { border-color: var(--primary); color: var(--primary); background: var(--primary-soft); }
.ph-row { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
.help { border: 1px solid var(--border); border-radius: 10px; padding: 0 12px; background: var(--surface-2); font-size: 13.5px; }
.help > summary { cursor: pointer; padding: 9px 0; color: var(--muted); font-weight: 600; display: flex; align-items: center; gap: 6px; list-style: none; }
.help > summary::-webkit-details-marker { display: none; }
.help[open] { padding-bottom: 12px; }
.help[open] > summary { color: var(--text-2); }
.help-list { margin: 0 0 10px; padding-left: 18px; color: var(--text-2); display: grid; gap: 4px; }
.mini-table { width: 100%; border-collapse: collapse; font-size: 13px; margin: 2px 0 8px; }
.mini-table th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); padding: 4px 6px; }
.mini-table td { padding: 5px 6px; border-top: 1px solid var(--border); vertical-align: top; }
.mini-table code { white-space: nowrap; }
.test-box { border-top: 1px dashed var(--border); padding-top: 16px; display: flex; flex-direction: column; gap: 6px; }
.inline-field { display: flex; gap: 8px; }
.inline-field input { flex: 1; min-width: 0; }
.inline-field .btn { flex: none; }
.test-result { margin: 6px 0 0; }
.subjects { gap: 0; }
.subject-item { padding: 16px 0; border-top: 1px solid var(--border); display: flex; flex-direction: column; gap: 6px; transition: opacity .2s; }
.subject-item:first-of-type { border-top: 0; padding-top: 8px; }
.subject-item.off > :not(.subject-head) { opacity: .45; }
.subject-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.subject-head .check { color: var(--text); }
.link-btn { border: 0; background: none; padding: 2px 4px; font: inherit; font-size: 12.5px; font-weight: 600; color: var(--muted); cursor: pointer; }
.link-btn:hover { color: var(--primary); }
.subject-item input[data-subject] { font-family: inherit; }
.subject-preview { font-size: 13px; color: var(--muted); display: flex; gap: 6px; align-items: baseline; min-width: 0; }
.subject-preview b { color: var(--text); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.subject-preview.warn b { color: var(--warning); }
.subject-preview.warn::after { content: "⚠"; color: var(--warning); }
@media (max-width: 640px) {
  .smtp-grid { grid-template-columns: minmax(0, 1fr) 90px; }
  .smtp-grid select { grid-column: 1 / -1; }
  .presets { margin-left: 0; }
  .field > span:has(.presets) { flex-wrap: wrap; }
  .mini-table td:last-child, .mini-table th:last-child { display: none; }
}
.subject-item .ph-row { display: none; }
.subject-item:focus-within .ph-row { display: flex; animation: ph-in .15s ease; }
@keyframes ph-in { from { opacity: 0; transform: translateY(-3px); } }
.subject-preview > span { white-space: nowrap; flex: none; }
@media (max-width: 640px) { .subject-preview b { white-space: normal; } }

/* ---------- Idioma (v1.6) ---------- */
.lang-switch { display: flex; justify-content: center; gap: 4px; margin-top: -6px; }
.lang-switch a { padding: 4px 10px; border-radius: 99px; font-size: 12.5px; font-weight: 700; color: var(--muted); }
.lang-switch a:hover { color: var(--text); background: var(--surface-2); }
.lang-switch a.on { color: var(--primary); background: var(--primary-soft); }
.subject-row { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 2px 8px; align-items: center; }
.subject-row .subject-preview { grid-column: 2; }
.lang-tag { display: grid; place-items: center; height: 26px; border-radius: 7px; background: var(--surface-2); border: 1px solid var(--border); font-size: 11px; font-weight: 800; color: var(--muted); letter-spacing: .04em; }

/* ---------- Fondo de la pantalla de acceso por empresa (v1.7) ---------- */
body.bare.has-bg { background: var(--bg); }
/* La foto va difuminada y algo apagada para que no compita con el acceso */
body.bare.has-bg::before {
  content: ""; position: fixed; inset: -40px; z-index: 0; pointer-events: none;
  background: var(--login-bg) center / cover no-repeat;
  filter: blur(var(--login-blur, 7px)) saturate(.75) brightness(1.04);
}
body.bare.has-bg::after {
  content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--bg) 30%, transparent), color-mix(in srgb, var(--bg) 18%, transparent) 45%, color-mix(in srgb, var(--bg) 45%, transparent)),
    radial-gradient(1200px 600px at 10% -10%, color-mix(in srgb, #e0e7ff 35%, transparent) 0, transparent 60%);
}
[data-theme="dark"] body.bare.has-bg::before { filter: blur(var(--login-blur, 7px)) saturate(.65) brightness(.7); }
[data-theme="dark"] body.bare.has-bg::after {
  background: linear-gradient(90deg, color-mix(in srgb, var(--bg) 45%, transparent), color-mix(in srgb, var(--bg) 30%, transparent) 45%, color-mix(in srgb, var(--bg) 60%, transparent));
}
body.bare.has-bg .theme-float { z-index: 31; }
body.bare.has-bg .auth-wrap { position: relative; z-index: 1; }
body.bare.has-bg .art-card { background: color-mix(in srgb, var(--surface) 86%, transparent); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-color: color-mix(in srgb, var(--border) 60%, transparent); }
body.bare.has-bg .auth-card { box-shadow: 0 24px 70px rgba(0, 0, 0, .28); }

/* Ficha de empresa: vista previa del fondo con la silueta de la pantalla de acceso */
.bg-frame { position: relative; flex: none; width: 176px; height: 99px; border-radius: 12px; overflow: hidden; border: 1.5px dashed var(--border-strong); background: var(--surface-2); }
.uploader-preview.bg { width: 100%; height: 100%; }
.uploader-preview.bg img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bg-mini { position: absolute; inset: 0; pointer-events: none; }
.bg-mini i { position: absolute; left: 12%; width: 26%; height: 11%; border-radius: 3px; background: rgba(255, 255, 255, .92); box-shadow: 0 2px 6px rgba(0, 0, 0, .2); }
.bg-mini i:first-child { top: 30%; } .bg-mini i:nth-child(2) { top: 50%; left: 18%; }
.bg-mini b { position: absolute; right: 14%; top: 22%; width: 26%; height: 56%; border-radius: 5px; background: rgba(255, 255, 255, .96); box-shadow: 0 3px 10px rgba(0, 0, 0, .25); }
.bg-uploader .uploader-body small.muted { max-width: 300px; }
@media (max-width: 640px) { .bg-uploader { flex-direction: column; align-items: flex-start; } }

/* ---------- Respuestas de los invitados (v1.8) ---------- */
.rsvp { display: inline-flex; align-items: center; gap: 4px; height: 22px; padding: 0 8px; border-radius: 99px; font-size: 11.5px; font-weight: 700; white-space: nowrap; flex: none; }
.rsvp.ok { background: var(--success-soft); color: var(--success); }
.rsvp.no { background: var(--danger-soft); color: var(--danger); }
.rsvp.pend { background: var(--surface-2); color: var(--muted); border: 1px solid var(--border); }
.rsvp-summary { display: flex; flex-wrap: wrap; gap: 6px; margin: -6px 0 14px; }
.people .pinfo { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.rsvp-mini { display: inline-flex; align-items: center; gap: 3px; font-size: 12px; font-weight: 700; color: var(--muted); white-space: nowrap; }
.rsvp-mini b.ok { color: var(--success); } .rsvp-mini b.no { color: var(--danger); }
.rsvp-card { border-left: 4px solid var(--primary); }
.rsvp-card.rsvp-accepted { border-left-color: var(--success); }
.rsvp-card.rsvp-declined { border-left-color: var(--danger); }
.rsvp-card h2 { margin-bottom: 4px; }
.rsvp-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 14px; }
.rsvp-actions .btn { justify-content: center; padding-left: 10px; padding-right: 10px; }
.btn-ok.on { background: var(--success); color: #fff; border-color: var(--success); }
.btn-no.on { background: var(--danger); color: #fff; border-color: var(--danger); }
.rsvp-page .rsvp-meeting { display: flex; flex-direction: column; gap: 6px; padding: 16px; border-radius: 14px; background: var(--surface-2); border: 1px solid var(--border); }
.rsvp-page .rsvp-meeting strong { font-size: 17px; }
.rsvp-page .rsvp-meeting span { display: flex; align-items: center; gap: 8px; color: var(--text-2); font-size: 14px; }
.rsvp-actions.big { margin-top: 2px; }
@media (max-width: 420px) { .rsvp-actions { grid-template-columns: 1fr; } }
.people li > span.rsvp:last-child { flex-direction: row; align-items: center; }

/* ---------- Ventana de confirmación de cancelación / eliminación (v1.9) ---------- */
.cmodal {
  width: min(440px, calc(100vw - 24px)); max-height: calc(100vh - 24px); overflow-y: auto; padding: 28px 26px 22px; border: 0; border-radius: 20px;
  background: var(--surface); color: var(--text); box-shadow: 0 30px 80px rgba(10, 12, 30, .35); text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: 10px;
}
.cmodal:not([open]) { display: none; }
.cmodal[open] { animation: pop .22s cubic-bezier(.2, .9, .3, 1.2); }
.cmodal::backdrop { background: rgba(15, 17, 35, .55); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.cm-icon {
  width: 68px; height: 68px; border-radius: 50%; display: grid; place-items: center; margin-bottom: 4px;
  background: var(--danger-soft); color: var(--danger); box-shadow: 0 0 0 8px color-mix(in srgb, var(--danger-soft) 55%, transparent);
}
.cmodal-cancel .cm-icon { animation: cm-shake .5s .15s ease; }
@keyframes cm-shake { 25% { transform: rotate(-8deg); } 50% { transform: rotate(6deg); } 75% { transform: rotate(-3deg); } }
.cmodal h2 { font-size: 19px; }
.cm-text { color: var(--muted); font-size: 14px; margin-top: -4px; }
.cm-res {
  width: 100%; text-align: left; margin: 6px 0 2px; padding: 14px 16px 14px 18px; border-radius: 14px; position: relative;
  background: var(--surface-2); border: 1px solid var(--border); display: flex; flex-direction: column; gap: 6px; overflow: hidden;
}
.cm-res::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--c); }
.cm-res strong { font-size: 15.5px; }
.cm-res span { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--text-2); }
.cm-res .ico { color: var(--muted); }
.cm-notify { align-self: flex-start; font-size: 13.5px; margin-top: 2px; }
.cm-actions { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 8px; }
.cm-actions .btn { justify-content: center; }
@media (max-width: 420px) { .cm-actions { grid-template-columns: 1fr; } .cm-actions .btn-danger { order: -1; } }

/* ---------- Respuesta enviada: cierre de la ventana (v1.9.1) ---------- */
.rsvp-done { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; padding: 6px 0 2px; }
.rsvp-done h2 { font-size: 18px; }
.done-icon { width: 72px; height: 72px; border-radius: 50%; display: grid; place-items: center; animation: pop .3s cubic-bezier(.2, .9, .3, 1.3); }
.rsvp-accepted .done-icon { background: var(--success-soft); color: var(--success); box-shadow: 0 0 0 8px color-mix(in srgb, var(--success-soft) 55%, transparent); }
.rsvp-declined .done-icon { background: var(--danger-soft); color: var(--danger); box-shadow: 0 0 0 8px color-mix(in srgb, var(--danger-soft) 55%, transparent); }
.close-timer { position: relative; width: 52px; height: 52px; display: grid; place-items: center; }
.close-timer svg { position: absolute; inset: 0; transform: rotate(-90deg); }
.close-timer circle { fill: none; stroke: var(--border); stroke-width: 4; }
.close-timer .arc { stroke: var(--primary); stroke-linecap: round; stroke-dasharray: 119.4; stroke-dashoffset: 0; }
.close-timer.run .arc { animation: close-arc var(--secs, 5s) linear forwards; }
@keyframes close-arc { to { stroke-dashoffset: 119.4; } }
.close-timer b { font-size: 18px; font-weight: 800; }
.done-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; }

/* ---------- Sedes (v1.10) ---------- */
.site-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -4px 0 2px; }
.site-chips > span { display: inline-flex; align-items: center; gap: 4px; margin-right: 2px; }
.chip-btn { display: inline-flex; align-items: baseline; gap: 5px; height: 32px; padding: 0 12px; border-radius: 99px; border: 1px solid var(--border); background: var(--surface); color: var(--text-2); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; transition: background .15s, border-color .15s, color .15s; align-items: center; }
.chip-btn small { font-weight: 600; color: var(--muted); font-size: 11.5px; }
.chip-btn:hover { border-color: var(--border-strong); }
.chip-btn.on { background: var(--primary); border-color: var(--primary); color: var(--on-primary, #fff); }
.chip-btn.on small { color: rgba(255, 255, 255, .8); }
.room-opt[hidden] { display: none !important; }
.room-opt-body .site-name { color: var(--primary); font-weight: 700; display: flex; align-items: center; gap: 3px; }
.site-cell { display: flex; align-items: center; gap: 12px; }
.site-cell > div { display: flex; flex-direction: column; }
.site-cell small { color: var(--muted); font-size: 12.5px; }
.site-ico { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; background: var(--primary-soft); color: var(--primary); flex: none; }
.site-seg { flex-wrap: wrap; }
.site-group { display: flex; align-items: center; gap: 8px; margin: 14px 0 4px; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.site-group:first-child { margin-top: 0; }
.site-group small { font-weight: 600; text-transform: none; letter-spacing: 0; }
.site-group.mine::after { content: attr(data-mine); font-size: 10.5px; padding: 2px 7px; border-radius: 99px; background: var(--primary-soft); color: var(--primary); letter-spacing: .02em; }
.inline-form select[name=sede] { width: auto; max-width: 220px; }
.site-dd { display: flex; flex-direction: column; gap: 2px; align-items: flex-start; }
.facts dd.site-dd { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; text-align: left; gap: 2px; }
.people .pinfo strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- Ventanas propias para el resto de confirmaciones (v1.11) ---------- */
.cmodal-logout .cm-icon, .cmodal-send .cm-icon { background: var(--primary-soft); color: var(--primary); box-shadow: 0 0 0 8px color-mix(in srgb, var(--primary-soft) 55%, transparent); }
.cmodal-warning .cm-icon { background: #fff4e5; color: #d97706; box-shadow: 0 0 0 8px rgba(255, 244, 229, .55); }
[data-theme="dark"] .cmodal-warning .cm-icon { background: #35260f; color: #fbbf24; box-shadow: 0 0 0 8px rgba(53, 38, 15, .5); }
.cmodal-logout[open] .cm-icon svg { animation: cm-slide .5s .15s ease; }
@keyframes cm-slide { 40% { transform: translateX(-4px); } }
.cmodal-delete[open] .cm-icon svg { animation: cm-shake .5s .15s ease; }
.cm-actions.single { grid-template-columns: 1fr; }

/* Ficha de usuario: sede y sala por defecto */
.site-box { border: 1px solid var(--border); border-radius: 14px; padding: 12px 16px 14px; margin: 4px 0 6px; display: grid; gap: 8px; }
.site-box legend { padding: 0 6px; font-weight: 600; font-size: .9rem; display: inline-flex; align-items: center; gap: 6px; color: var(--muted); }
.site-box .grid-2 { margin: 0; }
.site-box .check.is-off { opacity: .45; }
/* Perfil: datos que solo cambia un administrador */
.ro-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; margin: 6px 0 2px; }
.ro-facts > div { background: var(--surface-2); border-radius: 12px; padding: 10px 14px; }
.ro-facts dt { font-size: .78rem; color: var(--muted); display: flex; align-items: center; gap: 6px; margin-bottom: 3px; }
.ro-facts dd { margin: 0; font-weight: 600; }
/* Reserva: usuario limitado a su sede */
.site-lock { display: flex; align-items: center; gap: 8px; font-size: .88rem; color: var(--muted); background: var(--surface-2); border-radius: 10px; padding: 8px 12px; margin: 0 0 12px; }
.site-lock.warn { background: #fff4e5; color: #92400e; }
[data-theme="dark"] .site-lock.warn { background: #35260f; color: #fbbf24; }
/* Ocupación: salas de otra sede (solo consulta) */
.sched .col.locked { cursor: not-allowed; background-image: repeating-linear-gradient(135deg, transparent 0 9px, color-mix(in srgb, var(--border) 45%, transparent) 9px 10px); }

/* ---------- Ajustes: pestañas laterales agrupadas ---------- */
.settings-layout { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 24px; align-items: start; }
.settings-nav { position: sticky; top: 80px; display: flex; flex-direction: column; gap: 2px; }
.sn-group { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin: 14px 12px 6px; }
.sn-group:first-child { margin-top: 0; }
.settings-nav a { display: flex; gap: 12px; align-items: flex-start; padding: 10px 12px; border-radius: 12px; color: var(--text-2); border: 1px solid transparent; transition: background .15s, border-color .15s; }
.settings-nav a:hover { background: var(--surface); }
.settings-nav a.on { background: var(--surface); border-color: var(--border); box-shadow: var(--shadow); color: var(--text); }
.sn-ico { width: 32px; height: 32px; border-radius: 9px; display: grid; place-items: center; flex-shrink: 0; background: var(--surface-2); color: var(--muted); transition: background .15s, color .15s; }
.settings-nav a.on .sn-ico { background: var(--primary-soft); color: var(--primary); }
.sn-text { display: flex; flex-direction: column; min-width: 0; }
.sn-text strong { font-size: 14px; }
.sn-text small { font-size: 12px; color: var(--muted); line-height: 1.35; }
.settings-panel { min-width: 0; max-width: 860px; }
.settings-panel > .card + .card { margin-top: 20px; }
@media (max-width: 900px) {
  .settings-layout { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .settings-nav { position: static; flex-direction: row; overflow-x: auto; gap: 6px; padding-bottom: 4px; scrollbar-width: none; }
  .settings-nav::-webkit-scrollbar { display: none; }
  .sn-group, .sn-text small { display: none; }
  .settings-nav a { flex-shrink: 0; align-items: center; padding: 6px 12px 6px 6px; border-color: var(--border); background: var(--surface); }
  .sn-ico { width: 28px; height: 28px; }
}

/* Tema y colores */
.theme-form { gap: 22px; }
.tf-block { border: 0; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.tf-block legend, .tf-label { font-weight: 700; font-size: 14px; padding: 0; margin-bottom: 10px; }
.tf-label { margin-bottom: 0; }
.mode-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.mode-card { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 10px; border: 1.5px solid var(--border); border-radius: 14px; cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.mode-card:hover { border-color: var(--border-strong); }
.mode-card:has(input:checked) { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-soft); }
.mode-card input { position: absolute; opacity: 0; pointer-events: none; }
.mode-card:has(input:focus-visible) { outline: 2px solid var(--primary); outline-offset: 2px; }
.mc-art { height: 54px; border-radius: 9px; display: flex; overflow: hidden; border: 1px solid var(--border); }
.mc-art i { flex: 1; position: relative; }
.mc-art i::before, .mc-art i::after { content: ""; position: absolute; left: 10px; height: 6px; border-radius: 3px; }
.mc-art i::before { top: 12px; width: 50%; } .mc-art i::after { top: 24px; width: 32%; background: var(--primary); }
.mode-light .mc-art i { background: #f4f5fa; } .mode-light .mc-art i::before { background: #d4d8e4; }
.mode-dark .mc-art i { background: #0e1020; } .mode-dark .mc-art i::before { background: #343b5a; }
.mode-auto .mc-art i:first-child { background: #f4f5fa; } .mode-auto .mc-art i:first-child::before { background: #d4d8e4; }
.mode-auto .mc-art i:last-child { background: #0e1020; } .mode-auto .mc-art i:last-child::before { background: #343b5a; }
.mc-text { display: flex; flex-direction: column; line-height: 1.3; }
.mc-text strong { font-size: 14px; } .mc-text small { font-size: 12px; color: var(--muted); }
.presets-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 4px; }
.preset { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 11px 0 6px; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); color: var(--text-2); font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; transition: border-color .15s, background .15s; }
.preset:hover { border-color: var(--border-strong); background: var(--surface-2); }
.preset.on { border-color: var(--primary); color: var(--text); box-shadow: 0 0 0 2px var(--primary-soft); }
.preset .sw { width: 22px; height: 22px; border-radius: 50%; background: conic-gradient(var(--a) 0 50%, var(--b) 50% 75%, var(--c) 75%); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12); }
.color-row { display: grid; grid-template-columns: 44px minmax(0, 1fr) 104px auto; gap: 12px; align-items: center; padding: 10px 0; border-top: 1px solid var(--border); }
.color-row input[type="color"] { width: 44px; height: 44px; padding: 0; border: 1px solid var(--border); border-radius: 12px; background: none; cursor: pointer; overflow: hidden; }
.color-row input[type="color"]::-webkit-color-swatch-wrapper { padding: 0; }
.color-row input[type="color"]::-webkit-color-swatch { border: 0; border-radius: 11px; }
.color-row input[type="color"]::-moz-color-swatch { border: 0; border-radius: 11px; }
.cr-text { display: flex; flex-direction: column; min-width: 0; line-height: 1.35; }
.cr-text small { font-size: 12.5px; }
.color-row .hex { height: 38px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 13.5px; text-transform: lowercase; text-align: center; padding: 0 8px; }
.color-row .hex:invalid { border-color: var(--danger); }
.color-row [data-color-reset][hidden] { display: inline; visibility: hidden; }
.contrast-hint { margin: 0; }
.theme-previews { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.tp { margin: 0; display: flex; flex-direction: column; gap: 6px; background: none; color: var(--text); }
.tp figcaption { font-size: 12px; color: var(--muted); text-align: center; }
.tp-app { display: flex; height: 172px; border-radius: 14px; overflow: hidden; border: 1px solid var(--border); background: var(--bg); box-shadow: var(--shadow); }
.tp-side { width: 34%; background: var(--sb-bg, var(--surface)); border-right: 1px solid var(--sb-border, var(--border)); padding: 10px 8px; display: flex; flex-direction: column; gap: 5px; }
.tp-side i { display: block; height: 5px; border-radius: 3px; background: currentColor; opacity: .55; }
.tp-brand { display: flex; align-items: center; gap: 6px; color: var(--sb-text, var(--text)); margin-bottom: 3px; }
.tp-brand .brand-mark { width: 20px; height: 20px; border-radius: 6px; box-shadow: none; flex-shrink: 0; }
.tp-brand i { flex: 1; opacity: .8; }
.tp-new { height: 16px; border-radius: 5px; background: var(--primary); color: var(--on-primary, #fff); display: grid; place-items: center; margin-bottom: 3px; outline: 1px solid var(--sb-btn-ring, transparent); outline-offset: -1px; }
.tp-nav { padding: 5px 6px; border-radius: 5px; color: var(--sb-text-2, var(--text-2)); }
.tp-nav i { width: 70%; }
.tp-nav.on { background: var(--sb-active-bg, var(--primary-soft)); color: var(--sb-active-text, var(--primary)); }
.tp-nav.on i { opacity: 1; }
.tp-label { padding: 6px 6px 0; color: var(--sb-muted, var(--muted)); } .tp-label i { width: 45%; height: 3px; }
.tp-main { flex: 1; padding: 12px; min-width: 0; display: flex; }
.tp-card { flex: 1; background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.tp-card strong { font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tp-card small { font-size: 11px; color: var(--muted); }
.tp-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 6px 0 auto; font-size: 11px; }
.tp-row .badge { height: 20px; font-size: 10.5px; }
.tp-row .chip-btn { height: 20px; padding: 0 8px; font-size: 10.5px; pointer-events: none; }
.tp-row a { color: var(--primary); font-weight: 700; }
.tp-card .btn { align-self: flex-start; height: 26px; font-size: 11.5px; padding: 0 10px; pointer-events: none; }
@media (max-width: 640px) {
  .mode-cards { grid-template-columns: minmax(0, 1fr); }
  .mode-card { flex-direction: row; align-items: center; }
  .mc-art { width: 76px; height: 44px; flex-shrink: 0; }
  .color-row { grid-template-columns: 40px minmax(0, 1fr) 92px; }
  .color-row [data-color-reset] { grid-column: 3; justify-self: end; }
  .theme-previews { grid-template-columns: minmax(0, 1fr); }
}

/* Tema y colores → Mis paletas */
.cmodal-palette .cm-icon { background: var(--primary-soft); color: var(--primary); box-shadow: 0 0 0 8px color-mix(in srgb, var(--primary-soft) 55%, transparent); }
.presets-label { min-width: 84px; }
.mine-row { padding-top: 2px; }
.my-presets { display: contents; }
.preset-wrap { display: inline-flex; align-items: center; position: relative; }
.preset.mine { padding-right: 28px; }
.preset-del { position: absolute; right: 5px; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; border-radius: 50%; border: 0; padding: 0; display: grid; place-items: center; background: transparent; color: var(--muted); cursor: pointer; transition: background .15s, color .15s; }
.preset-del:hover { background: var(--danger-soft); color: var(--danger); }
.preset.add { border-style: dashed; color: var(--primary); padding: 0 12px 0 9px; gap: 5px; }
.preset.add:hover { border-color: var(--primary); background: var(--primary-soft); }
.my-msg { font-size: 12.5px; font-weight: 600; color: var(--success); opacity: 0; }
.my-msg.show { animation: my-msg 3.2s ease forwards; }
@keyframes my-msg { 0% { opacity: 0; transform: translateY(3px); } 10%, 75% { opacity: 1; transform: none; } 100% { opacity: 0; } }
.cm-preset { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--border); font-size: 12.5px; color: var(--text-2); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.cm-preset .sw { width: 26px; height: 26px; border-radius: 50%; flex-shrink: 0; background: conic-gradient(var(--a) 0 50%, var(--b) 50% 75%, var(--c) 75%); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12); }
.cm-field { width: 100%; text-align: left; margin-top: 4px; }
.cm-note { width: 100%; text-align: left; font-size: 12.5px; color: var(--warning); margin-top: -4px; }
.cm-note.err { color: var(--danger); }

/* ---------- Grupos ---------- */
.group-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--c); flex-shrink: 0; vertical-align: middle; }
.site-cell .group-dot { width: 14px; height: 14px; margin: 0 4px; box-shadow: 0 0 0 4px color-mix(in srgb, var(--c) 18%, transparent); }
.group-chips { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.group-chip { display: inline-flex; align-items: center; gap: 5px; height: 20px; padding: 0 8px; border-radius: 99px; font-size: 11px; font-weight: 700; color: var(--text-2); background: color-mix(in srgb, var(--c) 13%, var(--surface)); border: 1px solid color-mix(in srgb, var(--c) 30%, transparent); }
.group-chip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--c); }
.check-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 6px 14px; }
.check-grid .check { align-items: center; }
.check-grid[hidden] { display: none; }
.sub-label { font-size: 13px; font-weight: 600; color: var(--text-2); margin-top: 6px; }
.pick-list { max-height: 260px; overflow-y: auto; border: 1px solid var(--border); border-radius: 12px; padding: 4px; display: flex; flex-direction: column; gap: 2px; }
.pick-item { padding: 7px 10px; border-radius: 9px; align-items: center; }
.pick-item:hover { background: var(--surface-2); }
.pick-item.on { background: var(--primary-soft); }
.pick-item.inactive { opacity: .6; }
.pick-item[hidden] { display: none; }
.pick-item span { display: flex; flex-wrap: wrap; gap: 0 8px; align-items: baseline; min-width: 0; }
.access-opts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.access-opt { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1.5px solid var(--border); border-radius: 12px; cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.access-opt.on { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-soft); }
.access-opt input { margin-top: 3px; accent-color: var(--primary); }
.access-opt span { display: flex; flex-direction: column; gap: 2px; }
.access-opt strong { display: inline-flex; align-items: center; gap: 5px; font-size: 14px; }
.access-opt small { font-size: 12px; color: var(--muted); line-height: 1.35; }
@media (max-width: 640px) { .access-opts { grid-template-columns: 1fr; } }
.room-lock { display: inline-flex; vertical-align: middle; color: var(--muted); margin-left: 2px; }
.ro-facts dd.group-chips { margin-top: 2px; }

/* ---------- Menú por áreas ---------- */
.nav-label.nav-area { margin-top: 16px; }

/* ---------- Administración → Módulos ---------- */
.mod-summary { color: var(--muted); font-size: 14px; white-space: nowrap; }
.mod-summary strong { color: var(--text); font-size: 18px; }
.mod-form { gap: 18px; }
.mod-area { display: flex; flex-direction: column; gap: 12px; }
.mod-list { display: flex; flex-direction: column; }
.mod-item { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 14px; align-items: flex-start; padding: 14px 0; border-top: 1px solid var(--border); }
.mod-item:first-child { border-top: 0; padding-top: 4px; }
.mod-ico { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: var(--surface-2); color: var(--muted); transition: background .15s, color .15s; }
.mod-item.is-on .mod-ico { background: var(--primary-soft); color: var(--primary); }
.mod-main { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.mod-title { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.mod-title strong { font-size: 15px; }
.mod-item.soon { opacity: .62; }
.mod-item.soon .mod-ico { background: transparent; border: 1.5px dashed var(--border-strong); }
.mod-item:not(.is-on):not(.soon) .mod-access { opacity: .5; pointer-events: none; }
.mod-access { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.mod-seg { align-self: flex-start; }
.mod-seg label { cursor: pointer; }
.mod-seg input { position: absolute; opacity: 0; pointer-events: none; }
.mod-seg span { display: block; padding: 5px 12px; border-radius: 8px; font-weight: 700; font-size: 13px; color: var(--text-2); white-space: nowrap; }
.mod-seg input:checked + span { background: var(--primary); color: var(--on-primary, #fff); }
.mod-seg input:disabled + span { opacity: .45; cursor: default; }
.mod-seg input:focus-visible + span { outline: 2px solid var(--primary); outline-offset: 1px; }
.switch { position: relative; display: inline-block; width: 44px; height: 26px; flex-shrink: 0; cursor: pointer; margin-top: 8px; }
.switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; z-index: 1; }
.switch span { position: absolute; inset: 0; border-radius: 99px; background: var(--border-strong); transition: background .2s; }
.switch span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .25); transition: transform .2s; }
.switch input:checked + span { background: var(--primary); }
.switch input:checked + span::after { transform: translateX(18px); }
.switch input:focus-visible + span { outline: 2px solid var(--primary); outline-offset: 2px; }
.sticky-actions { position: sticky; bottom: 12px; z-index: 5; background: color-mix(in srgb, var(--surface) 88%, transparent); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border: 1px solid var(--border); border-radius: 14px; padding: 10px 12px; box-shadow: var(--shadow); }

/* ---------- Módulo Aplicaciones ---------- */
.app-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 14px; }
.app-tile { background: var(--surface); border: 1px solid var(--border); border-radius: 16px; box-shadow: var(--shadow); display: flex; flex-direction: column; overflow: hidden; transition: transform .15s, box-shadow .15s, border-color .15s; }
.app-tile:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); border-color: var(--border-strong); }
.app-tile.inactive { opacity: .55; }
.app-link { display: flex; align-items: center; gap: 14px; padding: 16px; color: var(--text); flex: 1; }
.app-ico { width: 48px; height: 48px; border-radius: 14px; flex-shrink: 0; display: grid; place-items: center; background: var(--c); font-weight: 800; font-size: 16px; letter-spacing: .02em; }
.app-ico.has-logo { background: #fff; border: 1px solid var(--border); overflow: hidden; }
.app-ico.has-logo img { width: 82%; height: 82%; object-fit: contain; }
.app-ico.sm { width: 40px; height: 40px; border-radius: 12px; font-size: 14px; }
.app-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.app-text strong { font-size: 15px; }
.app-text small { font-size: 12.5px; color: var(--muted); line-height: 1.35; }
.app-go { color: var(--muted); opacity: 0; transition: opacity .15s; }
.app-tile:hover .app-go { opacity: 1; }
.app-admin { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 8px 6px 16px; border-top: 1px solid var(--border); background: var(--surface-2); }
.uploader-preview.app-prev { width: 64px; height: 64px; border: 1.5px dashed var(--border-strong); border-radius: 16px; background: #fff; overflow: hidden; }
.uploader-preview.app-prev img { width: 85%; height: 85%; object-fit: contain; }
/* Accesos rápidos en el Inicio */
.quick-apps { display: flex; gap: 10px; flex-wrap: wrap; }
.quick-app { display: flex; align-items: center; gap: 10px; padding: 8px 14px 8px 8px; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; color: var(--text); font-weight: 700; font-size: 14px; box-shadow: var(--shadow); transition: border-color .15s, transform .15s; }
.quick-app:hover { border-color: var(--border-strong); transform: translateY(-1px); }
.quick-apps .more { color: var(--primary); box-shadow: none; background: transparent; border-style: dashed; padding: 8px 14px; }

/* ---------- Menú (móvil): todos los apartados ---------- */
.menu-area { display: flex; flex-direction: column; gap: 8px; }
.menu-area h2 { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); display: flex; align-items: center; gap: 6px; }
.menu-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.menu-tile { display: flex; align-items: center; gap: 10px; padding: 14px; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; color: var(--text); font-weight: 700; font-size: 14px; }
.menu-tile .ico { color: var(--primary); }
.menu-page { display: flex; flex-direction: column; gap: 20px; }
@media (max-width: 640px) {
  .mod-item { grid-template-columns: 36px minmax(0, 1fr) auto; gap: 10px; }
  .mod-ico { width: 36px; height: 36px; }
  .page-head .mod-summary { display: none; }
}
.dash-grid.no-main { grid-template-columns: minmax(0, 1fr); }
.dash-grid.no-main .dash-side { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 20px; align-items: start; }
.dash-grid.no-main .dash-side > .card { margin: 0; }
.home-apps { margin-bottom: 20px; }
.home-todo { margin-bottom: 18px; }
.mod-form.hide-soon .mod-item.soon, .mod-form.hide-soon .mod-area.only-soon { display: none; }
.mod-form.hide-soon .mod-item:not(.soon) { border-top: 0; }
.mod-form.hide-soon .mod-item:not(.soon) ~ .mod-item:not(.soon) { border-top: 1px solid var(--border); }
.mod-toggle-soon { align-self: flex-start; color: var(--text-2); }
.mod-item.f-off, .mod-area.f-off { display: none; }
/* Con filtros activos, la línea separadora solo va entre módulos visibles */
.mod-form.is-filtering .mod-item.first-vis { border-top: 0 !important; padding-top: 4px; }
.mod-filters { margin-bottom: 0; }
.mod-filters .search-box { max-width: 420px; }
.mod-form > .empty-row { text-align: center; color: var(--muted); padding: 28px 16px; margin: 0; }

/* ---------- Marca: logotipo e icono (Ajustes → General) ---------- */
.brand-mark.has-img { background: #fff; box-shadow: 0 0 0 1px var(--border); overflow: hidden; }
.brand-mark.has-img img { width: 84%; height: 84%; object-fit: contain; }
.brand.has-logo { flex-direction: column; align-items: flex-start; gap: 6px; }
.brand-logo { display: block; max-width: 100%; max-height: 44px; object-fit: contain; object-position: left center; }
.auth-brand.with-logo { flex-direction: column; align-items: flex-start; gap: 12px; }
.auth-logo { display: block; max-width: 260px; max-height: 64px; object-fit: contain; }
/* Logotipos con letras oscuras: en modo oscuro (o barra lateral oscura) se ponen sobre una placa clara */
[data-theme="dark"] .brand-logo, [data-theme="dark"] .auth-logo { background: #fff; padding: 6px 10px; border-radius: 10px; }
.sidebar .brand-logo { background: var(--sb-logo-bg, transparent); padding: var(--sb-logo-pad, 0); border-radius: 10px; }
[data-theme="dark"] .sidebar .brand-logo { background: #fff; padding: 6px 10px; }
.uploader-preview.brand-prev { width: 180px; height: 64px; border: 1.5px dashed var(--border-strong); border-radius: 12px; background: #fff; overflow: hidden; }
.uploader-preview.brand-prev img { max-width: 92%; max-height: 80%; object-fit: contain; }
.uploader-preview.icon-prev { width: 64px; height: 64px; border: 1.5px dashed var(--border-strong); border-radius: 16px; background: #fff; overflow: hidden; }
.uploader-preview.icon-prev img { width: 84%; height: 84%; object-fit: contain; }
.brand-uploads { align-items: start; }
/* Logotipo grande de la pantalla de acceso: el ancho del formulario (≈ 350 px) y como mucho 175 px de alto */
.auth-brand.big-logo { align-items: center; text-align: center; gap: 14px; }
.auth-brand.big-logo .auth-logo { width: 100%; max-width: 350px; height: auto; max-height: 175px; margin: 0 auto; object-position: center; }
[data-theme="dark"] .auth-brand.big-logo .auth-logo { padding: 10px 14px; border-radius: 14px; }
.uploader-preview.login-logo-prev { width: 140px; height: 70px; border: 1.5px dashed var(--border-strong); border-radius: 12px; background: #fff; overflow: hidden; }
.uploader-preview.login-logo-prev img { width: 92%; height: 88%; object-fit: contain; }

/* ---------- Menú lateral: grupos desplegables por área ---------- */
.nav-group { display: flex; flex-direction: column; }
.nav-group-head {
  display: flex; align-items: center; gap: 12px; width: 100%; padding: 10px 12px; border: 0; border-radius: 10px; background: transparent;
  font: inherit; font-weight: 700; font-size: 14px; color: var(--sb-text, var(--text)); cursor: pointer; text-align: left; transition: background .15s;
}
.nav-group-head:hover { background: var(--sb-hover, var(--surface-2)); }
.nav-group-head > span:first-of-type { flex: 1; min-width: 0; }
.nav-group-head .ico:first-child { color: var(--sb-muted, var(--muted)); }
.nav-group.has-active > .nav-group-head .ico:first-child { color: var(--sb-active-text, var(--primary)); }
.nav-group-head .ico:last-child { color: var(--sb-muted, var(--muted)); transition: transform .22s ease; }
.nav-group.open > .nav-group-head .ico:last-child { transform: rotate(90deg); }
.nav-count { font-size: 11px; font-weight: 700; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 99px; display: grid; place-items: center;
  background: var(--sb-hover, var(--surface-2)); color: var(--sb-muted, var(--muted)); transition: opacity .15s; }
.nav-group.open .nav-count { opacity: 0; }
.nav-group-items { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .22s ease; }
.nav-group.open > .nav-group-items { grid-template-rows: 1fr; }
.nav-group-items > div { overflow: hidden; display: flex; flex-direction: column; gap: 2px; padding-left: 16px; margin-left: 20px; border-left: 1.5px solid var(--sb-border, var(--border)); }
.nav-group.open > .nav-group-items > div { padding-top: 2px; padding-bottom: 6px; }
.nav-group-items a { padding: 8px 10px; font-size: 13.5px; gap: 10px; }
.nav-sep { height: 1px; background: var(--sb-border, var(--border)); margin: 8px 10px; }
.no-anim .nav-group-items, .no-anim .nav-group-head .ico:last-child { transition: none !important; }
@media (prefers-reduced-motion: reduce) { .nav-group-items, .nav-group-head .ico:last-child { transition: none; } }

/* ---------- «Ver como usuario» ---------- */
.view-as { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 18px; padding: 10px 12px 10px 14px; border-radius: 14px;
  background: repeating-linear-gradient(135deg, #fff7e6 0 14px, #fff2d9 14px 28px); border: 1px solid #f5d29a; color: #7c4a03; }
[data-theme="dark"] .view-as { background: repeating-linear-gradient(135deg, #2c2110 0 14px, #33260f 14px 28px); border-color: #5c4313; color: #fbd38d; }
.va-ico { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: #f59e0b; color: #fff; flex-shrink: 0; }
.va-text { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 200px; }
.va-text strong { font-size: 14px; }
.view-as .group-chips { margin: 0; }
.va-change { position: relative; }
.va-change > summary { list-style: none; cursor: pointer; }
.va-change > summary::-webkit-details-marker { display: none; }
.va-pop { position: absolute; right: 0; top: calc(100% + 6px); z-index: 30; width: 280px; background: var(--surface); color: var(--text); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow-lg); padding: 14px; display: flex; flex-direction: column; gap: 10px; }
.va-groups { display: flex; flex-direction: column; gap: 6px; max-height: 240px; overflow-y: auto; }
.va-pop .btn { align-self: flex-end; }
@media (max-width: 640px) { .va-pop { right: auto; left: 0; width: min(280px, 80vw); } }
.nav-sub { display: block; margin: 10px 10px 2px; font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--sb-muted, var(--muted)); }
.nav-group-items .nav-sub:first-child { margin-top: 4px; }

/* ---------- Panel de administración ---------- */
.view-as-card { display: flex; gap: 16px; align-items: flex-start; margin-bottom: 20px; border-color: #f5d29a; background: linear-gradient(120deg, color-mix(in srgb, #f59e0b 7%, var(--surface)), var(--surface) 60%); }
.vac-ico { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; background: #f59e0b; color: #fff; flex-shrink: 0; }
.vac-body { display: flex; flex-direction: column; gap: 8px; flex: 1; min-width: 0; }
.vac-form { display: flex; flex-direction: column; gap: 10px; margin-top: 4px; }
.admin-sections { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; align-items: stretch; }
.admin-sections > .card { margin: 0; }
.admin-sec { display: flex; flex-direction: column; gap: 10px; }
.admin-links { display: flex; flex-direction: column; gap: 4px; }
.admin-link { display: flex; align-items: center; gap: 12px; padding: 10px; margin: 0 -10px; border-radius: 12px; color: var(--text); transition: background .15s; }
.admin-link:hover { background: var(--surface-2); }
.al-ico { width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; background: var(--primary-soft); color: var(--primary); flex-shrink: 0; }
.al-text { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.al-text strong { font-size: 14.5px; }
.al-text small { font-size: 12.5px; color: var(--muted); line-height: 1.35; }
.al-count { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.1; }
.al-count b { font-size: 18px; }
.al-count small { font-size: 11px; color: var(--muted); }
@media (max-width: 640px) { .admin-sections { grid-template-columns: minmax(0, 1fr); } .view-as-card { flex-direction: column; } }

/* ---------- Calendarios (mensual) ---------- */
.cal-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 20px; align-items: start; }
.cal-card { padding: 18px; }
.cal-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.cal-nav { display: flex; align-items: center; gap: 6px; }
.cal-nav h2 { font-size: 20px; min-width: 170px; text-align: center; }
.cal-nav h2 span { color: var(--muted); font-weight: 600; }
.cal-filters { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.type-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.type-chip i { width: 8px; height: 8px; border-radius: 50%; background: var(--k); display: inline-block; align-self: center; }
.type-chip.on { background: var(--k); border-color: var(--k); color: #fff; }
.type-chip.on i { background: #fff; }
.cal-grid { border: 1px solid var(--border); border-radius: 14px; overflow: hidden; }
.cal-dow, .cal-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.cal-dow span { padding: 8px 10px; font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); background: var(--surface-2); border-bottom: 1px solid var(--border); }
.cal-dow span.we { color: color-mix(in srgb, var(--muted) 70%, #e11d48); }
.cal-day { min-height: 108px; padding: 6px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); display: flex; flex-direction: column; gap: 3px; min-width: 0; position: relative; }
.cal-days > .cal-day:nth-child(7n) { border-right: 0; }
.cal-day.out { background: color-mix(in srgb, var(--surface-2) 60%, transparent); }
.cal-day.we:not(.out) { background: color-mix(in srgb, var(--surface-2) 55%, transparent); }
.cal-day.holiday { background: repeating-linear-gradient(135deg, color-mix(in srgb, #e11d48 7%, var(--surface)) 0 8px, color-mix(in srgb, #e11d48 4%, var(--surface)) 8px 16px); }
.cal-num { font-size: 12.5px; font-weight: 700; color: var(--text-2); width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; }
.cal-day.past .cal-num { color: var(--muted); }
.cal-day.holiday .cal-num { color: #e11d48; }
.cal-day.today .cal-num { background: var(--primary); color: var(--on-primary, #fff); }
.cal-items { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.cal-item { display: block; font-size: 11.5px; line-height: 1.3; padding: 3px 6px; border-radius: 6px; color: var(--text); background: color-mix(in srgb, var(--c) 13%, var(--surface)); border-left: 3px solid var(--c); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-item b { font-weight: 700; }
.cal-item.fest { background: var(--c); color: #fff; border-left-color: var(--c); font-weight: 700; }
.cal-item:hover { filter: brightness(.96); }
.cal-more { font-size: 11px; font-weight: 700; color: var(--muted); padding: 0 6px; }
.cal-dots { display: none; gap: 3px; justify-content: center; }
.cal-dots i { width: 6px; height: 6px; border-radius: 50%; background: var(--c); }
[data-cal-new] .cal-day:not(.out) { cursor: pointer; }
[data-cal-new] .cal-day:not(.out):hover { box-shadow: inset 0 0 0 2px var(--primary-soft); }
.cal-legend { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; margin-top: 12px; font-size: 12.5px; color: var(--text-2); }
.cal-legend span { display: inline-flex; align-items: center; gap: 6px; }
.cal-legend i { width: 10px; height: 10px; border-radius: 3px; background: var(--c); }
.cal-legend b { color: var(--text); }
.cal-hint { margin-left: auto; }
.cal-list { display: flex; flex-direction: column; gap: 8px; max-height: calc(100vh - 140px); overflow-y: auto; position: sticky; top: 20px; }
.cal-list h2 { font-size: 16px; }
.cal-entry { position: relative; padding: 10px 12px 10px 16px; border-radius: 12px; background: var(--surface-2); display: flex; flex-direction: column; gap: 3px; scroll-margin-top: 20px; transition: box-shadow .3s; }
.cal-entry::before { content: ""; position: absolute; left: 0; top: 10px; bottom: 10px; width: 4px; border-radius: 0 4px 4px 0; background: var(--c); }
.cal-entry:target { box-shadow: 0 0 0 2px var(--c); }
.ce-head { display: flex; align-items: center; gap: 6px; }
.ce-type { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--c); display: inline-flex; align-items: center; gap: 4px; }
.ce-edit { margin-left: auto; width: 28px; height: 28px; }
.cal-entry strong { font-size: 14.5px; }
.ce-meta, .ce-aud { font-size: 12.5px; color: var(--muted); display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.ce-desc { font-size: 13px; color: var(--text-2); margin: 2px 0; }
.type-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.type-card { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1.5px solid var(--border); border-radius: 12px; cursor: pointer; position: relative; }
.type-card input { position: absolute; opacity: 0; pointer-events: none; }
.type-card:has(input:checked) { border-color: var(--k); box-shadow: 0 0 0 3px color-mix(in srgb, var(--k) 18%, transparent); }
.tc-ico { width: 32px; height: 32px; border-radius: 9px; display: grid; place-items: center; background: color-mix(in srgb, var(--k) 14%, var(--surface)); color: var(--k); }
.target-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
.target-col { display: flex; flex-direction: column; gap: 5px; }
[data-cal-times][hidden] { display: none; }
@media (max-width: 1100px) { .cal-layout { grid-template-columns: minmax(0, 1fr); } .cal-list { position: static; max-height: none; } }
@media (max-width: 700px) {
  .cal-card { padding: 12px; }
  .cal-day { min-height: 54px; padding: 4px 2px; align-items: center; }
  .cal-items { display: none; }
  .cal-dots { display: flex; }
  .cal-num { width: 24px; height: 24px; font-size: 12px; }
  .cal-dow span { padding: 6px 2px; text-align: center; font-size: 10.5px; letter-spacing: 0; }
  .cal-nav h2 { min-width: 0; font-size: 17px; }
  .type-cards { grid-template-columns: minmax(0, 1fr); }
  .cal-hint { display: none; }
}
.next-dates { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.next-dates a { display: flex; align-items: center; gap: 12px; padding: 8px; border-radius: 12px; color: var(--text); transition: background .15s; }
.next-dates a:hover { background: var(--surface-2); }
.nd-date { width: 44px; height: 46px; border-radius: 11px; flex-shrink: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1.05;
  background: color-mix(in srgb, var(--c) 12%, var(--surface)); color: var(--c); border: 1px solid color-mix(in srgb, var(--c) 25%, transparent); }
.nd-date b { font-size: 17px; }
.nd-date small { font-size: 10.5px; font-weight: 700; text-transform: uppercase; }
.nd-body { display: flex; flex-direction: column; min-width: 0; }
.nd-body strong { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nd-body small { font-size: 12px; color: var(--muted); }
a.cal-entry { color: var(--text); transition: background .15s, box-shadow .3s; }
a.cal-entry:hover { background: color-mix(in srgb, var(--c) 8%, var(--surface-2)); }
a.cal-entry > span:last-child:not(.ce-type) { align-self: flex-start; }

/* ---------- Eventos de empleados ---------- */
.card-head.pad { padding: 16px 18px 0; }
.mt-sm { margin-top: 10px; }
.pe-stats .stat { color: inherit; text-decoration: none; transition: border-color .15s, transform .15s; }
.pe-stats .stat:hover { border-color: var(--primary); transform: translateY(-1px); }
.pe-type { display: inline-flex; align-items: center; gap: 7px; font-weight: 700; }
.pe-type::before { content: ""; width: 10px; height: 10px; border-radius: 3px; background: var(--c); flex: none; }
.pe-user-select { width: 100%; min-height: 150px; padding: 4px; }
.pe-user-select option { padding: 5px 8px; border-radius: 6px; }
.pe-user-select optgroup { font-size: 12px; color: var(--muted); }
.pe-user-search { margin-bottom: 8px; }
.pe-type-pick { display: flex; flex-wrap: wrap; gap: 8px; }
.pe-type-opt { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1.5px solid var(--border); border-radius: 10px; cursor: pointer; font-weight: 600; font-size: 14px; background: var(--surface); }
.pe-type-opt input { position: absolute; opacity: 0; pointer-events: none; }
.pe-type-opt::before { content: ""; width: 10px; height: 10px; border-radius: 3px; background: var(--c); }
.pe-type-opt.on { border-color: var(--c); background: color-mix(in srgb, var(--c) 10%, var(--surface)); }
.pe-type-opt:has(input:focus-visible) { outline: 2px solid var(--primary); outline-offset: 2px; }
.pe-steps > .card { margin: 0; }
.pe-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-bottom: 20px; }
.pe-step { position: relative; padding-top: 22px; }
.pe-step h2 { font-size: 17px; margin: 6px 0 6px; }
.pe-step-n { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; background: var(--primary); color: var(--on-primary, #fff); }
.pe-step-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 10px; }
.pe-upload { display: grid; gap: 10px; margin: 10px 0 6px; }
.pe-drop { display: grid; justify-items: center; gap: 4px; text-align: center; padding: 18px 12px; border: 2px dashed var(--border); border-radius: 12px; cursor: pointer; color: var(--muted); font-weight: 600; font-size: 14px; transition: border-color .15s, background .15s; }
.pe-drop:hover, .pe-drop.over { border-color: var(--primary); background: var(--primary-soft, rgba(79,70,229,.06)); color: var(--text); }
.pe-drop.has-file { border-style: solid; border-color: var(--success); color: var(--text); }
.pe-drop input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.pe-sum { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.pe-sum-i { padding: 8px 14px; border-radius: 10px; font-size: 14px; background: var(--surface-2); border: 1px solid var(--border); }
.pe-sum-i b { font-size: 18px; margin-right: 2px; }
.pe-sum-i.new b { color: var(--success); }
.pe-sum-i.upd b { color: #d97706; }
.pe-sum-i.err b { color: var(--danger); }
.pe-pv-filter { margin-bottom: 10px; }
.pe-pv-wrap { max-height: 460px; overflow: auto; border: 1px solid var(--border); border-radius: 10px; }
.pe-pv thead th { position: sticky; top: 0; background: var(--surface); z-index: 1; }
.pe-pv tr.pv-error td { background: color-mix(in srgb, var(--danger) 6%, transparent); }
.pe-pv tr.pv-same td { opacity: .65; }
.pe-pv-actions { margin-top: 14px; }
@media (max-width: 900px) { .pe-steps { grid-template-columns: 1fr; } }
.pe-user-select { background-image: none !important; }
.next-dates .nd-static { display: flex; align-items: center; gap: 12px; padding: 8px; border-radius: 12px; color: var(--text); }
.nd-badge { margin-left: auto; flex: none; height: 22px; font-size: 11.5px; }
.nd-body small svg { vertical-align: -1px; }

/* ---------- Calendario laboral ---------- */
.pad-x { padding: 0 18px 12px; }
.hol-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 18px; }
.hol-grid > .card { margin: 0; }
.hol-table td { padding-top: 10px; padding-bottom: 10px; }
.hol-table tr.past td { opacity: .55; }
.hol-we { color: var(--danger) !important; }
.hol-cals select { min-width: 150px; height: 38px; padding-top: 6px; padding-bottom: 6px; }
.hol-import { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: start; }
.hol-import .pe-upload { margin: 0; }
.hol-scope { display: inline-flex; flex-wrap: wrap; }
.hol-scope label { position: relative; cursor: pointer; }
.hol-scope input { position: absolute; opacity: 0; pointer-events: none; }
.hol-scope span { display: block; padding: 7px 14px; border-radius: 8px; font-weight: 700; font-size: 14px; color: var(--muted); }
.hol-scope input:checked + span { background: var(--surface); color: var(--primary); box-shadow: var(--shadow); }
.hol-scope input:focus-visible + span { outline: 2px solid var(--primary); }
@media (max-width: 900px) { .hol-grid, .hol-import { grid-template-columns: 1fr; } }
.pe-remind { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; margin-bottom: 18px; }
.pe-remind > .card { margin: 0; }
.pe-how { border-top: 1px solid var(--border); margin-top: 16px; padding-top: 14px; }
.pe-how h3 { font-size: 15px; margin: 0 0 4px; }
.pe-cmd { display: block; margin-top: 8px; padding: 10px 12px; border-radius: 10px; background: var(--surface-2); border: 1px solid var(--border); font-size: 12.5px; overflow-x: auto; white-space: nowrap; }
@media (max-width: 900px) { .pe-remind { grid-template-columns: 1fr; } }

/* ---------- Ficha de usuario ---------- */
.user-head .back-link { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 700; color: var(--muted); margin-bottom: 10px; }
.user-head .back-link:hover { color: var(--primary); }
.uh-id { display: flex; align-items: center; gap: 14px; }
.uh-id h1 { margin: 0; }
.uh-id p { margin: 2px 0 0; }
.sn-count { display: inline-block; min-width: 20px; padding: 0 6px; border-radius: 99px; background: var(--surface-2); border: 1px solid var(--border); font-size: 11px; font-weight: 700; text-align: center; color: var(--muted); margin-left: 4px; }
[data-utabs] .settings-panel > .card + .card { margin-top: 0; }
[data-utabs] .settings-panel > .card[hidden] { display: none; }
.uf-actions { margin-top: 18px; padding: 14px 0 0; border-top: 1px solid var(--border); position: sticky; bottom: 0; background: var(--bg); z-index: 3; }
.kv { display: flex; flex-wrap: wrap; gap: 28px; margin: 14px 0 0; padding-top: 14px; border-top: 1px solid var(--border); }
.kv dt { font-size: 12px; color: var(--muted); font-weight: 700; }
.kv dd { margin: 2px 0 0; font-weight: 600; }
.mod-access { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--border); }
.mod-access h3, .uf-sub { font-size: 14px; margin: 0 0 8px; }
.mod-access ul, .uf-events { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.mod-access li { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; background: var(--surface-2); font-weight: 600; font-size: 14px; }
.ma-ico { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; background: var(--surface); color: var(--muted); }
.mod-access li.yes .ma-ico { color: var(--primary); }
.ma-st { margin-left: auto; }
.mod-access li .ma-yes, .mod-access li.yes .ma-no { display: none; }
.mod-access li.yes .ma-yes { display: inline-flex; }
.mod-access li:not(.yes) { color: var(--muted); }
.ma-admin { display: none; margin-top: 8px; }
.mod-access.is-admin .ma-admin { display: block; }
.uf-events li { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; background: var(--surface-2); }
.uf-events li .badge { margin-left: auto; }
.uf-events li .icon-btn { margin-left: 2px; }
.uf-events + small, .uf-events + .muted { display: block; margin-top: 10px; }
.uf-stats { display: flex; gap: 12px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--border); }
.uf-stats > * { display: flex; flex-direction: column; padding: 10px 14px; border-radius: 12px; background: var(--surface-2); color: var(--text); min-width: 130px; }
.uf-stats b { font-size: 22px; }
.uf-stats span span, .uf-stats a span { font-size: 12.5px; color: var(--muted); font-weight: 600; }
.group-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -4px 0 16px; }
.gf-label { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: var(--muted); margin-right: 4px; }
.group-filter .chip-btn b { font-size: 11.5px; font-weight: 700; opacity: .7; }
a.group-chip { text-decoration: none; transition: filter .15s; }
a.group-chip:hover { filter: brightness(.94); }

/* ---------- Modo Administración / Intranet ---------- */
.mode-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; padding: 3px; margin: 2px 0 8px; border-radius: 12px; background: var(--sb-hover, var(--surface-2)); border: 1px solid var(--sb-border, var(--border)); }
.mode-switch a { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 7px 6px; border-radius: 9px; font-size: 13px; font-weight: 700; color: var(--sb-muted, var(--muted)); transition: background .15s, color .15s; white-space: nowrap; }
.mode-switch a:hover { color: var(--sb-text, var(--text)); }
.mode-switch a.on { background: var(--sb-bg, var(--surface)); color: var(--sb-active-text, var(--primary)); box-shadow: 0 1px 3px rgba(15, 23, 42, .12); }
.menu-mode { max-width: 420px; margin: -6px 0 16px; }
.menu-mode .mode-switch { background: var(--surface-2); border-color: var(--border); }
.menu-mode .mode-switch a.on { background: var(--surface); color: var(--primary); }
.nav-admin .nav-group-head { font-weight: 700; }
.nav-viewas summary { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; cursor: pointer; list-style: none; color: var(--sb-text, var(--text-2)); font-weight: 600; font-size: 14.5px; }
.nav-viewas summary::-webkit-details-marker { display: none; }
.nav-viewas summary:hover { background: var(--sb-hover, var(--surface-2)); }
.nav-viewas form { display: grid; gap: 6px; padding: 4px 12px 10px 14px; }
.nav-viewas form p { margin: 0 0 2px; font-size: 12px; color: var(--sb-muted, var(--muted)); }
.nav-viewas .check { color: var(--sb-text, var(--text)); }
.nav-viewas .btn { margin-top: 4px; }

/* ---------- Elegir perfil al entrar ---------- */
.choose-wrap { grid-template-columns: minmax(0, 1fr); justify-items: center; }
.choose-card { max-width: 520px; width: 100%; }
.choose-opts { display: grid; gap: 12px; margin: 6px 0 14px; }
.choose-opt { display: flex; align-items: center; gap: 16px; width: 100%; text-align: left; padding: 18px; border-radius: 16px; border: 1.5px solid var(--border); background: var(--surface); color: var(--text); font: inherit; cursor: pointer; transition: border-color .15s, box-shadow .15s, transform .15s; }
.choose-opt:hover, .choose-opt:focus-visible { border-color: var(--primary); box-shadow: 0 8px 24px -12px color-mix(in srgb, var(--primary) 60%, transparent); transform: translateY(-1px); outline: none; }
.choose-opt > svg:last-child { color: var(--muted); flex: none; }
.co-ico { width: 54px; height: 54px; border-radius: 14px; display: grid; place-items: center; flex: none; background: var(--primary-soft); color: var(--primary); }
.co-ico.personal { background: #e7f8f1; color: #059669; }
[data-theme="dark"] .co-ico.personal { background: #0f2e25; color: #34d399; }
.co-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1; }
.co-text strong { font-size: 17px; }
.co-text small { color: var(--muted); font-size: 13.5px; line-height: 1.4; }
.co-text .group-chips { margin-top: 4px; }

/* ---------- Accesos directos del Inicio ---------- */
.quick-actions { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 12px; margin-bottom: 18px; }
.qa { display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 16px; background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow); color: var(--text); transition: border-color .15s, transform .15s, box-shadow .15s; }
.qa:hover { border-color: color-mix(in srgb, var(--c) 45%, var(--border)); transform: translateY(-2px); box-shadow: 0 10px 24px -14px color-mix(in srgb, var(--c) 70%, transparent); }
.qa-ico { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; flex: none; background: color-mix(in srgb, var(--c) 13%, var(--surface)); color: var(--c); }
.qa-text { display: flex; flex-direction: column; min-width: 0; }
.qa-text strong { font-size: 14.5px; }
.qa-text small { font-size: 12.5px; color: var(--muted); line-height: 1.3; }
.lite-qa { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.lite-qa .qa { padding: 12px; }
@media (max-width: 640px) { .quick-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); } .quick-actions .qa-text small { display: none; } }

/* Logotipo del menú lateral a todo el ancho de la barra, sin márgenes */
/* Mismo ancho y márgenes que el interruptor Administrador / Personal (el relleno de la barra: 20px arriba, 14px a los lados) */
.sidebar .brand.has-logo { margin: 0; padding: 0; gap: 0; align-items: stretch; }
.sidebar .brand.has-logo .brand-logo { width: 100%; max-width: none; max-height: none; height: auto; border-radius: 12px; padding: var(--sb-logo-pad, 0); object-position: center; }
[data-theme="dark"] .sidebar .brand.has-logo .brand-logo { padding: 10px 14px; }
.sidebar .brand.has-logo .brand-name { padding: 10px 8px 0; }

/* ---------- Comunicados y noticias ---------- */
.news-filters .type-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip-btn b { font-size: 11.5px; opacity: .7; }
.chip-warn:not(.on) { color: #b45309; border-color: #fcd9a8; background: #fff8ec; }
[data-theme="dark"] .chip-warn:not(.on) { color: #fbbf24; border-color: #5c4313; background: #2a200d; }
.badge-new { background: var(--primary); color: var(--on-primary, #fff); }
.nc-kind { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--k); }
.news-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.news-card { display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; color: var(--text); transition: transform .15s, box-shadow .15s, border-color .15s; position: relative; }
.news-card:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--k) 40%, var(--border)); box-shadow: 0 14px 30px -18px color-mix(in srgb, var(--k) 60%, transparent); }
.news-card.unread::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--k); z-index: 1; }
.news-card.pinned { border-color: color-mix(in srgb, var(--k) 35%, var(--border)); }
.nc-img { display: block; aspect-ratio: 16 / 7; background: var(--surface-2); overflow: hidden; }
.nc-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nc-noimg { display: grid; place-items: center; color: var(--k); background: linear-gradient(135deg, color-mix(in srgb, var(--k) 14%, var(--surface)), color-mix(in srgb, var(--k) 4%, var(--surface))); }
.nc-body { display: flex; flex-direction: column; gap: 6px; padding: 16px 18px 18px; }
.nc-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.nc-meta .badge { height: 20px; font-size: 11px; }
.nc-title { font-size: 17px; line-height: 1.3; letter-spacing: -.01em; }
.news-card.unread .nc-title { font-weight: 800; }
.nc-excerpt { font-size: 14px; color: var(--text-2); line-height: 1.5; }
.nc-foot { font-size: 12.5px; color: var(--muted); margin-top: 2px; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.news-card.big { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
.news-card.big .nc-img { aspect-ratio: auto; min-height: 240px; }
.news-card.big .nc-body { padding: 26px 28px; justify-content: center; }
.news-card.big .nc-title { font-size: 24px; }
.news-card.big .nc-excerpt { font-size: 15px; }
.news-card.big:not(:has(.nc-img)) { grid-template-columns: 1fr; }
.read-bar { display: inline-block; width: 70px; height: 6px; border-radius: 99px; background: var(--surface-2); border: 1px solid var(--border); overflow: hidden; vertical-align: middle; }
.read-bar i { display: block; height: 100%; background: var(--success); border-radius: 99px; }
.read-bar.big { display: block; width: 100%; height: 8px; margin: 4px 0 18px; }
/* Lectura */
.news-view { max-width: 780px; margin: 0 auto 24px; }
.news-view .back-link, .news-edit + .back-link, .page-head .back-link { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 700; color: var(--muted); margin-bottom: 14px; }
.news-view .back-link:hover, .page-head .back-link:hover { color: var(--primary); }
.nv-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.nv-edit { margin-left: auto; }
.news-view h1 { font-size: 32px; line-height: 1.2; letter-spacing: -.02em; margin: 10px 0 6px; }
.nv-by { font-size: 14px; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; margin: 0 0 20px; }
.nv-img { margin: 0 0 22px; border-radius: 18px; overflow: hidden; border: 1px solid var(--border); }
.nv-img img { width: 100%; display: block; }
.nv-lead { font-size: 18px; line-height: 1.55; color: var(--text); font-weight: 500; margin: 0 0 16px; }
.nv-body { font-size: 16px; line-height: 1.7; color: var(--text-2); }
.nv-body h3 { font-size: 19px; color: var(--text); margin: 26px 0 8px; }
.nv-body p { margin: 0 0 14px; }
.nv-body ul, .nv-body ol { margin: 0 0 14px; padding-left: 22px; }
.nv-body li { margin: 4px 0; }
.nv-body a { color: var(--primary); text-decoration: underline; text-underline-offset: 2px; word-break: break-word; }
.nv-body strong { color: var(--text); }
.nv-files { margin-top: 26px; }
.nv-files h2 { font-size: 15px; display: flex; align-items: center; gap: 6px; margin: 0 0 10px; }
.file-list { display: grid; gap: 8px; }
.file-item { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 12px; background: var(--surface); border: 1px solid var(--border); color: var(--text); transition: border-color .15s; }
a.file-item:hover { border-color: var(--primary); }
.file-item > svg { color: var(--muted); margin-left: auto; flex: none; }
.fi-ext { width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; font-size: 10.5px; font-weight: 800; letter-spacing: .03em; flex: none; background: #eef0ff; color: #4f46e5; }
.fi-pdf { background: #fdecec; color: #dc2626; } .fi-doc { background: #e8f0fe; color: #2563eb; } .fi-xls, .fi-csv { background: #e7f8f1; color: #059669; }
.fi-ppt { background: #fff1e7; color: #ea580c; } .fi-zip, .fi-txt { background: var(--surface-2); color: var(--muted); }
.fi-name { display: flex; flex-direction: column; min-width: 0; }
.fi-name strong { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fi-name small { font-size: 12px; color: var(--muted); }
.file-item.editable .check { margin-left: auto; white-space: nowrap; }
.nv-confirm { margin-top: 26px; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding: 16px 18px; border-radius: 16px; background: #fff8ec; border: 1px solid #fcd9a8; }
.nv-confirm > div { display: flex; flex-direction: column; flex: 1; min-width: 200px; }
.nv-confirm small { color: var(--muted); }
.nvc-ico { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: #fde7c4; color: #b45309; flex: none; }
.nv-confirm.done { background: var(--success-soft); border-color: color-mix(in srgb, var(--success) 30%, transparent); }
.nv-confirm.done .nvc-ico { background: color-mix(in srgb, var(--success) 18%, transparent); color: var(--success); }
[data-theme="dark"] .nv-confirm:not(.done) { background: #2a200d; border-color: #5c4313; }
[data-theme="dark"] .nvc-ico { background: #3d2c0f; color: #fbbf24; }
.news-stats { max-width: 780px; margin: 0 auto; }
.ns-kpis { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.ns-kpis > div { display: flex; flex-direction: column; padding: 10px 14px; border-radius: 12px; background: var(--surface-2); min-width: 120px; }
.ns-kpis b { font-size: 22px; }
.ns-kpis span { font-size: 12.5px; color: var(--muted); font-weight: 600; }
.ns-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.ns-cols h3 { font-size: 14px; margin: 0 0 8px; }
.ns-people { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; max-height: 340px; overflow: auto; }
.ns-people li { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.ns-people li small { margin-left: auto; font-size: 12px; white-space: nowrap; }
/* Edición */
.news-edit { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 20px; align-items: start; }
.ne-main > .card + .card { margin-top: 18px; }
.ne-side { position: sticky; top: 20px; display: grid; gap: 16px; }
.ne-side > .card { margin: 0; }
.ne-title { font-size: 18px; font-weight: 700; }
.ne-body { font-size: 15px; line-height: 1.6; min-height: 260px; }
.ne-help code { font-size: 11.5px; padding: 1px 5px; border-radius: 5px; background: var(--surface-2); border: 1px solid var(--border); }
.ne-eu { border: 1px solid var(--border); border-radius: 12px; padding: 10px 14px; margin-top: 4px; }
.ne-eu summary { cursor: pointer; font-weight: 700; font-size: 14px; display: flex; align-items: center; gap: 8px; }
.ne-eu[open] summary { margin-bottom: 12px; }
.ne-eu .field + .field { margin-top: 12px; }
.ne-files { display: grid; gap: 10px; margin-top: 16px; }
.uploader-preview.news-prev { width: 220px; height: 124px; border-radius: 12px; background: var(--surface-2); overflow: hidden; display: grid; place-items: center; color: var(--muted); border: 1px dashed var(--border-strong); }
.uploader-preview.news-prev img { width: 100%; height: 100%; object-fit: cover; }
.ne-sub { margin-left: 28px; }
.ne-sub[hidden] { display: none; }
.ne-targets { grid-template-columns: 1fr; }
.ne-actions { display: grid; gap: 8px; }
.check.disabled { opacity: .6; }
.type-card small { font-size: 12px; color: var(--muted); font-weight: 500; line-height: 1.35; }
/* Inicio */
.home-news .hn-item { display: flex; gap: 12px; padding: 10px 8px; border-radius: 12px; color: var(--text); align-items: flex-start; }
.home-news .hn-item:hover { background: var(--surface-2); }
.hn-dot { width: 8px; height: 8px; border-radius: 50%; margin-top: 7px; flex: none; background: transparent; }
.hn-item.unread .hn-dot { background: var(--k); }
.hn-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.hn-body strong { font-size: 14.5px; }
.hn-item.unread .hn-body strong { font-weight: 800; }
.hn-body small { font-size: 12.5px; color: var(--muted); }
.hn-thumb { width: 64px; height: 44px; border-radius: 8px; object-fit: cover; flex: none; margin-left: auto; }
.pending-banner { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-radius: 14px; background: #fff8ec; border: 1px solid #fcd9a8; color: var(--text); margin-bottom: 18px; }
.pending-banner:hover { border-color: #f59e0b; }
[data-theme="dark"] .pending-banner { background: #2a200d; border-color: #5c4313; }
.pending-banner .nvc-ico { width: 34px; height: 34px; }
.pending-banner > svg:last-child { margin-left: auto; color: var(--muted); }
@media (max-width: 1100px) { .news-edit { grid-template-columns: 1fr; } .ne-side { position: static; } }
@media (max-width: 760px) {
  .news-list { grid-template-columns: 1fr; }
  .news-card.big { grid-template-columns: 1fr; }
  .news-card.big .nc-img { min-height: 0; aspect-ratio: 16 / 8; }
  .news-card.big .nc-body { padding: 16px 18px 18px; }
  .news-card.big .nc-title { font-size: 19px; }
  .news-view h1 { font-size: 25px; }
  .ns-cols { grid-template-columns: 1fr; }
}
.news-edit .type-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 16px; }
.news-edit .type-card { flex-wrap: wrap; align-items: center; padding: 12px 14px; }
.news-edit .type-card small { flex-basis: 100%; }
@media (max-width: 640px) { .news-edit .type-cards { grid-template-columns: 1fr; } }
.uf-perm { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--border); }
.uf-perm h3 { font-size: 14px; margin: 0 0 8px; }
/* Cada permiso especial es una fila: columna estrecha (casilla o vacía) + título con icono + explicación */
.uf-prow { display: grid; grid-template-columns: 22px minmax(0, 1fr); column-gap: 10px; align-items: start; padding: 12px 0; margin: 0; }
.uf-prow + .uf-prow { border-top: 1px solid var(--border); }
.uf-plead { display: flex; justify-content: center; padding-top: 1px; }
.uf-plead input { width: 18px; height: 18px; margin: 0; }
.uf-pbody { display: flex; flex-direction: column; gap: 3px; min-width: 0; font-size: 14px; font-weight: 400; color: var(--text-2); }
.uf-ptitle { display: inline-flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 600; color: var(--text); }
.uf-pbody small { font-size: 13px; line-height: 1.45; }
.uf-pcheck { cursor: pointer; }

/* ---------- Menú de administración en tres niveles + buscador ---------- */
.nav-search { margin: 0 0 6px; }
.nav-search input { height: 36px; font-size: 13.5px; background: var(--sb-hover, var(--surface-2)); border-color: var(--sb-border, var(--border)); color: var(--sb-text, var(--text)); }
.nav-search .icon, .nav-search svg { color: var(--sb-muted, var(--muted)); }
.nav-admin .nav-sub { margin-top: 12px; padding-left: 2px; }
.nav-admin .nav-group-items .nav-sub:first-child { margin-top: 4px; }
.nav-search-empty { font-size: 13px; color: var(--sb-muted, var(--muted)); padding: 6px 12px; margin: 0; }
.nav-admin.searching .nav-group-items { grid-template-rows: 1fr !important; }
.nav-admin.searching .nav-group-head .nav-count { visibility: hidden; }
.nav-admin a.search-hit { background: var(--sb-hover, var(--surface-2)); }
.admin-sub { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin: 14px 0 6px; }
.admin-sec h2 + .admin-sub { margin-top: 2px; }
.menu-sub { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin: 10px 0 8px; }

/* ---------- Logotipo en modo oscuro ---------- */
.sidebar .brand-logo { filter: var(--sb-logo-filter, none); }
.logo-dark-opts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.logo-dark-opt { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 10px; border: 1.5px solid var(--border); border-radius: 12px; cursor: pointer; background: var(--surface); }
.logo-dark-opt input { position: absolute; opacity: 0; pointer-events: none; }
.logo-dark-opt:has(input:checked) { border-color: var(--primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 16%, transparent); }
.logo-dark-opt:has(input:focus-visible) { outline: 2px solid var(--primary); outline-offset: 2px; }
.ldo-prev { height: 64px; border-radius: 9px; background: #171a2b; display: grid; place-items: center; padding: 10px; }
.ldo-prev img { max-width: 100%; max-height: 40px; object-fit: contain; }
.ldo-plate img { background: #fff; padding: 5px 8px; border-radius: 7px; }
.ldo-white img { filter: brightness(0) invert(1); }
.ldo-text { display: flex; flex-direction: column; gap: 2px; }
.ldo-text strong { font-size: 14px; }
.ldo-text small { font-size: 12px; color: var(--muted); line-height: 1.35; }
@media (max-width: 760px) { .logo-dark-opts { grid-template-columns: 1fr; } }
.logo-dark-opts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { .logo-dark-opts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .logo-dark-opts { grid-template-columns: 1fr; } }
.ldo-empty { color: rgba(255, 255, 255, .55); }
.ldo-upload { margin-top: 12px; }
.ldo-upload[hidden] { display: none; }
.ldo-darkprev { background: #171a2b !important; }
.logo-d { display: none; }
.sidebar .brand-logo.logo-l { display: var(--sb-logo-l, block); }
.sidebar .brand-logo.logo-d { display: var(--sb-logo-d, none); }

/* Menú lateral: cada opción en una sola línea (si algo no cabe, se corta con «…» y el nombre entero sale al pasar el ratón) */
.nav a > span, .nav-group-head > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.nav-group-head > span { flex: 1; }

/* ---------- Excepciones en los permisos ---------- */
.excl { margin-top: 10px; border: 1px dashed var(--border-strong); border-radius: 12px; background: var(--surface); }
.excl > summary { display: flex; align-items: center; gap: 8px; padding: 9px 12px; cursor: pointer; list-style: none; font-size: 13.5px; }
.excl > summary::-webkit-details-marker { display: none; }
.excl > summary svg { color: var(--danger); }
.excl-names { margin-left: auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 60%; }
.excl[open] > summary { border-bottom: 1px solid var(--border); }
.excl-body { padding: 10px 12px 12px; display: grid; gap: 8px; }
.excl-body p { margin: 0; }
.excl-list { max-height: 240px; overflow: auto; }
.excl .pick-item.out-group { display: none; }
.excl .pick-item.on { background: color-mix(in srgb, var(--danger) 8%, transparent); }
.excl-info { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--border); }
.excl-info h3 { font-size: 14px; margin: 0 0 8px; }
.excl-info ul { margin: 0; padding-left: 18px; font-size: 14px; }
.mod-access li.excluded .ma-no::after { content: " · " attr(data-x); }

/* ---------- Notificaciones: campana y desplegable ---------- */
.bell { position: relative; }
.bell-count {
  position: absolute; top: 2px; right: 1px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 99px;
  background: var(--text-2); color: var(--surface); font-size: 10.5px; font-weight: 800; line-height: 17px; text-align: center;
  box-shadow: 0 0 0 2px var(--surface); pointer-events: none;
}
.sidebar .bell-count { box-shadow: 0 0 0 2px var(--sb-bg, var(--surface)); background: var(--sb-text-2, var(--text-2)); color: var(--sb-bg, var(--surface)); }
.bell-count.hot, .sidebar .bell-count.hot { background: var(--danger); color: #fff; }
.bell-count[hidden] { display: none; }
.notif-pop {
  position: fixed; z-index: 90; width: 380px; max-width: calc(100vw - 20px); max-height: min(560px, calc(100vh - 20px));
  display: flex; flex-direction: column; background: var(--surface); color: var(--text); border: 1px solid var(--border);
  border-radius: 14px; box-shadow: var(--shadow-lg); overflow: hidden; animation: np-in .14s ease-out;
}
.notif-pop[hidden] { display: none; }
.notif-pop.sheet { left: 10px !important; right: 10px !important; width: auto; max-height: calc(100vh - 80px); }
@keyframes np-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.np-loading { height: 160px; background: linear-gradient(90deg, transparent, var(--surface-2), transparent) 0 0 / 200% 100%; animation: np-sh 1s linear infinite; }
@keyframes np-sh { to { background-position: -200% 0; } }
.np-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 12px 6px 16px; }
.np-head strong { font-size: 15px; }
.icon-btn.sm { width: 30px; height: 30px; }
.np-tabs { display: flex; gap: 4px; padding: 0 12px; border-bottom: 1px solid var(--border); }
.np-tabs button {
  flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 9px 6px; border: 0; background: none;
  font: inherit; font-weight: 700; font-size: 13.5px; color: var(--muted); border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: pointer;
}
.np-tabs button[aria-selected="true"] { color: var(--primary); border-bottom-color: var(--primary); }
.np-n { display: inline-block; min-width: 18px; padding: 0 6px; border-radius: 99px; background: var(--surface-2); border: 1px solid var(--border); color: var(--text-2); font-size: 11.5px; font-weight: 800; line-height: 17px; text-align: center; }
.np-n.hot, .tabs a span.np-n.hot { background: var(--danger); border-color: var(--danger); color: #fff; }
.np-pane { overflow-y: auto; flex: 1; min-height: 0; }
.np-list { list-style: none; margin: 0; padding: 6px; }
.np-item { display: flex; align-items: flex-start; gap: 11px; padding: 10px; border-radius: 10px; color: var(--text); text-decoration: none; position: relative; }
.np-item:hover { background: var(--surface-2); }
.np-item > .ico:last-child { color: var(--muted); align-self: center; flex: none; }
.np-ico { flex: none; width: 32px; height: 32px; border-radius: 9px; display: grid; place-items: center; color: var(--k, var(--primary)); background: color-mix(in srgb, var(--k, var(--primary)) 14%, transparent); }
.np-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.np-body strong { font-size: 13.5px; font-weight: 600; line-height: 1.35; }
.np-item.unread .np-body strong, .np-item.todo .np-body strong { font-weight: 750; }
.np-body small { color: var(--text-2); font-size: 12.5px; line-height: 1.35; }
.np-body time { color: var(--muted); font-size: 11.5px; }
.np-item:not(.unread) .np-ico { filter: saturate(.6); opacity: .8; }
.np-dot { position: absolute; top: 14px; right: 10px; width: 8px; height: 8px; border-radius: 50%; background: var(--primary); }
.np-item.unread { padding-right: 24px; }
.np-item.tone-warn .np-ico { box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--warning) 60%, transparent); }
.np-item.tone-danger .np-ico { color: var(--danger); background: var(--danger-soft); }
.np-item.tone-danger .np-body small { color: var(--danger); }
.np-empty { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 34px 16px; color: var(--muted); text-align: center; }
.np-empty p { margin: 0; font-size: 13.5px; }
.np-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 14px; border-top: 1px solid var(--border); font-size: 13px; }
.np-foot .link-btn { display: inline-flex; align-items: center; gap: 5px; }
/* Página completa */
.notif-tabs { margin-bottom: 16px; }
.notif-card { padding: 8px; }
.notif-card > p.muted { padding: 8px 10px 0; margin: 0; }
.notif-card .np-list { padding: 4px; }
.notif-card .np-item { padding: 12px; }
.notif-keep { display: flex; align-items: center; gap: 6px; padding: 6px 10px 6px !important; }
.notif-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 12px; }
.notif-filter .spacer { flex: 1; }
.nf-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 99px; border: 1px solid var(--border); background: var(--surface); color: var(--text-2); font-size: 13px; font-weight: 600; text-decoration: none; }
.nf-chip .ico { color: var(--c, currentColor); }
.nf-chip:hover { border-color: var(--border-strong); }
.nf-chip.on { background: var(--primary-soft); border-color: var(--primary); color: var(--primary); }
/* Preferencias (Mi perfil) */
.notif-prefs { margin-top: 20px; }
.np-prefs td, .np-prefs th { vertical-align: middle; }
.np-prefs .c { text-align: center; width: 90px; }
.np-prefs .switch { margin-top: 0; }
.np-pk { display: flex; align-items: flex-start; gap: 10px; }
.np-pk > span:last-child { display: flex; flex-direction: column; gap: 2px; }
.np-pk small { font-size: 12.5px; line-height: 1.35; }
/* Inicio: «Para hacer» */
.home-todo .np-list { padding: 0; margin: 0 -8px; }
.home-todo .card-head h2 .np-n { vertical-align: 2px; margin-left: 4px; }
/* Sistema → Notificaciones */
.radio-list { display: flex; flex-direction: column; gap: 8px; }
.na-pick { margin-top: 4px; }
.na-pick .pick-list { max-height: 320px; overflow: auto; border: 1px solid var(--border); border-radius: 10px; padding: 6px; margin-top: 8px; }
.na-h { font-size: 14px; margin: 16px 0 6px; }
.na-list { list-style: none; padding: 0; margin: 0 0 12px; display: flex; flex-direction: column; gap: 8px; }
.na-list li { display: flex; align-items: flex-start; gap: 8px; font-size: 13.5px; }
.na-list li > .ico { color: var(--k, var(--primary)); flex: none; margin-top: 2px; }
.lite-top .bell { margin-left: auto; }
@media (max-width: 760px) { .np-prefs .c { width: 64px; } .np-pk small { display: none; } }
.notif-admin { align-items: start; }
.notif-admin > .card { margin: 0; }
/* La sección ya se ve en las migas de la barra superior: en escritorio sobra encima del título */
@media (min-width: 901px) { .page-head .eyebrow:has(> .ico) { display: none; } }
.topbar .bell-count { box-shadow: 0 0 0 2px var(--bg); }
@media (max-width: 900px) { .topbar .bell-count { box-shadow: 0 0 0 2px var(--surface); } }
/* Mi perfil: cabecera de la columna de secciones */
.profile-mini { display: flex; align-items: center; gap: 10px; padding: 4px 12px 14px; margin-bottom: 6px; border-bottom: 1px solid var(--border); }
.settings-panel .notif-prefs { margin-top: 0; }
.settings-panel .ro-facts { margin-top: 4px; }
@media (max-width: 900px) { .profile-mini { display: none; } }
@media (max-width: 640px) {
  .np-prefs th, .np-prefs td { padding-left: 6px; padding-right: 6px; }
  .np-prefs .c { width: 52px; }
  .np-prefs th.c { font-size: 0; }
  .np-prefs th.c .ico { width: 16px; height: 16px; }
  .np-pk .np-ico { display: none; }
}
/* Carga masiva de usuarios */
.uimp-pass { display: flex; align-items: center; gap: 16px; border-color: color-mix(in srgb, var(--warning) 45%, var(--border)); background: color-mix(in srgb, var(--warning) 7%, var(--surface)); }
.uimp-pass h2 { font-size: 16px; margin: 0 0 4px; }
.uimp-pass p { margin: 0; }
.uimp-pass > div:nth-child(2) { flex: 1; min-width: 0; }
.uimp-pass-ico { flex: none; width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; color: var(--warning); background: color-mix(in srgb, var(--warning) 15%, transparent); }
.pe-upload .radio-list { gap: 4px; margin: 4px 0 10px; }
@media (max-width: 640px) { .uimp-pass { flex-direction: column; align-items: flex-start; } }

/* Caducidades: Mi perfil → Carnets y certificados */
.exp-list { display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }
.exp-item { border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; background: var(--surface); }
.exp-item.missing, .exp-item.st-expired { border-color: color-mix(in srgb, var(--danger) 40%, var(--border)); }
.exp-item.st-soon { border-color: color-mix(in srgb, var(--warning) 50%, var(--border)); }
.exp-main { display: flex; align-items: center; gap: 12px; }
.exp-ico { flex: none; width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; color: var(--c); background: color-mix(in srgb, var(--c) 14%, transparent); }
.exp-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.exp-text small { color: var(--text-2); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.exp-miss { color: var(--danger) !important; font-weight: 600; }
.exp-pend { color: var(--primary) !important; font-weight: 600; }
.exp-upd { margin-top: 10px; }
.exp-upd > summary { list-style: none; display: inline-flex; cursor: pointer; }
.exp-upd > summary::-webkit-details-marker { display: none; }
.exp-upd[open] > summary { display: none; }
.exp-form-row { display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap; }
.exp-form-row .field { margin: 0; }
.exp-form-row .exp-note { flex: 1; min-width: 200px; }
.exp-form-row > .btn { margin-bottom: 2px; }
.exp-admin { margin: 8px 0 0 50px; display: flex; align-items: center; gap: 5px; }
.exp-add { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--border); }
.exp-add select { width: auto; }
/* Panel de responsables */
.exp-tabs { margin-bottom: 16px; }
.exp-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.exp-kpi { display: flex; flex-direction: column; gap: 2px; padding: 14px 16px; border-radius: 14px; background: var(--surface); border: 1px solid var(--border); color: var(--text-2); text-decoration: none; }
.exp-kpi b { font-size: 26px; line-height: 1.1; color: var(--text); }
.exp-kpi:hover { border-color: var(--border-strong); }
.exp-kpi.on { box-shadow: 0 0 0 2px var(--primary); border-color: var(--primary); }
.exp-kpi.k-danger b { color: var(--danger); }
.exp-kpi.k-warn b { color: var(--warning); }
.exp-kpi.k-miss b { color: #e11d48; }
.exp-kpi.k-info b { color: var(--primary); }
.exp-board th { white-space: nowrap; }
.exp-board td { vertical-align: middle; }
.exp-person { display: flex; align-items: center; gap: 10px; min-width: 170px; }
.exp-person > span { display: flex; flex-direction: column; min-width: 0; }
.exp-cell { display: inline-flex; flex-direction: column; padding: 5px 10px; border-radius: 9px; border: 1px solid transparent; color: var(--text); text-decoration: none; min-width: 92px; }
.exp-cell small { font-size: 11.5px; color: var(--muted); }
.exp-cell:hover { border-color: var(--border-strong); }
.exp-cell.st-ok { background: color-mix(in srgb, var(--success) 9%, transparent); }
.exp-cell.st-soon { background: color-mix(in srgb, var(--warning) 14%, transparent); }
.exp-cell.st-soon small { color: var(--warning); font-weight: 600; }
.exp-cell.st-expired { background: var(--danger-soft); }
.exp-cell.st-expired small, .exp-cell.st-expired strong { color: var(--danger); }
.exp-cell.st-missing { border: 1px dashed color-mix(in srgb, var(--danger) 55%, transparent); }
.exp-cell.st-missing strong { color: var(--danger); }
.exp-cell.st-none { min-width: 40px; }
.exp-pend-chip { display: inline-flex; align-items: center; gap: 4px; margin-top: 4px; font-size: 11.5px; font-weight: 600; color: var(--primary); text-decoration: none; }
.exp-reqs { display: flex; flex-direction: column; }
.exp-req { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(200px, 1.2fr) auto; gap: 14px; align-items: center; padding: 14px 20px; border-top: 1px solid var(--border); }
.exp-req-what { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; }
.exp-dates { display: flex; align-items: center; gap: 6px; }
.exp-req-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.exp-req-actions input { width: 200px; }
.pe-exp-fields { margin: 4px 0; }
.pe-exp-fields legend { display: flex; align-items: center; gap: 6px; }
.cal-entry.pe-renew { border-style: dashed; }
@media (max-width: 900px) {
  .exp-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .exp-req { grid-template-columns: 1fr; }
  .exp-req-actions { justify-content: flex-start; }
  .exp-req-actions input { flex: 1; width: auto; }
}
#responsables { margin-bottom: 16px; }
.exp-dates { white-space: nowrap; }
.exp-board + p, .card.flush + p.muted.small { margin-top: 10px; }

/* ---------- Documentos ---------- */
.modal.modal-lg { max-width: 860px; }
.docs-layout { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 24px; align-items: start; }
.docs-nav { position: sticky; top: 80px; display: flex; flex-direction: column; gap: 2px; }
.docs-nav a { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; color: var(--text-2); font-weight: 600; font-size: 14px; text-decoration: none; }
.docs-nav a > span:not(.doc-fico) { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.docs-nav a small { color: var(--muted); font-weight: 600; font-size: 12px; }
.docs-nav a:hover { background: var(--surface); }
.docs-nav a.on { background: var(--surface); color: var(--text); box-shadow: var(--shadow); }
.docs-nav a.sub { margin-left: 22px; font-size: 13.5px; }
.doc-fico { flex: none; width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; color: var(--c, var(--primary)); background: color-mix(in srgb, var(--c, var(--primary)) 14%, transparent); }
.doc-fico.lg { width: 48px; height: 48px; border-radius: 13px; }
.docs-main { min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.docs-main > .card { margin: 0; }
.docs-search { display: flex; gap: 10px; }
.docs-search .search-box { flex: 1; }
.docs-search .search-box input { height: 46px; font-size: 15px; }
.doc-folders { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; }
.doc-folder-card { display: flex; flex-direction: column; gap: 6px; padding: 16px; border-radius: 14px; background: var(--surface); border: 1px solid var(--border); color: var(--text); text-decoration: none; transition: border-color .15s, transform .15s; }
.doc-folder-card:hover { border-color: color-mix(in srgb, var(--c) 50%, var(--border)); transform: translateY(-1px); }
.doc-folder-card .doc-fico { width: 38px; height: 38px; border-radius: 10px; margin-bottom: 4px; }
.doc-folder-head { display: flex; align-items: flex-start; gap: 14px; }
.doc-folder-head h2 { margin: 2px 0 4px; font-size: 22px; }
.doc-folder-head p { margin: 0 0 2px; }
.doc-list { display: flex; flex-direction: column; }
.doc-row { display: flex; align-items: center; gap: 14px; padding: 12px 20px; border-top: 1px solid var(--border); }
.doc-row:hover { background: var(--surface-2); }
.doc-row.doc-todo { box-shadow: inset 3px 0 0 var(--warning); }
.doc-ext { flex: none; width: 42px; height: 48px; border-radius: 8px; display: grid; place-items: center; font-size: 10.5px; font-weight: 800; letter-spacing: .04em; color: #fff; background: #64748b; position: relative; }
.doc-ext::after { content: ""; position: absolute; top: 0; right: 0; border-width: 0 10px 10px 0; border-style: solid; border-color: var(--surface) var(--surface) rgba(255, 255, 255, .45) rgba(255, 255, 255, .45); border-radius: 0 0 0 3px; }
.doc-ext.ext-pdf { background: #dc2626; }
.doc-ext.ext-doc { background: #2563eb; }
.doc-ext.ext-xls, .doc-ext.ext-csv { background: #16a34a; }
.doc-ext.ext-ppt { background: #ea580c; }
.doc-ext.ext-zip { background: #7c3aed; }
.doc-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; color: var(--text); text-decoration: none; }
.doc-main strong { font-size: 14.5px; display: flex; align-items: center; gap: 4px; }
.doc-main strong .ico { color: var(--warning); }
.doc-desc { color: var(--text-2); font-size: 13px; }
.doc-meta { color: var(--muted); font-size: 12.5px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.doc-lang { display: inline-block; padding: 0 5px; border-radius: 5px; border: 1px solid var(--border); font-size: 10.5px; font-weight: 800; color: var(--text-2); margin-right: 3px; text-decoration: none; }
.doc-acts { display: flex; gap: 2px; flex: none; }
.doc-detail { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; align-items: start; }
.doc-detail-main, .doc-detail-side { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.doc-detail .card { margin: 0; }
.doc-text { margin-bottom: 16px; line-height: 1.6; }
.doc-files { display: flex; flex-direction: column; gap: 10px; }
.doc-file { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; flex-wrap: wrap; }
.doc-file-text { flex: 1; min-width: 160px; display: flex; flex-direction: column; }
.doc-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.doc-tag { font-size: 12.5px; font-weight: 600; color: var(--primary); background: var(--primary-soft); padding: 2px 8px; border-radius: 99px; text-decoration: none; }
.doc-confirm { width: 100%; border: 0; text-align: left; margin-bottom: 16px; }
.doc-confirm > span:not(.nvc-ico) { flex: 1; }
.doc-facts { margin: 0; display: flex; flex-direction: column; gap: 10px; }
.doc-facts dt { font-size: 12px; color: var(--muted); font-weight: 600; }
.doc-facts dd { margin: 2px 0 0; }
.doc-versions { list-style: none; margin: 0; padding: 0; }
.doc-versions li { padding: 10px 20px; border-top: 1px solid var(--border); }
.doc-versions li.cur { background: var(--primary-soft); }
.doc-vfiles { display: inline-flex; gap: 4px; margin-left: 6px; }
.nr-progress { display: flex; align-items: center; gap: 12px; }
.nr-bar { flex: 1; height: 10px; border-radius: 99px; background: var(--surface-2); overflow: hidden; }
.nr-bar span { display: block; height: 100%; background: var(--success); border-radius: 99px; }
.doc-people { list-style: none; padding: 0; margin: 10px 0 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px; }
.doc-people li { display: flex; align-items: center; gap: 8px; font-size: 13.5px; }
.doc-edit { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; align-items: start; }
.doc-edit-main, .doc-edit-side { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.doc-edit .card { margin: 0; }
.doc-edit-side .check { margin-bottom: 12px; }
.doc-edit-actions { display: flex; flex-direction: column; gap: 8px; }
.doc-folder-name { display: flex; align-items: center; gap: 10px; }
.doc-folder-name.sub { margin-left: 28px; }
.doc-bulk .pe-upload { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.doc-bulk .pe-drop { width: 100%; }
@media (max-width: 900px) {
  .docs-layout, .doc-detail, .doc-edit { grid-template-columns: minmax(0, 1fr); }
  .docs-nav { position: static; flex-direction: row; overflow-x: auto; gap: 6px; scrollbar-width: none; }
  .docs-nav::-webkit-scrollbar { display: none; }
  .docs-nav a { flex: none; border: 1px solid var(--border); background: var(--surface); }
  .docs-nav a.sub { margin-left: 0; }
  .doc-row { padding: 12px 14px; gap: 10px; }
  .doc-ext { width: 36px; height: 42px; }
}
@media (max-width: 640px) {
  .doc-confirm { flex-wrap: wrap; }
  .doc-confirm > span:not(.nvc-ico) { flex: 1 1 calc(100% - 60px); }
  .doc-confirm button { width: 100%; justify-content: center; }
  .doc-row { align-items: flex-start; }
}
.doc-lang.bi { background: var(--primary-soft); border-color: transparent; color: var(--primary); }
.doc-or { display: flex; align-items: center; gap: 10px; margin: 6px 0 10px; color: var(--muted); font-size: 12.5px; font-weight: 600; }
.doc-or::before, .doc-or::after { content: ""; flex: 1; height: 1px; background: var(--border); }
.ocu-actions { align-items: center; }
@media (max-width: 760px) { .ocu-actions .seg { width: 100%; } .ocu-actions .btn { width: 100%; justify-content: center; } }
/* Mi calendario: recordatorio de que se pueden apuntar cosas propias */
.cal-tip { display: flex; align-items: center; gap: 12px; padding: 12px 16px; margin-bottom: 16px; border-radius: 14px; background: color-mix(in srgb, #8b5cf6 8%, var(--surface)); border: 1px solid color-mix(in srgb, #8b5cf6 25%, var(--border)); }
.cal-tip > span:nth-child(2) { flex: 1; min-width: 0; }
.cal-tip-ico { flex: none; width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; color: #8b5cf6; background: color-mix(in srgb, #8b5cf6 15%, transparent); }
@media (max-width: 640px) { .cal-tip { flex-wrap: wrap; } .cal-tip .btn { width: 100%; justify-content: center; } }
/* Documentos: selección para eliminar varios */
.doc-selbar { display: flex; align-items: center; gap: 12px; padding: 8px 20px; border-top: 1px solid var(--border); background: var(--surface-2); }
.doc-selbar .spacer { flex: 1; }
.doc-sel { flex: none; display: grid; place-items: center; width: 24px; height: 24px; cursor: pointer; }
.doc-sel input { width: 17px; height: 17px; margin: 0; cursor: pointer; }
.doc-row.selected { background: color-mix(in srgb, var(--danger) 6%, transparent); }
/* Barra superior con color propio (Ajustes → Apariencia): variables --tb-*; sin ellas, el aspecto original */
.topbar { background: var(--tb-bg, color-mix(in srgb, var(--bg) 85%, transparent)); border-bottom-color: var(--tb-border, var(--border)); }
.topbar .crumbs ol { color: var(--tb-muted, var(--muted)); }
.topbar .crumbs li[aria-current] { color: var(--tb-text, var(--text)); }
.topbar .icon-btn { color: var(--tb-text-2, var(--text-2)); }
.topbar .icon-btn:hover { background: var(--tb-hover, var(--surface-2)); color: var(--tb-text, var(--text)); }
.topbar .umenu-btn { color: var(--tb-text, var(--text)); }
.topbar .umenu-btn .me-text small, .topbar .umenu-btn > .ico { color: var(--tb-muted, var(--muted)); }
.topbar .umenu-btn:hover, .topbar .umenu-btn[aria-expanded="true"] { background: var(--tb-hover, var(--surface)); border-color: var(--tb-border, var(--border)); }
.topbar .bell-count { box-shadow: 0 0 0 2px var(--tb-bg, var(--bg)); }
.topbar .bell-count:not(.hot) { background: var(--tb-text-2, var(--text-2)); color: var(--tb-bg, var(--surface)); }
@media (max-width: 900px) {
  .topbar { background: var(--tb-bg, var(--surface)); }
  .topbar .bell-count { box-shadow: 0 0 0 2px var(--tb-bg, var(--surface)); }
}
.tp-main { flex-direction: column; }
.tp-top { display: flex; align-items: center; gap: 4px; height: 14px; margin: -12px -12px 10px; padding: 0 10px; flex: none; background: var(--tb-bg, var(--bg)); border-bottom: 1px solid var(--tb-border, var(--border)); }
.tp-top i { width: 30px; height: 3px; border-radius: 2px; background: var(--tb-muted, var(--muted)); opacity: .7; }
.tp-top span { margin-left: auto; width: 7px; height: 7px; border-radius: 50%; background: var(--tb-text-2, var(--text-2)); }

/* ---------- Administración → Resumen ---------- */
.ad-section { margin-bottom: 30px; }
.ad-h { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 700; color: var(--text-2); margin: 0 0 12px; text-transform: none; }
.ad-h .ico { color: var(--muted); }
.ad-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; margin-bottom: 14px; }
.ad-tile { display: flex; align-items: flex-start; gap: 12px; padding: 16px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); color: inherit; text-decoration: none; min-width: 0; }
.ad-tile.link { transition: border-color .15s, box-shadow .15s, transform .15s; }
.ad-tile.link:hover { border-color: var(--border-strong); box-shadow: 0 6px 18px -10px rgba(20, 24, 50, .25); transform: translateY(-1px); }
.ad-ico { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; flex: none; }
.ad-ico.t-green { background: var(--success-soft); color: var(--success); }
.ad-ico.t-blue { background: color-mix(in srgb, #0284c7 13%, var(--surface)); color: #0284c7; }
.ad-ico.t-indigo { background: var(--primary-soft); color: var(--primary); }
.ad-ico.t-amber { background: color-mix(in srgb, var(--warning) 14%, var(--surface)); color: var(--warning); }
.ad-ico.t-red { background: var(--danger-soft); color: var(--danger); }
.ad-ico.t-rose { background: color-mix(in srgb, #db2777 12%, var(--surface)); color: #db2777; }
.ad-tv { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.ad-tv strong { font-size: 26px; line-height: 1.1; font-weight: 750; letter-spacing: -.02em; color: var(--text); font-variant-numeric: tabular-nums; }
.ad-tv strong small { font-size: 15px; font-weight: 600; margin-left: 1px; color: var(--text-2); }
.ad-tv > span { font-size: 13px; color: var(--text-2); font-weight: 600; margin-top: 2px; }
.ad-tv > small { font-size: 12px; color: var(--muted); margin-top: 3px; }
.ad-meter { height: 6px; border-radius: 3px; background: var(--surface-2); border: 1px solid var(--border); overflow: hidden; margin-top: 7px; }
.ad-meter span { display: block; height: 100%; background: var(--primary); border-radius: 3px; }
.ad-grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 14px; }
.ad-card { margin: 0; }
.ad-card + .ad-card { margin-top: 0; }
.ad-section > .ad-card { margin-top: 0; }
.ad-card .card-head h3 { font-size: 14px; margin: 0; }
/* Columnas: una serie, un color; la de hoy, más intensa; fines de semana, más claros */
.ad-chart { padding-top: 6px; }
.ad-plot { position: relative; display: flex; align-items: flex-end; gap: 2px; height: 150px; border-bottom: 1px solid var(--border-strong);
  background: linear-gradient(to top, transparent calc(50% - .5px), var(--border) calc(50% - .5px), var(--border) calc(50% + .5px), transparent calc(50% + .5px)) ; }
.ad-plot::before { content: ""; position: absolute; left: 0; right: 0; top: 0; border-top: 1px dashed var(--border); }
.ad-max { position: absolute; top: -8px; left: 0; font-size: 11px; color: var(--muted); background: var(--surface); padding-right: 4px; line-height: 16px; z-index: 1; }
.ad-col { position: relative; flex: 1; height: 100%; display: flex; align-items: flex-end; outline: none; cursor: default; min-width: 0; }
.ad-col i { display: block; width: 100%; max-width: 26px; margin: 0 auto; background: color-mix(in srgb, var(--primary) 72%, var(--surface)); border-radius: 4px 4px 0 0; transition: background .15s; }
.ad-col.we i { background: color-mix(in srgb, var(--primary) 38%, var(--surface)); }
.ad-col.today i { background: var(--primary); }
.ad-col:hover i, .ad-col:focus-visible i { background: var(--primary-600); }
.ad-col:hover, .ad-col:focus-visible { background: color-mix(in srgb, var(--primary) 6%, transparent); border-radius: 4px 4px 0 0; }
.ad-x { display: flex; gap: 2px; margin-top: 6px; }
.ad-x span { flex: 1; min-width: 0; text-align: center; font-size: 11px; color: var(--muted); white-space: nowrap; overflow: visible; }
/* Barras horizontales */
.ad-hbars { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.ad-hbars li { display: grid; grid-template-columns: minmax(0, 11em) 1fr auto; align-items: center; gap: 10px; font-size: 13px; }
.ad-hb-name { display: flex; align-items: center; gap: 7px; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--text-2); }
.ad-hb-bar { position: relative; height: 12px; display: block; }
.ad-hb-bar i { display: block; height: 100%; background: color-mix(in srgb, var(--primary) 72%, var(--surface)); border-radius: 0 4px 4px 0; }
.ad-hb-bar:hover i { background: var(--primary-600); }
.ad-hb-val { font-variant-numeric: tabular-nums; color: var(--text); font-weight: 600; min-width: 3.2em; text-align: right; }
/* Personas conectadas y listas */
.ad-people { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.ad-people li { display: flex; align-items: center; gap: 9px; font-size: 13.5px; }
.ad-people li::after { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--success); margin-left: auto; box-shadow: 0 0 0 3px var(--success-soft); }
.ad-list { list-style: none; margin: 0; padding: 0; }
.ad-list li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-top: 1px solid var(--border); }
.ad-list li:first-child { border-top: 0; }
.ad-list a { display: flex; flex-direction: column; min-width: 0; color: inherit; text-decoration: none; }
.ad-list a:hover strong { color: var(--primary); }
.ad-list strong { font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Tooltip de las marcas */

.ad-col[data-tip]:hover::after, .ad-col[data-tip]:focus-visible::after, .ad-hb-bar[data-tip]:hover::after {
  content: attr(data-tip); position: absolute; bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%); z-index: 5;
  background: var(--text); color: var(--surface); font-size: 12px; font-weight: 500; line-height: 1.3; padding: 5px 9px; border-radius: 7px; white-space: nowrap; pointer-events: none;
  box-shadow: 0 6px 16px -6px rgba(0, 0, 0, .35); }
.ad-col[data-tip]:hover::after, .ad-col[data-tip]:focus-visible::after { bottom: auto; top: -30px; }
.ad-plot .ad-col:first-child[data-tip]:hover::after, .ad-plot .ad-col:nth-child(2)[data-tip]:hover::after, .ad-plot .ad-col:nth-child(3)[data-tip]:hover::after { left: 0; transform: none; }
.ad-plot .ad-col:last-child[data-tip]:hover::after, .ad-plot .ad-col:nth-last-child(2)[data-tip]:hover::after { left: auto; right: 0; transform: none; }
@media (max-width: 900px) { .ad-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .ad-tiles { grid-template-columns: 1fr 1fr; gap: 10px; } .ad-tile { padding: 12px; flex-direction: column; gap: 8px; } .ad-tv strong { font-size: 22px; } .ad-plot { height: 120px; } }
/* Documentos más descargados */
.ad-section > .ad-grid + .ad-card { margin-top: 14px; }
.ad-tiles + .ad-card { margin-top: 0; }
.seg.seg-sm { padding: 2px; border-radius: 9px; }
.seg.seg-sm a { padding: 4px 10px; font-size: 12.5px; border-radius: 7px; }
.ad-top { list-style: none; margin: 0; padding: 0; }
.ad-top li { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 12px 0; border-top: 1px solid var(--border); }
.ad-top li:first-child { border-top: 0; padding-top: 2px; }
.ad-rank { width: 22px; height: 22px; border-radius: 7px; background: var(--surface-2); border: 1px solid var(--border); display: grid; place-items: center; font-size: 11.5px; font-weight: 700; color: var(--text-2); margin-top: 1px; }
.ad-top-main { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.ad-top-line { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 8px; row-gap: 1px; min-width: 0; }
.ad-top-line a { color: inherit; text-decoration: none; min-width: 0; }
.ad-top-line a:hover strong { color: var(--primary); }
.ad-top-line strong { font-size: 13.5px; }
.ad-top-line small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex-shrink: 1; min-width: 0; }
.ad-top .ad-hb-bar { height: 8px; }
.ad-chips { display: flex; flex-wrap: wrap; gap: 5px; }
.ad-chip { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--text-2); background: var(--surface-2); border: 1px solid var(--border); border-radius: 999px; padding: 2px 8px 2px 7px; }
.ad-chip .room-dot { width: 7px; height: 7px; border-radius: 50%; }
.ad-chip b { color: var(--text); font-variant-numeric: tabular-nums; }
.ad-chip.more { color: var(--muted); }
.ad-top-val { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.15; min-width: 4.5em; }
.ad-top-val strong { font-size: 18px; font-variant-numeric: tabular-nums; }
.ad-top-val small { font-size: 11.5px; color: var(--muted); }
.ad-note { margin: 14px 0 0; display: flex; gap: 6px; align-items: flex-start; }
.ad-hb-bar[data-tip]:hover::after { bottom: auto; top: -32px; }
.ad-card .card-head { flex-wrap: wrap; row-gap: 8px; }

/* ---------- Administración → Registro de cambios ---------- */
.au-obj { display: flex; align-items: center; gap: 12px; padding: 14px 16px; margin-bottom: 14px; }
.au-obj > div { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.au-obj strong { font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.au-date { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--muted); }
.au-date input { width: auto; }
.au-list { list-style: none; margin: 0; padding: 0; }
.au-day { padding: 10px 18px; background: var(--surface-2); border-bottom: 1px solid var(--border); font-size: 12.5px; font-weight: 700; color: var(--text-2); }
.au-list li.au-day:first-child { border-radius: var(--radius) var(--radius) 0 0; }
.au-row { display: grid; grid-template-columns: 46px minmax(140px, 190px) minmax(0, 1fr) auto; gap: 14px; align-items: start; padding: 12px 18px; border-bottom: 1px solid var(--border); }
.au-row:last-child { border-bottom: 0; }
.au-time { font-variant-numeric: tabular-nums; font-size: 13px; font-weight: 600; color: var(--text-2); padding-top: 3px; }
.au-who { display: flex; align-items: center; gap: 8px; min-width: 0; font-size: 13.5px; font-weight: 600; }
.au-who > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.au-anon { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--danger-soft); color: var(--danger); flex: none; }
.au-what { min-width: 0; }
.au-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.au-act { font-size: 11.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px; white-space: nowrap; }
.au-act.t-green { background: var(--success-soft); color: var(--success); }
.au-act.t-blue { background: color-mix(in srgb, #0284c7 13%, var(--surface)); color: #0284c7; }
.au-act.t-indigo { background: var(--primary-soft); color: var(--primary); }
.au-act.t-amber { background: color-mix(in srgb, var(--warning) 14%, var(--surface)); color: var(--warning); }
.au-act.t-red { background: var(--danger-soft); color: var(--danger); }
.au-ent { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; color: var(--muted); }
.au-label { font-size: 14px; font-weight: 600; color: var(--text); text-decoration: none; overflow-wrap: anywhere; }
a.au-label:hover { color: var(--primary); text-decoration: underline; }
.au-hist { color: var(--muted); display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 6px; }
.au-hist:hover { background: var(--surface-2); color: var(--primary); }
.au-changes { list-style: none; margin: 7px 0 0; padding: 0; display: flex; flex-direction: column; gap: 3px; font-size: 13px; }
.au-changes li { overflow-wrap: anywhere; }
.au-field { color: var(--muted); margin-right: 6px; }
.au-field::after { content: ":"; }
.au-changes del { color: var(--muted); text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--danger) 55%, transparent); }
.au-changes ins { text-decoration: none; color: var(--text); font-weight: 600; }
.au-arrow { color: var(--muted); margin: 0 2px; }
.au-more { margin-top: 4px; font-size: 13px; }
.au-more summary { cursor: pointer; list-style: none; color: var(--primary); font-weight: 600; font-size: 12.5px; }
.au-more summary::-webkit-details-marker { display: none; }
.au-ip { font-size: 11.5px; font-variant-numeric: tabular-nums; padding-top: 4px; white-space: nowrap; }
.au-keep { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 16px; }
.au-keep select { width: auto; }
@media (max-width: 760px) {
  .au-row { grid-template-columns: 40px minmax(0, 1fr); gap: 4px 10px; padding: 12px 14px; }
  .au-who { grid-column: 2; }
  .au-what { grid-column: 2; }
  .au-ip { display: none; }
  .au-day { position: static; }
}
.head-icons { display: inline-flex; gap: 2px; align-items: center; }
/* Registro de cambios: filtros en dos líneas, «Filtrar» siempre a la derecha */
.toolbar.au-filters { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
.au-frow { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.toolbar.au-filters .au-frow .search-box { flex: 1 1 340px; min-width: 240px; }
.toolbar.au-filters .au-frow select { flex: 0 0 180px; width: 180px; min-width: 0; }
.au-go { margin-left: auto; }
@media (max-width: 640px) {
  .au-frow > * { flex: 1 1 100%; }
  .au-frow .spacer { display: none; }
  .au-date input { flex: 1; }
}
@media (min-width: 641px) and (max-width: 1250px) {
  .toolbar.au-filters .au-frow .search-box { flex-basis: 100%; }
  .toolbar.au-filters .au-frow select { flex: 1 1 0; width: auto; }
}
/* Seguridad en la ficha de usuario y en Ajustes */
.sec-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border); }
.sec-actions small { flex: 1 1 240px; }
.sec-locked { flex: 1 1 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; padding: 10px 12px; border-radius: var(--radius-sm); background: var(--danger-soft); color: var(--danger); font-size: 13.5px; }
.sec-locked span { flex: 1; }
.sec-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; }
.sec-list { list-style: none; margin: 0; padding: 0; }
.sec-list li { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-top: 1px solid var(--border); font-size: 13.5px; }
.sec-list li:first-child { border-top: 0; }
.sec-list li span { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.sec-checks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; font-size: 13.5px; }
.sec-checks li { display: flex; gap: 8px; align-items: flex-start; }
.sec-checks .ok { color: var(--success); } .sec-checks .ko { color: var(--warning); }
.sec-grid { margin: 12px 0 4px; }
.sec-grid + p { margin-top: 10px; }

/* ---------- Verificación en dos pasos ---------- */
.tfa-card { max-width: 440px; }
.tfa-setup-card { max-width: 560px; }
.tfa-head { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 6px; margin-bottom: 14px; }
.tfa-head h1 { font-size: 22px; margin: 4px 0 0; }
.tfa-head p { margin: 0; }
.tfa-ico { width: 52px; height: 52px; border-radius: 15px; display: grid; place-items: center; background: var(--primary-soft); color: var(--primary); flex: none; }
.tfa-ico.on { background: var(--success-soft); color: var(--success); }
.tfa-ico.sm { width: 36px; height: 36px; border-radius: 10px; }
.tfa-who { display: inline-flex; align-items: center; gap: 8px; margin-top: 6px; padding: 4px 12px 4px 4px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--border); font-size: 13px; }
.tfa-code { font-size: 26px !important; letter-spacing: .3em; text-align: center; font-variant-numeric: tabular-nums; font-weight: 700; height: 56px !important; }
.tfa-code.recovery { letter-spacing: .15em; text-transform: uppercase; }
.tfa-code.sm { font-size: 18px !important; height: 42px !important; width: 150px; letter-spacing: .2em; }
.tfa-alt { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin: 14px 0 6px; font-size: 13.5px; }
.tfa-alt a { display: inline-flex; align-items: center; gap: 6px; }
.tfa-alt-out { margin-top: 14px; }
.tfa-steps { padding: 6px 4px; }
.card.tfa-steps { padding: 22px; }
.tfa-step-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 22px; }
.tfa-step-list > li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 12px; }
.tfa-step-list p { margin: 4px 0 10px; }
.tfa-n { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--primary); color: var(--on-primary, #fff); font-weight: 700; font-size: 13px; }
.tfa-qr-row { display: flex; gap: 18px; align-items: flex-start; flex-wrap: wrap; }
.tfa-qr { width: 184px; height: 184px; padding: 6px; background: #fff; border: 1px solid var(--border); border-radius: 12px; flex: none; }
.tfa-qr svg { width: 100%; height: 100%; display: block; }
.tfa-manual { flex: 1 1 200px; font-size: 13.5px; }
.tfa-manual summary { cursor: pointer; }
.tfa-secret { display: block; font-size: 15px; letter-spacing: .08em; padding: 10px 12px; background: var(--surface-2); border: 1px solid var(--border); border-radius: 8px; word-break: break-all; user-select: all; }
.tfa-confirm { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 8px; }
.tfa-confirm .tfa-code:not(.sm) { width: 210px; }
.tfa-codes-card p { margin-top: 0; }
.tfa-codes { list-style: none; margin: 14px 0 18px; padding: 16px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 24px; background: var(--surface-2); border: 1px dashed var(--border-strong); border-radius: 12px; }
.tfa-codes code { font-size: 17px; letter-spacing: .1em; font-weight: 600; }
[data-copy].done { color: var(--success); }
.tfa-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; align-items: start; }
.tfa-grid .card { margin: 0; }
.tfa-status { display: flex; align-items: center; gap: 14px; }
.tfa-status h2 { margin: 0; font-size: 18px; }
.tfa-status p { margin: 2px 0 0; }
.tfa-profile { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.tfa-profile > div { flex: 1 1 260px; }
.tfa-profile h2 { font-size: 16px; margin: 0 0 2px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tfa-profile p { margin: 0; }
.sec-tfa { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border); font-size: 13.5px; }
.sec-tfa > div { flex: 1 1 220px; }
.sec-checks .muted { color: var(--muted); }
@media print {
  body:has(.tfa-codes-card) * { visibility: hidden; }
  .tfa-codes-card, .tfa-codes-card * { visibility: visible; }
  .tfa-codes-card { position: absolute; left: 0; top: 0; border: 0; box-shadow: none; }
  .tfa-codes-card .form-actions { display: none; }
}
@media (max-width: 560px) { .tfa-codes { grid-template-columns: 1fr; } .tfa-qr-row { flex-direction: column; } }
.tfa-alt form { display: inline; margin: 0; } .tfa-alt .link-btn { color: var(--muted); font-weight: 600; }
.sec-form { margin-bottom: 18px; }
.card > p.muted + .sec-checks { margin-top: 12px; }
.card .sec-checks + .sub-label { margin-top: 16px; }
@media (max-width: 560px) { .tfa-manual { flex: none; } }

/* ---------- Directorio y organigrama ---------- */
.dir-filters .search-box { flex: 2 1 280px; }
.dir-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 14px; }
.dir-card { display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; transition: border-color .15s, box-shadow .15s, transform .15s; }
.dir-card:hover { border-color: var(--border-strong); box-shadow: 0 8px 22px -14px rgba(20, 24, 50, .35); transform: translateY(-1px); }
.dir-card[hidden] { display: none; }
.dir-card.is-hidden { opacity: .7; border-style: dashed; }
.dir-open { display: flex; gap: 14px; align-items: flex-start; padding: 16px 16px 12px; text-align: left; background: none; border: 0; color: inherit; font: inherit; cursor: pointer; width: 100%; flex: 1; }
.dir-open .avatar { width: 48px; height: 48px; font-size: 16px; flex: none; }
.dir-who { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1; }
.dir-who strong { font-size: 15px; line-height: 1.25; }
.dir-job { font-size: 13px; color: var(--text-2); }
.dir-meta { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 3px; }
.dir-dept { display: inline-flex; align-items: center; gap: 3px; font-size: 11.5px; font-weight: 600; padding: 1px 8px; border-radius: 999px; color: var(--text-2);
  background: color-mix(in srgb, var(--c, var(--primary)) 13%, var(--surface)); border: 1px solid color-mix(in srgb, var(--c, var(--primary)) 30%, transparent); }
.dir-dept .ico { color: var(--c); }
.dir-place { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.dir-place i, .org-label i { width: 8px; height: 8px; border-radius: 50%; background: var(--c); flex: none; display: inline-block; }
.dir-actions { display: flex; align-items: center; gap: 4px; padding: 6px 10px 8px 16px; border-top: 1px solid var(--border); background: var(--surface-2); min-height: 44px; }
.dir-ext { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; font-weight: 700; color: var(--text-2); font-variant-numeric: tabular-nums; }
.dir-ro { margin: 0; padding: 9px 0; font-size: 14px; }
.radio-row { display: flex; flex-wrap: wrap; gap: 6px 22px; }
/* Ficha emergente */
.dir-dlg { width: min(460px, calc(100vw - 32px)); border: 0; border-radius: 18px; padding: 24px; background: var(--surface); color: var(--text); box-shadow: 0 24px 60px -20px rgba(0, 0, 0, .45); position: relative; }
.dir-dlg::backdrop { background: rgba(15, 18, 35, .45); backdrop-filter: blur(2px); }
.dir-dlg-close { position: absolute; top: 12px; right: 12px; margin: 0; }
.dir-dlg-head { display: flex; gap: 16px; align-items: center; margin-bottom: 16px; padding-right: 30px; }
.dir-dlg-head h2 { margin: 0; font-size: 19px; }
.dir-dlg-head p { margin: 2px 0 0; color: var(--text-2); font-size: 14px; }
.dir-dlg-head p:empty { display: none; }
.dir-dl { margin: 0 0 18px; display: grid; gap: 0; border-top: 1px solid var(--border); }
.dir-dl > div { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--border); font-size: 14px; }
.dir-dl > div[hidden] { display: none; }
.dir-dl dt { color: var(--muted); font-size: 13px; }
.dir-dl dd { margin: 0; overflow-wrap: anywhere; font-weight: 500; }
.dir-dlg-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.dir-dlg-actions [hidden] { display: none; }
.dir-dlg-admin { margin: 14px 0 0; font-size: 13px; }
.dir-dlg-admin a { display: inline-flex; gap: 5px; align-items: center; }
/* Organigrama */
.org-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 16px; align-items: start; }
.org-dept { margin: 0; border-top: 4px solid var(--c, var(--border-strong)); }
.org-dept header { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.org-dept h2 { font-size: 17px; margin: 0; }
.org-dept > p { margin: 4px 0 0; }
.org-leads { margin-top: 14px; padding: 10px; border-radius: 12px; background: color-mix(in srgb, var(--c, var(--primary)) 8%, var(--surface)); display: flex; flex-direction: column; gap: 4px; }
.org-co { margin-top: 14px; }
.org-label { display: flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); margin: 0 0 6px 2px; }
.org-people { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 4px; }
.org-person { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 10px; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; min-width: 0; }
.org-person:hover, .org-person:focus-visible { background: var(--surface-2); }
.org-person > span { display: flex; flex-direction: column; min-width: 0; }
.org-person strong { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.org-person small { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.org-person.lead strong { font-size: 14.5px; }
.org-person.lead small { font-size: 12.5px; }
.org-none { border-top-style: dashed; }
/* Grupos: responsables en la lista de miembros */
.pick-row { display: flex; align-items: center; gap: 8px; }
.pick-row > label.check { flex: 1; min-width: 0; margin: 0; }
.mgr-toggle { display: none; align-items: center; gap: 4px; font-size: 12px; font-weight: 600; color: var(--text-2); padding: 3px 8px; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); cursor: pointer; white-space: nowrap; }
.pick-row.on .mgr-toggle { display: inline-flex; }
.mgr-toggle:has(input:checked) { border-color: var(--warning); color: var(--warning); background: color-mix(in srgb, var(--warning) 10%, var(--surface)); }
.mgr-toggle input { margin: 0; }
@media (max-width: 560px) { .dir-grid, .org-grid { grid-template-columns: 1fr; } .dir-dl > div { grid-template-columns: 1fr; gap: 0; } }
.org-grid > .card, .org-grid > .card + .card { margin: 0; }
.dir-filters .search-box { min-width: 260px; }
.nav-sep.nav-sep-top { margin: 10px 10px 12px; background: var(--sb-border, var(--border-strong)); }
.nav-sep { flex: none; min-height: 1px; }

/* ---------- Modo de pruebas ---------- */
.test-banner { position: fixed; left: 50%; bottom: 14px; transform: translateX(-50%); z-index: 90; display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px 7px 12px;
  border-radius: 999px; background: #f59e0b; color: #1f1300; font-size: 12.5px; box-shadow: 0 8px 24px -8px rgba(0, 0, 0, .35); text-decoration: none; white-space: nowrap; max-width: calc(100vw - 24px); }
.test-banner strong { text-transform: uppercase; letter-spacing: .04em; font-size: 11.5px; }
.test-banner span { opacity: .85; overflow: hidden; text-overflow: ellipsis; }
a.test-banner:hover { background: #fbbf24; }
@media (max-width: 760px) { .test-banner { bottom: 76px; } .test-banner span { display: none; } }
@media print { .test-banner { display: none; } }
.test-state { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; font-weight: 700; font-size: 13px; background: var(--surface-2); color: var(--muted); border: 1px solid var(--border); }
.test-state.on { background: #fef3c7; color: #92400e; border-color: #fcd34d; }
.switch-row { display: flex; gap: 12px; align-items: flex-start; padding: 4px 0 14px; cursor: pointer; }
.switch-row input { width: 20px; height: 20px; margin-top: 2px; flex: none; }
.switch-row span { display: flex; flex-direction: column; gap: 2px; }
.test-mail-to { max-width: 360px; margin: -2px 0 6px 28px; }
.test-tools { list-style: none; margin: 0; padding: 0; }
.test-tools li { display: flex; align-items: center; gap: 16px; padding: 12px 0; border-top: 1px solid var(--border); }
.test-tools li:first-child { border-top: 0; padding-top: 0; }
.test-tools li > div { flex: 1; display: flex; flex-direction: column; gap: 2px; font-size: 14px; }
.test-tools form { margin: 0; }
.outbox { list-style: none; margin: 0; padding: 0; }
.outbox li { border-top: 1px solid var(--border); }
.outbox summary { display: grid; grid-template-columns: 120px minmax(0, 220px) minmax(0, 1fr) auto auto; gap: 12px; align-items: center; padding: 10px 18px; cursor: pointer; font-size: 13.5px; list-style: none; }
.outbox summary::-webkit-details-marker { display: none; }
.outbox summary:hover { background: var(--surface-2); }
.ob-when { color: var(--muted); font-size: 12.5px; white-space: nowrap; }
.ob-to { color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ob-subj { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.ob-body { margin: 0 18px 14px; padding: 14px; background: var(--surface-2); border: 1px solid var(--border); border-radius: 10px; white-space: pre-wrap; font: 13px/1.5 ui-monospace, Menlo, Consolas, monospace; max-height: 420px; overflow: auto; }
.test-seed-grid { display: grid; grid-template-columns: minmax(0, 260px) minmax(0, 1fr); gap: 18px 24px; align-items: start; }
.test-note { flex: 1 1 260px; max-width: 420px; }
.ob-html { display: block; width: calc(100% - 36px); height: 560px; margin: 0 18px 10px; border: 1px solid var(--border); border-radius: 10px; background: #eef2f5; }
.ob-text { margin: 0 18px 14px; } .outbox .ob-text > summary { display: block; padding: 4px 0; border: 0; } .ob-text .ob-body { margin: 8px 0 0; }
.test-adv { border: 1px solid var(--border); border-radius: 12px; margin-top: 16px; background: var(--surface-2); }
.test-adv > summary { list-style: none; cursor: pointer; padding: 12px 14px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.test-adv > summary::-webkit-details-marker { display: none; }
.test-adv > summary::after { content: ''; margin-left: auto; width: 8px; height: 8px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(45deg); transition: transform .15s; }
.test-adv[open] > summary::after { transform: rotate(-135deg); }
.test-adv[open] > summary { border-bottom: 1px solid var(--border); }
.adv-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 14px; }
.adv-block { background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: 12px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.adv-head { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.adv-head .small { flex-basis: 100%; }
.adv-block select { width: 100%; }
.adv-list { display: flex; flex-direction: column; gap: 4px; max-height: 190px; overflow: auto; padding: 4px 2px; }
.adv-list[hidden] { display: none; }
.adv-tools { font-size: 12.5px; color: var(--muted); }
.adv-scope { border: 0; margin: 0; padding: 0 14px 14px; display: flex; flex-direction: column; gap: 6px; }
.adv-scope legend { font-weight: 700; font-size: 13.5px; margin-bottom: 4px; padding: 0; }
.wipe-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px; margin: 12px 0 16px; }
.wipe-item { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; cursor: pointer; background: var(--surface); }
.wipe-item.on { border-color: var(--danger); background: var(--danger-soft); }
.wipe-item input { margin-top: 3px; }
.wi-ico { color: var(--muted); margin-top: 1px; }
.wi-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: 13.5px; }
.wipe-confirm { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 300px)); gap: 12px; }
.restore-pop { display: inline-block; position: relative; vertical-align: middle; }
.restore-pop summary { list-style: none; }
.restore-pop summary::-webkit-details-marker { display: none; }
.restore-form { position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; width: 280px; padding: 14px; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; box-shadow: var(--shadow-lg); display: flex; flex-direction: column; gap: 8px; white-space: normal; text-align: left; }
.restore-form p { margin: 0; }
@media (max-width: 700px) { .test-seed-grid, .adv-grid { grid-template-columns: 1fr; } .outbox summary { grid-template-columns: 1fr; gap: 2px; } }
/* Con el aviso del modo de pruebas abajo: el hueco va dentro del contenido (no debajo de la barra lateral) */
body:has(.test-banner) .main, body:has(.test-banner) .lite-main { padding-bottom: 56px; }
.org-grid { display: block; columns: 2 340px; column-gap: 16px; }
.org-grid > .card, .org-grid > .card + .card { break-inside: avoid; -webkit-column-break-inside: avoid; page-break-inside: avoid; margin: 0 0 16px; display: inline-block; width: 100%; vertical-align: top; }

/* ---------- Pestañas dentro de ventanas largas ---------- */
.mtabs { display: flex; gap: 2px; border-bottom: 1px solid var(--border); margin: 0 0 16px; overflow-x: auto; scrollbar-width: none; }
.mtabs::-webkit-scrollbar { display: none; }
.mtabs button { display: inline-flex; align-items: center; gap: 7px; padding: 10px 14px; margin-bottom: -1px; border: 0; border-bottom: 2px solid transparent; background: none;
  color: var(--muted); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.mtabs button:hover { color: var(--text); }
.mtabs button.on { color: var(--primary); border-bottom-color: var(--primary); }
.mtabs button em { font-style: normal; font-size: 11.5px; font-weight: 700; padding: 1px 7px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--border); color: var(--text-2); }
.mtabs button em:empty { display: none; }
.mtabs button.on em { background: var(--primary-soft); border-color: transparent; color: var(--primary); }
.mtab-panel[hidden] { display: none !important; }
fieldset.mtab-panel, .mtab-panel fieldset.site-box.mtab-panel { border: 0; padding: 0; margin: 0; min-width: 0; }
fieldset.mtab-panel > legend { display: none; }
.mtab-panel { display: flex; flex-direction: column; gap: 14px; }
.mtab-panel > .check { margin: 0; }
[data-mtabs] .form-actions { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--border); }
.modal, .modal .form, [data-mtabs] { min-width: 0; }
.modal-wrap > .modal { max-width: min(680px, 100%); }
.modal-wrap > .modal.narrow { max-width: min(480px, 100%); }
.modal-wrap > .modal.modal-lg { max-width: min(860px, 100%); }
.mtabs { max-width: 100%; }
@media (max-width: 560px) { .mtabs button { padding: 10px 10px; font-size: 13.5px; } }

/* ---------- Comunicados con plantilla (v1.46) ---------- */
.news-view.wide { max-width: 1140px; }
.nv-tools { margin-left: auto; display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.nt { --nt: #4f46e5; --nt-on: #fff; --nt-soft: #eef2ff; margin: 6px 0 4px; }
.nt-sheet { background: var(--surface); border: 1px solid var(--border); border-radius: 18px; overflow: hidden; box-shadow: var(--shadow-sm, 0 1px 2px rgba(15,23,42,.06)); }
.nt-page { padding: 34px 44px 26px; min-width: 0; }
.nt-langtag { display: block; font-size: 11px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; color: var(--muted); margin-bottom: 10px; }
.nt-logo { display: block; height: 58px; max-width: 100%; object-fit: contain; object-position: left center; margin: 0 auto 20px; }
.nt-oficial .nt-logo { object-position: center; }
.nt-lead { font-size: 18px; line-height: 1.55; font-weight: 500; color: var(--text); margin: 0 0 18px; }
.nt-body { font-size: 16px; line-height: 1.7; color: var(--text-2); }
.nt-foot { margin-top: 30px; padding-top: 12px; border-top: 1px solid var(--border); text-align: center; display: flex; flex-direction: column; gap: 5px; }
.nt-foot strong { font-size: 11px; font-style: italic; font-weight: 700; text-transform: uppercase; color: var(--muted); }
.nt-foot small { font-size: 11px; font-style: italic; line-height: 1.5; color: var(--muted); }
.nt-title { font-size: 30px; line-height: 1.2; letter-spacing: -.02em; margin: 0 0 12px; color: var(--text); }
.nt-kicker { font-size: 12.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--nt); margin: 0 0 8px; }
/* Texto con formato: en la vista y en el editor */
.rte p { margin: 0 0 14px; }
.rte h2 { font-size: 21px; line-height: 1.3; color: var(--text); margin: 26px 0 10px; }
.rte h3 { font-size: 18px; line-height: 1.35; color: var(--text); margin: 22px 0 8px; }
.rte h4 { font-size: 16px; color: var(--text); margin: 18px 0 6px; }
.rte > :first-child { margin-top: 0; }
.rte ul, .rte ol { margin: 0 0 14px; padding-left: 24px; }
.rte li { margin: 4px 0; }
.rte a { color: var(--nt, var(--primary)); text-decoration: underline; text-underline-offset: 2px; word-break: break-word; }
.rte strong { color: var(--text); }
.rte blockquote { margin: 0 0 16px; padding: 10px 16px; border-left: 4px solid var(--nt, var(--primary)); background: var(--surface-2); border-radius: 0 10px 10px 0; }
.rte .callout { margin: 0 0 16px; padding: 14px 18px 2px; border-left: 4px solid var(--nt, var(--primary)); background: var(--nt-soft, var(--primary-soft)); border-radius: 0 12px 12px 0; color: var(--text); }
.rte .callout.warn { border-left-color: #d97706; background: #fef3c7; color: #422006; }
[data-theme="dark"] .rte .callout { background: color-mix(in srgb, var(--nt, var(--primary)) 16%, transparent); }
[data-theme="dark"] .rte .callout.warn { background: #3a2a0a; color: var(--text); }
.rte hr { border: 0; border-top: 1px solid var(--border); margin: 22px 0; }
.rte table { border-collapse: collapse; width: 100%; margin: 0 0 16px; font-size: 14.5px; display: block; overflow-x: auto; }
.rte td, .rte th { border: 1px solid var(--border); padding: 7px 10px; vertical-align: top; text-align: left; }
.rte th { background: var(--surface-2); }
/* Oficial (como las instrucciones en PDF) */
.nt-oficial .nt-sheet { display: grid; grid-template-columns: minmax(0, 1fr); border-top: 6px solid var(--nt); }
.nt-oficial .nt-sheet.has-side { grid-template-columns: 190px minmax(0, 1fr); }
.nt-side { background: var(--surface-2) center / cover no-repeat; border-right: 5px solid var(--nt); min-height: 100%; }
.nt-banner { height: 170px; background: var(--surface-2) center / cover no-repeat; border-bottom: 4px solid var(--nt); }
.nt-oficial .nt-pages { display: grid; grid-template-columns: minmax(0, 1fr); }
.nt-two.nt-oficial .nt-pages { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.nt-two.nt-oficial .nt-page + .nt-page { border-left: 1px solid var(--border); }
.nt-oficial .nt-langtag { text-align: center; }
.nt-ref { text-align: center; font-size: 22px; font-weight: 800; color: #6b7280; margin: 0 0 10px; letter-spacing: -.01em; }
[data-theme="dark"] .nt-ref { color: var(--muted); }
.nt-band { background: var(--nt); color: var(--nt-on); text-align: center; font-size: 16px; font-weight: 600; text-transform: uppercase; letter-spacing: .02em; padding: 8px 14px; margin: 0 0 26px; line-height: 1.35; }
.nt-oficial .nt-lead { text-align: center; }
@media (min-width: 701px) { .nt-oficial:not(.nt-two) .nt-body p { text-align: justify; hyphens: auto; } }
.news-view .nt h1 { margin-top: 0; }
.news-view .nt-band { font-size: 16px; line-height: 1.35; letter-spacing: .02em; margin: 0 0 26px; }
.news-view .nt-title { font-size: 30px; margin: 0 0 12px; }
.news-view .nt-revista .nt-title { font-size: 34px; }
.news-view.wide + .news-stats { max-width: 1140px; }
/* Aviso */
.nt-aviso .nt-sheet { border: 2px solid var(--nt); }
.nt-aviso .nt-page { padding: 0; }
.nt-aviso .nt-page + .nt-page { border-top: 2px dashed var(--border); }
.nt-alert { display: flex; align-items: center; gap: 10px; background: var(--nt); color: var(--nt-on); padding: 14px 30px; font-weight: 800; letter-spacing: .05em; font-size: 15px; }
.nt-alert time { margin-left: auto; font-weight: 500; letter-spacing: 0; font-size: 13.5px; opacity: .92; }
.nt-in { padding: 26px 34px 24px; }
.nt-aviso .nt-logo { margin: 0 0 16px; }
.nt-aviso .nt-ref { text-align: left; font-size: 14px; color: var(--nt); margin-bottom: 6px; }
.nt-fig { margin: 0 0 18px; } .nt-fig img { width: 100%; border-radius: 12px; display: block; }
/* Revista y sencilla */
.nt-cover { margin: 0; aspect-ratio: 16 / 7.5; overflow: hidden; background: var(--surface-2); }
.nt-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nt-revista .nt-title { font-size: 34px; }
.nt-revista .nt-lead { font-size: 19px; color: var(--text-2); border-left: 3px solid var(--nt); padding-left: 14px; }
.nt-revista .nt-logo, .nt-sencilla .nt-logo { margin: 0 0 18px; }
.nt-revista .nt-page + .nt-page, .nt-sencilla .nt-page + .nt-page { border-top: 1px solid var(--border); }
.nt-sencilla .nt-sheet { border-top: 4px solid var(--nt); }
.nt-sencilla .nt-cover { aspect-ratio: 16 / 7; }
@media (max-width: 900px) {
  .nt-two.nt-oficial .nt-pages { grid-template-columns: minmax(0, 1fr); }
  .nt-two.nt-oficial .nt-page + .nt-page { border-left: 0; border-top: 1px solid var(--border); }
}
@media (max-width: 700px) {
  .nt-page { padding: 24px 18px 20px; }
  .nt-oficial .nt-sheet.has-side { grid-template-columns: minmax(0, 1fr); }
  .nt-side { min-height: 120px; border-right: 0; border-bottom: 4px solid var(--nt); }
  .nt-ref { font-size: 18px; } .nt-title, .nt-revista .nt-title, .news-view .nt-title, .news-view .nt-revista .nt-title { font-size: 24px; }
  .nt-in { padding: 20px 18px; } .nt-alert { padding: 12px 18px; flex-wrap: wrap; }
  .hide-sm { display: none; }
}
@media print {
  body:has(.news-view .nt) { background: #fff !important; padding: 0 !important; }
  body:has(.news-view .nt) .sidebar, body:has(.news-view .nt) .topbar, body:has(.news-view .nt) .alert, body:has(.news-view .nt) .flash,
  .news-view > .back-link, .nv-meta, .nv-by, .news-stats, .nv-confirm, .nv-files { display: none !important; }
  body:has(.news-view .nt) .app, body:has(.news-view .nt) .main, body:has(.news-view .nt) .main > :not(.topbar) { display: block !important; padding: 0 !important; margin: 0 !important; max-width: none !important; width: auto !important; min-height: 0 !important; }
  .news-view { max-width: none !important; margin: 0 !important; }
  .news-view .nt { margin: 0; }
  .nt-sheet { border-radius: 0; box-shadow: none; border-left: 0; border-right: 0; border-bottom: 0; }
  .nt-two.nt-oficial .nt-pages { grid-template-columns: minmax(0, 1fr); }
  .nt-two .nt-page + .nt-page { break-before: page; border: 0 !important; }
  .nt * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* Editor de comunicados */
.tpl-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.tpl-card { position: relative; display: flex; flex-direction: column; gap: 3px; padding: 10px; border: 1.5px solid var(--border); border-radius: 14px; cursor: pointer; background: var(--surface); transition: border-color .15s, box-shadow .15s; }
.tpl-card input { position: absolute; opacity: 0; pointer-events: none; }
.tpl-card:hover { border-color: var(--nt); }
.tpl-card:has(input:checked) { border-color: var(--nt); box-shadow: 0 0 0 3px color-mix(in srgb, var(--nt) 22%, transparent); }
.tpl-card:has(input:focus-visible) { outline: 2px solid var(--nt); outline-offset: 2px; }
.tpl-card strong { font-size: 14px; } .tpl-card small { font-size: 12px; color: var(--muted); }
.tpl-mini { display: flex; flex-direction: column; gap: 4px; height: 74px; padding: 8px 10px; border-radius: 8px; background: #fff; border: 1px solid var(--border); margin-bottom: 6px; overflow: hidden; }
.tpl-mini i, .tpl-mini b, .tpl-mini em { display: block; border-radius: 2px; flex: none; }
.tpl-mini em { height: 3px; background: #d1d5db; } .tpl-mini em:last-child { width: 70%; }
.tpl-oficial { border-top: 4px solid var(--nt); align-items: center; }
.tpl-oficial i { width: 26px; height: 7px; background: var(--nt); border-radius: 6px; opacity: .55; }
.tpl-oficial b { width: 100%; height: 7px; background: var(--nt); margin-bottom: 3px; }
.tpl-oficial em { width: 100%; }
.tpl-aviso { padding: 0 0 8px; border-color: var(--nt); }
.tpl-aviso i { height: 14px; background: var(--nt); border-radius: 0; margin-bottom: 4px; }
.tpl-aviso b { height: 6px; width: 60%; background: #374151; margin: 0 10px 3px; }
.tpl-aviso em { margin: 0 10px; }
.tpl-revista { padding: 0 0 8px; }
.tpl-revista i { height: 26px; background: linear-gradient(135deg, var(--nt), var(--nt-soft)); border-radius: 0; margin-bottom: 4px; }
.tpl-revista b { height: 6px; width: 55%; background: #374151; margin: 0 10px 2px; }
.tpl-revista em { margin: 0 10px; }
.tpl-sencilla { border-top: 3px solid var(--nt); }
.tpl-sencilla i { width: 30%; height: 4px; background: var(--nt); }
.tpl-sencilla b { width: 70%; height: 6px; background: #374151; margin-bottom: 3px; }
[data-theme="dark"] .tpl-mini { background: #f8fafc; }
.ne-tplopts { display: flex; gap: 10px 22px; align-items: flex-start; flex-wrap: wrap; margin: 2px 0 14px; padding: 12px 14px; border-radius: 12px; background: var(--surface-2); }
.ne-tplopts .ne-refno { width: 190px; margin: 0; } .ne-tplopts .check { flex: 1 1 280px; margin: 0; }
.ne-refno[hidden] { display: none; }
.rte-box { border: 1px solid var(--border-strong, var(--border)); border-radius: 12px; background: var(--surface); overflow: hidden; }
.rte-box:focus-within { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-soft); }
.rte-bar { display: flex; flex-wrap: wrap; gap: 4px 2px; padding: 6px; border-bottom: 1px solid var(--border); background: var(--surface-2); position: sticky; top: 0; z-index: 2; }
.rte-g { display: inline-flex; gap: 1px; padding-right: 4px; margin-right: 3px; border-right: 1px solid var(--border); }
.rte-g:last-child { border-right: 0; margin-right: 0; padding-right: 0; }
.rte-b { min-width: 31px; height: 31px; padding: 0 6px; border-radius: 8px; border: 0; background: none; color: var(--text-2); font-size: 15px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.rte-b:hover { background: var(--surface); color: var(--text); }
.rte-b.on { background: var(--primary-soft); color: var(--primary); }
.rte-t { font-size: 13px; font-weight: 800; } .rte-t2 { font-weight: 700; font-size: 12.5px; }
.rte-link { display: flex; gap: 6px; padding: 8px; border-bottom: 1px solid var(--border); background: var(--surface-2); align-items: center; }
.rte-link[hidden] { display: none; }
.rte-link input { flex: 1; min-width: 0; }
.rte-area { position: relative; min-height: 260px; max-height: 62vh; overflow-y: auto; padding: 16px 18px; font-size: 15.5px; line-height: 1.65; color: var(--text); outline: none; }
.rte-area.is-empty::before { content: attr(data-placeholder); color: var(--muted); pointer-events: none; position: absolute; left: 18px; right: 18px; top: 16px; }
.rte-area .callout { --nt: var(--primary); }
.ne-eu .rte-area { min-height: 180px; }
/* Vista previa */
.pv-bar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.pv-bar .tabs { margin-right: auto; }
.seg button { padding: 7px 12px; border-radius: 8px; font-weight: 700; font-size: 13.5px; color: var(--text-2); background: none; border: 0; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.seg button.on { background: var(--primary); color: var(--on-primary, #fff); }
.pv-pane[hidden] { display: none; }
.pv-frame { transition: max-width .2s; }
.pv-pane .news-view { max-width: 1140px; }
body.pv-phone .pv-frame, body.pv-phone .pv-mail, body.pv-phone .pv-wa { max-width: 390px; margin-left: auto; margin-right: auto; }
.pv-mailhead { background: var(--surface); border: 1px solid var(--border); border-bottom: 0; border-radius: 14px 14px 0 0; padding: 10px 16px; max-width: 760px; margin: 0 auto; }
body.pv-phone .pv-mailhead { max-width: 390px; }
.pv-mail { display: block; width: 100%; max-width: 760px; height: 78vh; margin: 0 auto; border: 1px solid var(--border); border-radius: 0 0 14px 14px; background: #eef2f5; }
.pv-wa { max-width: 560px; margin: 0 auto; }
.wa-bubble { background: #dcf8c6; color: #111b21; border-radius: 10px 10px 10px 2px; padding: 10px 12px; font-size: 14.5px; line-height: 1.45; margin: 10px 0 14px; box-shadow: 0 1px 1px rgba(0,0,0,.08); word-break: break-word; }
/* Plantillas de comunicados */
.tpl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 16px; }
.tpl-item { display: flex; flex-direction: column; gap: 10px; padding: 16px; }
.tpl-item.off { opacity: .65; }
.tpl-mini.big { height: 120px; padding: 12px 16px; gap: 6px; margin: 0; }
.tpl-mini.big.tpl-aviso, .tpl-mini.big.tpl-revista { padding: 0 0 12px; }
.tpl-mini.big em { height: 4px; }
.tpl-mini.big.tpl-oficial b { height: 10px; } .tpl-mini.big.tpl-aviso i { height: 22px; } .tpl-mini.big.tpl-revista i { height: 44px; }
.tpl-info h3 { margin: 0 0 4px; font-size: 16px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.tpl-info p { margin: 0 0 6px; display: flex; align-items: center; gap: 5px; }
.tpl-flags { display: flex; gap: 5px; flex-wrap: wrap; margin-bottom: 6px; }
.tpl-actions { display: flex; gap: 6px; justify-content: flex-end; align-items: center; flex-wrap: wrap; margin-top: auto; }
.tpl-actions form { margin: 0; }
.modal .tpl-cards { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.modal .tpl-card small { line-height: 1.35; }
.tpl-grid > .card { margin: 0; }
[data-theme="dark"] .nt-logo { background: #fff; padding: 6px 10px; border-radius: 10px; box-sizing: content-box; }

.logo-size { display: flex; flex-direction: column; gap: 10px; padding: 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-2); margin: 4px 0 14px; }
.logo-size-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.logo-size-row input[type=range] { flex: 1 1 220px; accent-color: var(--primary); }
.logo-size-row output { min-width: 58px; font-weight: 700; font-variant-numeric: tabular-nums; }
.logo-size-prev { display: flex; align-items: center; justify-content: center; min-height: 90px; padding: 14px; background: #fff; border: 1px dashed var(--border); border-radius: 10px; overflow: hidden; }
.logo-size-prev img { display: block; max-width: 100%; object-fit: contain; }

.nt-sub { font-size: 19px; line-height: 1.4; font-weight: 600; color: var(--text-2); margin: -4px 0 16px; }
.nt-oficial .nt-band + .nt-sub { text-align: center; font-size: 17px; margin: -12px 0 24px; }
.nc-sub { font-size: 14px; font-weight: 600; color: var(--text-2); margin-top: -2px; }
@media (max-width: 700px) { .nt-sub { font-size: 17px; } }

.date-fmts { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 8px; }
.date-fmt { position: relative; display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border: 1.5px solid var(--border); border-radius: 12px; cursor: pointer; background: var(--surface); }
.date-fmt input { position: absolute; opacity: 0; pointer-events: none; }
.date-fmt strong { font-size: 14px; } .date-fmt small { font-size: 12.5px; color: var(--muted); }
.date-fmt:has(input:checked) { border-color: var(--primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 16%, transparent); }
.date-fmt:has(input:focus-visible) { outline: 2px solid var(--primary); outline-offset: 2px; }
/* Administración · calendario de reservas */
.cal-toolbar { display: flex; gap: 10px 14px; align-items: center; flex-wrap: wrap; }
.cal-toolbar .inline-form { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }
.mcal-wrap { overflow-x: auto; }
.mcal { display: grid; grid-template-columns: repeat(7, minmax(120px, 1fr)); min-width: 840px; }
.mc-head { padding: 10px 12px; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); border-bottom: 1px solid var(--border); background: var(--surface-2); }
.mc-day { min-height: 128px; padding: 6px 6px 8px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.mc-day:nth-child(7n) { border-right: 0; }
.mc-day.we { background: color-mix(in srgb, var(--surface-2) 60%, transparent); }
.mc-day.out { opacity: .45; }
.mc-day.today { box-shadow: inset 0 0 0 2px var(--primary); }
.mc-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 2px; }
.mc-num { width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 13px; color: var(--text); }
.mc-num:hover { background: var(--primary-soft); color: var(--primary); }
.mc-day.today .mc-num { background: var(--primary); color: var(--on-primary, #fff); }
.mc-count { font-size: 11px; font-weight: 800; color: var(--muted); background: var(--surface-2); border-radius: 999px; padding: 1px 7px; }
.mc-ev { display: block; font-size: 12px; line-height: 1.3; padding: 3px 6px; border-radius: 6px; background: color-mix(in srgb, var(--c) 14%, var(--surface)); border-left: 3px solid var(--c); color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mc-ev:hover { background: color-mix(in srgb, var(--c) 24%, var(--surface)); }
.mc-ev time { font-weight: 700; font-variant-numeric: tabular-nums; }
.mc-ev small { color: var(--muted); }
.mc-more { font-size: 12px; font-weight: 700; color: var(--primary); padding: 1px 6px; }
form.inline { display: inline-flex; margin: 0; }

.alert-warning { background: #fef3c7; color: #92400e; }
[data-theme="dark"] .alert-warning { background: #3a2a0a; color: #fcd34d; }
.pv-unsaved { align-items: center; flex-wrap: wrap; }
.pv-unsaved > span { flex: 1 1 320px; display: flex; flex-direction: column; gap: 2px; }
.pv-unsaved form { margin: 0; }
.cm-alt { font-size: 13.5px; margin-top: 2px; }

.chip-sep { width: 1px; align-self: stretch; background: var(--border); margin: 4px 4px; }

.mail-status { display: flex; gap: 8px; align-items: flex-start; font-size: 13.5px; line-height: 1.45; padding: 9px 12px; border-radius: 10px; margin: 0 0 14px; background: var(--surface-2); color: var(--text-2); border: 1px solid var(--border); }
.mail-status svg { flex: none; margin-top: 2px; }
.mail-status.ok { background: var(--success-soft); color: var(--success); border-color: transparent; }
.mail-status.warn { background: #fef3c7; color: #92400e; border-color: transparent; }
.mail-status.err { background: var(--danger-soft); color: var(--danger); border-color: transparent; }
[data-theme="dark"] .mail-status.warn { background: #3a2a0a; color: #fcd34d; }
.mail-badge { display: inline-flex; align-items: center; gap: 0; padding: 2px 5px; border-radius: 999px; margin-left: 6px; vertical-align: middle; cursor: help; }
.mail-badge svg:first-child { margin-right: 1px; }
.mail-badge.ok { background: var(--success-soft); color: var(--success); }
.mail-badge.err { background: var(--danger-soft); color: var(--danger); }
.mail-badge.muted { background: var(--surface-2); color: var(--muted); border: 1px solid var(--border); }
.ns-people li { display: flex; align-items: center; gap: 6px; }
.ns-people li > span { flex: 0 1 auto; }
.ns-resend { margin-left: auto; opacity: 0; transition: opacity .15s; }
.ns-people li:hover .ns-resend, .ns-resend:focus-within { opacity: 1; }
@media (hover: none) { .ns-resend { opacity: 1; } }
.ns-legend { margin: 14px 0 0; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.ob-redirect { font-size: 11.5px; font-weight: 700; color: #b45309; background: #fef3c7; border-radius: 999px; padding: 1px 8px; white-space: nowrap; }
.ns-people li small ~ .ns-resend { margin-left: 4px; }

.ne-side .check { align-items: flex-start; }
.ne-side .check input { margin-top: 2px; flex: none; }

/* ¿Le llega a esta persona? */
.news-why { max-width: 780px; margin: 20px auto 0; }
.news-view.wide ~ .news-why { max-width: 1140px; }
.news-why .nw-form select { max-width: 360px; width: 100%; }
.nw-verdict { display: flex; gap: 8px; align-items: flex-start; margin: 14px 0 8px; padding: 10px 12px; border-radius: 10px; }
.nw-verdict svg { flex: none; margin-top: 2px; }
.nw-verdict.yes { background: color-mix(in srgb, #10b981 14%, transparent); color: #059669; }
.nw-verdict.no { background: color-mix(in srgb, #ef4444 14%, transparent); color: #dc2626; }
.nw-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; font-size: 14px; }
.nw-list li { display: flex; gap: 6px; align-items: flex-start; }
.nw-list li svg { flex: none; margin-top: 3px; }
.nw-list li.ok svg { color: #10b981; }
.nw-list li.no { color: var(--text); font-weight: 600; }
.nw-list li.no svg { color: #ef4444; }

/* Traducción automática (Elia) */
.elia-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 14px; padding: 10px 12px; border-radius: 10px; background: var(--surface-2, rgba(127,127,127,.08)); }
.elia-bar small { flex: 1 1 220px; }
.elia-bar.busy [data-elia-go] { opacity: .6; pointer-events: none; }
.elia-bar.ok small { color: var(--success); }
.elia-bar.err small { color: var(--danger); font-weight: 600; }
.adv-box { margin: 12px 0; }
.adv-box summary { cursor: pointer; font-weight: 600; font-size: 14px; }
.adv-box[open] summary { margin-bottom: 10px; }


/* Editor de comunicados: pestañas Castellano / Euskera */
.lang-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--border); margin: 4px 0 16px; }
.lang-tabs button { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border: 0; background: none; color: var(--muted); font: inherit; font-weight: 600; cursor: pointer;
  border-bottom: 2px solid transparent; margin-bottom: -1px; border-radius: 8px 8px 0 0; }
.lang-tabs button:hover { color: var(--text); background: var(--surface-2); }
.lang-tabs button.on { color: var(--primary); border-bottom-color: var(--primary); }
.lang-tabs .lt-state { font-size: 11.5px; font-weight: 600; padding: 2px 8px; border-radius: 999px; background: var(--surface-2); color: var(--muted); }
.lang-tabs .lt-state.full { background: color-mix(in srgb, #10b981 15%, transparent); color: #059669; }
.lang-pane[hidden] { display: none; }
.lang-pane > .field + .field { margin-top: 14px; }
.ne-eu.lang-pane { border: 0; padding: 0; margin: 0; border-radius: 0; }
.lp-hint { margin: 0 0 12px; }
.elia-bar.off { opacity: .85; }
.elia-bar.off [data-elia-go] { cursor: not-allowed; }
.mt-on { margin: 4px 0 14px; }
.mt-provs { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; }
.mt-prov { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border: 1px solid var(--border); border-radius: 12px; cursor: pointer; }
.mt-prov input { margin-top: 3px; flex: none; }
.mt-prov span { display: grid; gap: 3px; }
.mt-prov small { color: var(--muted); font-size: 12.5px; line-height: 1.4; }
.mt-prov:has(input:checked) { border-color: var(--primary); background: color-mix(in srgb, var(--primary) 7%, transparent); }
.mt-panel { margin-top: 16px; padding-top: 14px; border-top: 1px dashed var(--border); }
.mt-panel[hidden] { display: none; }
.mt-panel > .field + .field, .mt-panel > .grid-2 + .field { margin-top: 12px; }

/* Mi calendario: añadir un evento haciendo clic en un día */
.cal-day.can-add { cursor: pointer; position: relative; transition: background .15s; }
.cal-day.can-add:hover { background: color-mix(in srgb, var(--primary) 8%, transparent); }
.cal-day.can-add::after { content: '+'; position: absolute; top: 6px; right: 8px; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center;
  font-weight: 700; font-size: 16px; line-height: 1; color: var(--primary); background: color-mix(in srgb, var(--primary) 14%, transparent); opacity: 0; transition: opacity .15s; }
.cal-day.can-add:hover::after { opacity: 1; }
@media (hover: none) { .cal-day.can-add::after { display: none; } }
.check.pe-yearly { align-self: start; align-items: flex-start; margin: 6px 0 0; }
.check.pe-yearly input { margin-top: 3px; flex: none; }
.pe-when { display: grid; gap: 8px; align-content: start; }
.pe-when > .check { margin: 6px 0 0; }
.pe-when [data-pe-time][hidden] { display: none; }
.pe-when > .field { margin: 0; }

/* Mi calendario: cada categoría con su color y su estilo (también se distinguen sin color) */
.cal-item.cat-meet { border-left-width: 3px; }
.cal-item.cat-own { background: color-mix(in srgb, var(--c) 20%, var(--surface)); border: 1px solid color-mix(in srgb, var(--c) 55%, transparent); border-left: 3px solid var(--c); font-weight: 600; }
.cal-item.cat-auto { background: var(--surface); border: 1px dashed var(--c); border-left: 3px dashed var(--c); }
.cal-legend .lg-own i { background: color-mix(in srgb, var(--c) 30%, var(--surface)); border: 1px solid var(--c); border-left-width: 3px; width: 12px; }
.cal-legend .lg-auto i { background: transparent; border: 1.5px dashed var(--c); width: 12px; }
.cal-legend .lg-meet i { border-radius: 3px; }
.cal-entry.ce-own { background: color-mix(in srgb, var(--c) 9%, var(--surface-2)); }
.cal-entry.ce-auto { background: var(--surface); border: 1px dashed color-mix(in srgb, var(--c) 60%, transparent); }
.cal-entry.ce-auto::before { background: repeating-linear-gradient(to bottom, var(--c) 0 5px, transparent 5px 8px); }
.cal-entry .room-dot { width: 8px; height: 8px; display: inline-block; vertical-align: middle; }
.cal-legend .lg-break { flex-basis: 100%; height: 0; margin: -6px 0 0; }
.check.only-req { margin-top: 10px; }

/* ---------- Reglamento de viajeros ---------- */
.reg-hero { padding: 26px 28px; display: grid; gap: 18px; background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 9%, var(--surface)) 0%, var(--surface) 70%); }
.reg-hero h1 { font-size: clamp(22px, 3vw, 30px); line-height: 1.2; margin: 4px 0 6px; letter-spacing: -.01em; }
.rh-sub { color: var(--text-2); margin: 0; font-size: 14px; max-width: 900px; }
.rh-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 12px; }
.reg-search { display: flex; align-items: center; gap: 10px; background: var(--surface); border: 2px solid color-mix(in srgb, var(--primary) 35%, var(--border)); border-radius: 16px; padding: 6px 6px 6px 16px; box-shadow: 0 6px 24px -14px var(--primary); }
.reg-search:focus-within { border-color: var(--primary); }
.reg-search > svg { color: var(--muted); flex: none; }
.reg-search input { flex: 1; min-width: 0; border: 0; background: none; font-size: 17px; padding: 10px 0; outline: none; color: var(--text); box-shadow: none; }
.reg-search .btn { border-radius: 11px; padding-inline: 20px; }
.reg-topics { display: flex; flex-wrap: wrap; gap: 8px; }
.reg-topic { padding: 7px 14px; border-radius: 999px; background: var(--surface); border: 1px solid var(--border); font-size: 13.5px; font-weight: 600; color: var(--text-2); transition: border-color .15s, color .15s, background .15s; }
.reg-topic:hover, .reg-topic.on { border-color: var(--primary); color: var(--primary); background: color-mix(in srgb, var(--primary) 8%, var(--surface)); }
.reg-results { margin-top: 18px; }
.reg-list { display: grid; gap: 8px; }
.reg-card { display: grid; grid-template-columns: 92px 1fr auto; gap: 14px; align-items: start; padding: 12px 14px; border-radius: 12px; background: var(--surface-2); color: var(--text); border: 1px solid transparent; transition: border-color .15s, background .15s; }
.reg-card:hover { border-color: color-mix(in srgb, var(--primary) 40%, transparent); background: color-mix(in srgb, var(--primary) 5%, var(--surface-2)); }
.rc-label { font-weight: 800; font-size: 13px; color: var(--primary); padding-top: 1px; }
.rc-body { display: grid; gap: 4px; min-width: 0; }
.rc-body strong { font-size: 15px; }
.rc-snip { color: var(--text-2); font-size: 13.5px; line-height: 1.5; }
.rc-meta { display: grid; gap: 4px; justify-items: end; color: var(--muted); font-size: 12px; white-space: nowrap; }
.rc-saved { color: var(--primary); }
.reg-card mark, .reg-text mark, .reg-head mark { background: color-mix(in srgb, #facc15 55%, transparent); color: inherit; border-radius: 3px; padding: 0 2px; }
.reg-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; margin-top: 20px; align-items: start; }
.reg-side { display: grid; gap: 16px; position: sticky; top: 20px; }
.reg-side .card { margin: 0; }
.reg-note { display: flex; gap: 14px; align-items: center; padding: 16px 18px; margin-bottom: 18px; border-radius: 14px; color: var(--text);
  background: color-mix(in srgb, #f59e0b 12%, var(--surface)); border: 1px solid color-mix(in srgb, #f59e0b 45%, transparent); }
.reg-note:hover { background: color-mix(in srgb, #f59e0b 18%, var(--surface)); }
.reg-note > span:nth-child(2) { display: grid; gap: 3px; flex: 1; }
.reg-note small { color: var(--text-2); font-size: 13px; }
.rn-ico { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: #f59e0b; color: #fff; flex: none; }
.reg-index { margin: 0; }
.reg-toc { display: grid; gap: 8px; }
.reg-toc ul { list-style: none; margin: 0; padding: 0; }
.ri-flat { margin-bottom: 4px !important; }
.ri-block { border: 1px solid var(--border); border-radius: 12px; background: var(--surface); }
.ri-block > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; padding: 12px 14px; font-weight: 700; font-size: 14.5px; }
.ri-block > summary::-webkit-details-marker { display: none; }
.ri-block > summary span { flex: 1; }
.ri-block > summary svg { transition: transform .2s; color: var(--muted); flex: none; }
.ri-block[open] > summary svg { transform: rotate(180deg); }
.ri-block > ul { padding: 0 8px 8px !important; }
.reg-toc li a { display: grid; grid-template-columns: 74px 1fr auto auto auto; gap: 10px; align-items: baseline; padding: 8px 8px; border-radius: 8px; color: var(--text); font-size: 14px; }
.reg-toc li a:hover { background: var(--surface-2); }
.ri-label { font-weight: 700; color: var(--primary); font-size: 12.5px; white-space: nowrap; }
.ri-page { color: var(--muted); font-size: 12px; white-space: nowrap; }
.ri-sum, .ri-saved { color: var(--muted); display: inline-flex; }
.ri-saved { color: var(--primary); }
.ri-group > .ri-gh { display: block; padding: 10px 8px 4px; font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.ri-sub > ul { padding-left: 28px !important; }
.reg-mini { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; counter-reset: rg; }
.reg-mini li a { display: block; padding: 7px 8px; border-radius: 8px; color: var(--text); font-size: 13.5px; line-height: 1.35; }
.reg-mini li a:hover { background: var(--surface-2); }
.reg-mini b { color: var(--primary); font-size: 12.5px; margin-right: 4px; }
.reg-mini.num li { counter-increment: rg; display: flex; align-items: baseline; gap: 4px; }
.reg-mini.num li::before { content: counter(rg); font-weight: 800; color: var(--muted); font-size: 12px; width: 16px; text-align: right; }
.reg-mini.num li a { flex: 1; }
.reg-edition { margin: 0; padding: 0 4px; }
/* Un artículo */
.reg-art { --reg-fs: 16px; max-width: 860px; margin: 0 auto; }
.reg-crumbs { display: flex; flex-wrap: wrap; gap: 4px 6px; align-items: center; font-size: 13px; color: var(--muted); margin-bottom: 14px; }
.reg-crumbs a { color: var(--text-2); font-weight: 600; display: inline-flex; align-items: center; gap: 5px; }
.reg-crumbs span { display: inline-flex; align-items: center; gap: 5px; }
.reg-back-search { margin-left: auto; color: var(--primary) !important; }
.reg-head { margin-bottom: 18px; }
.reg-kind { display: inline-block; font-size: 12.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--primary); background: color-mix(in srgb, var(--primary) 10%, transparent); padding: 4px 10px; border-radius: 999px; }
.reg-kind.k-nota { color: #b45309; background: color-mix(in srgb, #f59e0b 16%, transparent); }
.reg-kind.k-anexo, .reg-kind.k-apartado { color: #0f766e; background: color-mix(in srgb, #14b8a6 14%, transparent); }
.reg-head h1 { font-size: clamp(22px, 3.2vw, 30px); line-height: 1.2; margin: 10px 0 12px; }
.reg-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 10px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.reg-page { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 14px; }
.reg-page small { font-weight: 400; color: var(--muted); }
.reg-tools { display: flex; gap: 2px; align-items: center; }
.reg-tools form { margin: 0; }
.reg-tools .icon-btn.on { color: var(--primary); background: color-mix(in srgb, var(--primary) 12%, transparent); }
.reg-aa { font-weight: 800; font-size: 17px; line-height: 1; }
.reg-aa.sm { font-size: 12px; }
.reg-summary { background: color-mix(in srgb, #0ea5e9 8%, var(--surface)); border: 1px solid color-mix(in srgb, #0ea5e9 35%, transparent); border-radius: 16px; padding: 18px 22px; margin-bottom: 22px; }
.reg-summary h2, .reg-full h2, .reg-related h2 { font-size: 15px; display: flex; align-items: center; gap: 8px; margin: 0 0 10px; }
.reg-summary h2 { color: #0369a1; }
.reg-summary h2 small, .reg-related h2 small { font-weight: 500; color: var(--muted); font-size: 12.5px; }
[data-theme="dark"] .reg-summary h2 { color: #7dd3fc; }
.reg-text { font-size: var(--reg-fs); line-height: 1.7; }
.reg-text p { margin: 0 0 .8em; }
.reg-text ul { margin: 0 0 .9em; padding-left: 1.3em; }
.reg-text li { margin: .25em 0; }
.reg-text h3 { font-size: 1.05em; margin: 1.2em 0 .5em; }
.reg-text blockquote { margin: 0 0 1em; padding: 10px 16px; border-left: 3px solid var(--border-strong, var(--border)); background: var(--surface-2); border-radius: 0 10px 10px 0; color: var(--text-2); }
.reg-text table { width: 100%; border-collapse: collapse; font-size: .88em; margin: 0 0 1em; }
.reg-text th, .reg-text td { border-bottom: 1px solid var(--border); padding: 7px 8px; text-align: left; vertical-align: top; }
.reg-text th { font-size: .85em; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.reg-text a.reg-ref { color: var(--primary); font-weight: 600; text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--primary) 35%, transparent); text-underline-offset: 3px; }
.reg-full { margin-bottom: 20px; }
.reg-images { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; margin: 0 0 22px; }
.reg-images figure { margin: 0; }
.reg-images img { width: 100%; border-radius: 12px; display: block; }
.reg-images figcaption { font-size: 12.5px; color: var(--muted); margin-top: 6px; }
.reg-children { display: grid; gap: 8px; margin-bottom: 22px; }
.reg-related { margin: 8px 0 22px; }
.reg-pager { display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px; margin: 26px 0 10px; }
.reg-pg { display: grid; gap: 2px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 12px; color: var(--text); background: var(--surface); min-width: 0; }
.reg-pg:hover { border-color: var(--primary); }
.reg-pg small { color: var(--muted); display: inline-flex; align-items: center; gap: 4px; font-size: 12px; }
.reg-pg strong { color: var(--primary); font-size: 13.5px; }
.reg-pg span { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.reg-pg.next { text-align: right; justify-items: end; }
.reg-pg.idx { place-items: center; align-content: center; color: var(--text-2); font-size: 12.5px; font-weight: 600; }
.reg-foot { text-align: center; }
@media (max-width: 1000px) { .reg-layout { grid-template-columns: 1fr; } .reg-side { position: static; } }
@media (max-width: 640px) {
  .reg-hero { padding: 18px; }
  .reg-search { padding-left: 12px; }
  .reg-search .btn { padding-inline: 12px; }
  .reg-card { grid-template-columns: 1fr; gap: 4px; }
  .rc-meta { justify-items: start; grid-auto-flow: column; justify-content: start; gap: 10px; }
  .reg-toc li a { grid-template-columns: 58px 1fr auto; }
  .reg-toc li a .ri-sum, .reg-toc li a .ri-saved { display: none; }
  .reg-pager { grid-template-columns: 1fr 1fr; }
  .reg-pg.idx { display: none; }
  .reg-back-search { margin-left: 0; }
}
@media print {
  .reg-crumbs, .reg-tools, .reg-pager, .reg-related, .reg-meta .btn, .reg-foot { display: none !important; }
  .reg-summary { break-inside: avoid; }
}
/* Administración del reglamento */
.reg-adm-doc { padding: 20px; }
.reg-adm-cols { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 18px; align-items: start; }
.reg-adm-main .card, .reg-adm-side .card { margin: 0 0 16px; }
.reg-adm-main .field + .field, .reg-adm-main .grid-2 + .field, .reg-adm-main .grid-3 + .grid-2 { margin-top: 14px; }
.reg-adm-side { position: sticky; top: 16px; }
.reg-adm-side .field + .field, .reg-adm-side .field + .grid-2, .reg-adm-side .grid-2 + small { margin-top: 10px; }
.reg-adm-side .grid-2 { gap: 10px; margin-top: 10px; }
.reg-adm-eu { border: 1px solid var(--border); border-radius: 12px; padding: 10px 14px; margin-top: 16px; }
.reg-adm-eu summary { cursor: pointer; font-weight: 700; font-size: 14px; display: flex; align-items: center; gap: 8px; }
.reg-adm-eu[open] summary { margin-bottom: 12px; }
.reg-adm-img { display: grid; grid-template-columns: 64px 1fr; gap: 6px 10px; align-items: center; margin-bottom: 10px; }
.reg-adm-img img { width: 64px; height: 64px; object-fit: cover; border-radius: 8px; grid-row: span 2; }
.reg-adm-actions { flex-wrap: wrap; }
.reg-adm-table tr.reg-adm-grp td { background: var(--surface-2); font-weight: 700; }
.reg-adm-table tr.k-anexo td:first-child a, .reg-adm-table tr.k-nota td:first-child a { color: #0f766e; }
.reg-adm-table .actions form.inline { display: inline-flex; }
.reg-adm-table .actions form.inline .icon-btn:first-child svg { transform: rotate(90deg); }
.reg-adm-table .actions form.inline .icon-btn:last-child svg { transform: rotate(90deg); }
.reg-adm-topics { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 14px; }
.reg-adm-topics .card { margin: 0; }
.reg-adm-multi { width: 100%; min-height: 150px; }
.reg-stats { margin-top: 14px; }
.reg-nores { margin-top: 16px; }
.reg-nores-list { display: flex; flex-wrap: wrap; gap: 6px; }
@media (max-width: 1100px) { .reg-adm-cols { grid-template-columns: 1fr; } .reg-adm-side { position: static; } }
.ad-h .ad-h-seg { margin-left: auto; }
.reg-toc li a.wide { grid-template-columns: 1fr auto auto auto; }
.reg-toc li a.wide b { color: var(--primary); font-weight: 700; }
.reg-pg { overflow: hidden; } .reg-pg span { display: block; max-width: 100%; }
.pub-dept { margin-top: 12px; }

/* ---------- Buzón de sugerencias ---------- */
.sugg-st { display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border-radius: 999px; font-size: 12px; font-weight: 700; white-space: nowrap;
  color: var(--c); background: color-mix(in srgb, var(--c) 12%, var(--surface)); border: 1px solid color-mix(in srgb, var(--c) 25%, transparent); vertical-align: middle; }
.sugg-ref { font-variant-numeric: tabular-nums; font-weight: 600; letter-spacing: .02em; }
.sugg-notice { display: flex; gap: 14px; padding: 16px 18px; border-radius: var(--radius); margin-bottom: 18px;
  background: color-mix(in srgb, #d97706 8%, var(--surface)); border: 1px solid color-mix(in srgb, #d97706 30%, var(--border)); }
.sugg-notice > div { flex: 1; min-width: 0; }
.sugg-notice strong { display: block; }
.sugg-notice p { margin: 4px 0 0; color: var(--text-2, var(--text)); }
.sugg-notice-ico { flex: none; width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; color: #b45309; background: color-mix(in srgb, #d97706 16%, var(--surface)); }
[data-theme="dark"] .sugg-notice-ico { color: #fbbf24; }
.sugg-box { display: flex; gap: 10px; margin-top: 12px; padding: 12px 14px; border-radius: var(--radius-sm); background: var(--surface); border: 1px dashed color-mix(in srgb, #d97706 40%, var(--border)); }
.sugg-box > .ico { flex: none; margin-top: 2px; color: #b45309; }
.sugg-box strong { display: inline; }
.sugg-box-where { display: block; margin-top: 6px; padding: 6px 10px; border-radius: 8px; background: color-mix(in srgb, #d97706 10%, var(--surface)); }
.sugg-box-list { margin: 6px 0 0; padding-left: 18px; }
.sugg-box-list li { margin: 2px 0; }
.sugg-box-more { margin-top: 8px; font-size: 13px; }
.sugg-box-more summary { cursor: pointer; color: var(--primary); font-weight: 600; }
.sugg-admin-hint { margin-top: 8px !important; }
.sugg-notice.compact { flex-direction: column; gap: 8px; font-size: 13px; }
.sugg-notice.compact .sugg-notice-ico { width: 30px; height: 30px; border-radius: 9px; }

.sugg-new { max-width: 860px; }
.sugg-form { display: grid; gap: 16px; }
.sugg-depts { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; margin-top: 6px; }
.sugg-dept { position: relative; display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: var(--radius-sm); border: 1.5px solid var(--border); background: var(--surface); cursor: pointer; transition: border-color .15s, box-shadow .15s, background .15s; }
.sugg-dept:hover { border-color: color-mix(in srgb, var(--c) 50%, var(--border)); }
.sugg-dept input { margin-top: 3px; accent-color: var(--c); }
.sugg-dept span { display: grid; gap: 2px; min-width: 0; }
.sugg-dept small { color: var(--muted); font-size: 12px; line-height: 1.35; }
.sugg-dept:has(input:checked) { border-color: var(--c); background: color-mix(in srgb, var(--c) 7%, var(--surface)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--c) 15%, transparent); }
.sugg-count { display: block; text-align: right; margin-top: 4px; }
.sugg-count.low { color: var(--danger); }
.sugg-ack { padding: 12px 14px; border-radius: var(--radius-sm); background: var(--surface-2, var(--bg)); border: 1px solid var(--border); align-items: flex-start; }
.sugg-ack span { font-weight: 600; }

.sugg-ok { display: flex; gap: 16px; align-items: flex-start; padding: 20px 22px; margin-bottom: 18px; border-radius: var(--radius);
  background: var(--success-soft); border: 1px solid color-mix(in srgb, var(--success) 35%, transparent); animation: sugg-pop .35s ease-out; }
.sugg-ok h2 { margin: 0 0 4px; font-size: 19px; color: var(--success); }
.sugg-ok p { margin: 2px 0; }
.sugg-ok-ico { flex: none; width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: var(--success); color: #fff; }
.sugg-ok-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
@keyframes sugg-pop { from { transform: translateY(6px) scale(.98); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .sugg-ok { animation: none; } }

.sugg-detail { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 18px; align-items: start; }
.sugg-col, .sugg-side { display: grid; gap: 18px; min-width: 0; }
.sugg-card { display: grid; gap: 16px; }
.sugg-from { display: flex; gap: 12px; align-items: center; padding-bottom: 14px; border-bottom: 1px solid var(--border); }
.sugg-from > div { display: grid; gap: 1px; min-width: 0; }
.sugg-text { font-size: 15.5px; line-height: 1.65; overflow-wrap: anywhere; }
.sugg-meta dl { display: grid; grid-template-columns: auto 1fr; gap: 10px 14px; margin: 0; font-size: 14px; }
.sugg-meta dt { color: var(--muted); }
.sugg-meta dd { margin: 0; min-width: 0; }
.sugg-meta dd small { display: block; margin-top: 2px; }
.sugg-side-act { display: grid; gap: 4px; justify-items: start; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border); }
aside > .sugg-side-act { border: 0; padding: 0; margin: 0; }

.sugg-tl { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.sugg-ev { position: relative; display: flex; gap: 12px; padding: 0 0 16px; }
.sugg-ev:not(:last-child)::before { content: ''; position: absolute; left: 14px; top: 30px; bottom: 2px; width: 2px; background: var(--border); }
.sugg-ev-ico { flex: none; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--surface-2, var(--bg)); color: var(--muted); border: 1px solid var(--border); position: relative; }
.sugg-ev.k-reply .sugg-ev-ico { background: var(--primary-soft); color: var(--primary); border-color: transparent; }
.sugg-ev.k-reply.by-author .sugg-ev-ico { background: color-mix(in srgb, #d97706 14%, var(--surface)); color: #b45309; }
.sugg-ev.k-note .sugg-ev-ico { background: #f1f5f9; color: #475569; }
[data-theme="dark"] .sugg-ev.k-note .sugg-ev-ico { background: #1e2438; color: #94a3b8; }
.sugg-ev.k-seen .sugg-ev-ico { color: #0284c7; }
.sugg-ev-body { flex: 1; min-width: 0; padding-top: 4px; }
.sugg-ev-head { display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; }
.sugg-ev-head strong { font-weight: 600; font-size: 14px; }
.sugg-ev-head time { margin-left: auto; color: var(--muted); font-size: 12px; white-space: nowrap; }
.sugg-ev-text { margin-top: 8px; padding: 10px 14px; border-radius: 4px 14px 14px 14px; background: var(--primary-soft); line-height: 1.55; overflow-wrap: anywhere; }
.sugg-ev.by-author .sugg-ev-text { background: color-mix(in srgb, #d97706 9%, var(--surface)); }
.sugg-ev-text.internal { background: transparent; border: 1px dashed var(--border-strong); color: var(--text-2, var(--text)); }
.sugg-reply { margin-top: 6px; padding-top: 16px; border-top: 1px solid var(--border); display: grid; gap: 12px; }
.sugg-reply-bar { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; }
.sugg-reply-bar .field.inline { display: flex; flex-direction: row; align-items: center; gap: 8px; margin: 0; }
.sugg-reply-bar .field.inline > span { margin: 0; }
.sugg-reply-bar .field.inline select { width: auto; }

.sugg-table .sugg-title { font-weight: 600; color: var(--text); display: block; }
.sugg-table td small { display: block; }
.sugg-table tr.is-unread .sugg-title { color: var(--primary); }
.sugg-replies { display: inline-flex; align-items: center; gap: 4px; font-weight: 600; }
.sugg-inbox { display: grid; gap: 10px; }
.sugg-item { display: flex; gap: 14px; align-items: flex-start; padding: 14px 16px; color: inherit; text-decoration: none; transition: border-color .15s, transform .15s, box-shadow .15s; }
.sugg-item:hover { border-color: var(--border-strong); box-shadow: var(--shadow); transform: translateY(-1px); }
.sugg-item.is-new { border-left: 4px solid #ca8a04; }
.sugg-item.is-new .sugg-item-top strong { font-weight: 800; }
.sugg-item-main { flex: 1; min-width: 0; display: grid; gap: 4px; }
.sugg-item-top { display: flex; gap: 10px; align-items: center; justify-content: space-between; }
.sugg-item-top strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sugg-item-snip { margin: 0; color: var(--text-2, var(--muted)); font-size: 14px; }
.sugg-item-when { flex: none; text-align: right; font-size: 13px; color: var(--muted); display: grid; gap: 2px; }
.sugg-stats { margin-top: 18px; }
.sugg-bar { display: grid; grid-template-columns: minmax(90px, 40%) 1fr auto; gap: 10px; align-items: center; font-size: 13px; margin: 6px 0; }
.sugg-bar span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sugg-bar i { display: block; height: 8px; width: var(--w); min-width: 4px; border-radius: 0 4px 4px 0; background: #ca8a04; }
.sugg-bar b { font-variant-numeric: tabular-nums; }
.access-opts + [data-room-groups][data-pick-list] { margin-top: 10px; }
@media (max-width: 900px) {
  .sugg-detail { grid-template-columns: 1fr; }
  .sugg-item-when { display: none; }
}

/* Pestañas de las ventanas: flechas cuando no caben todas */
.mtabs-wrap { position: relative; margin: 0 0 16px; min-width: 0; }
.mtabs-wrap > .mtabs { margin: 0; position: relative; }
.mtabs-arrow { position: absolute; top: 0; bottom: 1px; z-index: 2; width: 36px; display: grid; place-items: center; border: 0; padding: 0; cursor: pointer; color: var(--text-2); }
.mtabs-arrow[hidden] { display: none; }
.mtabs-arrow.prev { left: 0; background: linear-gradient(90deg, var(--surface) 55%, transparent); justify-items: start; }
.mtabs-arrow.next { right: 0; background: linear-gradient(270deg, var(--surface) 55%, transparent); justify-items: end; }
.mtabs-arrow svg { width: 26px; height: 26px; padding: 5px; border-radius: 50%; background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow); box-sizing: border-box; }
.mtabs-arrow:hover { color: var(--primary); }
.mtabs-arrow:hover svg { border-color: var(--primary); }
.sugg-tabs { margin-bottom: 18px; }
.access-opts.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 640px) { .access-opts.three { grid-template-columns: 1fr; } }
[data-room-groups][hidden] { display: none !important; }
.sugg-closed { display: flex; gap: 16px; align-items: flex-start; padding: 22px; }
.sugg-closed h2 { margin: 0 0 4px; font-size: 18px; }
.sugg-closed p { margin: 2px 0; }
.sugg-closed-ico { flex: none; width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; background: var(--surface-2); color: var(--muted); border: 1px solid var(--border); }
.sugg-until { display: flex; align-items: center; gap: 6px; margin: -6px 0 14px; font-size: 13.5px; color: var(--text-2); font-weight: 600; }
.modal.narrow .access-opts.three { grid-template-columns: 1fr; }
.modal.narrow .access-opts.three .access-opt span { display: flex; flex-wrap: wrap; gap: 2px 10px; align-items: baseline; }
.sugg-closedbar { display: flex; gap: 12px; align-items: flex-start; padding: 14px 18px; margin-bottom: 18px; border-radius: var(--radius); background: var(--surface-2); border: 1px solid var(--border-strong); color: var(--text); }
.sugg-closedbar > .ico { flex: none; margin-top: 2px; color: var(--muted); }
.sugg-closedbar span { display: grid; gap: 2px; }
.sugg-closedbar small { color: var(--muted); }
.sugg-item-top > span { display: inline-flex; gap: 6px; flex: none; }
.sugg-ev.k-close .sugg-ev-ico { background: #475569; color: #fff; border-color: transparent; }
.sugg-ac { margin-top: 6px; }
.sugg-ac-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-weight: 500; color: var(--text-2); font-size: 14px; }
.sugg-ac-row input { width: 96px; }

/* ---------- Resumen en pestañas verticales ---------- */
.ad-layout { grid-template-columns: 240px minmax(0, 1fr); }
.ad-panel { min-width: 0; }
.ad-panel-h { display: flex; align-items: center; gap: 10px; font-size: 20px; margin: 0 0 16px; }
.ad-panel-h .sn-ico { background: var(--primary-soft); color: var(--primary); }
.sn-count.hot { background: var(--danger); border-color: transparent; color: #fff; }
.settings-nav a.sn-general .sn-ico { background: linear-gradient(135deg, var(--brand-from, var(--primary)), var(--secondary, var(--primary-600))); color: #fff; }
.ad-grid-eq { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* Cabecera llamativa de «General» */
.ad-hero { position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px 28px; align-items: center;
  padding: 26px 28px; margin-bottom: 26px; border-radius: 20px; color: #fff;
  background: linear-gradient(125deg, var(--brand-from, var(--primary)) 0%, var(--brand, var(--primary)) 45%, var(--secondary, var(--primary-600)) 100%);
  box-shadow: 0 18px 40px -18px color-mix(in srgb, var(--brand, var(--primary)) 70%, transparent); }
.ad-hero::before, .ad-hero::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; background: rgba(255, 255, 255, .09); }
.ad-hero::before { width: 320px; height: 320px; right: -90px; top: -150px; }
.ad-hero::after { width: 220px; height: 220px; right: 210px; bottom: -150px; background: rgba(255, 255, 255, .06); }
.ad-hero-main { position: relative; z-index: 1; min-width: 0; }
.ad-hero-date { margin: 0 0 4px; font-size: 13px; font-weight: 600; opacity: .85; }
.ad-hero h2 { margin: 0; font-size: 30px; line-height: 1.15; font-weight: 800; letter-spacing: -.02em; color: #fff; }
.ad-hero-lead { margin: 8px 0 0; font-size: 15px; opacity: .92; }
.ad-hero-stats { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(4, minmax(104px, auto)); gap: 10px; }
.ad-hs { display: flex; flex-direction: column; gap: 2px; padding: 12px 16px; border-radius: 14px; background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .22); backdrop-filter: blur(6px); min-width: 0; }
.ad-hs > b { font-size: 30px; line-height: 1.05; font-weight: 800; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.ad-hs > b small { font-size: 16px; font-weight: 700; opacity: .85; }
.ad-hs > small { font-size: 12px; font-weight: 600; opacity: .88; line-height: 1.3; }
.ad-hs-live { display: inline-flex; align-items: center; gap: 6px; font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; opacity: .95; }
.ad-hs-live i { width: 8px; height: 8px; border-radius: 50%; background: #4ade80; box-shadow: 0 0 0 0 rgba(74, 222, 128, .7); animation: ad-pulse 1.8s infinite; }
@keyframes ad-pulse { 0% { box-shadow: 0 0 0 0 rgba(74, 222, 128, .7); } 70% { box-shadow: 0 0 0 8px rgba(74, 222, 128, 0); } 100% { box-shadow: 0 0 0 0 rgba(74, 222, 128, 0); } }
@media (prefers-reduced-motion: reduce) { .ad-hs-live i { animation: none; } }

/* Lo que pide atención */
.ad-attn { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; }
.ad-attn-item { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: var(--radius-sm); background: var(--surface); border: 1px solid var(--border);
  border-left: 4px solid var(--k, var(--border-strong)); color: var(--text-2); text-decoration: none; transition: transform .15s, box-shadow .15s; }
.ad-attn-item:hover { transform: translateY(-1px); box-shadow: var(--shadow); }
.ad-attn-item > b { font-size: 22px; font-weight: 800; color: var(--text); font-variant-numeric: tabular-nums; }
.ad-attn-item > span:not(.ad-ico) { flex: 1; font-size: 13.5px; line-height: 1.3; font-weight: 600; }
.ad-attn-item > .ico:last-child { color: var(--muted); flex: none; }
.ad-attn-item.t-red { --k: var(--danger); } .ad-attn-item.t-amber { --k: var(--warning); } .ad-attn-item.t-blue { --k: #0284c7; }
.ad-attn-item.t-indigo { --k: var(--primary); } .ad-attn-item.t-rose { --k: #db2777; }
.ad-attn-item .ad-ico { width: 34px; height: 34px; }
.ad-allgood { display: flex; gap: 12px; align-items: center; padding: 16px 18px; border-radius: var(--radius); background: var(--success-soft); color: var(--success); border: 1px solid color-mix(in srgb, var(--success) 30%, transparent); }
.ad-allgood div { display: grid; } .ad-allgood small { color: var(--text-2); }

/* Anillos de porcentaje */
.ad-rings { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 12px; }
.ad-ring-card { display: flex; align-items: center; gap: 14px; padding: 16px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); color: inherit; text-decoration: none; }
.ad-ring-card.link { transition: transform .15s, box-shadow .15s; } .ad-ring-card.link:hover { transform: translateY(-1px); box-shadow: var(--shadow); }
.ad-ring { --p: 0; flex: none; width: 76px; height: 76px; border-radius: 50%; display: grid; place-items: center;
  background: conic-gradient(var(--primary) calc(var(--p) * 1%), var(--surface-2) 0); position: relative; }
.ad-ring::before { content: ""; position: absolute; inset: 9px; border-radius: 50%; background: var(--surface); }
.ad-ring b { position: relative; font-size: 19px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--text); }
.ad-ring b small { font-size: 11px; font-weight: 700; color: var(--muted); }
.ad-ring-txt { display: grid; gap: 3px; min-width: 0; }
.ad-ring-txt strong { font-size: 14px; } .ad-ring-txt small { font-size: 12px; color: var(--muted); line-height: 1.35; }

/* Tarjetas de cada módulo */
.ad-mods { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; }
.ad-mod { display: flex; flex-direction: column; gap: 2px; padding: 16px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); color: inherit; text-decoration: none; transition: transform .15s, box-shadow .15s, border-color .15s; }
.ad-mod:hover { transform: translateY(-2px); box-shadow: var(--shadow); border-color: var(--border-strong); }
.ad-mod .ad-ico { margin-bottom: 8px; }
.ad-mod-name { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.ad-mod > b { font-size: 30px; line-height: 1.1; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; margin-top: 2px; }
.ad-mod-lbl { font-size: 13px; font-weight: 600; color: var(--text-2); }
.ad-mod small { font-size: 12px; color: var(--muted); }
.ad-mod-go { margin-top: 10px; display: inline-flex; align-items: center; gap: 2px; font-size: 12.5px; font-weight: 700; color: var(--primary); }

/* Últimos comunicados */
.ad-news { list-style: none; margin: 0; padding: 0; }
.ad-news li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(180px, 260px); gap: 16px; align-items: center; padding: 11px 0; border-top: 1px solid var(--border); }
.ad-news li:first-child { border-top: 0; }
.ad-news a { display: flex; flex-direction: column; min-width: 0; color: inherit; text-decoration: none; }
.ad-news a strong { font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ad-news a:hover strong { color: var(--primary); }
.ad-news-bars { display: grid; gap: 5px; }
.ad-nb { display: grid; grid-template-columns: 6.5em 1fr 3em; gap: 8px; align-items: center; font-size: 12px; color: var(--muted); }
.ad-nb .ad-meter { margin: 0; } .ad-nb b { text-align: right; color: var(--text); font-variant-numeric: tabular-nums; }
.ad-nb.conf .ad-meter span { background: var(--success); }

@media (max-width: 1100px) { .ad-hero { grid-template-columns: 1fr; } .ad-hero-stats { grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); } }
@media (max-width: 760px) { .ad-grid-eq { grid-template-columns: 1fr; } .ad-news li { grid-template-columns: 1fr; gap: 6px; } .ad-hero { padding: 20px; } .ad-hero h2 { font-size: 24px; } .ad-hs > b { font-size: 24px; } }
.ad-hero { grid-template-columns: 1fr; }
.ad-hero-stats { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.ad-hero h2 { font-size: 32px; }
.ad-rings { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.ad-layout .sn-text strong { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ad-layout .sn-count { margin-left: 0; }
.ad-layout .sn-text { flex: 1; }
.ad-layout .sn-text strong { display: block; }
.ad-layout .settings-nav .sn-count { flex: none; margin: 6px 0 0; }
.ad-rings { grid-template-columns: repeat(auto-fit, minmax(175px, 1fr)); }
.ad-ring-card { flex-direction: column; align-items: flex-start; }
.ad-ring { width: 72px; height: 72px; }
.ad-panel.settings-panel { max-width: none; }
@media (max-width: 900px) { .ad-layout { grid-template-columns: minmax(0, 1fr); } .ad-layout .settings-nav .sn-count { margin: 0; } }

/* ---------- Preguntas frecuentes ---------- */
.faq-hero { position: relative; overflow: hidden; padding: 24px 26px; margin-bottom: 18px; border-radius: 20px; color: #fff;
  background: linear-gradient(125deg, var(--brand-from, var(--primary)) 0%, var(--brand, var(--primary)) 50%, var(--secondary, var(--primary-600)) 100%);
  box-shadow: 0 18px 40px -20px color-mix(in srgb, var(--brand, var(--primary)) 70%, transparent); }
.faq-hero::after { content: ""; position: absolute; width: 300px; height: 300px; right: -100px; top: -140px; border-radius: 50%; background: rgba(255, 255, 255, .09); pointer-events: none; }
.faq-hero-txt { position: relative; z-index: 1; display: flex; gap: 14px; align-items: flex-start; max-width: 900px; }
.faq-hero-ico { flex: none; width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; background: rgba(255, 255, 255, .18); }
.faq-hero h2 { margin: 0 0 4px; font-size: 19px; color: #fff; }
.faq-hero p { margin: 0; font-size: 14.5px; line-height: 1.55; opacity: .93; }
.faq-search { position: relative; z-index: 1; display: flex; align-items: center; gap: 10px; margin-top: 18px; padding: 6px 6px 6px 16px; border-radius: 14px; background: var(--surface); color: var(--muted); box-shadow: 0 8px 22px -10px rgba(0, 0, 0, .35); }
.faq-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font-size: 16px; padding: 10px 0; color: var(--text); box-shadow: none; }
.faq-cats { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.faq-cat { --c: var(--primary); display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px 6px 6px; border-radius: 999px; background: var(--surface); border: 1px solid var(--border); color: var(--text-2); font-weight: 600; font-size: 14px; text-decoration: none; transition: border-color .15s, background .15s; }
.faq-cat b { font-size: 12px; padding: 0 7px; border-radius: 999px; background: var(--surface-2); color: var(--muted); }
.faq-cat:hover { border-color: color-mix(in srgb, var(--c) 50%, var(--border)); }
.faq-cat.on { background: color-mix(in srgb, var(--c) 10%, var(--surface)); border-color: var(--c); color: var(--text); }
.faq-cat.on b { background: var(--c); color: #fff; }
.faq-cat-ico { width: 28px; height: 28px; border-radius: 50%; display: inline-grid; place-items: center; background: color-mix(in srgb, var(--c) 14%, var(--surface)); color: var(--c); flex: none; }
.faq-group { --c: var(--primary); margin-bottom: 22px; }
.faq-group-h { display: flex; align-items: center; gap: 10px; font-size: 17px; margin: 0 0 10px; }
.faq-group-h .faq-cat-ico { width: 34px; height: 34px; border-radius: 10px; }
.faq-group-h small { font-size: 12px; font-weight: 700; color: var(--muted); background: var(--surface-2); border: 1px solid var(--border); padding: 0 8px; border-radius: 999px; }
.faq-list { display: grid; gap: 8px; }
.faq-item { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); transition: box-shadow .15s, border-color .15s; }
.faq-item[open] { box-shadow: var(--shadow); border-color: var(--border-strong); }
.faq-item summary { list-style: none; display: flex; align-items: center; gap: 12px; padding: 14px 16px; cursor: pointer; font-weight: 650; font-size: 15px; color: var(--text); }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:hover .faq-q { color: var(--primary); }
.faq-q { flex: 1; min-width: 0; display: grid; gap: 2px; }
.faq-q-cat { font-size: 12px; font-weight: 600; color: var(--muted); }
.faq-q-ico { --c: var(--primary); flex: none; width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; background: color-mix(in srgb, var(--c) 12%, var(--surface)); color: var(--c); }
.faq-chev { flex: none; color: var(--muted); transition: transform .2s; }
.faq-item[open] .faq-chev { transform: rotate(180deg); color: var(--primary); }
.faq-body { padding: 0 18px 16px 58px; }
.faq-answer { font-size: 15px; }
.faq-answer > :last-child { margin-bottom: 0; }
.faq-links { display: grid; gap: 12px; margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--border-strong); }
.faq-lh { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); margin-bottom: 6px; }
.faq-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.faq-chip { display: inline-flex; align-items: center; gap: 9px; padding: 8px 12px; border-radius: 12px; border: 1px solid var(--border); background: var(--surface-2); color: var(--text); text-decoration: none; max-width: 100%; transition: border-color .15s, background .15s; }
.faq-chip:hover { border-color: var(--primary); background: var(--primary-soft); }
.faq-chip > .ico { flex: none; color: var(--primary); }
.faq-chip.reg > .ico { color: #0d9488; }
.faq-chip span { display: grid; min-width: 0; }
.faq-chip b { font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.faq-chip small { font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.faq-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border); font-size: 13.5px; }
.faq-foot-q { color: var(--text-2); font-weight: 600; margin-right: 4px; }
.faq-foot .btn.on { background: var(--primary-soft); color: var(--primary); border-color: var(--primary); }
.faq-thanks { color: var(--success); font-weight: 600; font-size: 13px; }
.faq-results-h { font-weight: 600; color: var(--text-2); margin: 0 0 10px; }
.faq-none { display: flex; gap: 14px; align-items: center; padding: 18px; color: var(--muted); }
.faq-none strong { color: var(--text); }
.faq-more { display: flex; align-items: center; gap: 14px; margin-top: 26px; padding: 16px 18px; border-radius: var(--radius); border: 1px dashed var(--border-strong); background: var(--surface); }
.faq-more > div { flex: 1; } .faq-more p { margin: 2px 0 0; }
.faq-more-ico { flex: none; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: color-mix(in srgb, #ca8a04 14%, var(--surface)); color: #ca8a04; }
.faq-related ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.faq-related a { display: flex; align-items: center; gap: 6px; padding: 7px 4px; color: var(--text); font-weight: 600; font-size: 14px; text-decoration: none; border-radius: 8px; }
.faq-related a:hover { color: var(--primary); background: var(--primary-soft); }
/* Administración */
.faq-admin-q { font-weight: 600; color: var(--text); display: block; }
.faq-admin td small { display: block; margin-top: 2px; }
.faq-cat-pill { --c: var(--primary); display: inline-flex; align-items: center; gap: 5px; padding: 2px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 600; white-space: nowrap;
  color: var(--c); background: color-mix(in srgb, var(--c) 11%, var(--surface)); border: 1px solid color-mix(in srgb, var(--c) 25%, transparent); }
.faq-useful { font-weight: 700; color: var(--success); }
.faq-icon-pick { display: flex; flex-wrap: wrap; gap: 6px; }
.faq-icon-pick label { cursor: pointer; }
.faq-icon-pick input { position: absolute; opacity: 0; pointer-events: none; }
.faq-icon-pick span { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; border: 1px solid var(--border); background: var(--surface); color: var(--text-2); }
.faq-icon-pick input:checked + span { border-color: var(--primary); background: var(--primary-soft); color: var(--primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 18%, transparent); }
.faq-icon-pick input:focus-visible + span { outline: 2px solid var(--primary); }
.narrow-card { max-width: 820px; }
.faq-co { list-style: none; padding: 0; margin: 0 0 12px; }
.faq-co li { display: flex; justify-content: space-between; padding: 8px 0; border-top: 1px solid var(--border); }
.faq-co li:first-child { border-top: 0; }
@media (max-width: 640px) { .faq-body { padding: 0 14px 14px; } .faq-hero { padding: 20px; } .faq-search .btn { display: none; } }
.faq-admin td.actions { white-space: nowrap; }
.faq-admin td.actions form { display: inline-flex; }
.faq-item { scroll-margin-top: 84px; }
.faq-chip.file .fi-ext { flex: none; width: 34px; height: 34px; font-size: 10px; }
.faq-file-edit .fi-name input { width: 100%; padding: 6px 10px; font-weight: 600; }
.faq-file-edit .fi-name small a { color: var(--muted); }
.chip-site { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 10px; border: 1px solid var(--border); background: var(--surface-2); color: var(--text-2); font-weight: 600; font-size: 14px; }

/* ---------- Reuniones discretas ---------- */
.ev.ev-private, .tl-block.tl-private {
  background: repeating-linear-gradient(135deg, var(--surface-2) 0 7px, color-mix(in srgb, var(--muted) 12%, var(--surface)) 7px 14px);
  border-left-color: var(--muted); color: var(--text-2);
}
.ev.ev-private small { color: var(--muted); }
.ev strong svg, .tl-block span svg { vertical-align: -1px; opacity: .8; }
.lg.priv { background: repeating-linear-gradient(135deg, var(--surface-2) 0 3px, color-mix(in srgb, var(--muted) 30%, var(--surface)) 3px 6px); border-left: 3px solid var(--muted); }
.discreet-box { margin-top: 6px; padding: 12px 14px; border: 1px dashed var(--border); border-radius: 12px; background: var(--surface-2); display: grid; gap: 8px; }
.discreet-box.on { border-style: solid; border-color: color-mix(in srgb, var(--primary) 35%, var(--border)); background: color-mix(in srgb, var(--primary) 5%, var(--surface)); }
.discreet-box > .check { align-items: flex-start; }
.discreet-box > .check strong { display: inline-flex; align-items: center; gap: 6px; }
.discreet-box .check-grid { margin-top: 2px; }
.discreet-box .group-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--c); margin-right: 2px; }
.private-hero { text-align: center; padding: 34px 20px; display: grid; justify-items: center; gap: 10px; }
.private-hero .ph-ico { width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; background: var(--surface-2); color: var(--muted); border: 1px solid var(--border); }
.private-hero h1 { margin: 0; }
.private-hero .when { text-align: left; margin-top: 8px; }
.tag-private { display: inline-flex; align-items: center; gap: 4px; }
.private-hero .when { border-bottom: 0; padding-bottom: 0; margin-bottom: 0; }

/* ---------- Documentos personales ---------- */
.badge-personal { background: color-mix(in srgb, #7c3aed 12%, var(--surface)); color: #6d28d9; border: 1px solid color-mix(in srgb, #7c3aed 25%, transparent); display: inline-flex; align-items: center; gap: 3px; }
[data-theme="dark"] .badge-personal { color: #c4b5fd; }
.doc-row.doc-personal { box-shadow: inset 3px 0 0 #8b5cf6; }
.doc-personal-bar { display: flex; gap: 12px; align-items: center; padding: 12px 16px; margin-bottom: 16px; border-radius: 14px;
  background: color-mix(in srgb, #7c3aed 7%, var(--surface)); border: 1px solid color-mix(in srgb, #7c3aed 22%, var(--border)); }
.doc-personal-bar .dpb-ico { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; flex-shrink: 0; background: color-mix(in srgb, #7c3aed 15%, var(--surface)); color: #7c3aed; }
.doc-mine .card-head { flex-wrap: wrap; gap: 4px 12px; }
.doc-person-card { display: grid; gap: 10px; }
.doc-person-card.on { border-color: color-mix(in srgb, #7c3aed 35%, var(--border)); }
.doc-person-list { max-height: 260px; overflow: auto; }
[data-doc-targets].is-off .target-cols { opacity: .45; pointer-events: none; }

/* ---------- Subir nóminas en lote ---------- */
.grid-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 14px; }
@media (max-width: 900px) { .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.d-block { display: block; }
.badge-danger { background: var(--danger-soft, #fde8e8); color: var(--danger); }
[data-theme="dark"] .badge-danger { background: #3a1717; color: #fca5a5; }
.pay-steps { display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; }
.pay-steps span { display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px 7px 8px; border-radius: 999px; background: var(--surface); border: 1px solid var(--border); color: var(--muted); font-weight: 700; font-size: 13.5px; }
.pay-steps b { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: var(--surface-2); font-size: 12.5px; }
.pay-steps .on { color: var(--text); border-color: var(--primary); }
.pay-steps .on b { background: var(--primary); color: var(--on-primary, #fff); }
.pay-steps .done b { background: var(--success); color: #fff; }
.pay-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 16px; align-items: start; }
@media (max-width: 1000px) { .pay-grid { grid-template-columns: 1fr; } }
.pay-grid .card { display: grid; gap: 14px; }
.pay-grid h2 { margin: 0; }
.pay-title-prev { margin: 0; line-height: 1.6; }
.pay-drop { padding: 34px 16px; }
.pay-pattern { display: grid; gap: 6px; padding: 12px 14px; border-radius: 12px; background: var(--surface-2); }
.pay-pattern code { font-size: 14px; padding: 6px 10px; background: var(--surface); border: 1px solid var(--border); border-radius: 8px; justify-self: start; word-break: break-all; }
.pay-pattern code b { color: var(--primary); }
.pay-pattern code i { color: #7c3aed; font-style: normal; }
.pay-pattern ul { margin: 0; padding-left: 18px; display: grid; gap: 2px; }
.pay-progress { display: grid; gap: 6px; }
.pay-bar { height: 10px; border-radius: 99px; background: var(--surface-2); overflow: hidden; border: 1px solid var(--border); }
.pay-bar span { display: block; height: 100%; width: 0; background: var(--primary); transition: width .25s; }
.pay-summary { display: grid; grid-template-columns: 1.2fr 1fr auto; gap: 18px; align-items: center; margin-bottom: 16px; }
.pay-summary > div:not(.pay-kpis) { display: grid; gap: 2px; }
.pay-summary strong { font-size: 16px; }
@media (max-width: 900px) { .pay-summary { grid-template-columns: 1fr; } }
.pay-kpis { display: flex; gap: 8px; flex-wrap: wrap; }
.pk { display: grid; justify-items: center; padding: 8px 14px; border-radius: 12px; font-size: 12px; font-weight: 600; min-width: 92px; text-align: center; }
.pk b { font-size: 22px; line-height: 1.1; }
.pk.ok { background: var(--success-soft); color: var(--success); }
.pk.warn { background: #fff4e5; color: #b45309; }
.pk.ko { background: var(--danger-soft, #fde8e8); color: var(--danger); }
[data-theme="dark"] .pk.warn { background: #35260f; color: #fbbf24; }
[data-theme="dark"] .pk.ko { background: #3a1717; color: #fca5a5; }
.pay-filter { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; border-bottom: 1px solid var(--border); }
.pay-filter .search-box { flex: 1; min-width: 220px; }
.pay-filter .seg button { padding: 6px 12px; border-radius: 8px; font-weight: 700; font-size: 13px; color: var(--text-2); background: none; border: 0; cursor: pointer; }
.pay-filter .seg button.on { background: var(--primary); color: var(--on-primary, #fff); }
.pay-table td { vertical-align: top; }
.pay-table .w-check { width: 36px; }
.pay-table select { max-width: 320px; width: 100%; }
.pay-file { display: flex; gap: 10px; align-items: center; }
.pay-file > span:last-child { display: grid; min-width: 0; }
.pay-file small { overflow-wrap: anywhere; }
.pay-file .doc-ext { width: 34px; height: 40px; font-size: 10px; flex-shrink: 0; }
.pay-state { display: flex; flex-wrap: wrap; gap: 4px; align-items: flex-start; }
.pay-state .badge { display: inline-flex; align-items: center; gap: 3px; }
.pay-save { margin-top: 6px; }
.pay-warn { color: #b45309; }
tr.pay-none td { background: color-mix(in srgb, var(--danger) 4%, transparent); }
tr.pay-name td { background: color-mix(in srgb, #f59e0b 5%, transparent); }
tr.pay-off td { opacity: .5; }
.pay-actions { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-top: 16px; position: sticky; bottom: 0; padding: 12px 0; background: var(--bg); }
tr.pay-v-check td { background: color-mix(in srgb, #f59e0b 5%, transparent); }
tr.pay-v-bad td, tr.pay-v-none td { background: color-mix(in srgb, var(--danger) 5%, transparent); }
tr.pay-pending td:first-child { box-shadow: inset 3px 0 0 #f59e0b; }
.pay-confirm { margin-top: 6px; padding: 6px 8px; border-radius: 8px; background: color-mix(in srgb, #f59e0b 12%, var(--surface)); }
.pay-confirm strong { font-size: 12.5px; }
.pay-reviewed { display: flex; gap: 12px; align-items: flex-start; margin-top: 16px; padding: 14px 16px; border-radius: 14px; border: 1px solid color-mix(in srgb, var(--primary) 30%, var(--border)); background: color-mix(in srgb, var(--primary) 5%, var(--surface)); cursor: pointer; }
.pay-reviewed input { width: 20px; height: 20px; margin-top: 2px; flex-shrink: 0; }
.pay-hide-list { display: grid; gap: 8px; margin: 6px 0 4px; }
.pay-hide { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border: 1px solid var(--border); border-radius: 12px; cursor: pointer; background: var(--surface); }
.pay-hide .ph-text { display: grid; flex: 1; min-width: 0; }
.pay-hide .ph-state { font-size: 12.5px; font-weight: 700; color: var(--success); display: inline-flex; align-items: center; gap: 4px; }
.pay-hide .switch { margin-top: 0; }
.pay-hide.on { border-color: color-mix(in srgb, var(--danger) 40%, var(--border)); background: color-mix(in srgb, var(--danger) 5%, var(--surface)); }
.pay-hide.on .ph-state { color: var(--danger); }
.doc-nominative { padding: 8px 10px; border-radius: 10px; background: color-mix(in srgb, #7c3aed 6%, var(--surface)); }
.doc-verify { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border-radius: 12px; border: 1px solid color-mix(in srgb, #7c3aed 35%, var(--border)); background: color-mix(in srgb, #7c3aed 7%, var(--surface)); cursor: pointer; font-size: 13.5px; }
.doc-verify input { width: 18px; height: 18px; margin-top: 2px; flex-shrink: 0; }
.doc-verify strong { color: #6d28d9; }
[data-theme="dark"] .doc-verify strong { color: #c4b5fd; }
.pay-hide .switch input:checked + span { background: var(--danger); }
.pay-hide .ph-on, .pay-hide.on .ph-off { display: none; }
.pay-hide.on .ph-on { display: inline-flex; align-items: center; gap: 4px; }
.au-act.t-slate { background: var(--surface-2); color: var(--text-2); }
.doc-hidden-note { display: flex; gap: 8px; align-items: flex-start; margin: 0; padding: 10px 18px; font-size: 13px; color: var(--text-2); background: color-mix(in srgb, #7c3aed 6%, var(--surface)); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.doc-hidden-note svg { color: #7c3aed; flex-shrink: 0; margin-top: 2px; }
.doc-access p.pad { padding: 10px 20px 14px; margin: 0; }
/* Resumen · Personas: % por departamento y por grupo (escala 0–100 %) */
.ad-pct .ad-hb-bar { background: var(--surface-2); border-radius: 4px; overflow: hidden; }
.ad-pct .ad-hb-bar i { border-radius: 4px; }
.ad-pct a.ad-hb-name:hover { color: var(--text); text-decoration: underline; }
.ad-pct .ad-hb-val { display: inline-flex; align-items: baseline; gap: 6px; min-width: 4.6em; justify-content: flex-end; }
.ad-pct .ad-hb-val small { font-weight: 500; color: var(--muted); font-size: 11.5px; }
.ad-pct .ad-pct-none .ad-hb-bar i { background: var(--border-strong); }
.ad-pct .ad-pct-none .ad-hb-name { font-style: italic; }
.ad-note { margin: 12px 0 0; display: flex; gap: 5px; align-items: flex-start; }
.ad-grid.ad-grid-even { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 900px) { .ad-grid.ad-grid-even { grid-template-columns: 1fr; } }
.ad-section > .ad-grid + .ad-grid { margin-top: 14px; }
.ad-pct li { grid-template-columns: minmax(0, 13em) minmax(70px, 1fr) auto; }
.ad-pct .ad-hb-name { white-space: normal; line-height: 1.25; overflow: visible; }

/* =========================================================================
   Encuestas
   ========================================================================= */
.badge-info { background: var(--primary-soft); color: var(--primary); }
/* Lista del trabajador */
.sv-section { margin-bottom: 24px; }
.sv-section h2 { font-size: 16px; margin: 0 0 10px; }
.sv-cards { display: grid; gap: 10px; }
.sv-card { display: flex; gap: 14px; align-items: center; padding: 16px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); color: inherit; text-decoration: none; transition: border-color .15s, box-shadow .15s; }
.sv-card:hover { border-color: var(--border-strong); box-shadow: 0 6px 18px -10px rgba(20, 24, 50, .25); }
.sv-card.mand { border-left: 4px solid var(--warning); }
.sv-card-ico { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; flex: none; background: color-mix(in srgb, #0891b2 12%, var(--surface)); color: #0891b2; }
.sv-done .sv-card-ico, .sv-card.sv-done .sv-card-ico { background: var(--success-soft); color: var(--success); }
.sv-card.sv-missed { opacity: .75; }
.sv-card-body { display: grid; gap: 4px; flex: 1; min-width: 0; }
.sv-card-body strong { font-size: 15.5px; }
.sv-card-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.sv-card-tags .badge { display: inline-flex; align-items: center; gap: 3px; }
.sv-card-desc { color: var(--text-2); }
.sv-card-foot { color: var(--muted); display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.sv-card-go { flex: none; }
@media (max-width: 600px) { .sv-card { flex-wrap: wrap; } .sv-card-ico { width: 38px; height: 38px; } .sv-card-go { width: 100%; justify-content: center; } }
/* Responder */
.sv-page { max-width: 760px; margin: 0 auto; }
.sv-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
.sv-langs { display: inline-flex; border: 1px solid var(--border); border-radius: 10px; padding: 3px; background: var(--surface); }
.sv-langs a { padding: 6px 12px; border-radius: 7px; font-weight: 700; font-size: 13px; color: var(--text-2); text-decoration: none; }
.sv-langs a.on { background: var(--primary); color: var(--on-primary, #fff); }
.sv-head { margin-bottom: 16px; }
.sv-head h1 { margin: 8px 0 6px; font-size: clamp(22px, 5vw, 30px); line-height: 1.2; }
.sv-head-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.sv-head-tags .badge { display: inline-flex; align-items: center; gap: 4px; }
.sv-desc { color: var(--text-2); font-size: 15.5px; line-height: 1.55; margin: 0; }
.sv-intro { display: grid; gap: 10px; margin-bottom: 14px; }
.sv-instr { display: flex; gap: 10px; padding: 12px 14px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--border); font-size: 14.5px; line-height: 1.5; }
.sv-instr svg { flex: none; margin-top: 2px; color: var(--primary); }
.sv-privacy { border: 1px solid var(--border); border-radius: 12px; padding: 10px 14px; background: var(--surface); font-size: 14px; }
.sv-privacy summary { cursor: pointer; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.sv-privacy p { margin: 8px 0 0; line-height: 1.5; }
.sv-priv-anonymous { border-color: color-mix(in srgb, var(--success) 35%, var(--border)); }
.sv-priv-confidential { border-color: color-mix(in srgb, var(--warning) 40%, var(--border)); }
.sv-form { display: grid; gap: 12px; }
.sv-progress { position: sticky; top: 0; z-index: 5; height: 5px; border-radius: 99px; background: var(--surface-2); overflow: hidden; }
.sv-progress span { display: block; height: 100%; width: 0; background: var(--primary); transition: width .25s; }
.sv-req-note { margin: 0; }
.sv-req { color: var(--danger); font-weight: 700; }
.sv-opt { color: var(--muted); font-weight: 500; font-size: 13px; }
.sv-q { border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); padding: 16px; margin: 0; min-width: 0; }
.sv-q.has-error { border-color: var(--danger); box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 12%, transparent); }
.sv-q legend { display: flex; gap: 10px; align-items: flex-start; font-weight: 650; font-size: 15.5px; line-height: 1.4; padding: 0; float: left; width: 100%; margin-bottom: 10px; }
.sv-q legend + * { clear: both; }
.sv-qn { flex: none; width: 26px; height: 26px; border-radius: 8px; display: inline-grid; place-items: center; background: var(--primary-soft); color: var(--primary); font-size: 13px; font-weight: 750; }
.sv-help { color: var(--muted); font-size: 13.5px; margin: 0 0 10px; clear: both; }
.sv-opts { display: grid; gap: 6px; clear: both; }
.sv-opt-row { display: flex; align-items: center; gap: 10px; padding: 11px 12px; border: 1px solid var(--border); border-radius: 10px; cursor: pointer; font-size: 15px; min-height: 46px; }
.sv-opt-row:hover { border-color: var(--border-strong); }
.sv-opt-row:has(input:checked) { border-color: var(--primary); background: var(--primary-soft); }
.sv-opt-row input { width: 20px; height: 20px; flex: none; accent-color: var(--primary); }
.sv-opt-row.excl { border-style: dashed; }
.sv-seg { display: inline-flex; gap: 8px; clear: both; }
.sv-seg label, .sv-scale label, .sv-agree label { position: relative; cursor: pointer; }
.sv-seg input, .sv-scale input, .sv-agree input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.sv-seg span { display: inline-grid; place-items: center; min-width: 88px; min-height: 46px; padding: 0 16px; border: 1px solid var(--border); border-radius: 10px; font-weight: 700; }
.sv-scale { display: grid; grid-template-columns: repeat(auto-fit, minmax(42px, 1fr)); gap: 6px; clear: both; }
.sv-scale span { display: grid; place-items: center; height: 46px; border: 1px solid var(--border); border-radius: 10px; font-weight: 700; font-variant-numeric: tabular-nums; }
.sv-seg input:checked + span, .sv-scale input:checked + span, .sv-agree input:checked + span { background: var(--primary); border-color: var(--primary); color: var(--on-primary, #fff); }
.sv-seg input:focus-visible + span, .sv-scale input:focus-visible + span, .sv-agree input:focus-visible + span { outline: 2px solid var(--primary); outline-offset: 2px; }
.sv-scale-ends { display: flex; justify-content: space-between; gap: 10px; color: var(--muted); font-size: 12.5px; margin-top: 6px; }
.sv-agree { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; clear: both; }
.sv-agree span { display: grid; place-items: center; text-align: center; min-height: 58px; padding: 6px; border: 1px solid var(--border); border-radius: 10px; font-size: 12.5px; font-weight: 600; line-height: 1.25; }
@media (max-width: 600px) { .sv-agree { grid-template-columns: 1fr; } .sv-agree span { min-height: 44px; justify-content: flex-start; text-align: left; place-items: center start; padding: 0 12px; font-size: 14px; } .sv-scale.wide { grid-template-columns: repeat(6, 1fr); } }
.sv-stars { display: inline-flex; flex-direction: row-reverse; gap: 4px; clear: both; }
.sv-stars input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.sv-stars label { font-size: 34px; line-height: 1; color: var(--border-strong); cursor: pointer; padding: 2px; transition: color .1s; }
.sv-stars input:checked ~ label, .sv-stars label:hover, .sv-stars label:hover ~ label { color: #f59e0b; }
.sv-stars input:focus-visible + label { outline: 2px solid var(--primary); border-radius: 6px; }
.sv-input { width: 100%; font-size: 16px; padding: 11px 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); color: var(--text); clear: both; display: block; }
.sv-input.sv-num, .sv-input.sv-date { max-width: 220px; }
textarea.sv-input { resize: vertical; min-height: 110px; line-height: 1.5; }
.filter-count { display: block; text-align: right; margin-top: 4px; }
.sv-err { color: var(--danger); font-size: 13.5px; font-weight: 600; margin: 10px 0 0; display: flex; align-items: center; gap: 5px; }
.sv-submit { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 6px 0 20px; }
@media (max-width: 600px) { .sv-submit .btn { width: 100%; justify-content: center; } }
.sv-done:not(.sv-card) { text-align: center; display: grid; justify-items: center; gap: 8px; padding: 30px 20px; }
.sv-done-ico { width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; background: var(--success-soft); color: var(--success); box-shadow: 0 0 0 8px color-mix(in srgb, var(--success-soft) 55%, transparent); }
.sv-done:not(.sv-card) h2 { margin: 6px 0 0; }
.sv-done:not(.sv-card) p { margin: 0; max-width: 520px; }
.sv-done-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; margin-top: 8px; }
.sv-preview-bar { margin-bottom: 12px; }
/* Resultados */
.sv-res-q { margin-bottom: 12px; }
.sv-res-q h3 { font-size: 15px; display: flex; gap: 8px; align-items: flex-start; margin: 0 0 12px; line-height: 1.4; }
.sv-res-q h3 small { font-weight: 500; margin-left: auto; white-space: nowrap; }
.sv-results { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 12px; align-items: start; }
.sv-results .sv-res-q { margin: 0; }
.sv-bars { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.sv-bars li { display: grid; grid-template-columns: minmax(0, 12em) minmax(60px, 1fr) auto; gap: 10px; align-items: center; font-size: 13.5px; }
.sv-bar-lbl { color: var(--text-2); line-height: 1.3; overflow-wrap: anywhere; }
.sv-bar { height: 14px; border-radius: 4px; background: var(--surface-2); overflow: hidden; display: block; }
.sv-bar i { display: block; height: 100%; border-radius: 4px; background: color-mix(in srgb, var(--primary) 78%, var(--surface)); }
.sv-bar-val { display: inline-flex; gap: 6px; align-items: baseline; justify-content: flex-end; min-width: 5.6em; font-variant-numeric: tabular-nums; }
.sv-bar-val small { color: var(--muted); }
@media (max-width: 600px) { .sv-bars li { grid-template-columns: 1fr auto; } .sv-bar { grid-column: 1 / -1; order: 3; } }
.sv-numsum { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.sv-numsum span { display: grid; padding: 6px 12px; border-radius: 10px; background: var(--surface-2); font-size: 12px; color: var(--muted); }
.sv-numsum b { font-size: 18px; color: var(--text); font-variant-numeric: tabular-nums; }
.sv-base { margin: 10px 0 0; }
.sv-n { margin: 6px 0 10px; }
.sv-tl { display: flex; align-items: flex-end; gap: 2px; height: 120px; padding-top: 6px; border-bottom: 1px solid var(--border); }
.sv-tl-col { flex: 1; height: 100%; display: flex; align-items: flex-end; position: relative; cursor: default; }
.sv-tl-col i { display: block; width: 100%; background: color-mix(in srgb, var(--primary) 70%, var(--surface)); border-radius: 3px 3px 0 0; }
.sv-tl-col:hover i, .sv-tl-col:focus-visible i { background: var(--primary); }
.sv-tl-col[data-tip]:hover::after, .sv-tl-col[data-tip]:focus-visible::after { content: attr(data-tip); position: absolute; bottom: calc(100% + 4px); left: 50%; transform: translateX(-50%); white-space: nowrap; background: var(--text); color: var(--surface); font-size: 12px; padding: 4px 8px; border-radius: 6px; z-index: 5; pointer-events: none; }
.sv-tl-x { display: flex; justify-content: space-between; font-size: 11.5px; color: var(--muted); margin-top: 5px; }
.sv-defs { margin: 0; display: grid; gap: 8px; font-size: 13px; }
.sv-defs dt { font-weight: 700; }
.sv-defs dd { margin: 0; color: var(--text-2); }
.sv-segfilter { flex-wrap: wrap; gap: 6px; }
.sv-resp-list { display: grid; gap: 10px; }
.sv-resp header { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-bottom: 8px; }
.sv-resp dl { margin: 0; display: grid; gap: 8px; }
.sv-resp dt { font-size: 12.5px; color: var(--muted); font-weight: 600; }
.sv-resp dd { margin: 2px 0 0; font-size: 14px; overflow-wrap: anywhere; }
.sv-export { display: grid; gap: 10px; align-content: start; }
.sv-export h2 { margin: 0; }
.sv-export-btns { display: flex; gap: 8px; flex-wrap: wrap; }
.sv-kpis { margin-bottom: 14px; }
/* Asistente de edición */
.sv-steps { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 14px; }
.sv-steps a { display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px 7px 7px; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); color: var(--text-2); font-weight: 700; font-size: 13.5px; text-decoration: none; position: relative; }
.sv-steps a b { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: var(--surface-2); font-size: 12px; }
.sv-steps a.on { border-color: var(--primary); color: var(--text); }
.sv-steps a.on b { background: var(--primary); color: var(--on-primary, #fff); }
.sv-step-dot { font-style: normal; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 99px; background: var(--warning); color: #fff; font-size: 11px; display: inline-grid; place-items: center; }
@media (max-width: 700px) { .sv-steps a span { display: none; } .sv-steps a.on span { display: inline; } }
.sv-step { display: grid; gap: 14px; }
.sv-step h2 { margin: 0; }
.sv-bi { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 14px; }
@media (max-width: 760px) { .sv-bi { grid-template-columns: 1fr; } }
.sv-lang-off { display: none !important; }
.sv-missing input, .sv-missing textarea, input.sv-missing-in { border-color: var(--warning); background: color-mix(in srgb, var(--warning) 6%, var(--surface)); }
.sv-langs-pick { display: flex; gap: 8px 18px; flex-wrap: wrap; align-items: center; border: 1px solid var(--border); border-radius: 12px; padding: 10px 14px; }
.sv-langs-pick legend { font-weight: 700; font-size: 13px; padding: 0 4px; }
.sv-langs-pick small { flex-basis: 100%; }
.sv-inline { display: inline-flex; align-items: center; gap: 8px; }
.sv-inline > span { margin: 0; }
.sv-save { margin-top: 4px; }
.filter-count-box { display: flex; align-items: center; gap: 14px; padding: 12px 16px; border-radius: 12px; background: var(--primary-soft); }
.filter-count-n { font-size: 30px; font-weight: 800; color: var(--primary); font-variant-numeric: tabular-nums; min-width: 2ch; }
.sv-target-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 12px; }
.sv-target-grid .site-box { display: grid; gap: 4px; align-content: start; margin: 0; }
.sv-pick { max-height: 240px; overflow: auto; }
.sv-builder { display: grid; gap: 12px; }
.sv-builder-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.sv-builder-head h2 { margin: 0; }
.sv-qlist { display: grid; gap: 12px; }
.sv-qcard { display: grid; gap: 10px; margin: 0; }
.sv-qcard-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.sv-qcard-head select { max-width: 220px; }
.sv-qnum { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; background: var(--primary); color: var(--on-primary, #fff); font-weight: 800; font-size: 14px; }
.sv-more summary { cursor: pointer; font-size: 13px; color: var(--primary); font-weight: 600; }
.sv-more[open] summary { margin-bottom: 8px; }
.sv-qpart { display: grid; gap: 8px; }
.sv-qpart[hidden] { display: none; }
.sv-opts-edit { display: grid; gap: 6px; }
.sv-opt-edit { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto auto; gap: 6px; align-items: center; }
.sv-opt-edit input[type=text], .sv-opt-edit > input:not([type]) { min-width: 0; }
.sv-excl[hidden] { display: none; }
@media (max-width: 760px) { .sv-opt-edit { grid-template-columns: 1fr auto; } .sv-opt-edit > input[lang] { grid-column: 1; } .sv-opt-edit .sv-excl { grid-column: 1; } }
.sv-add { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; padding: 12px; border: 2px dashed var(--border); border-radius: var(--radius); }
.sv-privacy-pick { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 10px; border: 0; padding: 0; margin: 0; }
.sv-privacy-pick legend { font-weight: 700; font-size: 13px; margin-bottom: 6px; }
.sv-priv-opt { display: flex; gap: 10px; padding: 14px; border: 1px solid var(--border); border-radius: 12px; cursor: pointer; align-items: flex-start; }
.sv-priv-opt:has(input:checked) { border-color: var(--primary); background: var(--primary-soft); }
.sv-priv-opt input { margin-top: 3px; }
.sv-priv-opt > span:last-child { display: grid; gap: 4px; }
.sv-priv-opt small { color: var(--text-2); line-height: 1.4; }
.sv-priv-ico { color: var(--primary); }
.sv-anon-info { border: 1px solid var(--border); border-radius: 12px; padding: 10px 14px; font-size: 13.5px; background: var(--surface-2); }
.sv-anon-info summary { cursor: pointer; font-weight: 700; display: flex; gap: 6px; align-items: center; }
.sv-anon-info ul { margin: 8px 0 0; padding-left: 18px; display: grid; gap: 5px; line-height: 1.45; }
.sv-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 10px 18px; margin: 0; }
.sv-summary dt { font-size: 12px; color: var(--muted); font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
.sv-summary dd { margin: 3px 0 0; }
.sv-issues { padding: 12px 16px; border-radius: 12px; background: color-mix(in srgb, var(--warning) 9%, var(--surface)); border: 1px solid color-mix(in srgb, var(--warning) 35%, var(--border)); }
.sv-issues strong { display: flex; gap: 6px; align-items: center; }
.sv-issues ul { margin: 8px 0 0; padding-left: 20px; display: grid; gap: 4px; }
.sv-pub-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.sv-reopen { display: inline-flex; gap: 8px; align-items: flex-end; flex-wrap: wrap; }
.sv-roles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 14px; margin-bottom: 14px; }
.sv-role { display: grid; gap: 8px; margin: 0; align-content: start; }
.sv-role h2 { margin: 0; }
.sv-note { margin-bottom: 14px; }
.sv-qpart .field.sv-inline { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 10px; text-align: left; }
.sv-qpart .field.sv-inline > span { margin: 0; white-space: nowrap; }
.sv-qpart .field.sv-inline input, .sv-qpart .field.sv-inline select { width: auto; max-width: 170px; }
.sv-qpart > [data-sv-addopt] { justify-self: start; }
.sv-stars { display: flex; width: max-content; max-width: 100%; flex-wrap: wrap-reverse; justify-content: flex-end; }
.sv-tl { justify-content: center; }
.sv-tl-col { max-width: 56px; }

/* =====================================================================
   Móvil primero en el área personal: la mayor parte de la plantilla
   (conductores) entra desde el teléfono.
   ===================================================================== */

/* Barra inferior: pestañas que se reparten el ancho, con burbuja de no leídos */
.tabbar a { flex: 1 1 0; min-width: 0; min-height: 48px; justify-content: center; position: relative; padding: 4px 0; font-size: 11px; font-weight: 600; }
.tabbar a > span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tabbar .tab-new { flex: 0 0 auto; }
.tab-badge {
  position: absolute; top: 2px; left: calc(50% + 5px); min-width: 18px; height: 18px; padding: 0 5px; border-radius: 99px;
  background: var(--danger); color: #fff; font-size: 11px; font-weight: 800; line-height: 18px; text-align: center;
  box-shadow: 0 0 0 2px var(--surface);
}
@media (max-width: 400px) {
  .tabbar { gap: 0; padding-left: 4px; padding-right: 4px; }
  .tabbar a { font-size: 10.5px; }
  /* En pantallas estrechas, «Reservar» queda como un botón redondo con el +; el nombre sigue en aria-label */
  .tabbar .tab-new { width: 48px; height: 48px; min-height: 0; padding: 0; justify-content: center; }
  .tabbar .tab-new > span { display: none; }
}
@media (max-width: 340px) { .tabbar a { font-size: 10px; letter-spacing: -.01em; } }

/* iOS amplía la página al tocar un campo con letra de menos de 16 px */
@media (max-width: 760px), (pointer: coarse) {
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]), select, textarea { font-size: max(16px, 1em) !important; }
}

/* Zonas táctiles: se amplía la zona que se puede tocar sin mover nada de sitio */
@media (pointer: coarse) {
  .link, .back, .back-link { padding-block: 10px; margin-block: -10px; }
  .alert-x { padding: 10px; margin: -8px -8px -8px 0; }
  .chip-btn { height: 40px; }
  .lite-foot a, .lite-foot button { min-height: 44px; padding: 10px 6px; }
}

@media (max-width: 640px) {
  /* Preguntas frecuentes: el aviso final se apila y el botón ocupa todo el ancho */
  .faq-more { flex-wrap: wrap; }
  .faq-more > div { flex: 1 1 calc(100% - 54px); min-width: 0; }
  .faq-more .btn { flex: 1 1 100%; justify-content: center; }
  /* Mi perfil: foto encima del nombre y el email partido si no cabe */
  .profile-head { flex-direction: column; text-align: center; }
  .profile-id { min-width: 0; max-width: 100%; display: flex; flex-direction: column; align-items: center; }
  .profile-id .photo-actions { justify-content: center; }
  .profile-id p { overflow-wrap: anywhere; }
}

/* Comunicados: permisos de publicación y revisión */
.np-roles { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; margin-bottom: 18px; }
.np-roles > .np-role { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; margin: 0; }
.np-form .mod-seg { margin-top: 4px; }
.np-role strong { display: block; }
.np-role small { display: block; margin-top: 2px; line-height: 1.4; }
.np-role-ico { flex: none; width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: var(--primary-soft); color: var(--primary); }
.np-role-pick { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; }
.np-opt:has(input:checked) { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-soft); }
.np-tpls { margin-top: 10px; }
.np-help { grid-column: 1 / -1; }
.np-form .target-cols { margin-top: 8px; }
.np-table tr.row-on td { background: var(--primary-soft); }
.tpl-chip { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; margin: 1px 2px 1px 0; border-radius: 99px; font-size: 12px; font-weight: 700; color: var(--nt); background: color-mix(in srgb, var(--nt) 12%, var(--surface)); }
.ne-return { margin: 0; }
.ne-return > summary { list-style: none; cursor: pointer; }
.ne-return > summary::-webkit-details-marker { display: none; }
.ne-return[open] { display: grid; gap: 8px; padding: 10px; border: 1px solid var(--border); border-radius: var(--radius); }
.ne-limit { margin: 8px 0 0; }
.perm-link .card-head { flex-wrap: wrap; gap: 8px; }

/* =====================================================================
   Bizi, el asistente (includes/bizi.php): botón flotante y chat
   ===================================================================== */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.bizi { --bz-green: #107a40; --bz-teal: #0491a3; --bz-soft: color-mix(in srgb, #62a630 12%, var(--surface)); position: fixed; right: 22px; bottom: 18px; z-index: 70; }
.lite .bizi { right: 10px; bottom: calc(74px + env(safe-area-inset-bottom)); }
.bizi-launcher { display: block; width: 96px; height: 122px; padding: 0; border: 0; background: none; cursor: pointer; filter: drop-shadow(0 8px 10px rgba(1, 62, 39, .28)); -webkit-tap-highlight-color: transparent; }
.lite .bizi-launcher { width: 76px; height: 98px; }
.bizi-launcher:focus-visible { outline: 3px solid var(--bz-teal); outline-offset: 2px; border-radius: 14px; }
/* Sombra en el suelo: se queda quieta mientras Bizi flota */
.bizi-launcher { position: relative; }
.bizi-launcher::before { content: ""; position: absolute; left: 50%; bottom: 0; width: 62%; height: 14px; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(ellipse at center, rgba(0, 0, 0, .34) 0%, rgba(0, 0, 0, 0) 70%); pointer-events: none; z-index: -1; }
.bizi.is-open .bizi-launcher { transform: scale(.82); transform-origin: bottom right; }
.bizi-fig { display: block; width: 100%; height: 100%; }
.bizi-fig .bizi-svg { display: block; width: 100%; height: 100%; overflow: visible; }

/* Piezas que se mueven: cada una gira o se encoge desde su sitio (coordenadas del dibujo) */
.bizi .bz-arm-l { transform-box: view-box; transform-origin: 175px 430px; transition: transform .35s ease; }
.bizi .bz-arm-r { transform-box: view-box; transform-origin: 505px 462px; transition: transform .35s ease; }
.bizi .bz-eye-l { transform-box: view-box; transform-origin: 275px 316px; }
.bizi .bz-eye-r { transform-box: view-box; transform-origin: 420px 346px; }
.bizi .bz-brow, .bizi .bz-mouth { transform-box: view-box; transition: transform .3s ease; }
.bizi .bz-mouth { transform-origin: 333px 428px; }
.bizi .bz-pupil { transition: translate .3s ease; }

/* Siempre: flota y parpadea; el del botón saluda de vez en cuando */
@keyframes bz-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes bz-blink { 0%, 93%, 100% { scale: 1 1; } 96% { scale: 1 .08; } }
@keyframes bz-wave { 0%, 100% { transform: rotate(0); } 18% { transform: rotate(-24deg); } 38% { transform: rotate(12deg); } 58% { transform: rotate(-20deg); } 78% { transform: rotate(8deg); } }
@keyframes bz-wave-idle { 0%, 88%, 100% { transform: rotate(0); } 90% { transform: rotate(-22deg); } 93% { transform: rotate(10deg); } 96% { transform: rotate(-16deg); } }
.bizi-launcher .bizi-svg { animation: bz-float 3.2s ease-in-out infinite; }
.bizi .bz-eye { animation: bz-blink 5s ease-in-out infinite; }
.bizi .bz-eye-r { animation-delay: .02s; }
.bizi-launcher .bz-arm-l { animation: bz-wave-idle 11s ease-in-out 4s infinite; }
.bizi-launcher:hover .bz-arm-l, .bizi.is-waving .bz-arm-l { animation: bz-wave 1.2s ease-in-out; }

/* Pensando: cejas arriba, mira hacia arriba, mano a la barbilla y balanceo */
@keyframes bz-think { 0%, 100% { transform: rotate(-3deg) translateY(0); } 50% { transform: rotate(3deg) translateY(-3px); } }
.bizi.is-thinking .bizi-svg { animation: bz-think 1.1s ease-in-out infinite; }
.bizi.is-thinking .bz-brow { transform: translateY(-9px); }
.bizi.is-thinking .bz-pupil { translate: -7px -9px; }
.bizi.is-thinking .bz-arm-r { transform: rotate(-42deg); }
.bizi.is-thinking .bz-arm-l { animation: none; }

/* Contento: salta con los brazos arriba */
@keyframes bz-jump { 0%, 100% { transform: translateY(0) scale(1); } 25% { transform: translateY(-14px) scale(1.04); } 50% { transform: translateY(0) scale(.98, 1.02); } 70% { transform: translateY(-6px); } }
.bizi.is-happy .bizi-svg { animation: bz-jump .9s ease-out 2; }
.bizi.is-happy .bz-arm-l { transform: rotate(-18deg); }
.bizi.is-happy .bz-arm-r { transform: rotate(-38deg); }

/* Dudando: ladea la cabeza y encoge la sonrisa */
.bizi.is-unsure .bizi-svg { rotate: -8deg; transition: rotate .35s ease; }
.bizi.is-unsure .bz-brow-l { transform: translateY(-7px); }
.bizi.is-unsure .bz-mouth { transform: scale(.82, .62); }

@media (prefers-reduced-motion: reduce) {
  .bizi *, .bizi .bizi-svg { animation: none !important; transition: none !important; }
}

/* Bocadillo de bienvenida */
.bizi-hello { position: absolute; right: 100px; bottom: 80px; width: 220px; padding: 12px 30px 12px 14px; border-radius: 16px 16px 4px 16px; background: var(--surface); color: var(--text);
  border: 1px solid var(--border); box-shadow: 0 10px 30px rgba(15, 23, 42, .16); font-size: 13.5px; line-height: 1.4; cursor: pointer; animation: bz-pop .35s ease-out; }
.lite .bizi-hello { right: 80px; bottom: 56px; width: 200px; }
.bizi-hello-x { position: absolute; top: 6px; right: 6px; width: 26px; height: 26px; display: grid; place-items: center; border: 0; border-radius: 99px; background: none; color: var(--muted); cursor: pointer; }
@keyframes bz-pop { from { opacity: 0; transform: translateY(8px) scale(.96); } to { opacity: 1; transform: none; } }

/* El chat */
.bizi-panel { position: fixed; right: 22px; bottom: 116px; width: 384px; height: min(600px, calc(100vh - 140px)); display: flex; flex-direction: column;
  background: var(--surface); border: 1px solid var(--border); border-radius: 20px; box-shadow: 0 24px 60px rgba(15, 23, 42, .25); overflow: hidden; animation: bz-pop .25s ease-out; }
.bizi-panel[hidden] { display: none; }
.bizi-head { position: relative; display: flex; align-items: center; gap: 10px; padding: 12px 10px 12px 76px; min-height: 70px; color: #fff;
  background: linear-gradient(120deg, var(--bz-green), var(--bz-teal)); }
.bizi-fig-head { position: absolute; left: 12px; bottom: -6px; width: 56px; height: 72px; filter: drop-shadow(0 4px 6px rgba(0, 0, 0, .25)); }
.bizi-fig-head .bizi-svg { animation: bz-float 3.2s ease-in-out infinite; }
.bizi-head-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.bizi-head-txt strong { font-size: 17px; }
.bizi-head-txt small { font-size: 12px; opacity: .9; line-height: 1.3; }
.bizi-head .icon-btn { color: #fff; background: rgba(255, 255, 255, .14); width: 38px; height: 38px; }
.bizi-head .icon-btn:hover { background: rgba(255, 255, 255, .26); }
.bizi-log { flex: 1; overflow-y: auto; padding: 16px 14px 8px; display: flex; flex-direction: column; gap: 10px; background: var(--bg); overscroll-behavior: contain; }
.bizi-msg { max-width: 88%; padding: 10px 13px; border-radius: 16px; font-size: 14.5px; line-height: 1.5; word-wrap: break-word; }
.bizi-msg p { margin: 0; }
.bizi-msg p + p, .bizi-msg p + ul, .bizi-msg ul + p { margin-top: 6px; }
.bizi-msg ul { margin: 4px 0 0; padding-left: 18px; }
.bizi-msg.bot { align-self: flex-start; background: var(--surface); border: 1px solid var(--border); border-bottom-left-radius: 4px; }
.bizi-msg.user { align-self: flex-end; background: var(--bz-green); color: #fff; border-bottom-right-radius: 4px; }
.bizi-msg.typing { display: flex; gap: 5px; padding: 14px 16px; }
.bizi-msg.typing span { width: 7px; height: 7px; border-radius: 50%; background: var(--bz-teal); animation: bz-dot 1s ease-in-out infinite; }
.bizi-msg.typing span:nth-child(2) { animation-delay: .15s; }
.bizi-msg.typing span:nth-child(3) { animation-delay: .3s; }
@keyframes bz-dot { 0%, 100% { opacity: .3; transform: translateY(0); } 50% { opacity: 1; transform: translateY(-4px); } }
.bizi-src { display: flex; flex-direction: column; gap: 5px; margin-top: 10px; padding-top: 8px; border-top: 1px dashed var(--border); }
.bizi-src > small { color: var(--muted); font-weight: 700; font-size: 11.5px; text-transform: uppercase; letter-spacing: .04em; }
.bizi-src-item { display: flex; flex-direction: column; padding: 7px 10px; border-radius: 10px; background: var(--bz-soft); color: var(--text); font-size: 13px; line-height: 1.35; text-decoration: none; }
.bizi-src-item:hover { background: color-mix(in srgb, #62a630 22%, var(--surface)); }
.bizi-src-kind { font-size: 11px; font-weight: 700; color: var(--bz-green); }
.bizi-src-item.faq .bizi-src-kind { color: var(--bz-teal); }
.bizi-sugg { display: flex; flex-wrap: wrap; gap: 6px; }
.bizi-sugg[hidden] { display: none; }
.bizi-sugg .chip-btn { height: auto; min-height: 34px; padding: 6px 12px; text-align: left; white-space: normal; line-height: 1.3; font-weight: 600; }
.bizi-form { display: flex; align-items: flex-end; gap: 8px; padding: 10px 12px 6px; border-top: 1px solid var(--border); background: var(--surface); }
.bizi-form textarea { flex: 1; min-height: 44px; max-height: 120px; resize: none; padding: 11px 13px; border-radius: 14px; line-height: 1.35; }
.bizi-send { flex: none; width: 44px; height: 44px; display: grid; place-items: center; border: 0; border-radius: 14px; background: var(--bz-green); color: #fff; cursor: pointer; }
.bizi-send:hover { background: #0c6534; }
.bizi-note { margin: 0; padding: 4px 14px 10px; background: var(--surface); color: var(--muted); font-size: 11.5px; line-height: 1.35; }

/* En el móvil el chat ocupa toda la pantalla */
@media (max-width: 640px) {
  .bizi-panel { inset: 0; width: auto; height: auto; border-radius: 0; border: 0; padding-bottom: env(safe-area-inset-bottom); }
  .bizi.is-open .bizi-launcher, .bizi.is-open .bizi-hello { display: none; }
  body.bizi-open { overflow: hidden; }
  .bizi-head { padding-top: calc(12px + env(safe-area-inset-top)); }
}

/* Ajustes → Bizi */
.bizi-intro { display: flex; gap: 14px; align-items: center; margin-bottom: 6px; }
.bizi-admin-fig { flex: none; width: 54px; height: 70px; }
.bizi-intro p { margin: 0; }
.bizi-prices { margin: 4px 0; }
.bizi-prices summary { cursor: pointer; color: var(--text-2); font-weight: 600; }
.bizi-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; margin-bottom: 14px; }
.bizi-kpis > div { display: flex; flex-direction: column; gap: 3px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg); }
.bizi-kpis small { color: var(--muted); font-weight: 600; font-size: 12px; }
.bizi-kpis strong { font-size: 22px; font-variant-numeric: tabular-nums; }
.bizi-bar { width: 100%; }
.bizi-bar.warn i { background: var(--danger); }
.bizi-unans { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.bizi-unans li { display: flex; gap: 10px; align-items: baseline; padding: 8px 0; border-top: 1px solid var(--border); }
.bizi-unans li:first-child { border-top: 0; }
.bizi-unans li > span:nth-child(2) { flex: 1; }

/* ---------- Bizi sentado con su portátil, entre las tarjetas de la pantalla de acceso ---------- */
.auth-art.with-bizi { height: 676px; }
.auth-art.with-bizi .art-card.c1 { top: 0; } .auth-art.with-bizi .art-card.c2 { top: 92px; } .auth-art.with-bizi .art-card.c3 { top: 172px; } .auth-art.with-bizi .art-card.c4 { top: 248px; }
.auth-art .art-card { z-index: 2; }
.bizi.bizi-sit { position: absolute; left: 4px; bottom: 0; right: auto; width: 320px; margin-bottom: 16px; z-index: 1; pointer-events: none; }
.bizi-sit-fig { position: relative; filter: drop-shadow(0 12px 14px rgba(1, 62, 39, .22)); transform-origin: 50% 100%; animation: bz-breathe 4.2s ease-in-out infinite; }
.bizi-sit-main { display: block; width: 100%; height: auto; }
/* Parpadeo: unos párpados del color de la hoja que aparecen un instante sobre los ojos */
.bizi-lid { position: absolute; left: 23.08%; top: 34.2%; width: 40.97%; height: 24.89%; opacity: 0; animation: bz-lid 5.2s ease-in-out 1.2s infinite; }
@keyframes bz-lid { 0%, 93%, 100% { opacity: 0; } 94.5%, 97% { opacity: 1; } }
@keyframes bz-breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.012, 1.018); } }

/* Galería de fondos de la pantalla de acceso */
.bg-gallery { display: grid; gap: 6px; margin-top: 10px; }
.bg-gallery-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.bg-opt { position: relative; display: grid; gap: 4px; cursor: pointer; font-size: .78rem; text-align: center; color: var(--text-2, inherit); }
.bg-opt input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.bg-opt img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 10px; border: 2px solid var(--border); transition: border-color .15s, box-shadow .15s; }
.bg-opt:hover img { border-color: var(--border-strong); }
.bg-opt input:checked + img { border-color: var(--primary, #0a8a5a); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary, #0a8a5a) 25%, transparent); }
.bg-opt input:checked ~ span { font-weight: 600; }
.bg-opt input:focus-visible + img { outline: 2px solid var(--primary, #0a8a5a); outline-offset: 2px; }
@media (max-width: 520px) { .bg-gallery-grid { grid-template-columns: 1fr 1fr; } }

/* Ficha de empresa: pestañas laterales por funcionalidad */
.modal-wrap > .modal.co-modal { max-width: min(860px, 100%); }
.co-layout { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 20px; align-items: start; }
.co-nav { position: static; }
.co-panels { min-width: 0; display: grid; gap: 14px; }
.co-panels > section { display: grid; gap: 14px; align-content: start; min-width: 0; }
.co-panels > section[hidden] { display: none; }
@media (max-width: 900px) { .co-layout { grid-template-columns: minmax(0, 1fr); gap: 12px; } }

.bg-gallery-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.bg-opt-wrap { display: grid; gap: 4px; align-content: start; min-width: 0; }
.bg-opt-wrap[hidden] { display: none; }
.bg-del { justify-content: center; font-size: .72rem; color: var(--muted); }
.bg-gallery-add { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.bg-gallery-add small { min-width: 0; overflow-wrap: anywhere; }
.bg-tools { display: flex; align-items: center; justify-content: center; gap: 6px 10px; flex-wrap: wrap; }
.bg-tools .btn { padding: 3px 8px; font-size: .74rem; }

.blur-field { display: grid; gap: 6px; margin-top: 12px; }
.blur-row { display: flex; align-items: center; gap: 12px; }
.blur-row input[type=range] { flex: 1; min-width: 0; accent-color: var(--primary); }
.blur-row output { min-width: 48px; text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.bg-frame .uploader-preview.bg img { transition: filter .15s; }
.mode-switch .off { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 7px 6px; border-radius: 9px; font-size: 13px; font-weight: 700; color: var(--sb-muted, var(--muted)); opacity: .5; cursor: not-allowed; white-space: nowrap; }
.mode-forget { display: block; margin: -4px 0 8px; font-size: 11.5px; text-align: center; color: var(--sb-muted, var(--muted)); text-decoration: underline; }
.choose-remember { justify-content: center; margin-top: 2px; }
.mode-badge { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 7px 10px; margin: 2px 0 8px; border-radius: 12px; font-size: 13px; font-weight: 700; color: var(--sb-active-text, var(--primary)); background: var(--sb-hover, var(--surface-2)); border: 1px solid var(--sb-border, var(--border)); }
/* Huella / llave de acceso */
.wa-login { margin: 4px 0 6px; }
.wa-login .btn { gap: 10px; }
.wa-msg { margin: 8px 0 0; }
.wa-or { display: flex; align-items: center; gap: 10px; margin: 16px 0 4px; color: var(--muted); font-size: 12.5px; }
.wa-or::before, .wa-or::after { content: ""; flex: 1; height: 1px; background: var(--border); }
.pk-list { list-style: none; margin: 10px 0; padding: 0; display: grid; gap: 8px; }
.pk-list li { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-2); }
.pk-list form { margin: 0 0 0 auto; }
.pk-ico { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: var(--surface); color: var(--primary); flex: none; }
.pk-text { display: grid; min-width: 0; }
.pk-text strong { font-size: 14px; }
.pk-add { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.pk-add input[name=pk_name] { flex: 1 1 160px; min-width: 0; }
.ev-room .room-avail { margin: 4px 0 0; font-weight: 600; }
.ev-room .room-avail.free { color: var(--success); }
.ev-room .room-avail.busy { color: var(--danger); }
.ev-room [data-ev-room-pick] { margin-top: 8px; }
.pe-times { gap: 10px; }
/* Ventanas más altas que la pantalla: se desplazan sin cortar la parte de arriba (antes, al centrar, el principio quedaba inaccesible) */
.modal-wrap { place-items: start center; }
.modal-wrap > .modal { margin: auto 0; }
/* Mi calendario: formulario más compacto cuando se reserva sala */
.ev-room { margin-top: 0; }
.ev-room .field { margin-bottom: 4px; }
.ev-room { border: 0; padding: 0; margin: 0; min-width: 0; }
/* Con una ventana abierta, la página de detrás no se desplaza: la rueda mueve la ventana */
body:has(> .modal-wrap), body:has(.main .modal-wrap) { overflow: hidden; }
.modal-wrap { overscroll-behavior: contain; }

/* ---------- Flujo editorial de comunicados ---------- */
.nf { position: relative; scroll-margin-top: 76px; --nf-pend: var(--border-strong); --nf-act: var(--primary); --nf-done: var(--success); --nf-block: #d97706; --nf-block-soft: #fff4e5; margin-bottom: 18px; }
[data-theme="dark"] .nf, [data-theme="dark"] .nf-mini { --nf-block: #fbbf24; --nf-block-soft: #35260f; }
.nf-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin-bottom: 14px; }
.nf-where { font-size: 13px; color: var(--text-2); background: var(--surface-2); border: 1px solid var(--border); border-radius: 99px; padding: 4px 12px; }
.nf-where.is-done { color: var(--success); background: var(--success-soft); border-color: transparent; }
.nf-where.is-stale, .nf-where.is-blocked { color: var(--nf-block); background: var(--nf-block-soft); border-color: transparent; }
.nf-track { display: flex; align-items: center; gap: 0; overflow-x: auto; padding: 6px 2px 4px; scrollbar-width: thin; }
.nf-fork { display: flex; flex-direction: column; gap: 10px; position: relative; }
.nf-fork.multi { padding: 4px 14px; border-left: 2px solid var(--border); border-right: 2px solid var(--border); border-radius: 14px; }
.nf-lane { display: flex; align-items: center; }
.nf-node { flex: none; display: flex; flex-direction: column; align-items: center; gap: 6px; width: 126px; padding: 8px 4px; border: 0; background: none; border-radius: 12px; cursor: pointer; font: inherit; color: var(--text); text-align: center; transition: background .2s; }
.nf-node:hover, .nf-node[aria-expanded="true"] { background: var(--surface-2); }
.nf-node:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.nf-dot { position: relative; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 2px solid var(--nf-pend); background: var(--surface); color: var(--muted); transition: border-color .3s, background .3s, color .3s, transform .2s; }
.nf-node:hover .nf-dot { transform: translateY(-1px); }
.nf-txt { display: flex; flex-direction: column; align-items: center; gap: 2px; min-width: 0; }
.nf-txt strong { font-size: 13.5px; font-weight: 700; display: inline-flex; gap: 5px; align-items: center; }
.nf-txt .lang-tag { font-size: 10px; padding: 1px 5px; }
.nf-state { font-size: 11.5px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; }
.nf-date { font-size: 11.5px; color: var(--muted); min-height: 1em; }
.nf-who { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--text-2); max-width: 118px; }
.nf-who > span:last-child { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nf-who .avatar.xs { width: 20px; height: 20px; font-size: 9px; }
/* Estados */
.nf-node.is-active .nf-dot { border-color: var(--nf-act); color: var(--nf-act); background: var(--primary-soft); animation: nf-pulse 2.4s ease-out infinite; }
.nf-node.is-active .nf-state { color: var(--nf-act); }
.nf-node.is-done .nf-dot { border-color: var(--nf-done); background: var(--nf-done); color: #fff; }
.nf-node.is-done .nf-dot svg { animation: nf-pop .35s ease-out; }
.nf-node.is-done .nf-state { color: var(--nf-done); }
.nf-node.is-blocked .nf-dot { border-color: var(--nf-block); background: var(--nf-block-soft); color: var(--nf-block); }
.nf-node.is-blocked .nf-state, .nf-node.is-stale .nf-state { color: var(--nf-block); }
.nf-node.is-stale .nf-dot { border-color: var(--nf-block); }
.nf-node.is-skipped .nf-dot { border-style: dashed; color: var(--muted); }
.nf-node.is-skipped strong { color: var(--muted); text-decoration: line-through; text-decoration-thickness: 1px; }
/* Conexiones */
.nf-link { flex: 1 1 24px; min-width: 22px; height: 3px; margin: 0 -2px 52px; border-radius: 3px; background: var(--border); position: relative; }
.nf-link i { position: absolute; inset: 0; border-radius: 3px; transform: scaleX(0); transform-origin: left; background: var(--nf-done); transition: transform .6s ease; }
.nf-link.is-done i { transform: scaleX(1); }
.nf-link.is-flow i { transform: scaleX(1); background: repeating-linear-gradient(90deg, var(--nf-act) 0 8px, transparent 8px 14px); background-size: 28px 100%; animation: nf-flow 1.1s linear infinite; }
.nf-link.is-wait { background: repeating-linear-gradient(90deg, var(--border-strong) 0 4px, transparent 4px 8px); }
.nf-lane .nf-link { min-width: 18px; }
@keyframes nf-pulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--nf-act) 35%, transparent); } 70% { box-shadow: 0 0 0 10px transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }
@keyframes nf-flow { to { background-position: 28px 0; } }
@keyframes nf-pop { from { transform: scale(.4); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@keyframes nf-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
/* Anillo de tiempo: se llena con los días que lleva el paso en curso (azul → naranja al llegar al límite) */
.nf-ring { position: absolute; left: 50%; top: 50%; width: 56px; height: 56px; transform: translate(-50%, -50%) rotate(-90deg); pointer-events: none; overflow: visible; }
.nf-ring circle { fill: none; stroke-width: 3; stroke-linecap: round; }
.nf-ring-bg { stroke: color-mix(in srgb, var(--nf-act) 14%, transparent); }
.nf-ring-fg { stroke: var(--nf-act); stroke: color-mix(in srgb, var(--nf-block) calc(var(--nf-age, 0) * 100%), var(--nf-act)); stroke-dasharray: 100; stroke-dashoffset: calc(100 - var(--nf-age, 0) * 100); animation: nf-ring-in 1.3s cubic-bezier(.3, .7, .2, 1) both; }
.nf-node.is-stale .nf-ring-fg { stroke: var(--nf-block); animation: nf-ring-in 1.3s cubic-bezier(.3, .7, .2, 1) both, nf-blink 2s ease-in-out 1.3s infinite; }
@keyframes nf-ring-in { from { stroke-dashoffset: 100; } }
/* El «sobre»: el comunicado viaja por la conexión hacia el paso en curso */
.nf-pkt { position: absolute; top: 50%; left: 0; z-index: 2; display: grid; place-items: center; width: 22px; height: 22px; margin: -11px 0 0 -11px; border-radius: 50%; background: var(--surface); color: var(--nf-act); border: 1.5px solid var(--nf-act); box-shadow: 0 0 0 3px color-mix(in srgb, var(--nf-act) 18%, transparent), 0 2px 6px rgba(15, 23, 42, .18); pointer-events: none; animation: nf-travel 2.8s cubic-bezier(.45, 0, .25, 1) infinite; }
@keyframes nf-travel { 0% { left: 0; opacity: 0; transform: scale(.6); } 12% { opacity: 1; transform: scale(1); } 78% { opacity: 1; transform: scale(1); } 100% { left: 100%; opacity: 0; transform: scale(.7); } }
@keyframes nf-hop { 0% { left: 0; opacity: 0; transform: scale(.6); } 15% { opacity: 1; transform: scale(1.1); } 85% { opacity: 1; transform: scale(1.1); } 100% { left: 100%; opacity: 0; transform: scale(.5); } }
/* Al avanzar un paso: se completa el círculo, la línea se rellena, el sobre salta al siguiente y este «llega» */
.nf-link.just i { animation: nf-fill .55s ease-out both; }
.nf-link.just.is-flow i { animation: nf-fill .55s ease-out both, nf-flow 1.1s linear infinite; }
.nf-link.just .nf-pkt { animation: nf-hop .9s .4s cubic-bezier(.4, 0, .2, 1) 1 backwards, nf-travel 2.8s 1.5s cubic-bezier(.45, 0, .25, 1) infinite; }
.nf-node.just-done .nf-dot { animation: nf-burst .75s cubic-bezier(.2, .8, .3, 1.3) both; }
.nf-node.just-done .nf-dot::after { content: ''; position: absolute; inset: -2px; border-radius: 50%; border: 2px solid var(--nf-done); pointer-events: none; animation: nf-ripple .95s ease-out both; }
.nf-node.just-done .nf-dot svg { animation: none; }
.nf-node.just-done .nf-dot svg * { stroke-dasharray: 40; stroke-dashoffset: 40; animation: nf-draw .45s .25s ease-out forwards; }
.nf-node.is-active.just-active .nf-dot { animation: nf-arrive .6s 1.05s cubic-bezier(.2, .8, .3, 1.4) backwards, nf-pulse 2.4s 1.7s ease-out infinite; }
.nf-node.just-active .nf-ring-fg { animation-delay: 1.05s; }
.nf-conf { position: absolute; width: 7px; height: 11px; border-radius: 2px; pointer-events: none; z-index: 6; opacity: 0; }
@keyframes nf-fill { from { transform: scaleX(0); } }
@keyframes nf-burst { 0% { transform: scale(.7); background: var(--surface); color: var(--nf-done); } 55% { transform: scale(1.2); } 100% { transform: scale(1); } }
@keyframes nf-ripple { from { transform: scale(1); opacity: .7; } to { transform: scale(2); opacity: 0; } }
@keyframes nf-draw { to { stroke-dashoffset: 0; } }
@keyframes nf-arrive { from { transform: scale(.55); opacity: .3; } to { transform: scale(1); opacity: 1; } }
/* Panel del paso elegido */
.nf-panels { border-top: 1px solid var(--border); margin-top: 8px; }
.nf-panel { padding-top: 14px; animation: nf-in .25s ease-out; }
.nf-ph { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin-bottom: 10px; }
.nf-ph strong { font-size: 15.5px; }
.nf-pico { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: var(--surface-2); color: var(--muted); }
.nf-pico.is-active { background: var(--primary-soft); color: var(--primary); }
.nf-pico.is-done { background: var(--success-soft); color: var(--success); }
.nf-pico.is-blocked { background: var(--nf-block-soft); color: var(--nf-block); }
.nf-badge { font-size: 11.5px; font-weight: 700; padding: 3px 9px; border-radius: 99px; background: var(--surface-2); color: var(--muted); border: 1px solid var(--border); }
.nf-badge.is-active { background: var(--primary-soft); color: var(--primary); border-color: transparent; }
.nf-badge.is-done { background: var(--success-soft); color: var(--success); border-color: transparent; }
.nf-badge.is-blocked, .nf-badge.is-stale { background: var(--nf-block-soft); color: var(--nf-block); border-color: transparent; }
.nf-meta { display: flex; flex-wrap: wrap; gap: 6px 28px; margin: 0 0 10px; }
.nf-meta div { min-width: 0; }
.nf-meta dt { font-size: 11.5px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; }
.nf-meta dd { margin: 2px 0 0; font-size: 14px; }
.nf-why, .nf-note { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 10px; padding: 9px 12px; border-radius: 10px; font-size: 14px; }
.nf-why { background: var(--nf-block-soft); color: var(--nf-block); }
.nf-note { background: var(--surface-2); color: var(--text-2); border: 1px solid var(--border); }
.nf-note svg, .nf-why svg { flex: none; margin-top: 3px; }
/* Dos zonas: a la izquierda lo secundario; a la derecha lo que hace avanzar el paso (aprobar, publicar, enviar) */
.nf-acts { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 16px; align-items: start; margin-bottom: 8px; }
.nf-acts-l, .nf-acts-r { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start; min-width: 0; }
.nf-acts-r { grid-column: 2; justify-content: flex-end; }
.nf-acts-l > small { flex-basis: 100%; }
.nf-return[open] { flex-basis: 100%; }
.nf-acts-r .nf-return[open] { flex-basis: min(380px, 100%); }
@media (max-width: 720px) { .nf-acts { grid-template-columns: minmax(0, 1fr); } .nf-acts-r { grid-column: 1; } }
.nf-return[open] { padding: 10px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-2); display: grid; gap: 8px; }
.nf-return summary { list-style: none; width: fit-content; }
.nf-return summary::-webkit-details-marker { display: none; }
.nf-return textarea { width: 100%; }
.nf-return .btn { width: fit-content; }
.nf-hist { list-style: none; margin: 8px 0 0; padding: 8px 0 0; border-top: 1px dashed var(--border); display: grid; gap: 4px; font-size: 13px; color: var(--text-2); }
.nf-hist time { color: var(--muted); font-size: 12px; margin-right: 4px; }
.nf-hist q { color: var(--text); font-style: italic; }
/* Línea de progreso del listado de gestión */
.nf-mini-link { display: inline-block; margin-top: 6px; color: inherit; }
.nf-mini { display: inline-flex; flex-direction: column; gap: 3px; --nf-act: var(--primary); --nf-done: var(--success); --nf-block: #d97706; }
.nf-mini-dots { display: inline-flex; align-items: center; gap: 3px; }
.nf-mini-dots i { width: 14px; height: 6px; border-radius: 3px; background: var(--border-strong); }
.nf-mini-dots i.is-done { background: var(--nf-done); }
.nf-mini-dots i.is-active { background: var(--nf-act); animation: nf-blink 2s ease-in-out infinite; }
.nf-mini-dots i.is-blocked, .nf-mini-dots i.is-stale { background: var(--nf-block); }
.nf-mini-dots i.is-skipped { background: transparent; border: 1px dashed var(--border-strong); }
.nf-mini small { font-size: 11.5px; color: var(--muted); white-space: normal; max-width: 220px; }
.nf-mini.is-stale small, .nf-mini.is-blocked small { color: var(--nf-block); font-weight: 600; }
@keyframes nf-blink { 50% { opacity: .45; } }
.badge-flow { background: #e6f6f4; color: #0f766e; }
[data-theme="dark"] .badge-flow { background: #0f2e2b; color: #5eead4; }
.tag-flow { display: inline-flex; align-items: center; gap: 4px; }
.ne-euonly [inert] { opacity: .6; }
@media (max-width: 820px) {
  .nf-track { flex-direction: column; align-items: stretch; overflow: visible; }
  .nf-fork, .nf-fork.multi { border: 0; padding: 0; gap: 0; }
  .nf-lane { flex-direction: column; align-items: stretch; }
  .nf-node { flex-direction: row; width: auto; text-align: left; gap: 12px; padding: 6px 8px; }
  .nf-txt { align-items: flex-start; }
  .nf-who { max-width: none; }
  /* En vertical, una sola línea detrás de los círculos */
  .nf-track { position: relative; }
  .nf-track::before { content: ''; position: absolute; left: 31px; top: 34px; bottom: 34px; width: 2px; background: var(--border); }
  .nf-link { display: none; }
  .nf-dot { z-index: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .nf-node.is-active .nf-dot, .nf-link.is-flow i, .nf-mini-dots i.is-active, .nf-panel, .nf-node.is-done .nf-dot svg { animation: none; }
  .nf-link i { transition: none; }
  .nf-pkt, .nf-conf { display: none; }
  .nf-ring-fg, .nf-node.is-stale .nf-ring-fg, .nf-link.just i, .nf-link.just.is-flow i, .nf-node.just-done .nf-dot, .nf-node.just-done .nf-dot::after, .nf-node.is-active.just-active .nf-dot { animation: none; }
  .nf-node.just-done .nf-dot svg * { stroke-dasharray: none; stroke-dashoffset: 0; animation: none; }
}
.nf-txt .lang-tag { display: inline-grid; height: 18px; padding: 0 5px; border-radius: 5px; }