:root {
    --solux-primary: #0B1F3A;
    --solux-primary-hover: #123B6D;
    --solux-secondary: #334155;
    --solux-success: #039855;
    --solux-warning: #DC6803;
    --solux-danger: #D92D20;
    --solux-info: #2563EB;
    --solux-background: #F7F9FC;
    --solux-card: #FFFFFF;
    --solux-border: #E5E7EB;
    --solux-text: #1F2937;
    --solux-muted: #6B7280;
    --solux-radius-sm: 10px;
    --solux-radius-md: 14px;
    --solux-radius-lg: 16px;
    --solux-radius-xl: 22px;
    --solux-shadow-soft: 0 10px 28px rgba(11, 31, 58, 0.055);
    --solux-shadow-card: 0 14px 34px rgba(11, 31, 58, 0.08);
    --solux-font-family: Inter, "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, Arial, sans-serif;
    --solux-font-title: 24px;
    --solux-font-subtitle: 17px;
    --solux-font-card: 13px;
    --solux-font-table: 12px;
    --solux-font-form: 12px;
    --solux-transition: 0.24s ease;
    --primary: var(--solux-primary);
    --primary-light: var(--solux-primary-hover);
    --background: var(--solux-background);
    --card: var(--solux-card);
    --text: var(--solux-text);
    --muted: var(--solux-muted);
    --border: var(--solux-border);
    --radius-xl: var(--solux-radius-xl);
    --radius-lg: var(--solux-radius-lg);
    --radius-md: var(--solux-radius-md);
    --shadow-soft: var(--solux-shadow-soft);
    --shadow-card: var(--solux-shadow-card);
}

body {
    background: var(--solux-background);
    color: var(--solux-text);
    font-family: var(--solux-font-family);
}

.solux-title {
    color: var(--solux-primary);
    font-size: var(--solux-font-title);
    font-weight: 850;
    letter-spacing: 0;
}

.solux-subtitle {
    color: var(--solux-text);
    font-size: var(--solux-font-subtitle);
    font-weight: 800;
    letter-spacing: 0;
}

.btn-primary,
.btn-secondary,
.btn-outline,
.btn-success,
.btn-warning,
.btn-danger,
.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-danger,
.button,
.btn-solux {
    align-items: center;
    border-radius: var(--solux-radius-sm);
    display: inline-flex;
    font-size: 12px;
    font-weight: 800;
    gap: 6px;
    justify-content: center;
    letter-spacing: 0;
    min-height: 34px;
    padding: 7px 12px;
    transition: background-color var(--solux-transition), border-color var(--solux-transition), color var(--solux-transition), box-shadow var(--solux-transition), transform var(--solux-transition);
}

.btn-primary,
.btn-solux,
.button {
    background: var(--solux-primary);
    border-color: var(--solux-primary);
    color: #FFFFFF;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-solux:hover,
.button:hover {
    background: var(--solux-primary-hover);
    border-color: var(--solux-primary-hover);
    color: #FFFFFF;
}

.btn-secondary {
    background: var(--solux-secondary);
    border-color: var(--solux-secondary);
    color: #FFFFFF;
}

.btn-outline,
.btn-outline-primary,
.btn-outline-secondary {
    background: #FFFFFF;
    border: 1px solid var(--solux-border);
    color: var(--solux-primary);
}

.btn-outline:hover,
.btn-outline-primary:hover,
.btn-outline-secondary:hover {
    background: #EEF4FF;
    border-color: #C7D7FE;
    color: var(--solux-primary-hover);
}

.btn-success {
    background: var(--solux-success);
    border-color: var(--solux-success);
    color: #FFFFFF;
}

.btn-warning {
    background: #FFF7E6;
    border-color: #FEDF89;
    color: var(--solux-warning);
}

.btn-danger,
.btn-outline-danger {
    background: #FEF3F2;
    border-color: #FECDCA;
    color: var(--solux-danger);
}

.btn:hover,
.button:hover,
.btn-solux:hover {
    box-shadow: 0 8px 18px rgba(11, 31, 58, 0.10);
    transform: translateY(-1px);
}

.btn:disabled,
.button:disabled {
    box-shadow: none;
    opacity: 0.56;
    transform: none;
}

.card-standard,
.card-kpi,
.card-highlight,
.erp-card,
.panel,
.datos-card,
.compact-panel,
.compact-pagebar,
.compact-filter-bar,
.compact-kpi,
.erp-stat-card {
    background: var(--solux-card);
    border: 1px solid var(--solux-border);
    border-radius: var(--solux-radius-lg);
    box-shadow: var(--solux-shadow-soft);
    color: var(--solux-text);
    transition: border-color var(--solux-transition), box-shadow var(--solux-transition), transform var(--solux-transition);
}

.card-standard:hover,
.card-kpi:hover,
.card-highlight:hover,
.datos-card:hover,
.compact-panel:hover,
.compact-kpi:hover,
.erp-stat-card:hover {
    border-color: #D8DEE8;
    box-shadow: var(--solux-shadow-card);
}

.card-kpi,
.compact-kpi,
.erp-stat-card {
    min-height: 78px;
}

.card-highlight,
.compact-kpi.primary,
.dark-card {
    background: var(--solux-primary);
    border-color: var(--solux-primary);
    color: #FFFFFF;
}

.input-standard,
.select-standard,
.search-standard,
.form-control,
.form-select,
.compact-input,
.login-panel input {
    background: #FFFFFF;
    border: 1px solid var(--solux-border);
    border-radius: var(--solux-radius-sm);
    color: var(--solux-text);
    font-size: var(--solux-font-form);
    min-height: 34px;
    transition: border-color var(--solux-transition), box-shadow var(--solux-transition), background-color var(--solux-transition);
}

.input-standard:focus,
.select-standard:focus,
.search-standard:focus,
.form-control:focus,
.form-select:focus,
.compact-input:focus,
.login-panel input:focus {
    border-color: var(--solux-primary-hover);
    box-shadow: 0 0 0 3px rgba(18, 59, 109, 0.12);
    outline: 0;
}

.table-solux,
.compact-erp-table,
.data-table,
.product-table {
    border-collapse: separate;
    border-spacing: 0;
    color: var(--solux-text);
    font-size: var(--solux-font-table);
    margin-bottom: 0;
    width: 100%;
}

.table-solux th,
.compact-erp-table th,
.data-table th,
.product-table th {
    background: #F8FAFC;
    border-bottom: 1px solid var(--solux-border);
    color: var(--solux-muted);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0;
    text-transform: uppercase;
}

.table-solux td,
.compact-erp-table td,
.data-table td,
.product-table td {
    border-bottom: 1px solid #EEF2F7;
    color: var(--solux-text);
    vertical-align: middle;
}

.table-solux tbody tr,
.compact-erp-table tbody tr,
.data-table tbody tr,
.product-table tbody tr {
    transition: background-color 0.18s ease;
}

.table-solux tbody tr:hover,
.compact-erp-table tbody tr:hover,
.data-table tbody tr:hover,
.product-table tbody tr:hover {
    background: #F8FAFC;
}

.badge-success,
.badge-warning,
.badge-danger,
.badge-info,
.badge,
.cost-badge {
    align-items: center;
    border-radius: 999px;
    display: inline-flex;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    min-height: 20px;
    padding: 3px 7px;
}

.badge-success {
    background: #ECFDF3;
    border: 1px solid #ABEFC6;
    color: #027A48;
}

.badge-warning {
    background: #FFF7E6;
    border: 1px solid #FEDF89;
    color: #B54708;
}

.badge-danger {
    background: #FEF3F2;
    border: 1px solid #FECDCA;
    color: #B42318;
}

.badge-info,
.text-bg-light {
    background: #F8FAFC !important;
    border: 1px solid var(--solux-border);
    color: var(--solux-primary) !important;
}

.tab-standard,
.nav-tabs .nav-link,
.compact-tabs .nav-link {
    border: 1px solid transparent;
    border-radius: var(--solux-radius-sm) var(--solux-radius-sm) 0 0;
    color: var(--solux-muted);
    font-size: 12px;
    font-weight: 850;
    min-height: 36px;
    padding: 8px 12px;
    transition: background-color var(--solux-transition), border-color var(--solux-transition), color var(--solux-transition);
}

.tab-standard:hover,
.nav-tabs .nav-link:hover,
.compact-tabs .nav-link:hover {
    background: #F8FAFC;
    border-color: var(--solux-border);
    color: var(--solux-primary);
}

.tab-active,
.nav-tabs .nav-link.active,
.compact-tabs .nav-link.active {
    background: #FFFFFF;
    border-color: var(--solux-border) var(--solux-border) #FFFFFF;
    color: var(--solux-primary);
}

.modal-solux,
.modal-content {
    background: var(--solux-card);
    border: 1px solid var(--solux-border);
    border-radius: var(--solux-radius-lg);
    box-shadow: 0 26px 70px rgba(11, 31, 58, 0.22);
}

.alert-info,
.alert-warning,
.alert-danger,
.alert-success,
.erp-alert {
    border-radius: var(--solux-radius-md);
    font-size: 13px;
    font-weight: 700;
}

.alert-info {
    background: #EFF6FF;
    border-color: #BFDBFE;
    color: #1D4ED8;
}

.alert-warning {
    background: #FFF7E6;
    border-color: #FEDF89;
    color: #B54708;
}

.alert-danger {
    background: #FEF3F2;
    border-color: #FECDCA;
    color: #B42318;
}

.alert-success {
    background: #ECFDF3;
    border-color: #ABEFC6;
    color: #027A48;
}

.layout-sidebar,
.erp-sidebar {
    background: var(--solux-primary);
}

.layout-topbar,
.erp-topbar {
    background: rgba(255, 255, 255, 0.92);
    border-bottom: 1px solid var(--solux-border);
}

.layout-main,
.erp-content {
    background: var(--solux-background);
}

.dashboard-grid,
.stats-grid,
.datos-grid {
    display: grid;
    gap: 14px;
}
