:root {
    --bg: #07111f;
    --bg-soft: #0b182a;
    --panel: rgba(16, 34, 57, .86);
    --panel-2: rgba(20, 42, 69, .92);
    --line: rgba(255, 255, 255, .09);
    --text: #f3f7fd;
    --muted: #9fb0ca;
    --primary: #36a9e1;
    --primary-2: #1b7fb8;
    --success: #27c28a;
    --warning: #f2b84b;
    --danger: #f06a6a;
    --shadow: 0 22px 60px rgba(0, 0, 0, .28);
    --radius: 22px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--text);
    background:
        radial-gradient(circle at 12% 8%, rgba(54, 169, 225, .16), transparent 28%),
        radial-gradient(circle at 88% 18%, rgba(39, 194, 138, .10), transparent 26%),
        linear-gradient(180deg, #07111f 0%, #091626 100%);
    min-height: 100vh;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background-image: linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
    background-size: 32px 32px;
    mask-image: linear-gradient(to bottom, #000, transparent 80%);
}

.container { width: min(1440px, calc(100% - 40px)); margin: 0 auto; }
.topbar { position: sticky; top: 0; z-index: 20; backdrop-filter: blur(18px); background: rgba(7, 17, 31, .78); border-bottom: 1px solid var(--line); }
.topbar-inner { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.brand { display: flex; align-items: center; gap: 14px; }
.brand-mark { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; font-weight: 900; font-size: 20px; background: linear-gradient(135deg, var(--primary), #6fe0ff); color: #052033; box-shadow: 0 10px 30px rgba(54,169,225,.28); }
.brand strong { display: block; font-size: 14px; letter-spacing: .09em; }
.brand span { display: block; color: var(--muted); font-size: 12px; margin-top: 3px; }
.top-actions { display: flex; align-items: center; gap: 10px; }
.live-dot { color: var(--muted); font-size: 13px; display: inline-flex; align-items: center; gap: 8px; }
.live-dot i { width: 9px; height: 9px; background: var(--success); border-radius: 50%; box-shadow: 0 0 0 6px rgba(39,194,138,.12); }
.dashboard-shell, .admin-shell { padding: 32px 0 56px; }
.hero-panel { display: flex; justify-content: space-between; align-items: stretch; gap: 24px; padding: 34px; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(135deg, rgba(31,74,111,.85), rgba(13,30,50,.92)); box-shadow: var(--shadow); }
.hero-panel h1 { margin: 6px 0 10px; font-size: clamp(28px, 4vw, 48px); line-height: 1.06; max-width: 850px; }
.hero-panel p { color: var(--muted); margin: 0; max-width: 760px; line-height: 1.65; }
.compact-hero { align-items: center; }
.compact-hero h1 { font-size: clamp(28px, 3vw, 38px); }
.eyebrow { margin: 0; text-transform: uppercase; letter-spacing: .15em; font-size: 11px; color: #75d7ff !important; font-weight: 800; }
.last-update-card { min-width: 250px; border-radius: 18px; padding: 22px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.08); display: flex; flex-direction: column; justify-content: center; }
.last-update-card span { color: var(--muted); font-size: 13px; }
.last-update-card strong { font-size: 17px; margin-top: 8px; }
.kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin: 22px 0; }
.kpi-card { padding: 24px; border: 1px solid var(--line); border-radius: 18px; background: var(--panel); box-shadow: 0 14px 38px rgba(0,0,0,.14); }
.kpi-card span { display: block; color: var(--muted); font-size: 13px; }
.kpi-card strong { display: block; font-size: 36px; margin: 8px 0 3px; }
.kpi-card small { color: #7e91ac; }
.kpi-warning { border-color: rgba(242,184,75,.28); }
.kpi-warning strong { color: var(--warning); }
.kpi-danger { border-color: rgba(240,106,106,.28); }
.kpi-danger strong { color: var(--danger); }
.chart-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 22px; margin-bottom: 22px; }
.panel { border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); box-shadow: var(--shadow); }
.panel-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 24px 26px 12px; }
.panel-head h2, .import-panel h2 { margin: 6px 0 0; font-size: 21px; }
.chart-wrap { height: 330px; padding: 10px 22px 24px; }
.table-panel { overflow: hidden; }
.table-head { padding-bottom: 20px; }
.filters { display: grid; grid-template-columns: minmax(230px, 1.6fr) minmax(170px, 1fr) minmax(150px, .8fr); gap: 10px; width: min(100%, 760px); }
input, select, textarea {
    width: 100%;
    color: var(--text);
    background: rgba(4,14,26,.7);
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 12px;
    padding: 12px 14px;
    outline: none;
    font: inherit;
}
input:focus, select:focus, textarea:focus { border-color: rgba(54,169,225,.8); box-shadow: 0 0 0 4px rgba(54,169,225,.12); }
select option { background: #0b182a; color: #fff; }
.table-scroll { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; min-width: 980px; }
th, td { padding: 16px 18px; text-align: left; border-top: 1px solid var(--line); vertical-align: middle; }
th { color: #7f93af; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; background: rgba(255,255,255,.02); }
td { color: #d7e1f1; font-size: 13px; }
td small { display: block; color: #7f93af; margin-top: 4px; max-width: 350px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.number-cell { white-space: nowrap; }
.code-chip { display: inline-block; border-radius: 999px; padding: 6px 9px; background: rgba(54,169,225,.11); color: #7ed9ff; font-size: 11px; font-weight: 800; }
.status { display: inline-flex; align-items: center; border-radius: 999px; padding: 7px 10px; font-size: 11px; font-weight: 800; }
.status-normal { background: rgba(39,194,138,.13); color: #5ce3ad; }
.status-bajo { background: rgba(242,184,75,.14); color: #ffd076; }
.status-critico { background: rgba(240,106,106,.14); color: #ff9292; }
.status-agotado { background: rgba(111,125,149,.18); color: #bdc7d7; }
.table-footer { display: flex; justify-content: space-between; gap: 16px; padding: 16px 22px; color: #7f93af; font-size: 12px; border-top: 1px solid var(--line); }
.empty-state { text-align: center; color: var(--muted); padding: 34px; }
.error-text { color: #ff9696; }
.footer { color: #6f829f; font-size: 12px; padding: 0 0 34px; text-align: center; }
.btn { appearance: none; border: 0; border-radius: 12px; padding: 12px 16px; font: inherit; font-weight: 750; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; justify-content: center; gap: 8px; transition: transform .15s ease, opacity .15s ease, background .15s ease; }
.btn:hover { transform: translateY(-1px); }
.btn-primary { color: #042033; background: linear-gradient(135deg, #6ee2ff, var(--primary)); }
.btn-secondary { color: #fff; background: #1d6d97; }
.btn-ghost { color: #dce9f8; background: rgba(255,255,255,.06); border: 1px solid var(--line); }
.btn-danger-soft { color: #ffaaaa; background: rgba(240,106,106,.1); border: 1px solid rgba(240,106,106,.2); }
.btn-small { padding: 9px 12px; font-size: 12px; }
.import-panel { margin: 22px 0; padding: 24px 26px; display: flex; justify-content: space-between; gap: 20px; align-items: center; }
.import-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: flex-end; }
.import-form input[type="file"] { width: auto; max-width: 360px; }
.muted { color: var(--muted); line-height: 1.6; }
.action-group { display: flex; gap: 8px; }
.modal { border: 0; padding: 0; border-radius: 22px; background: transparent; color: var(--text); width: min(760px, calc(100% - 28px)); }
.modal::backdrop { background: rgba(1,7,14,.74); backdrop-filter: blur(6px); }
.modal-card { padding: 26px; background: #0c1b2e; border: 1px solid var(--line); border-radius: 22px; box-shadow: var(--shadow); }
.modal-head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; }
.modal-head h2 { margin: 6px 0 0; }
.icon-btn { border: 0; background: rgba(255,255,255,.06); color: #fff; width: 38px; height: 38px; border-radius: 12px; font-size: 24px; cursor: pointer; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 22px; }
.form-grid label, .form-stack label { color: #c7d4e6; font-size: 12px; font-weight: 700; }
.form-grid input, .form-grid textarea, .form-stack input { margin-top: 7px; }
.span-2 { grid-column: span 2; }
.modal-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 22px; }
.toast { position: fixed; right: 20px; bottom: 20px; z-index: 50; background: #173952; color: #dff6ff; border: 1px solid rgba(54,169,225,.3); padding: 14px 18px; border-radius: 14px; box-shadow: var(--shadow); opacity: 0; transform: translateY(12px); pointer-events: none; transition: .2s ease; }
.toast.show { opacity: 1; transform: translateY(0); }
.toast-error { background: #4b2028; border-color: rgba(240,106,106,.35); }
.auth-body { display: grid; place-items: center; padding: 24px; }
.auth-card { width: min(460px, 100%); padding: 34px; border-radius: 24px; background: rgba(12,27,46,.92); border: 1px solid var(--line); box-shadow: var(--shadow); }
.auth-card h1 { margin: 12px 0 8px; }
.auth-card .brand-mark { margin-bottom: 18px; }
.form-stack { display: grid; gap: 16px; margin-top: 22px; }
.text-link { color: #79d8ff; text-decoration: none; display: inline-block; margin-top: 20px; }
.alert { border-radius: 12px; padding: 12px 14px; margin: 18px 0; font-size: 13px; }
.alert-error { background: rgba(240,106,106,.12); color: #ffb2b2; border: 1px solid rgba(240,106,106,.25); }
.alert-success { background: rgba(39,194,138,.12); color: #8af1c7; border: 1px solid rgba(39,194,138,.25); }

@media (max-width: 1040px) {
    .kpi-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .chart-grid { grid-template-columns: 1fr; }
    .hero-panel { flex-direction: column; }
    .last-update-card { min-width: 0; }
    .filters { grid-template-columns: 1fr 1fr; }
    .filters input { grid-column: span 2; }
    .import-panel { align-items: flex-start; flex-direction: column; }
    .import-form { justify-content: flex-start; }
}

@media (max-width: 720px) {
    .container { width: min(100% - 24px, 1440px); }
    .topbar-inner { min-height: 68px; }
    .brand span, .live-dot { display: none; }
    .brand strong { font-size: 12px; }
    .top-actions { gap: 6px; }
    .dashboard-shell, .admin-shell { padding-top: 18px; }
    .hero-panel { padding: 24px; }
    .kpi-grid { grid-template-columns: 1fr; gap: 12px; }
    .panel-head, .table-head { align-items: stretch; flex-direction: column; }
    .filters { width: 100%; grid-template-columns: 1fr; }
    .filters input { grid-column: auto; }
    .table-footer { flex-direction: column; }
    .form-grid { grid-template-columns: 1fr; }
    .span-2 { grid-column: auto; }
    .modal-actions { flex-direction: column-reverse; }
    .modal-actions .btn { width: 100%; }
    .import-form { width: 100%; flex-direction: column; align-items: stretch; }
    .import-form input[type="file"] { width: 100%; max-width: none; }
}

/* ===== Versión 2: stock + analítica de consumo ===== */
.last-update-card small { color: #7890ad; margin-top: 8px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin: 34px 4px 16px; }
.section-heading h2 { margin: 6px 0 0; font-size: clamp(22px, 3vw, 30px); }
.section-heading > p { margin: 0; max-width: 520px; color: var(--muted); line-height: 1.55; text-align: right; }
.mini-kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: -4px 0 22px; }
.mini-kpi { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 16px 18px; border: 1px solid var(--line); border-radius: 16px; background: rgba(11, 29, 49, .78); }
.mini-kpi span { color: var(--muted); font-size: 12px; line-height: 1.4; }
.mini-kpi strong { font-size: 24px; color: #a9e8ff; }
.stock-chart-grid { grid-template-columns: .85fr 1.15fr; }
.wide-table { min-width: 1260px; }
.movement-table { min-width: 1450px; }
.admin-products-table { min-width: 1450px; }
.admin-movements-table { min-width: 1550px; }
.analytics-title { margin-top: 42px; }
.analytics-controls { padding: 22px 24px; margin-bottom: 22px; }
.quick-periods { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 18px; }
.period-btn { border: 1px solid var(--line); border-radius: 999px; padding: 9px 15px; color: #cbd8e9; background: rgba(255,255,255,.04); cursor: pointer; font: inherit; font-size: 12px; font-weight: 750; }
.period-btn:hover, .period-btn.active { color: #062033; border-color: transparent; background: linear-gradient(135deg, #7ce7ff, var(--primary)); }
.analytics-filter-grid { display: grid; grid-template-columns: repeat(6, minmax(120px, 1fr)); gap: 12px; align-items: end; }
.analytics-filter-grid label { color: #becce0; font-size: 11px; font-weight: 800; }
.analytics-filter-grid input, .analytics-filter-grid select { margin-top: 7px; }
.analytics-filter-grid .filter-wide { grid-column: span 3; }
.analytics-summary { display: flex; justify-content: space-between; gap: 18px; margin-top: 16px; padding-top: 15px; border-top: 1px solid var(--line); color: #8ea2bd; font-size: 12px; }
.analytics-chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; margin-bottom: 22px; }
.chart-panel-wide { grid-column: span 2; }
.chart-large { height: 400px; }
.movements-panel { margin-top: 22px; }
.import-panel-v2 { align-items: flex-start; }
.import-copy { max-width: 780px; }
.help-text { color: #8094af; font-size: 12px; line-height: 1.55; margin-bottom: 0; }
.help-text code { color: #87dcff; background: rgba(54,169,225,.1); padding: 2px 6px; border-radius: 6px; }
.notice-card { margin: 0 0 22px; padding: 18px 20px; border-radius: 16px; border: 1px solid rgba(54,169,225,.2); background: rgba(54,169,225,.07); }
.notice-card strong { color: #91e2ff; }
.notice-card p { color: var(--muted); margin: 7px 0 0; line-height: 1.6; font-size: 13px; }
.admin-search { width: min(100%, 430px); }
.admin-movements-panel { margin-top: 22px; }
.btn:disabled { opacity: .6; cursor: wait; transform: none; }

@media (max-width: 1180px) {
    .analytics-filter-grid { grid-template-columns: repeat(3, minmax(150px, 1fr)); }
    .analytics-filter-grid .filter-wide { grid-column: span 3; }
}

@media (max-width: 1040px) {
    .mini-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .analytics-chart-grid { grid-template-columns: 1fr; }
    .chart-panel-wide { grid-column: auto; }
    .section-heading { align-items: flex-start; flex-direction: column; }
    .section-heading > p { text-align: left; }
}

@media (max-width: 720px) {
    .mini-kpi-grid { grid-template-columns: 1fr; }
    .analytics-filter-grid { grid-template-columns: 1fr; }
    .analytics-filter-grid .filter-wide { grid-column: auto; }
    .analytics-summary { flex-direction: column; }
    .quick-periods { display: grid; grid-template-columns: repeat(3, 1fr); }
    .period-btn { padding-inline: 8px; }
    .chart-large { height: 330px; }
    .section-heading { margin-top: 28px; }
}

/* ===== Versión 3: entradas, edición de movimientos y limpieza protegida ===== */
.hero-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; max-width: 620px; }
.btn-success { color: #05271b; background: linear-gradient(135deg, #74efbe, var(--success)); }
.btn-danger { color: #fff; background: linear-gradient(135deg, #f47f7f, #c74352); }
.movement-value { display: inline-flex; min-width: 66px; justify-content: flex-end; font-weight: 800; }
.movement-entry { color: #6de1ad; }
.movement-output { color: #ffb078; }
.movement-panel-head { align-items: flex-end; padding-bottom: 20px; }
.movement-admin-filters { width: min(100%, 850px); display: grid; grid-template-columns: minmax(230px, 1.7fr) minmax(160px, 1fr) minmax(145px, .8fr) minmax(145px, .8fr); gap: 10px; }
.selection-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 18px; border-top: 1px solid var(--line); background: rgba(255,255,255,.025); color: #91a4be; font-size: 12px; }
.selection-toolbar > div { display: flex; flex-wrap: wrap; gap: 8px; }
.row-check { width: 18px !important; height: 18px; margin: 0; padding: 0; accent-color: var(--primary); cursor: pointer; }
.movement-row-entrada { background: rgba(39,194,138,.025); }
.movement-row-salida { background: rgba(242,184,75,.018); }
.movement-badge { display: inline-flex; align-items: center; border-radius: 999px; padding: 7px 10px; font-size: 11px; font-weight: 850; }
.movement-badge-entrada { color: #72e7b6; background: rgba(39,194,138,.13); border: 1px solid rgba(39,194,138,.18); }
.movement-badge-salida { color: #ffc182; background: rgba(242,153,75,.12); border: 1px solid rgba(242,153,75,.18); }
.movement-product-preview { display: flex; flex-direction: column; gap: 5px; margin-top: 18px; padding: 14px 16px; border-radius: 14px; border: 1px solid rgba(54,169,225,.18); background: rgba(54,169,225,.07); color: #93a8c3; font-size: 12px; line-height: 1.5; }
.movement-product-preview strong { color: #8ce2ff; }
.modal-narrow { width: min(620px, calc(100% - 28px)); }
.danger-card { border-color: rgba(240,106,106,.28); }
.danger-eyebrow { color: #ff9292 !important; }
.form-stack select, .form-stack textarea { margin-top: 7px; }
.clean-summary { display: flex; flex-direction: column; gap: 5px; padding: 15px 16px; border-radius: 14px; background: rgba(240,106,106,.08); border: 1px solid rgba(240,106,106,.18); color: #9fb0ca; font-size: 12px; line-height: 1.5; }
.clean-summary strong { color: #ffaaaa; font-size: 16px; }
.cumulative-title { margin-top: 36px; }
.cumulative-grid { margin: 0 0 22px; }
.admin-products-table { min-width: 1650px; }
.admin-movements-table { min-width: 1900px; }

@media (max-width: 1180px) {
    .movement-panel-head { align-items: stretch; flex-direction: column; }
    .movement-admin-filters { width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hero-actions { justify-content: flex-start; max-width: none; }
}

@media (max-width: 720px) {
    .hero-actions { width: 100%; display: grid; grid-template-columns: 1fr; }
    .movement-admin-filters { grid-template-columns: 1fr; }
    .selection-toolbar { align-items: stretch; flex-direction: column; }
    .selection-toolbar > div { display: grid; grid-template-columns: 1fr; }
    .selection-toolbar .btn { width: 100%; }
}

/* ===== Versión 4: navegación modular e importación masiva de productos ===== */
.module-nav-wrap {
    position: sticky;
    top: 76px;
    z-index: 19;
    border-bottom: 1px solid var(--line);
    background: rgba(8, 21, 36, .88);
    backdrop-filter: blur(18px);
}
.module-nav {
    min-height: 64px;
    display: flex;
    align-items: center;
    gap: 9px;
    overflow-x: auto;
    scrollbar-width: thin;
    padding-top: 9px;
    padding-bottom: 9px;
}
.module-nav-btn {
    flex: 0 0 auto;
    appearance: none;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 13px;
    padding: 11px 15px;
    color: #b9c8dc;
    background: rgba(255,255,255,.035);
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: .18s ease;
    white-space: nowrap;
}
.module-nav-btn span { color: #71d8ff; font-size: 15px; }
.module-nav-btn:hover { color: #fff; background: rgba(54,169,225,.10); border-color: rgba(54,169,225,.28); transform: translateY(-1px); }
.module-nav-btn.active { color: #062033; border-color: transparent; background: linear-gradient(135deg, #7ce7ff, var(--primary)); box-shadow: 0 9px 25px rgba(54,169,225,.18); }
.module-nav-btn.active span { color: #062033; }
.module-nav-link { margin-left: auto; }
.admin-module-nav .module-nav-link:first-of-type { margin-left: auto; }
.public-view, .admin-view { animation: moduleFade .22s ease; }
.public-view[hidden], .admin-view[hidden] { display: none !important; }
@keyframes moduleFade { from { opacity: .3; transform: translateY(7px); } to { opacity: 1; transform: none; } }
.module-hero { margin-bottom: 22px; }
.module-hero h1 { font-size: clamp(27px, 3.2vw, 42px); }
.compact-alert-table { margin-top: 22px; }
.critical-table { min-width: 960px; }
.output-filter-panel { padding: 22px 24px; margin-bottom: 22px; }
.output-filter-grid { grid-template-columns: repeat(5, minmax(130px, 1fr)); }
.output-filter-grid .filter-wide { grid-column: span 3; }
.import-cards-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; margin-bottom: 22px; }
.import-card { padding: 26px; display: flex; flex-direction: column; justify-content: space-between; gap: 22px; min-height: 420px; }
.import-card h2 { margin: 7px 0 10px; }
.import-form-vertical { width: 100%; display: grid; grid-template-columns: 1fr; align-items: stretch; justify-content: stretch; }
.import-form-vertical input[type="file"] { width: 100%; max-width: none; }
.import-form-vertical .btn { width: 100%; }
.import-warning { margin-top: 0; }
.import-warning strong { color: #ffd17d; }
.cleanup-options-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-bottom: 22px; }
.cleanup-option { padding: 24px; display: flex; align-items: flex-start; gap: 16px; }
.cleanup-option .option-number { flex: 0 0 40px; width: 40px; height: 40px; border-radius: 13px; display: grid; place-items: center; font-weight: 900; color: #082036; background: linear-gradient(135deg, #7ce7ff, var(--primary)); }
.cleanup-option h2 { margin: 1px 0 8px; font-size: 19px; }
.cleanup-option p { min-height: 66px; margin: 0 0 16px; color: var(--muted); line-height: 1.55; font-size: 13px; }
.danger-hero { border-color: rgba(240,106,106,.25); background: linear-gradient(135deg, rgba(93,37,48,.74), rgba(13,30,50,.92)); }
.danger-notice { border-color: rgba(240,106,106,.22); background: rgba(240,106,106,.07); }
.danger-notice strong { color: #ffaaaa; }
.danger-notice code { color: #ffd0d0; }

@media (max-width: 1180px) {
    .admin-module-nav .module-nav-link:first-of-type, .module-nav-link { margin-left: 0; }
    .output-filter-grid { grid-template-columns: repeat(3, minmax(140px, 1fr)); }
    .output-filter-grid .filter-wide { grid-column: span 3; }
    .cleanup-options-grid { grid-template-columns: 1fr; }
    .cleanup-option p { min-height: 0; }
}

@media (max-width: 900px) {
    .import-cards-grid { grid-template-columns: 1fr; }
    .import-card { min-height: 0; }
}

@media (max-width: 720px) {
    .module-nav-wrap { top: 68px; }
    .module-nav { min-height: 58px; }
    .module-nav-btn { padding: 10px 12px; }
    .output-filter-grid { grid-template-columns: 1fr; }
    .output-filter-grid .filter-wide { grid-column: auto; }
    .cleanup-option { flex-direction: column; }
}


/* ===== Versión 4.2: acciones siempre visibles y depuración visual ===== */
.admin-products-table {
    min-width: 1540px;
}
.admin-products-table th:last-child,
.admin-products-table td.sticky-actions-cell {
    position: sticky;
    right: 0;
    min-width: 184px;
    width: 184px;
    z-index: 4;
    background: #10233b;
    box-shadow: -14px 0 22px rgba(2, 9, 17, .34);
}
.admin-products-table th:last-child {
    z-index: 6;
    background: #132a45;
}
.admin-products-table tbody tr:hover td.sticky-actions-cell {
    background: #17314e;
}
.product-actions {
    flex-wrap: nowrap;
    justify-content: flex-start;
}
.btn-edit-product {
    color: #052033;
    min-width: 88px;
}
.inventory-below-traceability {
    scroll-margin-top: 160px;
}

@media (max-width: 720px) {
    .admin-products-table th:last-child,
    .admin-products-table td.sticky-actions-cell {
        min-width: 150px;
        width: 150px;
    }
    .product-actions {
        gap: 6px;
    }
    .product-actions .btn {
        padding: 8px 9px;
        font-size: 11px;
    }
}

/* ===== Versión 4.3: selección de productos y paginación ===== */
.pagination-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 18px 18px;
    border-top: 1px solid var(--line);
    background: rgba(4, 14, 26, .22);
    color: #8fa2bc;
    font-size: 12px;
}
.pagination-bar label,
.pagination-controls {
    display: flex;
    align-items: center;
    gap: 10px;
}
.pagination-bar select {
    width: auto;
    min-width: 76px;
    padding: 8px 30px 8px 10px;
    border-radius: 10px;
}
.pagination-controls span {
    min-width: 145px;
    text-align: center;
    color: #b9c8dc;
    font-weight: 750;
}
.pagination-controls .btn:disabled,
.selection-toolbar .btn:disabled {
    opacity: .42;
    cursor: not-allowed;
    transform: none;
}
.admin-products-table {
    min-width: 1600px;
}
.admin-products-table th:first-child,
.admin-products-table td.sticky-check-cell {
    position: sticky;
    left: 0;
    width: 52px;
    min-width: 52px;
    z-index: 4;
    text-align: center;
    background: #10233b;
    box-shadow: 10px 0 18px rgba(2, 9, 17, .20);
}
.admin-products-table th:first-child {
    z-index: 7;
    background: #132a45;
}
.admin-products-table tbody tr:hover td.sticky-check-cell {
    background: #17314e;
}

@media (max-width: 720px) {
    .pagination-bar {
        align-items: stretch;
        flex-direction: column;
    }
    .pagination-bar label {
        justify-content: space-between;
    }
    .pagination-controls {
        display: grid;
        grid-template-columns: 1fr;
    }
    .pagination-controls span {
        min-width: 0;
        order: -1;
        padding: 4px 0;
    }
    .pagination-controls .btn {
        width: 100%;
    }
}

/* ===== Versión 5.0: dashboard analítico inspirado en la propuesta visual ===== */
.analysis-filter-panel {
    margin-bottom: 22px;
    padding: 24px 26px;
    background: linear-gradient(145deg, rgba(13, 35, 59, .96), rgba(9, 24, 42, .92));
    border-color: rgba(54,169,225,.20);
}
.analysis-filter-panel[hidden] { display: none !important; }
.filter-panel-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 22px; margin-bottom: 18px; }
.filter-panel-heading h2 { margin: 6px 0 5px; font-size: 23px; }
.filter-panel-heading p:last-child { margin: 0; color: var(--muted); font-size: 13px; }
.filter-actions { display: flex; gap: 9px; }
.analysis-quick-periods { margin-bottom: 15px; }
.analysis-global-grid { display: grid; grid-template-columns: repeat(7, minmax(125px, 1fr)); gap: 12px; align-items: end; }
.analysis-global-grid label { color: #becce0; font-size: 11px; font-weight: 800; }
.analysis-global-grid input, .analysis-global-grid select { margin-top: 7px; }
.analysis-global-grid .filter-product { grid-column: span 2; }
.analysis-global-grid .filter-search { grid-column: span 3; }
.active-filter-summary { display: flex; justify-content: space-between; gap: 20px; margin-top: 17px; padding-top: 15px; border-top: 1px solid var(--line); color: #8fa5c0; font-size: 12px; }
.dashboard-hero-v5 { padding: 28px 30px; align-items: center; background: linear-gradient(135deg, rgba(15,55,91,.92), rgba(7,26,48,.96)); }
.dashboard-hero-v5 h1 { font-size: clamp(30px, 3.5vw, 46px); }
.dashboard-meta-strip { min-width: 460px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.dashboard-meta-strip article { padding: 15px 16px; border-radius: 15px; background: rgba(3,15,28,.52); border: 1px solid rgba(255,255,255,.09); }
.dashboard-meta-strip span { display: block; color: #7f93af; font-size: 10px; text-transform: uppercase; letter-spacing: .09em; }
.dashboard-meta-strip strong { display: block; margin-top: 7px; font-size: 12px; line-height: 1.35; }
.executive-kpi-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 13px; margin: 18px 0; }
.executive-kpi { min-height: 120px; display: flex; align-items: center; gap: 14px; padding: 18px; border-radius: 17px; border: 1px solid var(--line); background: linear-gradient(145deg, rgba(16,39,65,.96), rgba(9,25,44,.94)); box-shadow: 0 16px 36px rgba(0,0,0,.16); }
.executive-kpi .kpi-icon { flex: 0 0 40px; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 13px; background: rgba(54,169,225,.13); color: #79dcff; font-size: 20px; }
.executive-kpi span { display: block; color: #c3d1e4; font-size: 12px; }
.executive-kpi strong { display: block; margin: 5px 0 1px; font-size: 27px; line-height: 1; }
.executive-kpi small { color: #788da8; font-size: 10px; }
.executive-kpi.danger { border-color: rgba(240,106,106,.25); }
.executive-kpi.danger .kpi-icon, .executive-kpi.danger strong { color: #ff8585; background: rgba(240,106,106,.11); }
.executive-kpi.warning { border-color: rgba(242,184,75,.25); }
.executive-kpi.warning .kpi-icon, .executive-kpi.warning strong { color: #ffd06e; background: rgba(242,184,75,.10); }
.executive-chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-bottom: 18px; }
.analytics-card { overflow: hidden; background: linear-gradient(145deg, rgba(17,39,65,.96), rgba(10,27,47,.94)); }
.analytics-card .panel-head { padding: 20px 22px 8px; }
.analytics-card .panel-head h2 { font-size: 17px; }
.executive-chart { height: 315px; padding: 8px 18px 18px; }
.forecast-layout { position: relative; }
.forecast-panel .executive-chart { padding-right: 170px; }
.forecast-alert { position: absolute; right: 18px; top: 24px; width: 145px; min-height: 190px; padding: 18px 15px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; border-radius: 18px; border: 1px solid rgba(240,106,106,.45); background: linear-gradient(160deg, rgba(105,31,43,.88), rgba(30,22,39,.95)); box-shadow: 0 0 28px rgba(240,106,106,.16); }
.forecast-alert span { color: #ffb3b3; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.forecast-alert strong { color: #ff7777; margin: 12px 0 8px; font-size: 32px; line-height: 1; }
.forecast-alert small { color: #d9c8d0; line-height: 1.45; font-size: 10px; }
.forecast-risk-panel { margin-bottom: 18px; }
.risk-table { min-width: 1160px; }
.coverage-danger { color: #ff8181; }
.coverage-warning { color: #ffd073; }
.coverage-normal { color: #6de1ad; }
.analytics-hero-v5 { background: linear-gradient(135deg, rgba(35,41,91,.82), rgba(9,27,48,.95)); }
.advanced-analytics-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.analytics-span-2 { grid-column: span 2; }
.advanced-chart { height: 345px; padding: 8px 20px 20px; }
.destination-chart { height: 390px; padding: 8px 20px 22px; }
.no-movement-panel { padding-bottom: 20px; }
.no-movement-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding: 15px 20px 10px; }
.no-movement-grid article { min-height: 125px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; border-radius: 16px; border: 1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.035); }
.no-movement-grid article:nth-child(1) { border-color: rgba(39,194,138,.35); background: rgba(39,194,138,.08); }
.no-movement-grid article:nth-child(2) { border-color: rgba(242,184,75,.35); background: rgba(242,184,75,.08); }
.no-movement-grid article:nth-child(3) { border-color: rgba(255,159,67,.38); background: rgba(255,159,67,.08); }
.no-movement-grid article:nth-child(4) { border-color: rgba(240,106,106,.38); background: rgba(240,106,106,.08); }
.no-movement-grid span { color: #b8c7da; font-size: 11px; }
.no-movement-grid strong { margin: 8px 0 2px; font-size: 32px; }
.no-movement-grid small { color: #7e92ad; }
.panel-note { margin: 10px 20px 0; color: #7f93af; font-size: 11px; line-height: 1.5; }
.comparison-table-wrap { overflow-x: auto; padding: 8px 20px 22px; }
.comparison-table { min-width: 760px; }
.comparison-table th, .comparison-table td { padding: 14px 16px; }
.comparison-table td small { display: inline; margin-left: 4px; }
.variation-positive { color: #62dfa9; font-weight: 800; }
.variation-negative { color: #ff8b8b; font-weight: 800; }
.variation-neutral { color: #a6b5c8; font-weight: 800; }
.abc-layout { display: grid; grid-template-columns: 1fr 180px; align-items: center; min-height: 360px; }
.abc-layout .chart-wrap { height: 330px; }
.abc-legend { display: grid; gap: 10px; padding: 10px 18px 20px 0; }
.abc-legend article { padding: 13px; border-radius: 13px; border: 1px solid var(--line); background: rgba(255,255,255,.035); }
.abc-legend strong { display: inline-grid; place-items: center; width: 28px; height: 28px; margin-right: 8px; border-radius: 8px; }
.abc-legend span { color: #d4dfed; font-size: 12px; font-weight: 700; }
.abc-legend small { display: block; margin: 6px 0 0 36px; color: #8194ae; }
.abc-a strong { background: #2587ff; }.abc-b strong { background: #f2b84b; color: #152238; }.abc-c strong { background: #9b8cff; }
.anomaly-panel .table-scroll { max-height: 360px; }
.anomaly-table { min-width: 620px; }
.anomaly-table td small { max-width: 260px; }

@media (min-width: 1680px) {
    .container { width: min(1640px, calc(100% - 48px)); }
    .executive-chart-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .executive-chart { height: 300px; }
    .forecast-panel .executive-chart { padding-right: 145px; }
    .forecast-alert { width: 126px; }
}

@media (max-width: 1280px) {
    .analysis-global-grid { grid-template-columns: repeat(4, minmax(140px, 1fr)); }
    .analysis-global-grid .filter-product { grid-column: span 2; }
    .analysis-global-grid .filter-search { grid-column: span 2; }
    .executive-kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .dashboard-meta-strip { min-width: 400px; }
}

@media (max-width: 980px) {
    .filter-panel-heading { align-items: stretch; flex-direction: column; }
    .filter-actions { justify-content: flex-start; }
    .analysis-global-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .analysis-global-grid .filter-product, .analysis-global-grid .filter-search { grid-column: span 2; }
    .dashboard-meta-strip { min-width: 0; width: 100%; }
    .executive-chart-grid, .advanced-analytics-grid { grid-template-columns: 1fr; }
    .analytics-span-2 { grid-column: auto; }
    .forecast-panel .executive-chart { padding-right: 18px; padding-bottom: 170px; height: 450px; }
    .forecast-alert { top: auto; bottom: 18px; left: 18px; right: 18px; width: auto; min-height: 130px; }
    .abc-layout { grid-template-columns: 1fr; }
    .abc-legend { grid-template-columns: repeat(3, 1fr); padding: 0 18px 20px; }
}

@media (max-width: 720px) {
    .analysis-filter-panel { padding: 20px; }
    .filter-actions { display: grid; grid-template-columns: 1fr; }
    .analysis-global-grid { grid-template-columns: 1fr; }
    .analysis-global-grid .filter-product, .analysis-global-grid .filter-search { grid-column: auto; }
    .active-filter-summary { flex-direction: column; }
    .dashboard-meta-strip { grid-template-columns: 1fr; }
    .executive-kpi-grid { grid-template-columns: 1fr; }
    .executive-kpi { min-height: 100px; }
    .no-movement-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .abc-legend { grid-template-columns: 1fr; }
}

/* REMAN 5.1: separación de maestro, entradas y salidas */
.inline-import-panel {
    margin-bottom: 22px;
    padding: 24px;
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(320px, .9fr);
    gap: 24px;
    align-items: center;
    border-color: rgba(83, 208, 255, .24);
    background: linear-gradient(135deg, rgba(22, 63, 99, .64), rgba(8, 26, 47, .92));
}
.inline-import-copy h2 { margin: 6px 0 10px; }
.inline-import-copy p { margin: 6px 0; color: var(--muted); line-height: 1.65; }
.compact-import-form { display: grid; gap: 10px; }
.compact-import-form input[type="file"] { width: 100%; }
.output-import-panel { border-color: rgba(72, 204, 164, .24); }
.master-notice { border-color: rgba(116, 221, 255, .22); }
.movement-admin-filters-simple { grid-template-columns: minmax(260px, 1.7fr) minmax(145px, .8fr) minmax(145px, .8fr); }

@media (max-width: 900px) {
    .inline-import-panel { grid-template-columns: 1fr; }
    .movement-admin-filters-simple { grid-template-columns: 1fr 1fr; }
    .movement-admin-filters-simple input:first-child { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
    .inline-import-panel { padding: 18px; }
    .movement-admin-filters-simple { grid-template-columns: 1fr; }
    .movement-admin-filters-simple input:first-child { grid-column: auto; }
}

/* ===== REMAN V6.1 · portada modular, menú lateral y Personal relacional ===== */
.app-layout {
    width: min(1760px, calc(100% - 28px));
    margin: 18px auto 36px;
    display: grid;
    grid-template-columns: 270px minmax(0, 1fr);
    gap: 20px;
    align-items: start;
}
.app-content.container { width: 100%; max-width: none; margin: 0; }
.app-sidebar {
    position: sticky;
    top: 94px;
    min-height: calc(100vh - 120px);
    padding: 18px 14px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 20px;
    background: linear-gradient(165deg, rgba(13,35,59,.98), rgba(7,21,38,.98));
    box-shadow: 0 20px 46px rgba(0,0,0,.22);
    overflow: hidden;
}
.sidebar-title { padding: 7px 10px 17px; border-bottom: 1px solid rgba(255,255,255,.08); margin-bottom: 12px; }
.sidebar-title span { display:block; color:#6f86a2; font-size:10px; letter-spacing:.16em; font-weight:900; }
.sidebar-title strong { display:block; margin-top:4px; font-size:22px; letter-spacing:.04em; }
.sidebar-link,
.sidebar-submenu button,
.sidebar-submenu a {
    width: 100%;
    border: 0;
    text-align: left;
    font: inherit;
    color: #b9c8dc;
    background: transparent;
    cursor: pointer;
    text-decoration: none;
    border-radius: 11px;
    transition: .18s ease;
}
.sidebar-link { display:flex; gap:10px; align-items:center; padding:11px 12px; font-size:13px; font-weight:850; }
.sidebar-link span { color:#74dfff; font-size:16px; }
.sidebar-link:hover, .sidebar-link.active, .sidebar-submenu button:hover, .sidebar-submenu button.active, .sidebar-submenu a:hover { background:rgba(54,169,225,.13); color:#fff; }
.sidebar-group { margin-top: 8px; }
.sidebar-group summary { list-style:none; display:flex; align-items:center; gap:10px; padding:11px 12px; color:#e4edf9; border-radius:11px; cursor:pointer; font-size:13px; font-weight:900; }
.sidebar-group summary::-webkit-details-marker { display:none; }
.sidebar-group summary::after { content:'▾'; margin-left:auto; color:#6f86a2; transition:.18s ease; }
.sidebar-group:not([open]) summary::after { transform: rotate(-90deg); }
.sidebar-group summary span { color:#74dfff; font-size:15px; }
.sidebar-submenu { display:grid; gap:3px; padding:3px 0 4px 31px; }
.sidebar-submenu button, .sidebar-submenu a { display:block; padding:9px 10px; font-size:12px; font-weight:750; }
.sidebar-footer { margin-top: 18px; padding-top: 14px; border-top:1px solid rgba(255,255,255,.08); }
.sidebar-footer .btn { width:100%; justify-content:center; }

.welcome-hero {
    min-height: 245px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:28px;
    padding:34px;
    margin-bottom:20px;
    border-radius:24px;
    border:1px solid rgba(54,169,225,.20);
    background:
        radial-gradient(circle at 88% 20%, rgba(83,208,255,.16), transparent 30%),
        linear-gradient(135deg, rgba(17,52,84,.94), rgba(7,24,43,.97));
    box-shadow:0 22px 52px rgba(0,0,0,.19);
}
.welcome-hero h1 { margin:7px 0 12px; font-size:clamp(32px,4vw,52px); line-height:1.06; }
.welcome-hero p:last-child { max-width:800px; margin:0; color:#9fb1c8; line-height:1.7; }
.welcome-badge { flex:0 0 150px; width:150px; height:150px; display:grid; place-items:center; border-radius:38px; color:#eaf8ff; background:linear-gradient(145deg, rgba(58,171,224,.26), rgba(30,78,121,.26)); border:1px solid rgba(116,223,255,.28); font-size:25px; font-weight:950; box-shadow:inset 0 0 36px rgba(86,201,255,.10), 0 18px 40px rgba(0,0,0,.18); }
.welcome-badge span { display:block; color:#72dcff; font-size:13px; margin-top:-40px; }
.module-presentation-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-bottom:20px; }
.module-presentation-card { min-height:250px; display:flex; flex-direction:column; gap:15px; padding:26px; border-radius:20px; border:1px solid rgba(255,255,255,.09); background:linear-gradient(150deg,rgba(17,39,65,.97),rgba(9,25,44,.95)); box-shadow:0 18px 42px rgba(0,0,0,.16); }
.module-presentation-card .module-card-icon { width:48px; height:48px; border-radius:15px; display:grid; place-items:center; color:#7ce7ff; background:rgba(54,169,225,.12); font-size:23px; }
.module-presentation-card h2 { margin:6px 0 8px; font-size:21px; }
.module-presentation-card p:not(.eyebrow) { margin:0; color:#8fa4bf; line-height:1.65; font-size:13px; }
.module-presentation-card .btn { margin-top:auto; align-self:flex-start; }
.restricted-card { border-color:rgba(155,140,255,.22); }
.home-kpi-grid, .personnel-summary-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; margin-bottom:20px; }
.home-kpi-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.home-kpi-grid article, .personnel-summary-grid article { padding:18px 20px; border-radius:16px; border:1px solid rgba(255,255,255,.08); background:rgba(16,39,65,.88); }
.home-kpi-grid span, .personnel-summary-grid span { display:block; color:#8499b4; font-size:11px; text-transform:uppercase; letter-spacing:.07em; }
.home-kpi-grid strong, .personnel-summary-grid strong { display:block; margin-top:7px; font-size:28px; }

.relational-personnel-table { min-width: 1500px; }
.relational-personnel-table th:last-child, .relational-personnel-table td.sticky-actions-cell { position:sticky; right:0; z-index:4; min-width:190px; background:#10233b; box-shadow:-12px 0 20px rgba(2,9,17,.28); }
.relational-personnel-table th:last-child { z-index:6; background:#132a45; }
.personnel-filters { display:grid; grid-template-columns:160px 160px 200px minmax(280px,1fr); gap:9px; align-items:center; }
.personnel-status-activo { color:#6de1ad !important; background:rgba(39,194,138,.12) !important; border-color:rgba(39,194,138,.23) !important; }
.personnel-status-cesado { color:#ff9292 !important; background:rgba(240,106,106,.11) !important; border-color:rgba(240,106,106,.22) !important; }
.type-chip { display:inline-flex; align-items:center; padding:5px 9px; border-radius:999px; font-size:10px; font-weight:900; letter-spacing:.05em; }
.type-staff { color:#7ce7ff; background:rgba(54,169,225,.12); }
.type-obrero { color:#ffd27a; background:rgba(242,184,75,.12); }
.form-section-title { margin:19px 0 11px; padding-bottom:8px; border-bottom:1px solid rgba(255,255,255,.08); color:#79dcff; font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.10em; }
.form-grid-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.modal-card-wide { width:min(1000px,calc(100vw - 32px)); }
.status-help { margin-top:12px; padding:11px 13px; border-radius:12px; color:#9fb1c8; background:rgba(54,169,225,.07); border:1px solid rgba(54,169,225,.15); font-size:12px; }
.history-person-summary { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:14px; padding:13px 15px; border-radius:13px; background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.07); }
.history-person-summary span, .history-person-summary strong { padding-right:12px; border-right:1px solid rgba(255,255,255,.08); }
.history-table, .catalog-table { min-width:900px; }
.catalog-table td, .catalog-table th, .history-table td, .history-table th { vertical-align:middle; }

@media (max-width: 1180px) {
    .app-layout { grid-template-columns:230px minmax(0,1fr); width:min(100% - 18px, 1600px); gap:14px; }
    .personnel-filters { grid-template-columns:1fr 1fr; }
    .personnel-filters input { grid-column:1 / -1; }
    .home-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .personnel-summary-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width: 860px) {
    .app-layout { display:block; width:calc(100% - 16px); margin-top:10px; }
    .app-sidebar { position:relative; top:auto; min-height:0; margin-bottom:14px; padding:12px; }
    .sidebar-title { display:none; }
    .sidebar-link { width:auto; display:inline-flex; margin-right:5px; }
    .sidebar-group { display:inline-block; vertical-align:top; min-width:190px; margin:0 5px 6px 0; }
    .sidebar-submenu { padding-left:8px; }
    .welcome-hero { min-height:0; padding:25px; }
    .welcome-badge { display:none; }
    .module-presentation-grid { grid-template-columns:1fr; }
    .personnel-filters { grid-template-columns:1fr; }
    .personnel-filters input { grid-column:auto; }
    .form-grid-3 { grid-template-columns:1fr 1fr; }
}
@media (max-width: 620px) {
    .app-layout { width:calc(100% - 10px); }
    .app-sidebar { border-radius:14px; }
    .sidebar-group { display:block; min-width:0; width:100%; }
    .welcome-hero { padding:21px; border-radius:18px; }
    .welcome-hero h1 { font-size:30px; }
    .home-kpi-grid, .personnel-summary-grid { grid-template-columns:1fr 1fr; }
    .form-grid-3 { grid-template-columns:1fr; }
    .module-presentation-card { min-height:0; padding:21px; }
}

/* REMAN 6.2 · Personal único con condición STAFF/OBRERO */
.personnel-type-selector{display:grid;grid-template-columns:minmax(240px,340px) 1fr;gap:14px;align-items:end;margin:4px 0 18px;padding:15px;border:1px solid rgba(86,201,242,.2);border-radius:16px;background:rgba(45,159,203,.06)}
.personnel-type-selector label{display:grid;gap:7px;font-size:11px;font-weight:900;letter-spacing:.07em;color:#a8bdd5}
.type-guide{min-height:48px;display:flex;align-items:center;padding:11px 13px;border-radius:12px;background:rgba(255,255,255,.035);border:1px dashed rgba(255,255,255,.11);color:#8ea4bf;font-size:12px;line-height:1.5}
.type-guide.is-active{color:#bfeeff;border-style:solid;border-color:rgba(74,201,244,.25);background:rgba(47,185,233,.08)}
.conditional-fieldset{margin:18px 0 0;padding:16px;border:1px solid rgba(255,255,255,.09);border-radius:16px;background:rgba(255,255,255,.02)}
.conditional-fieldset legend{padding:0 9px;color:#79dcff;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.09em}
.conditional-fieldset:disabled{opacity:.48;filter:saturate(.55)}
.conditional-change-date{padding:12px;border-radius:12px;background:rgba(255,190,80,.07);border:1px solid rgba(255,190,80,.18)}
.conditional-change-date small,.field-notice{display:block;margin-top:5px;color:#849bb7;font-size:10px;line-height:1.4}
.field-notice.error{color:#ff9b9b;font-weight:700}
.history-block-title{display:flex;align-items:end;justify-content:space-between;gap:12px;margin:18px 0 8px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.08)}
.history-block-title strong{color:#dcecff;font-size:14px}
.history-block-title span{color:#8096b1;font-size:11px;text-align:right}
.scope-chip{display:inline-flex;padding:5px 9px;border-radius:999px;border:1px solid rgba(255,255,255,.1);font-size:9px;font-weight:900;letter-spacing:.04em;white-space:nowrap}
.scope-ambos{color:#b9d7ff;background:rgba(83,139,214,.09)}
.scope-staff{color:#75dcff;background:rgba(41,185,229,.10)}
.scope-obrero{color:#ffd08a;background:rgba(235,166,65,.10)}
@media(max-width:800px){.personnel-type-selector{grid-template-columns:1fr}.history-block-title{align-items:flex-start;flex-direction:column}.history-block-title span{text-align:left}}

/* REMAN 6.3 · Modal de Personal responsive + Ubigeo dependiente */
#personnelDialog.modal {
    width: min(1040px, calc(100vw - 24px));
    max-width: 1040px;
    max-height: calc(100dvh - 24px);
    overflow: hidden;
    border-radius: 20px;
}
#personnelDialog .modal-card-wide {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    max-height: calc(100dvh - 24px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    padding: 24px;
}
#personnelDialog .modal-head {
    position: sticky;
    top: -24px;
    z-index: 20;
    margin: -24px -24px 12px;
    padding: 24px 24px 15px;
    background: linear-gradient(180deg, #0c1b2e 82%, rgba(12,27,46,.92));
    border-bottom: 1px solid rgba(255,255,255,.07);
}
#personnelDialog .modal-actions {
    position: sticky;
    bottom: -24px;
    z-index: 18;
    margin: 18px -24px -24px;
    padding: 15px 24px 24px;
    background: linear-gradient(0deg, #0c1b2e 82%, rgba(12,27,46,.92));
    border-top: 1px solid rgba(255,255,255,.07);
}
#personnelDialog .form-grid,
#personnelDialog .personnel-type-selector,
#personnelDialog .conditional-fieldset,
#personnelDialog label,
#personnelDialog input,
#personnelDialog select,
#personnelDialog textarea {
    min-width: 0;
    box-sizing: border-box;
}
#personnelDialog input,
#personnelDialog select,
#personnelDialog textarea {
    width: 100%;
    max-width: 100%;
}
.ubigeo-grid {
    align-items: end;
}
.ubigeo-help {
    margin-top: 10px;
    padding: 10px 12px;
    border-radius: 11px;
    border: 1px solid rgba(54,169,225,.14);
    background: rgba(54,169,225,.06);
    color: #91a9c4;
    font-size: 11px;
    line-height: 1.5;
}
.ubigeo-help.error {
    color: #ffaaaa;
    border-color: rgba(240,106,106,.24);
    background: rgba(240,106,106,.07);
}
#personnelUbigeoCode[readonly] {
    color: #82ddff;
    background: rgba(40,114,155,.10);
    cursor: default;
}
@media (max-width: 860px) {
    #personnelDialog.modal {
        width: calc(100vw - 12px);
        max-height: calc(100dvh - 12px);
        border-radius: 15px;
    }
    #personnelDialog .modal-card-wide {
        max-height: calc(100dvh - 12px);
        padding: 16px;
        border-radius: 15px;
    }
    #personnelDialog .modal-head {
        top: -16px;
        margin: -16px -16px 10px;
        padding: 16px 16px 12px;
    }
    #personnelDialog .modal-actions {
        bottom: -16px;
        margin: 16px -16px -16px;
        padding: 12px 16px 16px;
    }
    #personnelDialog .form-grid,
    #personnelDialog .form-grid-3 {
        grid-template-columns: 1fr 1fr;
        gap: 12px;
    }
    #personnelDialog .span-2 {
        grid-column: 1 / -1;
    }
}
@media (max-width: 560px) {
    #personnelDialog .form-grid,
    #personnelDialog .form-grid-3 {
        grid-template-columns: 1fr;
    }
    #personnelDialog .span-2 {
        grid-column: auto;
    }
    #personnelDialog .modal-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    #personnelDialog .modal-actions .btn {
        width: 100%;
        justify-content: center;
    }
}


/* REMAN 6.3.1 · Registro de Personal único + filtros rápidos dentro del panel */
.personnel-filter-panel {
    min-width: min(760px, 100%);
    display: grid;
    gap: 10px;
}
.personnel-quick-filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px 14px;
}
.quick-filter-group {
    display: flex;
    align-items: center;
    gap: 8px;
}
.quick-filter-label {
    color: #8399b5;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .07em;
    text-transform: uppercase;
    white-space: nowrap;
}
.quick-filter-buttons {
    display: inline-flex;
    gap: 5px;
    padding: 4px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 12px;
    background: rgba(5,18,33,.58);
}
.quick-filter-btn {
    appearance: none;
    border: 1px solid transparent;
    border-radius: 9px;
    padding: 8px 11px;
    color: #9fb2ca;
    background: transparent;
    font: inherit;
    font-size: 11px;
    font-weight: 850;
    cursor: pointer;
    transition: .16s ease;
}
.quick-filter-btn:hover {
    color: #fff;
    background: rgba(68,181,231,.09);
}
.quick-filter-btn.is-active {
    color: #061824;
    border-color: rgba(111,226,255,.42);
    background: linear-gradient(135deg,#70e3ff,#42b8ef);
    box-shadow: 0 7px 18px rgba(47,181,231,.16);
}
.quick-filter-active:not(.is-active) { color: #72deb3; }
.quick-filter-ceased:not(.is-active) { color: #ff9d9d; }
.personnel-secondary-filters {
    display: grid;
    grid-template-columns: 210px minmax(300px,1fr);
    gap: 9px;
}
@media (max-width: 1180px) {
    .personnel-filter-panel { min-width: 0; width: 100%; }
    .personnel-quick-filters { justify-content: flex-start; }
}
@media (max-width: 760px) {
    .personnel-quick-filters,
    .quick-filter-group { align-items: stretch; }
    .quick-filter-group { width: 100%; flex-direction: column; gap: 5px; }
    .quick-filter-buttons { width: 100%; }
    .quick-filter-btn { flex: 1 1 0; text-align: center; }
    .personnel-secondary-filters { grid-template-columns: 1fr; }
}

/* REMAN 6.3.4 */
.personnel-hero .hero-actions{display:flex;gap:.65rem;flex-wrap:wrap;justify-content:flex-end}.relational-personnel-table .action-group{display:flex;gap:.45rem;flex-wrap:wrap}.relational-personnel-table td small{display:block;margin-top:.2rem;opacity:.75}
