/* Refaccionaria Chabelo — sistema visual global */
* { margin:0; padding:0; box-sizing:border-box; }
:root {
    --color-primary:#183a63; --color-primary-dark:#102a46;
    --color-accent:#d8232a; --color-accent-dark:#a9161c;
    --color-metal:#d9dee5; --color-bg:#f4f6f8; --color-card:#fff;
    --color-text:#1f2937; --color-muted:#64748b; --color-border:#dfe4ea;
    --color-success:#168447; --color-warning:#c97808; --color-danger:#c91f27;
    --primary:var(--color-primary); --primary-dark:var(--color-primary-dark);
    --secondary:#edf1f5; --background:var(--color-bg); --white:var(--color-card);
    --text:var(--color-text); --text-light:var(--color-muted); --border:var(--color-border);
    --success:var(--color-success); --warning:var(--color-warning); --danger:var(--color-danger);
    --shadow:0 1px 2px rgba(16,42,70,.045),0 7px 20px rgba(16,42,70,.075);
    --shadow-raised:0 3px 8px rgba(16,42,70,.07),0 18px 42px rgba(16,42,70,.14);
    --sidebar-width:250px; --sidebar-collapsed-width:76px;
}
body { font-family:Arial,Helvetica,sans-serif; background:var(--color-bg); color:var(--color-text); line-height:1.45; }
a,button,input,select,textarea { -webkit-tap-highlight-color:transparent; }
a:focus-visible,button:focus-visible { outline:3px solid rgba(216,35,42,.22); outline-offset:2px; }
.app { display:flex; min-height:100vh; }

/* Sidebar */
.sidebar { position:fixed; inset:0 auto 0 0; z-index:1000; display:flex; flex-direction:column; width:var(--sidebar-width); min-height:100vh; overflow-x:hidden; overflow-y:auto; color:#fff; background:linear-gradient(180deg,var(--color-primary-dark),#0d2239); box-shadow:8px 0 25px rgba(8,25,43,.12); scrollbar-width:none; -ms-overflow-style:none; transition:width .2s ease,transform .2s ease; }
.sidebar::-webkit-scrollbar { width:0; height:0; display:none; }
.sidebar:focus-visible { outline:2px solid rgba(255,255,255,.42); outline-offset:-2px; }
.sidebar-logo { display:flex; align-items:center; gap:6px; min-height:94px; padding:12px 8px 12px 18px; border-bottom:1px solid rgba(255,255,255,.12); }
.sidebar-brand { display:flex; flex:1 1 auto; align-items:center; gap:8px; min-width:0; }
.sidebar .sidebar-logo .sidebar-logo-img {
    display:block;
    flex:0 0 58px !important;
    width:58px !important;
    height:58px !important;
    max-width:58px !important;
    max-height:58px !important;
    object-fit:contain;
    filter:drop-shadow(0 3px 6px rgba(0,0,0,.28));
}
.sidebar-brand-text { min-width:0; max-width:155px; overflow:hidden; opacity:1; white-space:nowrap; transition:opacity .14s ease,max-width .2s ease; }
.sidebar-logo h1 { font-size:13px; font-weight:800; letter-spacing:0; line-height:1.2; white-space:nowrap; }
.sidebar-logo span { display:block; margin-top:3px; font-size:10px; letter-spacing:.12em; opacity:.72; }
.sidebar-menu { flex:1 0 auto; padding:18px 12px 12px; }
.sidebar-menu a { display:flex; align-items:center; gap:12px; margin-bottom:4px; padding:11px 13px; border-radius:9px; color:rgba(255,255,255,.82); font-size:14px; text-decoration:none; transition:.18s ease; }
.sidebar-icon { flex:0 0 22px; width:22px; text-align:center; font-size:16px; }
.sidebar-label { max-width:155px; overflow:hidden; opacity:1; white-space:nowrap; transition:opacity .14s ease,max-width .2s ease; }
.sidebar-menu a:hover { color:#fff; background:rgba(255,255,255,.10); transform:translateX(2px); }
.sidebar-menu a.active { color:#fff; font-weight:700; background:rgba(216,35,42,.20); box-shadow:inset 3px 0 0 var(--color-accent); }
.sidebar-footer { flex:0 0 auto; padding:12px; border-top:1px solid rgba(255,255,255,.12); }
.sidebar-footer a { display:flex; align-items:center; gap:12px; padding:11px 13px; border-radius:9px; color:rgba(255,255,255,.82); font-size:14px; text-decoration:none; transition:.18s ease; }
.sidebar-footer a:hover { color:#fff; background:rgba(216,35,42,.20); }
.sidebar-toggle { z-index:1100; display:flex; align-items:center; justify-content:center; width:29px; height:29px; padding:0; border:1px solid rgba(255,255,255,.2); border-radius:8px; color:rgba(255,255,255,.88); background:rgba(255,255,255,.08); box-shadow:0 5px 14px rgba(3,15,27,.2); cursor:pointer; font-size:20px; font-weight:800; line-height:1; transition:transform .18s ease,background-color .18s ease,border-color .18s ease; }
.sidebar-toggle:hover { border-color:rgba(255,255,255,.38); color:#fff; background:rgba(255,255,255,.16); transform:translateY(-1px); }
.sidebar-toggle-desktop { position:static; flex:0 0 29px; }
.sidebar-toggle-mobile { display:none; }
.sidebar-overlay { display:none; }
html:not(.js) .sidebar-toggle { display:none; }

html.sidebar-collapsed .sidebar { width:var(--sidebar-collapsed-width); }
html.sidebar-collapsed .sidebar-logo { justify-content:center; flex-direction:column; gap:6px; min-height:112px; padding:10px 9px; }
html.sidebar-collapsed .sidebar-brand { gap:0; }
html.sidebar-collapsed .sidebar .sidebar-logo .sidebar-logo-img { flex-basis:48px !important; width:48px !important; height:48px !important; max-width:48px !important; max-height:48px !important; }
html.sidebar-collapsed .sidebar-brand-text,html.sidebar-collapsed .sidebar-label { max-width:0; opacity:0; pointer-events:none; }
html.sidebar-collapsed .sidebar-menu,html.sidebar-collapsed .sidebar-footer { padding-right:9px; padding-left:9px; }
html.sidebar-collapsed .sidebar-menu a,html.sidebar-collapsed .sidebar-footer a { justify-content:center; gap:0; padding-right:10px; padding-left:10px; }
html.sidebar-collapsed .sidebar-menu a:hover { transform:none; }
html.sidebar-collapsed .sidebar-toggle-desktop { flex-basis:27px; width:27px; height:27px; }

/* Layout y cabecera */
.main { width:calc(100% - var(--sidebar-width)); min-height:100vh; margin-left:var(--sidebar-width); transition:width .2s ease,margin-left .2s ease; }
html.sidebar-collapsed .main { width:calc(100% - var(--sidebar-collapsed-width)); margin-left:var(--sidebar-collapsed-width); }
.main-content { width:calc(100% - var(--sidebar-width)); min-height:100vh; margin-left:var(--sidebar-width); padding:28px 30px 36px; transition:width .2s ease,margin-left .2s ease; }
html.sidebar-collapsed .main-content { width:calc(100% - var(--sidebar-collapsed-width)); margin-left:var(--sidebar-collapsed-width); }
.main-content .page-header { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:20px; }
.main-content .page-header h1 { margin:0 0 5px; font-size:24px; }
.main-content .page-header p { margin:0; color:var(--color-muted); }
.main-content > .card + .card,.main-content > form > .card + .card { margin-top:16px; }
.topbar { position:relative; z-index:5; display:flex; align-items:center; justify-content:space-between; min-height:70px; padding:12px 30px; border-bottom:1px solid #d9e1e9; background:#fff; box-shadow:0 1px 2px rgba(16,42,70,.04),0 7px 20px rgba(16,42,70,.055); }
.page-title h2 { color:var(--color-primary-dark); font-size:20px; letter-spacing:-.01em; }
.page-title p { margin-top:4px; color:var(--color-muted); font-size:13px; }
.user-info { display:flex; align-items:center; gap:10px; }
.user-avatar { display:flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:50%; color:#fff; background:var(--color-primary); font-weight:700; box-shadow:inset 0 0 0 2px rgba(255,255,255,.18); }
.user-name { font-size:14px; font-weight:700; }
.user-role { color:var(--color-muted); font-size:11px; }
.content { max-width:1680px; margin:0 auto; padding:28px 30px 36px; }

/* Cards */
.card { border:1px solid var(--color-border); border-radius:14px; background:#fff; box-shadow:var(--shadow); }
.card-header { padding:17px 20px; border-bottom:1px solid var(--color-border); border-radius:14px 14px 0 0; background:linear-gradient(180deg,#fff,#fbfcfd); }
.card-body { padding:20px; }

/* Botones */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:5px; min-height:32px; height:auto; padding:5px 10px; border:0; border-radius:7px; cursor:pointer; font-size:12px; font-weight:600; line-height:1.15; text-decoration:none; white-space:nowrap; transition:.18s ease; }
.btn:hover { transform:translateY(-1px); }
.btn:active { transform:translateY(0); }
.btn-primary { color:#fff; background:var(--color-primary); }
.btn-primary:hover { background:var(--color-primary-dark); }
.btn-success { color:#fff; background:var(--color-success); }
.btn-success:hover { background:#116d3a; }
.btn-danger { color:#fff; background:var(--color-danger); }
.btn-danger:hover { background:var(--color-accent-dark); }
.btn-warning { color:#fff; background:var(--color-warning); }
.btn-warning:hover { background:#a96106; }
.btn-secondary { color:var(--color-text); border:1px solid var(--color-border); background:var(--secondary); }
.btn-secondary:hover { background:var(--color-metal); }

/* Formularios */
.filter-select-source { display:none !important; }
.filter-select-search { position:relative; width:100%; }
.filter-select-search-input { width:100%; min-height:38px; padding:8px 34px 8px 11px; border:1px solid #c7d2df; border-radius:9px; background:linear-gradient(180deg,#fff 0%,#f8fafc 100%); box-shadow:0 1px 2px rgba(15,23,42,.055),inset 0 1px 0 rgba(255,255,255,.85); color:var(--color-text); font:inherit; font-size:13px; cursor:text; }
.filter-select-search-input:focus { outline:0; border-color:var(--color-primary); background:#fff; box-shadow:0 0 0 3px rgba(24,58,99,.11),0 2px 5px rgba(15,23,42,.08); }
.filter-select-search::after { content:'⌄'; position:absolute; right:12px; top:8px; color:var(--color-muted); pointer-events:none; }
.filter-select-search-list { position:absolute; z-index:110; top:calc(100% + 4px); left:0; right:0; max-height:250px; overflow-y:auto; padding:4px; border:1px solid var(--color-border); border-radius:9px; background:#fff; box-shadow:var(--shadow-raised); }
.filter-select-search-list[hidden] { display:none; }
.filter-select-search-option { display:block; width:100%; padding:9px 10px; border:0; border-radius:6px; background:#fff; color:var(--color-text); font:inherit; font-size:13px; text-align:left; cursor:pointer; }
.filter-select-search-option:hover,.filter-select-search-option[aria-selected='true'] { color:#fff; background:var(--color-primary); }
.filter-select-search-empty { padding:10px; color:var(--color-muted); font-size:13px; }
.form-group { margin-bottom:18px; }
.form-group label { display:block; margin-bottom:7px; color:#334155; font-size:13px; font-weight:700; }
.form-control { width:100%; min-height:38px; padding:8px 11px; border:1px solid #c7d2df; border-radius:9px; outline:0; color:var(--color-text); background:linear-gradient(180deg,#fff 0%,#f8fafc 100%); box-shadow:0 1px 2px rgba(15,23,42,.055),inset 0 1px 0 rgba(255,255,255,.85); font-size:13px; transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease; }
.form-control::placeholder { color:#7f8da0; opacity:.88; }
.form-control[readonly],.form-control:disabled { color:#667386; border-color:#d7dee7; background:#eef2f5; box-shadow:none; cursor:not-allowed; }
.form-control:focus { border-color:var(--color-primary); background:#fff; box-shadow:0 0 0 3px rgba(24,58,99,.11),0 2px 5px rgba(15,23,42,.08); }

/* Tablas */
.table-container { overflow-x:auto; border-radius:10px; scrollbar-color:#aab5c2 transparent; -webkit-overflow-scrolling:touch; }
table { width:100%; border-collapse:collapse; }
th { padding:12px 13px; color:var(--color-muted); background:#e9eef3; font-size:11px; letter-spacing:.025em; text-align:left; text-transform:uppercase; }
td { padding:13px; border-top:1px solid var(--color-border); font-size:13px; }
tbody tr { transition:background-color .15s ease; }
tr:hover td { background:#f7f9fb; }

/* Badges */
.badge { display:inline-flex; align-items:center; padding:5px 9px; border-radius:20px; font-size:11px; font-weight:700; letter-spacing:.02em; white-space:nowrap; }
.badge-success { color:#166534; background:#dcfce7; }
.badge-warning { color:#92400e; background:#fef3c7; }
.badge-danger { color:#991b1b; background:#fee2e2; }

/* Modales existentes */
[class*="modal-"][class*="contenido"] { border:1px solid var(--color-border); box-shadow:var(--shadow-raised); }
[class*="modal-"][class*="encabezado"],[class*="modal-"][class*="cabecera"] { color:var(--color-primary-dark); }

/* Login */
.login-page { min-height:100vh; background:#eef2f5; }
.login-layout { display:grid; grid-template-columns:minmax(310px,430px) 1fr; min-height:100vh; }
.brand-panel { position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:space-between; padding:42px; color:#fff; background:linear-gradient(145deg,#0c223a,var(--color-primary) 72%,#234c78); }
.brand-panel::after { content:""; position:absolute; right:-145px; bottom:-120px; width:280px; height:280px; border:36px solid rgba(216,35,42,.13); border-radius:50%; }
.login-brand { position:relative; z-index:1; display:flex; align-items:center; gap:14px; }
.login-brand .login-logo-img {
    display:block;
    flex:0 0 96px !important;
    width:96px !important;
    height:96px !important;
    max-width:96px !important;
    max-height:96px !important;
    object-fit:contain;
    filter:drop-shadow(0 7px 12px rgba(0,0,0,.32));
}
.brand-title { font-size:20px; font-weight:800; letter-spacing:.04em; }
.brand-subtitle { display:block; margin-top:4px; color:#dce5ee; font-size:11px; letter-spacing:.19em; }
.brand-message,.brand-footer { position:relative; z-index:1; }
.brand-message { max-width:300px; }
.brand-message h1 { margin-bottom:14px; font-size:30px; line-height:1.18; }
.brand-message p { color:rgba(255,255,255,.76); font-size:15px; line-height:1.65; }
.brand-footer { color:rgba(255,255,255,.62); font-size:12px; }
.form-panel { display:flex; align-items:center; justify-content:center; padding:40px 24px; }
.login-card { width:100%; max-width:430px; padding:34px; border:1px solid var(--color-border); border-top:4px solid var(--color-accent); border-radius:15px; background:#fff; box-shadow:var(--shadow-raised); }
.login-card h2 { margin-bottom:8px; color:var(--color-primary-dark); font-size:25px; }
.login-description { margin-bottom:28px; color:var(--color-muted); font-size:14px; line-height:1.5; }
.login-error { margin-bottom:20px; padding:12px 14px; border:1px solid #fecaca; border-radius:8px; color:#991b1b; background:#fef2f2; font-size:13px; }
.login-submit { width:100%; margin-top:5px; }

/* Dashboard */
.dashboard-hero { position:relative; overflow:hidden; display:grid; grid-template-columns:1fr auto; align-items:center; gap:24px; padding:28px 30px; border:0; color:#fff; background:linear-gradient(120deg,var(--color-primary-dark),var(--color-primary)); }
.dashboard-hero::after { content:""; position:absolute; right:-70px; bottom:-110px; width:250px; height:250px; border:28px solid rgba(216,35,42,.17); border-radius:50%; }
.dashboard-hero-content,.dashboard-logo { position:relative; z-index:1; }
.dashboard-hero h1 { margin-bottom:8px; font-size:27px; }
.dashboard-hero p { color:rgba(255,255,255,.78); }
.dashboard-hero > .dashboard-logo {
    display:block;
    justify-self:end;
    width:128px !important;
    height:128px !important;
    max-width:128px !important;
    max-height:128px !important;
    object-fit:contain;
    filter:drop-shadow(0 8px 13px rgba(0,0,0,.30));
}
.dashboard-actions { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:14px; margin-top:20px; }
.dashboard-action { display:flex; align-items:center; gap:12px; min-height:76px; padding:16px; border:1px solid var(--color-border); border-radius:12px; color:var(--color-text); background:#fff; box-shadow:0 3px 12px rgba(16,42,70,.05); text-decoration:none; transition:.18s ease; }
.dashboard-action:hover { transform:translateY(-2px); border-color:#b9c7d6; box-shadow:var(--shadow); }
.dashboard-action-icon { font-size:24px; }
.dashboard-action strong { display:block; color:var(--color-primary-dark); }
.dashboard-action small { display:block; margin-top:3px; color:var(--color-muted); }

/* Centro de operaciones */
.dashboard-content { display:grid; gap:20px; }
.dashboard-hero-operations { min-height:178px; isolation:isolate; box-shadow:0 18px 42px rgba(16,42,70,.18); }
.dashboard-hero-operations::before { content:""; position:absolute; inset:0; z-index:0; opacity:.18; background:linear-gradient(90deg,transparent 49%,rgba(255,255,255,.12) 50%,transparent 51%),linear-gradient(0deg,transparent 49%,rgba(255,255,255,.08) 50%,transparent 51%); background-size:34px 34px; }
.dashboard-eyebrow,.dashboard-section-kicker { display:block; color:var(--color-accent); font-size:10px; font-weight:800; letter-spacing:.16em; }
.dashboard-hero .dashboard-eyebrow { margin-bottom:8px; color:#ffb3b6; }
.dashboard-kpis { display:grid; grid-template-columns:repeat(5,minmax(150px,1fr)); gap:14px; }
.dashboard-kpi { position:relative; overflow:hidden; display:flex; align-items:center; gap:13px; min-height:106px; padding:17px; border:1px solid var(--color-border); border-radius:14px; color:var(--color-text); background:#fff; box-shadow:var(--shadow); text-decoration:none; transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease; }
.dashboard-kpi::after { content:""; position:absolute; right:-24px; bottom:-32px; width:70px; height:70px; border:12px solid rgba(24,58,99,.05); border-radius:50%; }
.dashboard-kpi:hover { transform:translateY(-2px); border-color:#c5d0dc; box-shadow:var(--shadow-raised); }
.dashboard-kpi-icon { position:relative; z-index:1; display:flex; flex:0 0 38px; align-items:center; justify-content:center; width:38px; height:38px; border-radius:11px; color:#fff; background:var(--color-primary); font-size:18px; font-weight:800; }
.dashboard-kpi > div { position:relative; z-index:1; min-width:0; }
.dashboard-kpi-label,.dashboard-kpi small { display:block; color:var(--color-muted); font-size:11px; }
.dashboard-kpi strong { display:block; margin:2px 0; color:var(--color-primary-dark); font-size:22px; line-height:1.15; white-space:nowrap; }
.dashboard-kpi-primary { border-top:3px solid var(--color-primary); }
.dashboard-kpi-warning { border-top:3px solid var(--color-warning); }
.dashboard-kpi-warning .dashboard-kpi-icon { background:var(--color-warning); }
.dashboard-kpi-danger { border-top:3px solid var(--color-danger); }
.dashboard-kpi-danger .dashboard-kpi-icon { background:var(--color-danger); }
.dashboard-grid { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(280px,.8fr); gap:20px; }
.dashboard-panel { overflow:hidden; }
.dashboard-panel-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 20px; border-bottom:1px solid var(--color-border); }
.dashboard-panel-heading h2 { margin-top:3px; color:var(--color-primary-dark); font-size:17px; }
.dashboard-legend,.dashboard-activity-count { color:var(--color-muted); font-size:11px; white-space:nowrap; }
.dashboard-legend i { display:inline-block; width:9px; height:9px; margin-right:5px; border-radius:3px; background:var(--color-accent); }
.dashboard-chart { display:grid; grid-template-columns:repeat(7,minmax(48px,1fr)); align-items:end; gap:10px; min-height:270px; padding:22px 20px 18px; overflow-x:auto; }
.dashboard-chart-column { display:grid; grid-template-rows:24px 160px auto auto; gap:4px; min-width:48px; text-align:center; }
.dashboard-chart-value { align-self:end; color:var(--color-muted); font-size:9px; white-space:nowrap; }
.dashboard-chart-track { position:relative; overflow:hidden; border-radius:8px 8px 4px 4px; background:linear-gradient(180deg,#edf1f5,#f8fafc); }
.dashboard-chart-track span { position:absolute; inset:auto 0 0; min-height:4px; border-radius:7px 7px 3px 3px; background:linear-gradient(180deg,var(--color-accent),var(--color-accent-dark)); box-shadow:0 0 14px rgba(216,35,42,.18); transition:filter .18s ease; }
.dashboard-chart-column:hover .dashboard-chart-track span { filter:brightness(1.12); }
.dashboard-chart-column strong { color:var(--color-primary-dark); font-size:11px; }
.dashboard-chart-column small { color:var(--color-muted); font-size:9px; }
.dashboard-alerts { align-self:stretch; }
.dashboard-alert { display:grid; grid-template-columns:38px 1fr auto; align-items:center; gap:12px; margin:14px 16px; padding:13px; border:1px solid var(--color-border); border-radius:11px; color:var(--color-text); background:#fff; text-decoration:none; transition:.18s ease; }
.dashboard-alert:hover { transform:translateX(2px); box-shadow:var(--shadow); }
.dashboard-alert-icon { display:flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:10px; color:#fff; background:var(--color-primary); font-weight:800; }
.dashboard-alert strong,.dashboard-alert small { display:block; }
.dashboard-alert strong { color:var(--color-primary-dark); font-size:13px; }
.dashboard-alert small { margin-top:2px; color:var(--color-muted); font-size:10px; }
.dashboard-alert b { color:var(--color-muted); font-size:22px; }
.dashboard-alert-danger .dashboard-alert-icon { background:var(--color-danger); }
.dashboard-alert-warning .dashboard-alert-icon { background:var(--color-warning); }
.dashboard-alert-neutral { background:#f8fafc; }
.dashboard-activity { margin-bottom:4px; }
.dashboard-timeline { padding:6px 20px 12px; }
.dashboard-timeline-item { position:relative; display:grid; grid-template-columns:40px 1fr auto; gap:13px; padding:14px 0; border-bottom:1px solid var(--color-border); }
.dashboard-timeline-item:last-child { border-bottom:0; }
.dashboard-timeline-icon { display:flex; align-items:center; justify-content:center; width:38px; height:38px; border:1px solid #cad5e0; border-radius:50%; background:#eef3f7; font-size:17px; }
.dashboard-timeline-content { min-width:0; }
.dashboard-timeline-content > strong { color:var(--color-primary-dark); font-size:13px; }
.dashboard-timeline-content p { margin:3px 0; color:var(--color-text); font-size:12px; overflow-wrap:anywhere; }
.dashboard-timeline-content > small { color:var(--color-accent); font-size:9px; font-weight:800; letter-spacing:.1em; }
.dashboard-timeline-meta { display:flex; gap:12px; margin-bottom:3px; color:var(--color-muted); font-size:10px; }
.dashboard-timeline-link { align-self:center; padding:6px 10px; border-radius:8px; color:var(--color-primary); font-size:22px; text-decoration:none; }
.dashboard-timeline-link:hover { color:#fff; background:var(--color-primary); }
.dashboard-empty,.dashboard-notice { padding:24px; color:var(--color-muted); text-align:center; }
.dashboard-notice { border:1px solid #fed7aa; border-radius:10px; color:#9a3412; background:#fff7ed; }

/* Calendario de ventas */
.sales-calendar { margin-bottom:4px; }
.sales-calendar-header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px; border-bottom:1px solid var(--color-border); background:linear-gradient(135deg,#fff,#f8fafc); }
.sales-calendar-header h2 { margin-top:3px; color:var(--color-primary-dark); font-size:19px; }
.sales-calendar-header p { margin-top:4px; color:var(--color-muted); font-size:12px; }
.sales-calendar-modes { display:flex; padding:4px; border:1px solid var(--color-border); border-radius:10px; background:#edf1f5; }
.sales-calendar-modes button { appearance:none; padding:8px 13px; border:0; border-radius:7px; color:var(--color-muted); background:transparent; cursor:pointer; font:inherit; font-size:11px; font-weight:800; text-transform:uppercase; transition:.18s ease; }
.sales-calendar-modes button:hover { color:var(--color-primary-dark); }
.sales-calendar-modes button.active { color:#fff; background:var(--color-primary); box-shadow:0 4px 10px rgba(16,42,70,.18); }
.sales-calendar-toolbar { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:12px; padding:14px 20px; border-bottom:1px solid var(--color-border); }
.sales-calendar-toolbar h3 { color:var(--color-primary-dark); font-size:16px; text-align:center; }
.sales-calendar-toolbar > div { display:flex; justify-content:flex-end; gap:8px; }
.sales-calendar-toolbar .btn { padding:8px 12px; font-size:12px; }
.sales-calendar-scroll { overflow-x:auto; -webkit-overflow-scrolling:touch; }
.sales-calendar-month { min-width:720px; padding:16px 20px 22px; }
.sales-calendar-weekdays,.sales-calendar-days { display:grid; width:100%; grid-template-columns:repeat(7,minmax(0,1fr)); }
.sales-calendar-weekdays span { padding:7px; color:var(--color-muted); font-size:10px; font-weight:800; text-align:center; }
.sales-calendar-days { overflow:hidden; border:1px solid var(--color-border); border-radius:12px; background:var(--color-border); gap:1px; }
.sales-calendar-day { appearance:none; position:relative; display:block; width:100%; min-width:0; min-height:112px; padding:10px; border:0; color:var(--color-text); background:#fff; font:inherit; text-align:left; cursor:pointer; transition:.18s ease; }
.sales-calendar-day:hover:not(:disabled) { z-index:1; background:#f5f8fb; box-shadow:inset 0 0 0 2px rgba(24,58,99,.2); }
.sales-calendar-day:disabled { cursor:default; }
.sales-calendar-day.is-empty { background:#f1f4f7; }
.sales-calendar-day b,.sales-calendar-day span,.sales-calendar-day strong { display:block; }
.sales-calendar-day b { color:var(--color-primary-dark); font-size:12px; }
.sales-calendar-day span { margin-top:24px; color:var(--color-muted); font-size:10px; }
.sales-calendar-day strong { margin-top:2px; color:var(--color-primary); font-size:13px; }
.sales-calendar-day.has-sales::after { content:""; position:absolute; top:10px; right:10px; width:6px; height:6px; border-radius:50%; background:var(--color-accent); box-shadow:0 0 0 4px rgba(216,35,42,.09); }
.sales-calendar-day.is-today { box-shadow:inset 3px 0 0 var(--color-accent); background:#fffafb; }
.sales-calendar-week { display:grid; grid-template-columns:repeat(7,minmax(110px,1fr)); gap:10px; padding:20px; overflow-x:auto; }
.sales-calendar-week-day { appearance:none; min-height:160px; padding:15px; border:1px solid var(--color-border); border-radius:12px; color:var(--color-text); background:#fff; font:inherit; text-align:left; cursor:pointer; transition:.18s ease; }
.sales-calendar-week-day:hover:not(:disabled) { transform:translateY(-2px); border-color:#b9c7d6; box-shadow:var(--shadow); }
.sales-calendar-week-day:disabled { cursor:default; opacity:.72; }
.sales-calendar-week-day > span,.sales-calendar-week-day > b,.sales-calendar-week-day > strong,.sales-calendar-week-day > small { display:block; }
.sales-calendar-week-day > span { color:var(--color-muted); font-size:10px; text-transform:uppercase; }
.sales-calendar-week-day > b { margin:6px 0 24px; color:var(--color-primary-dark); font-size:25px; }
.sales-calendar-week-day > strong { color:var(--color-primary); font-size:12px; }
.sales-calendar-week-day > small { margin-top:4px; color:var(--color-muted); }
.sales-calendar-week-day.is-today { border-color:var(--color-accent); box-shadow:inset 0 3px 0 var(--color-accent); }
.sales-calendar-year { display:grid; grid-template-columns:repeat(4,minmax(150px,1fr)); gap:12px; padding:20px; }
.sales-calendar-year button { appearance:none; padding:17px; border:1px solid var(--color-border); border-radius:12px; color:var(--color-text); background:#fff; cursor:pointer; font:inherit; text-align:left; transition:.18s ease; }
.sales-calendar-year button:hover { transform:translateY(-2px); border-color:#b9c7d6; box-shadow:var(--shadow); }
.sales-calendar-year span,.sales-calendar-year strong,.sales-calendar-year small { display:block; }
.sales-calendar-year span { color:var(--color-accent); font-size:10px; font-weight:800; letter-spacing:.1em; }
.sales-calendar-year strong { margin:9px 0 3px; color:var(--color-primary-dark); font-size:14px; }
.sales-calendar-year small { color:var(--color-muted); font-size:12px; }
.sales-calendar-detail { border-top:1px solid var(--color-border); }
.sales-calendar-detail:empty { display:none; }
.sales-calendar-detail-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:18px 20px; background:#f8fafc; }
.sales-calendar-detail-heading h3 { margin-top:3px; color:var(--color-primary-dark); font-size:16px; }
.sales-calendar-detail-heading > div:last-child { text-align:right; }
.sales-calendar-detail-heading strong,.sales-calendar-detail-heading span { display:block; }
.sales-calendar-detail-heading strong { color:var(--color-primary-dark); font-size:12px; }
.sales-calendar-detail-heading span { color:var(--color-accent); font-size:18px; font-weight:800; }
.sales-calendar-detail .table-container { margin:0 20px 20px; }
.sales-calendar-folio { color:var(--color-primary); font-weight:800; text-decoration:none; }
.sales-calendar-folio:hover { color:var(--color-accent); text-decoration:underline; }
.sales-calendar-loading,.sales-calendar-error { padding:34px 20px; color:var(--color-muted); text-align:center; }
.sales-calendar-error { color:var(--color-danger); }

@media (max-width:1200px) {
    .dashboard-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .dashboard-grid { grid-template-columns:1fr; }
}
@media (max-width:900px) {
    :root { --sidebar-width:210px; --sidebar-collapsed-width:72px; }
    .content { padding:20px; }
    .sidebar .sidebar-logo .sidebar-logo-img { flex-basis:50px !important; width:50px !important; height:50px !important; max-width:50px !important; max-height:50px !important; }
    .sidebar-logo h1 { font-size:10px; letter-spacing:.015em; }
    .sales-calendar-year { grid-template-columns:repeat(3,minmax(130px,1fr)); }
}
@media (max-width:700px) {
    .app { display:block; }
    .sidebar,html.sidebar-collapsed .sidebar { position:relative; inset:auto; width:100%; min-height:auto; transform:none; box-shadow:8px 0 25px rgba(8,25,43,.12); }
    html.js .sidebar,html.js.sidebar-collapsed .sidebar { position:fixed; inset:0 auto 0 0; width:min(86vw,280px); min-height:100vh; transform:translateX(-105%); box-shadow:12px 0 30px rgba(8,25,43,.28); }
    html.js.sidebar-mobile-open .sidebar { transform:translateX(0); }
    .sidebar-logo,html.sidebar-collapsed .sidebar-logo { justify-content:flex-start; min-height:82px; padding:12px 18px; }
    .sidebar-brand,html.sidebar-collapsed .sidebar-brand { gap:11px; }
    .sidebar-logo h1 { font-size:13px; letter-spacing:.025em; }
    .sidebar .sidebar-logo .sidebar-logo-img,html.sidebar-collapsed .sidebar .sidebar-logo .sidebar-logo-img { flex-basis:50px !important; width:50px !important; height:50px !important; max-width:50px !important; max-height:50px !important; }
    .sidebar-brand-text,html.sidebar-collapsed .sidebar-brand-text,.sidebar-label,html.sidebar-collapsed .sidebar-label { max-width:none; opacity:1; pointer-events:auto; }
    .sidebar-menu,html.sidebar-collapsed .sidebar-menu { display:block; padding:14px 12px; overflow:visible; }
    .sidebar-menu a,html.sidebar-collapsed .sidebar-menu a,.sidebar-footer a,html.sidebar-collapsed .sidebar-footer a { justify-content:flex-start; gap:12px; margin-bottom:4px; padding:11px 13px; }
    .sidebar-toggle-desktop,html.sidebar-collapsed .sidebar-toggle-desktop { display:none; }
    .sidebar-toggle-mobile,html.sidebar-collapsed .sidebar-toggle-mobile { position:fixed; top:16px; right:auto; left:14px; display:flex; width:38px; height:38px; border:2px solid #fff; border-radius:50%; color:#fff; background:var(--color-accent); box-shadow:0 4px 12px rgba(15,23,42,.24); font-size:20px; }
    .sidebar-toggle-mobile:hover { background:var(--color-accent-dark); transform:scale(1.05); }
    html.sidebar-mobile-open .sidebar-toggle-mobile,html.sidebar-mobile-open.sidebar-collapsed .sidebar-toggle-mobile { right:auto; left:min(76vw,238px); }
    .sidebar-overlay { position:fixed; inset:0; z-index:999; display:block; border:0; background:rgba(15,23,42,.5); opacity:0; pointer-events:none; transition:opacity .2s ease; }
    html.sidebar-mobile-open .sidebar-overlay { opacity:1; pointer-events:auto; }
    html.sidebar-mobile-open body { overflow:hidden; }
    .main,html.sidebar-collapsed .main,.main-content,html.sidebar-collapsed .main-content { width:100%; margin-left:0; }
    .main-content { padding:76px 15px 24px; }
    .main-content .page-header { align-items:stretch; flex-direction:column; }
    .app .topbar { min-height:66px; padding:10px 15px 10px 64px !important; }
    .content { padding:15px; }
    .user-info > div:last-child { display:none; }
    .login-layout { display:block; }
    .brand-panel { min-height:auto; padding:24px; }
    .login-brand .login-logo-img { flex-basis:72px !important; width:72px !important; height:72px !important; max-width:72px !important; max-height:72px !important; }
    .brand-message,.brand-footer { display:none; }
    .form-panel { min-height:calc(100vh - 120px); padding:24px 16px; }
    .login-card { padding:27px 22px; }
    .dashboard-hero { grid-template-columns:1fr; padding:24px; }
    .dashboard-hero > .dashboard-logo { grid-row:1; justify-self:center; width:100px !important; height:100px !important; max-width:100px !important; max-height:100px !important; }
    .dashboard-kpis { grid-template-columns:1fr; gap:10px; }
    .dashboard-kpi { min-height:88px; }
    .dashboard-panel-heading { align-items:flex-start; padding:15px; }
    .dashboard-legend { white-space:normal; text-align:right; }
    .dashboard-chart { padding-right:15px; padding-left:15px; }
    .dashboard-timeline { padding-right:15px; padding-left:15px; }
    .dashboard-timeline-item { grid-template-columns:38px 1fr; }
    .dashboard-timeline-link { display:none; }
    .dashboard-timeline-meta { flex-direction:column; gap:1px; }
    .sales-calendar-header { align-items:flex-start; flex-direction:column; }
    .sales-calendar-toolbar { grid-template-columns:1fr 1fr; }
    .sales-calendar-toolbar h3 { grid-column:1/-1; grid-row:1; }
    .sales-calendar-toolbar > div { justify-content:flex-end; }
    .sales-calendar-year { grid-template-columns:repeat(2,minmax(0,1fr)); padding:15px; }
    .sales-calendar-detail-heading { align-items:flex-start; flex-direction:column; }
    .sales-calendar-detail-heading > div:last-child { text-align:left; }
    .sales-calendar-detail .table-container { margin-right:15px; margin-left:15px; }
}

@media (prefers-reduced-motion:reduce) {
    .sidebar,.main,.sidebar-toggle,.sidebar-brand-text,.sidebar-label,.sidebar-overlay { transition:none !important; }
}

/* =========================================================
   Sistema UI administrativo — mejora progresiva global
   ========================================================= */
:root {
    --radius-sm:8px;
    --radius-md:12px;
    --radius-lg:16px;
    --shadow-soft:0 1px 2px rgba(16,42,70,.04),0 8px 22px rgba(16,42,70,.07);
    --shadow-medium:0 3px 7px rgba(16,42,70,.06),0 16px 34px rgba(16,42,70,.115);
    --shadow-overlay:0 8px 18px rgba(15,23,42,.10),0 28px 64px rgba(15,23,42,.22);
    --control-height:38px;
    --button-height:32px;
    --button-height-primary:32px;
    --button-height-small:28px;
    --space-page:clamp(16px,2.2vw,32px);
}

html { color-scheme:light; }
body { overflow-x:hidden; background:#f1f4f7; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
img,svg,video { max-width:100%; }
.main,.content,.card,.card-body { min-width:0; }
.content { width:100%; max-width:1680px; min-width:0; padding:clamp(20px,2.25vw,32px) var(--space-page) 40px; box-sizing:border-box; }
.content > * + * { scroll-margin-top:18px; }

h1,h2,h3,h4 { line-height:1.22; }
p { overflow-wrap:break-word; }
small { line-height:1.35; }

/* Encabezados y barras reutilizables */
.ui-page-heading {
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:18px !important;
    margin-bottom:20px !important;
}
.ui-page-heading h1 { margin:0; font-size:clamp(22px,2vw,28px) !important; letter-spacing:-.025em; }
.ui-page-heading p { max-width:720px; color:var(--color-muted) !important; line-height:1.5; }
.ui-page-heading > :last-child:not(:first-child) { flex:0 0 auto; }
.ui-page-heading > .btn:last-child { min-height:var(--button-height-primary); padding:5px 10px; }

/* Superficies */
.card { border-color:#d9e1e9; border-radius:var(--radius-lg); box-shadow:var(--shadow-soft); }
.card-header { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px 20px; }
.card-header h2,.card-header h3,.card-header strong { line-height:1.3; }
.card-body { padding:20px; }

/* Botones y acciones */
.btn { min-height:var(--button-height); height:auto; padding:5px 10px; border:1px solid transparent; border-radius:7px; box-shadow:0 1px 2px rgba(15,23,42,.05); font-size:12px; font-weight:600; line-height:1.15; gap:5px; }
.btn:hover { box-shadow:0 5px 12px rgba(16,42,70,.12); }
.btn:disabled,.btn[disabled],.btn[aria-disabled="true"] { cursor:not-allowed; opacity:.55; box-shadow:none; transform:none; }
.btn-danger { border-color:rgba(153,27,27,.08); }
.btn-secondary { box-shadow:none; }
.content .btn:not(.pos-shell .btn):not(.pos-modal .btn) { min-height:var(--button-height) !important; height:auto !important; width:auto; min-width:0; padding:5px 10px !important; border-radius:7px !important; font-size:12px !important; font-weight:600 !important; line-height:1.15 !important; gap:5px !important; flex:0 0 auto; }
.content .ui-page-heading > .btn:last-child:not(.pos-shell .btn),
.content .heading-row > .btn:last-child:not(.pos-shell .btn) { min-height:var(--button-height-primary) !important; padding:5px 10px !important; }
.btn > svg,.btn > img,.btn > [class*="icon"] { width:14px; height:14px; max-width:14px; max-height:14px; font-size:13px; line-height:1; object-fit:contain; }
.btn-small,.btn-sm,.ui-table-actions-cell .btn { min-height:var(--button-height-small); padding:4px 8px; border-radius:6px; font-size:11px; line-height:1.1; }
.content .ui-table-actions-cell .btn:not(.pos-shell .btn),
.content .vehicle-actions .btn:not(.pos-shell .btn) { min-height:var(--button-height-small) !important; width:auto !important; min-width:0 !important; padding:4px 8px !important; border-radius:6px !important; font-size:11px !important; line-height:1.1 !important; flex:0 0 auto !important; }
.ui-table-actions,.ui-actions { display:flex; align-items:center; justify-content:flex-start; gap:5px; flex-wrap:nowrap; white-space:nowrap; }
.ui-table-actions-cell { width:1%; white-space:nowrap; }
.ui-table-actions-cell form,.ui-table-actions form { display:inline-flex; flex:0 0 auto; margin:0; }
.ui-table-actions-direct > .btn,.ui-table-actions-direct > form { margin:2px 4px 2px 0; }

/* Formularios */
:where(
    input[type="text"],input[type="number"],input[type="email"],input[type="tel"],
    input[type="date"],input[type="datetime-local"],input[type="password"],input[type="search"],
    select,textarea,.form-control,.filter-select-search-input
) {
    width:100%;
    min-height:var(--control-height);
    padding:8px 11px;
    border:1px solid #c7d2df;
    border-radius:9px;
    outline:0;
    color:var(--color-text);
    background:linear-gradient(180deg,#fff 0%,#f8fafc 100%);
    box-shadow:0 1px 2px rgba(15,23,42,.055),inset 0 1px 0 rgba(255,255,255,.85);
    font:inherit;
    font-size:13px;
    line-height:1.3;
    box-sizing:border-box;
    transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease;
}
:where(
    input[type="text"],input[type="number"],input[type="email"],input[type="tel"],
    input[type="date"],input[type="datetime-local"],input[type="password"],input[type="search"],
    select,textarea,.form-control,.filter-select-search-input
):hover:not(:disabled):not([readonly]) {
    border-color:#aebdcd;
    box-shadow:0 2px 5px rgba(15,23,42,.075),inset 0 1px 0 rgba(255,255,255,.9);
}
:where(
    input[type="text"],input[type="number"],input[type="email"],input[type="tel"],
    input[type="date"],input[type="datetime-local"],input[type="password"],input[type="search"],
    select,textarea,.form-control,.filter-select-search-input
):focus,
:where(
    input[type="text"],input[type="number"],input[type="email"],input[type="tel"],
    input[type="date"],input[type="datetime-local"],input[type="password"],input[type="search"],
    select,textarea,.form-control,.filter-select-search-input
):focus-visible {
    outline:0;
    border-color:var(--color-primary);
    background:#fff;
    box-shadow:0 0 0 3px rgba(24,58,99,.11),0 2px 5px rgba(15,23,42,.08);
}
:where(input,textarea,.form-control,.filter-select-search-input)::placeholder {
    color:#7f8da0;
    opacity:.88;
    font-size:.96em;
    font-weight:400;
}
:where(
    input[type="text"],input[type="number"],input[type="email"],input[type="tel"],
    input[type="date"],input[type="datetime-local"],input[type="password"],input[type="search"],
    select,textarea,.form-control,.filter-select-search-input
):disabled,
:where(
    input[type="text"],input[type="number"],input[type="email"],input[type="tel"],
    input[type="date"],input[type="datetime-local"],input[type="password"],input[type="search"],
    select,textarea,.form-control,.filter-select-search-input
)[readonly] {
    color:#667386;
    border-color:#d7dee7;
    background:#eef2f5;
    box-shadow:none;
    cursor:not-allowed;
}
textarea,.form-control:is(textarea),textarea.form-control { min-height:96px; resize:vertical; }
select,select.form-control { cursor:pointer; }
input[type="checkbox"],input[type="radio"] { accent-color:var(--color-primary); }
.form-group { min-width:0; }
.form-group label,.field label { display:block; margin-bottom:5px; color:#28384d; font-size:12px; font-weight:600; line-height:1.3; }
.form-group small,.form-help { display:block; margin-top:6px; color:var(--color-muted); font-size:12px; }

/* Matriz compartida para filtros funcionales de Inventario y POS. */
.filter-matrix { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:start; gap:9px; width:100%; }
.filter-matrix > .form-group,.filter-matrix > .field { min-width:0; margin-bottom:0; }
.filter-matrix label { margin-bottom:4px; font-size:11px; }
.filter-matrix .form-control,.filter-matrix .filter-select-search { width:100%; min-width:0; max-width:100%; }

/* Selects buscables: misma superficie y densidad que los controles nativos. */
.filter-select-search { position:relative; width:100%; min-width:0; }
.filter-select-search-input { padding-right:34px; cursor:text; }
.filter-select-search::after { top:50%; right:12px; color:#53657a; font-size:14px; transform:translateY(-52%); }
.filter-select-search-list { top:calc(100% + 5px); max-height:230px; overflow-y:auto; padding:5px; border:1px solid #c7d2df; border-radius:9px; background:#fff; box-shadow:0 10px 24px rgba(15,23,42,.15); }
.filter-select-search-option { min-height:32px; padding:7px 9px; border-radius:6px; font-size:12px; line-height:1.35; }
.filter-select-search-option:hover { color:var(--color-text); background:#eaf0f6; }
.filter-select-search-option[aria-selected="true"] { color:#fff; background:var(--color-primary); }
.filter-select-search-empty { padding:9px; font-size:12px; }

/* Filtros: visibles en escritorio y plegables en móvil */
.ui-filter-panel { position:relative; margin-bottom:20px !important; }
.ui-filter-toggle { display:none; width:calc(100% - 32px); margin:16px 16px 0; justify-content:space-between; }
.ui-filter-chevron { margin-left:auto; font-size:18px; transition:transform .18s ease; }
.ui-filters-open .ui-filter-chevron { transform:rotate(180deg); }
.ui-filter-form { display:flex; min-width:0; flex-direction:column; align-items:stretch; gap:14px; }
.ui-filter-grid { display:grid !important; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)) !important; align-items:end !important; gap:14px !important; width:100%; }
.ui-filter-form .form-group,.ui-filter-form .field { margin-bottom:0 !important; }
.ui-filter-form input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
.ui-filter-form select { min-height:var(--control-height); border:1px solid #cfd8e3; border-radius:var(--radius-sm); font-size:13px; box-sizing:border-box; }
.ui-filter-actions,.ui-filter-form .search-actions { display:flex !important; grid-column:1 / -1; align-items:center !important; justify-content:flex-start !important; gap:8px !important; width:100%; margin-top:0 !important; flex-wrap:wrap; }
.ui-filter-actions .btn,.ui-filter-form .search-actions .btn { min-height:var(--button-height); padding:5px 10px; font-size:12px; }
.content .ui-filter-actions .btn:not(.pos-shell .btn),
.content .ui-filter-form .search-actions .btn:not(.pos-shell .btn) { min-height:var(--button-height) !important; height:auto !important; padding:5px 10px !important; font-size:12px !important; }

/* Tablas y listados */
.table-container,.inventario-tabla-contenedor {
    position:relative;
    max-width:100%;
    border:1px solid #e1e7ed;
    border-radius:var(--radius-md);
    background:#fff;
    box-shadow:0 1px 2px rgba(16,42,70,.035),0 5px 16px rgba(16,42,70,.055);
    outline:0;
}
.table-container:focus-visible,.inventario-tabla-contenedor:focus-visible { box-shadow:0 0 0 3px rgba(24,58,99,.13); }
.table-container table,.inventario-tabla-contenedor table { margin:0; }
th { position:relative; padding:10px 13px; background:#eef2f6; color:#526174; font-size:11px; font-weight:800; letter-spacing:.035em; }
td { padding:11px 13px; vertical-align:middle; }
tbody tr:nth-child(even) td { background:#fbfcfd; }
tbody tr:hover td { background:#f2f6f9; }
.ui-table-scroll-hint { display:none; margin:7px 2px 0; color:var(--color-muted); font-size:11px; text-align:right; }
.ui-table-scroll-hint.is-used { opacity:.55; }
.ui-empty-state { padding:34px 20px !important; color:var(--color-muted); text-align:center; }
.ui-results-card { overflow:hidden; }
.ui-results-card > .card-body { padding:16px 18px; }
.ui-results-heading { min-height:48px; padding:12px 18px !important; }
.ui-results-heading strong,.ui-results-heading .results-title { color:var(--color-primary-dark); font-size:14px; }
.ui-results-heading .count,.ui-results-heading .badge { flex:0 0 auto; }

/* Navegación interna de catálogos: compacta y sin jerarquía de acción principal. */
.ui-tabs { display:flex; align-items:center; gap:6px; margin-bottom:20px; flex-wrap:wrap; }
.ui-tabs .btn { min-height:30px; padding:5px 10px; font-size:11.5px; }
.content .ui-tabs .btn { min-height:30px !important; padding:5px 10px !important; font-size:11.5px !important; }

/* Alertas compatibles con markup existente */
.ui-alert { border-radius:var(--radius-sm); box-shadow:0 2px 8px rgba(15,23,42,.04); font-weight:600; line-height:1.45; }

/* Modales: límites seguros sin interferir con su lógica */
[class*="modal"][role="dialog"] { overscroll-behavior:contain; }
[class*="modal-"][class*="contenido"],
[class*="modal-"][class*="panel"],
.modal-content {
    max-width:calc(100vw - 32px);
    max-height:calc(100dvh - 32px);
    overflow:auto;
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow-overlay);
}

/* Paginación y controles compactos */
.pagination,.paginacion,[class*="pagination"] { display:flex; align-items:center; justify-content:center; gap:7px; max-width:100%; flex-wrap:wrap; }
.pagination a,.pagination span,.paginacion a,.paginacion span { display:inline-flex; align-items:center; justify-content:center; min-width:40px; min-height:40px; padding:7px 11px; border-radius:8px; }

/* Dashboard: densidad legible a resoluciones intermedias */
.dashboard-content { gap:clamp(14px,1.6vw,22px); }
.dashboard-kpis { grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); }
.dashboard-kpi { min-width:0; }
.dashboard-hero { box-shadow:var(--shadow-medium); }
.dashboard-panel { box-shadow:var(--shadow-soft); }
.dashboard-kpi,.dashboard-action { box-shadow:var(--shadow-soft); }
.dashboard-kpi:hover,.dashboard-action:hover { box-shadow:var(--shadow-medium); }

@media (max-width:1200px) {
    .dashboard-grid { grid-template-columns:minmax(0,1.35fr) minmax(260px,.8fr); }
    .content { padding-right:22px; padding-left:22px; }
}

@media (max-width:1024px) {
    .dashboard-grid { grid-template-columns:1fr; }
    .dashboard-alerts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 10px; }
    .card-body { padding:18px; }
    .ui-filter-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
    .filter-matrix { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:900px) {
    .topbar { padding-right:20px; padding-left:20px; }
    .ui-page-heading { align-items:flex-start !important; }
    .dashboard-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .table-container.is-scrollable,.inventario-tabla-contenedor.is-scrollable { box-shadow:inset -12px 0 12px -14px rgba(15,23,42,.65); }
    .ui-table-scroll-hint { display:block; }
}

@media (max-width:700px) {
    :root { --control-height:46px; }
    body { font-size:15px; }
    .content { padding:16px 12px 28px; }
    .card { border-radius:12px; }
    .card-header { align-items:flex-start; padding:15px; flex-wrap:wrap; }
    .card-body { padding:15px; }

    .ui-page-heading { align-items:stretch !important; flex-direction:column !important; gap:12px !important; margin-bottom:16px !important; }
    .ui-page-heading > :last-child:not(:first-child) { width:100%; }
    .ui-page-heading > a.btn:last-child,.ui-page-heading > button.btn:last-child { width:100%; }

    .ui-filter-toggle { display:flex; }
    .ui-filter-panel:not(.ui-filters-open) .ui-filter-form { display:none; }
    .ui-filter-panel .ui-filter-form { border-top:1px solid var(--color-border); }
    .ui-filter-panel.card > .ui-filter-toggle + .card-body { padding-top:12px; }
    .ui-filter-panel:not(.ui-filters-open).card > .card-body { display:none; }
    .ui-filter-form .form-group { margin-bottom:14px; }
    .ui-filter-grid { grid-template-columns:1fr !important; }
    .filter-matrix { grid-template-columns:1fr; }
    .ui-filter-actions { flex-wrap:nowrap; }

    .btn { min-height:40px; }
    .content .btn:not(.pos-shell .btn):not(.pos-modal .btn) { min-height:40px !important; padding:8px 12px !important; }
    .content .ui-table-actions-cell .btn:not(.pos-shell .btn),
    .content .vehicle-actions .btn:not(.pos-shell .btn) { min-height:36px !important; padding:7px 10px !important; font-size:12px !important; }
    .ui-actions,.ui-table-actions { align-items:stretch; flex-wrap:wrap; white-space:normal; }
    .ui-table-actions .btn { min-height:36px; }
    .ui-table-actions-cell { width:auto; min-width:150px; white-space:normal; }
    .content .vehicle-actions { width:auto !important; flex-wrap:wrap; }

    .table-container,.inventario-tabla-contenedor { border-radius:10px; }
    th { padding:11px 12px; font-size:10px; }
    td { padding:12px; font-size:12px; }

    [class*="modal"][role="dialog"] { padding:8px !important; align-items:flex-start !important; }
    [class*="modal-"][class*="contenido"],
    [class*="modal-"][class*="panel"],
    .modal-content { width:100% !important; max-width:100% !important; max-height:calc(100dvh - 16px) !important; border-radius:12px; }

    .dashboard-alerts { grid-template-columns:1fr; }
    .dashboard-kpis { grid-template-columns:1fr; }
    .dashboard-action { min-height:68px; }

}

@media (max-width:430px) {
    .topbar .page-title p { display:none; }
    .page-title h2 { font-size:18px; }
    .user-avatar { width:36px; height:36px; }
    .content { padding-right:10px; padding-left:10px; }
    .card-body,.card-header { padding-right:13px; padding-left:13px; }
    .dashboard-actions { grid-template-columns:1fr; }
    .dashboard-panel-heading { flex-direction:column; gap:8px; }
    .dashboard-legend { text-align:left; }
    .sales-calendar-year { grid-template-columns:1fr; }
}

@media (hover:none) {
    .btn:hover,.card:hover,.dashboard-kpi:hover,.dashboard-action:hover { transform:none; }
}

@media (prefers-reduced-motion:reduce) {
    *,*::before,*::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}