/**
 * NIXI IRINN — Admin Design System
 * Enterprise SaaS visual language for the entire admin portal.
 * Load last in admin layout to override legacy styles (!important where needed).
 * Typography: Varela Round (project primary — see custom.css @font-face).
 */

/* ── Design tokens ─────────────────────────────────────────── */
.admin-panel,
body.auth-portal.admin-auth {
    --primary: #5b4cff !important;
    --primary-hover: #4a3df0 !important;
    --primary-soft: rgba(91, 76, 255, 0.1) !important;
    --primary-focus: rgba(91, 76, 255, 0.18) !important;
    --success: #22c55e !important;
    --success-soft: rgba(34, 197, 94, 0.12) !important;
    --warning: #f59e0b !important;
    --warning-soft: rgba(245, 158, 11, 0.14) !important;
    --danger: #ef4444 !important;
    --danger-soft: rgba(239, 68, 68, 0.12) !important;
    --info: #3b82f6 !important;
    --info-soft: rgba(59, 130, 246, 0.12) !important;
    --background: #f8fafc !important;
    --surface: #ffffff !important;
    --text-primary: #111827 !important;
    --text-secondary: #6b7280 !important;
    --border-color: #e5e7eb !important;
    --border-strong: #d1d5db !important;
    --radius: 16px !important;
    --radius-sm: 10px !important;
    --radius-xs: 8px !important;
    --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
    --shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 4px 16px rgba(15, 23, 42, 0.06) !important;
    --shadow-lg: 0 8px 24px rgba(15, 23, 42, 0.08) !important;
    --space-1: 4px !important;
    --space-2: 8px !important;
    --space-3: 12px !important;
    --space-4: 16px !important;
    --space-5: 24px !important;
    --space-6: 32px !important;
    --font-family: var(--font-family-primary, 'Varela Round', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif) !important;
    --font-page-title: 1.75rem !important;
    --font-section-title: 1.25rem !important;
    --font-card-title: 1rem !important;
    --font-body: 0.875rem !important;
    --font-label: 0.8125rem !important;
    --font-small: 0.75rem !important;
    --control-height: 42px !important;
    --transition: 0.22s ease !important;
}

/* Bridge module-level tokens */
.admin-panel {
    --shell-primary: var(--primary) !important;
    --shell-border: var(--border-color) !important;
    --shell-text: var(--text-primary) !important;
    --shell-muted: var(--text-secondary) !important;
    --shell-radius: var(--radius) !important;
    --shell-shadow: var(--shadow) !important;
    --as-accent: var(--primary) !important;
    --as-accent-hover: var(--primary-hover) !important;
    --as-accent-focus: var(--primary-focus) !important;
    --as-surface: var(--surface) !important;
    --as-border: var(--border-color) !important;
    --as-text: var(--text-primary) !important;
    --as-muted: var(--text-secondary) !important;
    --as-radius: var(--radius) !important;
    --admin-main-bg: var(--background) !important;
    --admin-sidebar-accent: var(--primary) !important;
    --admin-sidebar-active-border: var(--primary) !important;
    --admin-sidebar-hover-bg: var(--primary-soft) !important;
    --admin-sidebar-active-bg: var(--primary-soft) !important;
    --app-primary: var(--primary) !important;
    --pur-primary: var(--primary) !important;
    --gst-primary: var(--primary) !important;
    --reg-primary: var(--primary) !important;
    --mrr-primary: var(--primary) !important;
    --wsc-primary: var(--primary) !important;
    --wp-primary: var(--primary) !important;
    --bw-primary: var(--primary) !important;
    --dash-primary: var(--primary) !important;
    --theme-primary: var(--primary) !important;
    --theme-blue: var(--primary) !important;
}

/* ── Base typography ───────────────────────────────────────── */
.admin-panel,
.admin-panel *:not(pre):not(code):not(kbd):not(samp):not(.font-monospace),
.admin-panel .admin-content,
body.auth-portal.admin-auth,
body.auth-portal.admin-auth *:not(pre):not(code):not(kbd):not(samp):not(.font-monospace) {
    font-family: var(--font-family) !important;
}

.admin-panel .admin-main {
    background: var(--background) !important;
}

.admin-panel,
.admin-panel .admin-content,
body.auth-portal.admin-auth {
    font-size: var(--font-body) !important;
    color: var(--text-primary) !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

.admin-panel .admin-content {
    padding: var(--space-5) !important;
}

/* ── Page titles ───────────────────────────────────────────── */
.admin-panel .app-page-title,
.admin-panel .pur-page-title,
.admin-panel .gst-page-title,
.admin-panel .wsc-page-title,
.admin-panel .mrr-page-title,
.admin-panel .reg-page-title,
.admin-panel .dash-header-title,
.admin-panel h1.app-page-title {
    color: var(--text-primary) !important;
    font-size: var(--font-page-title) !important;
    font-weight: 700 !important;
    letter-spacing: -0.025em !important;
    line-height: 1.2 !important;
    margin: 0 0 var(--space-1) !important;
}

.admin-panel .app-page-subtitle,
.admin-panel .pur-page-subtitle,
.admin-panel .gst-page-subtitle,
.admin-panel .wsc-page-subtitle,
.admin-panel .mrr-page-subtitle,
.admin-panel .reg-page-subtitle,
.admin-panel .dash-header-meta {
    color: var(--text-secondary) !important;
    font-size: var(--font-body) !important;
    font-weight: 400 !important;
    margin: 0 !important;
}

.admin-panel .app-filter-card__title,
.admin-panel .app-show-card__title,
.admin-panel .card-title,
.admin-panel h2.h5,
.admin-panel h3.h6.fw-semibold {
    color: var(--text-primary) !important;
    font-size: var(--font-card-title) !important;
    font-weight: 600 !important;
}

/* ── Topbar ────────────────────────────────────────────────── */
.admin-panel .admin-topbar {
    background: var(--surface) !important;
    border-bottom: 1px solid var(--border-color) !important;
    min-height: 52px !important;
    height: 52px !important;
    padding: 0 var(--space-4) !important;
    box-shadow: var(--shadow-sm) !important;
    backdrop-filter: blur(8px) !important;
}

.admin-panel .admin-topbar-search .form-control {
    border-radius: var(--radius-sm) !important;
    min-height: 38px !important;
    font-size: var(--font-body) !important;
    border-color: var(--border-color) !important;
    background: var(--background) !important;
}

.admin-panel .sidebar-toggle,
.admin-panel .sidebar-desktop-toggle {
    border-radius: var(--radius-xs) !important;
    color: var(--text-secondary) !important;
    transition: background var(--transition), color var(--transition) !important;
}

.admin-panel .sidebar-toggle:hover,
.admin-panel .sidebar-desktop-toggle:hover {
    background: var(--primary-soft) !important;
    color: var(--primary) !important;
}

/* ── Sidebar ───────────────────────────────────────────────── */
.admin-panel.admin-sidebar-layout {
    --admin-sidebar-bg: var(--surface) !important;
    --admin-sidebar-border: var(--border-color) !important;
    --admin-sidebar-text: var(--text-primary) !important;
    --admin-sidebar-text-muted: var(--text-secondary) !important;
}

.admin-panel .admin-sidebar {
    background: var(--surface) !important;
    border-right: 1px solid var(--border-color) !important;
    box-shadow: var(--shadow-sm) !important;
}

.admin-panel .sidebar-header {
    border-bottom: 1px solid var(--border-color) !important;
    padding: var(--space-4) !important;
}

.admin-panel .sidebar-nav-link {
    border-radius: var(--radius-sm) !important;
    color: var(--text-secondary) !important;
    font-size: var(--font-body) !important;
    font-weight: 500 !important;
    padding: 0.55rem 0.75rem !important;
    transition: background var(--transition), color var(--transition) !important;
}

.admin-panel .sidebar-nav-link:hover {
    background: var(--primary-soft) !important;
    color: var(--primary) !important;
}

.admin-panel .sidebar-nav-link.active {
    background: var(--primary-soft) !important;
    color: var(--primary) !important;
    font-weight: 600 !important;
    border-left: 3px solid var(--primary) !important;
    padding-left: calc(0.75rem - 3px) !important;
}

.admin-panel .sidebar-section-label {
    color: var(--text-secondary) !important;
    font-size: var(--font-small) !important;
    font-weight: 600 !important;
    letter-spacing: 0.06em !important;
}

.admin-panel .role-selector-btn {
    border-radius: var(--radius-sm) !important;
    border-color: var(--border-color) !important;
    font-size: var(--font-label) !important;
}

.admin-panel .role-selector-icon {
    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-hover) 100%) !important;
    box-shadow: 0 2px 8px rgba(91, 76, 255, 0.22) !important;
}

.admin-panel .admin-sidebar-comm-panel {
    border-color: var(--border-color) !important;
    border-radius: var(--radius) !important;
    box-shadow: var(--shadow-sm) !important;
}

.admin-panel .admin-sidebar-comm-heading {
    color: var(--text-secondary) !important;
}

.admin-panel .sidebar-nav-comm-link.active {
    border-left-color: var(--primary) !important;
    background: var(--primary-soft) !important;
    color: var(--primary) !important;
}

/* ── Cards ─────────────────────────────────────────────────── */
.admin-panel .card,
.admin-panel .app-table-card,
.admin-panel .app-filter-card,
.admin-panel .app-show-card,
.admin-panel .bw-stat-card,
.admin-panel .pur-table-card,
.admin-panel .gst-table-card,
.admin-panel .wsc-table-card,
.admin-panel .mrr-grid-card,
.admin-panel .reg-grid-card {
    background: var(--surface) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: var(--radius) !important;
    box-shadow: var(--shadow) !important;
    transition: box-shadow var(--transition) !important;
}

.admin-panel .card:hover:not(.invoice-config-card-outer) {
    box-shadow: var(--shadow-lg) !important;
}

.admin-panel .card-header:not([class*='bg-']):not([class*='text-bg-']) {
    background: var(--surface) !important;
    border-bottom: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
    font-size: var(--font-card-title) !important;
    font-weight: 600 !important;
    padding: var(--space-4) !important;
}

.admin-panel .card-body {
    padding: var(--space-4) !important;
}

.admin-panel .card-footer {
    background: #fafbfc !important;
    border-top: 1px solid var(--border-color) !important;
    padding: var(--space-3) var(--space-4) !important;
}

/* ── Tables ────────────────────────────────────────────────── */
.admin-panel .table,
.admin-panel .app-table,
.admin-panel .pur-table,
.admin-panel .gst-table,
.admin-panel .wsc-table,
.admin-panel .mrr-table,
.admin-panel .reg-table {
    --bs-table-border-color: var(--border-color) !important;
    font-size: var(--font-body) !important;
    margin-bottom: 0 !important;
}

.admin-panel .table thead th,
.admin-panel .app-table thead th {
    background: #f9fafb !important;
    border-bottom: 1px solid var(--border-color) !important;
    color: var(--text-secondary) !important;
    font-size: var(--font-small) !important;
    font-weight: 600 !important;
    letter-spacing: 0.04em !important;
    padding: 0.75rem 1rem !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

.admin-panel .app-table-scroll .app-table thead th,
.admin-panel .app-table-wrap .app-table thead th {
    position: sticky !important;
    top: 0 !important;
    z-index: 2 !important;
}

.admin-panel .table tbody td,
.admin-panel .app-table tbody td {
    border-bottom: 1px solid #f3f4f6 !important;
    color: var(--text-primary) !important;
    padding: 0.8rem 1rem !important;
    vertical-align: middle !important;
}

.admin-panel .table tbody tr:nth-child(even),
.admin-panel .app-table tbody tr:nth-child(even) {
    background: #fafbfc !important;
}

.admin-panel .table-hover > tbody > tr:hover > *,
.admin-panel .app-table tbody tr:hover {
    background: #f3f4f6 !important;
}

.admin-panel .app-table-topbar,
.admin-panel .app-table-footer {
    border-color: var(--border-color) !important;
    padding: var(--space-3) var(--space-4) !important;
}

.admin-panel .app-table-summary {
    color: var(--text-secondary) !important;
    font-size: var(--font-small) !important;
}

/* ── Buttons ───────────────────────────────────────────────── */
.admin-panel .btn {
    border-radius: var(--radius-sm) !important;
    font-size: var(--font-body) !important;
    font-weight: 600 !important;
    min-height: var(--control-height) !important;
    padding: 0 var(--space-4) !important;
    transition: background var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition) !important;
}

.admin-panel .btn-sm {
    min-height: 34px !important;
    font-size: var(--font-label) !important;
    padding: 0 var(--space-3) !important;
}

.admin-panel .btn-primary,
.admin-panel .app-btn--primary,
.admin-panel .pur-btn--primary,
.admin-panel .gst-btn--primary,
.admin-panel .wsc-btn--primary {
    background: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #fff !important;
}

.admin-panel .btn-primary:hover,
.admin-panel .btn-primary:focus,
.admin-panel .app-btn--primary:hover {
    background: var(--primary-hover) !important;
    border-color: var(--primary-hover) !important;
    color: #fff !important;
}

.admin-panel .btn-outline-primary,
.admin-panel .btn-outline-secondary,
.admin-panel .app-btn {
    background: var(--surface) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
}

.admin-panel .btn-outline-primary {
    border-color: var(--primary) !important;
    color: var(--primary) !important;
}

.admin-panel .btn-outline-primary:hover {
    background: var(--primary-soft) !important;
    color: var(--primary-hover) !important;
}

.admin-panel .btn-success,
.admin-panel .app-btn--export {
    background: var(--success-soft) !important;
    border-color: #bbf7d0 !important;
    color: #15803d !important;
}

.admin-panel .btn-danger {
    background: var(--danger) !important;
    border-color: var(--danger) !important;
    color: #fff !important;
}

.admin-panel .app-btn,
.admin-panel .pur-btn,
.admin-panel .gst-btn,
.admin-panel .wsc-btn {
    align-items: center !important;
    border-radius: var(--radius-sm) !important;
    display: inline-flex !important;
    font-size: var(--font-label) !important;
    font-weight: 600 !important;
    gap: var(--space-2) !important;
    height: var(--control-height) !important;
    padding: 0 0.9rem !important;
    text-decoration: none !important;
}

/* ── Forms ───────────────────────────────────────────────────── */
.admin-panel .form-control,
.admin-panel .form-select,
.admin-panel textarea.form-control {
    background: var(--surface) !important;
    border: 1px solid var(--border-strong) !important;
    border-radius: var(--radius-sm) !important;
    color: var(--text-primary) !important;
    font-size: var(--font-body) !important;
    min-height: var(--control-height) !important;
    transition: border-color var(--transition), box-shadow var(--transition) !important;
}

.admin-panel .form-control-sm,
.admin-panel .form-select-sm {
    min-height: 34px !important;
    font-size: var(--font-label) !important;
}

.admin-panel .form-control:focus,
.admin-panel .form-select:focus,
.admin-panel textarea.form-control:focus {
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 3px var(--primary-focus) !important;
    outline: none !important;
}

.admin-panel .form-label,
.admin-panel label.form-label,
.admin-panel .crm-label {
    color: var(--text-primary) !important;
    font-size: var(--font-label) !important;
    font-weight: 500 !important;
    margin-bottom: var(--space-2) !important;
}

.admin-panel .input-group-text {
    background: #f9fafb !important;
    border-color: var(--border-strong) !important;
    color: var(--text-secondary) !important;
    font-size: var(--font-label) !important;
}

/* ── Status badges ───────────────────────────────────────────── */
.admin-panel .badge,
.admin-panel .app-badge,
.admin-panel .app-pill,
.admin-panel .bw-badge {
    border-radius: 999px !important;
    font-size: var(--font-small) !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    padding: 0.2rem 0.55rem !important;
}

.admin-panel .app-badge--success,
.admin-panel .badge.bg-success,
.admin-panel .badge.text-bg-success,
.admin-panel .bw-badge--success {
    background: var(--success-soft) !important;
    color: #16a34a !important;
}

.admin-panel .app-badge--warning,
.admin-panel .badge.bg-warning,
.admin-panel .badge.text-bg-warning,
.admin-panel .bw-badge--warning {
    background: var(--warning-soft) !important;
    color: #d97706 !important;
}

.admin-panel .app-badge--danger,
.admin-panel .badge.bg-danger,
.admin-panel .badge.text-bg-danger,
.admin-panel .bw-badge--danger {
    background: var(--danger-soft) !important;
    color: #dc2626 !important;
}

.admin-panel .app-badge--muted,
.admin-panel .bw-badge--muted,
.admin-panel .badge.bg-secondary,
.admin-panel .badge.text-bg-secondary {
    background: rgba(107, 114, 128, 0.12) !important;
    color: var(--text-secondary) !important;
}

.admin-panel .app-badge--info,
.admin-panel .badge.bg-info,
.admin-panel .badge.text-bg-info,
.admin-panel .bw-badge--info {
    background: var(--info-soft) !important;
    color: #2563eb !important;
}

.admin-panel .app-badge--primary,
.admin-panel .bw-badge--primary {
    background: var(--primary-soft) !important;
    color: var(--primary) !important;
}

/* ── Modals ────────────────────────────────────────────────── */
.admin-panel .modal-content {
    background: var(--surface) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: var(--radius) !important;
    box-shadow: var(--shadow-lg) !important;
}

.admin-panel .modal-header,
.admin-panel .modal-header.reg-modal-header,
.admin-panel .modal .modal-header {
    background: var(--surface) !important;
    border-bottom: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
    letter-spacing: normal !important;
    padding: var(--space-4) var(--space-5) !important;
    text-transform: none !important;
}

.admin-panel .modal-header .modal-title,
.admin-panel .modal-title {
    color: var(--text-primary) !important;
    font-size: var(--font-section-title) !important;
    font-weight: 600 !important;
}

.admin-panel .modal-body {
    color: var(--text-primary) !important;
    font-size: var(--font-body) !important;
    padding: var(--space-5) !important;
}

.admin-panel .modal-footer {
    background: #fafbfc !important;
    border-top: 1px solid var(--border-color) !important;
    gap: var(--space-2) !important;
    padding: var(--space-3) var(--space-5) !important;
}

/* Modal actions — reg-btn / bootstrap (modals often render outside page wrappers) */
.admin-panel .modal .reg-btn,
.admin-panel .modal-footer .reg-btn,
.admin-panel .modal-footer .btn-secondary,
.admin-panel .modal-footer .btn-outline-secondary {
    background: var(--surface) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: var(--radius-sm) !important;
    color: var(--text-primary) !important;
    display: inline-flex !important;
    font-size: var(--font-body) !important;
    font-weight: 600 !important;
    min-height: var(--control-height) !important;
    padding: 0 var(--space-4) !important;
}

.admin-panel .modal .reg-btn:hover,
.admin-panel .modal-footer .reg-btn:hover,
.admin-panel .modal-footer .btn-secondary:hover,
.admin-panel .modal-footer .btn-outline-secondary:hover {
    background: var(--primary-soft) !important;
    border-color: rgba(91, 76, 255, 0.35) !important;
    color: var(--primary) !important;
}

.admin-panel .modal .reg-btn--primary,
.admin-panel .modal-footer .reg-btn--primary,
.admin-panel .modal-footer .btn-primary {
    background: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #fff !important;
}

.admin-panel .modal .reg-btn--primary:hover,
.admin-panel .modal-footer .reg-btn--primary:hover,
.admin-panel .modal-footer .btn-primary:hover {
    background: var(--primary-hover) !important;
    border-color: var(--primary-hover) !important;
    color: #fff !important;
}

.admin-panel .btn-close {
    opacity: 0.55 !important;
    transition: opacity var(--transition) !important;
}

.admin-panel .btn-close:hover {
    opacity: 1 !important;
}

/* ── Content navigation (fix global custom.css white .nav-link on light backgrounds) ── */
.admin-panel .admin-content .nav-link,
.admin-panel .admin-content .nav-tabs .nav-link,
.admin-panel .admin-content .app-tabs .nav-link,
.admin-panel .admin-content .reg-tabs .nav-link,
.admin-panel .admin-content .theme-nav-pills .nav-link,
.admin-panel .admin-content .comprehensive-tabs-nav .nav-link,
.admin-panel .modal .nav-link {
    background: transparent !important;
    color: var(--text-secondary) !important;
    font-size: var(--font-body) !important;
    font-weight: 500 !important;
    letter-spacing: normal !important;
    margin: 0 !important;
    text-transform: none !important;
}

.admin-panel .admin-content .nav-link::after,
.admin-panel .admin-content .app-tabs .nav-link::after,
.admin-panel .admin-content .reg-tabs .nav-link::after,
.admin-panel .admin-content .theme-nav-pills .nav-link::after {
    display: none !important;
    content: none !important;
}

.admin-panel .admin-content .nav-link:hover,
.admin-panel .admin-content .nav-link:focus,
.admin-panel .admin-content .nav-tabs .nav-link:hover,
.admin-panel .admin-content .app-tabs .nav-link:hover,
.admin-panel .admin-content .reg-tabs .nav-link:hover {
    background: var(--primary-soft) !important;
    color: var(--primary) !important;
}

.admin-panel .admin-content .nav-link.active,
.admin-panel .admin-content .nav-tabs .nav-link.active,
.admin-panel .admin-content .app-tabs .nav-link.active,
.admin-panel .admin-content .reg-tabs .nav-link.active,
.admin-panel .admin-content .theme-nav-pills .nav-link.active {
    background: var(--primary-soft) !important;
    color: var(--primary) !important;
    font-weight: 600 !important;
}

/* Pill-style application / member tabs */
.admin-panel .admin-content .app-tabs .nav-link {
    background: var(--surface) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 999px !important;
    padding: 0.45rem 0.9rem !important;
}

.admin-panel .admin-content .app-tabs .nav-link:hover {
    border-color: rgba(91, 76, 255, 0.3) !important;
}

.admin-panel .admin-content .app-tabs .nav-link.active {
    background: var(--primary-soft) !important;
    border-color: rgba(91, 76, 255, 0.35) !important;
    box-shadow: inset 0 -2px 0 var(--primary) !important;
}

/* Underline-style registration tabs */
.admin-panel .admin-content .reg-tabs .nav-link {
    border-radius: 8px 8px 0 0 !important;
}

.admin-panel .admin-content .reg-tabs .nav-link.active {
    background: var(--surface) !important;
    border: 1px solid var(--border-color) !important;
    border-bottom-color: var(--surface) !important;
}

/* Bootstrap tab buttons inside modals / panels */
.admin-panel .admin-content .nav-tabs .nav-link,
.admin-panel .modal .nav-tabs .nav-link {
    border: 1px solid transparent !important;
    border-radius: var(--radius-xs) var(--radius-xs) 0 0 !important;
}

.admin-panel .admin-content .nav-tabs .nav-link.active,
.admin-panel .modal .nav-tabs .nav-link.active {
    background: var(--surface) !important;
    border-color: var(--border-color) !important;
    border-bottom-color: var(--surface) !important;
    color: var(--primary) !important;
}

/* ── Offcanvas / drawers ───────────────────────────────────── */
.admin-panel .offcanvas {
    background: var(--surface) !important;
    border-color: var(--border-color) !important;
}

.admin-panel .offcanvas-header {
    border-bottom: 1px solid var(--border-color) !important;
    padding: var(--space-4) !important;
}

.admin-panel .offcanvas-title {
    color: var(--text-primary) !important;
    font-size: var(--font-section-title) !important;
    font-weight: 600 !important;
}

.admin-panel .offcanvas-body {
    padding: var(--space-4) !important;
}

/* ── Dropdowns ───────────────────────────────────────────────── */
.admin-panel .dropdown-menu,
.admin-panel .sidebar-dropdown {
    background: var(--surface) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: var(--radius-sm) !important;
    box-shadow: var(--shadow-lg) !important;
    padding: var(--space-2) !important;
}

.admin-panel .dropdown-item {
    border-radius: var(--radius-xs) !important;
    color: var(--text-primary) !important;
    font-size: var(--font-body) !important;
    padding: 0.5rem 0.75rem !important;
    transition: background var(--transition) !important;
}

.admin-panel .dropdown-item:hover,
.admin-panel .dropdown-item:focus {
    background: var(--primary-soft) !important;
    color: var(--primary) !important;
}

/* ── Pagination ──────────────────────────────────────────────── */
.admin-panel .pagination {
    gap: var(--space-1) !important;
    margin: 0 !important;
}

.admin-panel .page-link {
    border-radius: var(--radius-xs) !important;
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
    font-size: var(--font-label) !important;
    font-weight: 500 !important;
    min-width: 36px !important;
    text-align: center !important;
    transition: background var(--transition), color var(--transition) !important;
}

.admin-panel .page-item.active .page-link {
    background: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #fff !important;
}

.admin-panel .page-link:hover {
    background: var(--primary-soft) !important;
    border-color: var(--border-color) !important;
    color: var(--primary) !important;
}

/* ── Alerts ──────────────────────────────────────────────────── */
.admin-panel .alert {
    border-radius: var(--radius-sm) !important;
    border-width: 1px !important;
    font-size: var(--font-body) !important;
    padding: var(--space-3) var(--space-4) !important;
}

.admin-panel .alert-success {
    background: var(--success-soft) !important;
    border-color: #bbf7d0 !important;
    color: #166534 !important;
}

.admin-panel .alert-danger {
    background: var(--danger-soft) !important;
    border-color: #fecaca !important;
    color: #991b1b !important;
}

.admin-panel .alert-warning {
    background: var(--warning-soft) !important;
    border-color: #fde68a !important;
    color: #92400e !important;
}

.admin-panel .alert-info {
    background: var(--info-soft) !important;
    border-color: #bfdbfe !important;
    color: #1e40af !important;
}

/* ── Breadcrumbs ─────────────────────────────────────────────── */
.admin-panel .breadcrumb {
    font-size: var(--font-label) !important;
    margin-bottom: var(--space-4) !important;
}

.admin-panel .breadcrumb-item a {
    color: var(--text-secondary) !important;
    text-decoration: none !important;
    transition: color var(--transition) !important;
}

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

.admin-panel .breadcrumb-item.active {
    color: var(--text-primary) !important;
    font-weight: 500 !important;
}

/* ── Empty states ────────────────────────────────────────────── */
.admin-panel .ds-empty-state {
    align-items: center !important;
    color: var(--text-secondary) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: var(--space-3) !important;
    justify-content: center !important;
    padding: var(--space-6) var(--space-4) !important;
    text-align: center !important;
}

.admin-panel .ds-empty-state__icon {
    align-items: center !important;
    background: var(--primary-soft) !important;
    border-radius: 50% !important;
    color: var(--primary) !important;
    display: flex !important;
    font-size: 1.5rem !important;
    height: 56px !important;
    justify-content: center !important;
    width: 56px !important;
}

.admin-panel .ds-empty-state__title {
    color: var(--text-primary) !important;
    font-size: var(--font-section-title) !important;
    font-weight: 600 !important;
    margin: 0 !important;
}

.admin-panel .ds-empty-state__text {
    color: var(--text-secondary) !important;
    font-size: var(--font-body) !important;
    margin: 0 !important;
    max-width: 28rem !important;
}

.admin-panel .app-empty {
    align-items: center !important;
    display: flex !important;
    flex-direction: column !important;
    gap: var(--space-3) !important;
    justify-content: center !important;
    padding: var(--space-6) var(--space-4) !important;
    text-align: center !important;
}

.admin-panel .app-empty-icon {
    align-items: center !important;
    background: var(--primary-soft) !important;
    border-radius: 50% !important;
    color: var(--primary) !important;
    display: flex !important;
    font-size: 1.5rem !important;
    height: 56px !important;
    justify-content: center !important;
    width: 56px !important;
}

.admin-panel .app-empty-title {
    color: var(--text-primary) !important;
    font-size: var(--font-section-title) !important;
    font-weight: 600 !important;
}

.admin-panel .table tbody td.text-center.app-cell-muted,
.admin-panel .app-table tbody td[colspan] {
    color: var(--text-secondary) !important;
    font-size: var(--font-body) !important;
    padding: var(--space-6) var(--space-4) !important;
}

/* ── Links & back navigation ─────────────────────────────────── */
.admin-panel .app-back-link,
.admin-panel .app-cell-link {
    color: var(--primary) !important;
    font-size: var(--font-label) !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: color var(--transition) !important;
}

.admin-panel .app-back-link:hover,
.admin-panel .app-cell-link:hover {
    color: var(--primary-hover) !important;
}

.admin-panel .app-cell-muted {
    color: var(--text-secondary) !important;
}

.admin-panel .app-cell-primary {
    color: var(--text-primary) !important;
    font-weight: 600 !important;
}

/* ── Page header layout ──────────────────────────────────────── */
.admin-panel .app-page-header,
.admin-panel .app-show-header {
    align-items: flex-start !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: var(--space-4) !important;
    justify-content: space-between !important;
    margin-bottom: var(--space-5) !important;
}

/* ── Stacked vertical action buttons (quick actions panels, sidebars) ── */
.admin-panel .reg-quick-actions,
.admin-panel .app-workflow-card.app-card,
.admin-panel .bw-panel__body.d-grid,
.admin-panel .ds-action-stack {
    gap: var(--space-2) !important;
}

.admin-panel .reg-quick-actions {
    display: grid !important;
    gap: var(--space-2) !important;
}

.admin-panel .reg-quick-actions > form,
.admin-panel .app-workflow-card > form,
.admin-panel .ds-action-stack > form {
    margin: 0 !important;
    width: 100% !important;
}

.admin-panel .reg-quick-actions .reg-btn,
.admin-panel .reg-quick-actions form .reg-btn {
    justify-content: flex-start !important;
    margin-bottom: 0 !important;
    width: 100% !important;
}

.admin-panel .bw-panel__body.d-grid .bw-btn--block,
.admin-panel .bw-panel__body.d-grid .bw-btn {
    margin: 0 !important;
}

.admin-panel .d-grid.gap-2 > form,
.admin-panel .d-grid.gap-2 > .app-btn,
.admin-panel .d-grid.gap-2 > .reg-btn,
.admin-panel .d-grid.gap-2 > .btn,
.admin-panel .d-grid.gap-2 > a.app-btn,
.admin-panel .d-grid.gap-2 > a.reg-btn,
.admin-panel .d-grid.gap-2 > a.bw-btn {
    margin: 0 !important;
}

.admin-panel .d-flex.flex-column.gap-2 > form,
.admin-panel .d-flex.flex-column.gap-2 > .app-btn,
.admin-panel .d-flex.flex-column.gap-2 > .reg-btn,
.admin-panel .d-flex.flex-column.gap-2 > .btn {
    margin: 0 !important;
}

.admin-panel .modal-footer {
    align-items: center !important;
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
}

.admin-panel .modal-footer > form {
    margin: 0 !important;
}

/* Scrollable content regions (stats rows, tabs, tables inside cards) */
.admin-panel .app-scroll-x,
.admin-panel .wu-tabs-wrap {
    max-width: 100% !important;
}

.admin-panel .app-table-scroll,
.admin-panel .reg-table-wrap,
.admin-panel .pur-table-scroll,
.admin-panel .gst-table-scroll,
.admin-panel .wsc-table-scroll,
.admin-panel .mrr-grid-wrap {
    max-width: 100% !important;
}

/* ── Stats grids ─────────────────────────────────────────────── */
.admin-panel .app-stats-grid,
.admin-panel .bw-stats-grid,
.admin-panel .dash-stats-grid {
    gap: var(--space-3) !important;
    margin-bottom: var(--space-4) !important;
}

.admin-panel .bw-stat-card,
.admin-panel .dash-stat-card {
    border-radius: var(--radius) !important;
    padding: var(--space-4) !important;
}

/* ── Legacy theme overrides ──────────────────────────────────── */
.admin-panel .theme-bg-blue,
.admin-panel .bg-primary,
.admin-panel .text-bg-primary {
    background: var(--primary) !important;
}

.admin-panel .text-primary {
    color: var(--primary) !important;
}

.admin-panel .border-primary {
    border-color: var(--primary) !important;
}

.admin-panel .accent-line {
    display: none !important;
}

/* ── Admin auth (login / OTP) ────────────────────────────────── */
body.auth-portal.admin-auth {
    --primary: #5b4cff !important;
    --primary-hover: #4a3df0 !important;
    --page-bg: #f8fafc !important;
    --card-bg: #ffffff !important;
    --text-primary: #111827 !important;
    --text-secondary: #6b7280 !important;
    --text-muted: #6b7280 !important;
    --border-color: #e5e7eb !important;
    --border-input: #d1d5db !important;
    --auth-control-height: 42px !important;
    background-color: var(--page-bg) !important;
}

body.auth-portal.admin-auth .before-login,
body.auth-portal.admin-auth .card {
    border-radius: var(--radius) !important;
    box-shadow: var(--shadow) !important;
}

body.auth-portal.admin-auth .before-login .card-header,
body.auth-portal.admin-auth .card-header {
    background: var(--surface) !important;
    border-bottom: 1px solid var(--border-color) !important;
    border-radius: var(--radius) var(--radius) 0 0 !important;
    padding: var(--space-4) var(--space-5) !important;
}

body.auth-portal.admin-auth .card-header h4 {
    color: var(--text-primary) !important;
    font-size: var(--font-section-title) !important;
    font-weight: 600 !important;
}

body.auth-portal.admin-auth .card-body {
    padding: var(--space-5) !important;
}

body.auth-portal.admin-auth .form-control,
body.auth-portal.admin-auth .form-select {
    border-color: var(--border-input) !important;
    border-radius: var(--radius-sm) !important;
    min-height: var(--auth-control-height) !important;
}

body.auth-portal.admin-auth .form-control:focus {
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 3px var(--primary-focus) !important;
}

body.auth-portal.admin-auth .btn-primary {
    background: var(--primary) !important;
    border-color: var(--primary) !important;
    border-radius: var(--radius-sm) !important;
    font-weight: 600 !important;
    min-height: var(--auth-control-height) !important;
    transition: background var(--transition) !important;
}

body.auth-portal.admin-auth .btn-primary:hover {
    background: var(--primary-hover) !important;
    border-color: var(--primary-hover) !important;
}

body.auth-portal.admin-auth .text-blue,
body.auth-portal.admin-auth a:not(.btn) {
    color: var(--primary) !important;
}

body.auth-portal.admin-auth .alert {
    border-radius: var(--radius-sm) !important;
}

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width: 991.98px) {
    .admin-panel .admin-content {
        padding: var(--space-4) !important;
    }
}

@media (max-width: 575.98px) {
    .admin-panel .app-page-title {
        font-size: 1.375rem !important;
    }

    .admin-panel .admin-content {
        padding: var(--space-3) !important;
    }
}