/* ============================================================
   Design System v3
   Inter (Google Fonts) · Paleta teal/ámbar · Micro-animaciones
   ============================================================ */

/* ── Tokens ─────────────────────────────────────────────── */
:root {
    --font-heading: 'Poppins', 'Inter', 'Segoe UI', system-ui, sans-serif;
    --font-body: 'Roboto', 'Open Sans', 'Segoe UI', system-ui, sans-serif;
    --font-mono: 'Roboto Mono', 'JetBrains Mono', 'Consolas', 'Courier New', monospace;
    --bg:        #f4f0e8;
    --card:      #fffdf9;
    --surface:   #fffdf9;
    --surface-2: #f5f7f6;
    --text-main: var(--ink);
    --text-muted: var(--muted);
    --primary-color: var(--brand);
    --ink:       #1e2d38;
    --ink-2:     #3d5466;
    --muted:     #64788a;
    --brand:     #1a4a5a;
    --brand-mid: #2a7d6f;
    --brand-2:   #2a9d8f;
    --accent:    #e9c46a;
    --danger:    #c0392b;
    --warning:   #e67e22;
    --success:   #27ae60;
    --info:      #2980b9;
    --line:      rgba(30, 45, 56, 0.10);
    --shadow-sm: 0 2px 8px rgba(26, 74, 90, 0.08);
    --shadow-md: 0 8px 24px rgba(26, 74, 90, 0.12);
    --shadow-lg: 0 16px 40px rgba(26, 74, 90, 0.16);
    --radius:    16px;
    --radius-sm: 10px;
    --sidebar-w: 260px;
    --transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ── Reset ───────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

html {
    font-size: 16px;
    min-height: 100%;
    scroll-behavior: smooth;
}

body {
    background: linear-gradient(135deg, #f0ebe0 0%, #e8f0f2 60%, #ddeae8 100%);
    color: var(--ink);
    font-family: var(--font-body);
    margin: 0;
    min-height: 100vh;
    min-height: 100dvh;
    -webkit-font-smoothing: antialiased;
}

a { color: var(--brand-2); text-decoration: none; }
a:hover { text-decoration: underline; }

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: 800;
    letter-spacing: -0.02em;
    margin: 0;
}

body,
button,
input,
select,
textarea,
label,
p,
li,
td,
th,
a,
small,
span {
    font-family: var(--font-body);
}

code,
pre,
kbd,
samp,
.mono-pill,
.font-mono,
[data-technical] {
    font-family: var(--font-mono);
}

/* ── Animaciones ─────────────────────────────────────────── */
@keyframes fadeSlideUp {
    from { opacity: 0; transform: translateY(18px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes fadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes shimmer {
    0%   { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

/* ── App Shell ───────────────────────────────────────────── */
.app-shell {
    display: flex;
    min-height: 100vh;
    min-height: 100dvh;
    width: 100%;
}

body.has-sidebar {
    overflow-x: clip;
}

/* ── Sidebar ─────────────────────────────────────────────── */
.sidebar {
    background: linear-gradient(180deg, var(--brand) 0%, #122d3a 100%);
    color: white;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    height: 100vh;
    height: 100dvh;
    max-height: 100vh;
    max-height: 100dvh;
    padding: 0;
    position: sticky;
    top: 0;
    width: var(--sidebar-w);
    overflow: hidden;
    transition: width var(--transition), transform var(--transition), box-shadow var(--transition);
    z-index: 140;
}

/* Glow decorativo en sidebar */
.sidebar::before {
    content: '';
    position: absolute;
    top: -60px;
    right: -60px;
    width: 180px;
    height: 180px;
    background: radial-gradient(circle, rgba(42,157,143,0.25) 0%, transparent 70%);
    pointer-events: none;
}

.sidebar-brand-block {
    display: grid;
    gap: 0.85rem;
    padding: 1.25rem;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    margin-bottom: 0.5rem;
    position: relative;
}

.brand {
    align-items: center;
    color: white !important;
    display: flex;
    font-size: 1.35rem;
    font-weight: 800;
    gap: 0.6rem;
    letter-spacing: -0.03em;
    line-height: 1.1;
    text-decoration: none !important;
}

.brand-icon {
    align-items: center;
    background: rgba(42, 157, 143, 0.35);
    border: 1px solid rgba(42, 157, 143, 0.5);
    border-radius: 9px;
    display: inline-flex;
    flex-shrink: 0;
    height: 32px;
    justify-content: center;
    width: 32px;
}

.brand-icon svg {
    display: block;
}

.brand-dot {
    color: var(--brand-2);
}

.sidebar-copy {
    color: rgba(255, 255, 255, 0.52);
    font-size: 0.78rem;
    line-height: 1.5;
    margin: 0.4rem 0 0;
    transition: opacity var(--transition), transform var(--transition);
}

.sidebar nav {
    padding: 0.5rem 0.75rem;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.sidebar nav::-webkit-scrollbar {
    width: 10px;
}

.sidebar nav::-webkit-scrollbar-track {
    background: rgba(255,255,255,0.04);
}

.sidebar nav::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.18);
    border: 2px solid transparent;
    border-radius: 999px;
    background-clip: padding-box;
}

.sidebar nav::-webkit-scrollbar-thumb:hover {
    background: rgba(255,255,255,0.28);
    background-clip: padding-box;
}

.flex-column {
    flex-direction: column;
}

.nav.flex-column {
    display: flex;
    flex-direction: column;
}

.sidebar-nav {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
}

.sidebar-group {
    display: flex;
    flex-direction: column;
    gap: 0.32rem;
}

.sidebar-group-links {
    display: flex;
    flex-direction: column;
    gap: 0.16rem;
}

.sidebar-group-title {
    color: rgba(255,255,255,0.42);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    margin: 0;
    padding: 0 0.9rem;
    text-transform: uppercase;
}

.sidebar .nav-link {
    align-items: center;
    border-radius: var(--radius-sm);
    color: rgba(255,255,255,0.7);
    display: flex;
    gap: 0.75rem;
    padding: 0.72rem 0.9rem;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    transition: all var(--transition);
    position: relative;
}

.brand-wordmark,
.nav-label {
    display: inline-block;
    overflow: hidden;
    transition: opacity var(--transition), transform var(--transition);
    white-space: nowrap;
}

.sidebar-rail-toggle {
    align-items: center;
    background: linear-gradient(180deg, rgba(255,255,255,0.16), rgba(255,255,255,0.08));
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    box-shadow: 0 10px 24px rgba(8, 18, 24, 0.18);
    color: rgba(255,255,255,0.9);
    cursor: pointer;
    display: inline-flex;
    height: 42px;
    justify-content: center;
    position: absolute;
    right: -10px;
    top: 50%;
    transform: translateY(-50%);
    transition: background var(--transition), transform var(--transition), right var(--transition);
    width: 42px;
    z-index: 3;
}

.sidebar-rail-toggle:hover {
    background: linear-gradient(180deg, rgba(255,255,255,0.24), rgba(255,255,255,0.12));
}

.sidebar-rail-toggle svg {
    display: block;
    transition: transform var(--transition);
}

.sidebar .nav-link svg {
    display: block;
    flex-shrink: 0;
    opacity: 0.75;
    transition: opacity var(--transition);
}

.sidebar .nav-link:hover {
    background: rgba(255,255,255,0.1);
    color: white;
    text-decoration: none;
    transform: translateX(3px);
}

.sidebar .nav-link:hover svg { opacity: 1; }

.sidebar .nav-link.is-active {
    background: rgba(42,157,143,0.22);
    color: white;
    font-weight: 600;
    box-shadow: inset 3px 0 0 var(--brand-2);
}

.sidebar .nav-link.is-active svg { opacity: 1; }

.sidebar-divider {
    border: 0;
    border-top: 1px solid rgba(255,255,255,0.08);
    margin: 0.5rem 0.75rem;
}

.logout-form { margin: 0; }

.nav-button {
    background: transparent;
    border: 0;
    cursor: pointer;
    font: inherit;
    text-align: left;
    width: 100%;
}

.nav-link-exit {
    color: rgba(255,255,255,0.5) !important;
    font-size: 0.85rem;
}

.nav-link-exit:hover {
    background: rgba(192,57,43,0.18) !important;
    color: #ff9f9f !important;
}

.sidebar-backdrop {
    background: rgba(8, 18, 24, 0.46);
    inset: 0;
    opacity: 0;
    pointer-events: none;
    position: fixed;
    transition: opacity var(--transition);
    z-index: 130;
}

/* ── Main Content ────────────────────────────────────────── */
.main-content {
    flex: 1 1 0%;
    min-width: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

/* ── Topbar ──────────────────────────────────────────────── */
.topbar {
    align-items: center;
    background: var(--bg);
    border-bottom: 1px solid var(--line);
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    padding: 1rem 1.75rem;
    position: sticky;
    top: 0;
    z-index: 100;
}

.topbar-title-group {
    align-items: center;
    display: flex;
    gap: 0.9rem;
    min-width: 0;
}

.sidebar-toggle {
    align-items: center;
    background: rgba(255, 255, 255, 0.86);
    border: 1px solid rgba(26, 74, 90, 0.12);
    border-radius: 12px;
    box-shadow: var(--shadow-sm);
    color: var(--brand);
    cursor: pointer;
    display: none;
    flex-shrink: 0;
    height: 44px;
    justify-content: center;
    transition: transform var(--transition), background var(--transition), box-shadow var(--transition);
    width: 44px;
}

.sidebar-toggle:hover {
    background: white;
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}

.sidebar-toggle svg {
    display: block;
}

.page-title {
    font-size: clamp(1.6rem, 2.5vw, 2.4rem);
    font-weight: 800;
    letter-spacing: -0.03em;
    color: var(--brand);
    line-height: 1;
}

.topbar-title-group > div {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
}

.page-heading-shell {
    align-items: flex-start;
    display: flex;
    flex: 1 1 auto;
    gap: 1rem;
    justify-content: space-between;
    min-width: 0;
}

.page-heading-copy {
    display: grid;
    gap: 0;
    min-width: 0;
}

.page-heading-copy > .page-title,
.page-heading-copy > .page-copy {
    margin: 0;
}

.page-copy {
    color: var(--muted);
    font-size: 0.9rem;
    line-height: 1.15;
    margin: 0;
    max-width: 48rem;
}

.mobile-bottom-nav,
.mobile-nav-item {
    display: none;
}

/* Indicador de red */
#sync-indicator {
    background: rgba(42,157,143,0.1);
    border-radius: 999px;
    color: var(--muted);
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.2rem 0.6rem;
    display: inline-block;
    margin-top: 0.3rem;
}

.user-chip {
    background: white;
    border: 1px solid var(--line);
    border-radius: 12px;
    box-shadow: var(--shadow-sm);
    font-size: 0.85rem;
    padding: 0.6rem 1rem;
    text-align: right;
}

.user-chip strong { font-size: 0.9rem; }

/* ── Dashboard Minimalist Redesign ──────────────────────── */
.dashboard-stats {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(4, 1fr);
    margin-bottom: 1.5rem;
    width: 100%;
}

.dashboard-main {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: 1.6fr 1fr;
    width: 100%;
}

#sync-indicator {
    justify-self: start;
    width: fit-content;
    padding: 0.35rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 999px;
    border: 1px solid rgba(42, 157, 143, 0.25);
    background: rgba(42, 157, 143, 0.08);
    color: var(--brand-mid);
    cursor: pointer;
    transition: all var(--transition);
}

#sync-indicator:hover {
    background: rgba(42, 157, 143, 0.15);
}

#sync-indicator.sync-pending {
    border-color: rgba(230, 126, 34, 0.25);
    background: rgba(230, 126, 34, 0.08);
    color: var(--warning);
}

#sync-indicator.sync-pending:hover {
    background: rgba(230, 126, 34, 0.15);
}

.dashboard-main .card {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.dashboard-main .card-body {
    flex: 1;
}

@media (min-width: 1025px) {
    .sales-card, .inventory-card {
        grid-column: span 2;
    }
}

/* Colores de tono semánticos adaptables al tema */
.dashboard-tone-brand { color: var(--brand-mid); }
.dashboard-tone-warm { color: var(--warning); }
.dashboard-tone-success { color: var(--success); }
.dashboard-tone-danger { color: var(--danger); }

html.theme-dark .dashboard-tone-brand { color: #4fc3b3; }
html.theme-dark .dashboard-tone-warm { color: #ffb061; }
html.theme-dark .dashboard-tone-success { color: #6ee7b7; }
html.theme-dark .dashboard-tone-danger { color: #fca5a5; }

/* Ajustes del gráfico en tema oscuro */
html.theme-dark .chart-bar {
    fill: var(--brand-2) !important;
    opacity: 0.65;
}
html.theme-dark .chart-bar:hover {
    opacity: 0.95;
}

.stat-card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 1.25rem;
    box-shadow: var(--shadow-sm);
    transition: transform var(--transition), box-shadow var(--transition);
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 115px;
}

.stat-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.stat-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: var(--brand-mid);
}

.stat-card:nth-child(1)::before { background: var(--brand-2); }
.stat-card:nth-child(2)::before { background: var(--warning); }
.stat-card:nth-child(3)::before { background: var(--success); }
.stat-card:nth-child(4)::before { background: var(--danger); }

.stat-card small {
    display: block;
    color: var(--muted);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.5rem;
}

.stat-card h3 {
    font-family: var(--font-heading);
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--ink);
    margin: 0 0 0.25rem 0;
    line-height: 1.2;
}

.stat-card-meta {
    font-size: 0.8rem;
    color: var(--ink-2);
    margin-top: auto;
}

.stat-card-icon {
    position: absolute;
    right: 1rem;
    top: 1rem;
    bottom: auto;
    opacity: 0.15;
    color: var(--ink-2);
    pointer-events: none;
    transition: transform var(--transition), opacity var(--transition);
}

.stat-card:hover .stat-card-icon {
    transform: scale(1.1) rotate(-5deg);
    opacity: 0.25;
}

/* Gráfico de rendimiento */
.chart-container {
    padding: 1rem 0;
}

.chart-bar {
    transition: fill var(--transition), opacity var(--transition);
}

.chart-bar:hover {
    fill: var(--brand-2) !important;
    opacity: 1 !important;
}

/* Atajos Rápidos */
.quick-actions-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
}

.quick-actions-grid .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-radius: 10px;
    font-size: 0.88rem;
    font-weight: 500;
    transition: all var(--transition);
    border: 1px solid var(--line);
    background: var(--card);
    color: var(--ink);
}

.quick-actions-grid .btn:hover {
    background: var(--brand-mid);
    color: white;
    border-color: var(--brand-mid);
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
    text-decoration: none;
}

.quick-actions-grid .btn-primary-action {
    grid-column: span 2;
    background: var(--brand);
    color: white;
    border-color: var(--brand);
    font-weight: 600;
}

.quick-actions-grid .btn-primary-action:hover {
    background: var(--brand-2);
    border-color: var(--brand-2);
}

/* Tablas minimalistas */
.table-minimal {
    width: 100%;
    border-collapse: collapse;
}

.table-minimal th {
    text-align: left;
    padding: 0.4rem 1rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--muted);
    border-bottom: 1px solid var(--line);
    letter-spacing: 0.05em;
}

.table-minimal td {
    padding: 0.4rem 1rem;
    font-size: 0.9rem;
    color: var(--ink);
    border-bottom: 1px solid var(--line);
    vertical-align: middle;
}

.table-minimal tr:last-child td {
    border-bottom: none;
}

.table-minimal tr:hover td {
    background: rgba(42, 157, 143, 0.02);
}

/* Lista de Inventario Bajo */
.inventory-list {
    display: grid;
    gap: 0.75rem;
}

.inventory-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 1rem;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 10px;
    transition: border-color var(--transition);
}

.inventory-item:hover {
    border-color: var(--brand-2);
}

.inventory-item-info {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.inventory-item-name {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--ink);
}

.inventory-item-code {
    font-size: 0.75rem;
    color: var(--muted);
}

.inventory-badge {
    padding: 0.25rem 0.6rem;
    border-radius: 6px;
    font-size: 0.78rem;
    font-weight: 700;
    background: rgba(192, 57, 43, 0.1);
    color: var(--danger);
}

.inventory-badge.warning {
    background: rgba(230, 126, 34, 0.1);
    color: var(--warning);
}

@media (max-width: 1024px) {
    .dashboard-stats {
        grid-template-columns: repeat(2, 1fr);
    }
    .dashboard-main {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .dashboard-stats {
        grid-template-columns: 1fr;
    }
    .quick-actions-grid {
        grid-template-columns: 1fr;
    }
    .quick-actions-grid .btn-primary-action {
        grid-column: span 1;
    }
}

body.sidebar-collapsed .sidebar {
    width: 92px;
}

body.sidebar-collapsed .sidebar-brand-block {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 72px;
    padding: 0.2rem;
}

body.sidebar-collapsed .brand {
    align-items: center;
    gap: 0;
    height: 100%;
    justify-content: center;
    margin: 0;
    padding-left: 0.7rem;
    width: 100%;
}

body.sidebar-collapsed .brand-icon {
    border-radius: 12px;
    height: 42px;
    width: 42px;
}

body.sidebar-collapsed .brand-icon svg {
    height: 21px;
    width: 21px;
}

body.sidebar-collapsed .sidebar-rail-toggle {
    right: -10px;
    transform: translateY(-50%);
}

body.sidebar-collapsed .sidebar-rail-toggle svg {
    transform: rotate(180deg);
}

body.sidebar-collapsed .brand-wordmark,
body.sidebar-collapsed .sidebar-copy,
body.sidebar-collapsed .nav-label {
    opacity: 0;
    pointer-events: none;
    transform: translateX(-8px);
    width: 0;
}

body.sidebar-collapsed .sidebar-copy {
    margin: 0;
}

body.sidebar-collapsed .sidebar nav {
    padding-inline: 0.55rem;
}

body.sidebar-collapsed .sidebar-nav {
    gap: 0.7rem;
}

body.sidebar-collapsed .sidebar-group {
    align-items: center;
    gap: 0.2rem;
}

body.sidebar-collapsed .sidebar-group-links {
    width: 100%;
}

body.sidebar-collapsed .sidebar-group-title {
    opacity: 0;
    overflow: hidden;
    padding: 0;
    pointer-events: none;
    transform: translateX(-8px);
    white-space: nowrap;
    width: 0;
}

body.sidebar-collapsed .sidebar .nav-link,
body.sidebar-collapsed .sidebar .nav-button {
    gap: 0;
    justify-content: center;
    padding-inline: 0.8rem;
}

body.sidebar-collapsed .sidebar-divider {
    margin-inline: 0.55rem;
}

body.sidebar-collapsed .sidebar .nav-link:hover {
    transform: translateY(-1px);
}

/* ── Contenido de página ────────────────────────────────── */
.container-fluid {
    flex: 1;
    padding: 1.5rem 1.75rem;
}

/* ── Cards ───────────────────────────────────────────────── */
.card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
    transition: box-shadow var(--transition);
}

.card:hover {
    box-shadow: var(--shadow-md);
}

.card-body, .card-header, .card {
    padding: 1.25rem;
}

.card-header {
    background: rgba(26, 74, 90, 0.03);
    border-bottom: 1px solid var(--line);
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--ink-2);
}

/* ── Stat Cards ──────────────────────────────────────────── */
.stat-card {
    align-self: stretch;
    box-sizing: border-box;
    min-height: 66px;
    position: relative;
    overflow: hidden;
    width: 100%;
    animation: fadeSlideUp 0.5s ease both;
}

.stat-card:nth-child(1) { animation-delay: 0.05s; border-top: 3px solid var(--brand-2); }
.stat-card:nth-child(2) { animation-delay: 0.10s; border-top: 3px solid var(--accent); }
.stat-card:nth-child(3) { animation-delay: 0.15s; border-top: 3px solid var(--danger); }
.stat-card:nth-child(4) { animation-delay: 0.20s; border-top: 3px solid var(--info); }

.stat-card .card-body {
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    padding: 0.4rem 0.9rem;
}

.stat-card small {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.stat-card h3 {
    font-size: clamp(1.35rem, 2.1vw, 2rem);
    font-weight: 800;
    letter-spacing: -0.03em;
    color: var(--brand);
    line-height: 1.1;
    margin-top: 0.22rem;
}

.stat-card-icon {
    position: absolute;
    right: 1.2rem;
    top: 1.2rem;
    bottom: auto;
    opacity: 0.08;
    font-size: 4rem;
    pointer-events: none;
}

/* ── Stats Grid ──────────────────────────────────────────── */
.stats-grid {
    contain: layout;
    min-width: 0;
    width: 100%;
}

.stats-grid.dashboard-stats {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    min-width: 0;
    width: 100%;
}

/* ── Dashboard main grid ─────────────────────────────────── */
.dashboard-main {
    align-items: start;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1.45fr) minmax(320px, 1fr);
    min-width: 0;
    width: 100%;
}

/* ── Hero Strip ──────────────────────────────────────────── */
.toolbar-card {
    align-items: flex-start;
    background: white;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    padding: 1rem 1.25rem;
}

.toolbar-flat {
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
}

.hero-strip {
    background: white;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.25rem;
}

.hero-strip .quick-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    width: 100%;
}

.hero-strip .quick-actions .btn {
    flex: 1 1 0px;
    text-align: center;
    white-space: nowrap;
    justify-content: center;
    display: inline-flex;
    align-items: center;
}

@media (max-width: 900px) {
    .page-heading-shell {
        flex-direction: column;
        gap: 0.75rem;
    }

    .customer-confirm-grid {
        grid-template-columns: 1fr;
    }

    .hero-strip .quick-actions .btn {
        flex: 1 1 140px; /* Allow wrapping on small screens but keep some symmetry */
    }

    .container-fluid {
        padding: 1rem;
    }

    .reports-filter-grid {
        grid-template-columns: 1fr;
    }

    .header-actions-row,
    .supplier-form-head {
        flex-direction: column;
    }

    .header-actions-panel {
        justify-content: flex-start;
        margin-left: 0;
        width: 100%;
    }

    .pagination-container {
        align-items: flex-start;
        flex-direction: column;
    }

    .pagination-nav {
        width: 100%;
    }

    .pagination-mobile {
        display: flex;
        justify-content: space-between;
        width: 100%;
    }

    .pagination-list {
        display: none;
    }
}

@media (max-width: 640px) {
    body.has-sidebar {
        padding-bottom: 74px;
    }

    .mobile-bottom-nav {
        align-items: stretch;
        background: rgba(244, 240, 232, 0.96);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        border-top: 1px solid var(--line);
        bottom: 0;
        display: grid;
        gap: 0;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        left: 0;
        padding: 0.35rem 0.2rem calc(0.35rem + env(safe-area-inset-bottom));
        position: fixed;
        right: 0;
        z-index: 120;
    }

    .mobile-nav-item {
        align-items: center;
        border-radius: 12px;
        color: var(--brand);
        display: grid;
        gap: 0.18rem;
        justify-items: center;
        min-width: 0;
        padding: 0.45rem 0.2rem;
        text-decoration: none;
    }

    .mobile-nav-item span {
        font-size: 0.72rem;
        font-weight: 700;
        line-height: 1.1;
        white-space: nowrap;
    }

    .mobile-nav-item svg {
        display: block;
        height: 18px;
        width: 18px;
    }

    .mobile-nav-item.is-active {
        background: rgba(42, 157, 143, 0.12);
        color: var(--brand-mid);
    }
}

@media (min-width: 576px) {
    .flex-sm-row,
    .flex-column.flex-sm-row { flex-direction: row; }
}

@media (min-width: 768px) {
    .col-md-2 { width: 16.666667%; }
    .col-md-3 { width: 25%; }
    .col-md-4 { width: 33.333333%; }
    .col-md-5 { width: 41.666667%; }
    .col-md-6 { width: 50%; }
    .col-md-7 { width: 58.333333%; }
    .col-md-8 { width: 66.666667%; }
    .col-md-9 { width: 75%; }
    .col-md-auto { width: auto; }
    .flex-md-row,
    .flex-column.flex-md-row { flex-direction: row; }
    .justify-content-md-end { justify-content: flex-end; }
}

@media (min-width: 992px) {
    .col-lg-4 { width: 33.333333%; }
    .col-lg-6 { width: 50%; }
    .col-lg-8 { width: 66.666667%; }
}

@media (min-width: 1200px) {
    .col-xl-6 { width: 50%; }
}

.hero-strip strong { font-size: 0.95rem; font-weight: 700; }

.hero-strip > div:first-child,
.toolbar-card > div:first-child {
    min-width: 0;
}

.page-copy {
    margin-bottom: 0;
    max-width: 58rem;
}

/* ── Toolbar ─────────────────────────────────────────────── */
.toolbar-form {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: minmax(280px, 1fr) auto;
    flex: 1;
    min-width: 220px;
}

/* ── Tables ──────────────────────────────────────────────── */
.table-responsive { overflow-x: auto; }

.table {
    border-collapse: collapse;
    min-width: 760px;
    width: 100%;
}

.table th {
    background: rgba(26,74,90,0.03);
    color: var(--muted);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    padding: 0.5rem 1rem;
    text-align: left;
    text-transform: uppercase;
    border-bottom: 2px solid var(--line);
}

.table td {
    border-bottom: 1px solid var(--line);
    padding: 0.5rem 1rem;
    vertical-align: middle;
    word-break: break-word;
}

.table tbody tr {
    transition: background var(--transition);
}

.table tbody tr:hover {
    background: rgba(42,157,143,0.04);
}

.table tbody tr:last-child td { border-bottom: 0; }

.table.table-sm th {
    padding: 0.4rem 0.75rem;
}

.table.table-sm td {
    padding: 0.4rem 0.75rem;
}


/* ── Botones ─────────────────────────────────────────────── */
.btn {
    align-items: center;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-size: 0.875rem;
    font-weight: 600;
    gap: 0.4rem;
    justify-content: center;
    padding: 0.7rem 1.15rem;
    text-decoration: none !important;
    transition: all var(--transition);
    white-space: nowrap;
}

.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }

.btn-primary {
    background: linear-gradient(135deg, var(--brand) 0%, var(--brand-mid) 100%);
    box-shadow: 0 4px 12px rgba(26,74,90,0.28);
    color: white;
}

.btn-primary:hover {
    box-shadow: 0 8px 20px rgba(26,74,90,0.36);
    color: white;
}

.btn-outline-primary {
    background: transparent;
    border-color: rgba(26,74,90,0.28);
    color: var(--brand);
}

.btn-outline-primary:hover {
    background: rgba(26,74,90,0.06);
    color: var(--brand);
}

.btn-outline-secondary {
    background: transparent;
    border-color: rgba(30, 45, 56, 0.16);
    color: var(--ink-2);
}

.btn-outline-secondary:hover {
    background: rgba(30, 45, 56, 0.06);
    color: var(--ink);
}

.btn-danger {
    background: linear-gradient(135deg, #c0392b, #e74c3c);
    box-shadow: 0 4px 12px rgba(192,57,43,0.3);
    color: white;
}

.btn-danger:hover {
    box-shadow: 0 8px 20px rgba(192,57,43,0.4);
    color: white;
}

.btn-outline-danger {
    background: transparent;
    border-color: rgba(192,57,43,0.3);
    color: var(--danger);
}

.btn-compact { padding: 0.45rem 0.85rem; font-size: 0.82rem; }
.btn-sm { font-size: 0.8rem; padding: 0.46rem 0.72rem; }
.btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    flex-shrink: 0;
}
.btn-link-icon {
    background: none;
    border: none;
    padding: 6px;
    color: var(--ink-2);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: var(--transition);
}
.btn-link-icon:hover {
    background: rgba(30, 45, 56, 0.08);
    color: var(--brand-2);
}
.btn-link-icon.btn-danger {
    color: var(--muted);
}
.btn-link-icon.btn-danger:hover {
    color: var(--danger);
    background: rgba(192, 57, 43, 0.08);
}
.btn-link-icon.btn-success {
    color: var(--muted);
}
.btn-link-icon.btn-success:hover {
    color: var(--success);
    background: rgba(39, 174, 96, 0.08);
}

.w-100 { width: 100%; }
.h-100 { height: 100%; }

/* Bootstrap-like local utility fallback */
.container {
    margin-inline: auto;
    max-width: 1200px;
    padding-inline: 1rem;
    width: 100%;
}

.container-fluid {
    padding: 1.5rem 1.75rem;
    width: 100%;
}

.d-block { display: block; }
.d-flex { display: flex; }
.flex-column { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.flex-grow-1 { flex-grow: 1; }
.flex-shrink-0 { flex-shrink: 0; }
.position-relative { position: relative; }
.align-items-start { align-items: flex-start; }
.align-items-center { align-items: center; }
.align-items-end { align-items: flex-end; }
.justify-content-start { justify-content: flex-start; }
.justify-content-center { justify-content: center; }
.justify-content-between { justify-content: space-between; }
.justify-content-end { justify-content: flex-end; }

.gap-1 { gap: 0.25rem; }
.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 1rem; }
.g-2 { gap: 0.5rem; }
.g-3 { gap: 1rem; }
.g-4 { gap: 1.5rem; }

.row {
    display: flex;
    flex-wrap: wrap;
    margin-left: -0.5rem;
    margin-right: -0.5rem;
}

.row > * {
    flex: 0 0 auto;
    max-width: 100%;
    min-width: 0;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    width: 100%;
}

.col { flex: 1 0 0%; width: auto; }
.col-6 { width: 50%; }
.col-12 { width: 100%; }
.col-md-auto { width: 100%; }
.col-md { flex: 1 0 0%; width: 100%; }
.col-lg-4,
.col-lg-6,
.col-lg-8,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-xl-6 {
    width: 100%;
}

@media (min-width: 768px) {
    .col-md { flex: 1 0 0%; width: auto; }
    .col-md-2 { width: 16.666667%; }
    .col-md-3 { width: 25%; }
    .col-md-4 { width: 33.333333%; }
    .col-md-5 { width: 41.666667%; }
    .col-md-6 { width: 50%; }
    .col-md-7 { width: 58.333333%; }
    .col-md-8 { width: 66.666667%; }
    .col-md-9 { width: 75%; }
    .col-md-auto { width: auto; }
}

.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: 0.25rem; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-3 { margin-bottom: 1rem; }
.mb-4 { margin-bottom: 1.5rem; }
.m-0 { margin: 0; }
.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-3 { margin-top: 1rem; }
.mt-4 { margin-top: 1.5rem; }
.me-1 { margin-right: 0.25rem; }
.my-3 { margin-block: 1rem; }

.p-3 { padding: 1rem; }
.p-4 { padding: 1.5rem; }
.px-2 { padding-left: 0.5rem; padding-right: 0.5rem; }
.px-3 { padding-left: 1rem; padding-right: 1rem; }
.py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; }
.py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.py-3 { padding-top: 1rem; padding-bottom: 1rem; }
.py-4 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.pb-1 { padding-bottom: 0.25rem; }
.pt-3 { padding-top: 1rem; }

.rounded-4 { border-radius: 1rem; }
.border { border: 1px solid var(--line); }
.border-0 { border: 0; }
.shadow { box-shadow: var(--shadow-md); }
.shadow-sm { box-shadow: var(--shadow-sm); }

.text-center { text-align: center; }
.text-end { text-align: right; }
.text-muted { color: var(--muted) !important; }
.text-success { color: var(--success) !important; }
.text-danger { color: var(--danger) !important; }
.text-uppercase { text-transform: uppercase; }
.text-decoration-none { text-decoration: none !important; }
.small,
small { font-size: 0.875em; }

/* ── Forms ───────────────────────────────────────────────── */
.form-label {
    display: block;
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 0.4rem;
    color: var(--ink-2);
}

.form-control,
.form-select {
    background: white;
    border: 1.5px solid rgba(30, 45, 56, 0.15);
    border-radius: var(--radius-sm);
    color: var(--ink);
    font: inherit;
    font-size: 0.9rem;
    padding: 0.55rem 0.9rem;
    transition: border-color var(--transition), box-shadow var(--transition);
    width: 100%;
    height: 45px;
}

textarea {
    background: white;
    border: 1.5px solid rgba(30, 45, 56, 0.15);
    border-radius: var(--radius-sm);
    color: var(--ink);
    font: inherit;
    font-size: 0.9rem;
    padding: 0.75rem 0.9rem;
    transition: border-color var(--transition), box-shadow var(--transition);
    width: 100%;
}

.form-control:focus,
.form-select:focus,
textarea:focus {
    border-color: var(--brand-2);
    box-shadow: 0 0 0 3px rgba(42, 157, 143, 0.15);
    outline: none;
}

.form-control-premium,
.filter-control {
    background: rgba(255, 255, 255, 0.98);
    border: 1.5px solid rgba(30, 45, 56, 0.16);
    border-radius: 14px;
    color: var(--ink);
    font: inherit;
    font-size: 0.98rem;
    min-height: 44px;
    padding: 0.8rem 0.95rem;
    transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
    width: 100%;
}

.form-control-premium:focus,
.filter-control:focus {
    border-color: rgba(42, 157, 143, 0.85);
    box-shadow: 0 0 0 4px rgba(42, 157, 143, 0.12);
    outline: none;
}

.btn-premium {
    align-items: center;
    background: linear-gradient(135deg, var(--brand) 0%, var(--brand-mid) 100%);
    border: 0;
    border-radius: 14px;
    box-shadow: 0 10px 20px rgba(26, 74, 90, 0.18);
    color: white;
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-weight: 700;
    justify-content: center;
    min-height: 44px;
    padding: 0.8rem 1rem;
    text-decoration: none;
    transition: transform var(--transition), box-shadow var(--transition), filter var(--transition);
}

.btn-premium:hover {
    box-shadow: 0 14px 28px rgba(26, 74, 90, 0.24);
    color: white;
    filter: brightness(1.02);
    text-decoration: none;
    transform: translateY(-1px);
}

.icon-search-btn,
.icon-action-btn {
    align-items: center;
    display: inline-flex;
    height: 40px;
    justify-content: center;
    min-height: 40px;
    min-width: 40px;
    padding: 0.5rem;
    width: 40px;
}

.icon-search-btn svg,
.icon-action-btn svg {
    display: block;
    flex-shrink: 0;
    height: 18px;
    stroke-width: 2;
    width: 18px;
}

.inline-icon {
    align-items: center;
    display: inline-flex;
    flex-shrink: 0;
    justify-content: center;
    line-height: 1;
}

.inline-icon svg {
    display: block;
    flex-shrink: 0;
}

.icon-action-btn {
    border-radius: 999px;
}

.icon-search-btn {
    border-radius: var(--radius-sm);
}

.btn-warning {
    background: linear-gradient(135deg, #d99018, #efab3a);
    box-shadow: 0 4px 12px rgba(217, 144, 24, 0.24);
    color: white;
}

.btn-warning:hover {
    color: white;
}

/* ── Alerts ──────────────────────────────────────────────── */
.alert {
    align-items: center;
    border-radius: var(--radius-sm);
    border-left: 4px solid transparent;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding: 0.9rem 1.1rem;
    animation: fadeSlideUp 0.35s ease both;
}

.alert-content { flex: 1; font-size: 0.9rem; font-weight: 500; }

.alert-success {
    background: rgba(39,174,96,0.09);
    border-left-color: var(--success);
    color: #1d6b3e;
}

.alert-danger {
    background: rgba(192,57,43,0.09);
    border-left-color: var(--danger);
    color: #8b2218;
}

.alert-warning {
    background: rgba(230,126,34,0.1);
    border-left-color: var(--warning);
    color: #7d4400;
}

.alert-info {
    background: rgba(41,128,185,0.09);
    border-left-color: var(--info);
    color: #1a5580;
}

.btn-close {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 999px;
    color: var(--muted);
    cursor: pointer;
    display: inline-flex;
    font-size: 1.1rem;
    height: 1.8rem;
    justify-content: center;
    line-height: 1;
    padding: 0;
    width: 1.8rem;
    transition: background var(--transition);
}

.btn-close:hover {
    background: rgba(30,45,56,0.1);
    color: var(--ink);
}

/* ── Badges & Pills ──────────────────────────────────────── */
.badge {
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.25rem 0.55rem;
}

.text-bg-warning { background: rgba(233,196,106,0.3); color: #7a5a00; }
.text-bg-danger  { background: rgba(192,57,43,0.12); color: var(--danger); }

.mono-pill {
    background: rgba(26,74,90,0.08);
    border-radius: 6px;
    color: var(--brand);
    display: inline-block;
    font-family: var(--font-mono);
    font-size: 0.82rem;
    font-weight: 600;
    padding: 0.2rem 0.5rem;
}

.status-pill {
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1;
    padding: 0.3rem 0.7rem;
    text-transform: capitalize;
}

.status-ok {
    background: rgba(39,174,96,0.12);
    color: #1d6b3e;
}

.status-muted {
    background: rgba(30,45,56,0.08);
    color: var(--muted);
}

.delivery-warning-card {
    border-left: 4px solid rgba(214, 139, 31, 0.7);
}

.cash-pending-delivery-list {
    display: grid;
    gap: 0.65rem;
    margin-top: 0.35rem;
    text-align: left;
}

.cash-pending-delivery-item {
    background: rgba(26, 74, 90, 0.04);
    border: 1px solid var(--line);
    border-radius: 12px;
    display: grid;
    gap: 0.2rem;
    padding: 0.8rem 0.9rem;
}

.cash-pending-delivery-item strong {
    color: var(--ink);
}

.cash-pending-delivery-item span {
    color: var(--muted);
    font-size: 0.84rem;
}

/* ── Login Page ──────────────────────────────────────────── */
.cash-shell {
    display: grid;
    gap: 1rem;
}

.cash-main-card {
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid rgba(26, 74, 90, 0.08);
    box-shadow: 0 12px 28px rgba(26, 74, 90, 0.07);
    display: grid;
    gap: 0.75rem;
    padding: 1.2rem 1.45rem 1.45rem;
}

.cash-main-card--closed {
    gap: 0.55rem;
}

.cash-secondary-card {
    border: 1px solid rgba(26, 74, 90, 0.08);
    box-shadow: 0 10px 22px rgba(26, 74, 90, 0.05);
    padding: 1.35rem;
}

.cash-main-header {
    display: block;
}

.cash-main-header__copy {
    display: grid;
    gap: 0;
    max-width: none;
}

.cash-main-title-row {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem 1rem;
    justify-content: space-between;
    margin-bottom: 0.2rem;
}

.cash-title-left {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    flex-shrink: 0;
}

.cash-main-title-row h2 {
    font-size: 1.85rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1;
    margin: 0;
}

.cash-main-header__copy > p {
    margin-top: -0.08rem;
}

.cash-main-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    align-items: center;
}

.cash-main-actions .btn {
    font-weight: 700;
    min-height: 38px;
    padding-inline: 1rem;
}

@media (max-width: 640px) {
    .cash-main-title-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    .cash-main-actions {
        width: 100%;
    }
}

.cash-close-overlay {
    align-items: center;
    display: none;
    inset: 0;
    justify-content: center;
    padding: 1.25rem;
    position: fixed;
    z-index: 1700;
}

.cash-close-overlay.is-open {
    display: flex;
}

.cash-close-overlay__backdrop {
    background: rgba(10, 19, 25, 0.58);
    border: 0;
    inset: 0;
    position: absolute;
}

.cash-close-overlay__dialog {
    border: 1px solid rgba(26, 74, 90, 0.1);
    border-radius: 24px;
    box-shadow: 0 28px 80px rgba(10, 19, 25, 0.24);
    max-width: 920px;
    padding: 1.25rem;
    position: relative;
    width: min(100%, 920px);
    z-index: 1;
}

.cash-close-overlay__header {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.cash-close-overlay__header h3 {
    font-size: 1.4rem;
    font-weight: 800;
    margin: 0 0 0.2rem;
}

.cash-close-overlay__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    justify-content: flex-end;
}

.cash-close-modal .cash-close-grid {
    display: grid;
    gap: 0.9rem 1rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cash-close-modal .cash-close-field {
    min-width: 0;
}

.cash-close-modal .cash-close-field .form-control,
.cash-close-modal .cash-close-field .form-select {
    min-height: 44px;
}

.cash-close-modal .cash-close-observation {
    grid-column: 1 / -1;
}

.cash-close-modal .cash-close-actions {
    grid-column: 1 / -1;
    justify-content: center;
}

.cash-close-modal .cash-close-actions .btn {
    min-height: 42px;
    min-width: 150px;
}

.cash-main-meta {
    align-items: center;
    color: var(--muted);
    display: flex;
    flex-wrap: wrap;
    font-size: 0.92rem;
    gap: 0.4rem;
    margin-top: -0.35rem;
    padding: 0;
}

.cash-inline-meta {
    align-items: center;
    display: inline-flex;
}

.cash-inline-separator {
    color: rgba(30, 45, 56, 0.45);
}

.cash-inline-alert {
    margin: 0;
}

.cash-section {
    border-top: 1px solid rgba(26, 74, 90, 0.08);
    display: grid;
    gap: 0.8rem;
    padding-top: 1rem;
}

.cash-section-heading {
    display: grid;
    gap: 0;
}

.cash-section-heading h3 {
    font-size: 1rem;
    line-height: 1.05;
    margin: 0;
}

.cash-section-heading p {
    line-height: 1.15;
    margin: 0;
}

.cash-summary-grid {
    display: grid;
    gap: 0.9rem 0;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.cash-summary-item,
.cash-info-item {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
}

.cash-summary-item {
    align-content: start;
    border-left: 1px solid rgba(26, 74, 90, 0.08);
    gap: 0.18rem;
    padding: 0 1.25rem;
}

.cash-summary-item:first-child {
    border-left: 0;
    padding-left: 0;
}

.cash-summary-item:last-child {
    padding-right: 0;
}

.cash-summary-item small,
.cash-info-item small {
    color: var(--muted);
    font-size: 0.77rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.cash-summary-item strong {
    color: var(--ink);
    font-size: 1.42rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.cash-info-grid {
    display: grid;
    gap: 0.9rem 1.25rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cash-info-item {
    border-left: 1px solid rgba(26, 74, 90, 0.08);
    padding-left: 1.25rem;
}

.cash-info-item:first-child {
    border-left: 0;
    padding-left: 0;
}

.cash-info-item strong {
    color: var(--ink);
    font-size: 0.98rem;
    font-weight: 700;
    line-height: 1.45;
}

.cash-movement-form {
    padding-bottom: 0.1rem;
}

.cash-movement-grid {
    display: grid;
    gap: 0.9rem 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.cash-movement-field {
    min-width: 0;
}

.cash-movement-field .form-label {
    color: var(--ink-2);
    font-size: 0.76rem;
    font-weight: 700;
    margin-bottom: 0.35rem;
    text-transform: uppercase;
}

.cash-movement-field .form-control,
.cash-movement-field .form-select {
    border-radius: 12px;
    min-height: 44px;
}

.cash-form-actions {
    display: flex;
    justify-content: center;
    padding-top: 0.2rem;
}

.cash-closed-card {
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid rgba(26, 74, 90, 0.08);
    box-shadow: 0 12px 28px rgba(26, 74, 90, 0.07);
    display: grid;
    gap: 0;
    padding: 1.25rem 1.45rem 1.45rem;
}

.cash-closed-header {
    align-items: flex-start;
    display: flex;
    gap: 1rem 1.5rem;
    justify-content: space-between;
}

.cash-closed-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    justify-content: flex-end;
}

.cash-closed-actions .btn {
    font-weight: 700;
    min-height: 42px;
    padding-inline: 1rem;
}

.cash-page--closed .cash-closed-card {
    gap: 0.8rem;
    padding: 1.15rem 1.35rem 1.25rem;
}

.cash-page--closed .cash-card-header {
    align-items: flex-start;
    display: flex;
    gap: 0.8rem 1.2rem;
    justify-content: space-between;
}

.cash-page--closed .cash-header-copy {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
}

.cash-page--closed .cash-title-row {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.cash-page--closed .cash-title-row h2 {
    line-height: 1;
    margin: 0;
}

.cash-page--closed .cash-status-badge {
    transform: translateY(1px);
}

.cash-page--closed .cash-header-copy > p {
    margin: 0;
    max-width: 64ch;
}

.cash-page--closed .cash-actions {
    align-items: center;
    display: flex;
    flex-wrap: nowrap;
    gap: 0.65rem;
    justify-content: flex-end;
    margin-left: auto;
}

.cash-page--closed .cash-actions .btn {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    min-height: 42px;
    white-space: nowrap;
}

.cash-page--closed .cash-open-section,
.cash-page--closed .cash-last-close-section {
    margin-top: 0.95rem;
    padding-top: 0.9rem;
}

.cash-page--closed .cash-open-form-grid {
    align-items: end;
    gap: 0.8rem 1rem;
}

.cash-page--closed .cash-open-field {
    min-width: 0;
}

.cash-open-section,
.cash-last-close-section {
    border-top: 1px solid rgba(26, 74, 90, 0.08);
    margin-top: 1.15rem;
    padding-top: 1rem;
}

.cash-open-grid {
    display: grid;
    gap: 0.9rem 1rem;
    grid-template-columns: minmax(180px, 1fr) minmax(280px, 2fr);
}

.cash-open-grid .form-control {
    border-radius: 12px;
    min-height: 44px;
}

.cash-close-summary {
    display: grid;
    gap: 0.9rem 1.25rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cash-close-summary__item {
    border-left: 1px solid rgba(26, 74, 90, 0.08);
    display: grid;
    gap: 0.2rem;
    min-width: 0;
    padding-left: 1.25rem;
}

.cash-close-summary__item:first-child {
    border-left: 0;
    padding-left: 0;
}

.summary-label {
    color: var(--muted);
    display: block;
    font-size: 0.77rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    margin-bottom: 0.1rem;
    text-transform: uppercase;
}

.cash-close-summary__item strong {
    color: var(--ink);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.45;
}

.cash-close-difference {
    align-items: center;
    background: rgba(26, 74, 90, 0.05);
    border: 1px solid rgba(26, 74, 90, 0.12);
    border-radius: 14px;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    padding: 0.9rem 1rem;
}

.cash-close-difference[data-state="balanced"] {
    background: rgba(39, 174, 96, 0.1);
    border-color: rgba(39, 174, 96, 0.2);
    color: #1d6b3e;
}

.cash-close-difference[data-state="surplus"] {
    background: rgba(42, 157, 143, 0.12);
    border-color: rgba(42, 157, 143, 0.24);
    color: var(--brand);
}

.cash-close-difference[data-state="shortage"] {
    background: rgba(184, 64, 50, 0.1);
    border-color: rgba(184, 64, 50, 0.2);
    color: #8b2d24;
}

.cash-close-difference strong,
.cash-close-difference span {
    font-weight: 700;
}

.cash-close-swal {
    display: grid;
    gap: 0.9rem;
    margin-top: 0.35rem;
    text-align: left;
}

.cash-close-swal__field {
    display: grid;
    gap: 0.35rem;
}

.cash-close-swal__label {
    color: var(--ink-2);
    display: block;
    font-size: 0.92rem;
    font-weight: 700;
    margin: 0;
}

.cash-close-swal-popup {
    border-radius: 24px !important;
    padding: 1rem 1rem 1.15rem !important;
}

.cash-close-swal-popup .swal2-title {
    color: var(--ink);
    font-size: 1.45rem;
    font-weight: 800;
    padding-bottom: 0.25rem;
}

.cash-close-swal-popup .swal2-html-container {
    margin: 0.2rem 0 0 !important;
    padding: 0 !important;
}

.cash-close-swal__input,
.cash-close-swal__textarea {
    border: 1px solid var(--line) !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    font-size: 1rem !important;
    margin: 0 !important;
    width: 100% !important;
}

.cash-close-swal__input {
    height: 52px;
    padding-inline: 0.95rem !important;
}

.cash-close-swal__textarea {
    min-height: 110px !important;
    padding: 0.9rem 0.95rem !important;
    resize: vertical;
}

.cash-close-swal__input[readonly] {
    background: rgba(24, 104, 111, 0.06) !important;
    color: var(--ink) !important;
    font-weight: 700;
}

.cash-close-swal__difference {
    margin: 0.2rem 0;
}

.cash-close-swal-popup .swal2-actions {
    gap: 0.7rem;
    margin-top: 1rem !important;
    width: 100%;
}

.cash-close-swal-popup .swal2-confirm,
.cash-close-swal-popup .swal2-cancel {
    border-radius: 14px !important;
    font-weight: 700 !important;
    min-width: 146px;
    padding: 0.82rem 1.1rem !important;
}

@media (max-width: 991.98px) {
    .cash-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cash-summary-item:nth-child(3),
    .cash-info-item:nth-child(3) {
        border-left: 0;
        padding-left: 0;
    }

    .cash-movement-grid,
    .cash-info-grid,
    .cash-close-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cash-open-grid {
        grid-template-columns: 1fr;
    }

    .cash-page--closed .cash-card-header {
        align-items: stretch;
        flex-direction: column;
    }

    .cash-page--closed .cash-actions {
        justify-content: flex-start;
        margin-left: 0;
    }

    .cash-close-summary__item:nth-child(3) {
        border-left: 0;
        padding-left: 0;
    }

    .cash-close-modal .cash-close-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cash-close-modal .cash-close-observation,
    .cash-close-modal .cash-close-actions {
        grid-column: 1 / -1;
    }
}

@media (max-width: 575.98px) {
    .cash-main-card,
    .cash-closed-card {
        padding: 1.1rem;
    }

    .cash-page--closed .cash-closed-card {
        padding: 1rem;
    }

    .cash-main-title-row h2 {
        font-size: 1.6rem;
    }

    .cash-main-actions {
        justify-content: stretch;
        width: 100%;
    }

    .cash-main-actions .btn,
    .cash-closed-actions .btn,
    .cash-form-actions .btn {
        width: 100%;
    }

    .cash-page--closed .cash-actions {
        flex-direction: column;
        width: 100%;
    }

    .cash-summary-grid,
    .cash-movement-grid,
    .cash-info-grid,
    .cash-close-summary,
    .cash-open-grid {
        grid-template-columns: 1fr;
    }

    .cash-closed-header,
    .cash-closed-actions {
        align-items: stretch;
        flex-direction: column;
        width: 100%;
    }

    .cash-close-summary__item {
        border-left: 0;
        padding-left: 0;
    }

    .cash-summary-item,
    .cash-info-item {
        border-left: 0;
        padding-left: 0;
        padding-right: 0;
    }

    .cash-form-actions {
        justify-content: stretch;
    }

    .cash-main-meta {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.35rem;
    }

    .cash-inline-separator {
        display: none;
    }

    .cash-close-difference {
        align-items: flex-start;
        flex-direction: column;
    }

    .cash-close-swal-popup {
        padding: 0.9rem 0.8rem 1rem !important;
    }

    .cash-close-swal-popup .swal2-actions {
        flex-direction: column-reverse;
    }

    .cash-close-swal-popup .swal2-confirm,
    .cash-close-swal-popup .swal2-cancel {
        margin: 0 !important;
        width: 100%;
    }

    .cash-close-overlay {
        align-items: flex-end;
        padding: 0.75rem;
    }

    .cash-close-overlay__dialog {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
        max-height: min(92vh, 780px);
        overflow-y: auto;
        padding: 1rem;
        width: 100%;
    }

    .cash-close-overlay__actions {
        flex-direction: column-reverse;
    }

    .cash-close-overlay__actions .btn {
        width: 100%;
    }

    .cash-close-modal .cash-close-grid {
        grid-template-columns: 1fr;
    }

    .cash-close-modal .cash-close-field,
    .cash-close-modal .cash-close-observation,
    .cash-close-modal .cash-close-actions {
        grid-column: 1 / -1;
    }

    .cash-close-modal .cash-close-actions {
        justify-content: center;
    }
}

.login-page {
    align-items: center;
    background:
        radial-gradient(ellipse at 20% 20%, rgba(42,157,143,0.18) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 80%, rgba(233,196,106,0.15) 0%, transparent 50%),
        linear-gradient(135deg, #1a4a5a 0%, #122d3a 100%);
    display: flex;
    justify-content: center;
    min-height: 100vh;
    padding: 1.5rem;
}

.login-card {
    background: rgba(255, 253, 249, 0.96);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255,255,255,0.7);
    border-radius: 24px;
    box-shadow: 0 32px 64px rgba(0,0,0,0.28), 0 0 0 1px rgba(255,255,255,0.1);
    max-width: 420px;
    padding: 2.5rem;
    width: 100%;
    animation: fadeSlideUp 0.5s ease both;
}

/* Brand row: ícono + título en la misma línea */
.login-brand {
    align-items: center;
    display: flex;
    gap: 0.8rem;
    margin-bottom: 0.5rem;
}

.login-brand-icon {
    align-items: center;
    background: linear-gradient(135deg, var(--brand), var(--brand-mid));
    border-radius: 12px;
    box-shadow: 0 6px 16px rgba(26,74,90,0.28);
    display: flex;
    flex-shrink: 0;
    height: 44px;
    justify-content: center;
    width: 44px;
}

.login-brand-icon svg {
    color: white;
    display: block;
}

.login-brand h1 {
    color: var(--brand);
    font-family: var(--font-heading);
    font-size: 1.8rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1;
    margin: 0;
}

/* Mantener .login-logo por compatibilidad pero sin margin-bottom */
.login-logo {
    background: linear-gradient(135deg, var(--brand), var(--brand-mid));
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 52px;
    width: 52px;
    box-shadow: 0 8px 20px rgba(26,74,90,0.3);
}

.login-logo svg { color: white; }

/* ── Misc helpers ────────────────────────────────────────── */
.quick-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.quick-actions .btn,
.quick-actions .status-pill,
.table-actions .btn,
.table-actions form {
    flex: 0 0 auto;
}

.quick-actions form,
.table-actions form {
    margin: 0;
}

.list-group { display: flex; flex-direction: column; }

.list-group-item {
    border-bottom: 1px solid var(--line);
    padding: 0.9rem 1.25rem;
    transition: background var(--transition);
}

.list-group-item:last-child { border-bottom: 0; }
.list-group-item:hover { background: rgba(42,157,143,0.04); }

.section-heading {
    display: grid;
    gap: 0;
    margin-bottom: 1rem;
}
.section-heading h2 {
    font-size: 1.25rem;
    line-height: 1.05;
    margin-bottom: 0;
}
.section-heading h3 {
    font-size: 1.02rem;
    line-height: 1.05;
    margin-bottom: 0;
}
.section-heading p {
    line-height: 1.15;
    margin: 0;
}

.header-actions-row {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.header-actions-copy {
    flex: 0 1 30rem;
    min-width: 0;
}

.header-actions-copy p {
    max-width: 42rem;
}

.compact-heading-tight {
    display: grid;
    gap: 0.2rem;
}

.compact-heading-tight h2,
.compact-heading-tight h3 {
    margin-bottom: 0;
}

.header-actions-panel {
    align-items: center;
    display: flex;
    flex: 1 1 40rem;
    flex-shrink: 0;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: flex-end;
    margin-left: auto;
}
.sale-detail-heading {
    align-items: flex-start;
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem;
    justify-content: space-between;
}

.sale-drafts-shell {
    display: grid;
    gap: 0.75rem;
}

.sale-drafts-bar {
    align-items: center;
    display: grid;
    gap: 0.85rem;
    grid-template-columns: minmax(0, 1fr) auto;
}

.sale-drafts-scroll {
    display: flex;
    gap: 0.75rem;
    overflow-x: auto;
    padding-bottom: 0.2rem;
    scrollbar-width: thin;
}

.sale-drafts-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    justify-content: flex-end;
}

.sale-draft-tab {
    align-items: center;
    background: rgba(26, 74, 90, 0.04);
    border: 1px solid var(--line);
    border-radius: 16px;
    display: inline-flex;
    gap: 0.55rem;
    min-height: 44px;
    padding: 0.45rem 0.7rem 0.45rem 0.9rem;
    white-space: nowrap;
}

.sale-draft-tab.is-active {
    background: rgba(42, 157, 143, 0.12);
    border-color: rgba(42, 157, 143, 0.3);
    box-shadow: 0 10px 26px rgba(42, 157, 143, 0.12);
}

.sale-draft-tab__button,
.sale-draft-tab__close {
    background: transparent;
    border: 0;
    color: inherit;
    padding: 0;
}

.sale-draft-tab__button {
    align-items: center;
    display: inline-flex;
    gap: 0.45rem;
    font: inherit;
    font-weight: 700;
}

.sale-draft-tab__status {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 600;
}

.sale-draft-tab__close {
    align-items: center;
    border-radius: 999px;
    color: var(--muted);
    display: inline-flex;
    height: 24px;
    justify-content: center;
    width: 24px;
}

.sale-draft-tab__close:hover {
    background: rgba(30, 45, 56, 0.08);
    color: var(--ink);
}

.sale-drafts-meta {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
}

/* ── Sale detail header ────────────────────────────────── */
.sale-detail-card--cancelled {
    opacity: 0.88;
}

.sale-detail-header {
    display: flex;
    align-items: stretch;
    gap: 0;
}

.sale-meta-tiles {
    display: flex;
    flex: 1;
    flex-wrap: wrap;
    gap: 0;
}

.sale-meta-tile {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.3rem;
    padding: 0.4rem 1.25rem;
    min-width: 90px;
}

.sale-meta-tile:first-child {
    padding-left: 0;
}

.sale-meta-group {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.sale-meta-row {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.sale-meta-label {
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.sale-meta-value {
    color: var(--ink);
    font-size: 0.9rem;
    font-weight: 600;
}

.sale-meta-payment-badge {
    background: rgba(26, 74, 90, 0.08);
    border-radius: 999px;
    color: var(--brand);
    display: inline-flex;
    align-items: center;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.2rem 0.65rem;
    text-transform: capitalize;
}

.sale-detail-total-block {
    align-items: flex-end;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.25rem;
    text-align: right;
    padding-left: 1.5rem;
    flex-shrink: 0;
}

.sale-detail-total-amount {
    color: var(--brand);
    font-family: var(--font-heading);
    font-size: 1.9rem;
    font-weight: 700;
    line-height: 1;
}

.sale-detail-total-label {
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

/* Tabla de ítems */
.sale-detail-items {
    margin: 0 -1rem;
}

.sale-detail-table thead th {
    background: rgba(26, 74, 90, 0.03);
    border-bottom: 1px solid rgba(26, 74, 90, 0.12);
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    padding: 0.6rem 0.75rem;
    text-transform: uppercase;
    white-space: nowrap;
}

.sale-detail-table tbody td {
    padding: 0.65rem 0.75rem;
    vertical-align: middle;
}

.sale-item-name {
    font-weight: 600;
    color: var(--ink);
}

.sale-item-presentation {
    font-size: 0.85rem;
    color: var(--ink-2);
}

.sale-item-qty {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    color: var(--ink-2);
}

.sale-item-price {
    font-variant-numeric: tabular-nums;
    color: var(--ink-2);
    font-size: 0.88rem;
}

.sale-item-total {
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    color: var(--ink);
}

/* Bloque de totales */
.sale-detail-summary {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.28rem;
    margin-top: 0.6rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--line);
}

.sale-detail-summary__line {
    display: flex;
    gap: 1.5rem;
    font-size: 0.85rem;
    color: var(--ink-2);
}

.sale-detail-summary__label {
    color: var(--muted);
    min-width: 90px;
    text-align: right;
}

.sale-detail-summary__val {
    min-width: 100px;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.sale-detail-summary__line--discount .sale-detail-summary__val {
    color: var(--success);
}

.sale-detail-summary__total {
    display: flex;
    gap: 1.5rem;
    font-size: 1rem;
    font-weight: 700;
    color: var(--brand);
    border-top: 2px solid rgba(26, 74, 90, 0.15);
    margin-top: 0.25rem;
    padding-top: 0.45rem;
}

.sale-detail-summary__total span:first-child {
    min-width: 90px;
    text-align: right;
}

.sale-detail-summary__total span:last-child {
    min-width: 100px;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* Acciones */
.sale-detail-actions {
    border-top: 1px solid var(--line);
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-top: 1.25rem;
    padding-top: 1rem;
}

@media (max-width: 700px) {
    .sale-meta-tiles {
        flex-wrap: wrap;
    }
    .sale-meta-tile {
        flex: 0 0 calc(50% - 1px);
        padding: 0.5rem 0.75rem;
    }
    .sale-meta-tile:first-child {
        padding-left: 0.75rem;
    }
    .sale-detail-total-block {
        width: 100%;
        border-top: 1px solid var(--line);
        padding-left: 0;
        padding-top: 0.75rem;
        margin-top: 0.5rem;
        align-items: flex-start;
        text-align: left;
    }
    .sale-detail-header {
        flex-wrap: wrap;
    }
    .sale-detail-items {
        margin: 0 -0.5rem;
    }
}
/* ── /Sale detail header ───────────────────────────────── */

#sale-draft-conflict-warning {
    color: #9b5b11;
}

.sale-waiting-panel {
    display: grid;
    gap: 0.85rem;
    text-align: left;
}

.sale-waiting-panel__search.swal2-input {
    margin: 0;
    width: 100%;
}

.sale-waiting-panel__list {
    display: grid;
    gap: 0.75rem;
    max-height: 320px;
    overflow-y: auto;
    padding-right: 0.2rem;
}

.sale-waiting-card {
    background: rgba(26, 74, 90, 0.04);
    border: 1px solid var(--line);
    border-radius: 14px;
    color: var(--ink);
    display: grid;
    gap: 0.45rem;
    padding: 0.9rem 1rem;
    text-align: left;
    transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
    width: 100%;
}

.sale-waiting-card:hover {
    border-color: rgba(42, 157, 143, 0.24);
    transform: translateY(-1px);
}

.sale-waiting-card.is-selected {
    background: rgba(42, 157, 143, 0.1);
    border-color: rgba(42, 157, 143, 0.34);
    box-shadow: 0 10px 24px rgba(42, 157, 143, 0.12);
}

.sale-waiting-card__top {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
}

.sale-waiting-card__badge {
    background: rgba(30, 45, 56, 0.08);
    border-radius: 999px;
    color: var(--ink-2);
    font-size: 0.74rem;
    font-weight: 700;
    padding: 0.25rem 0.6rem;
    white-space: nowrap;
}

.sale-waiting-card__meta {
    color: var(--muted);
    font-size: 0.83rem;
    font-weight: 600;
}

.sale-waiting-card__grid {
    color: var(--ink-2);
    display: grid;
    gap: 0.35rem 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    font-size: 0.82rem;
}

.sale-detail-heading__actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    justify-content: flex-end;
}

.sale-scanner-status {
    align-items: center;
    background: rgba(42, 157, 143, 0.08);
    border: 1px solid rgba(42, 157, 143, 0.2);
    border-radius: 999px;
    color: var(--brand);
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 700;
    gap: 0.35rem;
    min-height: 36px;
    padding: 0.35rem 0.75rem;
    white-space: nowrap;
}

.sale-scanner-status[data-state="processing"] {
    background: rgba(242, 153, 74, 0.14);
    border-color: rgba(242, 153, 74, 0.24);
    color: #9b5b11;
}

.sale-scanner-status[data-state="success"] {
    background: rgba(39, 174, 96, 0.12);
    border-color: rgba(39, 174, 96, 0.22);
    color: #1d6b3e;
}

.sale-scanner-status[data-state="error"] {
    background: rgba(214, 48, 49, 0.1);
    border-color: rgba(214, 48, 49, 0.22);
    color: #a92828;
}

.sale-manual-barcode-btn {
    align-items: center;
    display: inline-flex;
    gap: 0.45rem;
    min-height: 36px;
}

@media (max-width: 640px) {
    .sale-waiting-card__top {
        align-items: flex-start;
        flex-direction: column;
    }

    .sale-waiting-card__grid {
        grid-template-columns: 1fr;
    }
}

.sale-line.is-scan-highlight {
    animation: saleLineScanPulse 1.2s ease;
}

@keyframes saleLineScanPulse {
    0% {
        box-shadow: 0 0 0 0 rgba(42, 157, 143, 0.28);
        transform: translateY(0);
    }
    30% {
        box-shadow: 0 0 0 4px rgba(42, 157, 143, 0.18);
        transform: translateY(-1px);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(42, 157, 143, 0);
        transform: translateY(0);
    }
}

.product-form-layout {
    align-items: start;
    display: grid;
    gap: 1.25rem;
    grid-template-columns: 1fr;
}

.product-form-main,
.product-form-side {
    min-width: 0;
}

.product-form-panels {
    display: grid;
    gap: 1rem;
}

.product-form-panel {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 10px 24px rgba(20, 31, 44, 0.04);
}

.product-form-side {
    display: grid;
    gap: 1rem;
}

.product-form-actions {
    position: sticky;
    top: 1.25rem;
}

.product-form-actions-inner {
    border-top: 0;
    display: grid;
    gap: 0.75rem;
    margin-top: 0;
    padding-top: 0;
}

.product-form-actions .btn {
    justify-content: center;
    width: 100%;
}

.form-foot {
    padding-top: 1rem;
    margin-top: 1rem;
    justify-content: center;
}

.field-tip {
    color: var(--muted);
    font-size: 0.82rem;
    line-height: 1.45;
    margin-top: 0.4rem;
}

.inline-helper-card {
    background: rgba(26,74,90,0.04);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.9rem;
}

.inline-helper-head {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
    margin-bottom: 0.75rem;
}

.inline-helper-head a { font-size: 0.88rem; }

.management-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(300px, 0.95fr) minmax(0, 1.35fr);
}

.info-tile {
    background: rgba(26,74,90,0.04);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    font-size: 1.1rem;
    font-weight: 700;
    min-height: 52px;
    padding: 0.9rem 1rem;
    color: var(--brand);
}

.product-image-preview-card {
    align-items: center;
    background: rgba(26,74,90,0.04);
    border: 1px dashed rgba(26,74,90,0.18);
    border-radius: var(--radius);
    display: flex;
    justify-content: center;
    min-height: 180px;
    overflow: hidden;
    padding: 0.75rem;
}

.product-image-preview {
    border-radius: 14px;
    display: block;
    height: 100%;
    max-height: 160px;
    max-width: 100%;
    object-fit: contain;
    width: auto;
}

.product-image-preview-empty {
    color: var(--muted);
    font-size: 0.9rem;
    text-align: center;
}

.toolbar-card {
    align-items: center;
    background: rgba(255, 253, 249, 0.9);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    padding: 1rem 1.1rem;
}

.toolbar-search {
    flex: 1;
    min-width: 220px;
}

.operations-toolbar {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: minmax(240px, 1fr) auto;
    flex: 1;
    min-width: 220px;
}

.inventory-toolbar {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: minmax(240px, 2.2fr) minmax(180px, 1fr) auto;
    flex: 1;
    min-width: 220px;
}

.inventory-card-header {
    display: grid;
    gap: 0.75rem;
}

.inventory-card-header--tight {
    gap: 0.3rem;
}

.inventory-title-row {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.inventory-title {
    margin: 0;
}

.inventory-actions {
    align-items: center;
    display: flex;
    flex-shrink: 0;
    flex-wrap: wrap;
    gap: 0.65rem;
    justify-content: flex-end;
    margin-left: auto;
}

.inventory-action-btn {
    min-height: 42px;
    white-space: nowrap;
}

.users-layout {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: minmax(0, 1.65fr) minmax(280px, 0.95fr);
}

.users-screen {
    display: grid;
    gap: 0.65rem;
}

.users-profiles-card,
.users-table-card {
    padding: 1.25rem;
}

.users-profile-card {
    display: grid;
    gap: 0.75rem;
}

.users-profile-card h3 {
    margin-bottom: 0;
}

.users-profile-card p {
    margin-bottom: 0;
}

.users-table {
    width: 100%;
    table-layout: fixed;
}

.users-table thead th {
    background: rgba(26,74,90,0.05);
    border-bottom: 1px solid var(--line);
    color: var(--ink-2);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 0.5rem 0.85rem;
    text-transform: uppercase;
    vertical-align: middle;
}

.users-table tbody td {
    padding: 0.5rem 0.85rem;
    vertical-align: middle;
}

.users-table tbody tr + tr td {
    border-top: 1px solid rgba(30,45,56,0.08);
}

.users-table.table-sm thead th {
    padding: 0.4rem 0.85rem;
}

.users-table.table-sm tbody td {
    padding: 0.4rem 0.85rem;
}


.users-col-username {
    min-width: 80px;
    width: 12%;
}

.users-col-name {
    min-width: 120px;
    width: 25%;
}

.users-col-email {
    min-width: 160px;
    width: 33%;
}

.users-col-roles {
    min-width: 0;
    width: 0;
}

.users-col-status {
    min-width: 80px;
    width: 12%;
}

.users-col-last-login {
    min-width: 110px;
    width: 18%;
}

.users-col-actions {
    min-width: 80px;
    width: 80px;
}

.users-username {
    color: var(--ink);
    display: inline-block;
    font-size: 1rem;
    font-weight: 700;
    white-space: nowrap;
}

.users-name {
    color: var(--ink);
    display: -webkit-box;
    font-weight: 600;
    line-height: 1.35;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.users-email {
    color: var(--ink-2);
    font-size: 0.92rem;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.role-chip-group {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.role-chip,
.status-pill {
    border-radius: 999px;
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 700;
    padding: 0.4rem 0.78rem;
    white-space: nowrap;
}

.role-chip {
    background: rgba(42,157,143,0.12);
    color: var(--brand);
}

.status-pill.is-active {
    background: rgba(46, 204, 113, 0.14);
    color: #217a45;
}

.status-pill.is-inactive {
    background: rgba(231, 76, 60, 0.12);
    color: #b33a2d;
}

.status-pill.inventory-low {
    background: rgba(242, 153, 74, 0.16);
    color: #9b5b11;
}

.status-pill.inventory-critical {
    background: rgba(214, 48, 49, 0.14);
    color: #a92828;
}

.users-login-date {
    color: var(--ink);
    font-weight: 600;
    line-height: 1.25;
    white-space: nowrap;
}

.users-login-time {
    margin-top: 0.2rem;
    white-space: nowrap;
}

.users-actions {
    align-items: center;
    display: inline-flex;
    flex-direction: row;
    gap: 0.55rem;
}

.users-actions .btn {
    border-radius: 999px;
    min-width: 88px;
}

.users-actions form {
    display: inline-flex;
}

.users-toggle-btn {
    border-color: rgba(230,126,34,0.22);
    color: #8c5b17;
}

.users-toggle-btn:hover {
    background: rgba(230,126,34,0.10);
    border-color: rgba(230,126,34,0.34);
    color: #7b4e12;
}

.provider-actions-wrapper {
    align-items: center;
    display: inline-flex;
    gap: 0.5rem;
    justify-content: flex-end;
}

.provider-actions-wrapper form {
    display: inline-flex;
    margin: 0;
}

.supplier-list-heading {
    display: grid;
    gap: 0.2rem;
}

.provider-action-btn {
    align-items: center;
    border-radius: 999px;
    display: inline-flex;
    height: 38px;
    justify-content: center;
    min-height: 38px;
    min-width: 38px;
    padding: 0.45rem;
    width: 38px;
}

.provider-action-btn svg {
    display: block;
    flex-shrink: 0;
    height: 14px;
    stroke-width: 2;
    width: 14px;
}

.table-actions {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: flex-end;
}

.table-actions .btn-sm,
.customer-actions .btn {
    align-items: center;
    border-radius: 999px;
    display: inline-flex;
    height: 38px;
    justify-content: center;
    min-height: 38px;
    min-width: 38px;
    padding: 0.45rem;
}

.table-actions .btn-sm svg,
.customer-actions .btn svg {
    display: block;
    flex-shrink: 0;
    height: 14px;
    width: 14px;
}



.sales-receipt-cell {
    text-align: center;
}

.sales-receipt-cell .table-actions {
    justify-content: center;
    width: 100%;
}






.table-subline {
    color: var(--muted);
    font-size: 0.82rem;
    line-height: 1.45;
    margin-top: 0.18rem;
    white-space: normal;
}

.profile-stack {
    display: grid;
    gap: 0.5rem;
}

.profile-card {
    background: rgba(26,74,90,0.04);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.7rem 1rem;
}

.customer-base-card {
    gap: 1.2rem;
    padding: 1.25rem;
}

.customer-base-head h2 {
    font-size: 1.4rem;
    margin-bottom: 0.35rem;
}

.customer-base-head p {
    max-width: 58rem;
}

.customer-table {
    min-width: 980px;
}

.customer-table thead th {
    background: rgba(26,74,90,0.05);
    border-bottom: 1px solid var(--line);
    color: var(--ink-2);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 0.5rem 0.85rem;
    text-transform: uppercase;
    vertical-align: middle;
}

.customer-table tbody td {
    padding: 0.5rem 0.85rem;
    vertical-align: middle;
}

.customer-table tbody tr + tr td {
    border-top: 1px solid rgba(30,45,56,0.08);
}

.customer-name {
    color: var(--ink);
    display: block;
    font-size: 0.98rem;
    font-weight: 700;
}

.customer-contact-main {
    color: var(--ink);
    font-weight: 600;
}

.customer-empty-credit {
    display: inline-block;
    font-weight: 600;
}

.customer-credit-link {
    border-color: rgba(30,45,56,0.12);
    color: var(--ink-2);
}

.customer-credit-link:hover {
    background: rgba(30,45,56,0.06);
    border-color: rgba(30,45,56,0.18);
    color: var(--ink);
}

.sale-product-search {
    position: relative;
}

.sale-product-search__results {
    position: absolute;
    top: calc(100% + 0.35rem);
    left: 0;
    right: 0;
    z-index: 24;
    display: grid;
    gap: 0;
    background: var(--card);
    border: 1px solid rgba(30,45,56,0.12);
    border-radius: 14px;
    box-shadow: var(--shadow-md);
    overflow: hidden;
}

.sale-product-search__results[hidden],
.sale-product-search__results:empty,
.pos-customer-search-results[hidden],
.pos-customer-search-results:empty {
    display: none !important;
}

.sale-product-search__native,
.sale-product-search__native:focus {
    border-bottom: 0;
    box-shadow: none;
    outline: none;
}

.sale-product-search__native {
    display: none !important;
}

.sale-product-search__item {
    width: 100%;
    border: 0;
    border-bottom: 1px solid rgba(30,45,56,0.08);
    background: transparent;
    color: inherit;
    display: grid;
    gap: 0.12rem;
    padding: 0.7rem 0.9rem;
    text-align: left;
}

.sale-product-search__item:last-child {
    border-bottom: 0;
}

.sale-product-search__item:hover,
.sale-product-search__item.is-active {
    background: rgba(26,74,90,0.06);
}

.sale-product-search__item-name {
    color: var(--ink);
    display: block;
    font-size: 0.98rem;
    font-weight: 700;
    line-height: 1.25;
}

.sale-product-search__item-meta {
    color: var(--muted);
    display: block;
    font-size: 0.82rem;
    line-height: 1.35;
}

.sale-product-search__empty {
    color: var(--muted);
    padding: 0.85rem 0.95rem;
    text-align: center;
}

.pos-customer-search-shell {
    position: relative;
}

.pos-customer-search-results {
    position: absolute;
    top: calc(100% + 0.35rem);
    left: 0;
    right: 0;
    z-index: 24;
    background: var(--card);
    border: 1px solid rgba(30,45,56,0.12);
    border-radius: 14px;
    box-shadow: var(--shadow-md);
    overflow: hidden;
}

.customer-search-item {
    background: transparent;
    border-bottom: 1px solid rgba(30,45,56,0.08);
    cursor: pointer;
    gap: 0.75rem;
    padding: 0.7rem 0.9rem;
}

.customer-search-item:last-child {
    border-bottom: 0;
}

.customer-search-item:hover,
.customer-search-item.active {
    background: rgba(26,74,90,0.06);
}

.customer-search-main {
    min-width: 0;
}

.customer-meta {
    color: var(--muted);
    font-size: 0.82rem;
    line-height: 1.35;
}

.customer-search-right {
    flex: 0 0 auto;
}

.customer-id {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 600;
}

.customer-toggle-btn {
    border-color: rgba(230,126,34,0.22);
    color: #8c5b17;
}

.customer-toggle-btn:hover {
    background: rgba(230,126,34,0.10);
    border-color: rgba(230,126,34,0.34);
    color: #7b4e12;
}

.customer-empty-state {
    padding: 1.4rem 1rem !important;
}

.profile-card h3 {
    font-size: 1rem;
    margin-bottom: 0.35rem;
}

.profile-card p {
    color: var(--muted);
    font-size: 0.9rem;
    margin-bottom: 0.65rem;
}

.profile-list {
    margin: 0;
    padding-left: 1rem;
}

.profile-list li {
    color: var(--ink-2);
    font-size: 0.88rem;
    line-height: 1.45;
    margin-bottom: 0.35rem;
}

.user-form-layout {
    display: grid;
    gap: 0;
}

.user-form-card {
    display: grid;
    gap: 0;
    padding: 1.25rem;
}

.user-form-section {
    display: grid;
    gap: 1rem;
}

.user-access-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(12, minmax(0, 1fr));
}

.user-access-grid > * {
    min-width: 0;
}

.user-access-field--name {
    grid-column: span 6;
}

.user-access-field--username,
.user-access-field--status {
    grid-column: span 3;
}

.user-access-field--email,
.user-access-field--password {
    grid-column: span 6;
}

.user-form-header {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.user-form-back {
    align-items: center;
    display: inline-flex;
    gap: 0.35rem;
    justify-content: center;
    white-space: nowrap;
    width: auto;
}

.user-form-divider {
    border: 0;
    border-top: 1px solid var(--line);
    margin: 1.25rem 0;
    opacity: 1;
}

.credit-detail-screen {
    display: grid;
    gap: 1.5rem;
}

.credit-detail-screen > .mb-4 {
    margin-bottom: 0 !important;
}

.credit-detail-screen .credit-kpi-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.credit-detail-screen .credit-card-kpi,
.credit-detail-screen .profile-card-horizontal,
.credit-detail-screen .section-card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
}

.credit-detail-screen .credit-card-kpi {
    padding: 1.2rem;
    display: grid;
    gap: 0.45rem 0.9rem;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
        "label icon"
        "value icon";
    align-items: center;
    min-width: 0;
}

.credit-detail-screen .credit-card-kpi .kpi-icon {
    grid-area: icon;
    color: var(--brand);
    line-height: 0;
    justify-self: end;
    align-self: start;
}

.credit-detail-screen .credit-card-kpi small {
    grid-area: label;
    color: var(--muted);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.credit-detail-screen .credit-card-kpi h3 {
    grid-area: value;
    margin: 0;
    color: var(--ink);
    font-size: 1.55rem;
}

.credit-detail-screen .kpi-debt.has-debt .kpi-icon,
.credit-detail-screen .kpi-debt.has-debt h3 {
    color: #b45309;
}

.credit-detail-screen .profile-card-horizontal {
    padding: 1.25rem;
    display: grid;
    gap: 1rem;
}

.credit-detail-screen .profile-main-info {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.credit-detail-screen .profile-meta {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.credit-detail-screen .profile-details-row {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.credit-detail-screen .profile-detail-item {
    display: flex;
    align-items: flex-start;
    gap: 0.8rem;
    padding: 0.9rem 1rem;
    background: rgba(22, 101, 52, 0.03);
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 14px;
}

.credit-detail-screen .detail-icon {
    color: var(--brand);
    flex: 0 0 auto;
    line-height: 0;
}

.credit-detail-screen .detail-info {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
}

.credit-detail-screen .detail-label {
    color: var(--muted);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.credit-detail-screen .detail-value {
    color: var(--ink);
    font-weight: 600;
    word-break: break-word;
}

.credit-detail-screen .section-card {
    padding: 1.25rem;
}

.credit-detail-screen .section-heading-custom {
    margin-bottom: 1rem;
}

.credit-detail-screen .section-heading-custom h2 {
    margin: 0 0 0.35rem;
}

.credit-detail-screen .section-heading-custom p {
    margin: 0;
    color: var(--muted);
}

.credit-detail-screen .payment-form-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.credit-detail-screen .payment-form-field,
.credit-detail-screen .form-group-custom {
    min-width: 0;
}

.credit-detail-screen .form-group-custom label {
    display: block;
    margin-bottom: 0.45rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--ink);
}

.credit-detail-screen .payment-form-actions {
    margin-top: 1rem;
    display: flex;
    justify-content: flex-end;
}

.credit-detail-screen .btn-save-payment {
    white-space: nowrap;
}

.credit-detail-screen .row.g-4 {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 1.5rem;
}

.credit-detail-screen .table-responsive {
    overflow-x: auto;
}

@media (max-width: 1199.98px) {
    .credit-detail-screen .credit-kpi-grid,
    .credit-detail-screen .payment-form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .credit-detail-screen .profile-details-row {
        grid-template-columns: 1fr;
    }
}

.stakeholder-form-layout {
    display: grid;
    gap: 0.65rem;
}

.supplier-form-head {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.supplier-form-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(12, minmax(0, 1fr));
}

.supplier-form-field {
    min-width: 0;
}

.supplier-form-field--name,
.supplier-form-field--phone,
.supplier-form-field--email {
    grid-column: span 6;
}

.supplier-form-field--contact,
.supplier-form-field--state {
    grid-column: span 3;
}

@media (min-width: 768px) {
    .adjustment-fields-row {
        grid-template-columns: repeat(12, 1fr) !important;
    }
}

.stakeholder-form-layout .card-body {
    padding: 0.9rem 1.25rem;
}

/* Ajuste manual: diseño específico de página */
.manual-adjust-page .manual-adjust-grid {
    align-items: end;
    display: grid;
    gap: 1rem;
    grid-template-areas:
        "product product product"
        "type    qty     reason"
        "obs     obs     obs";
    grid-template-columns: minmax(0, 1fr) minmax(100px, 0.5fr) minmax(0, 1.5fr);
}

.manual-adjust-page .manual-adjust-field--product { grid-area: product; }
.manual-adjust-page .manual-adjust-field--type    { grid-area: type; }
.manual-adjust-page .manual-adjust-field--qty     { grid-area: qty; }
.manual-adjust-page .manual-adjust-field--reason  { grid-area: reason; }
.manual-adjust-page .manual-adjust-field--obs     { grid-area: obs; }

.manual-adjust-page .manual-adjust-grid .form-control,
.manual-adjust-page .manual-adjust-grid .form-select {
    min-height: 44px;
}

.manual-adjust-page .manual-adjust-guide-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.manual-adjust-guide-card {
    background: rgba(255, 253, 249, 0.92);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1rem 1.1rem;
}

.manual-adjust-guide-card__icon {
    align-items: center;
    border-radius: 10px;
    display: inline-flex;
    flex-shrink: 0;
    height: 36px;
    justify-content: center;
    width: 36px;
}

.manual-adjust-guide-card__icon svg {
    display: block;
}

.manual-adjust-guide-card--positive .manual-adjust-guide-card__icon {
    background: rgba(39, 174, 96, 0.12);
    color: #1d6b3e;
}

.manual-adjust-guide-card--negative .manual-adjust-guide-card__icon {
    background: rgba(192, 57, 43, 0.10);
    color: var(--danger);
}

.manual-adjust-guide-card--return .manual-adjust-guide-card__icon {
    background: rgba(233, 196, 106, 0.22);
    color: #7a5a00;
}

.manual-adjust-guide-card__body {
    display: grid;
    gap: 0.25rem;
}

.manual-adjust-guide-card__label {
    color: var(--muted);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.manual-adjust-guide-card__title {
    color: var(--ink);
    font-family: var(--font-heading);
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1.2;
    margin: 0;
}

.manual-adjust-guide-card__desc {
    color: var(--muted);
    font-size: 0.84rem;
    line-height: 1.5;
    margin: 0;
}

@media (max-width: 991.98px) {
    .manual-adjust-page .manual-adjust-grid {
        grid-template-areas:
            "product product"
            "type    qty"
            "reason  reason"
            "obs     obs";
        grid-template-columns: 1fr 1fr;
    }

    .manual-adjust-page .manual-adjust-guide-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .manual-adjust-page .manual-adjust-grid {
        grid-template-areas:
            "product"
            "type"
            "qty"
            "reason"
            "obs";
        grid-template-columns: 1fr;
    }

    .manual-adjust-page .manual-adjust-guide-grid {
        grid-template-columns: 1fr;
    }
}

.alert-settings-form {
    display: grid;
}

.alert-settings-card {
    display: grid;
    gap: 0;
    padding: 1.25rem;
}

.alert-settings-section {
    display: grid;
    gap: 1rem;
}

.alert-rules-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(12, minmax(0, 1fr));
}

.alert-rule-field {
    grid-column: span 4;
    min-width: 0;
}

.alert-rule-field--state {
    grid-column: span 4;
}

.alert-rule-field--recipients {
    grid-column: span 8;
}

.alert-settings-divider {
    border: 0;
    border-top: 1px solid var(--line);
    margin: 1.25rem 0;
    opacity: 1;
}

.role-selector-grid.alert-level-grid {
    grid-template-columns: repeat(3, minmax(220px, 246px));
}

.alert-level-card {
    min-height: 100%;
}

.inventory-alerts-page .alert-levels-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
}

.inventory-alerts-page .alert-level-card {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    width: 100%;
}

.inventory-alerts-page .alert-level-card p {
    margin-bottom: 0;
}

.alert-preview-grid {
    width: 100%;
}

.alert-preview-empty {
    background: rgba(255, 253, 249, 0.92);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    padding: 1rem 1.25rem;
}

.alert-settings-actions {
    align-items: center;
    border-top: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: center;
    margin-top: 1rem;
    padding: 0.35rem 0 0.1rem;
}

@media (max-width: 991.98px) {
    .alert-rule-field,
    .alert-rule-field--state,
    .alert-rule-field--recipients {
        grid-column: span 6;
    }

    .role-selector-grid.alert-level-grid {
        grid-template-columns: repeat(2, minmax(0, 246px));
    }

    .inventory-alerts-page .alert-levels-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .alert-rules-grid {
        grid-template-columns: 1fr;
    }

    .alert-rule-field,
    .alert-rule-field--state,
    .alert-rule-field--recipients {
        grid-column: 1;
    }

    .role-selector-grid.alert-level-grid {
        grid-template-columns: 1fr;
    }

    .inventory-alerts-page .alert-levels-grid {
        grid-template-columns: 1fr;
    }

    .alert-settings-actions {
        flex-direction: column;
    }

    .alert-settings-actions .btn {
        width: min(100%, 240px);
    }
}

.daily-report-form {
    display: grid;
}

.daily-report-card {
    display: grid;
    gap: 0;
    padding: 1.25rem;
}

.daily-report-section {
    display: grid;
    gap: 1rem;
}

.daily-report-rules-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(12, minmax(0, 1fr));
}

.daily-report-field {
    min-width: 0;
}

.daily-report-field--state {
    grid-column: span 3;
}

.daily-report-field--time {
    grid-column: span 3;
}

.daily-report-field--recipients {
    grid-column: span 6;
}

.daily-report-section + .daily-report-section {
    margin-top: 1.75rem;
}

.daily-report-divider {
    border: 0;
    border-top: 1px solid var(--line);
    margin: 1.25rem 0;
    opacity: 1;
}

.role-selector-grid.daily-report-options-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.daily-report-option-card {
    min-height: 100%;
}

.daily-report-page .daily-summary-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.daily-report-page .daily-summary-card {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.daily-report-page .daily-summary-card p {
    margin-bottom: 0;
}

.daily-report-actions {
    align-items: center;
    border-top: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: center;
    margin-top: 1rem;
    padding: 0.35rem 0 0.1rem;
}

@media (max-width: 1199.98px) {
    .daily-report-page .daily-summary-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .daily-report-field--state,
    .daily-report-field--time {
        grid-column: span 4;
    }

    .daily-report-field--recipients {
        grid-column: span 12;
    }
}

@media (max-width: 767.98px) {
    .daily-report-page .daily-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .daily-report-rules-grid {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .daily-report-field--state,
    .daily-report-field--time,
    .daily-report-field--recipients {
        grid-column: span 6;
    }
}

@media (max-width: 575.98px) {
    .daily-report-rules-grid {
        grid-template-columns: 1fr;
    }

    .daily-report-field--state,
    .daily-report-field--time,
    .daily-report-field--recipients {
        grid-column: 1;
    }

    .daily-report-page .daily-summary-grid {
        grid-template-columns: 1fr;
    }

    .daily-report-actions {
        flex-direction: column;
    }

    .daily-report-actions .btn {
        width: min(100%, 260px);
    }
}

.company-settings-form {
    display: grid;
}

.company-settings-card {
    border: 1px solid rgba(26, 74, 90, 0.08);
    box-shadow: 0 12px 28px rgba(26, 74, 90, 0.06);
    display: grid;
    gap: 1.25rem;
    padding: 1.4rem;
}

.company-settings-header {
    display: grid;
    gap: 0;
}

.company-settings-header h2 {
    font-size: 1.35rem;
    line-height: 1.05;
    margin: 0;
}

.company-settings-header p {
    line-height: 1.15;
    margin: 0;
}

.company-settings-section {
    border-top: 1px solid rgba(26, 74, 90, 0.08);
    display: grid;
    gap: 0.85rem;
    padding-top: 1rem;
}

.company-settings-section__heading {
    display: grid;
    gap: 0;
}

.company-settings-section__heading h3 {
    font-size: 1rem;
    line-height: 1.05;
    margin: 0;
}

.company-settings-section__heading p {
    line-height: 1.15;
    margin: 0;
}

.company-settings-identity-grid {
    display: grid;
    gap: 0.85rem 1rem;
    grid-template-columns: minmax(0, 2fr) minmax(180px, 1fr) minmax(180px, 1fr);
}

.company-settings-field {
    min-width: 0;
}

.company-settings-field--full {
    grid-column: 1 / -1;
}

.company-settings-textarea {
    min-height: 108px;
    resize: vertical;
}

.company-settings-actions {
    display: flex;
    gap: 0.65rem;
    justify-content: center;
    padding-top: 0.15rem;
}

.company-settings-actions .btn {
    min-height: 42px;
}

@media (max-width: 991.98px) {
    .company-settings-identity-grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }

    .company-settings-field--name,
    .company-settings-field--full {
        grid-column: 1 / -1;
    }
}

@media (max-width: 575.98px) {
    .company-settings-card {
        padding: 1.1rem;
    }

    .company-settings-identity-grid {
        grid-template-columns: 1fr;
    }

    .company-settings-actions {
        flex-direction: column;
    }

    .company-settings-actions .btn {
        width: 100%;
    }
}

.config-tabs-card {
    padding: 1rem;
    overflow: visible;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.config-tabs-wrapper {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: visible;
}

.config-tabs {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: stretch;
    justify-content: flex-start;
    overflow: visible;
    min-width: 0;
}

.config-tab-btn {
    align-items: center;
    border-radius: 0.75rem;
    display: inline-flex;
    flex: 1 1 150px;
    height: 42px;
    justify-content: center;
    margin: 0;
    min-width: 140px;
    max-width: 100%;
    padding: 0.5rem 1rem;
    text-align: center;
    white-space: nowrap;
    width: auto;
}

.config-tab-btn.btn {
    font-weight: 600;
    line-height: 1.1;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 1200px) {
    .config-tab-btn {
        flex: 1 1 140px;
    }
}

@media (min-width: 1200px) {
    .config-tab-btn {
        flex: 1 1 0;
    }
}

@media (max-width: 768px) {
    .config-tab-btn {
        flex: 1 1 calc(50% - 0.75rem);
        min-width: 140px;
        width: 100%;
    }
}

@media (max-width: 480px) {
    .config-tab-btn {
        flex: 1 1 100%;
    }
}

.customer-form-screen {
    gap: 1.25rem;
}

.customer-form-main {
    display: grid;
    gap: 1rem;
}

.customer-form-card {
    padding: 1.25rem;
}

.customer-form-head p {
    max-width: 42rem;
}

.customer-primary-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(12, minmax(0, 1fr));
}

.customer-primary-grid > * {
    min-width: 0;
}

.customer-primary-field--name {
    grid-column: span 4;
}

.customer-primary-field--type {
    grid-column: span 2;
}

.customer-primary-field--document {
    grid-column: span 4;
}

.customer-primary-field--state {
    grid-column: span 2;
}

.customer-contact-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(12, minmax(0, 1fr));
}

.customer-contact-grid > * {
    min-width: 0;
}

.customer-contact-grid .customer-field--phone,
.customer-contact-grid .customer-field--email,
.customer-contact-grid .customer-field--type,
.customer-contact-grid .customer-field--discount {
    grid-column: span 3;
}

.customer-back-btn {
    border-radius: 999px;
    flex: 0 0 auto;
    width: auto;
}

.btn-back {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    border-radius: 999px;
    flex: 0 0 auto;
    width: auto;
    white-space: nowrap;
}

.btn-back svg {
    flex: 0 0 auto;
}

.customer-checkbox-card {
    min-height: 50px;
}

.customer-credit-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    align-items: start;
    grid-template-areas:
        "toggle toggle toggle limit limit limit days days days balance balance balance"
        "tip tip tip tip tip tip tip tip tip tip tip tip";
}

.customer-credit-grid > * {
    min-width: 0;
}

.customer-credit-field--toggle,
.customer-credit-field--limit,
.customer-credit-field--days,
.customer-credit-field--balance {
    grid-column: span 3;
}

.customer-credit-field--toggle {
    grid-area: toggle;
    padding-top: 1.4rem;
}

.customer-credit-grid .customer-credit-field--toggle .customer-checkbox-card {
    min-height: 44px;
    padding-block: 0.55rem;
}

.customer-credit-field--limit {
    grid-area: limit;
}

.customer-credit-field--days {
    grid-area: days;
}

.customer-credit-field--balance {
    grid-area: balance;
}

.customer-credit-field--tip {
    grid-area: tip;
}

.customer-credit-shell {
    border: 1px solid rgba(30,45,56,0.08);
    border-radius: var(--radius);
    padding: 0.95rem;
    transition: opacity var(--transition), background var(--transition), border-color var(--transition);
}

.customer-credit-shell.is-muted {
    background: rgba(30,45,56,0.025);
    opacity: 0.72;
}

.customer-credit-shell.is-enabled {
    background: rgba(26,74,90,0.035);
}

.customer-credit-tip {
    margin-top: 0.15rem;
}

.customer-readonly-field {
    background: rgba(30,45,56,0.045);
    color: var(--ink-2);
}

.customer-confirm-modal {
    background: var(--card);
    border-radius: 22px;
    box-shadow: var(--shadow-lg);
    padding: 1.15rem 1.15rem 1rem;
}

.customer-confirm-title {
    color: var(--brand);
    font-size: 1.45rem;
}

.customer-confirm-body {
    margin-top: 0.25rem;
    padding-top: 0.25rem !important;
}

.customer-confirm-copy {
    color: var(--muted);
    font-size: 0.92rem;
    line-height: 1.5;
    margin: 0 0 1rem;
    text-align: left;
}

.customer-confirm-grid {
    display: grid;
    gap: 0.8rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.customer-confirm-tile {
    background: rgba(26,74,90,0.04);
    border: 1px solid var(--line);
    border-radius: 14px;
    display: grid;
    gap: 0.28rem;
    min-width: 0;
    padding: 0.9rem 0.95rem;
    text-align: left;
}

.customer-confirm-tile small {
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.customer-confirm-tile strong {
    color: var(--brand);
    font-size: 0.96rem;
    line-height: 1.35;
}

.customer-confirm-actions {
    gap: 0.75rem;
    justify-content: flex-end !important;
    margin-top: 1.1rem !important;
    width: 100%;
}

.customer-confirm-accept,
.customer-confirm-cancel {
    border-radius: 999px;
}

.purchase-form-layout {
    display: grid;
    gap: 1rem;
}

.purchase-header-strip {
    align-items: stretch;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1.7fr) minmax(280px, 0.8fr);
}

.purchase-scanner-panel {
    margin-bottom: 0;
}

.purchase-summary-card {
    background: linear-gradient(180deg, rgba(26,74,90,0.96), rgba(42,125,111,0.96));
    border-radius: 22px;
    color: white;
    display: grid;
    gap: 0.5rem;
    min-height: 100%;
    padding: 1.1rem 1.15rem;
}

.purchase-summary-card small {
    color: rgba(255,255,255,0.78);
    font-size: 0.82rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.purchase-summary-card strong {
    font-family: var(--font-heading);
    font-size: clamp(1.85rem, 3vw, 2.6rem);
    line-height: 1;
}

.purchase-summary-card .field-tip {
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.16);
    border-radius: 14px;
    color: rgba(255,255,255,0.92);
    padding: 0.75rem 0.8rem;
}

.purchase-lines-grid {
    display: grid;
    gap: 0.9rem;
}

.summary-tile-grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.reports-filter-grid {
    align-items: end;
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
}

.reports-grid-custom {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.report-card-interactive {
    background: linear-gradient(180deg, rgba(255, 253, 249, 0.98), rgba(246, 250, 251, 0.98));
    border: 1px solid rgba(26, 74, 90, 0.1);
    border-radius: 20px;
    box-shadow: 0 14px 28px rgba(20, 31, 44, 0.06);
    color: var(--ink);
    display: flex;
    flex-direction: column;
    gap: 1rem;
    justify-content: space-between;
    min-height: 220px;
    padding: 1.25rem;
    position: relative;
    text-decoration: none;
    transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
}

.report-card-interactive::before {
    background: linear-gradient(135deg, rgba(42, 157, 143, 0.16), rgba(233, 196, 106, 0.14));
    border-radius: 16px;
    content: "";
    height: 72px;
    position: absolute;
    right: 1rem;
    top: 1rem;
    width: 72px;
    z-index: 0;
}

.report-card-interactive:hover {
    border-color: rgba(42, 157, 143, 0.32);
    box-shadow: 0 22px 40px rgba(20, 31, 44, 0.1);
    color: var(--ink);
    text-decoration: none;
    transform: translateY(-4px);
}

.report-card-interactive > * {
    position: relative;
    z-index: 1;
}

.card-header-block {
    align-items: center;
    display: flex;
    gap: 0.9rem;
    margin-bottom: 0.8rem;
}

.card-header-block strong {
    color: var(--brand);
    font-family: var(--font-heading);
    font-size: 1.15rem;
    line-height: 1.15;
}

.card-icon-wrapper {
    align-items: center;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(26, 74, 90, 0.1);
    border-radius: 14px;
    color: var(--brand-mid);
    display: inline-flex;
    flex-shrink: 0;
    height: 42px;
    justify-content: center;
    width: 42px;
}

.report-card-interactive p {
    color: var(--ink-2);
    line-height: 1.55;
    margin: 0;
}

.card-footer-action {
    align-items: center;
    color: var(--brand-mid);
    display: inline-flex;
    font-weight: 700;
    gap: 0.45rem;
}

.filter-button {
    min-height: 44px;
}

.reports-toolbar {
    align-items: end;
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    width: 100%;
}

.sales-report-toolbar-card {
    margin-top: 0.25rem;
    margin-bottom: 0.75rem !important;
    display: block !important;
    padding: 0.75rem 1rem !important;
    background: var(--card);
}

.sales-report-filter-form {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.filter-main-bar {
    display: grid;
    align-items: center;
    gap: 0.75rem;
    grid-template-columns: max-content minmax(160px, 1fr) auto auto;
    width: 100%;
}

.filter-dates-group {
    display: flex;
    align-items: center;
    background: white;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    padding: 2px 8px;
    height: 38px;
    min-width: 0;
}

.filter-input-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}

.filter-icon-prefix {
    color: var(--brand-2);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 6px;
}

.filter-dates-group .form-control.app-datepicker {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 4px !important;
    width: 105px !important;
    font-size: 0.88rem;
    color: var(--ink);
    font-weight: 500;
    height: auto;
}

.filter-separator {
    color: var(--muted);
    font-size: 0.85rem;
    padding: 0 4px;
}

.filter-select-wrapper {
    min-width: 0;
    width: auto;
}

.filter-select-wrapper {
    min-width: 132px;
}

.filter-select-wrapper .form-select {
    height: 38px;
    font-size: 0.88rem;
    font-weight: 500;
    color: var(--ink);
    border-radius: var(--radius-sm);
    border-color: var(--line);
}

.filter-main-actions {
    display: flex;
    gap: 0.5rem;
    flex-wrap: nowrap;
}

.btn-apply-filters {
    background-color: var(--brand-mid);
    border-color: var(--brand-mid);
    color: white;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 38px;
    padding: 0 0.9rem;
    border-radius: var(--radius-sm);
    font-size: 0.88rem;
    transition: var(--transition);
    border: 1px solid transparent;
}

.btn-apply-filters:hover {
    background-color: var(--brand);
    border-color: var(--brand);
    color: white;
    transform: translateY(-1px);
}

.btn-toggle-advanced {
    height: 38px;
    padding: 0 0.8rem;
    font-size: 0.88rem;
    font-weight: 600;
    border-radius: var(--radius-sm);
    border: 1px solid var(--line);
    background: white;
    color: var(--ink-2);
    display: inline-flex;
    align-items: center;
    transition: var(--transition);
}

.btn-toggle-advanced:hover {
    background: var(--bg);
    color: var(--brand);
}

.btn-toggle-advanced.is-active {
    background: var(--brand);
    color: white;
    border-color: var(--brand);
}

.filter-actions-spacer {
    display: none;
}

.filter-export-group {
    display: flex;
    gap: 0.5rem;
    flex-wrap: nowrap;
    justify-content: flex-end;
    margin-left: auto;
    min-width: 0;
}

.btn-export-excel, .btn-export-pdf {
    height: 38px;
    padding: 0 0.75rem;
    font-size: 0.82rem;
    font-weight: 600;
    border-radius: var(--radius-sm);
    display: inline-flex;
    align-items: center;
    transition: var(--transition);
    background: white;
    text-decoration: none !important;
}

.filter-export-group .btn-report-back {
    height: 38px;
    padding: 0 0.8rem;
    font-size: 0.82rem;
    font-weight: 600;
    border-radius: var(--radius-sm);
    white-space: nowrap;
    max-width: 100%;
}

.btn-export-excel {
    color: #2e7d32;
    border: 1px solid rgba(46, 125, 50, 0.3);
}
.btn-export-excel:hover {
    background: #e8f5e9;
    border-color: #2e7d32;
    color: #2e7d32;
    transform: translateY(-1px);
}

.btn-export-pdf {
    color: #c62828;
    border: 1px solid rgba(198, 40, 40, 0.3);
}
.btn-export-pdf:hover {
    background: #ffebee;
    border-color: #c62828;
    color: #c62828;
    transform: translateY(-1px);
}

/* Advanced filters panel */
.filter-advanced-panel {
    border-top: 1px dashed var(--line);
    padding-top: 0.75rem;
    margin-top: 0.25rem;
    animation: fadeSlideUp 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.filter-advanced-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, 1fr);
    width: 100%;
}

@media (max-width: 768px) {
    .filter-advanced-grid {
        grid-template-columns: 1fr;
    }
}

.filter-group {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.filter-label {
    font-size: 0.76rem;
    font-weight: 700;
    color: var(--ink-2);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.filter-advanced-grid .form-select {
    height: 38px;
    font-size: 0.88rem;
    font-weight: 500;
    border-radius: var(--radius-sm);
    border-color: var(--line);
}

.sales-report-summary-grid {
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(26, 74, 90, 0.08);
    border-radius: 18px;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0;
    margin: 0 !important;
    overflow: hidden;
}

.sales-report-analytics-shell {
    background: linear-gradient(180deg, rgba(247, 250, 251, 0.98), rgba(240, 246, 248, 0.98));
    border: 1px solid rgba(26, 74, 90, 0.06);
    border-radius: 24px;
    box-shadow: none;
    display: grid;
    gap: 0.75rem;
    padding: 0.95rem;
}

.inventory-report-toolbar-card {
    margin-top: 0.25rem;
}

.inventory-report-toolbar {
    align-items: center;
    display: grid;
    gap: 0.75rem;
    grid-template-columns: minmax(320px, 2fr) minmax(110px, 0.7fr) minmax(110px, 0.7fr) minmax(100px, 0.6fr) minmax(90px, 0.5fr) minmax(170px, 0.9fr);
    width: 100%;
}

.inventory-report-filter {
    min-width: 320px;
}

.inventory-report-category {
    width: 100%;
    height: 44px;
    font-size: 0.84rem;
}

.inventory-report-actions {
    display: contents;
}

.inventory-report-btn,
.inventory-report-back {
    width: 100%;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

.inventory-report-btn.btn-apply-filters {
    min-width: 108px;
}

.inventory-report-btn.btn-export-excel,
.inventory-report-btn.btn-export-pdf,
.inventory-report-back {
    padding-left: 0.7rem;
    padding-right: 0.7rem;
    font-size: 0.79rem;
}

.inventory-report-back {
    border-radius: var(--radius-sm);
}

.inventory-report-advanced-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.inventory-report-panels {
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}

.inventory-report-table-card {
    background: rgba(255, 255, 255, 0.72);
}

.inventory-report-table-head {
    margin-bottom: 0.85rem;
}

.inventory-report-table-head p {
    max-width: 46rem;
}

.inventory-report-table {
    min-width: 700px;
}

.inventory-report-table--wide {
    min-width: 880px;
}

.inventory-report-table thead th {
    background: rgba(26, 74, 90, 0.03);
    border-bottom: 1px solid rgba(26, 74, 90, 0.1);
}

.inventory-report-table tbody td {
    border-bottom: 1px solid rgba(26, 74, 90, 0.08);
    color: var(--ink-2);
    font-size: 0.92rem;
    line-height: 1.4;
}

.inventory-report-table tbody td strong {
    color: var(--ink);
}

.inventory-report-table .mono-pill {
    white-space: nowrap;
}

.report-section-heading-inline {
    align-items: center;
    column-gap: 1rem;
    grid-template-columns: minmax(0, 1fr) auto;
    margin-bottom: 0.9rem;
}

.report-section-heading-action {
    align-self: start;
}

.cash-report-table-card {
    background: rgba(255, 255, 255, 0.72);
}

.cash-report-table {
    min-width: 860px;
}

.cash-report-table thead th {
    background: rgba(26, 74, 90, 0.03);
    border-bottom: 1px solid rgba(26, 74, 90, 0.1);
}

.cash-report-table tbody td {
    border-bottom: 1px solid rgba(26, 74, 90, 0.08);
    color: var(--ink-2);
    font-size: 0.92rem;
    line-height: 1.4;
}

.cash-report-table-card .sales-report-panel-head p {
    max-width: none;
    white-space: nowrap;
}

.audit-report-filter-bar {
    grid-template-columns: minmax(250px, max-content) minmax(180px, 220px) auto minmax(0, 1fr) auto;
}

.audit-report-clear-btn {
    text-decoration: none !important;
}

.audit-report-summary-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.audit-report-table-card {
    background: rgba(255, 255, 255, 0.72);
}

.audit-report-table-head p {
    max-width: 46rem;
}

.audit-report-table-card .sales-report-panel-head p,
.audit-report-summary-grid + .sales-report-panels .sales-report-panel-head p {
    max-width: none;
}

.audit-report-summary-grid + .sales-report-panels .sales-report-panel:nth-child(2) .sales-report-panel-head p {
    white-space: nowrap;
}

.audit-report-table {
    min-width: 1180px;
}

.audit-report-table th:last-child,
.audit-report-table td:last-child {
    min-width: 340px;
}

.audit-report-payload-cell {
    min-width: 340px;
}

.audit-report-payload-block + .audit-report-payload-block {
    margin-top: 0.75rem;
}

.audit-report-payload-block strong {
    color: var(--ink);
    display: block;
    font-size: 0.82rem;
    letter-spacing: 0.04em;
    margin-bottom: 0.35rem;
    text-transform: uppercase;
}

.audit-report-payload-block pre {
    background: rgba(26, 74, 90, 0.04);
    border: 1px solid rgba(26, 74, 90, 0.08);
    border-radius: 12px;
    color: var(--ink-2);
    font-family: var(--font-mono);
    font-size: 0.75rem;
    margin: 0;
    padding: 0.75rem 0.85rem;
    white-space: pre-wrap;
    word-break: break-word;
}

.sales-report-kpi-card {
    background: transparent;
    border: 0;
    border-right: 1px solid rgba(26, 74, 90, 0.08);
    border-radius: 0;
    display: grid;
    gap: 0.3rem;
    min-height: 78px;
    padding: 0.8rem 0.95rem;
}

.sales-report-summary-grid > :last-child {
    border-right: 0;
}

.sales-report-kpi-card small {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.sales-report-kpi-card strong {
    color: var(--ink);
    font-family: var(--font-heading);
    font-size: 1.1rem;
    line-height: 1.15;
}

.sales-report-kpi-card--accent {
    background: linear-gradient(180deg, rgba(232, 246, 242, 0.76), rgba(223, 240, 236, 0.8));
}

.overview-report-summary-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 1rem !important;
}

.overview-report-summary-grid .sales-report-kpi-card strong span {
    color: var(--muted);
    font-family: var(--font-body);
    font-size: 0.9rem;
    font-weight: 500;
}

@media (max-width: 1440px) {
    .filter-main-bar {
        gap: 0.6rem;
        grid-template-columns: max-content minmax(146px, 1fr) auto auto;
    }

    .filter-dates-group {
        padding-inline: 6px;
    }

    .filter-dates-group .form-control.app-datepicker {
        width: 94px !important;
    }

    .filter-select-wrapper .form-select,
    .btn-apply-filters,
    .btn-toggle-advanced,
    .btn-export-excel,
    .btn-export-pdf,
    .filter-export-group .btn-report-back {
        font-size: 0.82rem;
    }

    .filter-export-group {
        gap: 0.4rem;
    }
}

@media (max-width: 1280px) {
    .filter-main-bar {
        gap: 0.6rem;
        grid-template-columns: max-content minmax(140px, 1fr) auto auto;
    }

    .filter-dates-group {
        padding-inline: 6px;
    }

    .filter-dates-group .form-control.app-datepicker {
        font-size: 0.84rem;
        width: 92px !important;
    }

    .filter-separator {
        padding: 0 2px;
    }

    .filter-select-wrapper .form-select,
    .btn-apply-filters,
    .btn-toggle-advanced,
    .btn-export-excel,
    .btn-export-pdf,
    .filter-export-group .btn-report-back {
        font-size: 0.8rem;
    }

    .inventory-report-toolbar {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .inventory-report-filter {
        grid-column: 1 / -1;
        min-width: 0;
    }

    .inventory-report-category,
    .inventory-report-btn,
    .inventory-report-back {
        font-size: 0.77rem;
    }

    .audit-report-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1180px) {
    .filter-main-bar {
        grid-template-columns: minmax(240px, 1fr) minmax(180px, 220px) auto;
    }

    .filter-actions-spacer {
        display: none;
    }

    .filter-export-group {
        grid-column: 1 / -1;
        justify-content: flex-end;
        margin-left: 0;
        flex-wrap: wrap;
        width: 100%;
        min-width: 0;
    }

    .sales-report-summary-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .overview-report-summary-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .sales-report-kpi-card {
        border-right: 1px solid rgba(26, 74, 90, 0.08);
        border-bottom: 1px solid rgba(26, 74, 90, 0.08);
    }

    .audit-report-filter-bar {
        grid-template-columns: minmax(240px, 1fr) minmax(180px, 220px) auto;
    }

    .audit-report-filter-bar .filter-actions-spacer {
        display: none;
    }

    .audit-report-filter-bar .filter-export-group {
        grid-column: 1 / -1;
        width: 100%;
    }
}

@media (max-width: 980px) {
    .filter-main-bar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: stretch;
    }

    .filter-dates-group,
    .filter-select-wrapper,
    .filter-main-actions,
    .filter-export-group {
        width: 100%;
    }

    .filter-main-actions,
    .filter-export-group {
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .sales-report-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .overview-report-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .audit-report-filter-bar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .inventory-report-filter {
        grid-column: 1 / -1;
    }

    .inventory-report-toolbar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .inventory-report-advanced-grid {
        grid-template-columns: 1fr;
    }

    .inventory-report-table {
        min-width: 640px;
    }

    .inventory-report-table--wide {
        min-width: 760px;
    }

    .cash-report-table {
        min-width: 760px;
    }

    .audit-report-table {
        min-width: 960px;
    }

    .audit-report-summary-grid + .sales-report-panels .sales-report-panel:nth-child(2) .sales-report-panel-head p {
        white-space: normal;
    }
}

@media (max-width: 640px) {
    .sales-report-panel-head p.sales-report-panel-copy--inline {
        white-space: normal;
    }

    .sale-header-grid {
        gap: 0;
    }

    .sale-tax-inline {
        grid-template-columns: 1fr;
        gap: 0.55rem;
    }

    .sale-tax-inline__label-helper {
        display: none;
    }

    .sale-line {
        grid-template-columns: 1fr;
        gap: 0.65rem;
    }

    .sale-line__product-row,
    .sale-line__fields-row {
        grid-template-columns: 1fr;
    }

    .sale-line__total-row {
        grid-template-columns: minmax(0, 1fr) auto auto;
    }

    .sale-product-search-bar-group--detail {
        gap: 0.5rem;
        grid-template-columns: minmax(0, 1fr) auto auto;
    }

    .sale-line__product-col,
    .sale-line__presentation-col,
    .sale-line__qty-col,
    .sale-line__price-col,
    .sale-line__discount-col,
    .sale-line__total-col,
    .sale-line__action-col,
    .sale-line__add-slot {
        grid-column: 1 / -1;
    }

    .sale-line__action-col,
    .sale-line__add-slot {
        grid-column: auto;
    }

    .sale-line__total-col {
        grid-column: 1 / -1;
    }

    .sale-line__action-label {
        display: none;
    }

    .sale-line__total-row {
        align-items: stretch;
    }

    .sale-line__remove-btn {
        width: 100%;
    }

    .sale-line__add-slot .sale-line__add-btn {
        width: 100%;
    }

    .filter-main-bar {
        grid-template-columns: 1fr;
    }

    .filter-dates-group {
        width: 100%;
    }

    .filter-input-wrapper {
        flex: 1 1 0;
        min-width: 0;
    }

    .filter-dates-group .form-control.app-datepicker {
        min-width: 0;
        width: 100% !important;
    }

    .filter-main-actions .btn,
    .filter-export-group .btn {
        flex: 1 1 100%;
        justify-content: center;
    }

    .sales-report-summary-grid {
        grid-template-columns: 1fr;
    }

    .overview-report-summary-grid {
        grid-template-columns: 1fr;
    }

    .sales-report-kpi-card {
        border-right: 0;
    }

    .audit-report-filter-bar {
        grid-template-columns: 1fr;
    }

    .inventory-report-table-head p {
        max-width: none;
    }

    .inventory-report-table,
    .inventory-report-table--wide {
        min-width: 620px;
    }

    .inventory-report-toolbar {
        grid-template-columns: 1fr 1fr;
    }

    .inventory-report-filter {
        grid-column: 1 / -1;
    }

    .inventory-report-btn,
    .inventory-report-back {
        width: 100%;
    }

    .inventory-report-back {
        grid-column: 1 / -1;
    }

    .report-section-heading-inline {
        grid-template-columns: 1fr;
    }

    .report-section-heading-action {
        justify-self: start;
    }

    .cash-report-table {
        min-width: 700px;
    }

    .cash-report-table-card .sales-report-panel-head p {
        white-space: normal;
    }

    .audit-report-summary-grid {
        grid-template-columns: 1fr;
    }

    .audit-report-table {
        min-width: 820px;
    }
}

.sales-report-analytics-shell .sales-report-panels {
    align-items: start;
    gap: 0.75rem;
    grid-template-columns: 1fr;
}

.sales-report-panel {
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(26, 74, 90, 0.08);
    border-radius: 18px;
    box-shadow: none;
    height: auto;
    padding: 0.95rem 1rem;
    align-self: start;
}

.sales-report-panel-head {
    gap: 0.3rem;
    margin-bottom: 0.65rem;
}

.sales-report-panel-head h2 {
    margin-bottom: 0;
}

.sales-report-panel-head p {
    color: var(--muted);
    margin: 0;
    max-width: 28rem;
}

.sales-report-panel-head p.sales-report-panel-copy--inline {
    max-width: none;
    white-space: nowrap;
}

.sales-report-list {
    display: grid;
    gap: 0;
}

.sales-report-list-item {
    align-items: center;
    background: transparent;
    border: 0;
    border-top: 1px solid rgba(26, 74, 90, 0.08);
    border-radius: 0;
    display: grid;
    gap: 0.7rem;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 0.8rem 0.1rem;
}

.sales-report-list > :first-child {
    border-top: 0;
}

.sales-report-list-item--ranked {
    grid-template-columns: auto minmax(0, 1fr) auto;
}

.sales-report-list-copy {
    min-width: 0;
}

.sales-report-list-copy strong {
    color: var(--ink);
    display: block;
    font-size: 0.98rem;
    margin-bottom: 0.18rem;
}

.sales-report-list-copy p {
    color: var(--muted);
    margin: 0;
}

.sales-report-list-value {
    color: var(--brand);
    font-family: var(--font-heading);
    font-size: 1rem;
    font-weight: 800;
    text-align: right;
    white-space: nowrap;
}

.sales-report-list-pill,
.sales-report-rank {
    align-items: center;
    background: rgba(26, 74, 90, 0.08);
    border-radius: 999px;
    color: var(--brand);
    display: inline-flex;
    font-size: 0.84rem;
    font-weight: 800;
    justify-content: center;
    min-width: 2.1rem;
    padding: 0.35rem 0.65rem;
}

.sales-report-rank {
    background: rgba(42, 157, 143, 0.14);
}

.search-toolbar {
    align-items: center;
    display: grid;
    gap: 0.75rem;
    grid-template-columns: minmax(0, 1fr) auto;
    width: 100%;
}

.search-toolbar-input {
    min-width: 0;
    width: 100%;
}

.search-toolbar-input .search-input {
    min-width: 0;
    width: 100%;
}

.search-input-control {
    border-radius: 0.75rem;
    height: 44px;
    width: 100%;
}

.search-input {
    border-radius: 0.75rem;
    height: 44px;
    width: 100%;
}

.search-toolbar-actions {
    align-items: center;
    display: flex;
    flex-shrink: 0;
    gap: 0.5rem;
    justify-content: flex-start;
    white-space: nowrap;
}

.pagination-container {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem 1.25rem;
    justify-content: space-between;
    margin-top: 1rem;
}

.pagination-size,
.pagination-nav,
.pagination-mobile,
.pagination-size__options,
.pagination-list {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.pagination-size {
    color: var(--ink-2);
}

.pagination-size__label {
    font-size: 0.85rem;
    font-weight: 600;
}

.pagination-info,
.pagination-mobile__status,
.pagination-empty {
    color: var(--muted);
    font-size: 0.9rem;
}

.pagination-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.pagination-mobile {
    display: none;
}

.pagination-btn,
.pagination-ellipsis {
    align-items: center;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--ink-2);
    display: inline-flex;
    font-size: 0.88rem;
    font-weight: 600;
    justify-content: center;
    min-height: 36px;
    min-width: 36px;
    padding: 0.45rem 0.85rem;
    text-decoration: none;
}

.pagination-btn:hover {
    background: rgba(26, 74, 90, 0.05);
    color: var(--brand);
    text-decoration: none;
}

.pagination-btn.active {
    background: linear-gradient(135deg, var(--brand) 0%, var(--brand-mid) 100%);
    border-color: transparent;
    box-shadow: 0 8px 18px rgba(26, 74, 90, 0.18);
    color: white;
}

.pagination-btn.disabled {
    cursor: default;
    opacity: 0.55;
}

.pagination-ellipsis {
    background: transparent;
    border-color: transparent;
    min-width: 24px;
    padding-inline: 0.2rem;
}

.product-management-card .header-actions-row {
    display: grid;
    gap: 0.75rem;
}

.product-management-card .header-actions-copy {
    display: grid;
    gap: 0.3rem;
    min-width: 0;
}

.product-management-card .header-actions-copy p {
    margin: 0;
    max-width: none;
    white-space: nowrap;
}

.product-management-card .product-actions-row,
.product-management-card .product-actions-row .col-12 {
    width: 100%;
    max-width: none;
}

.product-management-card .product-actions-wrapper {
    display: block;
    margin-left: 0;
    max-width: none;
    min-width: 100%;
    width: 100%;
}

.product-management-card .product-actions {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    justify-content: stretch;
    max-width: none;
    min-width: 100%;
    width: 100%;
}

.product-management-card .product-actions > * {
    min-width: 0;
}

.product-management-card .product-action-btn {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    min-height: 44px;
    min-width: 0;
    text-align: center;
    white-space: nowrap;
    width: 100%;
}

/* Productos: diseño adaptable específico de página */
.products-page .products-actions-grid.product-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    width: 100%;
}

.products-page .products-icon-btn {
    align-items: center;
    border-radius: var(--radius-sm);
    display: flex;
    flex: 1 1 0%;
    height: 42px;
    justify-content: center;
    min-height: 42px;
    min-width: 42px;
    overflow: visible;
    padding: 0;
    position: relative;
}

.products-page .products-icon-btn svg {
    display: block;
    flex-shrink: 0;
}


/* Importar productos: diseño específico de página */
.product-import-page {
    display: grid;
}

.product-import-card {
    padding: 1.4rem;
}

.product-import-layout {
    align-items: start;
    display: grid;
    gap: 2rem;
    grid-template-columns: 1fr;
}

.product-import-instructions {
    border-top: 1px solid var(--line);
    padding-top: 1.75rem;
}

.product-import-heading-row {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

/* Unidades de medida: diseño específico de página */
.units-page {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.units-card {
    border: 1px solid rgba(26, 74, 90, 0.09);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    margin-bottom: 0 !important;
}

.units-header-row {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: space-between;
}

.units-header-title {
    font-size: 1.15rem;
    font-weight: 700;
    margin: 0;
}

.units-header-actions {
    display: flex;
    align-items: center;
}

.units-back-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    border-radius: var(--radius-sm);
    white-space: nowrap;
}

.units-divider {
    border: 0;
    border-top: 1px solid rgba(26, 74, 90, 0.08);
    opacity: 1;
    margin: 1.25rem 0;
}

.units-form-grid {
    display: grid;
    gap: 1rem;
    align-items: flex-end;
    grid-template-columns: repeat(6, 1fr);
}

.units-field-code,
.units-field-name {
    grid-column: span 3;
}

.units-field-symbol,
.units-field-type,
.units-field-decimals {
    grid-column: span 2;
}

.units-field-decimals {
    padding-bottom: 0.55rem;
}

.units-actions {
    display: flex;
    justify-content: center;
    margin-top: 1.25rem;
}

.units-actions .btn {
    min-width: 160px;
}

.units-table-wrapper {
    overflow-x: auto;
}

.units-pagination {
    border-top: 1px solid rgba(26, 74, 90, 0.08);
    margin-top: 0;
    padding: 0.75rem 1.35rem 1rem;
}

@media (max-width: 768px) {
    .units-header-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }
    .units-header-actions {
        width: 100%;
    }
    .units-header-actions .btn {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 575.98px) {
    .units-form-grid {
        grid-template-columns: 1fr;
        gap: 0.85rem;
        align-items: stretch;
    }
    .units-field-code,
    .units-field-name,
    .units-field-symbol,
    .units-field-type,
    .units-field-decimals {
        grid-column: auto;
    }
    .units-field-decimals {
        padding-bottom: 0;
    }
    .units-actions .btn {
        width: 100%;
    }
}

/* Pantalla de etiquetas: diseño específico de página */
.labels-page {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.labels-page .sales-report-toolbar-card {
    padding-bottom: 0.95rem !important;
    margin-bottom: 0 !important;
}

.labels-page .inventory-report-toolbar {
    grid-template-columns: minmax(280px, 2.5fr) minmax(110px, 1fr) minmax(110px, 1fr) minmax(180px, 1.5fr);
}

.labels-results-text {
    position: absolute;
    top: calc(100% + 1px);
    left: 4px;
    font-size: 0.76rem;
    color: var(--muted);
    white-space: nowrap;
    pointer-events: none;
}

.labels-print-settings {
    display: grid;
    gap: 1.25rem;
    align-items: flex-end;
    grid-template-columns: minmax(220px, 1.2fr) auto auto;
    width: 100%;
}

.labels-print-settings .form-select,
.labels-print-settings .btn {
    height: 44px;
    border-radius: var(--radius-sm);
}

.labels-print-settings .labels-price-group {
    padding-bottom: 0.55rem;
}

.labels-actions-panel {
    background: #f7f9fa;
    border: 1px solid rgba(26, 74, 90, 0.08);
    border-radius: var(--radius-sm);
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.labels-actions-header {
    display: block;
}

.labels-actions-title {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--ink);
    display: block;
    margin-bottom: 0.15rem;
}

.labels-quick-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.labels-quick-actions .btn-compact {
    height: 36px;
    padding: 0 0.85rem;
    font-size: 0.85rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-sm);
    white-space: nowrap;
}

.labels-table-wrapper {
    overflow-x: auto;
}

.labels-quantity-input {
    width: 90px;
    height: 36px;
    text-align: center;
    display: inline-block;
    border-radius: var(--radius-sm);
}

@media (max-width: 991.98px) {
    .labels-page .sales-report-toolbar-card {
        padding-bottom: 0.75rem !important;
    }
    
    .labels-results-text {
        position: static;
        display: block;
        margin-top: 0.1rem;
        margin-bottom: 0.5rem;
    }

    .labels-page .inventory-report-toolbar {
        grid-template-columns: 1fr 1fr 1fr;
    }
    
    .labels-print-settings {
        grid-template-columns: 1fr auto;
    }
    
    .labels-print-settings .labels-submit-group {
        grid-column: span 2;
        width: 100%;
    }
    
    .labels-print-settings .labels-submit-btn {
        width: 100%;
    }
}

@media (max-width: 575.98px) {
    .labels-page .inventory-report-toolbar {
        grid-template-columns: 1fr;
    }
    
    .labels-print-settings {
        grid-template-columns: 1fr;
        gap: 0.85rem;
        align-items: stretch;
    }
    
    .labels-print-settings .labels-submit-group {
        grid-column: auto;
    }
    
    .labels-print-settings .labels-price-group {
        padding-bottom: 0;
    }
    
    .labels-quick-actions {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 0.45rem;
    }
    
    .labels-quick-actions .btn-compact {
        width: 100%;
    }
    
    .labels-quantity-input {
        width: 100%;
    }
}

/* Promociones y combos: diseño específico de página */
.commercial-center-page {
    display: grid;
    gap: 1.25rem;
}

.commercial-center-card {
    display: grid;
    gap: 0;
    padding: 1.35rem;
}

.commercial-header-row {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 0.5rem;
}

.commercial-center-title {
    font-family: var(--font-heading);
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.15;
    margin: 0;
}

.commercial-header-actions {
    align-items: center;
    display: flex;
    flex-shrink: 0;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.commercial-description {
    color: var(--muted);
    font-size: 0.88rem;
    margin-top: 0;
    margin-bottom: 1.25rem;
}

.commercial-filters {
    align-items: center;
    display: grid;
    gap: 0.65rem;
    grid-template-columns: minmax(0, 1fr) minmax(160px, 220px) minmax(110px, 150px) auto;
    margin-bottom: 1.25rem;
}

.commercial-filters .form-control,
.commercial-filters .form-select {
    min-height: 42px;
}

.commercial-kpi-grid {
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(26, 74, 90, 0.08);
    border-radius: 18px;
    display: grid;
    gap: 0;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 1.25rem;
    overflow: hidden;
    width: 100%;
}

.commercial-kpi-card {
    background: transparent;
    border: 0;
    border-right: 1px solid rgba(26, 74, 90, 0.08);
    border-radius: 0;
    display: grid;
    gap: 0.3rem;
    min-height: 78px;
    padding: 0.8rem 0.95rem;
    align-content: center;
}

.commercial-kpi-card:last-child {
    border-right: 0;
}

.commercial-kpi-card small {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.commercial-kpi-card strong {
    color: var(--ink);
    font-family: var(--font-heading);
    font-size: 1.1rem;
    line-height: 1.15;
    font-weight: 800;
}

.commercial-section {
    border-top: 1px solid rgba(26, 74, 90, 0.08);
    margin-top: 1.25rem;
    padding-top: 1.25rem;
}

.commercial-section .section-heading {
    margin-bottom: 0.8rem;
}

.commercial-section .section-heading h3 {
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
}

.commercial-highlights {
    border-top: 1px solid rgba(26, 74, 90, 0.08);
    display: grid;
    gap: 0 2rem;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    margin-top: 1.25rem;
}

.commercial-highlights .commercial-section {
    border-top: 0;
    margin-top: 0;
}

.commercial-profile-list {
    display: grid;
    gap: 0.4rem;
}

.commercial-profile-item {
    background: rgba(26, 74, 90, 0.03);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    padding: 0.6rem 0.9rem;
}

.commercial-profile-item p {
    margin: 0.1rem 0 0;
}

.commercial-empty-state {
    color: var(--muted);
    font-size: 0.9rem;
    margin: 0;
    padding: 0.15rem 0;
}

.commercial-table-section {
    background: rgba(26, 74, 90, 0.02);
    border: 1px solid rgba(26, 74, 90, 0.08);
    border-radius: var(--radius-sm);
    overflow: hidden;
}

.commercial-table-card {
    background: var(--card);
    border: 1px solid rgba(26, 74, 90, 0.09);
    border-radius: var(--radius);
    box-shadow: 0 4px 16px rgba(26, 74, 90, 0.06);
    overflow: hidden;
    padding: 1.25rem 1.35rem 0;
}

.commercial-table-card .section-heading {
    margin-bottom: 1rem;
}

.commercial-table-card .section-heading h3 {
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0 0 0.2rem;
}

.commercial-table-card .section-heading p {
    font-size: 0.88rem;
    line-height: 1.45;
    margin: 0;
}

.commercial-table-card .cc-pagination {
    border-top: 1px solid rgba(26, 74, 90, 0.08);
    margin-top: 0;
    padding: 0.75rem 1.35rem 1rem;
}

@media (max-width: 991.98px) {
    .commercial-filters {
        grid-template-columns: 1fr 1fr auto;
    }

    .commercial-filters .commercial-filters__search {
        grid-column: 1 / -1;
    }

    .commercial-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .commercial-kpi-card {
        border-right: 1px solid rgba(26, 74, 90, 0.08);
        border-bottom: 1px solid rgba(26, 74, 90, 0.08);
    }

    .commercial-kpi-card:nth-child(2n) {
        border-right: 0;
    }

    .commercial-kpi-card:nth-child(n+3) {
        border-bottom: 0;
    }

    .commercial-highlights {
        grid-template-columns: 1fr;
    }

    .commercial-highlights .commercial-section + .commercial-section {
        border-top: 1px solid rgba(26, 74, 90, 0.08);
        margin-top: 1.25rem;
        padding-top: 1.25rem;
    }
}

@media (max-width: 575.98px) {
    .commercial-center-card {
        padding: 1rem;
    }

    .commercial-header-row {
        flex-direction: column;
        align-items: stretch;
    }

    .commercial-header-actions {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 0.5rem;
    }

    .commercial-header-actions .btn {
        width: 100%;
        justify-content: center;
        display: inline-flex;
    }

    .commercial-filters {
        grid-template-columns: 1fr;
    }

    .commercial-filters .commercial-filters__search {
        grid-column: auto;
    }

    .commercial-kpi-grid {
        grid-template-columns: 1fr;
        gap: 0.45rem;
        background: transparent;
        border: 0;
        overflow: visible;
        margin-bottom: 1rem;
    }

    .commercial-kpi-card {
        background: rgba(255, 255, 255, 0.72);
        border: 1px solid rgba(26, 74, 90, 0.08) !important;
        border-radius: 14px !important;
        min-height: 72px;
    }
}

.product-import-form {
    display: grid;
    gap: 0.9rem;
    margin-top: 1rem;
}

.product-import-dropzone {
    align-items: center;
    background: rgba(26, 74, 90, 0.03);
    border: 2px dashed rgba(26, 74, 90, 0.18);
    border-radius: var(--radius);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    outline-offset: 3px;
    padding: 2rem 1.5rem;
    position: relative;
    text-align: center;
    transition: background var(--transition), border-color var(--transition);
    user-select: none;
}

.product-import-dropzone:hover,
.product-import-dropzone--drag {
    background: rgba(42, 157, 143, 0.06);
    border-color: var(--brand-2);
}

.product-import-dropzone--selected {
    background: rgba(42, 157, 143, 0.05);
    border-color: var(--brand-2);
    border-style: solid;
}

.product-import-dropzone__input {
    height: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    width: 0;
}

.product-import-dropzone__icon {
    color: var(--muted);
}

.product-import-dropzone__label {
    color: var(--ink);
    font-size: 0.92rem;
    font-weight: 600;
    margin: 0;
    word-break: break-all;
}

.product-import-dropzone--selected .product-import-dropzone__label {
    color: var(--brand);
}

.product-import-dropzone__hint {
    color: var(--muted);
    font-size: 0.78rem;
    margin: 0;
}

.product-import-file-alert {
    align-items: center;
    background: rgba(192, 57, 43, 0.08);
    border: 1px solid rgba(192, 57, 43, 0.2);
    border-radius: var(--radius-sm);
    color: var(--danger);
    display: flex;
    font-size: 0.87rem;
    font-weight: 600;
    gap: 0.5rem;
    padding: 0.6rem 0.85rem;
}

.product-import-actions {
    display: flex;
    gap: 0.65rem;
    justify-content: center;
}

.product-import-actions .btn {
    min-height: 44px;
    min-width: 160px;
}

.product-import-field-list {
    display: grid;
    gap: 0.3rem;
    margin-top: 0.85rem;
}

.product-import-field {
    background: rgba(26, 74, 90, 0.03);
    border-left: 3px solid transparent;
    border-radius: 8px;
    padding: 0.45rem 0.75rem;
}

.product-import-field--required {
    background: rgba(42, 157, 143, 0.05);
    border-left-color: rgba(42, 157, 143, 0.6);
}

.product-import-field__head {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.12rem;
}

.product-import-field__name {
    background: transparent;
    color: var(--brand);
    font-family: var(--font-mono);
    font-size: 0.8rem;
    font-weight: 700;
    padding: 0;
}

.product-import-field__badge {
    background: rgba(42, 157, 143, 0.12);
    border-radius: 999px;
    color: #1d6b3e;
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    padding: 0.1rem 0.45rem;
    text-transform: uppercase;
    white-space: nowrap;
}

.product-import-field__badge--opt {
    background: rgba(30, 45, 56, 0.07);
    color: var(--muted);
}

.product-import-field__desc {
    color: var(--muted);
    font-size: 0.8rem;
    line-height: 1.4;
    margin: 0;
}

@media (max-width: 575.98px) {
    .product-import-card {
        padding: 1rem;
    }

    .product-import-dropzone {
        padding: 1.5rem 1rem;
    }

    .product-import-actions {
        flex-direction: column;
    }

    .product-import-actions .btn {
        width: 100%;
    }
}

.reports-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.report-card {
    background: rgba(255, 253, 249, 0.96);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 12px 24px rgba(20, 31, 44, 0.05);
    color: var(--ink);
    display: block;
    min-height: 145px;
    padding: 1rem 1.1rem;
    position: relative;
    transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
}

.report-card::after {
    content: none;
}

.report-card:hover {
    border-color: rgba(42,157,143,0.35);
    box-shadow: 0 18px 32px rgba(20, 31, 44, 0.09);
    text-decoration: none;
    transform: translateY(-3px);
}

.report-card strong {
    color: var(--brand);
    display: block;
    font-size: 1rem;
    margin-bottom: 0.45rem;
}

.report-card p {
    color: var(--muted);
    font-size: 0.9rem;
    line-height: 1.4;
    margin: 0;
}

@media (max-width: 1100px) {
    .reports-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .reports-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

.reports-split {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.detail-head-wrap {
    gap: 1rem;
}

.inventory-alert-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.inventory-alert-card {
    background: rgba(255, 253, 249, 0.96);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 12px 24px rgba(20, 31, 44, 0.05);
    padding: 1rem;
}

.inventory-alert-card.bajo {
    border-color: rgba(242, 153, 74, 0.38);
}

.inventory-alert-card.critico,
.inventory-alert-card.agotado {
    border-color: rgba(214, 48, 49, 0.34);
}

.inventory-alert-head {
    align-items: center;
    display: flex;
    gap: 0.6rem;
    justify-content: space-between;
    margin-bottom: 0.45rem;
}

.inventory-alert-metrics {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 0.9rem;
}

.inventory-alert-metrics small {
    color: var(--muted);
    display: block;
    margin-bottom: 0.15rem;
}

.inventory-alert-metrics strong {
    color: var(--brand);
    display: block;
}

.inventory-focus-grid {
    display: grid;
    gap: 0.9rem;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.inventory-focus-card {
    background: rgba(255, 253, 249, 0.96);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 10px 22px rgba(20, 31, 44, 0.05);
    padding: 1rem;
}

.inventory-focus-head {
    align-items: start;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
}

.inventory-focus-metrics {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 0.85rem;
}

.inventory-focus-metrics small {
    color: var(--muted);
    display: block;
    margin-bottom: 0.15rem;
}

.inventory-focus-metrics strong {
    color: var(--brand);
    display: block;
}

.checkbox-card {
    align-items: center;
    background: rgba(26,74,90,0.04);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: flex;
    gap: 0.55rem;
    height: 45px;
    min-height: 45px;
    padding: 0.5rem 1rem;
}

.checkbox-card input {
    margin: 0;
}

.sale-tax-inline {
    align-items: end;
    display: grid;
    gap: 0.75rem;
    grid-template-columns: minmax(110px, 150px) minmax(160px, 1fr);
}

.sale-tax-inline__percent,
.sale-tax-inline__toggle {
    min-width: 0;
}

.sale-tax-inline__label-helper {
    visibility: hidden;
}

.sale-line {
    align-items: end;
    display: grid;
    gap: 0.75rem 1rem;
    grid-template-columns: repeat(12, minmax(0, 1fr));
}

.sale-line__header,
.sale-line__meta-row {
    grid-column: 1 / -1;
}

.sale-line__product-col {
    grid-column: 1 / -1;
    min-width: 0;
}

.sale-line__presentation-col {
    grid-column: span 4;
    min-width: 0;
}

.sale-line__qty-col {
    grid-column: span 2;
    min-width: 0;
}

.sale-line__price-col {
    grid-column: span 3;
    min-width: 0;
}

.sale-line__discount-col {
    grid-column: span 2;
    min-width: 0;
}

.sale-line__total-col {
    grid-column: span 4;
    min-width: 0;
}

.sale-line__action-col {
    grid-column: span 1;
    min-width: 0;
}

.sale-line__action-label {
    visibility: hidden;
}

.sale-line__remove-btn {
    min-height: 45px;
    padding-inline: 0;
    width: 100%;
}

.sale-line {
    align-items: stretch;
    display: grid;
    gap: 0.8rem;
    grid-template-columns: 1fr;
}

.sale-line__product-row,
.sale-line__fields-row,
.sale-line__total-row {
    align-items: end;
    display: grid;
    gap: 0.75rem;
}

.sale-line__product-row {
    grid-template-columns: minmax(0, 1fr);
}

.sale-line__fields-row {
    border-top: 0 !important;
    box-shadow: none;
    grid-template-columns: minmax(220px, 1.5fr) minmax(90px, 0.55fr) minmax(160px, 0.95fr) minmax(120px, 0.7fr);
}

.sale-line__total-row {
    grid-template-columns: minmax(130px, 190px) auto auto;
    justify-content: end;
}

.sale-line__product-row .sale-line__product-col,
.sale-line__fields-row .sale-line__presentation-col,
.sale-line__fields-row .sale-line__qty-col,
.sale-line__fields-row .sale-line__price-col,
.sale-line__fields-row .sale-line__discount-col,
.sale-line__total-row .sale-line__total-col,
.sale-line__total-row .sale-line__action-col,
.sale-line__total-row .sale-line__add-slot {
    border-top: 0 !important;
    box-shadow: none;
    grid-column: auto;
    min-width: 0;
}

.sale-product-search-bar-group--detail {
    align-items: center;
    display: grid;
    gap: 0.75rem;
    grid-template-columns: minmax(0, 1fr) auto auto;
    width: 100%;
}

.sale-product-actions {
    display: inline-flex;
    gap: 0.5rem;
}

.sale-product-action-btn,
.sale-product-actions .btn,
.sale-product-search-bar-group--detail > .btn {
    align-items: center;
    display: inline-flex;
    height: 44px;
    justify-content: center;
    min-height: 44px;
    padding: 0;
    width: 44px;
}

.sale-line__meta-row {
    align-self: start;
}

.sale-line__meta-row .field-tip {
    margin-top: 0;
}

.sale-line__meta-row--presentation {
    margin-top: 0.38rem;
}

.sale-line__action-col {
    align-self: end;
}

.sale-line__remove-btn {
    min-width: 68px;
}

.sale-line__add-slot {
    align-self: end;
}

.sale-line__add-slot .sale-line__add-btn {
    min-height: 45px;
    white-space: nowrap;
}

.sale-line__add-toolbar:empty {
    display: none;
    margin: 0 !important;
}

.sale-detail-page .sale-line__product-row {
    border-bottom: 0 !important;
    box-shadow: none !important;
    margin-bottom: 0.55rem;
    padding-bottom: 0 !important;
    position: relative;
}

.sale-detail-page .sale-line__product-row::after {
    background: var(--card);
    bottom: -0.2rem;
    content: "";
    display: block !important;
    height: 6px;
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    z-index: 3;
}

.sale-detail-page .sale-line__fields-row {
    align-items: start;
    border-top: 0 !important;
    box-shadow: none !important;
    margin-top: 0.15rem;
    padding-top: 0 !important;
}

.sale-detail-page .sale-line__product-row::before,
.sale-detail-page .sale-line__fields-row::before,
.sale-detail-page .sale-line__presentation-col::before,
.sale-detail-page .sale-line__presentation-col::after {
    content: none !important;
    display: none !important;
}

.sale-detail-page .sale-line__presentation-col,
.sale-detail-page .sale-line__qty-col,
.sale-detail-page .sale-line__price-col,
.sale-detail-page .sale-line__discount-col {
    align-self: start;
}

.sale-detail-page .sale-line__presentation-col .form-select,
.sale-detail-page .sale-line__qty-col .form-control,
.sale-detail-page .sale-line__price-col .form-control,
.sale-detail-page .sale-line__discount-col .form-control {
    margin-top: 0;
}

.sale-detail-page .sale-line__meta-row--presentation {
    margin-top: 0.45rem;
}

.sale-header-grid {
    align-items: end;
}

.sale-header-grid__item {
    min-width: 0;
}

@media (min-width: 768px) {
    .sale-header-grid {
        display: grid;
        gap: 1rem;
        grid-template-columns: minmax(220px, 1.3fr) minmax(160px, 0.95fr) minmax(260px, 1.1fr);
    }

    .sale-header-grid > [class*="col-"] {
        flex: initial;
        max-width: none;
        padding-left: 0;
        padding-right: 0;
        width: auto;
    }
}

@media (max-width: 960px) and (min-width: 768px) {
    .sale-header-grid {
        gap: 0.85rem;
        grid-template-columns: minmax(200px, 1fr) minmax(150px, 0.9fr) minmax(240px, 1fr);
    }

    .sale-tax-inline {
        gap: 0.6rem;
        grid-template-columns: minmax(96px, 120px) minmax(140px, 1fr);
    }

    .sale-line {
        gap: 0.7rem 0.85rem;
    }

    .sale-line__product-col {
        grid-column: 1 / -1;
    }

    .sale-line__presentation-col {
        grid-column: span 4;
    }

    .sale-line__qty-col,
    .sale-line__discount-col,
    .sale-line__action-col {
        grid-column: span 2;
    }

    .sale-line__price-col,
    .sale-line__total-col {
        grid-column: span 3;
    }

    .sale-line__fields-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sale-line__total-row {
        grid-template-columns: minmax(130px, 190px) auto auto;
        justify-content: end;
    }
}

.user-status-check {
    align-items: center;
    display: flex;
    height: 46px;
    min-height: 46px;
    padding: 0 1rem;
}

.tls-check-container {
    align-items: center;
    display: flex;
    gap: 0.55rem;
    height: 46px;
    min-height: 46px;
    margin: 0;
    padding: 0 1rem;
}

.tls-check-container input {
    flex-shrink: 0;
    height: 16px;
    margin: 0;
    width: 16px;
}

.tls-check-container span {
    font-size: 0.9rem;
    line-height: 1;
}

.btn-test-email {
    align-items: center;
    display: inline-flex;
    height: 46px;
    justify-content: center;
    padding-bottom: 0;
    padding-top: 0;
}

.mail-settings-form {
    width: 100%;
}

.mail-settings-card {
    border-radius: 24px;
    box-shadow: 0 18px 40px rgba(20, 47, 61, 0.12);
    display: grid;
    gap: 1.5rem;
    padding: 1.25rem;
}

.mail-settings-header {
    display: grid;
    gap: 0;
}

.mail-settings-header h2 {
    font-size: 1.7rem;
    line-height: 1.05;
    margin: 0;
}

.mail-settings-header p {
    line-height: 1.15;
    margin: 0;
}

.mail-settings-section {
    display: grid;
    gap: 1rem;
}

.mail-settings-section + .mail-settings-section {
    border-top: 1px solid rgba(26, 74, 90, 0.1);
    padding-top: 1.35rem;
}

.mail-settings-section-heading {
    margin-bottom: 0;
}

.mail-settings-section-heading h3 {
    line-height: 1.05;
    margin-bottom: 0;
}

.mail-settings-section-heading p {
    line-height: 1.15;
    margin: 0;
}

.mail-smtp-grid {
    align-items: end;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(220px, 1.35fr) minmax(110px, 0.65fr) minmax(220px, 1fr) minmax(240px, 1fr);
}

.mail-field {
    display: grid;
    gap: 0.45rem;
    min-width: 0;
}

.mail-smtp-grid .mail-field:nth-child(n + 5) {
    grid-column: span 2;
}

.mail-smtp-grid .form-control,
.mail-test-grid .form-control,
.mail-tls-control,
.mail-test-action .btn {
    min-height: 46px;
}

.mail-tls-control {
    align-items: center;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    cursor: pointer;
    display: inline-flex;
    gap: 0.7rem;
    margin: 0;
    padding: 0 0.95rem;
}

.mail-tls-control input {
    margin: 0;
}

.mail-tls-control span {
    color: var(--ink);
    font-weight: 500;
}

.mail-test-grid {
    align-items: end;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(260px, 2fr) minmax(220px, 1fr);
}

.mail-test-action {
    display: grid;
}

.mail-test-action .btn {
    width: 100%;
}

.mail-settings-actions {
    align-items: center;
    display: flex;
    gap: 0.7rem;
    justify-content: center;
    padding-top: 1.35rem;
}

.mail-settings-actions .btn {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    min-height: 42px;
}

@media (max-width: 1199.98px) {
    .header-actions-copy p {
        white-space: normal;
    }

    .mail-smtp-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mail-smtp-grid .mail-field:nth-child(n + 5) {
        grid-column: span 1;
    }
}

@media (max-width: 767.98px) {
    .mail-settings-card {
        gap: 1.25rem;
        padding: 1rem;
    }

    .mail-smtp-grid,
    .mail-test-grid {
        grid-template-columns: 1fr;
    }

    .mail-settings-actions {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .mail-settings-actions .btn {
        width: 100%;
    }
}

.role-selector-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

/* Override para la sección de perfiles de usuario: 3 columnas → 2 filas */
.user-form-section .role-selector-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
}

.user-form-section .role-selector-card {
    padding: 1.4rem 1.5rem;
    min-height: 220px;
    display: flex;
    flex-direction: column;
}

.user-form-section .role-selector-card p {
    flex: 1;
}

.user-form-section .profile-list {
    margin-top: 0.5rem;
}

.role-selector-card {
    background: rgba(255, 253, 249, 0.92);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    cursor: pointer;
    display: block;
    min-height: 100%;
    padding: 1rem;
}

.role-selector-head {
    align-items: center;
    display: flex;
    gap: 0.6rem;
    margin-bottom: 0.5rem;
}

.role-selector-card p {
    color: var(--muted);
    font-size: 0.88rem;
    margin-bottom: 0.65rem;
}

.user-form-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: center;
    margin-top: 1.75rem;
    padding: 0.15rem 0 0.1rem;
}

@media (max-width: 1199.98px) {
    .role-selector-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    /* En tablet la grilla de perfiles baja a 2 columnas */
    .user-form-section .role-selector-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .credit-detail-screen .credit-kpi-grid,
    .credit-detail-screen .payment-form-grid {
        grid-template-columns: 1fr;
    }

    .credit-detail-screen .profile-main-info,
    .credit-detail-screen .profile-meta,
    .credit-detail-screen .payment-form-actions {
        align-items: stretch;
        justify-content: flex-start;
    }

    .role-selector-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .user-form-section .role-selector-grid {
        grid-template-columns: 1fr;
    }

    .user-access-grid {
        grid-template-columns: 1fr;
    }

    .user-access-field--name,
    .user-access-field--username,
    .user-access-field--status,
    .user-access-field--email,
    .user-access-field--password {
        grid-column: auto;
    }

    .user-form-header {
        align-items: stretch;
        flex-direction: column;
    }

    .user-form-back {
        white-space: normal;
        width: fit-content;
    }
}

@media (max-width: 575.98px) {
    .sales-tools-panel summary {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.55rem;
    }

    .sales-tools-panel__summary-action {
        width: fit-content;
    }

    .camera-scanner {
        margin-inline: 0.75rem;
        padding: 0.85rem;
    }

    .camera-scanner__head {
        align-items: stretch;
        flex-direction: column;
    }

    .camera-scanner .quick-actions {
        display: grid;
        grid-template-columns: 1fr;
        justify-content: stretch;
    }

    .camera-scanner .quick-actions .btn,
    .camera-scanner .file-trigger {
        width: 100%;
    }

    .role-selector-grid {
        grid-template-columns: 1fr;
    }

    .user-form-actions {
        flex-direction: column;
    }

    .user-form-actions .btn {
        width: min(100%, 240px);
    }
}

@media (max-width: 980px) {
    .product-form-layout {
        grid-template-columns: 1fr;
    }

    .product-form-actions {
        position: static;
    }

    .users-layout {
        grid-template-columns: 1fr;
    }

    .toolbar-card {
        align-items: stretch;
        flex-direction: column;
    }

    .table-actions {
        flex-wrap: wrap;
    }

    .reports-toolbar {
        grid-template-columns: 1fr;
    }

    .inventory-toolbar {
        grid-template-columns: 1fr;
    }

    .inventory-title-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .inventory-actions {
        justify-content: flex-start;
        margin-left: 0;
        width: 100%;
    }

    .inventory-alert-metrics {
        grid-template-columns: 1fr;
    }

    .product-management-card .header-actions-copy p {
        white-space: normal;
    }

    .product-management-card .product-actions {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .sales-report-list-item,
    .sales-report-list-item--ranked {
        grid-template-columns: 1fr;
    }

    .sales-report-list-value,
    .sales-report-list-pill,
    .sales-report-rank {
        justify-self: flex-start;
        text-align: left;
    }

    .sales-report-summary-grid {
        gap: 0.45rem;
        background: transparent;
        border: 0;
        overflow: visible;
    }

    .sales-report-kpi-card {
        background: rgba(255, 255, 255, 0.72);
        border: 1px solid rgba(26, 74, 90, 0.08);
        border-radius: 14px;
    }

    .sales-report-summary-grid > :last-child {
        border-right: 1px solid rgba(26, 74, 90, 0.08);
    }

    .supplier-form-grid {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .supplier-form-field--name,
    .supplier-form-field--phone,
    .supplier-form-field--email,
    .supplier-form-field--contact,
    .supplier-form-field--state {
        grid-column: span 6;
    }
}

@media (max-width: 640px) {
    .customer-primary-grid {
        grid-template-columns: 1fr;
    }

    .customer-primary-field--name,
    .customer-primary-field--type,
    .customer-primary-field--document,
    .customer-primary-field--state {
        grid-column: auto;
    }

    .customer-credit-grid {
        grid-template-columns: 1fr;
    }

    .customer-credit-field--toggle,
    .customer-credit-field--tip,
    .customer-credit-field--limit,
    .customer-credit-field--days,
    .customer-credit-field--balance {
        grid-column: auto;
    }

    .product-management-card .product-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .customer-contact-grid {
        grid-template-columns: 1fr;
    }

    .customer-contact-grid .customer-field--phone,
    .customer-contact-grid .customer-field--email,
    .customer-contact-grid .customer-field--type,
    .customer-contact-grid .customer-field--discount {
        grid-column: auto;
    }

    .supplier-form-grid {
        grid-template-columns: 1fr;
    }

    .supplier-form-field--name,
    .supplier-form-field--phone,
    .supplier-form-field--email,
    .supplier-form-field--contact,
    .supplier-form-field--state {
        grid-column: auto;
    }
}

@media (max-width: 479.98px) {
    .product-management-card .product-actions {
        grid-template-columns: 1fr;
    }
}

.receipt-shell {
    --receipt-control-height: 42px;
    display: grid;
    gap: 1rem;
}

.receipt-toolbar {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: space-between;
}

.receipt-toolbar__copy {
    display: grid;
    gap: 0.15rem;
}

.receipt-toolbar__controls {
    align-items: flex-end;
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem;
    justify-content: flex-end;
}

.receipt-format-control {
    display: grid;
    gap: 0.3rem;
    margin: 0;
    min-width: 210px;
}

.receipt-format-control__label {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
}

.receipt-format-select,
.acciones-comprobante .btn {
    height: var(--receipt-control-height);
    min-height: var(--receipt-control-height);
}

.receipt-format-select {
    line-height: 1.2;
    padding-bottom: 0.45rem;
    padding-right: 2.55rem;
    padding-top: 0.45rem;
}

.receipt-actions {
    align-items: flex-end;
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.acciones-comprobante .btn {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    white-space: nowrap;
}

.acciones-comprobante .btn.is-busy {
    opacity: 0.9;
}

.receipt-action-feedback {
    border-radius: 12px;
    font-size: 0.92rem;
    font-weight: 600;
    padding: 0.8rem 1rem;
}

.receipt-action-feedback[data-state="error"] {
    background: rgba(192, 57, 43, 0.08);
    border: 1px solid rgba(192, 57, 43, 0.16);
    color: #9b2c20;
}

.receipt-action-feedback[data-state="info"] {
    background: rgba(42, 157, 143, 0.08);
    border: 1px solid rgba(42, 157, 143, 0.16);
    color: var(--brand);
}

.receipt-preview-banner {
    background: rgba(42, 157, 143, 0.08);
    border: 1px solid rgba(42, 157, 143, 0.16);
    border-radius: 14px;
    color: var(--brand);
    font-size: 0.92rem;
    padding: 0.85rem 1rem;
}

.receipt-preview-modal {
    align-items: center;
    background: rgba(16, 42, 67, 0.42);
    display: flex;
    inset: 0;
    justify-content: center;
    padding: 1.25rem;
    position: fixed;
    z-index: 1080;
}

.receipt-preview-modal[hidden] {
    display: none;
}

.receipt-preview-modal__dialog {
    background: #f4f8fa;
    border: 1px solid rgba(26, 74, 90, 0.12);
    border-radius: 24px;
    box-shadow: 0 24px 60px rgba(20, 31, 44, 0.2);
    display: grid;
    gap: 0.9rem;
    max-height: calc(100vh - 2.5rem);
    max-width: min(1180px, 100%);
    overflow: hidden;
    padding: 1rem;
    width: min(1180px, 100%);
}

.receipt-preview-modal__header {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
}

.receipt-preview-modal__frame {
    background: #eef5f7;
    border: 0;
    border-radius: 18px;
    height: min(78vh, 920px);
    width: 100%;
}

.receipt-print-frame {
    border: 0;
    height: 0;
    left: -9999px;
    opacity: 0;
    pointer-events: none;
    position: fixed;
    top: -9999px;
    width: 0;
}

.receipt-screen-wrapper {
    display: flex;
    justify-content: center;
    padding: 0.25rem 0 1.5rem;
    width: 100%;
}

/* Screen view: usa las variables CSS que el JS actualiza en tiempo real al cambiar el selector */
#receipt-shell .receipt-screen-wrapper .sale-receipt {
    margin-inline: auto;
    max-width: min(100%, var(--receipt-preview-width, 216mm));
    min-height: var(--receipt-preview-height, auto);
    transition: max-width 0.25s ease, min-height 0.25s ease, font-size 0.15s ease, padding 0.15s ease;
}

/* Thermal: estilos adicionales de fuente y padding para simular el rollo físico */
.receipt-shell[data-preview-format="thermal-80"] .receipt-screen-wrapper .sale-receipt,
.receipt-shell[data-preview-format="thermal-72"] .receipt-screen-wrapper .sale-receipt,
.receipt-shell[data-preview-format="thermal-58"] .receipt-screen-wrapper .sale-receipt {
    border-radius: 10px;
    box-shadow: 0 10px 22px rgba(20, 31, 44, 0.12);
}

.receipt-shell[data-preview-format="thermal-80"] .receipt-screen-wrapper .sale-receipt {
    font-size: 10px;
    padding: 1.8rem 0.8rem 0.8rem;
}

.receipt-shell[data-preview-format="thermal-72"] .receipt-screen-wrapper .sale-receipt {
    font-size: 9.2px;
    padding: 1.7rem 0.75rem 0.75rem;
}

.receipt-shell[data-preview-format="thermal-58"] .receipt-screen-wrapper .sale-receipt {
    font-size: 8.5px;
    padding: 1.6rem 0.65rem 0.65rem;
}

.receipt-preview-page {
    background: linear-gradient(180deg, #eef5f7 0%, #f7fbfc 100%);
    margin: 0;
    padding: 1.25rem;
}

.receipt-preview-shell {
    display: flex;
    justify-content: center;
    min-height: 100vh;
    width: 100%;
}

.receipt-preview-stage {
    display: flex;
    justify-content: center;
    width: 100%;
}

.receipt-preview-page .sale-receipt {
    max-width: min(100%, var(--receipt-preview-width, 216mm));
    width: 100%;
}

.receipt-preview-page[data-print-format="thermal-80"] .sale-receipt {
    border-radius: 10px;
    box-shadow: 0 10px 22px rgba(20, 31, 44, 0.12);
    font-size: 10px !important;
    max-width: 80mm;
    padding: 1.8rem 0.8rem 0.8rem 0.8rem;
}

.receipt-preview-page[data-print-format="thermal-72"] .sale-receipt {
    border-radius: 10px;
    box-shadow: 0 10px 22px rgba(20, 31, 44, 0.12);
    font-size: 9.2px !important;
    max-width: 72mm;
    padding: 1.7rem 0.75rem 0.75rem 0.75rem;
}

.receipt-preview-page[data-print-format="thermal-58"] .sale-receipt {
    border-radius: 10px;
    box-shadow: 0 10px 22px rgba(20, 31, 44, 0.12);
    font-size: 8.5px !important;
    max-width: 58mm;
    padding: 1.6rem 0.65rem 0.65rem 0.65rem;
}

.receipt-preview-page[data-print-format="thermal-80"] .receipt-products-table-wrap,
.receipt-preview-page[data-print-format="thermal-72"] .receipt-products-table-wrap,
.receipt-preview-page[data-print-format="thermal-58"] .receipt-products-table-wrap {
    display: none;
}

.receipt-preview-page[data-print-format="thermal-80"] .receipt-products-compact,
.receipt-preview-page[data-print-format="thermal-72"] .receipt-products-compact,
.receipt-preview-page[data-print-format="thermal-58"] .receipt-products-compact {
    display: grid;
}

.receipt-preview-page[data-print-format="thermal-80"] .receipt-header,
.receipt-preview-page[data-print-format="thermal-72"] .receipt-header,
.receipt-preview-page[data-print-format="thermal-58"] .receipt-header,
.receipt-preview-page[data-print-format="thermal-80"] .receipt-info-grid,
.receipt-preview-page[data-print-format="thermal-72"] .receipt-info-grid,
.receipt-preview-page[data-print-format="thermal-58"] .receipt-info-grid {
    grid-template-columns: 1fr;
}

.receipt-preview-page[data-print-format="thermal-80"] .receipt-badge,
.receipt-preview-page[data-print-format="thermal-72"] .receipt-badge,
.receipt-preview-page[data-print-format="thermal-58"] .receipt-badge,
.receipt-preview-page[data-print-format="thermal-80"] .receipt-document-title,
.receipt-preview-page[data-print-format="thermal-72"] .receipt-document-title,
.receipt-preview-page[data-print-format="thermal-58"] .receipt-document-title {
    justify-self: start;
    text-align: left;
}

.receipt-preview-page[data-print-format="thermal-80"] .receipt-company,
.receipt-preview-page[data-print-format="thermal-72"] .receipt-company,
.receipt-preview-page[data-print-format="thermal-58"] .receipt-company {
    font-size: 1.2rem;
}

.receipt-preview-page[data-print-format="thermal-80"] .receipt-section-heading p,
.receipt-preview-page[data-print-format="thermal-72"] .receipt-section-heading p,
.receipt-preview-page[data-print-format="thermal-58"] .receipt-section-heading p {
    display: none;
}

.receipt-preview-page[data-print-format="thermal-80"] .receipt-products-section,
.receipt-preview-page[data-print-format="thermal-72"] .receipt-products-section,
.receipt-preview-page[data-print-format="thermal-58"] .receipt-products-section {
    gap: 0.55rem;
}

.receipt-preview-page[data-print-format="thermal-80"] .receipt-info-row,
.receipt-preview-page[data-print-format="thermal-72"] .receipt-info-row,
.receipt-preview-page[data-print-format="thermal-58"] .receipt-info-row {
    grid-template-columns: auto minmax(0, 1fr) !important;
    gap: 0.4rem !important;
}

.receipt-preview-page[data-print-format="thermal-72"] .receipt-info-row strong,
.receipt-preview-page[data-print-format="thermal-58"] .receipt-info-row strong {
    font-size: 0.68rem;
}

.receipt-preview-page[data-print-format="thermal-72"] .receipt-info-row span,
.receipt-preview-page[data-print-format="thermal-58"] .receipt-info-row span {
    font-size: 0.88rem;
}

.receipt-preview-page[data-print-format="thermal-80"] .receipt-total-row,
.receipt-preview-page[data-print-format="thermal-72"] .receipt-total-row,
.receipt-preview-page[data-print-format="thermal-58"] .receipt-total-row {
    padding: 0.3rem 0;
}

.receipt-preview-page[data-print-format="half-letter"] .sale-receipt {
    max-width: 140mm;
    font-size: 11.5px !important;
}

.receipt-preview-page[data-print-format="half-letter"] .receipt-info-grid {
    grid-template-columns: 1fr !important;
}

.receipt-preview-page[data-print-format="half-letter-landscape"] .sale-receipt {
    max-width: 216mm;
}

/* Reduced spaces for thermal formats in standalone preview page */
.receipt-preview-page[data-print-format^="thermal-"] .receipt-header {
    margin-bottom: 0.6rem;
    padding-bottom: 0.4rem;
}
.receipt-preview-page[data-print-format^="thermal-"] .receipt-info-sheet {
    margin-bottom: 0.6rem;
    padding: 0.2rem 0;
}
.receipt-preview-page[data-print-format^="thermal-"] .receipt-info-row {
    padding: 0.2rem 0;
}
.receipt-preview-page[data-print-format^="thermal-"] .receipt-compact-item {
    padding: 0.35rem 0;
    gap: 0.1rem;
}
.receipt-preview-page[data-print-format^="thermal-"] .receipt-totals {
    margin-top: 0.6rem;
}
.receipt-preview-page[data-print-format^="thermal-"] .receipt-total-row {
    padding: 0.15rem 0;
}
.receipt-preview-page[data-print-format^="thermal-"] .receipt-legal-notice {
    margin-top: 0.5rem;
    padding: 0.4rem 0.5rem;
    font-size: 0.72rem;
    line-height: 1.3;
}
.receipt-preview-page[data-print-format^="thermal-"] .receipt-footer-message {
    margin-top: 0.5rem;
    font-size: 0.78rem;
}

.receipt-shell.is-previewing .receipt-screen-wrapper {
    background:
        linear-gradient(180deg, rgba(26, 74, 90, 0.05), rgba(42, 157, 143, 0.03)),
        repeating-linear-gradient(
            45deg,
            rgba(26, 74, 90, 0.03) 0,
            rgba(26, 74, 90, 0.03) 12px,
            rgba(255, 255, 255, 0.5) 12px,
            rgba(255, 255, 255, 0.5) 24px
        );
    border: 1px dashed rgba(26, 74, 90, 0.18);
    border-radius: 24px;
    padding: 1.25rem;
}

.sale-receipt {
    background: #fff;
    border: 1px solid rgba(31, 45, 56, 0.09);
    border-radius: 24px;
    box-shadow: 0 20px 40px rgba(20, 31, 44, 0.08);
    box-sizing: border-box;
    max-width: 1100px;
    padding: 2rem;
    transition: max-width var(--transition), width var(--transition), padding var(--transition), border-radius var(--transition), box-shadow var(--transition);
    width: 100%;
}

.receipt-shell.is-previewing .sale-receipt {
    margin-inline: auto;
    max-width: min(100%, var(--receipt-preview-width, 216mm));
    outline: 1px solid rgba(26, 74, 90, 0.08);
}

.receipt-shell.is-previewing[data-preview-format="letter"] .sale-receipt {
    max-width: 216mm;
}

.receipt-shell.is-previewing[data-preview-format="a4"] .sale-receipt {
    max-width: 210mm;
}

.receipt-shell.is-previewing[data-preview-format="half-letter"] .sale-receipt {
    max-width: 140mm;
    font-size: 11.5px;
}

.receipt-shell.is-previewing[data-preview-format="half-letter"] .receipt-info-grid {
    grid-template-columns: 1fr;
}

.receipt-shell.is-previewing[data-preview-format="half-letter-landscape"] .sale-receipt {
    max-width: 216mm;
}

.receipt-shell.is-previewing[data-preview-format="thermal-80"] .sale-receipt {
    border-radius: 10px;
    box-shadow: 0 10px 22px rgba(20, 31, 44, 0.12);
    font-size: 10px;
    max-width: 80mm;
    padding: 1.8rem 0.8rem 0.8rem 0.8rem;
}

.receipt-shell.is-previewing[data-preview-format="thermal-72"] .sale-receipt {
    border-radius: 10px;
    box-shadow: 0 10px 22px rgba(20, 31, 44, 0.12);
    font-size: 9.2px;
    max-width: 72mm;
    padding: 1.7rem 0.75rem 0.75rem 0.75rem;
}

.receipt-shell.is-previewing[data-preview-format="thermal-58"] .sale-receipt {
    border-radius: 10px;
    box-shadow: 0 10px 22px rgba(20, 31, 44, 0.12);
    font-size: 8.5px;
    max-width: 58mm;
    padding: 1.6rem 0.65rem 0.65rem 0.65rem;
}

.receipt-shell.is-previewing[data-preview-format="thermal-80"] .receipt-products-table-wrap,
.receipt-shell.is-previewing[data-preview-format="thermal-72"] .receipt-products-table-wrap,
.receipt-shell.is-previewing[data-preview-format="thermal-58"] .receipt-products-table-wrap {
    display: none;
}

.receipt-shell.is-previewing[data-preview-format="thermal-80"] .receipt-products-compact,
.receipt-shell.is-previewing[data-preview-format="thermal-72"] .receipt-products-compact,
.receipt-shell.is-previewing[data-preview-format="thermal-58"] .receipt-products-compact {
    display: grid;
}

.receipt-shell.is-previewing[data-preview-format="thermal-80"] .receipt-header,
.receipt-shell.is-previewing[data-preview-format="thermal-72"] .receipt-header,
.receipt-shell.is-previewing[data-preview-format="thermal-58"] .receipt-header,
.receipt-shell.is-previewing[data-preview-format="thermal-80"] .receipt-info-grid,
.receipt-shell.is-previewing[data-preview-format="thermal-72"] .receipt-info-grid,
.receipt-shell.is-previewing[data-preview-format="thermal-58"] .receipt-info-grid {
    grid-template-columns: 1fr;
}

.receipt-shell.is-previewing[data-preview-format="thermal-80"] .receipt-section-heading p,
.receipt-shell.is-previewing[data-preview-format="thermal-72"] .receipt-section-heading p,
.receipt-shell.is-previewing[data-preview-format="thermal-58"] .receipt-section-heading p {
    display: none;
}

.receipt-shell.is-previewing[data-preview-format="thermal-80"] .receipt-products-section,
.receipt-shell.is-previewing[data-preview-format="thermal-72"] .receipt-products-section,
.receipt-shell.is-previewing[data-preview-format="thermal-58"] .receipt-products-section {
    gap: 0.55rem;
}

/* Reduced spaces for thermal formats in preview shell */
.receipt-shell.is-previewing[data-preview-format^="thermal-"] .receipt-header {
    margin-bottom: 0.6rem;
    padding-bottom: 0.4rem;
}
.receipt-shell.is-previewing[data-preview-format^="thermal-"] .receipt-info-sheet {
    margin-bottom: 0.6rem;
    padding: 0.2rem 0;
}


























































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































@media (max-width: 480px) {
    .inventory-report-toolbar {
        grid-template-columns: 1fr;
    }

    .inventory-report-filter,
    .inventory-report-back {
        grid-column: auto;
    }
}


/* ── Receipt dual-layout toggle ───────────────────────── */
/* Por defecto: formal visible, thermal oculto */
.receipt-layout-thermal { display: none; }
.receipt-layout-formal  { display: block; }

/* Página de receipt.html: cuando el shell tiene formato thermal */
#receipt-shell[data-preview-format^="thermal-"] .receipt-layout-thermal { display: block; }
#receipt-shell[data-preview-format^="thermal-"] .receipt-layout-formal  { display: none; }

/* Página de preview/print: body tiene data-print-format */
body.receipt-preview-page[data-print-format^="thermal-"] .receipt-layout-thermal { display: block; }
body.receipt-preview-page[data-print-format^="thermal-"] .receipt-layout-formal  { display: none; }
/* ── /Receipt dual-layout toggle ──────────────────────── */

/* ── Receipt Invoice Layout (Carta / A4 / Legal) ──────── */
.receipt-inv-header {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 1rem;
    align-items: start;
    padding-bottom: 0.9rem;
    border-bottom: 2px solid #1a4a5a;
    margin-bottom: 1rem;
}

.receipt-company-name {
    font-size: 1.35rem;
    font-weight: 700;
    color: #1a4a5a;
    line-height: 1.2;
    margin-bottom: 0.3rem;
}

.receipt-company-meta {
    font-size: 0.78rem;
    color: #3d5466;
    line-height: 1.65;
}

.receipt-doc-box {
    border: 1.5px solid #1a4a5a;
    border-radius: 6px;
    padding: 0.65rem 1.25rem;
    text-align: center;
    min-width: 170px;
}

.receipt-doc-box__type {
    font-size: 0.72rem;
    font-weight: 700;
    color: #64788a;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.receipt-doc-box__number {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1a4a5a;
    margin-top: 0.25rem;
}

/* Client info table */
.receipt-client-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1rem;
    font-size: 0.83rem;
}

.receipt-client-table th,
.receipt-client-table td {
    border: 1px solid #c5d5de;
    padding: 0.38rem 0.65rem;
    vertical-align: middle;
}

.receipt-client-table th {
    background: #eef4f7;
    color: #1a4a5a;
    font-weight: 700;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
    width: 1%;
}

/* Items invoice table */
.receipt-invoice-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.83rem;
    margin-bottom: 0.25rem;
}

.receipt-invoice-table thead th {
    background: #1a4a5a;
    color: #fff;
    font-weight: 700;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.5rem 0.65rem;
}

.receipt-invoice-table thead .col-qty,
.receipt-invoice-table thead .col-price,
.receipt-invoice-table thead .col-total {
    text-align: right;
}

.receipt-invoice-table thead .col-num {
    text-align: center;
}

.receipt-invoice-table tbody td {
    border-bottom: 1px solid #e0eaed;
    padding: 0.5rem 0.65rem;
    vertical-align: top;
}

.receipt-invoice-table tbody td.col-num {
    text-align: center;
    color: #64788a;
    font-size: 0.78rem;
    font-weight: 600;
}

.receipt-invoice-table tbody td.col-qty,
.receipt-invoice-table tbody td.col-price,
.receipt-invoice-table tbody td.col-total {
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.receipt-invoice-table tbody td.col-total {
    font-weight: 700;
    color: #1a4a5a;
}

.receipt-invoice-table td small {
    display: block;
    font-size: 0.72rem;
    color: #64788a;
    margin-top: 0.1rem;
    font-weight: 400;
}

/* Bottom section: payment + totals */
.receipt-inv-bottom {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 1.25rem;
    margin-top: 0.75rem;
    padding-top: 0.6rem;
    border-top: 1px solid #c5d5de;
    align-items: start;
}

.receipt-payment-info {
    font-size: 0.82rem;
    color: #3d5466;
    line-height: 2;
}

.receipt-payment-info strong {
    color: #1a4a5a;
    font-weight: 700;
}

.receipt-obs-inline {
    margin-top: 0.4rem;
    color: #3d5466;
}

.receipt-totals {
    display: flex;
    flex-direction: column;
    min-width: 210px;
}

.receipt-total-row {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
    font-size: 0.83rem;
    color: #3d5466;
    padding: 0.22rem 0.5rem;
    border-bottom: 1px solid #edf2f5;
}

.receipt-total-row.grand-total {
    font-size: 1rem;
    font-weight: 700;
    color: #1a4a5a;
    background: #eef4f7;
    border-top: 1.5px solid #1a4a5a;
    border-bottom: 1.5px solid #1a4a5a;
    padding: 0.4rem 0.5rem;
    margin-top: 0.15rem;
}

/* Legal notice */
.receipt-inv-legal {
    margin-top: 1.25rem;
    padding: 0.55rem 0.8rem;
    background: #fffbe6;
    border: 1px solid #e0c84a;
    border-radius: 6px;
    font-size: 0.7rem;
    color: #6b4c00;
    line-height: 1.55;
}

.receipt-footer-message {
    text-align: center;
    font-size: 0.78rem;
    color: #64788a;
    margin-top: 0.75rem;
}

/* ── Thermal / POS Layout ─────────────────────────────── */
.receipt-pos-header {
    text-align: center;
    margin-bottom: 0.5rem;
    line-height: 1.6;
}

.receipt-pos-company-name {
    font-size: 1rem;
    font-weight: 700;
    color: #1a4a5a;
}

.receipt-pos-company-meta {
    font-size: 0.78rem;
    color: #3d5466;
}

.receipt-pos-divider {
    border: none;
    border-top: 1px dashed #aaa;
    margin: 0.45rem 0;
}

.receipt-pos-docnum {
    text-align: center;
    margin: 0.4rem 0;
    line-height: 1.5;
}

.receipt-pos-docnum strong {
    font-size: 0.82rem;
    font-weight: 700;
    display: block;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.receipt-pos-docnum span {
    font-size: 0.88rem;
    font-weight: 700;
    color: #1a4a5a;
}

.receipt-pos-meta {
    font-size: 0.79rem;
    line-height: 1.75;
    margin-bottom: 0.35rem;
}

.receipt-pos-meta span {
    font-weight: 700;
    color: #1a4a5a;
}

.receipt-pos-items {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.79rem;
    margin-bottom: 0.3rem;
}

.receipt-pos-items th {
    border-bottom: 1px solid #333;
    font-weight: 700;
    padding: 0.2rem 0.25rem;
    font-size: 0.73rem;
    text-transform: uppercase;
}

.receipt-pos-items th.text-right,
.receipt-pos-items td.text-right {
    text-align: right;
}

.receipt-pos-items td {
    padding: 0.25rem 0.25rem;
    vertical-align: top;
}

.receipt-pos-items td small {
    display: block;
    font-size: 0.71rem;
    color: #555;
}

.receipt-pos-total-row {
    display: flex;
    justify-content: space-between;
    font-size: 0.8rem;
    padding: 0.12rem 0;
    color: #3d5466;
}

.receipt-pos-total-row.grand-total {
    font-weight: 700;
    font-size: 1rem;
    color: #1a4a5a;
    border-top: 1px solid #333;
    border-bottom: 1px solid #333;
    padding: 0.3rem 0;
    margin: 0.15rem 0;
}

.receipt-legal-thermal {
    font-size: 0.68rem;
    color: #555;
    text-align: center;
    line-height: 1.45;
    margin-top: 0.4rem;
}

/* @print: quitar bordes de la card para imprimir limpio */
@media print {
    .sale-receipt {
        border: none !important;
        box-shadow: none !important;
        border-radius: 0 !important;
        padding: 0 !important;
        max-width: 100% !important;
    }
}
/* ── /Receipt Invoice Layout ──────────────────────────── */

/* ============================================================
   Custom Encapsulated Overrides for Sale Detail Page
   ============================================================ */
.sale-detail-page .sale-line__product-row {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.75rem;
    align-items: end;
    overflow: visible;
    margin-bottom: 0 !important;
    z-index: 2;
}

.sale-detail-page .sale-product-search {
    position: relative;
    min-width: 0;
    overflow: visible;
}

.sale-detail-page .sale-product-search .form-control {
    height: 44px;
    min-height: 44px;
    line-height: normal;
    box-sizing: border-box;
}

/* Correct camera/image buttons sizing and prevent cuts */
.sale-detail-page .sale-product-search-bar-group--detail .btn {
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    overflow: visible;
}

.sale-detail-page .sale-product-search-bar-group--detail svg,
.sale-detail-page .sale-product-search-bar-group--detail i {
    width: 18px;
    height: 18px;
    display: block;
}

/* Eliminate masking pseudo-elements that hide the bottom borders */
.sale-detail-page .sale-line__product-row::before,
.sale-detail-page .sale-line__product-row::after,
.sale-detail-page .sale-product-search::before,
.sale-detail-page .sale-product-search::after {
    content: none !important;
    display: none !important;
}

/* Correct separation between Producto and Presentacion rows */
.sale-detail-page .sale-line__fields-row {
    margin-top: 0 !important;
    border-top: 0 !important;
    box-shadow: none !important;
    overflow: visible;
    z-index: 1;
}

/* Mobile responsive alignment */
@media (max-width: 575.98px) {
    .sale-detail-page .sale-product-search-bar-group--detail {
        display: flex;
        flex-wrap: wrap;
        gap: 0.55rem;
    }

    .sale-detail-page .sale-product-search__input {
        flex: 1 1 100%;
        width: 100%;
    }
}

/* ============================================================
   Resumen de venta y Panel de Pago (Efectivo/Cambio)
   ============================================================ */
.sale-detail-page .sale-summary-panel {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.75rem;
    margin: 1rem 0;
    padding: 1rem;
    border-radius: 1rem;
    background: rgba(18, 111, 108, 0.06);
    border: 1px solid rgba(18, 111, 108, 0.12);
}

.sale-detail-page .sale-summary-item {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.sale-detail-page .sale-summary-item span {
    font-size: 0.78rem;
    color: var(--text-muted);
    font-weight: 600;
}

.sale-detail-page .sale-summary-item strong {
    font-size: 1rem;
    color: var(--text-main);
}

.sale-detail-page .sale-summary-total {
    padding: 0.75rem;
    border-radius: 0.85rem;
    background: #ffffff;
    box-shadow: 0 8px 20px rgba(15, 45, 55, 0.08);
}

.sale-detail-page .sale-summary-total strong {
    font-size: 1.2rem;
    color: var(--primary-color);
}

/* Panel de Pago en Efectivo */
.sale-detail-page .sale-payment-panel {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(220px, 1fr) minmax(180px, 1fr);
    gap: 0.75rem;
    align-items: end;
    margin-top: 1rem;
    padding: 1rem;
    border-radius: 1rem;
    background: rgba(15, 45, 55, 0.04);
    border: 1px solid rgba(15, 45, 55, 0.08);
}

.sale-detail-page .sale-payment-total,
.sale-detail-page .sale-payment-change {
    min-height: 44px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.sale-detail-page .sale-payment-total span,
.sale-detail-page .sale-payment-change span {
    font-size: 0.78rem;
    color: var(--text-muted);
    font-weight: 600;
}

.sale-detail-page .sale-payment-total strong,
.sale-detail-page .sale-payment-change strong {
    font-size: 1.15rem;
    color: var(--primary-color);
}

.sale-detail-page .sale-payment-change strong.is-negative {
    color: var(--danger) !important;
}

.sale-detail-page .sale-payment-field .form-control {
    height: 44px;
}

/* Responsive queries */
@media (max-width: 1199.98px) {
    .sale-detail-page .sale-summary-panel {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .sale-detail-page .sale-summary-panel {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    
    .sale-detail-page .sale-payment-panel {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .sale-detail-page .sale-summary-panel {
        grid-template-columns: 1fr;
    }
}

/* Correcciones para el botón Agregar producto en detalle de venta */

.sale-detail-page .sale-line__add-toolbar {
    display: flex;
    justify-content: flex-start;
    margin-top: 1rem;
    margin-bottom: 1.5rem;
}

.sale-detail-page .sale-line__add-btn {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    white-space: nowrap;
}

@media (max-width: 575.98px) {
    .sale-detail-page .sale-line__add-toolbar {
        width: 100%;
    }

    .sale-detail-page .sale-line__add-btn {
        width: 100%;
    }
}

/* Ampliar el campo total y hacerlo 100% responsive */
.sale-detail-page .sale-line__total-row {
    grid-template-columns: 1fr auto auto !important;
    width: 100%;
}

/* Alinear la fila de Pago, Desc. global e IVA con los demás elementos */
.sale-detail-page .sale-header-grid {
    display: grid !important;
    grid-template-columns: minmax(180px, 1fr) minmax(140px, 1fr) minmax(280px, 1.5fr) !important;
    gap: 1rem !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.sale-detail-page .sale-header-grid > [class*="col-"] {
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: auto !important;
    max-width: none !important;
}

@media (max-width: 767.98px) {
    .sale-detail-page .sale-header-grid {
        grid-template-columns: 1fr !important;
        gap: 0.75rem !important;
    }
}

/* ============================================================
   Custom Encapsulated Overrides for Purchase Form Page
   ============================================================ */
.purchase-page .purchase-card {
  width: 100%;
  padding: 24px;
  background: var(--card-bg, #fff);
  border-radius: 18px;
  box-shadow: var(--card-shadow);
}

.purchase-page .purchase-kpi-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin: 0 0 1.25rem 0;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(26, 74, 90, 0.08);
  border-radius: 18px;
  overflow: hidden;
}

.purchase-page .purchase-kpi-card {
  background: transparent;
  border: 0;
  border-right: 1px solid rgba(26, 74, 90, 0.08);
  border-radius: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 78px;
  padding: 0.8rem 0.95rem;
}

.purchase-page .purchase-kpi-row > :last-child {
  border-right: 0;
}

.purchase-page .purchase-kpi-card span {
  display: block;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.purchase-page .purchase-kpi-card strong {
  display: block;
  margin-top: 0.3rem;
  color: var(--ink);
  font-family: var(--font-heading);
  font-size: 1.10rem;
  line-height: 1.15;
}

.purchase-page .purchase-section {
  margin-top: 24px;
  padding-top: 20px;
  border-top: none !important;
}

.purchase-page hr,
.purchase-page .section-divider,
.purchase-page .purchase-divider,
.purchase-page .purchase-section::before,
.purchase-page .purchase-section::after {
  display: none !important;
  border: 0 !important;
  content: none !important;
}

.purchase-page .purchase-section h2 {
  font-size: 1.25rem;
  margin-bottom: 1rem;
}

.purchase-page .purchase-header-grid,
.purchase-edit-page .purchase-header-grid,
.purchase-form-grid {
  display: grid;
  grid-template-columns: minmax(240px, 1.2fr) minmax(220px, 1fr);
  gap: 16px;
  align-items: start;
}

.purchase-provider-field {
  position: relative;
}

.purchase-invoice-field {
  position: relative;
}

.purchase-provider-help {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--brand-mid);
  margin-top: 4px;
}

.purchase-protected-detail {
  background-color: var(--bg-light, #f8f9fa);
  border: 1px solid rgba(0, 0, 0, 0.05);
  border-radius: var(--radius-sm);
  padding: 16px;
  margin-bottom: 20px;
}

.purchase-admin-editable {
  border: 1px dashed var(--brand-mid);
  background-color: rgba(6, 149, 116, 0.03); /* opacity brand-mid tint */
  border-radius: var(--radius-sm);
  padding: 16px;
  margin-bottom: 20px;
}

.purchase-page .purchase-scan-field {
  grid-column: 1 / -1;
}

.purchase-page .form-control,
.purchase-page .form-select,
.purchase-page .btn {
  min-height: 44px;
}

.purchase-page .purchase-actions {
  display: flex;
  justify-content: center !important;
  align-items: center;
  gap: 12px;
  margin-top: 24px;
  padding-top: 0 !important;
  border-top: none !important;
}

@media (max-width: 991.98px) {
  .purchase-page .purchase-kpi-row {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  }
}

@media (max-width: 767.98px) {
  .purchase-page .purchase-kpi-row {
    grid-template-columns: 1fr;
    gap: 0.75rem;
  }

  .purchase-page .purchase-header-grid,
  .purchase-edit-page .purchase-header-grid,
  .purchase-form-grid {
    grid-template-columns: 1fr;
  }

  .purchase-page .purchase-actions {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .purchase-page .purchase-actions .btn {
    width: 100% !important;
    max-width: 320px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

.purchase-page .purchase-detail-heading {
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  gap: 0.9rem;
  justify-content: space-between;
}

.purchase-page .purchase-barcode-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  justify-content: flex-end;
}

.purchase-page .purchase-barcode-status {
  align-items: center;
  background: rgba(42, 157, 143, 0.08);
  border: 1px solid rgba(42, 157, 143, 0.2);
  border-radius: 999px;
  color: var(--brand);
  display: inline-flex;
  font-size: 0.78rem;
  font-weight: 700;
  gap: 0.35rem;
  min-height: 36px;
  padding: 0.35rem 0.75rem;
  white-space: nowrap;
}

.purchase-page .purchase-barcode-status[data-state="processing"] {
  background: rgba(242, 153, 74, 0.14);
  border-color: rgba(242, 153, 74, 0.24);
  color: #9b5b11;
}

/* Reducir espacio vertical entre Datos de la compra y Detalle de productos */
.purchase-page .purchase-section {
  margin-top: 8px !important;
  padding-top: 8px !important;
}

.purchase-page .purchase-section + .purchase-section {
  margin-top: 4px !important;
  padding-top: 4px !important;
}

/* Espaciado del encabezado de la sección */
.purchase-page .purchase-line-header {
  margin-top: 0.25rem !important;
  margin-bottom: 0.15rem !important;
}

/* Ajustes de las líneas de compra para reducir separación de Producto */
.purchase-page .purchase-line {
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: none !important;
}

.purchase-page .purchase-line + .purchase-line {
  margin-top: 8px !important;
  padding-top: 8px !important;
  border-top: 1px solid rgba(0, 0, 0, 0.08) !important;
}

/* Estilos de la grilla responsive para los campos de la línea de compra */
.purchase-page .purchase-line-grid {
  display: grid !important;
  grid-gap: 12px !important;
  align-items: end !important;
  width: 100% !important;
}

/* Escritorio (una sola fila con proporciones equilibradas y columna de acciones auto) */
@media (min-width: 992px) {
  .purchase-page .purchase-line-grid {
    grid-template-columns: 3.5fr 2fr 2fr 2fr auto !important;
  }
}

/* Tablet (dos columnas) */
@media (min-width: 576px) and (max-width: 991.98px) {
  .purchase-page .purchase-line-grid {
    grid-template-columns: 1fr 1fr !important;
  }
  .purchase-page .purchase-line-actions {
    grid-column: span 2 !important;
    width: 100% !important;
    display: flex !important;
    justify-content: flex-end !important;
  }
}

/* Móvil (una sola columna apilada sin desbordamientos) */
@media (max-width: 575.98px) {
  .purchase-page .purchase-line-grid {
    grid-template-columns: 1fr !important;
  }
  .purchase-page .purchase-line-actions {
    width: 100% !important;
    display: flex !important;
    justify-content: flex-end !important;
  }
}

/* Estilos para la zona de acciones alineada horizontalmente */
.purchase-page .purchase-line-actions {
  display: flex !important;
  align-items: flex-end !important;
  gap: 8px !important;
  margin-top: 0.25rem !important;
}

.purchase-page .purchase-remove-line-btn {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: var(--radius-sm, 10px) !important;
}

.purchase-page .purchase-add-line-btn {
  height: 44px !important;
  padding: 0 1.25rem !important;
  white-space: nowrap !important;
  border-radius: var(--radius-sm, 10px) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.purchase-page .purchase-barcode-status[data-state="success"] {
  background: rgba(39, 174, 96, 0.12);
  border-color: rgba(39, 174, 96, 0.22);
  color: #1d6b3e;
}

.purchase-page .purchase-barcode-status[data-state="error"] {
  background: rgba(214, 48, 49, 0.1);
  border-color: rgba(214, 48, 49, 0.22);
  color: #a92828;
}

.purchase-page .purchase-barcode-code-btn {
  align-items: center;
  display: inline-flex;
  gap: 0.45rem;
  min-height: 36px;
}

.purchase-page .purchase-line.is-scan-highlight {
  animation: purchaseLineScanPulse 1.2s ease;
}

@keyframes purchaseLineScanPulse {
  0% {
    box-shadow: 0 0 0 0 rgba(42, 157, 143, 0.28);
    transform: translateY(0);
  }
  30% {
    box-shadow: 0 0 0 4px rgba(42, 157, 143, 0.18);
    transform: translateY(-1px);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(42, 157, 143, 0);
    transform: translateY(0);
  }
}

.product-form-layout .product-form-actions {
  grid-column: 1 / -1;
  position: static;
  margin-top: 1.5rem;
  padding: 20px 24px;
}

.product-form-layout .product-form-actions-inner {
  display: flex !important;
  justify-content: center !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin: 0 !important;
  padding: 0 !important;
}

.product-form-layout .product-form-actions .btn {
  width: auto !important;
  min-width: 140px;
  margin: 0 !important;
}

.product-create-page .product-form-main .product-form-panel {
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  background: transparent !important;
  padding: 0 !important;
  margin-top: 0 !important;
}

.product-create-page .product-form-main .product-form-panel + .product-form-panel {
  margin-top: 1.15rem !important;
  padding-top: 1.15rem !important;
  border-top: none !important;
  border-radius: 0 !important;
}


/* Estilo premium de error específico para compras */
.purchase-page .purchase-field-error {
  border-color: #d9534f !important;
  background-color: #fdf7f7 !important;
  box-shadow: 0 0 0 0.2rem rgba(217, 83, 79, 0.25) !important;
}

/* Encabezado de sección con botón de volver en compras */
.purchase-section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  width: 100%;
  margin-bottom: 1.5rem;
}

.purchase-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 500;
  border-radius: var(--radius-sm, 10px) !important;
  transition: transform 0.2s ease, background-color 0.2s ease;
  white-space: nowrap;
}

.purchase-back-btn:hover {
  transform: translateX(-2px);
}

@media (max-width: 576px) {
  .purchase-section-header {
    flex-direction: column;
    align-items: stretch;
    gap: 0.75rem;
  }
  .purchase-back-btn {
    align-self: flex-start;
    width: 100%;
    justify-content: center;
  }
}

/* Variantes específicas de títulos y descripción en compras */
.purchase-page .purchase-section-title,
.purchase-section-title {
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: var(--ink) !important;
  margin-bottom: 0 !important;
  line-height: 1.2 !important;
}

.purchase-page .purchase-description,
.purchase-description {
  font-size: 0.85rem !important;
  color: var(--muted) !important;
  margin-top: 4px !important;
  margin-bottom: 0 !important;
  line-height: 1.4 !important;
}

/* Resultados de autocompletado para compras */
.purchase-provider-results,
.purchase-product-results {
  position: absolute;
  top: calc(100% + 0.35rem);
  left: 0;
  right: 0;
  z-index: 1050;
  background: var(--card) !important;
  border: 1px solid rgba(30, 45, 56, 0.12) !important;
  border-radius: var(--radius-sm, 10px) !important;
  box-shadow: var(--shadow-md, 0 10px 30px rgba(0,0,0,0.08)) !important;
  max-height: 280px;
  overflow-y: auto;
  padding: 0;
}

.purchase-provider-option,
.purchase-product-option {
  width: 100%;
  border: 0 !important;
  border-bottom: 1px solid rgba(30, 45, 56, 0.08) !important;
  background: transparent !important;
  color: inherit !important;
  display: block;
  padding: 0.75rem 1rem !important;
  text-align: left !important;
  cursor: pointer !important;
  font-size: 0.9rem !important;
  line-height: 1.35 !important;
  transition: background-color 0.15s ease;
}

.purchase-provider-option:last-child,
.purchase-product-option:last-child {
  border-bottom: 0 !important;
}

.purchase-provider-option:hover,
.purchase-provider-option.active,
.purchase-product-option:hover,
.purchase-product-option.active {
  background: rgba(26, 74, 90, 0.06) !important;
}

.purchase-option-title {
  display: block !important;
  font-weight: 700 !important;
  color: var(--ink) !important;
}

.purchase-option-meta {
  display: block !important;
  font-size: 0.8rem !important;
  color: var(--muted) !important;
  margin-top: 2px !important;
}

/* Botón de limpiar selección en compras */
.purchase-clear-selection {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  background: transparent;
  border: 0;
  color: var(--muted);
  cursor: pointer;
  padding: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: background-color 0.2s, color 0.2s;
  z-index: 10;
  font-size: 1.2rem;
  line-height: 1;
}

.purchase-clear-selection:hover {
  background-color: rgba(30, 45, 56, 0.08);
  color: var(--ink);
}

/* Estilo para resaltar campos con error en Nueva venta */
.sale-field-error {
  border-color: var(--danger) !important;
  background-color: rgba(220, 53, 69, 0.05) !important;
}

/* Forzar que las especificaciones de producto queden en una sola línea y más pegados arriba */
.sale-line__meta-row-wrapper {
  width: 100%;
  margin-top: -0.5rem;
  margin-bottom: 0.35rem;
  padding-left: 0.5rem;
}

.sale-line__meta-row-wrapper [data-line-role="meta"] {
  white-space: nowrap !important;
  overflow-x: auto;
  display: block;
  margin-top: 0 !important;
}

/* Nuevo producto: ajustes de diseño específicos de página */
.product-create-page .product-pricing-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, 1fr);
  align-items: flex-start;
}

.product-create-page .product-pricing-grid .form-control {
  height: 44px;
}

.product-create-page .product-rules-checkboxes {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  align-items: center;
}

.product-create-page .product-waste-row {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1.5fr 2fr;
  align-items: center;
}

.product-create-page .product-waste-fields {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1.2fr 0.8fr;
  align-items: flex-end;
}

.product-create-page .product-classification-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr 1fr;
}

.product-create-page .product-classification-grid .form-select {
  height: 44px;
}

.product-create-page .product-quick-category-grid {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: 1.2fr 1fr 1.5fr;
}

.product-create-page .product-image-section {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1.5fr 1fr;
}

.product-create-page .product-image-preview-card {
  width: 100%;
  height: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: var(--radius-sm);
}

.product-create-page .product-create-back-btn {
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 1rem;
  font-size: 0.88rem;
  border-radius: 8px;
}

/* Responsividad */
@media (max-width: 991.98px) {
  .product-create-page .product-pricing-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 768px) {
  .product-create-page .product-waste-row {
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: 0.75rem;
  }
  .product-create-page .product-quick-category-grid {
    grid-template-columns: 1fr;
  }
  .product-create-page .product-image-section {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
}

@media (max-width: 575.98px) {
  .product-create-page .product-pricing-grid {
    grid-template-columns: 1fr;
  }
  .product-create-page .product-rules-checkboxes {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
  }
  .product-create-page .product-classification-grid {
    grid-template-columns: 1fr;
  }
}

.product-form-actions-container {
  border-top: 1px solid rgba(26, 74, 90, 0.08);
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  width: 100%;
}

.product-form-layout .product-form-actions-inner .btn {
  width: auto !important;
  min-width: 140px;
  margin: 0 !important;
  height: 40px;
  border-radius: var(--radius-sm);
}

.product-create-page .product-code-field-wrapper,
.product-edit-page .product-code-field-wrapper {
  display: flex !important;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
}

.product-create-page .product-code-field-wrapper .form-control,
.product-edit-page .product-code-field-wrapper .form-control {
  flex: 1 !important;
  width: 0 !important;
  min-width: 0 !important;
}

.product-create-page .product-code-field-wrapper .product-generate-code-btn,
.product-edit-page .product-code-field-wrapper .product-generate-code-btn {
  flex-shrink: 0 !important;
  height: 45px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.product-create-page .product-identification-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, 1fr);
}

.product-create-page .product-identification-grid .grid-span-2-desktop {
  grid-column: span 2;
}

.product-create-page .product-identification-grid .grid-span-3-desktop {
  grid-column: span 3;
}

.product-create-page .product-generate-code-btn {
  font-size: 0.88rem;
  padding: 0.55rem 0.85rem;
  white-space: nowrap;
}

/* Responsividad */
@media (max-width: 991.98px) {
  .product-create-page .product-identification-grid {
    grid-template-columns: 1fr 1fr;
  }
  .product-create-page .product-identification-grid .grid-span-2-desktop {
    grid-column: span 2;
  }
  .product-create-page .product-identification-grid .grid-span-3-desktop {
    grid-column: span 2;
  }
}

@media (max-width: 575.98px) {
  .product-create-page .product-identification-grid {
    grid-template-columns: 1fr;
  }
  .product-create-page .product-identification-grid .grid-span-2-desktop {
    grid-column: span 1;
  }
  .product-create-page .product-identification-grid .grid-span-3-desktop {
    grid-column: span 1;
  }
}



/* Editar producto - alineado visualmente con Nuevo producto */
.product-form-header-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 1rem;
}

.product-form-header-copy {
  min-width: 0;
  flex: 1 1 260px;
}

.product-form-header-copy h2 {
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0;
}

.product-form-header-copy p {
  font-size: 0.88rem;
  margin-top: 0.2rem;
}

.product-form-header-actions {
  display: flex;
  justify-content: flex-end;
  flex: 0 0 auto;
  max-width: 100%;
}

.product-form-back-btn,
.product-create-page .product-create-back-btn {
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 1rem;
  font-size: 0.88rem;
  border-radius: 8px;
  white-space: nowrap;
}

.product-edit-context {
  color: var(--muted);
  display: inline-block;
  font-size: 0.82rem;
  font-weight: 600;
  margin-top: 0.35rem;
  overflow-wrap: anywhere;
}

.product-edit-page .product-form-main .product-form-panel,
.product-create-page .product-form-main .product-form-panel {
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  background: transparent !important;
  padding: 0 !important;
  margin-top: 0 !important;
}

.product-edit-page .product-form-main .product-form-panel + .product-form-panel,
.product-create-page .product-form-main .product-form-panel + .product-form-panel {
  margin-top: 1.15rem !important;
  padding-top: 1.15rem !important;
  border-top: none !important;
  border-radius: 0 !important;
}

.product-edit-page .product-identification-grid,
.product-create-page .product-identification-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.product-edit-page .product-identification-grid .grid-span-2-desktop,
.product-create-page .product-identification-grid .grid-span-2-desktop {
  grid-column: span 2;
}

.product-edit-page .product-identification-grid .grid-span-3-desktop,
.product-create-page .product-identification-grid .grid-span-3-desktop {
  grid-column: span 3;
}

.product-edit-page .product-pricing-grid,
.product-create-page .product-pricing-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: flex-start;
}

.product-edit-page .product-pricing-grid .form-control,
.product-create-page .product-pricing-grid .form-control,
.product-edit-page .product-classification-grid .form-select,
.product-create-page .product-classification-grid .form-select {
  height: 44px;
}

.product-edit-page .product-rules-checkboxes,
.product-create-page .product-rules-checkboxes {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  align-items: center;
}

.product-edit-page .product-waste-row,
.product-create-page .product-waste-row {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1.5fr 2fr;
  align-items: center;
}

.product-edit-page .product-waste-fields,
.product-create-page .product-waste-fields {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1.2fr 0.8fr;
  align-items: flex-end;
}

.product-edit-page .product-edit-exclusive-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1.4fr) minmax(180px, 0.6fr);
  align-items: end;
}

.product-edit-page .product-edit-exclusive-grid .info-tile {
  min-height: 44px;
  display: flex;
  align-items: center;
}

.product-edit-page .product-classification-grid,
.product-create-page .product-classification-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.product-edit-page .product-quick-category-grid,
.product-create-page .product-quick-category-grid {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: 1.2fr 1fr 1.5fr;
}

.product-edit-page .product-image-section,
.product-create-page .product-image-section {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1.5fr 1fr;
}

.product-edit-page .product-image-preview-card,
.product-create-page .product-image-preview-card {
  width: 100%;
  height: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: var(--radius-sm);
}

.product-edit-page .product-generate-code-btn,
.product-create-page .product-generate-code-btn {
  font-size: 0.88rem;
  padding: 0.55rem 0.85rem;
  white-space: nowrap;
}

@media (max-width: 991.98px) {
  .product-edit-page .product-identification-grid,
  .product-create-page .product-identification-grid,
  .product-edit-page .product-pricing-grid,
  .product-create-page .product-pricing-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-edit-page .product-identification-grid .grid-span-2-desktop,
  .product-create-page .product-identification-grid .grid-span-2-desktop,
  .product-edit-page .product-identification-grid .grid-span-3-desktop,
  .product-create-page .product-identification-grid .grid-span-3-desktop {
    grid-column: span 2;
  }
}

@media (max-width: 768px) {
  .product-edit-page .product-waste-row,
  .product-create-page .product-waste-row,
  .product-edit-page .product-image-section,
  .product-create-page .product-image-section,
  .product-edit-page .product-edit-exclusive-grid {
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: 1rem;
  }

  .product-edit-page .product-quick-category-grid,
  .product-create-page .product-quick-category-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 575.98px) {
  .product-form-header-actions,
  .product-form-back-btn {
    width: 100%;
  }

  .product-edit-page .product-identification-grid,
  .product-create-page .product-identification-grid,
  .product-edit-page .product-pricing-grid,
  .product-create-page .product-pricing-grid,
  .product-edit-page .product-classification-grid,
  .product-create-page .product-classification-grid,
  .product-edit-page .product-waste-fields,
  .product-create-page .product-waste-fields {
    grid-template-columns: 1fr;
  }

  .product-edit-page .product-identification-grid .grid-span-2-desktop,
  .product-create-page .product-identification-grid .grid-span-2-desktop,
  .product-edit-page .product-identification-grid .grid-span-3-desktop,
  .product-create-page .product-identification-grid .grid-span-3-desktop {
    grid-column: span 1;
  }

  .product-edit-page .product-rules-checkboxes,
  .product-create-page .product-rules-checkboxes {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
  }
}

/* ── PWA & Responsive Compatibility Overrides ── */
html, body {
  max-width: 100vw !important;
  overflow-x: clip !important;
}

/* Sidebar Responsive Collapse (for viewports <= 900px) */
@media (max-width: 900px) {
  .sidebar {
    position: fixed !important;
    left: 0;
    top: 0;
    bottom: 0;
    transform: translateX(-100%);
    transition: transform var(--transition);
    z-index: 140;
  }
  
  body.sidebar-open .sidebar {
    transform: translateX(0) !important;
    box-shadow: 0 0 25px rgba(0,0,0,0.3) !important;
  }
  
  body.sidebar-open .sidebar-backdrop {
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  
  .sidebar-toggle {
    display: flex !important;
  }
  
  .topbar {
    padding: 0.75rem 1rem !important;
  }
}

@media (max-width: 575.98px) {
  .user-chip {
    display: none !important;
  }
  
  .page-title {
    font-size: 1.35rem !important;
  }
}

/* Responsive Table Wrapper Enforcement */
.table-responsive {
  display: block;
  width: 100% !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
  border-radius: var(--radius-sm, 6px);
  border: 1px solid var(--border-color, #e2e8f0) !important;
  margin-bottom: 1.5rem;
}
.table-responsive table {
  margin-bottom: 0 !important;
  width: 100% !important;
}

/* Mobile actions layout stacking */
@media (max-width: 575.98px) {
  .form-foot, .form-actions, .card-footer {
    flex-direction: column-reverse !important;
    width: 100% !important;
    gap: 0.5rem !important;
    display: flex !important;
  }
  .form-foot .btn, .form-foot a, .form-actions .btn, .form-actions a, .card-footer .btn {
    width: 100% !important;
    margin: 0 !important;
    display: block !important;
    text-align: center;
  }
}

/* Modal containment */
@media (max-width: 575.98px) {
  .modal-dialog {
    margin: 0.5rem !important;
    max-width: calc(100% - 1rem) !important;
  }
  .modal-content {
    border-radius: var(--radius-md, 12px) !important;
  }
}

/* Safe Area Inset Support (Notch Phones in Standalone PWA mode) */
@supports (padding: env(safe-area-inset-top)) {
  .topbar {
    padding-top: calc(1rem + env(safe-area-inset-top)) !important;
  }
  .sidebar {
    padding-top: env(safe-area-inset-top) !important;
    padding-bottom: env(safe-area-inset-bottom) !important;
  }
  .mobile-bottom-nav {
    padding-bottom: calc(0.35rem + env(safe-area-inset-bottom)) !important;
    height: calc(64px + env(safe-area-inset-bottom)) !important;
  }
}

/* Extremely small screen metrics wrapper */
@media (max-width: 380px) {
  .quick-actions-grid {
    grid-template-columns: 1fr !important;
  }
  .pos-shortcuts-legend {
    flex-direction: column !important;
    align-items: stretch !important;
  }
}

img {
  max-width: 100%;
  height: auto;
}
/* Critical workflow responsiveness: sales and purchases */
@media (max-width: 900px) {
  .sale-detail-page .sale-drafts-bar {
    align-items: stretch;
    grid-template-columns: minmax(0, 1fr);
  }

  .sale-detail-page .sale-drafts-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 575.98px) {
  .sale-detail-page .sale-drafts-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
  }

  .sale-detail-page .sale-drafts-actions .btn,
  .sale-detail-page .sale-drafts-actions a {
    justify-content: center;
    min-height: 44px;
    width: 100%;
  }

  .sale-detail-page .sale-drafts-scroll {
    max-width: 100%;
  }

  .pos-shortcuts-legend {
    display: none !important;
  }

  .purchase-page .purchase-detail-heading,
  .purchase-page .purchase-barcode-actions {
    align-items: stretch;
    flex-direction: column;
    width: 100%;
  }

  .purchase-page .purchase-barcode-actions .btn {
    justify-content: center;
    min-height: 44px;
    width: 100%;
  }
}
/* Touch targets verified with Chromium visual audit */
@media (max-width: 575.98px) {
  #theme-toggle,
  #sync-indicator,
  .sale-draft-tab__close,
  .purchase-clear-selection {
    min-height: 44px !important;
    min-width: 44px !important;
  }

  .products-page .quick-actions .btn,
  .products-page .products-icon-btn {
    min-height: 44px !important;
    min-width: 44px !important;
  }
}
@media (max-width: 900px) {
  #theme-toggle,
  #sync-indicator,
  .sale-draft-tab__button,
  .sale-draft-tab__close,
  .purchase-clear-selection,
  .products-page td .btn-sm {
    min-height: 44px !important;
    min-width: 44px !important;
  }
}

/* PWA responsive alignment v30 */
html {
  -webkit-text-size-adjust: 100%;
}

body {
  overscroll-behavior-y: none;
}

button,
a,
input,
select,
textarea {
  touch-action: manipulation;
}

@media (max-width: 640px) {
  body.has-sidebar {
    padding-bottom: calc(74px + env(safe-area-inset-bottom)) !important;
  }

  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea {
    font-size: 16px !important;
  }

  .topbar-title-group,
  .page-heading-shell,
  .page-heading-copy {
    min-width: 0;
  }

  .page-title,
  .page-copy {
    overflow-wrap: anywhere;
  }
}

@media (max-width: 900px) and (max-height: 500px) {
  body.has-sidebar {
    padding-bottom: 0 !important;
  }

  .mobile-bottom-nav {
    display: none !important;
  }
}

@supports (padding: env(safe-area-inset-top)) {
  .container-fluid {
    padding-left: max(1rem, env(safe-area-inset-left)) !important;
    padding-right: max(1rem, env(safe-area-inset-right)) !important;
  }
}

/* ============================================================
   Dark theme — production palette
   ============================================================ */
html.theme-dark {
    --bg: #0f1921;
    --card: #17242d;
    --surface: #17242d;
    --surface-2: #1c2d37;
    --ink: #edf5f7;
    --ink-2: #c4d4da;
    --muted: #91a7b1;
    --brand: #153e4a;
    --brand-mid: #48b5a5;
    --brand-2: #55c7b5;
    --accent: #f0cb72;
    --danger: #ff8175;
    --warning: #ffb35f;
    --success: #65d99a;
    --info: #72bced;
    --line: rgba(203, 225, 232, 0.14);
    --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.24);
    --shadow-md: 0 10px 28px rgba(0, 0, 0, 0.32);
    --shadow-lg: 0 18px 48px rgba(0, 0, 0, 0.42);
    --bs-body-color: var(--ink);
    --bs-body-bg: var(--bg);
    --bs-secondary-color: var(--muted);
    --bs-border-color: var(--line);
    --bs-emphasis-color: #ffffff;
    color-scheme: dark;
}

html.theme-dark body {
    background: linear-gradient(135deg, #0b141b 0%, #10232b 58%, #122a2a 100%);
    color: var(--ink);
}

html.theme-dark body,
html.theme-dark .main-content,
html.theme-dark .content-area,
html.theme-dark .page-content {
    transition: background-color var(--transition), color var(--transition);
}

html.theme-dark .topbar,
html.theme-dark .page-header,
html.theme-dark .app-header {
    background: rgba(15, 25, 33, 0.96) !important;
    border-color: var(--line) !important;
    color: var(--ink);
}

html.theme-dark .card,
html.theme-dark .stat-card,
html.theme-dark .user-chip,
html.theme-dark .modal-content,
html.theme-dark .dropdown-menu,
html.theme-dark .list-group-item,
html.theme-dark .accordion-item,
html.theme-dark .offcanvas,
html.theme-dark .toast,
html.theme-dark .panel,
html.theme-dark .table-responsive {
    background-color: var(--card) !important;
    border-color: var(--line) !important;
    color: var(--ink) !important;
    box-shadow: var(--shadow-sm);
}

html.theme-dark .card-header,
html.theme-dark .card-footer,
html.theme-dark .modal-header,
html.theme-dark .modal-footer,
html.theme-dark .accordion-button,
html.theme-dark .dropdown-item,
html.theme-dark .table > :not(caption) > * > *,
html.theme-dark table th,
html.theme-dark table td {
    background-color: transparent !important;
    border-color: var(--line) !important;
    color: var(--ink) !important;
}

html.theme-dark .table {
    --bs-table-color: var(--ink);
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--line);
    --bs-table-striped-color: var(--ink);
    --bs-table-striped-bg: rgba(255, 255, 255, 0.025);
    --bs-table-hover-color: #ffffff;
    --bs-table-hover-bg: rgba(85, 199, 181, 0.09);
}

html.theme-dark thead,
html.theme-dark .table-light,
html.theme-dark .table-light > * {
    --bs-table-bg: #1c2d37;
    --bs-table-color: var(--ink);
    background-color: #1c2d37 !important;
    color: var(--ink) !important;
}

html.theme-dark .form-control,
html.theme-dark .form-select,
html.theme-dark .input-group-text,
html.theme-dark input,
html.theme-dark select,
html.theme-dark textarea {
    background-color: #101d25 !important;
    border-color: rgba(203, 225, 232, 0.2) !important;
    color: var(--ink) !important;
}

html.theme-dark .form-control::placeholder,
html.theme-dark input::placeholder,
html.theme-dark textarea::placeholder {
    color: #7f96a0 !important;
    opacity: 1;
}

html.theme-dark .form-control:focus,
html.theme-dark .form-select:focus,
html.theme-dark input:focus,
html.theme-dark select:focus,
html.theme-dark textarea:focus {
    background-color: #12232c !important;
    border-color: var(--brand-2) !important;
    box-shadow: 0 0 0 0.2rem rgba(85, 199, 181, 0.18) !important;
    color: #ffffff !important;
}

html.theme-dark .text-muted,
html.theme-dark .form-text,
html.theme-dark small {
    color: var(--muted) !important;
}

html.theme-dark .btn-light,
html.theme-dark .btn-outline-secondary,
html.theme-dark .pagination .page-link {
    background-color: #1b2c35 !important;
    border-color: var(--line) !important;
    color: var(--ink) !important;
}

html.theme-dark .btn-light:hover,
html.theme-dark .btn-outline-secondary:hover,
html.theme-dark .dropdown-item:hover,
html.theme-dark .pagination .page-link:hover {
    background-color: #243b46 !important;
    color: #ffffff !important;
}

html.theme-dark .alert {
    background-color: #1a2a33 !important;
    border-color: var(--line) !important;
    color: var(--ink) !important;
}

html.theme-dark hr {
    border-color: var(--line);
    opacity: 1;
}

html.theme-dark .btn-theme-toggle {
    color: var(--ink-2) !important;
}

html.theme-dark .btn-theme-toggle:hover {
    background: rgba(255, 255, 255, 0.08) !important;
}

@media (prefers-reduced-motion: no-preference) {
    body,
    .card,
    .topbar,
    .page-header,
    .form-control,
    .form-select,
    .table > :not(caption) > * > * {
        transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
    }
}

/* ============================================================
   Dashboard mobile layout fix — v32
   Keep this block after all desktop dashboard declarations.
   ============================================================ */
@media (max-width: 900px) {
    .dashboard-main {
        align-items: stretch !important;
        display: grid !important;
        gap: 1rem !important;
        grid-template-columns: minmax(0, 1fr) !important;
        height: auto !important;
        min-width: 0 !important;
        overflow: visible !important;
        width: 100% !important;
    }

    .dashboard-main > .card,
    .dashboard-main > .chart-card,
    .dashboard-main > .actions-card,
    .dashboard-main > .sales-card,
    .dashboard-main > .inventory-card,
    .dashboard-main > .business-summary-card,
    .dashboard-main > .movements-card {
        align-self: start !important;
        grid-column: 1 / -1 !important;
        height: auto !important;
        min-height: 0 !important;
        min-width: 0 !important;
        overflow: hidden !important;
        width: 100% !important;
    }

    .dashboard-main .card-body {
        flex: 0 0 auto !important;
        height: auto !important;
        min-height: 0 !important;
    }

    .dashboard-main .actions-card .card-body {
        justify-content: flex-start !important;
    }

    .dashboard-main .inventory-list,
    .dashboard-main .quick-actions-grid {
        height: auto !important;
        min-height: 0 !important;
    }

    .dashboard-main .table-responsive {
        margin-bottom: 0 !important;
        max-width: 100% !important;
        min-height: 0 !important;
        overflow-x: auto !important;
    }

    .dashboard-stats {
        gap: 0.85rem !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        width: 100% !important;
    }

    .dashboard-stats .stat-card {
        height: auto !important;
        min-height: 112px !important;
        min-width: 0 !important;
    }
}

@media (max-width: 640px) {
    .topbar {
        align-items: flex-start !important;
        gap: 0.65rem !important;
        padding: 0.8rem 0.85rem !important;
    }

    .topbar-title-group {
        align-items: flex-start !important;
        gap: 0.65rem !important;
        width: 100% !important;
    }

    .page-heading-shell {
        gap: 0.4rem !important;
        width: 100% !important;
    }

    .page-title {
        font-size: clamp(1.45rem, 7.4vw, 2rem) !important;
        line-height: 1.05 !important;
    }

    .page-copy {
        font-size: 0.9rem !important;
        line-height: 1.28 !important;
        max-width: 100% !important;
    }

    #sync-indicator {
        margin-top: 0.25rem !important;
        min-height: 36px !important;
        min-width: 0 !important;
        padding: 0.35rem 0.75rem !important;
    }

    .container-fluid {
        max-width: 100% !important;
        overflow-x: clip !important;
        padding: 0.85rem !important;
    }

    .dashboard-stats {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .dashboard-stats .stat-card {
        min-height: 104px !important;
    }

    .dashboard-main {
        gap: 0.85rem !important;
    }

    .dashboard-main > .card {
        border-radius: 14px !important;
        padding: 0 !important;
    }

    .dashboard-main .card-header {
        padding: 0.9rem 1rem !important;
    }

    .dashboard-main .card-body {
        padding: 1rem !important;
    }

    .dashboard-main .chart-container {
        height: 220px !important;
        min-height: 220px !important;
    }

    .quick-actions-grid {
        gap: 0.65rem !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .quick-actions-grid .btn,
    .quick-actions-grid .btn-primary-action {
        grid-column: 1 !important;
        min-height: 48px !important;
        width: 100% !important;
    }

    .inventory-card .card-body,
    .actions-card .card-body {
        min-height: 0 !important;
    }

    .inventory-list > .text-muted {
        padding: 0.75rem !important;
    }

    .business-summary-card .quick-actions-grid {
        grid-template-columns: minmax(0, 1fr) !important;
        padding: 0 !important;
    }

    body.has-sidebar {
        padding-bottom: calc(76px + env(safe-area-inset-bottom)) !important;
    }

    .mobile-bottom-nav {
        box-shadow: 0 -4px 18px rgba(15, 31, 40, 0.14);
    }
}

/* Dashboard stat cards — neutral borders, no colored accent lines */
.dashboard-stats .stat-card {
    border: 1px solid var(--line) !important;
}

.dashboard-stats .stat-card::before {
    content: none !important;
    display: none !important;
}

.contingency-grid { display:grid; grid-template-columns:minmax(280px,.7fr) minmax(0,1.3fr); gap:1rem; }
.contingency-actions { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.contingency-line { display:grid; grid-template-columns:minmax(220px,2fr) repeat(3,minmax(110px,1fr)) auto; gap:.65rem; margin-bottom:.65rem; }
.contingency-entry-fields { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.form-grid { display:grid; gap:.85rem; }
.form-grid label, .contingency-entry-fields label { display:grid; gap:.35rem; font-weight:600; }
.form-foot { display:flex; justify-content:flex-end; align-items:center; gap:.75rem; margin-top:1rem; }
.form-foot form { margin:0; }
@media (max-width:900px) {
  .contingency-grid, .contingency-entry-fields { grid-template-columns:1fr; }
  .contingency-line { grid-template-columns:1fr 1fr; padding:1rem; border:1px solid var(--line); border-radius:12px; }
  .contingency-line select { grid-column:1/-1; }
}
@media (max-width:520px) {
  .contingency-line { grid-template-columns:1fr; }
  .contingency-line select { grid-column:auto; }
  .form-foot { align-items:stretch; flex-direction:column; }
  .form-foot .btn, .form-foot form, .form-foot form .btn { width:100%; }
}



.contingency-summary { display:grid; gap:1.25rem; margin-bottom:1rem; }
.contingency-summary-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.85rem; }
.contingency-summary-card { display:grid; gap:.3rem; padding:1rem; border:1px solid var(--line); border-radius:14px; background:var(--surface); }
.contingency-summary-card small { color:var(--muted); font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.contingency-summary-card strong { color:var(--brand-dark); font-size:1.35rem; }
.contingency-summary-card span { color:var(--muted); font-size:.85rem; }
.contingency-summary-card.has-warning { border-color:#e7a62b; background:#fff9e8; }
.contingency-summary-tables { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(280px,.8fr); gap:1rem; }
@media (max-width:900px) {
  .contingency-summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .contingency-summary-tables { grid-template-columns:1fr; }
}
@media (max-width:560px) {
  .contingency-summary-grid { grid-template-columns:1fr; }
}


.contingency-summary-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
}
.contingency-summary-header .page-copy { margin-bottom:0; }
.contingency-summary-header .btn { flex:0 0 auto; }
.contingency-review-actions { justify-content:center; }
@media (max-width:640px) {
  .contingency-summary-header { align-items:stretch; flex-direction:column; }
  .contingency-summary-header .btn { width:100%; text-align:center; }
}

.contingency-summary-header .contingency-back-btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.45rem;
  width:auto;
  min-height:44px;
  padding:.7rem 1.15rem;
  border:1px solid rgba(30,45,56,.16);
  border-radius:var(--radius-sm);
  background:var(--surface);
  color:var(--ink-2);
  font-size:.875rem;
  font-weight:600;
  letter-spacing:normal;
  text-transform:none;
  white-space:nowrap;
}
.contingency-summary-header .contingency-back-btn:hover {
  background:rgba(30,45,56,.06);
  color:var(--ink);
}
.contingency-file-action-btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:120px;
  height:42px;
  padding:0;
  border-radius:var(--radius-sm);
  background:var(--surface);
  cursor:pointer;
  overflow:visible;
  position:relative;
}
.contingency-file-action-btn svg {
  display:block;
  flex:0 0 auto;
}
/* Contingencia: escala tipográfica y controles alineados al sistema */
.contingency-page .card-header {
  font-size:.95rem;
  line-height:1.3;
  letter-spacing:normal;
  text-transform:none;
}
.contingency-page .card-header strong,
.contingency-page .card-header > span {
  font-size:.95rem;
  letter-spacing:normal;
  text-transform:none;
}
.contingency-page h2 {
  font-size:1.2rem;
  line-height:1.25;
  margin:0 0 1rem;
}
.contingency-page h3 {
  font-size:1rem;
  line-height:1.3;
}
.contingency-page .btn {
  min-height:42px;
  padding:.62rem 1rem;
  font-size:.875rem;
  line-height:1.15;
  letter-spacing:normal;
  text-transform:none;
}
.contingency-page .btn-sm {
  min-height:36px;
  padding:.46rem .72rem;
  font-size:.8rem;
}
.contingency-page .contingency-file-action-btn {
  width:120px;
  height:42px;
  min-height:42px;
  padding:0;
}
.contingency-page .contingency-summary-card small {
  font-size:.78rem;
  letter-spacing:normal;
  text-transform:none;
}
.contingency-create-form .btn {
  justify-self:start;
  width:auto;
}
.contingency-page .contingency-actions {
  gap:.55rem;
}
.contingency-page .contingency-actions form {
  margin:0;
}
@media (max-width:640px) {
  .contingency-create-form .btn {
    justify-self:stretch;
    width:100%;
  }
  .contingency-page .contingency-section-header {
    align-items:stretch;
    flex-direction:column;
  }
  .contingency-page .contingency-section-header > .contingency-actions {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    width:100%;
  }
  .contingency-page .contingency-section-header > .contingency-actions .btn,
  .contingency-page .contingency-section-header > .contingency-actions form,
  .contingency-page .contingency-section-header > .contingency-actions label {
    width:100%;
  }
  .contingency-page .contingency-standard-btn {
    grid-column:1/-1;
  }
}
/* Patrón único para todos los botones de regreso */
.btn.btn-back {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:.45rem !important;
  width:auto;
  height:44px !important;
  min-height:44px !important;
  padding:.7rem 1.15rem !important;
  border:1px solid rgba(30,45,56,.16) !important;
  border-radius:var(--radius-sm) !important;
  background:var(--surface) !important;
  color:var(--ink-2) !important;
  font-family:inherit;
  font-size:.875rem !important;
  font-weight:600 !important;
  line-height:1.15 !important;
  letter-spacing:normal !important;
  text-transform:none !important;
  white-space:nowrap;
}
.btn.btn-back:hover {
  background:rgba(30,45,56,.06) !important;
  color:var(--ink) !important;
}
.btn.btn-back > svg,
.btn.btn-back > span[aria-hidden="true"] {
  display:block;
  flex:0 0 auto;
  font-size:1rem;
  line-height:1;
}
/* Banda única de indicadores: fondo blanco y separadores neutros */
.summary-tile-grid {
  background:#fff;
  border:1px solid rgba(26,74,90,.08);
  border-radius:18px;
  gap:0;
  overflow:hidden;
}
.summary-tile-grid > .info-tile {
  display:grid;
  align-content:center;
  gap:.3rem;
  min-height:78px;
  padding:.8rem .95rem;
  background:#fff !important;
  border:0 !important;
  border-right:1px solid rgba(26,74,90,.08) !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.summary-tile-grid > .info-tile:last-child { border-right:0 !important; }
.summary-tile-grid > .info-tile small {
  color:var(--muted);
  font-size:.76rem;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.summary-tile-grid > .info-tile strong {
  color:var(--ink);
  font-family:var(--font-heading);
  font-size:1.1rem;
  line-height:1.15;
}
.summary-tile-grid > .sales-report-kpi-card--accent { background:#fff !important; }
.standard-summary-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
@media (max-width:900px) {
  .standard-summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .standard-summary-grid > .info-tile { border-bottom:1px solid rgba(26,74,90,.08) !important; }
  .standard-summary-grid > .info-tile:nth-child(2n) { border-right:0 !important; }
  .standard-summary-grid > .info-tile:nth-last-child(-n+2) { border-bottom:0 !important; }
}
@media (max-width:640px) {
  .standard-summary-grid { grid-template-columns:1fr; }
  .standard-summary-grid > .info-tile,
  .standard-summary-grid > .info-tile:nth-child(2n),
  .standard-summary-grid > .info-tile:nth-last-child(-n+2) {
    border-right:0 !important;
    border-bottom:1px solid rgba(26,74,90,.08) !important;
  }
  .standard-summary-grid > .info-tile:last-child { border-bottom:0 !important; }
}
/* Escala tipográfica común para contenido interno */
h2,
h3 { font-weight:700; }
h4,
h5,
h6 { font-weight:600; }
.card h2,
.toolbar-card h2,
.mail-settings-header h2 {
  font-size:1.25rem !important;
  font-weight:700;
  line-height:1.2;
  letter-spacing:-.015em;
}
.card h3,
.toolbar-card h3,
.section-heading h3,
.mail-settings-section-heading h3 {
  font-size:1rem !important;
  font-weight:600;
  line-height:1.25;
  letter-spacing:normal;
}
.section-heading h2 {
  font-size:1.2rem !important;
  font-weight:700;
  line-height:1.2;
}
.card-header {
  font-size:.9rem;
  font-weight:600;
  letter-spacing:normal;
  text-transform:none;
}
.page-copy,
.section-heading p,
.mail-settings-header p,
.mail-settings-section-heading p,
.card p.text-muted,
.card .text-muted:not(th):not(label) { font-weight:400; }
.summary-tile-grid > .info-tile small,
.sales-report-kpi-card small,
.table th,
.table-minimal th { font-weight:600; }
/* Tamaño único para títulos importantes, basado en Configuración de la empresa */
.page-title,
.cash-main-title-row h2,
.cash-page--closed .cash-title-row h2,
.supplier-list-heading h2,
.company-settings-header h2,
.labels-preview-header h1 {
  font-size:1.25rem !important;
  font-weight:700 !important;
  line-height:1.2 !important;
  letter-spacing:-.015em !important;
}

/* ============================================================
   Dark theme contrast audit - controls, panels and status UI
   Keep this block last so page-scoped light rules cannot win.
   ============================================================ */
html.theme-dark .btn-outline-primary {
  background-color:rgba(85,199,181,.04) !important;
  border-color:rgba(113,224,207,.42) !important;
  color:#8fe3d6 !important;
}
html.theme-dark .btn-outline-primary:hover,
html.theme-dark .btn-outline-primary:focus-visible {
  background-color:rgba(85,199,181,.16) !important;
  border-color:#71d8c8 !important;
  color:#f5fffd !important;
}
html.theme-dark .btn-outline-secondary,
html.theme-dark .btn-light,
html.theme-dark .btn.btn-back,
html.theme-dark .contingency-back-btn,
html.theme-dark .contingency-file-action-btn {
  background-color:#1b2c35 !important;
  border-color:rgba(203,225,232,.28) !important;
  color:#d9e8ed !important;
}
html.theme-dark .btn-outline-secondary:hover,
html.theme-dark .btn-outline-secondary:focus-visible,
html.theme-dark .btn-light:hover,
html.theme-dark .btn-light:focus-visible,
html.theme-dark .btn.btn-back:hover,
html.theme-dark .btn.btn-back:focus-visible,
html.theme-dark .contingency-back-btn:hover,
html.theme-dark .contingency-back-btn:focus-visible,
html.theme-dark .contingency-file-action-btn:hover,
html.theme-dark .contingency-file-action-btn:focus-visible {
  background-color:#29414d !important;
  border-color:rgba(203,225,232,.46) !important;
  color:#ffffff !important;
}
html.theme-dark .btn-outline-danger {
  background-color:rgba(255,129,117,.04) !important;
  border-color:rgba(255,129,117,.48) !important;
  color:#ffaaa2 !important;
}
html.theme-dark .btn-outline-danger:hover,
html.theme-dark .btn-outline-danger:focus-visible {
  background-color:rgba(255,129,117,.16) !important;
  border-color:#ff9c93 !important;
  color:#ffffff !important;
}
html.theme-dark .btn-link-icon,
html.theme-dark .icon-action-btn {
  color:#c9dbe1 !important;
}
html.theme-dark .btn-link-icon:hover,
html.theme-dark .icon-action-btn:hover {
  background-color:rgba(255,255,255,.09) !important;
  color:#ffffff !important;
}
html.theme-dark .btn:disabled,
html.theme-dark .btn.disabled,
html.theme-dark button:disabled {
  border-color:rgba(203,225,232,.16) !important;
  color:#7f98a3 !important;
  opacity:.72;
}
html.theme-dark .products-page .products-icon-btn svg,
html.theme-dark .icon-search-btn svg,
html.theme-dark .icon-action-btn svg,
html.theme-dark .btn-icon svg {
  color:inherit;
  stroke:currentColor;
}
html.theme-dark .form-control,
html.theme-dark .form-select,
html.theme-dark .filter-control,
html.theme-dark .form-control-premium,
html.theme-dark .input-group-text,
html.theme-dark input,
html.theme-dark select,
html.theme-dark textarea {
  background-color:#101d25 !important;
  border-color:rgba(203,225,232,.26) !important;
  color:#edf5f7 !important;
}
html.theme-dark input::placeholder,
html.theme-dark textarea::placeholder,
html.theme-dark .form-control::placeholder,
html.theme-dark .filter-control::placeholder,
html.theme-dark .form-control-premium::placeholder {
  color:#9cb1ba !important;
  opacity:1 !important;
}
html.theme-dark select option {
  background-color:#17242d;
  color:#edf5f7;
}
html.theme-dark input:disabled,
html.theme-dark select:disabled,
html.theme-dark textarea:disabled,
html.theme-dark .form-control:disabled,
html.theme-dark .form-select:disabled,
html.theme-dark .form-control[readonly] {
  background-color:#1b2932 !important;
  color:#aabdc5 !important;
  opacity:1;
}
html.theme-dark .table-responsive,
html.theme-dark .table-shell,
html.theme-dark .table-container {
  background-color:var(--card) !important;
  border-color:rgba(203,225,232,.18) !important;
}
html.theme-dark .table thead th,
html.theme-dark .table-minimal thead th,
html.theme-dark table thead th {
  background-color:#1c2d37 !important;
  border-color:rgba(203,225,232,.2) !important;
  color:#f3f8fa !important;
}
html.theme-dark .table tbody td,
html.theme-dark .table-minimal tbody td,
html.theme-dark table tbody td {
  border-color:rgba(203,225,232,.14) !important;
  color:#e7f0f3 !important;
}
html.theme-dark .table tbody tr:hover > *,
html.theme-dark .table-minimal tbody tr:hover > * {
  background-color:rgba(85,199,181,.08) !important;
  color:#ffffff !important;
}
html.theme-dark .text-muted,
html.theme-dark .page-copy,
html.theme-dark .section-copy,
html.theme-dark .pagination-empty,
html.theme-dark .header-actions-copy p,
html.theme-dark .card p.text-muted {
  color:#9fb3bc !important;
}
html.theme-dark .summary-tile-grid,
html.theme-dark .summary-tile-grid > .info-tile,
html.theme-dark .summary-tile-grid > .sales-report-kpi-card--accent,
html.theme-dark .contingency-summary-card,
html.theme-dark .toolbar-card,
html.theme-dark .mail-settings-section {
  background:#17242d !important;
  border-color:rgba(203,225,232,.16) !important;
  color:#edf5f7 !important;
}
html.theme-dark .summary-tile-grid > .info-tile {
  border-right-color:rgba(203,225,232,.14) !important;
  border-bottom-color:rgba(203,225,232,.14) !important;
}
html.theme-dark .summary-tile-grid > .info-tile small,
html.theme-dark .summary-tile-grid > .info-tile strong,
html.theme-dark .contingency-summary-card strong {
  color:#edf5f7 !important;
}
html.theme-dark .contingency-summary-card.has-warning {
  background:#332b19 !important;
  border-color:#c99535 !important;
}
html.theme-dark .badge.bg-light,
html.theme-dark .text-bg-light,
html.theme-dark .status-pill,
html.theme-dark .badge-soft {
  background-color:#243640 !important;
  color:#e2edf0 !important;
}
html.theme-dark .nav-tabs,
html.theme-dark .nav-tabs .nav-link {
  border-color:rgba(203,225,232,.18) !important;
}
html.theme-dark .nav-tabs .nav-link {
  color:#b7cbd2 !important;
}
html.theme-dark .nav-tabs .nav-link:hover,
html.theme-dark .nav-tabs .nav-link.active {
  background-color:#1c2d37 !important;
  color:#ffffff !important;
}
html.theme-dark :focus-visible {
  outline-color:#71d8c8;
}
/* Dark theme contrast audit - extended custom components */
html.theme-dark .sidebar-toggle:hover {
  background:#243b46 !important;
  color:#ffffff !important;
}
html.theme-dark .hero-strip,
html.theme-dark .filter-dates-group,
html.theme-dark .labels-actions-panel,
html.theme-dark .receipt-preview-modal__dialog {
  background:#17242d !important;
  border-color:rgba(203,225,232,.18) !important;
  color:#edf5f7 !important;
}
html.theme-dark .btn-toggle-advanced,
html.theme-dark .btn-export-excel,
html.theme-dark .btn-export-pdf {
  background:#1b2c35 !important;
  border-color:rgba(203,225,232,.28) !important;
}
html.theme-dark .btn-toggle-advanced {
  color:#d9e8ed !important;
}
html.theme-dark .btn-toggle-advanced:hover,
html.theme-dark .btn-toggle-advanced:focus-visible {
  background:#29414d !important;
  color:#ffffff !important;
}
html.theme-dark .btn-toggle-advanced.is-active {
  background:var(--brand-mid) !important;
  border-color:#71d8c8 !important;
  color:#ffffff !important;
}
html.theme-dark .btn-export-excel {
  color:#7ee2a5 !important;
}
html.theme-dark .btn-export-excel:hover,
html.theme-dark .btn-export-excel:focus-visible {
  background:rgba(101,217,154,.14) !important;
  border-color:#65d99a !important;
  color:#a7f3c6 !important;
}
html.theme-dark .btn-export-pdf {
  color:#ffaaa2 !important;
}
html.theme-dark .btn-export-pdf:hover,
html.theme-dark .btn-export-pdf:focus-visible {
  background:rgba(255,129,117,.14) !important;
  border-color:#ff8175 !important;
  color:#ffd0cb !important;
}
html.theme-dark .sale-detail-page .sale-summary-panel,
html.theme-dark .sale-detail-page .sale-payment-panel {
  background:rgba(85,199,181,.07) !important;
  border-color:rgba(113,216,200,.2) !important;
}
html.theme-dark .sale-detail-page .sale-summary-total {
  background:#20343e !important;
  color:#edf5f7 !important;
  box-shadow:0 8px 20px rgba(0,0,0,.22);
}
html.theme-dark .sale-detail-page .sale-summary-item span,
html.theme-dark .sale-detail-page .sale-payment-total span,
html.theme-dark .sale-detail-page .sale-payment-change span {
  color:#9fb3bc !important;
}
html.theme-dark .sale-detail-page .sale-summary-item strong,
html.theme-dark .sale-detail-page .sale-summary-total strong,
html.theme-dark .sale-detail-page .sale-payment-total strong,
html.theme-dark .sale-detail-page .sale-payment-change strong {
  color:#edf5f7 !important;
}
html.theme-dark .purchase-page .purchase-field-error {
  background-color:#352127 !important;
  border-color:#ff8175 !important;
  color:#ffd0cb !important;
}
html.theme-dark .purchase-page .purchase-barcode-status[data-state="success"] {
  background:rgba(101,217,154,.13) !important;
  border-color:rgba(101,217,154,.38) !important;
  color:#9debbb !important;
}
html.theme-dark .purchase-page .purchase-barcode-status[data-state="error"],
html.theme-dark .receipt-action-feedback[data-state="error"] {
  background:rgba(255,129,117,.13) !important;
  border-color:rgba(255,129,117,.38) !important;
  color:#ffb5ae !important;
}
html.theme-dark .receipt-action-feedback[data-state="info"],
html.theme-dark .receipt-preview-banner {
  background:rgba(85,199,181,.12) !important;
  border-color:rgba(113,216,200,.3) !important;
  color:#9be7db !important;
}
html.theme-dark .flatpickr-calendar,
html.theme-dark .flatpickr-months,
html.theme-dark .flatpickr-weekdays,
html.theme-dark .flatpickr-days {
  background:#17242d !important;
  border-color:rgba(203,225,232,.18) !important;
  color:#edf5f7 !important;
}
html.theme-dark .flatpickr-day,
html.theme-dark .flatpickr-weekday,
html.theme-dark .flatpickr-current-month,
html.theme-dark .flatpickr-monthDropdown-months,
html.theme-dark .numInputWrapper input {
  color:#dce9ed !important;
}
html.theme-dark .flatpickr-day:hover,
html.theme-dark .flatpickr-day:focus,
html.theme-dark .flatpickr-day.selected {
  background:#2a7d6f !important;
  border-color:#55c7b5 !important;
  color:#ffffff !important;
}
/* Explicit user permissions and receipt heading alignment */
.receipt-toolbar {
    align-items: stretch;
    display: grid;
    gap: 0.9rem;
    grid-template-columns: minmax(0, 1fr);
}

.receipt-toolbar__copy {
    grid-column: 1 / -1;
    min-width: 0;
    width: 100%;
}

.receipt-toolbar__heading {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    width: 100%;
}

.receipt-toolbar__heading .btn-back {
    flex: 0 0 auto;
    margin-left: auto;
}

.receipt-toolbar__controls {
    grid-column: 1 / -1;
    justify-content: flex-start;
    width: 100%;
}

.permission-selector-heading {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.permission-selector-summary {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    gap: 0.65rem;
}

.permission-selector-summary > span {
    color: var(--muted);
    font-size: 0.84rem;
    font-weight: 600;
    white-space: nowrap;
}

.permission-group-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.permission-group-card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    min-width: 0;
    padding: 1rem;
}

.permission-group-card h3 {
    font-size: 0.96rem;
    margin: 0 0 0.75rem;
}

.permission-option-list {
    display: grid;
    gap: 0.5rem;
}

.permission-option-card {
    align-items: flex-start;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    cursor: pointer;
    display: flex;
    gap: 0.65rem;
    padding: 0.65rem 0.7rem;
}

.permission-option-card:hover,
.permission-option-card:has(input:checked) {
    background: rgba(42, 157, 143, 0.08);
    border-color: rgba(42, 157, 143, 0.2);
}

.permission-option-card input {
    flex: 0 0 auto;
    margin-top: 0.2rem;
}

.permission-option-card > span {
    display: grid;
    gap: 0.15rem;
    min-width: 0;
}

.permission-option-card strong {
    font-size: 0.88rem;
    font-weight: 650;
}

.permission-option-card small {
    color: var(--muted);
    font-size: 0.78rem;
    line-height: 1.35;
}

@media (max-width: 767.98px) {
    .receipt-toolbar__heading,
    .permission-selector-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .receipt-toolbar__heading .btn-back {
        align-self: flex-start;
    }

    .permission-selector-summary {
        justify-content: space-between;
        width: 100%;
    }

    .permission-group-grid {
        grid-template-columns: 1fr;
    }
}
/* Nueva venta: flujo compacto y acciones centradas */
.sale-detail-page .sale-line__add-toolbar {
    margin: 0.65rem 0 0.45rem;
}

.sale-detail-page .sale-observation-field {
    margin-top: 0.35rem;
}

.sale-detail-page .sale-observation-field textarea {
    min-height: 72px;
}

.sale-detail-page .sale-payment-panel {
    margin: 0.65rem 0 0 !important;
    padding: 0.8rem 1rem;
}

.sale-detail-page .sale-submit-actions {
    justify-content: center !important;
    margin-top: 0.65rem !important;
    padding-top: 0.2rem;
}

@media (max-width: 520px) {
    .sale-detail-page .sale-submit-actions {
        align-items: stretch;
    }
}

/* Categorias: administracion compacta, editable y adaptable */
.category-management-page {
    display: grid;
    gap: 1rem;
}

.category-summary-grid {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.category-summary-card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-sm);
    display: grid;
    gap: 0.2rem;
    min-width: 0;
    padding: 0.85rem 1rem;
}

.category-summary-card span {
    color: var(--muted);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.category-summary-card strong {
    color: var(--ink);
    font-size: 1.2rem;
    line-height: 1.1;
}

.category-workspace {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr);
}

.category-create-card,
.category-list-card {
    min-width: 0;
}

.category-create-card {
    align-self: start;
}

.category-create-heading {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1rem;
    width: 100%;
}

.category-create-heading .btn-back {
    flex: 0 0 auto;
    margin-left: auto;
}

.category-form {
    display: grid;
    gap: 0.85rem;
}

.category-create-form {
    align-items: end;
    grid-template-columns: minmax(180px, 1fr) minmax(170px, 0.7fr) minmax(220px, 1.2fr) auto;
}

.category-create-form .form-control {
    height: 44px;
    min-height: 44px;
}

.category-form .form-label {
    margin-bottom: 0.35rem;
}

.category-form .form-text {
    color: var(--muted);
    display: block;
    font-size: 0.76rem;
    line-height: 1.3;
    margin-top: 0.3rem;
}

.category-save-btn {
    align-self: end;
    height: 44px;
    justify-self: start;
}

.category-list-heading {
    align-items: flex-end;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    padding: 1rem;
}

.category-search-form {
    display: grid;
    flex: 0 1 24rem;
    gap: 0.45rem;
    grid-template-columns: minmax(150px, 1fr) 44px auto;
    min-width: 220px;
}

.category-search-form .form-control,
.category-search-form .icon-search-btn {
    height: 40px;
}

.category-table-wrap {
    border-top: 1px solid var(--line);
    overflow-x: visible;
}

.category-table {
    min-width: 0;
    table-layout: fixed;
}

.category-table th:first-child { width: 39%; }
.category-table th:nth-child(2) { width: 17%; }
.category-table th:nth-child(3) { width: 12%; }
.category-table th:nth-child(4) { width: 13%; }
.category-table th:last-child { width: 19%; }

.category-table td:first-child strong,
.category-table td:first-child small {
    display: block;
}

.category-table td:first-child small {
    line-height: 1.3;
    margin-top: 0.2rem;
}

.category-count-pill {
    align-items: center;
    background: rgba(42, 157, 143, 0.1);
    border-radius: 999px;
    color: var(--brand);
    display: inline-flex;
    font-size: 0.8rem;
    font-weight: 700;
    justify-content: center;
    min-width: 2rem;
    padding: 0.25rem 0.55rem;
}

.category-edit-btn,
.category-action-btn {
    align-items: center;
    display: inline-flex;
    height: 38px;
    justify-content: center;
    padding: 0;
    width: 42px;
}

.category-row-actions {
    align-items: center;
    display: flex;
    gap: 0.4rem;
    justify-content: flex-end;
}

.category-row-actions form {
    margin: 0;
}

.category-action-btn.is-blocked {
    opacity: 0.55;
}

.category-empty-state {
    color: var(--muted) !important;
    padding: 2.25rem 1rem !important;
    text-align: center;
}

.category-edit-dialog {
    background: transparent;
    border: 0;
    color: var(--ink);
    margin: auto;
    max-height: calc(100dvh - 2rem);
    max-width: min(34rem, calc(100vw - 2rem));
    overflow: visible;
    padding: 0;
    width: 100%;
}

.category-edit-dialog::backdrop {
    background: rgba(7, 24, 31, 0.58);
    backdrop-filter: blur(3px);
}

.category-edit-dialog__surface {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
}

.category-edit-dialog__header {
    align-items: flex-start;
    border-bottom: 1px solid var(--line);
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    padding: 1rem 1.1rem;
}

.category-edit-dialog__header h2 {
    font-size: 1.15rem;
    margin: 0;
}

.category-edit-dialog__header p {
    font-size: 0.84rem;
    line-height: 1.3;
    margin-top: 0.2rem;
}

.category-dialog-close {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 8px;
    color: var(--muted);
    cursor: pointer;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 1.5rem;
    height: 34px;
    justify-content: center;
    line-height: 1;
    padding: 0;
    width: 34px;
}

.category-dialog-close:hover {
    background: rgba(26, 74, 90, 0.08);
    color: var(--ink);
}

.category-edit-dialog__body {
    padding: 1rem 1.1rem;
}

.category-edit-dialog__footer {
    border-top: 1px solid var(--line);
    display: flex;
    gap: 0.65rem;
    justify-content: center;
    padding: 0.9rem 1.1rem 1.1rem;
}

html.theme-dark .category-summary-card {
    background: var(--card);
    border-color: var(--line);
}

html.theme-dark .category-count-pill {
    background: rgba(85, 199, 181, 0.14);
    color: var(--brand-2);
}

html.theme-dark .category-edit-dialog__surface {
    background: var(--card);
    border-color: var(--line);
    color: var(--ink);
}

@media (max-width: 991.98px) {
    .category-create-form {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .category-summary-grid {
        grid-template-columns: 1fr;
    }

    .category-list-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .category-create-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .category-create-heading .btn-back {
        align-self: flex-start;
        margin-left: 0;
    }

    .category-create-form {
        grid-template-columns: 1fr;
    }

    .category-search-form {
        flex-basis: auto;
        min-width: 0;
        width: 100%;
    }

    .category-table thead {
        display: none;
    }

    .category-table,
    .category-table tbody,
    .category-table tr,
    .category-table td {
        display: block;
        width: 100%;
    }

    .category-table tr {
        border-bottom: 1px solid var(--line);
        padding: 0.8rem 1rem;
    }

    .category-table tr:last-child {
        border-bottom: 0;
    }

    .category-table td {
        align-items: flex-start;
        border: 0;
        display: flex;
        justify-content: space-between;
        gap: 1rem;
        padding: 0.35rem 0 !important;
        text-align: right !important;
    }

    .category-table td::before {
        color: var(--muted);
        content: attr(data-label);
        flex: 0 0 42%;
        font-size: 0.72rem;
        font-weight: 700;
        letter-spacing: 0.04em;
        text-align: left;
        text-transform: uppercase;
    }

    .category-table td:first-child {
        align-items: flex-start;
    }

    .category-table td:first-child > * {
        max-width: 58%;
    }

    .category-table .category-empty-state {
        display: block;
        text-align: center !important;
    }

    .category-table .category-empty-state::before {
        content: none;
    }
}

@media (max-width: 520px) {
    .category-search-form {
        grid-template-columns: minmax(0, 1fr) 44px auto;
    }

    .category-save-btn {
        width: 100%;
    }

    .category-create-heading .btn-back {
        width: 100%;
    }
}
/* Inventario inicial y regularización — responsive v86 */
.regularization-page {
    display: grid;
    gap: 1rem;
    min-width: 0;
    max-width: 100%;
}

.regularization-page > *,
.regularization-page form,
.regularization-page input,
.regularization-page select,
.regularization-page textarea {
    min-width: 0;
    max-width: 100%;
}

.regularization-create-card,
.regularization-detail-page > .card {
    overflow: visible;
}

.regularization-create-form {
    display: grid;
    grid-template-columns: minmax(220px, 1.35fr) minmax(170px, .65fr) minmax(210px, .8fr);
    gap: .85rem 1rem;
    align-items: end;
    margin-top: 1rem;
}

.regularization-field {
    min-width: 0;
}

.regularization-field--notes {
    grid-column: 1 / -1;
}

.regularization-create-actions,
.regularization-line-actions,
.regularization-decision-actions {
    display: flex;
    justify-content: center;
    gap: .65rem;
}

.regularization-create-actions {
    grid-column: 1 / -1;
}

.regularization-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    min-width: 0;
}

.regularization-section-head .section-heading {
    min-width: 0;
}

.regularization-title-line {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .65rem;
}

.regularization-title-line h2 {
    margin: 0;
}

.regularization-detail-page > .regularization-workspace {
    display: block;
    overflow: hidden;
    padding: 0;
}

.regularization-workspace > .regularization-section-head {
    padding: 1rem 1.2rem;
}

.regularization-batch-notes {
    margin: 0 1.2rem 1rem;
    padding: .75rem .9rem;
    border-radius: var(--radius-sm);
    background: var(--surface-2);
    color: var(--muted);
    overflow-wrap: anywhere;
}

.regularization-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid var(--line);
    border-right: 0;
    border-left: 0;
    border-radius: 0;
    background: var(--surface);
    box-shadow: none;
}

.regularization-summary__item {
    display: grid;
    align-content: center;
    gap: .35rem;
    min-width: 0;
    min-height: 88px;
    padding: .9rem 1rem;
    border-inline-end: 1px solid var(--line);
}

.regularization-summary__item:last-child {
    border-inline-end: 0;
}

.regularization-summary__label {
    color: var(--muted);
    font-size: .78rem;
    font-weight: 700;
    line-height: 1.25;
}

.regularization-summary__item strong {
    display: block;
    color: var(--ink);
    font-size: 1.16rem;
    line-height: 1.15;
    overflow-wrap: anywhere;
}

.regularization-comparison-banner {
    display: grid;
    gap: .2rem;
    padding: .8rem 1.2rem;
    border-bottom: 1px solid var(--line);
    background: #eef8f6;
    color: #245e57;
}

.regularization-comparison-banner strong {
    color: #174f49;
    font-size: .88rem;
}

.regularization-comparison-banner span {
    font-size: .8rem;
    line-height: 1.4;
}

.regularization-comparison-banner--baseline {
    background: #eef5fb;
    color: #355f79;
}

.regularization-comparison-banner--baseline strong {
    color: #244f69;
}

.regularization-comparison-banner--warning {
    background: #fff7df;
    color: #735710;
}

.regularization-comparison-banner--warning strong {
    color: #604707;
}

.regularization-count-panel {
    padding: 1.1rem 1.2rem 1.2rem;
}

.regularization-new-product {
    margin-top: 1.2rem;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: var(--surface);
}

.regularization-new-product > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .9rem 1rem;
    color: var(--ink-2);
    cursor: pointer;
    list-style: none;
}

.regularization-new-product > summary::-webkit-details-marker {
    display: none;
}

.regularization-new-product > summary > span:first-child {
    display: grid;
    gap: .15rem;
}

.regularization-new-product > summary small {
    color: var(--muted);
    font-size: .78rem;
    font-weight: 400;
}

.regularization-new-product__action {
    flex: 0 0 auto;
    padding: .58rem .8rem;
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-sm);
    color: var(--ink-2);
    font-size: .8rem;
    font-weight: 700;
}

.regularization-new-product[open] .regularization-new-product__action {
    background: var(--surface-2);
}

.regularization-new-product__body {
    padding: 1rem;
    border-top: 1px solid var(--line);
}

.regularization-context-note {
    margin-bottom: 1rem;
    padding: .75rem .85rem;
    border-radius: var(--radius-sm);
    background: var(--surface-2);
    color: var(--muted);
    font-size: .8rem;
    line-height: 1.4;
}

.regularization-new-product-form {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .85rem 1rem;
    align-items: start;
}

.regularization-field--wide {
    grid-column: span 2;
}

.regularization-field--full,
.regularization-form-divider {
    grid-column: 1 / -1;
}

.regularization-checkbox-field {
    display: flex;
    align-items: center;
    gap: .6rem;
    min-height: 42px;
    color: var(--ink-2);
    font-size: .82rem;
}

.regularization-checkbox-field input {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
}

.regularization-form-divider {
    display: grid;
    gap: .15rem;
    margin-top: .15rem;
    padding-top: .9rem;
    border-top: 1px solid var(--line);
}

.regularization-form-divider strong {
    color: var(--ink-2);
    font-size: .88rem;
}

.regularization-form-divider span {
    color: var(--muted);
    font-size: .78rem;
}

.regularization-batch-list {
    display: grid;
    gap: .75rem;
    margin-top: 1rem;
}

.regularization-batch-card {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(180px, .7fr) auto;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: var(--surface);
}

.regularization-batch-card__main,
.regularization-batch-card__meta {
    min-width: 0;
}

.regularization-batch-card__topline {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    margin-bottom: .45rem;
}

.regularization-batch-card h3 {
    margin: 0 0 .25rem;
    font-family: var(--font-heading);
    font-size: 1rem;
    color: var(--ink-2);
    overflow-wrap: anywhere;
}

.regularization-batch-card p,
.regularization-batch-card__meta {
    margin: 0;
    color: var(--muted);
    font-size: .86rem;
    line-height: 1.45;
}

.regularization-batch-card__meta {
    display: grid;
    gap: .25rem;
}

.regularization-batch-card__open {
    white-space: nowrap;
}

.regularization-status--borrador {
    background: #eef2f6;
    color: #475569;
}

.regularization-status--en_revision {
    background: #fff3d6;
    color: #855d08;
}

.regularization-status--aplicado {
    background: #e1f5ed;
    color: #137052;
}

.regularization-status--revertido {
    background: #fbe9e7;
    color: #a33b32;
}

.regularization-file-actions {
    display: flex;
    flex: 0 0 auto;
    gap: .55rem;
}

.regularization-file-actions .icon-action-btn,
.regularization-line-card__actions .icon-action-btn {
    width: 44px;
    min-width: 44px;
    height: 42px;
    padding: 0;
}

.regularization-line-form {
    display: grid;
    grid-template-columns: minmax(240px, 1.4fr) minmax(190px, .85fr) minmax(150px, .55fr);
    gap: .85rem 1rem;
    align-items: start;
    margin-top: 1rem;
}

.regularization-field--product {
    grid-row: span 1;
}

.regularization-field--observation {
    grid-column: span 2;
}

.regularization-line-actions {
    grid-column: 1 / -1;
    align-self: end;
    padding-top: .2rem;
}

.regularization-product-search {
    position: relative;
}

.regularization-product-results {
    position: absolute;
    z-index: 1080;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    max-height: min(320px, 50vh);
    overflow-y: auto;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--surface);
    box-shadow: var(--shadow-md);
}

.regularization-product-result {
    display: grid;
    width: 100%;
    gap: .15rem;
    padding: .7rem .8rem;
    border: 0;
    border-bottom: 1px solid var(--line);
    background: transparent;
    color: var(--ink);
    text-align: left;
}

.regularization-product-result:hover,
.regularization-product-result:focus-visible {
    background: var(--surface-2);
    outline: none;
}

.regularization-product-result span {
    color: var(--muted);
    font-size: .78rem;
    overflow-wrap: anywhere;
}

.regularization-product-result--empty {
    color: var(--muted);
}

.regularization-search-form {
    display: grid;
    grid-template-columns: minmax(190px, 320px) 44px 44px;
    gap: .5rem;
}

.regularization-search-form .icon-search-btn {
    width: 44px;
    height: 40px;
    padding: 0;
}

.regularization-line-list {
    display: grid;
    gap: .65rem;
    margin-top: 1rem;
}

.regularization-line-card {
    display: grid;
    grid-template-columns: minmax(180px, 1.35fr) repeat(4, minmax(120px, .8fr)) auto;
    align-items: center;
    gap: .75rem;
    padding: .85rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: var(--surface);
    min-width: 0;
}

.regularization-line-card > * {
    min-width: 0;
}

.regularization-line-card__product,
.regularization-line-card__metric {
    display: grid;
    gap: .18rem;
}

.regularization-line-card__product strong,
.regularization-line-card__metric strong {
    color: var(--ink-2);
    font-size: .88rem;
    overflow-wrap: anywhere;
}

.regularization-line-card__product span,
.regularization-line-card__metric span,
.regularization-line-card__metric small {
    color: var(--muted);
    font-size: .76rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.regularization-origin-pill {
    width: fit-content;
    margin-top: .15rem;
    padding: .18rem .45rem;
    border-radius: 999px;
    background: #e4f3ef;
    color: #23685f !important;
    font-size: .69rem !important;
    font-weight: 700;
}

.regularization-line-card__comparison {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: .25rem .65rem;
    padding-top: .55rem;
    border-top: 1px solid var(--line);
    color: var(--muted);
    font-size: .76rem;
}

.regularization-line-card__comparison strong {
    color: var(--ink-2);
}

.regularization-comparison--surplus strong,
.regularization-comparison--shortage strong {
    color: #9a5d06;
}

.regularization-comparison--balanced strong {
    color: #23735f;
}

.regularization-line-card__actions {
    display: flex;
    gap: .4rem;
}

.regularization-line-card__actions form {
    margin: 0;
}

.regularization-line-card__note {
    grid-column: 1 / -1;
    margin: 0;
    padding-top: .55rem;
    border-top: 1px solid var(--line);
    color: var(--muted);
    font-size: .8rem;
    overflow-wrap: anywhere;
}

.regularization-empty {
    display: grid;
    justify-items: center;
    gap: .25rem;
    padding: 1.4rem;
    color: var(--muted);
    text-align: center;
}

.regularization-empty strong {
    color: var(--ink-2);
}

.regularization-validation-panel {
    padding: 1rem;
    border: 1px solid #e8c96c;
    border-radius: var(--radius-md);
    background: #fff8df;
    color: #6f5310;
}

.regularization-validation-panel ul {
    margin: .55rem 0 0;
    padding-left: 1.2rem;
}

.regularization-validation-panel li + li {
    margin-top: .3rem;
}

.regularization-decision-card {
    display: grid;
    justify-items: center;
    gap: .85rem;
}

.regularization-decision-card form {
    width: min(100%, 560px);
}

.regularization-decision-card > form:not(.regularization-confirm-form) {
    display: flex;
    justify-content: center;
}

.regularization-confirm-form {
    display: grid;
    gap: .55rem;
}

.regularization-delete-batch {
    display: flex;
    justify-content: center;
}

html.theme-dark .regularization-batch-card,
html.theme-dark .regularization-line-card,
html.theme-dark .regularization-summary,
html.theme-dark .regularization-product-results {
    background: var(--surface);
    border-color: var(--line);
}

html.theme-dark .regularization-comparison-banner,
html.theme-dark .regularization-comparison-banner--baseline {
    background: #18312f;
    color: #9acbc4;
}

html.theme-dark .regularization-comparison-banner strong,
html.theme-dark .regularization-comparison-banner--baseline strong {
    color: #c5ebe5;
}

html.theme-dark .regularization-comparison-banner--warning {
    background: #302a18;
    color: #f4d97e;
}

html.theme-dark .regularization-comparison-banner--warning strong {
    color: #ffe8a0;
}

html.theme-dark .regularization-origin-pill {
    background: #173a31;
    color: #85dfbe !important;
}

html.theme-dark .regularization-validation-panel {
    border-color: #7b641e;
    background: #302a18;
    color: #f4d97e;
}

html.theme-dark .regularization-status--borrador {
    background: #293541;
    color: #d8e2ec;
}

html.theme-dark .regularization-status--en_revision {
    background: #3b3118;
    color: #f3d16d;
}

html.theme-dark .regularization-status--aplicado {
    background: #173a31;
    color: #85dfbe;
}

html.theme-dark .regularization-status--revertido {
    background: #432421;
    color: #ffaaa2;
}

@media (max-width: 991.98px) {
    .regularization-create-form,
    .regularization-line-form,
    .regularization-new-product-form {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .regularization-field--notes,
    .regularization-field--observation,
    .regularization-field--full,
    .regularization-form-divider {
        grid-column: 1 / -1;
    }

    .regularization-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .regularization-summary__item {
        border-inline-end: 1px solid var(--line);
        border-bottom: 1px solid var(--line);
    }

    .regularization-summary__item:nth-child(2n) {
        border-inline-end: 0;
    }

    .regularization-summary__item:nth-last-child(-n + 2) {
        border-bottom: 0;
    }

    .regularization-batch-card {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .regularization-batch-card__meta {
        grid-column: 1;
    }

    .regularization-batch-card__open {
        grid-column: 2;
        grid-row: 1 / span 2;
    }

    .regularization-line-card {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: start;
    }

    .regularization-line-card__product,
    .regularization-line-card__note {
        grid-column: 1 / -1;
    }

    .regularization-line-card__actions {
        justify-content: flex-end;
    }
}

@media (max-width: 767.98px) {
    .regularization-page {
        gap: .75rem;
        width: 100%;
        overflow-x: clip;
    }

    .regularization-page .card-body {
        padding: .9rem;
    }

    .regularization-page .regularization-workspace {
        padding: 0;
    }

    .regularization-workspace > .regularization-section-head,
    .regularization-count-panel,
    .regularization-comparison-banner {
        padding-right: .9rem;
        padding-left: .9rem;
    }

    .regularization-create-form,
    .regularization-line-form,
    .regularization-new-product-form,
    .regularization-batch-card,
    .regularization-line-card {
        grid-template-columns: minmax(0, 1fr);
    }

    .regularization-field--wide,
    .regularization-field--full,
    .regularization-form-divider {
        grid-column: 1;
    }

    .regularization-new-product > summary {
        align-items: flex-start;
        flex-direction: column;
    }

    .regularization-new-product__action {
        width: 100%;
        text-align: center;
    }

    .regularization-field--notes,
    .regularization-field--observation,
    .regularization-line-actions,
    .regularization-create-actions,
    .regularization-line-card__product,
    .regularization-line-card__note,
    .regularization-batch-card__meta,
    .regularization-batch-card__open {
        grid-column: 1;
        grid-row: auto;
    }

    .regularization-section-head {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }

    .regularization-section-head > .btn-back {
        width: 100%;
    }

    .regularization-file-actions {
        width: 100%;
        justify-content: flex-end;
    }

    .regularization-batch-card__open {
        width: 100%;
    }

    .regularization-section-head--search {
        gap: .7rem;
    }

    .regularization-search-form {
        width: 100%;
        grid-template-columns: minmax(0, 1fr) 44px 44px;
    }

    .regularization-line-card {
        gap: .65rem;
        padding: .85rem;
    }

    .regularization-line-card__metric {
        grid-template-columns: minmax(105px, .8fr) minmax(0, 1fr);
        align-items: baseline;
        gap: .25rem .6rem;
        padding-top: .5rem;
        border-top: 1px solid var(--line);
    }

    .regularization-line-card__metric small {
        grid-row: 1 / span 2;
    }

    .regularization-line-card__actions {
        width: 100%;
        justify-content: flex-end;
        padding-top: .2rem;
    }

    .regularization-line-actions {
        flex-direction: column;
    }

    .regularization-line-actions .btn,
    .regularization-decision-actions .btn,
    .regularization-delete-batch .btn {
        width: 100%;
    }

    .regularization-product-results {
        position: fixed;
        top: auto;
        left: 1rem;
        right: 1rem;
        bottom: calc(5.3rem + env(safe-area-inset-bottom, 0px));
        max-height: min(50vh, 360px);
    }
}

@media (max-width: 420px) {
    .regularization-search-form {
        grid-template-columns: minmax(0, 1fr) 42px 42px;
        gap: .35rem;
    }

    .regularization-summary {
        grid-template-columns: minmax(0, 1fr);
    }

    .regularization-summary__item,
    .regularization-summary__item:nth-child(2n),
    .regularization-summary__item:nth-last-child(-n + 2) {
        min-height: 72px;
        border-inline-end: 0;
        border-bottom: 1px solid var(--line);
    }

    .regularization-summary__item:last-child {
        border-bottom: 0;
    }
}