/* ==========================================================================
   REDESIGN v2.0 — Premium SaaS Design System
   Deep Indigo + Slate · Dark Sidebar · Calm & Powerful
   Loaded AFTER vendor CSS to override Bootstrap/PcCoded visuals.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. DESIGN TOKENS
   -------------------------------------------------------------------------- */
:root {
    /* ── Primary (Deep Indigo) ── */
    --rd-primary: #4F46E5;
    --rd-primary-hover: #4338CA;
    --rd-primary-light: #EEF2FF;
    --rd-primary-lighter: #F5F3FF;
    --rd-primary-rgb: 79, 70, 229;

    /* ── Accent ── */
    --rd-accent: #6366F1;
    --rd-accent-light: #E0E7FF;

    /* ── Success ── */
    --rd-success: #10B981;
    --rd-success-light: #D1FAE5;
    --rd-success-dark: #059669;

    /* ── Warning ── */
    --rd-warning: #F59E0B;
    --rd-warning-light: #FEF3C7;
    --rd-warning-dark: #D97706;

    /* ── Danger ── */
    --rd-danger: #EF4444;
    --rd-danger-light: #FEE2E2;
    --rd-danger-dark: #DC2626;

    /* ── Info ── */
    --rd-info: #8B5CF6;
    --rd-info-light: #EDE9FE;

    /* ── Slate Neutrals ── */
    --rd-slate-50: #F8FAFC;
    --rd-slate-100: #F1F5F9;
    --rd-slate-200: #E2E8F0;
    --rd-slate-300: #CBD5E1;
    --rd-slate-400: #94A3B8;
    --rd-slate-500: #64748B;
    --rd-slate-600: #475569;
    --rd-slate-700: #334155;
    --rd-slate-800: #1E293B;
    --rd-slate-900: #0F172A;
    --rd-slate-950: #020617;

    /* ── Sidebar (Dark) ── */
    --rd-sidebar-bg: #0F172A;
    --rd-sidebar-border: rgba(148,163,184,0.08);
    --rd-sidebar-text: #94A3B8;
    --rd-sidebar-text-hover: #E2E8F0;
    --rd-sidebar-active-bg: rgba(79,70,229,0.12);
    --rd-sidebar-active-text: #A5B4FC;
    --rd-sidebar-caption: #475569;
    --rd-sidebar-width: 280px;

    /* ── Spacing ── */
    --rd-space-xs: 0.25rem;
    --rd-space-sm: 0.5rem;
    --rd-space-md: 1rem;
    --rd-space-lg: 1.5rem;
    --rd-space-xl: 2rem;
    --rd-space-2xl: 3rem;

    /* ── Radii ── */
    --rd-radius-sm: 0.375rem;
    --rd-radius-md: 0.5rem;
    --rd-radius-lg: 0.75rem;
    --rd-radius-xl: 1rem;
    --rd-radius-full: 50rem;

    /* ── Shadows ── */
    --rd-shadow-xs: 0 1px 2px rgba(0,0,0,0.04);
    --rd-shadow-sm: 0 1px 3px rgba(0,0,0,0.05), 0 1px 2px rgba(0,0,0,0.03);
    --rd-shadow-md: 0 4px 6px -1px rgba(0,0,0,0.06), 0 2px 4px -2px rgba(0,0,0,0.04);
    --rd-shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.07), 0 4px 6px -4px rgba(0,0,0,0.03);
    --rd-shadow-xl: 0 20px 25px -5px rgba(0,0,0,0.08), 0 8px 10px -6px rgba(0,0,0,0.03);
    --rd-shadow-focus: 0 0 0 3px rgba(79,70,229,0.15);

    /* ── Transitions ── */
    --rd-transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --rd-transition-base: 200ms cubic-bezier(0.4, 0, 0.2, 1);
    --rd-transition-slow: 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* --------------------------------------------------------------------------
   2. GLOBAL BASE
   -------------------------------------------------------------------------- */
body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: var(--rd-slate-700);
    font-size: 0.875rem;
    line-height: 1.6;
}

/* ── Floating Sky Background for Admin Panel ── */
body.rd-admin {
    background: linear-gradient(135deg,
        #E0E7FF 0%,
        #DBEAFE 25%,
        #EDE9FE 50%,
        #E0F2FE 75%,
        #F0E6FF 100%) !important;
    background-size: 400% 400% !important;
    animation: rd-sky-drift 20s ease infinite !important;
    min-height: 100vh;
}

@keyframes rd-sky-drift {
    0%, 100% { background-position: 0% 50%; }
    25% { background-position: 100% 0%; }
    50% { background-position: 100% 100%; }
    75% { background-position: 0% 100%; }
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
    color: var(--rd-slate-800);
    letter-spacing: -0.02em;
    line-height: 1.3;
}

a { transition: color var(--rd-transition-fast); }

::selection {
    background: rgba(79,70,229,0.15);
    color: var(--rd-slate-900);
}

/* Scrollbar */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--rd-slate-300); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--rd-slate-400); }

/* --------------------------------------------------------------------------
   3. SIDEBAR — Dark Slate
   -------------------------------------------------------------------------- */
.pc-sidebar {
    background: var(--rd-sidebar-bg) !important;
    border-right: 1px solid var(--rd-sidebar-border) !important;
    width: var(--rd-sidebar-width) !important;
    box-shadow: none !important;
}

.pc-sidebar .navbar-wrapper { background: transparent !important; }

/* Logo area */
.pc-sidebar .m-header {
    padding: 1.25rem 1.5rem !important;
    border-bottom: 1px solid var(--rd-sidebar-border) !important;
    background: transparent !important;
    height: auto !important;
}

.pc-sidebar .m-header .b-brand { text-decoration: none !important; }

.pc-sidebar .m-header .logo-lg {
    max-width: 160px !important;
    height: auto !important;
    filter: brightness(0) invert(1);
    opacity: 0.9;
    transition: opacity var(--rd-transition-fast);
}
.pc-sidebar .m-header .logo-lg:hover { opacity: 1; }

/* Nav container */
.pc-sidebar .navbar-content {
    padding: 0.75rem 0 !important;
    background: transparent !important;
}

/* Section captions */
.pc-sidebar .pc-navbar .pc-item.pc-caption {
    padding: 1.5rem 1.5rem 0.375rem !important;
    margin-top: 0.25rem !important;
}

.pc-sidebar .pc-navbar .pc-item.pc-caption label {
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    color: var(--rd-sidebar-caption) !important;
}

.pc-sidebar .pc-navbar .pc-item.pc-caption i { display: none !important; }

/* Nav links */
.pc-sidebar .pc-navbar .pc-item .pc-link {
    padding: 0.5rem 1rem !important;
    margin: 1px 0.75rem !important;
    border-radius: var(--rd-radius-md) !important;
    transition: all var(--rd-transition-fast) !important;
    font-size: 0.8125rem !important;
    font-weight: 500 !important;
    color: var(--rd-sidebar-text) !important;
    background: transparent !important;
    border-left: 2px solid transparent !important;
}

.pc-sidebar .pc-navbar .pc-item .pc-link:hover {
    background: rgba(148,163,184,0.06) !important;
    color: var(--rd-sidebar-text-hover) !important;
}

/* Active state */
.pc-sidebar .pc-navbar .pc-item.active > .pc-link,
.pc-sidebar .pc-navbar .pc-item.pc-trigger.active > .pc-link {
    background: var(--rd-sidebar-active-bg) !important;
    color: var(--rd-sidebar-active-text) !important;
    font-weight: 600 !important;
    border-left-color: var(--rd-primary) !important;
}

/* Nav Icons */
.pc-sidebar .pc-navbar .pc-item .pc-link .pc-micon {
    margin-right: 0.75rem !important;
    width: 20px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.pc-sidebar .pc-navbar .pc-item .pc-link .pc-micon i,
.pc-sidebar .pc-navbar .pc-item .pc-link .pc-micon svg {
    width: 18px !important;
    height: 18px !important;
    stroke-width: 1.75 !important;
    color: var(--rd-sidebar-text) !important;
    transition: color var(--rd-transition-fast) !important;
    font-size: 1.125rem !important;
}

.pc-sidebar .pc-navbar .pc-item .pc-link:hover .pc-micon i,
.pc-sidebar .pc-navbar .pc-item .pc-link:hover .pc-micon svg {
    color: var(--rd-sidebar-text-hover) !important;
}

.pc-sidebar .pc-navbar .pc-item.active > .pc-link .pc-micon i,
.pc-sidebar .pc-navbar .pc-item.active > .pc-link .pc-micon svg {
    color: var(--rd-sidebar-active-text) !important;
}

/* Submenu */
.pc-sidebar .pc-submenu {
    padding-left: 0 !important;
    background: transparent !important;
}

.pc-sidebar .pc-submenu .pc-item .pc-link {
    font-size: 0.8125rem !important;
    padding: 0.375rem 1rem 0.375rem 3.25rem !important;
    color: var(--rd-sidebar-text) !important;
    opacity: 0.8;
    margin: 0 0.75rem !important;
}

.pc-sidebar .pc-submenu .pc-item .pc-link:hover { opacity: 1; }

.pc-sidebar .pc-submenu .pc-item.active .pc-link {
    color: var(--rd-sidebar-active-text) !important;
    opacity: 1;
    font-weight: 600 !important;
}

/* Submenu arrow */
.pc-sidebar .pc-navbar .pc-item .pc-link .pc-arrow i,
.pc-sidebar .pc-navbar .pc-item .pc-link .pc-arrow svg {
    color: var(--rd-sidebar-caption) !important;
    width: 14px !important;
    height: 14px !important;
}

/* Version badge */
.pc-sidebar .theme-version {
    color: var(--rd-sidebar-caption) !important;
    background: rgba(148,163,184,0.06) !important;
    font-size: 0.6875rem !important;
}

/* --------------------------------------------------------------------------
   4. HEADER — Frosted Glass
   -------------------------------------------------------------------------- */
.pc-header {
    background: rgba(255, 255, 255, 0.6) !important;
    backdrop-filter: blur(20px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
    border-bottom: 1px solid rgba(99, 102, 241, 0.08) !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.04) !important;
    z-index: 1024 !important;
}

.pc-header .header-wrapper {
    padding: 0.5rem 1.5rem !important;
}

.pc-header .pc-head-link {
    border-radius: var(--rd-radius-md) !important;
    width: 36px !important;
    height: 36px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all var(--rd-transition-fast) !important;
    color: var(--rd-slate-500) !important;
    background: transparent !important;
}

.pc-header .pc-head-link:hover {
    background: rgba(79, 70, 229, 0.06) !important;
    color: var(--rd-slate-700) !important;
}

/* User avatar */
.pc-header .user-avtar {
    width: 34px !important;
    height: 34px !important;
    border-radius: var(--rd-radius-full) !important;
    border: 2px solid rgba(99, 102, 241, 0.15) !important;
    object-fit: cover !important;
    transition: border-color var(--rd-transition-fast) !important;
}

.pc-header .header-user-profile:hover .user-avtar {
    border-color: var(--rd-primary) !important;
}

/* Profile dropdown */
.pc-header .dropdown-user-profile {
    border-radius: var(--rd-radius-lg) !important;
    box-shadow: var(--rd-shadow-xl) !important;
    border: 1px solid var(--rd-slate-200) !important;
    min-width: 240px !important;
    padding: 0.25rem 0 !important;
    overflow: hidden !important;
}

.pc-header .dropdown-user-profile .dropdown-header {
    padding: var(--rd-space-md) var(--rd-space-lg) !important;
    border-bottom: 1px solid var(--rd-slate-100) !important;
}

.pc-header .dropdown-user-profile .dropdown-header h4 {
    font-size: 0.9375rem !important;
    font-weight: 600 !important;
}

.pc-header .dropdown-user-profile .dropdown-header p {
    font-size: 0.75rem !important;
    color: var(--rd-slate-400) !important;
    text-transform: capitalize !important;
}

.pc-header .dropdown-user-profile .dropdown-item {
    padding: 0.5rem 1.25rem !important;
    font-size: 0.8125rem !important;
    color: var(--rd-slate-600) !important;
    transition: all var(--rd-transition-fast) !important;
}

.pc-header .dropdown-user-profile .dropdown-item:hover {
    background: var(--rd-slate-50) !important;
    color: var(--rd-slate-800) !important;
}

.pc-header .dropdown-user-profile .dropdown-item i {
    margin-right: 0.5rem !important;
    font-size: 1rem !important;
}

/* Greeting badge */
.rd-greeting-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    background: rgba(79, 70, 229, 0.08);
    color: var(--rd-primary);
    padding: 0.3rem 0.875rem;
    border-radius: var(--rd-radius-full);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    border: 1px solid rgba(79, 70, 229, 0.1);
}

/* Language dropdown */
.pc-header .pc-h-dropdown {
    border-radius: var(--rd-radius-lg) !important;
    box-shadow: var(--rd-shadow-xl) !important;
    border: 1px solid var(--rd-slate-200) !important;
    padding: 0.25rem 0 !important;
}

.pc-header .pc-h-dropdown .dropdown-item {
    padding: 0.5rem 1rem !important;
    font-size: 0.8125rem !important;
    transition: background var(--rd-transition-fast) !important;
}

.pc-header .pc-h-dropdown .dropdown-item:hover {
    background: var(--rd-slate-50) !important;
}

.pc-header .pc-h-dropdown .dropdown-item.active {
    background: var(--rd-primary-light) !important;
    color: var(--rd-primary) !important;
}

/* --------------------------------------------------------------------------
   5. PAGE HEADER & BREADCRUMB
   -------------------------------------------------------------------------- */
.pc-container {
    background: transparent !important;
    position: relative;
    z-index: 1;
}

.page-header {
    margin-bottom: var(--rd-space-xl) !important;
}

.page-header .page-header-title h5 {
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    color: var(--rd-slate-900) !important;
    letter-spacing: -0.02em !important;
}

.breadcrumb {
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    font-size: 0.8125rem !important;
}

.breadcrumb-item a {
    color: var(--rd-slate-400) !important;
    text-decoration: none !important;
}

.breadcrumb-item a:hover { color: var(--rd-primary) !important; }

.breadcrumb-item.active,
.breadcrumb-item.active a {
    color: var(--rd-slate-500) !important;
}

.breadcrumb-item + .breadcrumb-item::before {
    color: var(--rd-slate-300) !important;
}

/* --------------------------------------------------------------------------
   6. CARDS — Clean & Elevated
   -------------------------------------------------------------------------- */
.card {
    border: 1px solid rgba(255, 255, 255, 0.7) !important;
    border-radius: var(--rd-radius-lg) !important;
    box-shadow: 0 8px 32px rgba(79, 70, 229, 0.06), 0 2px 8px rgba(0,0,0,0.04) !important;
    background: rgba(255, 255, 255, 0.65) !important;
    backdrop-filter: blur(16px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(160%) !important;
    transition: transform 0.4s ease, box-shadow 0.4s ease !important;
    overflow: hidden !important;
}

.card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 48px rgba(79, 70, 229, 0.1), 0 4px 12px rgba(0,0,0,0.06) !important;
}

.card .card-header {
    background: rgba(255, 255, 255, 0.3) !important;
    border-bottom: 1px solid rgba(99, 102, 241, 0.06) !important;
    padding: 1.25rem 1.5rem !important;
}

.card .card-header h5 {
    font-size: 0.9375rem !important;
    font-weight: 600 !important;
    color: var(--rd-slate-800) !important;
    margin: 0 !important;
}

.card .card-body {
    padding: 1.5rem !important;
}

/* ── Stat Cards (Dashboard KPIs) ── */
.rd-stat-card {
    position: relative;
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    animation: rd-card-float 5s ease-in-out infinite;
}
.rd-stat-card:nth-child(2) { animation-delay: 0.5s; }
.rd-stat-card:nth-child(3) { animation-delay: 1s; }
.rd-stat-card:nth-child(4) { animation-delay: 1.5s; }
.rd-stat-card:nth-child(5) { animation-delay: 2s; }
.rd-stat-card:nth-child(6) { animation-delay: 2.5s; }
.rd-stat-card:nth-child(7) { animation-delay: 3s; }

.rd-stat-card:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25) !important;
}

@keyframes rd-card-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

.rd-stat-card .rd-stat-icon {
    width: 48px;
    height: 48px;
    border-radius: var(--rd-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
}

.rd-stat-card .rd-stat-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--rd-slate-500);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 0.25rem;
}

.rd-stat-card .rd-stat-value {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--rd-slate-900);
    letter-spacing: -0.02em;
    line-height: 1.2;
}

/* Stat icon variants */
.rd-icon-primary { background: var(--rd-primary-light); color: var(--rd-primary); }
.rd-icon-success { background: var(--rd-success-light); color: var(--rd-success); }
.rd-icon-warning { background: var(--rd-warning-light); color: var(--rd-warning); }
.rd-icon-danger { background: var(--rd-danger-light); color: var(--rd-danger); }
.rd-icon-info { background: var(--rd-info-light); color: var(--rd-info); }
.rd-icon-accent { background: var(--rd-accent-light); color: var(--rd-accent); }

/* --------------------------------------------------------------------------
   7. FOOTER
   -------------------------------------------------------------------------- */
.pc-footer {
    background: transparent !important;
    border-top: 1px solid rgba(99, 102, 241, 0.06) !important;
    padding: 0.75rem 0 !important;
}

.pc-footer .footer-wrapper { padding: 0 1.5rem !important; }

.pc-footer p, .pc-footer a {
    font-size: 0.75rem !important;
    color: var(--rd-slate-400) !important;
}

.pc-footer a:hover { color: var(--rd-primary) !important; }

/* --------------------------------------------------------------------------
   8. TABLES — Clean Data View
   -------------------------------------------------------------------------- */
.table { margin-bottom: 0 !important; }

.table thead th {
    background: rgba(99, 102, 241, 0.04) !important;
    border-bottom: 2px solid rgba(99, 102, 241, 0.08) !important;
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    color: var(--rd-slate-500) !important;
    padding: 0.75rem 1rem !important;
    white-space: nowrap !important;
}

.table tbody td {
    padding: 0.75rem 1rem !important;
    font-size: 0.8125rem !important;
    color: var(--rd-slate-700) !important;
    vertical-align: middle !important;
    border-bottom: 1px solid rgba(99, 102, 241, 0.04) !important;
    transition: background var(--rd-transition-fast) !important;
}

.table-hover tbody tr:hover td,
.table tbody tr:hover td {
    background: rgba(79, 70, 229, 0.03) !important;
}

.table .badge {
    font-size: 0.6875rem !important;
    font-weight: 600 !important;
    padding: 0.25em 0.625em !important;
    border-radius: var(--rd-radius-full) !important;
    letter-spacing: 0.02em !important;
}

/* Action buttons in tables */
.cart-action {
    display: flex !important;
    align-items: center !important;
    gap: 0.25rem !important;
    flex-wrap: nowrap !important;
}

.cart-action .avtar {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 30px !important;
    height: 30px !important;
    border-radius: var(--rd-radius-sm) !important;
    transition: all var(--rd-transition-fast) !important;
    border: 1px solid transparent !important;
}

.cart-action .avtar:hover { transform: scale(1.08); }
.cart-action .btn-link-warning:hover { background: var(--rd-warning-light) !important; border-color: rgba(245,158,11,0.2) !important; }
.cart-action .btn-link-secondary:hover { background: var(--rd-primary-light) !important; border-color: rgba(79,70,229,0.2) !important; }
.cart-action .btn-link-danger:hover { background: var(--rd-danger-light) !important; border-color: rgba(239,68,68,0.2) !important; }
.cart-action .btn-link-info:hover { background: var(--rd-info-light) !important; border-color: rgba(139,92,246,0.2) !important; }

/* User profile in tables */
.table .img-radius {
    border: 2px solid rgba(99, 102, 241, 0.1) !important;
    border-radius: 50% !important;
    transition: border-color var(--rd-transition-fast) !important;
}
.table tr:hover .img-radius { border-color: var(--rd-primary) !important; }

/* --------------------------------------------------------------------------
   9. FORMS — Professional Inputs
   -------------------------------------------------------------------------- */
.form-control {
    border-radius: var(--rd-radius-md) !important;
    border: 1px solid rgba(99, 102, 241, 0.12) !important;
    padding: 0.5rem 0.875rem !important;
    font-size: 0.8125rem !important;
    transition: border-color var(--rd-transition-fast), box-shadow var(--rd-transition-fast) !important;
    color: var(--rd-slate-800) !important;
    background-color: rgba(255, 255, 255, 0.7) !important;
    line-height: 1.5 !important;
}

.form-control:focus {
    border-color: var(--rd-primary) !important;
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.12) !important;
    outline: none !important;
    background-color: rgba(255, 255, 255, 0.9) !important;
}

.form-control::placeholder { color: var(--rd-slate-400) !important; }

.form-label {
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    color: var(--rd-slate-700) !important;
    margin-bottom: 0.375rem !important;
}

.form-group { margin-bottom: 1rem !important; }

.form-check-input:checked {
    background-color: var(--rd-primary) !important;
    border-color: var(--rd-primary) !important;
}

.form-check-input:focus {
    box-shadow: var(--rd-shadow-focus) !important;
    border-color: var(--rd-primary) !important;
}

/* Form sections in modals */
.sa-form-section,
.rd-form-section {
    background: var(--rd-slate-50);
    border-radius: var(--rd-radius-md);
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid var(--rd-slate-100);
}

.sa-form-section-title,
.rd-form-section-title {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--rd-slate-400);
    margin-bottom: 0.875rem;
    padding-bottom: 0.375rem;
    border-bottom: 1px solid var(--rd-slate-200);
}

/* Floating labels */
.form-floating > .form-control {
    height: 3rem !important;
    padding: 1rem 0.875rem !important;
}

.form-floating > label {
    padding: 0.875rem !important;
    color: var(--rd-slate-400) !important;
    font-size: 0.875rem !important;
}

/* --------------------------------------------------------------------------
   10. BUTTONS — Modern & Consistent
   -------------------------------------------------------------------------- */
.btn {
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    border-radius: var(--rd-radius-md) !important;
    padding: 0.5rem 1rem !important;
    transition: all var(--rd-transition-fast) !important;
    letter-spacing: 0.01em !important;
    border: 1px solid transparent !important;
    line-height: 1.5 !important;
}

.btn:active { transform: scale(0.97); }

.btn-secondary {
    background: var(--rd-primary) !important;
    border-color: var(--rd-primary) !important;
    color: #fff !important;
}

.btn-secondary:hover, .btn-secondary:focus {
    background: var(--rd-primary-hover) !important;
    border-color: var(--rd-primary-hover) !important;
    box-shadow: 0 4px 12px rgba(var(--rd-primary-rgb), 0.25) !important;
    color: #fff !important;
}

.btn-outline-secondary {
    color: var(--rd-primary) !important;
    border-color: var(--rd-primary) !important;
    background: transparent !important;
}

.btn-outline-secondary:hover {
    background: var(--rd-primary) !important;
    color: #fff !important;
}

.btn-danger {
    background: var(--rd-danger) !important;
    border-color: var(--rd-danger) !important;
}

.btn-danger:hover {
    background: var(--rd-danger-dark) !important;
    box-shadow: 0 4px 12px rgba(239,68,68,0.25) !important;
}

.btn-success {
    background: var(--rd-success) !important;
    border-color: var(--rd-success) !important;
}

.btn-success:hover {
    background: var(--rd-success-dark) !important;
    box-shadow: 0 4px 12px rgba(16,185,129,0.25) !important;
}

.btn i, .btn svg { vertical-align: middle !important; }

/* --------------------------------------------------------------------------
   11. MODALS — Premium Feel
   -------------------------------------------------------------------------- */
.modal-content {
    border-radius: var(--rd-radius-xl) !important;
    border: 1px solid rgba(255, 255, 255, 0.7) !important;
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.12) !important;
    overflow: hidden !important;
    background: rgba(255, 255, 255, 0.85) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
}

.modal-header {
    background: rgba(255, 255, 255, 0.5) !important;
    border-bottom: 1px solid rgba(99, 102, 241, 0.06) !important;
    padding: 1.125rem 1.5rem !important;
}

.modal-header .modal-title {
    font-size: 1rem !important;
    font-weight: 700 !important;
    color: var(--rd-slate-900) !important;
}

.modal-body { padding: 1.5rem !important; }

.modal-footer {
    background: rgba(255, 255, 255, 0.5) !important;
    border-top: 1px solid rgba(99, 102, 241, 0.06) !important;
    padding: 0.875rem 1.5rem !important;
}

/* Modal loading spinner */
.sa-modal-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1rem;
    gap: 1rem;
}

.sa-modal-spinner {
    width: 36px;
    height: 36px;
    border: 3px solid var(--rd-slate-200);
    border-top-color: var(--rd-primary);
    border-radius: 50%;
    animation: rd-spin 0.7s linear infinite;
}

@keyframes rd-spin { to { transform: rotate(360deg); } }

.sa-modal-loading p {
    font-size: 0.8125rem;
    color: var(--rd-slate-400);
    margin: 0;
}

/* --------------------------------------------------------------------------
   12. BADGES — Semantic Pills
   -------------------------------------------------------------------------- */
.badge {
    font-size: 0.6875rem !important;
    font-weight: 600 !important;
    padding: 0.25em 0.625em !important;
    border-radius: var(--rd-radius-full) !important;
}

.badge.bg-light { background: var(--rd-slate-100) !important; color: var(--rd-slate-600) !important; }
.badge.bg-primary { background: var(--rd-primary-light) !important; color: var(--rd-primary) !important; }
.badge.bg-success { background: var(--rd-success-light) !important; color: var(--rd-success-dark) !important; }
.badge.bg-warning { background: var(--rd-warning-light) !important; color: var(--rd-warning-dark) !important; }
.badge.bg-danger { background: var(--rd-danger-light) !important; color: var(--rd-danger-dark) !important; }
.badge.bg-info { background: var(--rd-info-light) !important; color: #7C3AED !important; }
.badge.bg-secondary { background: var(--rd-primary-light) !important; color: var(--rd-primary) !important; }

/* --------------------------------------------------------------------------
   13. ALERTS
   -------------------------------------------------------------------------- */
.alert {
    border-radius: var(--rd-radius-md) !important;
    font-size: 0.8125rem !important;
    border: none !important;
    padding: 0.75rem 1rem !important;
}

.alert-success { background: var(--rd-success-light) !important; color: var(--rd-success-dark) !important; }
.alert-danger { background: var(--rd-danger-light) !important; color: var(--rd-danger-dark) !important; }
.alert-warning { background: var(--rd-warning-light) !important; color: var(--rd-warning-dark) !important; }
.alert-info { background: var(--rd-info-light) !important; color: #7C3AED !important; }

/* --------------------------------------------------------------------------
   14. DATATABLES OVERRIDE
   -------------------------------------------------------------------------- */
.dt-container { font-size: 0.8125rem !important; }

.dt-buttons .btn, .dt-buttons .dt-button {
    font-size: 0.75rem !important;
    border-radius: var(--rd-radius-sm) !important;
    padding: 0.375rem 0.75rem !important;
    font-weight: 500 !important;
    border: 1px solid var(--rd-slate-200) !important;
    background: #fff !important;
    color: var(--rd-slate-600) !important;
}

.dt-buttons .btn:hover, .dt-buttons .dt-button:hover {
    background: var(--rd-slate-50) !important;
    border-color: var(--rd-slate-300) !important;
}

.dataTables_filter input, .dt-search input {
    border-radius: var(--rd-radius-md) !important;
    border: 1px solid var(--rd-slate-200) !important;
    padding: 0.4375rem 0.75rem !important;
    font-size: 0.8125rem !important;
}

.dataTables_filter input:focus, .dt-search input:focus {
    border-color: var(--rd-primary) !important;
    box-shadow: var(--rd-shadow-focus) !important;
    outline: none !important;
}

/* Pagination */
.dataTables_paginate .paginate_button,
.dt-paging .dt-paging-button {
    border-radius: var(--rd-radius-sm) !important;
    font-size: 0.8125rem !important;
    padding: 0.25rem 0.625rem !important;
    border: 1px solid transparent !important;
    color: #94A3B8 !important;
    transition: all var(--rd-transition-fast) !important;
}

.dataTables_paginate .paginate_button.current,
.dt-paging .dt-paging-button.current {
    background: var(--rd-primary) !important;
    color: #fff !important;
    border-color: var(--rd-primary) !important;
}

.dataTables_paginate .paginate_button:hover,
.dt-paging .dt-paging-button:hover {
    background: rgba(79, 70, 229, 0.06) !important;
    border-color: rgba(99, 102, 241, 0.12) !important;
    color: var(--rd-slate-800) !important;
}

/* --------------------------------------------------------------------------
   15. SELECT2 OVERRIDE
   -------------------------------------------------------------------------- */
.select2-container .select2-selection--single {
    border-radius: var(--rd-radius-md) !important;
    border-color: rgba(99, 102, 241, 0.12) !important;
    height: 38px !important;
    transition: border-color var(--rd-transition-fast) !important;
    background: rgba(255, 255, 255, 0.7) !important;
}

.select2-container .select2-selection--multiple {
    border-radius: var(--rd-radius-md) !important;
    border-color: rgba(99, 102, 241, 0.12) !important;
    min-height: 38px !important;
    background: rgba(255, 255, 255, 0.7) !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--rd-slate-800) !important;
}

.select2-container.select2-container--open .select2-selection--single,
.select2-container.select2-container--open .select2-selection--multiple {
    border-color: var(--rd-primary) !important;
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.12) !important;
}

.select2-dropdown {
    border-radius: var(--rd-radius-md) !important;
    border-color: rgba(99, 102, 241, 0.08) !important;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.08) !important;
    overflow: hidden !important;
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(16px) !important;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable,
.select2-container--default .select2-results__option[aria-selected="true"] {
    background-color: var(--rd-primary) !important;
    color: #fff !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 36px !important;
    font-size: 0.8125rem !important;
    color: var(--rd-slate-700) !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    line-height: 36px !important;
}

/* --------------------------------------------------------------------------
   16. SWEETALERT2 OVERRIDE
   -------------------------------------------------------------------------- */
div:where(.swal2-container) h2:where(.swal2-title) {
    font-size: 1.125rem !important;
    font-weight: 600 !important;
    color: var(--rd-slate-800) !important;
}

div:where(.swal2-container) .swal2-html-container {
    font-size: 0.875rem !important;
    color: var(--rd-slate-500) !important;
}

div:where(.swal2-container) .swal2-popup {
    border-radius: var(--rd-radius-xl) !important;
    padding: 2rem !important;
}

div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm {
    background: var(--rd-primary) !important;
    border-radius: var(--rd-radius-md) !important;
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    padding: 0.5rem 1.25rem !important;
}

div:where(.swal2-container) button:where(.swal2-styled).swal2-cancel {
    border-radius: var(--rd-radius-md) !important;
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    padding: 0.5rem 1.25rem !important;
}

/* --------------------------------------------------------------------------
   17. EMPTY STATES
   -------------------------------------------------------------------------- */
.sa-empty-state, .rd-empty-state {
    text-align: center;
    padding: 3rem 1.5rem;
}

.sa-empty-state-icon, .rd-empty-state-icon {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: var(--rd-slate-100);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
}

.sa-empty-state-icon i, .rd-empty-state-icon i {
    font-size: 1.5rem;
    color: var(--rd-slate-400);
}

.sa-empty-state h5, .rd-empty-state h5 {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--rd-slate-600);
    margin-bottom: 0.25rem;
}

.sa-empty-state p, .rd-empty-state p {
    font-size: 0.8125rem;
    color: var(--rd-slate-400);
    margin: 0;
    max-width: 300px;
    margin-inline: auto;
}

/* --------------------------------------------------------------------------
   18. SKELETON LOADERS
   -------------------------------------------------------------------------- */
.sa-skeleton { padding: 1.5rem; }

.sa-skeleton-header {
    height: 36px;
    background: linear-gradient(90deg, var(--rd-slate-100) 25%, var(--rd-slate-50) 50%, var(--rd-slate-100) 75%);
    background-size: 200% 100%;
    animation: rd-shimmer 1.5s ease-in-out infinite;
    border-radius: var(--rd-radius-sm);
    margin-bottom: 1.25rem;
}

.sa-skeleton-row { display: flex; gap: 0.75rem; margin-bottom: 0.75rem; }

.sa-skeleton-cell {
    height: 12px;
    background: linear-gradient(90deg, var(--rd-slate-100) 25%, var(--rd-slate-200) 50%, var(--rd-slate-100) 75%);
    background-size: 200% 100%;
    animation: rd-shimmer 1.5s ease-in-out infinite;
    border-radius: var(--rd-radius-sm);
    flex: 1;
}

.sa-skeleton-cell.sa-sk-sm { max-width: 60px; }
.sa-skeleton-cell.sa-sk-md { max-width: 120px; }
.sa-skeleton-cell.sa-sk-lg { max-width: 200px; }
.sa-skeleton-cell.sa-sk-xl { max-width: 300px; }

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

/* --------------------------------------------------------------------------
   19. ACCORDION (Settings)
   -------------------------------------------------------------------------- */
.accordion-button:not(.collapsed) {
    background: var(--rd-primary-light) !important;
    color: var(--rd-primary) !important;
    box-shadow: none !important;
}

.accordion-button:focus {
    box-shadow: var(--rd-shadow-focus) !important;
    border-color: var(--rd-primary) !important;
}

.accordion-item {
    border-color: var(--rd-slate-200) !important;
    border-radius: var(--rd-radius-md) !important;
    overflow: hidden !important;
}

/* --------------------------------------------------------------------------
   20. TOAST NOTIFICATIONS
   -------------------------------------------------------------------------- */
.notifier-container { z-index: 9999 !important; }

/* --------------------------------------------------------------------------
   21. ACCOUNT/SETTINGS TABS
   -------------------------------------------------------------------------- */
.account-tabs .nav-item .nav-link {
    position: relative;
    padding: 0.625rem 1rem !important;
    font-weight: 500 !important;
    font-size: 0.8125rem !important;
    color: var(--rd-slate-600) !important;
    border-radius: var(--rd-radius-md) !important;
    transition: all var(--rd-transition-fast) !important;
}

.account-tabs .nav-item .nav-link.active {
    color: var(--rd-primary) !important;
    background: var(--rd-primary-light) !important;
    font-weight: 600 !important;
}

/* --------------------------------------------------------------------------
   22. OFFCANVAS / THEME PANEL (hidden since removed)
   -------------------------------------------------------------------------- */
.pct-offcanvas { display: none !important; }

/* --------------------------------------------------------------------------
   23. UTILITIES & MICRO-INTERACTIONS
   -------------------------------------------------------------------------- */
.text-secondary { color: var(--rd-primary) !important; }
.text-muted { color: var(--rd-slate-500) !important; }
.bg-secondary { background-color: var(--rd-primary) !important; }
.bg-light-secondary { background: var(--rd-primary-light) !important; color: var(--rd-primary) !important; }
.bg-light-primary { background: var(--rd-primary-light) !important; color: var(--rd-primary) !important; }
.bg-light-warning { background: var(--rd-warning-light) !important; color: var(--rd-warning) !important; }
.bg-light-danger { background: var(--rd-danger-light) !important; color: var(--rd-danger) !important; }
.bg-light-success { background: var(--rd-success-light) !important; color: var(--rd-success) !important; }
.bg-light-info { background: var(--rd-info-light) !important; color: var(--rd-info) !important; }

/* Smooth link transitions */
a { transition: color var(--rd-transition-fast), background-color var(--rd-transition-fast); }

/* Focus visible for accessibility */
:focus-visible {
    outline: 2px solid var(--rd-primary);
    outline-offset: 2px;
}

/* Avtar (PcCoded icon container) */
.avtar {
    border-radius: var(--rd-radius-md) !important;
    transition: all var(--rd-transition-fast) !important;
}

/* FullCalendar overrides */
.fc .fc-button-primary {
    background: var(--rd-primary) !important;
    border-color: var(--rd-primary) !important;
    font-size: 0.8125rem !important;
    border-radius: var(--rd-radius-sm) !important;
}

.fc .fc-button-primary:hover {
    background: var(--rd-primary-hover) !important;
}

.fc .fc-button-primary:not(.fc-button-active) {
    background: #fff !important;
    color: var(--rd-slate-600) !important;
    border-color: var(--rd-slate-200) !important;
}

.fc .fc-daygrid-day-number {
    font-size: 0.8125rem !important;
    color: var(--rd-slate-600) !important;
}

.fc .fc-col-header-cell-cushion {
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    color: var(--rd-slate-500) !important;
    text-transform: uppercase !important;
}

/* --------------------------------------------------------------------------
   24. RESPONSIVE
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
    .pc-sidebar { width: var(--rd-sidebar-width) !important; }
}

@media (max-width: 767px) {
    .card .card-header { padding: 1rem !important; }
    .card .card-body { padding: 1rem !important; }
    .page-header .page-header-title h5 { font-size: 1.25rem !important; }
    .rd-stat-card .rd-stat-value { font-size: 1.5rem; }
}

/* --------------------------------------------------------------------------
   25. FLOATING SKY THEME — Light & Airy
   -------------------------------------------------------------------------- */

/* Content z-index */
.pc-container .pc-content { position: relative; z-index: 1; }

/* Sidebar glass border */
body.rd-admin .pc-sidebar {
    border-right: 1px solid rgba(99, 102, 241, 0.08) !important;
    box-shadow: 4px 0 30px rgba(0, 0, 0, 0.06) !important;
}

/* DataTables info/length text */
.dataTables_info, .dt-info,
.dataTables_length label, .dt-length label,
.dataTables_filter label, .dt-search label {
    color: var(--rd-slate-500) !important;
}

.dataTables_length select, .dt-length select {
    background: rgba(255, 255, 255, 0.7) !important;
    border-color: rgba(99, 102, 241, 0.12) !important;
    color: var(--rd-slate-700) !important;
}

.dataTables_filter input, .dt-search input {
    background: rgba(255, 255, 255, 0.7) !important;
    border-color: rgba(99, 102, 241, 0.12) !important;
    color: var(--rd-slate-700) !important;
}

.dataTables_filter input:focus, .dt-search input:focus {
    background: rgba(255, 255, 255, 0.9) !important;
}

.dataTables_empty { color: var(--rd-slate-400) !important; }

/* Loader bar — indigo */
.loader-fill { background: linear-gradient(135deg, #4F46E5, #6366F1) !important; }

/* Page loading overlay */
.loader-bg {
    background: rgba(255, 255, 255, 0.85) !important;
    backdrop-filter: blur(8px) !important;
}

/* Scrollbar */
body.rd-admin::-webkit-scrollbar-track { background: rgba(99, 102, 241, 0.04); }
body.rd-admin::-webkit-scrollbar-thumb { background: rgba(99, 102, 241, 0.2); border-radius: 3px; }
body.rd-admin::-webkit-scrollbar-thumb:hover { background: rgba(99, 102, 241, 0.35); }

/* WhatsApp floating button animation */
@keyframes rd-wa-pulse {
    0%, 100% { box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4); }
    50% { box-shadow: 0 4px 28px rgba(37, 211, 102, 0.6), 0 0 0 8px rgba(37, 211, 102, 0.1); }
}

/* SweetAlert2 glass override */
body.rd-admin .swal2-popup {
    background: rgba(255, 255, 255, 0.9) !important;
    backdrop-filter: blur(16px) !important;
    border: 1px solid rgba(99, 102, 241, 0.08) !important;
}

/* Tabs */
body.rd-admin .nav-tabs .nav-link {
    color: var(--rd-slate-500) !important;
    border-color: transparent !important;
}
body.rd-admin .nav-tabs .nav-link.active {
    color: var(--rd-primary) !important;
    background: rgba(255, 255, 255, 0.5) !important;
    border-bottom-color: var(--rd-primary) !important;
}
body.rd-admin .tab-content {
    background: transparent !important;
}

/* FullCalendar */
body.rd-admin .fc .fc-button-primary:not(.fc-button-active) {
    background: rgba(255, 255, 255, 0.7) !important;
    color: var(--rd-slate-600) !important;
    border-color: rgba(99, 102, 241, 0.12) !important;
}
body.rd-admin .fc td, body.rd-admin .fc th {
    border-color: rgba(99, 102, 241, 0.06) !important;
}

/* Pagination text */
.dataTables_paginate .paginate_button,
.dt-paging .dt-paging-button {
    color: var(--rd-slate-500) !important;
}

/* ==========================================================================
   MOBILE RESPONSIVE — Sidebar Scroll Fix + Layout Optimization
   ========================================================================== */

/* ── Sidebar: Make menu scrollable on ALL screens ── */
.pc-sidebar .navbar-content {
    height: calc(100vh - 70px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 2rem !important;
}

/* Custom scrollbar for sidebar */
.pc-sidebar .navbar-content::-webkit-scrollbar {
    width: 4px;
}
.pc-sidebar .navbar-content::-webkit-scrollbar-track {
    background: transparent;
}
.pc-sidebar .navbar-content::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.15);
    border-radius: 4px;
}
.pc-sidebar .navbar-content::-webkit-scrollbar-thumb:hover {
    background: rgba(255,255,255,0.25);
}

/* ── Tablet (≤ 1024px) ── */
@media (max-width: 1024px) {
    .pc-sidebar {
        position: fixed !important;
        z-index: 1050 !important;
        height: 100vh !important;
        height: 100dvh !important;
    }
    .pc-sidebar .navbar-content {
        height: calc(100vh - 70px) !important;
        height: calc(100dvh - 70px) !important;
    }

    /* Hero section */
    .rd-hero {
        padding: 1.5rem !important;
        border-radius: 1rem !important;
        margin-bottom: 1.25rem !important;
    }
    .rd-hero h2 {
        font-size: 1.25rem !important;
    }
}

/* ── Mobile (≤ 768px) ── */
@media (max-width: 768px) {
    /* Sidebar full height + scrollable */
    .pc-sidebar {
        height: 100vh !important;
        height: 100dvh !important;
        max-height: 100vh !important;
        max-height: 100dvh !important;
    }
    .pc-sidebar .navbar-content {
        height: calc(100vh - 65px) !important;
        height: calc(100dvh - 65px) !important;
        max-height: calc(100vh - 65px) !important;
        max-height: calc(100dvh - 65px) !important;
        overflow-y: auto !important;
        padding-bottom: 6rem !important;
    }

    /* Header compact */
    .pc-header {
        padding: 0 0.75rem !important;
    }
    .pc-header .header-user-profile .me-3 {
        display: none !important;
    }

    /* Main content spacing */
    .pc-container {
        padding: 0.75rem !important;
    }
    .pc-content {
        padding: 0 !important;
    }

    /* Hero responsive */
    .rd-hero {
        padding: 1.25rem 1rem !important;
        border-radius: 0.875rem !important;
        margin-bottom: 1rem !important;
    }
    .rd-hero h2 {
        font-size: 1.125rem !important;
    }
    .rd-hero p {
        font-size: 0.8125rem !important;
    }
    .rd-hero-date {
        font-size: 0.6875rem !important;
    }
    .rd-hero::before {
        width: 200px !important;
        height: 200px !important;
    }

    /* KPI cards */
    .rd-kpi .card-body {
        padding: 1rem !important;
    }
    .rd-kpi-value {
        font-size: 1.5rem !important;
    }
    .rd-kpi-icon {
        width: 42px !important;
        height: 42px !important;
        font-size: 1.125rem !important;
        border-radius: 12px !important;
    }
    .rd-kpi:hover {
        transform: none !important;
    }

    /* Chart cards */
    .rd-chart-card .card-header {
        padding: 1rem 1.25rem 0.75rem !important;
    }
    .rd-chart-card .card-body {
        padding: 0.5rem 1rem 1.25rem !important;
    }
    .rd-chart-card .card-header h5 {
        font-size: 0.9375rem !important;
    }
    .rd-chart-card:hover {
        transform: none !important;
    }
    .rd-chart-badge {
        font-size: 0.625rem !important;
        padding: 0.2rem 0.5rem !important;
    }
    .rd-chart-icon {
        width: 34px !important;
        height: 34px !important;
        font-size: 1rem !important;
        border-radius: 10px !important;
    }

    /* DataTables responsive */
    .card .card-body {
        padding: 0.875rem !important;
    }
    table.dataTable {
        font-size: 0.8125rem !important;
    }

    /* Forms */
    .modal-dialog {
        margin: 0.5rem !important;
    }

    /* Breadcrumb */
    .page-header {
        padding: 0.75rem 0 !important;
    }
    .page-header h2 {
        font-size: 1.125rem !important;
    }
}

/* ── Small Mobile (≤ 480px) ── */
@media (max-width: 480px) {
    /* Hero minimal */
    .rd-hero {
        padding: 1rem 0.875rem !important;
    }
    .rd-hero h2 {
        font-size: 1rem !important;
    }
    .rd-hero p {
        font-size: 0.75rem !important;
        display: none;
    }

    /* KPI cards full width */
    .rd-kpi .card-body {
        padding: 0.875rem !important;
    }
    .rd-kpi-value {
        font-size: 1.25rem !important;
    }
    .rd-kpi-label {
        font-size: 0.625rem !important;
    }
    .rd-kpi-icon {
        width: 36px !important;
        height: 36px !important;
        font-size: 1rem !important;
    }

    /* Chart cards */
    .rd-chart-card .card-header .d-flex.align-items-center.gap-3 {
        gap: 0.5rem !important;
    }
    .rd-chart-badge {
        display: none !important;
    }

    /* Compact header */
    .pc-header .pc-head-link {
        padding: 0.375rem !important;
    }
}