/**
 * ERP CORE Design System
 * Applied last so every module, dashboard, and public page shares one identity.
 */
html { scroll-behavior: smooth; }

*,
*::before,
*::after {
    font-family: var(--ds-font) !important;
    box-sizing: border-box;
}

body {
    background: var(--ds-bg) !important;
    color: var(--ds-text) !important;
    font-size: var(--ds-body);
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
    min-height: 100vh;
}

h1, .h1 { font-size: var(--ds-h1) !important; font-weight: 800 !important; color: var(--ds-dark) !important; line-height: 1.25; letter-spacing: -0.02em; }
h2, .h2 { font-size: var(--ds-h2) !important; font-weight: 800 !important; color: var(--ds-dark) !important; line-height: 1.3; }
h3, .h3 { font-size: var(--ds-h3) !important; font-weight: 700 !important; color: var(--ds-dark) !important; }
h4, .h4 { font-size: var(--ds-h4) !important; font-weight: 700 !important; color: var(--ds-dark) !important; }
h5, .h5, h6, .h6 { font-size: var(--ds-small) !important; font-weight: 700 !important; color: var(--ds-dark) !important; }
p, .lead { color: var(--ds-text); line-height: 1.7; }
small, .small, .caption { font-size: var(--ds-caption); color: var(--ds-muted); }
a { color: var(--ds-primary); }
a:hover { color: var(--ds-primary-hover); }

.text-primary, .text-merp-teal, .text-merp-blue { color: var(--ds-primary) !important; }
.bg-primary { background-color: var(--ds-primary) !important; }
.border-primary { border-color: var(--ds-primary) !important; }
.link-primary { color: var(--ds-primary) !important; }

/* ── Buttons ── */
.btn {
    font-weight: 700 !important;
    border-radius: var(--ds-radius) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    transition: transform var(--ds-transition), box-shadow var(--ds-transition), background var(--ds-transition), border-color var(--ds-transition), color var(--ds-transition) !important;
    letter-spacing: 0;
}
.btn:focus-visible {
    outline: 2px solid var(--ds-primary);
    outline-offset: 2px;
}

.btn-primary,
.btn-merp,
.btn-erp-primary,
.btn-nav-launcher {
    background: var(--ds-gradient) !important;
    border: 0 !important;
    color: #fff !important;
    box-shadow: var(--ds-shadow-primary) !important;
}
.btn-primary:hover,
.btn-merp:hover,
.btn-erp-primary:hover,
.btn-nav-launcher:hover {
    background: linear-gradient(135deg, #15998A 0%, #12877A 100%) !important;
    color: #fff !important;
    transform: translateY(-1px);
}

.btn-secondary,
.btn-ds-secondary {
    background: var(--ds-secondary) !important;
    border: 0 !important;
    color: #fff !important;
}
.btn-secondary:hover,
.btn-ds-secondary:hover { background: var(--ds-secondary-hover) !important; color: #fff !important; }

.btn-outline-primary,
.btn-merp-outline,
.btn-erp-ghost,
.btn-outline-secondary {
    background: var(--ds-white) !important;
    border: 1.5px solid var(--ds-border) !important;
    color: var(--ds-dark) !important;
    box-shadow: none !important;
}
.btn-outline-primary { color: var(--ds-primary) !important; border-color: var(--ds-primary-border) !important; }
.btn-outline-primary:hover,
.btn-merp-outline:hover,
.btn-erp-ghost:hover {
    background: var(--ds-primary-light) !important;
    border-color: var(--ds-primary) !important;
    color: var(--ds-primary-deep) !important;
}

.btn-ghost,
.btn-light {
    background: var(--ds-white) !important;
    border: 1px solid var(--ds-border) !important;
    color: var(--ds-text) !important;
}
.btn-ghost:hover,
.btn-light:hover { background: var(--ds-bg) !important; }

.btn-danger { background: var(--ds-danger) !important; border: 0 !important; color: #fff !important; }
.btn-success { background: var(--ds-success) !important; border: 0 !important; color: #fff !important; }
.btn-warning { background: var(--ds-warning) !important; border: 0 !important; color: #111827 !important; }
.btn-info { background: var(--ds-info) !important; border: 0 !important; color: #fff !important; }
.btn-icon {
    width: 40px; height: 40px; padding: 0 !important;
    border-radius: var(--ds-radius) !important;
}

/* ── Forms ── */
.form-label {
    font-weight: 700 !important;
    font-size: var(--ds-small) !important;
    color: var(--ds-text) !important;
    margin-bottom: 6px !important;
}
.form-control,
.form-select,
.form-control-sm,
.form-select-sm,
textarea.form-control {
    border: 1.5px solid var(--ds-border) !important;
    border-radius: var(--ds-radius) !important;
    padding: 10px 14px !important;
    font-size: var(--ds-body) !important;
    color: var(--ds-dark) !important;
    background: var(--ds-white) !important;
    min-height: 44px;
}
.form-control:focus,
.form-select:focus {
    border-color: var(--ds-primary) !important;
    box-shadow: 0 0 0 3px rgba(27, 181, 164, 0.16) !important;
    outline: none !important;
}
.form-control.is-invalid,
.form-select.is-invalid { border-color: var(--ds-danger) !important; }
.form-control:disabled,
.form-select:disabled { background: #F3F4F6 !important; color: var(--ds-muted) !important; }
.form-text, .invalid-feedback { font-size: var(--ds-caption); }
.invalid-feedback { color: var(--ds-danger) !important; font-weight: 600; }

/* ── Cards ── */
.card,
.card-merp-modern,
.accounting-table,
.accounting-stat-card,
.inv-stat-card,
.balance-sheet-card,
.stat-card,
.quick-link-card,
.mt-stat-card,
.erp-kpi,
.pos-kpi,
.dept-kpi,
.cint-kpi,
.erp-nav-card,
.erp-hero,
.inv-welcome-section,
.dash-hero-card,
.package-card {
    background: var(--ds-white) !important;
    border: 1px solid var(--ds-border) !important;
    border-radius: var(--ds-radius-lg) !important;
    box-shadow: var(--ds-shadow) !important;
    color: var(--ds-text) !important;
}
.card-header,
.accounting-card-header {
    background: #F9FAFB !important;
    border-bottom: 1px solid var(--ds-border) !important;
    font-weight: 700 !important;
    color: var(--ds-dark) !important;
}
.card-merp-modern:hover,
.accounting-stat-card:hover,
.inv-stat-card:hover,
.erp-nav-card:hover,
.quick-link-card:hover,
.mt-stat-card:hover {
    border-color: var(--ds-primary-border) !important;
    box-shadow: var(--ds-shadow-md) !important;
    transform: translateY(-3px);
}

.erp-kpi-label,
.accounting-stat-label,
.inv-stat-label { color: var(--ds-muted) !important; font-weight: 700 !important; font-size: var(--ds-small) !important; }
.erp-kpi-value,
.accounting-stat-value,
.inv-stat-value { color: var(--ds-dark) !important; font-weight: 800 !important; }
.erp-kpi-icon,
.accounting-stat-icon,
.inv-stat-icon,
.quick-link-icon,
.module-icon-modern,
.erp-header-icon,
.stat-box-merp {
    background: var(--ds-primary-light) !important;
    color: var(--ds-primary) !important;
    box-shadow: none !important;
}
.module-icon-modern,
.erp-header-icon {
    background: var(--ds-gradient) !important;
    color: #fff !important;
    box-shadow: var(--ds-shadow-primary) !important;
}

/* ── Tables ── */
.table thead th,
.table-merp thead th,
.table-merp-modern thead th {
    background: #F9FAFB !important;
    color: var(--ds-muted) !important;
    font-weight: 800 !important;
    font-size: var(--ds-caption) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    border: 0 !important;
    padding: 14px 16px !important;
}
.table tbody td,
.table-merp tbody td,
.table-merp-modern tbody td {
    padding: 13px 16px !important;
    vertical-align: middle !important;
    border-color: #F3F4F6 !important;
    color: var(--ds-text) !important;
    font-size: var(--ds-body) !important;
}
.table tbody tr:hover,
.table-merp-modern tbody tr:hover { background: rgba(27, 181, 164, 0.04) !important; }

/* ── Badges ── */
.badge {
    padding: 5px 10px !important;
    font-weight: 700 !important;
    border-radius: 8px !important;
    font-size: var(--ds-caption) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
}
.badge.bg-primary,
.badge.bg-primary-subtle { background: var(--ds-primary-light) !important; color: var(--ds-primary-deep) !important; border: 1px solid var(--ds-primary-border) !important; }
.badge.bg-success { background: var(--ds-success-light) !important; color: #047857 !important; border: 1px solid #A7F3D0 !important; }
.badge.bg-warning { background: var(--ds-warning-light) !important; color: #B45309 !important; border: 1px solid #FDE68A !important; }
.badge.bg-danger { background: var(--ds-danger-light) !important; color: #B91C1C !important; border: 1px solid #FECACA !important; }
.badge.bg-info { background: var(--ds-info-light) !important; color: #15998A !important; border: 1px solid #B8EBE4 !important; }
.badge.bg-secondary { background: #F3F4F6 !important; color: var(--ds-text) !important; border: 1px solid var(--ds-border) !important; }

/* ── Alerts ── */
.alert {
    border: 1px solid transparent !important;
    border-radius: var(--ds-radius-lg) !important;
    font-weight: 600 !important;
}
.alert-success, .erp-alert.is-ok { background: var(--ds-success-light) !important; color: #047857 !important; border-color: #A7F3D0 !important; }
.alert-danger, .erp-alert.is-error { background: var(--ds-danger-light) !important; color: #991B1B !important; border-color: #FECACA !important; }
.alert-warning, .erp-alert.is-warn { background: var(--ds-warning-light) !important; color: #92400E !important; border-color: #FDE68A !important; }
.alert-info { background: var(--ds-info-light) !important; color: #12877A !important; border-color: #B8EBE4 !important; }

/* ── Nav / tabs / pagination ── */
.nav-tabs { border-bottom: 2px solid var(--ds-border) !important; }
.nav-tabs .nav-link {
    font-weight: 700 !important;
    color: var(--ds-muted) !important;
    border: 0 !important;
    border-bottom: 3px solid transparent !important;
    border-radius: 0 !important;
}
.nav-tabs .nav-link.active {
    color: var(--ds-primary) !important;
    border-bottom-color: var(--ds-primary) !important;
    background: transparent !important;
}
.pagination .page-link {
    border-radius: 8px !important;
    margin-inline: 3px !important;
    color: var(--ds-text) !important;
    border-color: var(--ds-border) !important;
    font-weight: 700 !important;
}
.pagination .active .page-link,
.pagination .page-item.active .page-link {
    background: var(--ds-primary) !important;
    border-color: var(--ds-primary) !important;
    color: #fff !important;
}
.breadcrumb { --bs-breadcrumb-divider-color: var(--ds-muted); }
.erp-breadcrumb a,
.breadcrumb-item a { color: var(--ds-primary) !important; text-decoration: none; font-weight: 600; }
.breadcrumb-item.active { color: var(--ds-muted); }

/* ── Empty / loading ── */
.erp-empty,
.ds-empty {
    background: var(--ds-white);
    border: 1.5px dashed #D1D5DB;
    border-radius: 22px;
    padding: 48px 24px;
    text-align: center;
    color: var(--ds-muted);
}
.ds-empty-icon {
    width: 56px; height: 56px; border-radius: 16px; margin: 0 auto 14px;
    display: flex; align-items: center; justify-content: center;
    background: var(--ds-primary-light); color: var(--ds-primary); font-size: 1.4rem;
}
.ds-skeleton {
    background: linear-gradient(90deg, #F3F4F6 0%, #E5E7EB 50%, #F3F4F6 100%);
    background-size: 200% 100%;
    animation: dsShimmer 1.2s ease-in-out infinite;
    border-radius: 8px;
}
@keyframes dsShimmer { 0% { background-position: 100% 0; } 100% { background-position: -100% 0; } }

/* ── Unified HR-style chrome for every module sidebar ── */
.sidebar,
.hr-sidebar,
.accounting-sidebar,
.inv-sidebar,
.mt-sidebar {
    background: var(--ds-gradient-dark) !important;
    border-inline-end: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 0 28px rgba(0, 0, 0, 0.28) !important;
}
.sidebar-menu .nav-link.active,
.menu-link.active,
.submenu-link.active {
    color: #fff !important;
    background: linear-gradient(90deg, rgba(27, 181, 164, 0.32) 0%, rgba(43, 91, 164, 0.12) 100%) !important;
    border-inline-start: 3.5px solid var(--ds-primary) !important;
    box-shadow: 0 4px 16px -2px rgba(27, 181, 164, 0.28) !important;
}
.sidebar-menu .nav-link.active i,
.menu-link.active i,
.submenu-link.active { color: #5ED4C6 !important; }
.sidebar-menu .nav-link:hover i,
.menu-link:hover i { color: #5ED4C6 !important; }
.sidebar-toggle-btn:hover,
.sidebar-toggle:hover {
    background: rgba(27, 181, 164, 0.35) !important;
    border-color: rgba(94, 212, 198, 0.5) !important;
}
.user-avatar,
.user-avatar-top,
.dash-avatar-circle {
    background: var(--ds-gradient-brand) !important;
    box-shadow: 0 2px 8px rgba(27, 181, 164, 0.28) !important;
}
.user-nav-profile:hover {
    background: var(--ds-primary-light) !important;
    border-color: var(--ds-primary-border) !important;
}
.btn-topbar-shortcut {
    background: var(--ds-primary-light) !important;
    border-color: var(--ds-primary-border) !important;
    color: var(--ds-primary-deep) !important;
}
.btn-topbar-shortcut:hover {
    background: var(--ds-primary) !important;
    color: #fff !important;
}
.sidebar-hr-badge,
.sidebar-cloud-badge {
    background: rgba(27, 181, 164, 0.14) !important;
    border-color: rgba(94, 212, 198, 0.28) !important;
    color: #7DD4C8 !important;
}
.company-code-val { color: #5ED4C6 !important; }

/* ── Topbars ── */
.top-navbar,
.hr-topbar {
    background: rgba(255, 255, 255, 0.94) !important;
    border-bottom: 1px solid var(--ds-border) !important;
}
.page-title,
.page-title-modern,
.page-title-merp,
.hr-page-heading,
.inv-welcome-title,
.accounting-page-title,
.erp-title {
    color: var(--ds-dark) !important;
}

/* ── Brand lockup ── */
.erp-brand-title .core-accent {
    background: var(--ds-gradient-brand) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* ── Public / auth helpers ── */
.btn-merp,
.hero-section { --merp-gradient: var(--ds-gradient); }
.hero-section { background: var(--ds-gradient-brand) !important; }
.navbar-merp .nav-link.active,
.navbar-merp .nav-link:hover { color: var(--ds-primary) !important; }

/* ── RTL logical helpers ── */
[dir="rtl"] .dropdown-menu-end { inset-inline-start: 0; inset-inline-end: auto; }
.ds-stack { display: flex; flex-direction: column; gap: 16px; }
.ds-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }

/* ── Dropdowns / modals ── */
.dropdown-menu {
    border: 1px solid var(--ds-border) !important;
    border-radius: var(--ds-radius-lg) !important;
    box-shadow: var(--ds-shadow-lg) !important;
    padding: 8px !important;
}
.dropdown-item { border-radius: 8px !important; font-weight: 600 !important; }
.dropdown-item.active,
.dropdown-item:active {
    background: var(--ds-primary) !important;
    color: #fff !important;
}
.modal-content { border: 0 !important; border-radius: var(--ds-radius-xl) !important; box-shadow: var(--ds-shadow-lg) !important; }
.modal-header { border-bottom-color: var(--ds-border) !important; }
.progress { background: #F3F4F6 !important; border-radius: 999px !important; }
.progress-bar { background: var(--ds-primary) !important; }

/* ── Mobile ── */
@media (max-width: 991px) {
    .content-area, .hr-content, .module-content { padding: 16px 12px !important; }
    .page-title, .page-title-modern { font-size: 1.1rem !important; }
}
@media (max-width: 575px) {
    h1, .h1, .erp-title { font-size: 1.35rem !important; }
    .btn { width: auto; }
    .table { font-size: 0.85rem; }
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; }
}