/*
 * ============================================
 *  GEO TRANSFER — Global Admin Theme
 * ============================================
 *  This file defines the design system tokens,
 *  component styles, and dark/light mode support
 *  for the entire admin panel.
 *
 *  HOW TO USE:
 *  1. Include this CSS AFTER style.css in any page/layout.
 *  2. Dark mode is default. Add class "gt-light" to <html>
 *     to switch to light mode.
 *  3. Use CSS variables (--gt-*) in your components.
 * ============================================
 */

/* ─── Google Fonts ─── */
@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&family=Inter:wght@300;400;500;600;700;800&display=swap');

/* ═══════════════════════════════════════════
   1. DESIGN TOKENS — Light Mode (Default)
   ═══════════════════════════════════════════ */
:root {
    /* ─── Brand Colors ─── */
    --gt-gold: #F5A623;
    --gt-gold-hover: #E09510;
    --gt-gold-light: #FCEBD0;
    --gt-gold-gradient: linear-gradient(135deg, #F5A623 0%, #E09510 100%);

    --gt-blue: #2E3192;
    --gt-blue-hover: #232671;
    --gt-blue-light: #D8D9F0;

    /* ─── Semantic Colors ─── */
    --gt-success: #22C55E;
    --gt-success-light: rgba(34, 197, 94, 0.12);
    --gt-warning: #FBBF24;
    --gt-warning-light: rgba(251, 191, 36, 0.12);
    --gt-danger: #EF4444;
    --gt-danger-light: rgba(239, 68, 68, 0.12);
    --gt-info: #3B82F6;
    --gt-info-light: rgba(59, 130, 246, 0.12);

    /* ─── Surface Colors (Light Mode) ─── */
    --gt-bg-body: #F3F4F8;
    --gt-bg-surface: #FFFFFF;
    --gt-bg-card: #FFFFFF;
    --gt-bg-card-hover: #F9FAFB;
    --gt-bg-elevated: #F0F1F5;
    --gt-bg-input: #F5F6FA;

    /* ─── Border Colors ─── */
    --gt-border: #E2E4EB;
    --gt-border-light: #D1D5DB;
    --gt-border-focus: var(--gt-blue);

    /* ─── Text Colors ─── */
    --gt-text-primary: #111827;
    --gt-text-secondary: #4B5563;
    --gt-text-muted: #9CA3AF;
    --gt-text-inverse: #FFFFFF;

    /* ─── Shadows ─── */
    --gt-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06);
    --gt-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
    --gt-shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.1);
    --gt-shadow-glow: 0 0 30px rgba(46, 49, 146, 0.08);
    --gt-shadow-gold: 0 4px 20px rgba(245, 166, 35, 0.15);

    /* ─── Typography ─── */
    --gt-font-family: Figtree, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --gt-font-size-xs: 0.75rem;
    /* 12px */
    --gt-font-size-sm: 0.8125rem;
    /* 13px */
    --gt-font-size-base: 0.875rem;
    /* 14px */
    --gt-font-size-md: 1rem;
    /* 16px */
    --gt-font-size-lg: 1.125rem;
    /* 18px */
    --gt-font-size-xl: 1.5rem;
    /* 24px */
    --gt-font-size-2xl: 2rem;
    /* 32px */
    --gt-font-size-3xl: 2.5rem;
    /* 40px */

    /* ─── Spacing ─── */
    --gt-radius-sm: 6px;
    --gt-radius-md: 10px;
    --gt-radius-lg: 16px;
    --gt-radius-xl: 20px;
    --gt-radius-pill: 9999px;

    /* ─── Transitions ─── */
    --gt-transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    --gt-transition-fast: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
    --gt-transition-slow: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ═══════════════════════════════════════════
   2. DARK MODE OVERRIDES
   ═══════════════════════════════════════════ */
html.gt-dark {
    --gt-bg-body: #0C0E14;
    --gt-bg-surface: #141720;
    --gt-bg-card: #1A1E2E;
    --gt-bg-card-hover: #1F2438;
    --gt-bg-elevated: #222840;
    --gt-bg-input: #141720;

    --gt-border: #2A2F3F;
    --gt-border-light: #343A50;
    --gt-border-focus: var(--gt-gold);

    --gt-text-primary: #F0F0F5;
    --gt-text-secondary: #9CA3AF;
    --gt-text-muted: #6B7280;
    --gt-text-inverse: #0C0E14;

    --gt-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
    --gt-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
    --gt-shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.5);
    --gt-shadow-glow: 0 0 30px rgba(46, 49, 146, 0.15);
    --gt-shadow-gold: 0 4px 20px rgba(245, 166, 35, 0.25);
}


/* ═══════════════════════════════════════════
   3. BASE RESETS & GLOBAL STYLES
   ═══════════════════════════════════════════ */

/* ─── Auth Pages (Login / Forgot Password / Reset) ─── */
.gt-auth-page {
    font-family: var(--gt-font-family);
    background-color: var(--gt-bg-body);
    color: var(--gt-text-primary);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

/* Subtle background pattern */
.gt-auth-page::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(circle at 20% 50%, rgba(46, 49, 146, 0.06) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, rgba(245, 166, 35, 0.04) 0%, transparent 40%),
        radial-gradient(circle at 60% 80%, rgba(46, 49, 146, 0.04) 0%, transparent 40%);
    pointer-events: none;
    z-index: 0;
}

/* Animated subtle grid lines */
.gt-auth-page::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(46, 49, 146, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(46, 49, 146, 0.03) 1px, transparent 1px);
    background-size: 60px 60px;
    pointer-events: none;
    z-index: 0;
}

html.gt-dark .gt-auth-page::before {
    background-image:
        radial-gradient(circle at 20% 50%, rgba(46, 49, 146, 0.06) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, rgba(245, 166, 35, 0.04) 0%, transparent 40%),
        radial-gradient(circle at 60% 80%, rgba(46, 49, 146, 0.04) 0%, transparent 40%);
}

html.gt-dark .gt-auth-page::after {
    background-image:
        linear-gradient(rgba(46, 49, 146, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(46, 49, 146, 0.03) 1px, transparent 1px);
}


/* ═══════════════════════════════════════════
   4. AUTH CARD COMPONENT
   ═══════════════════════════════════════════ */
.gt-auth-card {
    position: relative;
    z-index: 1;
    background: var(--gt-bg-card);
    border: 1px solid var(--gt-border);
    border-radius: var(--gt-radius-xl);
    padding: 48px 40px 40px;
    width: 100%;
    max-width: 440px;
    box-shadow: var(--gt-shadow-lg), var(--gt-shadow-glow);
    animation: gt-card-enter 0.6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@keyframes gt-card-enter {
    from {
        opacity: 0;
        transform: translateY(20px) scale(0.98);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Card header area */
.gt-auth-card__logo {
    display: block;
    width: auto;
    /* max-width: 150px; */
    height: 100px;
    margin: 0 auto 24px;
    background: transparent !important;
    background-color: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
    object-fit: contain;
    box-shadow: none !important;
    border: none !important;
    filter: brightness(0);
    transition: filter 0.25s ease;
}

html.gt-dark .gt-auth-card__logo {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
    filter: brightness(0) invert(1) !important;
}

.gt-auth-card__title {
    font-family: var(--gt-font-family);
    font-size: var(--gt-font-size-2xl);
    font-weight: 700;
    color: var(--gt-text-primary);
    text-align: center;
    margin: 0 0 6px;
    letter-spacing: -0.02em;
}

.gt-auth-card__subtitle {
    font-family: var(--gt-font-family);
    font-size: var(--gt-font-size-base);
    color: var(--gt-text-muted);
    text-align: center;
    margin: 0 0 32px;
    font-weight: 400;
}


/* ═══════════════════════════════════════════
   5. FORM COMPONENTS
   ═══════════════════════════════════════════ */

/* Form Group */
.gt-form-group {
    margin-bottom: 20px;
}

.gt-form-label {
    display: block;
    font-family: var(--gt-font-family);
    font-size: var(--gt-font-size-sm);
    font-weight: 500;
    color: var(--gt-text-secondary);
    margin-bottom: 8px;
    letter-spacing: 0.01em;
}

/* Inputs */
.gt-input {
    width: 100%;
    padding: 12px 16px;
    font-family: var(--gt-font-family);
    font-size: var(--gt-font-size-base);
    color: var(--gt-text-primary);
    background: var(--gt-bg-input);
    border: 1px solid var(--gt-border);
    border-radius: var(--gt-radius-md);
    outline: none;
    transition: var(--gt-transition);
    box-sizing: border-box;
}

.gt-input::placeholder {
    color: var(--gt-text-muted);
}

.gt-input:hover {
    border-color: var(--gt-border-light);
}

.gt-input:focus {
    border-color: var(--gt-border-focus);
    box-shadow: 0 0 0 3px rgba(245, 166, 35, 0.1);
    background: var(--gt-bg-surface);
}

html.gt-dark .gt-input:focus {
    box-shadow: 0 0 0 3px rgba(245, 166, 35, 0.1);
}

/* Password input wrapper */
.gt-input-password {
    position: relative;
}

.gt-input-password .gt-input {
    padding-right: 48px;
}

.gt-input-password__toggle {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: var(--gt-text-muted);
    cursor: pointer;
    padding: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--gt-transition-fast);
    font-size: 1rem;
}

.gt-input-password__toggle:hover {
    color: var(--gt-text-secondary);
}

/* Form Row (remember + forgot) */
.gt-form-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
}

/* Checkbox */
.gt-checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-family: var(--gt-font-family);
    font-size: var(--gt-font-size-sm);
    color: var(--gt-text-secondary);
    user-select: none;
}

.gt-checkbox input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    border: 2px solid var(--gt-border-light);
    border-radius: 4px;
    background: var(--gt-bg-input);
    cursor: pointer;
    position: relative;
    transition: var(--gt-transition-fast);
    flex-shrink: 0;
}

.gt-checkbox input[type="checkbox"]:checked {
    background: var(--gt-gold);
    border-color: var(--gt-gold);
}

.gt-checkbox input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    left: 5px;
    top: 1px;
    width: 5px;
    height: 10px;
    border: solid var(--gt-text-inverse);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* Links */
.gt-link {
    font-family: var(--gt-font-family);
    font-size: var(--gt-font-size-sm);
    font-weight: 600;
    color: var(--gt-blue);
    text-decoration: none;
    transition: var(--gt-transition-fast);
}

.gt-link:hover {
    color: var(--gt-blue-hover);
    text-decoration: underline;
}

html.gt-dark .gt-link {
    color: #6B70C7;
}

html.gt-dark .gt-link:hover {
    color: var(--gt-blue-hover);
}

/* Links use brand blue by default (light mode) */


/* ═══════════════════════════════════════════
   6. BUTTONS
   ═══════════════════════════════════════════ */

.gt-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 24px;
    font-family: var(--gt-font-family);
    font-size: var(--gt-font-size-base);
    font-weight: 600;
    border: none;
    border-radius: var(--gt-radius-md);
    cursor: pointer;
    transition: var(--gt-transition);
    text-decoration: none;
    line-height: 1.5;
    white-space: nowrap;
}

.gt-btn:active {
    transform: scale(0.98);
}

/* Primary — Gold */
.gt-btn--primary {
    width: 100%;
    background: var(--gt-gold-gradient);
    color: #1A1200;
    font-weight: 700;
    padding: 14px 24px;
    font-size: var(--gt-font-size-md);
    letter-spacing: 0.02em;
    box-shadow: var(--gt-shadow-gold);
}

.gt-btn--primary:hover {
    background: linear-gradient(135deg, #E09510 0%, #CC8400 100%);
    box-shadow: 0 6px 25px rgba(245, 166, 35, 0.35);
    transform: translateY(-1px);
}

.gt-btn--primary:active {
    transform: translateY(0) scale(0.99);
}

/* Secondary — Blue */
.gt-btn--secondary {
    background: var(--gt-blue);
    color: #FFFFFF;
}

.gt-btn--secondary:hover {
    background: var(--gt-blue-hover);
    box-shadow: 0 4px 15px rgba(46, 49, 146, 0.3);
}

/* Outline */
.gt-btn--outline {
    background: transparent;
    border: 1px solid var(--gt-border);
    color: var(--gt-text-primary);
}

.gt-btn--outline:hover {
    border-color: var(--gt-border-light);
    background: var(--gt-bg-surface);
}

/* Danger */
.gt-btn--danger {
    background: var(--gt-danger);
    color: #FFFFFF;
}

.gt-btn--danger:hover {
    background: #DC2626;
    box-shadow: 0 4px 15px rgba(239, 68, 68, 0.3);
}


/* ═══════════════════════════════════════════
   7. ALERT / FLASH MESSAGES
   ═══════════════════════════════════════════ */
.gt-alert {
    font-family: var(--gt-font-family);
    padding: 12px 16px;
    border-radius: var(--gt-radius-md);
    font-size: var(--gt-font-size-sm);
    margin-bottom: 20px;
    border: 1px solid transparent;
    animation: gt-alert-enter 0.3s ease forwards;
}

@keyframes gt-alert-enter {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.gt-alert--error {
    background: var(--gt-danger-light);
    border-color: rgba(239, 68, 68, 0.2);
    color: #B91C1C;
}

html.gt-dark .gt-alert--error {
    color: #FCA5A5;
}

.gt-alert--success {
    background: var(--gt-success-light);
    border-color: rgba(34, 197, 94, 0.2);
    color: #166534;
}

html.gt-dark .gt-alert--success {
    color: #86EFAC;
}

.gt-alert--warning {
    background: var(--gt-warning-light);
    border-color: rgba(251, 191, 36, 0.2);
    color: #92400E;
}

html.gt-dark .gt-alert--warning {
    color: #FDE68A;
}

.gt-alert--info {
    background: var(--gt-info-light);
    border-color: rgba(59, 130, 246, 0.2);
    color: #1E40AF;
}

html.gt-dark .gt-alert--info {
    color: #93C5FD;
}


/* ═══════════════════════════════════════════
   8. AUTH FOOTER
   ═══════════════════════════════════════════ */
.gt-auth-footer {
    position: relative;
    z-index: 1;
    margin-top: 32px;
    text-align: center;
    width: 100%;
    max-width: 440px;
    padding: 0 20px;
}

.gt-auth-footer__copyright {
    font-family: var(--gt-font-family);
    font-size: var(--gt-font-size-xs);
    color: var(--gt-text-muted);
    margin-bottom: 8px;
}

.gt-auth-footer__copyright a {
    color: var(--gt-text-secondary);
    text-decoration: none;
    transition: var(--gt-transition-fast);
}

.gt-auth-footer__copyright a:hover {
    color: var(--gt-gold);
}

.gt-auth-footer__links {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex-wrap: wrap;
}

.gt-auth-footer__links a {
    font-family: var(--gt-font-family);
    font-size: var(--gt-font-size-xs);
    color: var(--gt-text-muted);
    text-decoration: none;
    transition: var(--gt-transition-fast);
    padding: 2px 0;
}

.gt-auth-footer__links a:hover {
    color: var(--gt-gold);
}

.gt-auth-footer__divider {
    width: 1px;
    height: 12px;
    background: var(--gt-border);
    display: inline-block;
}


/* ═══════════════════════════════════════════
   9. THEME TOGGLE BUTTON
   ═══════════════════════════════════════════ */
.gt-theme-toggle {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 9999;
    background: var(--gt-bg-card);
    border: 1px solid var(--gt-border);
    border-radius: var(--gt-radius-pill);
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: var(--gt-transition);
    box-shadow: var(--gt-shadow-md);
    color: var(--gt-text-secondary);
    font-size: 1.1rem;
}

.gt-theme-toggle:hover {
    border-color: var(--gt-gold);
    color: var(--gt-gold);
    box-shadow: var(--gt-shadow-gold);
    transform: rotate(15deg);
}

.gt-theme-toggle .gt-icon-moon {
    display: none;
}

html.gt-dark .gt-theme-toggle .gt-icon-sun {
    display: block;
}

html.gt-dark .gt-theme-toggle .gt-icon-moon {
    display: none;
}


/* ═══════════════════════════════════════════
   10. LOADING SPINNER
   ═══════════════════════════════════════════ */
.gt-spinner {
    display: inline-block;
    width: 18px;
    height: 18px;
    border: 2px solid rgba(26, 18, 0, 0.2);
    border-top-color: #1A1200;
    border-radius: 50%;
    animation: gt-spin 0.6s linear infinite;
}

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

.gt-btn--loading {
    pointer-events: none;
    opacity: 0.8;
}


/* ═══════════════════════════════════════════
   11. RESPONSIVE
   ═══════════════════════════════════════════ */
@media (max-width: 480px) {
    .gt-auth-card {
        margin: 16px;
        padding: 32px 24px 28px;
        border-radius: var(--gt-radius-lg);
    }

    .gt-auth-card__title {
        font-size: var(--gt-font-size-xl);
    }

    .gt-auth-footer__links {
        flex-direction: column;
        gap: 4px;
    }

    .gt-auth-footer__divider {
        display: none;
    }

    .gt-theme-toggle {
        top: 12px;
        right: 12px;
        width: 38px;
        height: 38px;
    }
}


/* ═══════════════════════════════════════════
   12. UTILITY CLASSES
   ═══════════════════════════════════════════ */
.gt-text-center {
    text-align: center;
}

.gt-text-muted {
    color: var(--gt-text-muted);
}

.gt-mt-sm {
    margin-top: 8px;
}

.gt-mt-md {
    margin-top: 16px;
}

.gt-mt-lg {
    margin-top: 24px;
}

.gt-mb-sm {
    margin-bottom: 8px;
}

.gt-mb-md {
    margin-bottom: 16px;
}

.gt-mb-lg {
    margin-bottom: 24px;
}


/* ═══════════════════════════════════════════
   13. DASHBOARD & ADMIN LAYOUT THEME
   ═══════════════════════════════════════════ */

/* ─── Global Font & Element Overrides ─── */
body,
.header,
.nav-header,
.deznav,
.content-body,
.card,
.table,
.modal-content,
.dashboard_bar {
    font-family: var(--gt-font-family) !important;
}

body {
    background-color: var(--gt-bg-body) !important;
    color: var(--gt-text-primary);
}

.content-body {
    background-color: var(--gt-bg-body) !important;
    min-height: calc(100vh - 4.5rem);
    transition: margin-left 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ─── Top Header & Brand Header ─── */
.nav-header {
    background: var(--gt-bg-surface) !important;
    border-bottom: 1px solid var(--gt-border);
    transition: width 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 10;
}

.header {
    background: var(--gt-bg-surface) !important;
    border-bottom: 1px solid var(--gt-border);
    box-shadow: var(--gt-shadow-sm) !important;
    transition: padding-left 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.header .navbar {
    height: 4.5rem;
    padding: 0 28px;
}

/* Brand Logo Box */
.gt-nav-brand {
    display: flex !important;
    align-items: center;
    padding-left: 18px !important;
    text-decoration: none !important;
    height: 100%;
}

.gt-nav-brand__box {
    display: flex;
    align-items: center;
    gap: 12px;
}

.gt-nav-brand__box .logo-abbr {
    display: none;
    width: 38px;
    height: 38px;
    background: transparent !important;
    background-color: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
    object-fit: contain;
    box-shadow: none !important;
    border: none !important;
    filter: brightness(0);
    transition: filter 0.25s ease;
}

html.gt-dark .gt-nav-brand__box .logo-abbr {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    filter: brightness(0) invert(1) !important;
}

.gt-nav-brand__title {
    display: flex;
    align-items: center;
    gap: 10px;
}

.gt-nav-brand__img {
    height: 70px;
    width: auto;
    /* max-width: 140px; */
    background: transparent !important;
    background-color: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
    object-fit: contain;
    box-shadow: none !important;
    border: none !important;
    filter: brightness(0);
    transition: filter 0.25s ease;
}

html.gt-dark .gt-nav-brand__img {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    filter: brightness(0) invert(1) !important;
}

.gt-nav-brand__name {
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: var(--gt-text-primary);
    text-transform: uppercase;
    white-space: nowrap;
}

.gt-nav-brand__accent {
    color: var(--gt-gold);
}

/* Minimized Nav Header state */
[data-sidebar-style="full"][data-layout="vertical"] .menu-toggle .gt-nav-brand__title {
    display: none !important;
}

[data-sidebar-style="full"][data-layout="vertical"] .menu-toggle .gt-nav-brand__box .logo-abbr {
    display: block !important;
    margin: 0 auto;
}

[data-sidebar-style="full"][data-layout="vertical"] .menu-toggle .gt-nav-brand {
    justify-content: center !important;
    padding-left: 0 !important;
}

/* Hamburger button */
.nav-control {
    cursor: pointer;
    background: transparent;
}

.hamburger .line {
    background: var(--gt-text-primary) !important;
    transition: var(--gt-transition-fast);
}

.nav-control:hover .hamburger .line {
    background: var(--gt-gold) !important;
}

/* Page Title in Header */
.gt-header-title-box {
    display: flex;
    flex-direction: column;
}

.gt-page-title {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--gt-text-primary);
    letter-spacing: -0.02em;
    margin: 0;
}

.gt-page-subtitle {
    font-size: 0.8rem;
    color: var(--gt-text-muted);
    font-weight: 400;
    margin-top: 2px;
}

/* Header Action Buttons */
.gt-header-btn {
    width: 42px !important;
    height: 42px !important;
    border-radius: 10px !important;
    background: var(--gt-bg-elevated) !important;
    border: 1px solid var(--gt-border) !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    color: var(--gt-text-secondary) !important;
    transition: var(--gt-transition);
    margin-left: 10px;
    padding: 0 !important;
    text-decoration: none !important;
}

.gt-header-btn:hover {
    border-color: var(--gt-gold) !important;
    color: var(--gt-gold) !important;
    transform: translateY(-1px);
    box-shadow: var(--gt-shadow-sm);
}

/* Sun/Moon icon toggle */
.dz-theme-mode #icon-light {
    display: none;
}

.dz-theme-mode #icon-dark {
    display: block;
}

html.gt-dark .dz-theme-mode #icon-light,
body[data-theme-version="dark"] .dz-theme-mode #icon-light {
    display: block;
    color: var(--gt-gold);
}

html.gt-dark .dz-theme-mode #icon-dark,
body[data-theme-version="dark"] .dz-theme-mode #icon-dark {
    display: none;
}

/* ─── Header User Profile Widget ─── */
.gt-header-user {
    display: flex !important;
    align-items: center;
    gap: 9px;
    padding: 4px 12px 4px 6px !important;
    background: var(--gt-bg-elevated) !important;
    border: 1px solid var(--gt-border) !important;
    border-radius: var(--gt-radius-pill) !important;
    text-decoration: none !important;
    transition: var(--gt-transition);
    cursor: pointer;
    margin-left: 8px;
    height: 42px;
}

.gt-header-user:hover {
    border-color: var(--gt-gold) !important;
    box-shadow: var(--gt-shadow-sm);
    transform: translateY(-1px);
}

.gt-header-user__avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(46, 49, 146, 0.1);
    color: var(--gt-blue);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
    flex-shrink: 0;
}

html.gt-dark .gt-header-user__avatar {
    background: rgba(245, 166, 35, 0.15);
    color: var(--gt-gold);
}

.gt-header-user__avatar--sm {
    width: 36px;
    height: 36px;
    font-size: 1rem;
}

.gt-header-user__info {
    display: flex;
    flex-direction: column;
    text-align: left;
    line-height: 1.15;
}

.gt-header-user__name {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--gt-text-primary);
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gt-header-user__role {
    font-size: 0.68rem;
    color: var(--gt-text-muted);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.gt-header-user__arrow {
    font-size: 0.65rem;
    color: var(--gt-text-muted);
    transition: transform 0.2s ease;
}

.gt-header-user[aria-expanded="true"] .gt-header-user__arrow {
    transform: rotate(180deg);
}

/* User Dropdown Menu */
.gt-user-dropdown {
    min-width: 220px !important;
    background: var(--gt-bg-card) !important;
    border: 1px solid var(--gt-border) !important;
    border-radius: var(--gt-radius-md) !important;
    box-shadow: var(--gt-shadow-lg) !important;
    padding: 8px !important;
    margin-top: 8px !important;
}

.gt-user-dropdown__header {
    padding: 8px 10px 10px;
}

.gt-user-dropdown__name {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--gt-text-primary);
}

.gt-user-dropdown__email {
    font-size: 0.75rem;
    color: var(--gt-text-muted);
    display: block;
    word-break: break-all;
}

.gt-user-dropdown__item {
    display: flex !important;
    align-items: center;
    padding: 8px 12px !important;
    border-radius: 6px !important;
    font-size: 0.84rem !important;
    font-weight: 500 !important;
    transition: var(--gt-transition-fast) !important;
}

.gt-user-dropdown__item:hover {
    background: rgba(239, 68, 68, 0.08) !important;
}

/* ─── Sidebar Drawer (deznav) ─── */
.deznav {
    background: var(--gt-bg-surface) !important;
    border-right: 1px solid var(--gt-border);
    transition: width 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: var(--gt-shadow-sm);
}

/* User Profile in Sidebar */
.main-profile {
    background: var(--gt-bg-elevated) !important;
    border: 1px solid var(--gt-border);
    border-radius: var(--gt-radius-lg);
    padding: 18px 16px;
    margin: 16px 14px 20px !important;
    text-align: center;
    transition: var(--gt-transition);
}

.main-profile .image-bx {
    color: var(--gt-gold);
    margin-bottom: 8px;
    font-size: 2.2rem;
}

.main-profile .name {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--gt-text-primary) !important;
    margin-bottom: 4px;
}

.main-profile .email {
    font-size: 0.78rem;
    color: var(--gt-text-muted) !important;
    margin-bottom: 10px;
    word-break: break-all;
}

.gt-role-pill {
    display: inline-block;
    padding: 3px 12px;
    border-radius: var(--gt-radius-pill);
    background: rgba(245, 166, 35, 0.15);
    color: #B45309;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

html.gt-dark .gt-role-pill {
    background: rgba(245, 166, 35, 0.2);
    color: var(--gt-gold);
}

/* MetisMenu navigation items */
.deznav .metismenu>li {
    margin: 4px 12px;
}

.deznav .metismenu>li>a {
    color: var(--gt-text-secondary) !important;
    font-size: 0.875rem;
    font-weight: 500;
    padding: 11px 16px !important;
    border-radius: 10px;
    transition: var(--gt-transition-fast);
    display: flex;
    align-items: center;
    gap: 12px;
}

.deznav .metismenu>li>a i {
    font-size: 1.15rem;
    color: var(--gt-text-muted);
    transition: var(--gt-transition-fast);
}

.deznav .metismenu>li>a:hover {
    background: var(--gt-bg-elevated) !important;
    color: var(--gt-text-primary) !important;
}

.deznav .metismenu>li>a:hover i {
    color: var(--gt-gold);
}

.deznav .metismenu>li.mm-active>a {
    background: rgba(46, 49, 146, 0.08) !important;
    color: var(--gt-blue) !important;
    font-weight: 600;
    box-shadow: inset 3.5px 0 0 var(--gt-gold);
}

.deznav .metismenu>li.mm-active>a i {
    color: var(--gt-blue);
}

html.gt-dark .deznav .metismenu>li.mm-active>a {
    background: rgba(245, 166, 35, 0.12) !important;
    color: var(--gt-gold) !important;
    box-shadow: inset 3.5px 0 0 var(--gt-gold);
}

html.gt-dark .deznav .metismenu>li.mm-active>a i {
    color: var(--gt-gold);
}

/* Submenus */
.deznav .metismenu ul {
    background: transparent !important;
}

.deznav .metismenu ul a {
    padding: 8px 16px 8px 38px !important;
    font-size: 0.8125rem;
    color: var(--gt-text-muted) !important;
    transition: var(--gt-transition-fast);
}

.deznav .metismenu ul a:hover,
.deznav .metismenu ul li.mm-active a {
    color: var(--gt-gold) !important;
    background: transparent !important;
}

/* Minimized sidebar adjustments */
[data-sidebar-style="full"][data-layout="vertical"] .menu-toggle .deznav {
    width: 5rem !important;
}

[data-sidebar-style="full"][data-layout="vertical"] .menu-toggle .deznav .metismenu>li {
    margin: 4px 6px;
}

[data-sidebar-style="full"][data-layout="vertical"] .menu-toggle .deznav .metismenu>li>a {
    justify-content: center;
    padding: 12px !important;
}

[data-sidebar-style="full"][data-layout="vertical"] .menu-toggle .deznav .metismenu>li>a i {
    font-size: 1.3rem;
    margin: 0;
}

/* ─── Modern Dashboard KPI Metric Cards ─── */
.gt-kpi-card {
    background: var(--gt-bg-card);
    border: 1px solid var(--gt-border);
    border-radius: var(--gt-radius-lg);
    padding: 22px 24px;
    box-shadow: var(--gt-shadow-sm);
    transition: var(--gt-transition);
    position: relative;
    overflow: hidden;
    height: 100%;
}

.gt-kpi-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--gt-shadow-md);
    border-color: var(--gt-border-light);
}

.gt-kpi-card__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.gt-kpi-card__info {
    flex: 1;
}

.gt-kpi-card__label {
    display: block;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--gt-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 6px;
}

.gt-kpi-card__value {
    font-size: 1.85rem;
    font-weight: 700;
    color: var(--gt-text-primary);
    line-height: 1.15;
    letter-spacing: -0.02em;
    margin-bottom: 8px;
}

.gt-kpi-card__icon-box {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.45rem;
    flex-shrink: 0;
    transition: var(--gt-transition);
}

.gt-kpi-card:hover .gt-kpi-card__icon-box {
    transform: scale(1.06);
}

/* KPI Card Variations */
.gt-kpi-card--gold .gt-kpi-card__icon-box {
    background: rgba(245, 166, 35, 0.12);
    color: #E09510;
}

.gt-kpi-card--blue .gt-kpi-card__icon-box {
    background: rgba(46, 49, 146, 0.12);
    color: #2E3192;
}

html.gt-dark .gt-kpi-card--blue .gt-kpi-card__icon-box {
    background: rgba(59, 130, 246, 0.15);
    color: #60A5FA;
}

.gt-kpi-card--green .gt-kpi-card__icon-box {
    background: rgba(34, 197, 94, 0.12);
    color: #16A34A;
}

.gt-kpi-card--purple .gt-kpi-card__icon-box {
    background: rgba(99, 102, 241, 0.12);
    color: #6366F1;
}

.gt-kpi-card--danger .gt-kpi-card__icon-box {
    background: rgba(239, 68, 68, 0.12);
    color: #EF4444;
}

.gt-kpi-card--amber .gt-kpi-card__icon-box {
    background: rgba(245, 166, 35, 0.12);
    color: #E09510;
}

/* Compact layout for 6-card row */
.gt-kpi-card--compact {
    padding: 16px 16px !important;
}

.gt-kpi-card--compact .gt-kpi-card__label {
    font-size: 0.72rem !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gt-kpi-card--compact .gt-kpi-card__value {
    font-size: 1.5rem !important;
    margin-bottom: 6px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gt-kpi-card--compact .gt-kpi-card__icon-box {
    width: 36px !important;
    height: 36px !important;
    border-radius: 10px !important;
    font-size: 1rem !important;
}

/* KPI Badges */
.gt-kpi-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: var(--gt-radius-pill);
}

.gt-kpi-badge--gold {
    background: rgba(245, 166, 35, 0.12);
    color: #B45309;
}

html.gt-dark .gt-kpi-badge--gold {
    color: #FDE68A;
}

.gt-kpi-badge--blue {
    background: rgba(46, 49, 146, 0.1);
    color: #2E3192;
}

html.gt-dark .gt-kpi-badge--blue {
    background: rgba(59, 130, 246, 0.15);
    color: #93C5FD;
}

.gt-kpi-badge--success {
    background: rgba(34, 197, 94, 0.12);
    color: #15803D;
}

html.gt-dark .gt-kpi-badge--success {
    color: #86EFAC;
}

.gt-kpi-badge--purple {
    background: rgba(99, 102, 241, 0.12);
    color: #4F46E5;
}

html.gt-dark .gt-kpi-badge--purple {
    color: #C7D2FE;
}

.gt-kpi-badge--danger {
    background: rgba(239, 68, 68, 0.12);
    color: #DC2626;
}

html.gt-dark .gt-kpi-badge--danger {
    background: rgba(239, 68, 68, 0.2);
    color: #FCA5A5;
}

.gt-kpi-badge--amber {
    background: rgba(245, 166, 35, 0.12);
    color: #B45309;
}

html.gt-dark .gt-kpi-badge--amber {
    background: rgba(245, 166, 35, 0.2);
    color: #FDE68A;
}

.gt-pulse-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.5);
    animation: gt-pulse 1.8s infinite;
}

.gt-pulse-dot--gold {
    box-shadow: 0 0 0 0 rgba(245, 166, 35, 0.5);
    animation: gt-pulse-gold 1.8s infinite;
}

@keyframes gt-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.6);
    }

    70% {
        box-shadow: 0 0 0 6px rgba(34, 197, 94, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(34, 197, 94, 0);
    }
}

@keyframes gt-pulse-gold {
    0% {
        box-shadow: 0 0 0 0 rgba(245, 166, 35, 0.6);
    }

    70% {
        box-shadow: 0 0 0 6px rgba(245, 166, 35, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(245, 166, 35, 0);
    }
}

/* ─── Modern Dashboard Cards & Tables ─── */
.gt-card {
    background: var(--gt-bg-card);
    border: 1px solid var(--gt-border);
    border-radius: var(--gt-radius-lg);
    box-shadow: var(--gt-shadow-sm);
    overflow: hidden;
    transition: var(--gt-transition);
}

.gt-card__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 24px;
    border-bottom: 1px solid var(--gt-border);
    background: var(--gt-bg-card);
    flex-wrap: wrap;
    gap: 12px;
}

.gt-card__title-group {
    display: flex;
    align-items: center;
    gap: 12px;
}

.gt-card__icon-pill {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    flex-shrink: 0;
}

.gt-card__icon-pill--warning {
    background: rgba(239, 68, 68, 0.12);
    color: #EF4444;
}

.gt-card__icon-pill--car {
    background: rgba(245, 166, 35, 0.12);
    color: #E09510;
}

.gt-card__title {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--gt-text-primary);
    margin: 0;
    letter-spacing: -0.01em;
}

.gt-card__subtitle {
    font-size: 0.78rem;
    color: var(--gt-text-muted);
}

.gt-count-badge {
    padding: 3px 10px;
    border-radius: var(--gt-radius-pill);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.gt-count-badge--danger {
    background: rgba(239, 68, 68, 0.12);
    color: #DC2626;
}

html.gt-dark .gt-count-badge--danger {
    background: rgba(239, 68, 68, 0.2);
    color: #FCA5A5;
}

.gt-btn--outline-sm {
    padding: 7px 14px;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--gt-text-secondary);
    border: 1px solid var(--gt-border);
    border-radius: var(--gt-radius-md);
    background: transparent;
    text-decoration: none;
    transition: var(--gt-transition-fast);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.gt-btn--outline-sm:hover {
    border-color: var(--gt-gold);
    color: var(--gt-gold);
    background: var(--gt-bg-elevated);
}

/* Table Design */
.gt-table {
    width: 100%;
    margin-bottom: 0;
    border-collapse: collapse;
}

.gt-table thead {
    background: var(--gt-bg-elevated);
}

.gt-table th {
    padding: 13px 18px;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--gt-text-muted);
    border-bottom: 1px solid var(--gt-border);
    border-top: none;
    white-space: nowrap;
}

.gt-table td {
    padding: 14px 18px;
    font-size: 0.875rem;
    color: var(--gt-text-primary);
    border-bottom: 1px solid var(--gt-border);
    vertical-align: middle;
}

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

.gt-table tbody tr:hover {
    background: var(--gt-bg-card-hover);
}

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

/* Table Cells */
.gt-driver-cell {
    display: flex;
    align-items: center;
    gap: 12px;
}

.gt-avatar-initials {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: rgba(46, 49, 146, 0.1);
    color: var(--gt-blue);
    font-size: 0.85rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

html.gt-dark .gt-avatar-initials {
    background: rgba(245, 166, 35, 0.15);
    color: var(--gt-gold);
}

.gt-cell-primary {
    font-weight: 600;
    color: var(--gt-text-primary);
    line-height: 1.25;
}

.gt-cell-secondary {
    font-size: 0.75rem;
    color: var(--gt-text-muted);
}

.gt-cell-text {
    color: var(--gt-text-secondary);
    font-size: 0.84rem;
}

.gt-cell-phone {
    font-family: monospace, var(--gt-font-family);
    font-size: 0.84rem;
    color: var(--gt-text-secondary);
    letter-spacing: 0.02em;
}

.gt-plate-badge {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 6px;
    font-family: monospace, var(--gt-font-family);
    font-weight: 700;
    font-size: 0.85rem;
    letter-spacing: 0.04em;
    background: var(--gt-bg-elevated);
    border: 1px solid var(--gt-border);
    color: var(--gt-text-primary);
}

.gt-model-badge {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 6px;
    font-size: 0.8125rem;
    font-weight: 500;
    background: var(--gt-bg-elevated);
    color: var(--gt-text-secondary);
}

.gt-date-badge {
    font-size: 0.8125rem;
    color: var(--gt-text-muted);
    white-space: nowrap;
}

.gt-action-btn {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: 1px solid var(--gt-border);
    background: var(--gt-bg-elevated);
    color: var(--gt-text-secondary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: var(--gt-transition-fast);
}

.gt-action-btn:hover {
    border-color: var(--gt-gold);
    color: var(--gt-gold);
    background: var(--gt-bg-surface);
    transform: scale(1.05);
}

.gt-table-empty {
    text-align: center;
    padding: 48px 24px !important;
}

.gt-table-empty__icon {
    font-size: 2.2rem;
    color: var(--gt-success);
    margin-bottom: 12px;
}

.gt-table-empty h6 {
    font-weight: 700;
    color: var(--gt-text-primary);
    margin-bottom: 4px;
}

.gt-table-empty p {
    color: var(--gt-text-muted);
    font-size: 0.85rem;
    margin: 0;
}

/* ─── Attention Summary Cards (Right Column) ─── */
.gt-attention-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    padding: 36px 24px;
}

.gt-attention-card__icon {
    width: 64px;
    height: 64px;
    border-radius: 18px;
    margin: 0 auto 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
}

.gt-attention-card__icon--danger {
    background: rgba(239, 68, 68, 0.12);
    color: #EF4444;
}

.gt-attention-card__icon--warning {
    background: rgba(245, 166, 35, 0.12);
    color: #E09510;
}

.gt-attention-card__value {
    font-size: 2.5rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.03em;
    margin-bottom: 8px;
}

.gt-attention-card__title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--gt-text-primary);
    margin-bottom: 4px;
}

.gt-attention-card__desc {
    font-size: 0.8125rem;
    color: var(--gt-text-muted);
    margin-bottom: 0;
}

.gt-btn--danger-soft {
    background: rgba(239, 68, 68, 0.1) !important;
    color: #DC2626 !important;
    border: 1px solid rgba(239, 68, 68, 0.2) !important;
    font-weight: 600;
    font-size: 0.85rem;
    padding: 10px 16px;
    border-radius: var(--gt-radius-md);
    text-decoration: none;
    transition: var(--gt-transition-fast);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.gt-btn--danger-soft:hover {
    background: #EF4444 !important;
    color: #FFFFFF !important;
    border-color: #EF4444 !important;
    transform: translateY(-1px);
}

.gt-btn--warning-soft {
    background: rgba(245, 166, 35, 0.1) !important;
    color: #B45309 !important;
    border: 1px solid rgba(245, 166, 35, 0.25) !important;
    font-weight: 600;
    font-size: 0.85rem;
    padding: 10px 16px;
    border-radius: var(--gt-radius-md);
    text-decoration: none;
    transition: var(--gt-transition-fast);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.gt-btn--warning-soft:hover {
    background: var(--gt-gold) !important;
    color: #FFFFFF !important;
    border-color: var(--gt-gold) !important;
    transform: translateY(-1px);
}

/* ═══════════════════════════════════════════
   14. CONFIRMATION & LOGOUT MODALS
   ═══════════════════════════════════════════ */
.gt-modal-dialog {
    max-width: 410px;
    margin: 1.75rem auto;
}

.gt-modal-content {
    background: var(--gt-bg-card, #FFFFFF);
    border: 1px solid var(--gt-border, #E2E4EB);
    border-radius: 20px;
    box-shadow: 0 24px 48px -12px rgba(0, 0, 0, 0.18), 0 4px 16px rgba(0, 0, 0, 0.06);
    overflow: hidden;
    position: relative;
    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.gt-modal-accent {
    height: 4px;
    width: 100%;
    background: linear-gradient(90deg, var(--gt-gold, #F5A623) 0%, #E09510 35%, var(--gt-blue, #2E3192) 100%);
}

.gt-modal-body {
    padding: 30px 28px 28px;
    position: relative;
    text-align: center;
}

.gt-modal-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: none;
    background: var(--gt-bg-elevated, #F3F4F8);
    color: var(--gt-text-muted, #9CA3AF);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 0.8rem;
    transition: var(--gt-transition-fast);
    z-index: 2;
}

.gt-modal-close:hover {
    background: rgba(239, 68, 68, 0.12);
    color: var(--gt-danger, #EF4444);
    transform: rotate(90deg);
}

.gt-modal-icon-badge {
    position: relative;
    width: 68px;
    height: 68px;
    margin: 0 auto 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gt-modal-icon-badge__ring {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: rgba(239, 68, 68, 0.12);
    animation: gt-modal-pulse 2.2s infinite ease-in-out;
}

.gt-modal-icon-badge__inner {
    position: relative;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: rgba(239, 68, 68, 0.12);
    color: var(--gt-danger, #EF4444);
    border: 2px solid rgba(239, 68, 68, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.45rem;
    box-shadow: 0 4px 12px rgba(239, 68, 68, 0.12);
}

@keyframes gt-modal-pulse {

    0%,
    100% {
        transform: scale(1);
        opacity: 0.6;
    }

    50% {
        transform: scale(1.16);
        opacity: 0.15;
    }
}

.gt-modal-title {
    font-family: var(--gt-font-family);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--gt-text-primary, #111827);
    margin-bottom: 8px;
    letter-spacing: -0.01em;
}

.gt-modal-desc {
    font-family: var(--gt-font-family);
    font-size: 0.875rem;
    color: var(--gt-text-muted, #6B7280);
    line-height: 1.55;
    margin-bottom: 24px;
    padding: 0 6px;
}

.gt-modal-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: center;
}

.gt-modal-btn {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    font-family: var(--gt-font-family);
    font-size: 0.875rem;
    font-weight: 600;
    padding: 11px 18px;
    border-radius: 10px;
    transition: var(--gt-transition-fast);
    text-decoration: none;
    border: none;
    line-height: 1.4;
}

.gt-modal-btn--cancel {
    background: var(--gt-bg-elevated, #F3F4F8);
    color: var(--gt-text-secondary, #374151);
    border: 1px solid var(--gt-border, #E2E4EB);
}

.gt-modal-btn--cancel:hover {
    background: var(--gt-border, #E2E4EB);
    color: var(--gt-text-primary, #111827);
    border-color: var(--gt-border-light, #D1D5DB);
}

.gt-modal-btn--danger {
    background: linear-gradient(135deg, #EF4444 0%, #DC2626 100%);
    color: #FFFFFF !important;
    box-shadow: 0 4px 14px rgba(239, 68, 68, 0.35);
}

.gt-modal-btn--danger:hover {
    background: linear-gradient(135deg, #DC2626 0%, #B91C1C 100%);
    color: #FFFFFF !important;
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(239, 68, 68, 0.45);
}

.gt-modal-btn--danger:active {
    transform: translateY(0);
}

/* Dark Mode Overrides */
html.gt-dark .gt-modal-content {
    background: var(--gt-bg-card, #1A1E2E);
    border-color: var(--gt-border, #2A2F3F);
    box-shadow: 0 24px 48px -12px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(255, 255, 255, 0.04);
}

html.gt-dark .gt-modal-title {
    color: var(--gt-text-primary, #F0F0F5);
}

html.gt-dark .gt-modal-desc {
    color: var(--gt-text-muted, #9CA3AF);
}

html.gt-dark .gt-modal-close {
    background: var(--gt-bg-elevated, #222840);
    color: var(--gt-text-muted, #9CA3AF);
}

html.gt-dark .gt-modal-close:hover {
    background: rgba(239, 68, 68, 0.2);
    color: #F87171;
}

html.gt-dark .gt-modal-btn--cancel {
    background: var(--gt-bg-elevated, #222840);
    border-color: var(--gt-border, #2A2F3F);
    color: var(--gt-text-primary, #F0F0F5);
}

html.gt-dark .gt-modal-btn--cancel:hover {
    background: #2D3554;
    color: #FFFFFF;
    border-color: #3D4668;
}

/* ═══════════════════════════════════════════
   15. BREADCRUMBS, FOOTER & DATA TABLES
   ═══════════════════════════════════════════ */

/* ─── Breadcrumbs ─── */
.gt-breadcrumbs {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--gt-text-muted);
    margin-top: 4px;
    margin-bottom: 0;
    padding: 0;
    list-style: none;
}

.gt-breadcrumbs__item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--gt-text-muted);
}

.gt-breadcrumbs__link {
    color: var(--gt-text-muted);
    text-decoration: none;
    transition: var(--gt-transition-fast);
    display: inline-flex;
    align-items: center;
}

.gt-breadcrumbs__link:hover {
    color: var(--gt-gold);
}

.gt-breadcrumbs__separator {
    color: var(--gt-border-light);
    font-size: 0.6875rem;
    display: inline-flex;
    align-items: center;
}

.gt-breadcrumbs__item.active,
.gt-breadcrumbs__current {
    color: var(--gt-text-primary);
    font-weight: 600;
}

/* ─── Consistent Footer ─── */
.gt-footer {
    background: var(--gt-bg-surface) !important;
    border-top: 1px solid var(--gt-border) !important;
    padding: 18px 28px !important;
    margin-top: auto !important;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.02);
}

.gt-footer__copyright p {
    margin-bottom: 0;
    font-size: 0.8125rem;
    color: var(--gt-text-muted);
    font-family: var(--gt-font-family);
    text-align: center;
}

.gt-footer__copyright a {
    color: var(--gt-gold);
    font-weight: 600;
    text-decoration: none;
    transition: var(--gt-transition-fast);
}

.gt-footer__copyright a:hover {
    color: var(--gt-gold-hover);
    text-decoration: underline;
}

/* ─── Page Toolbar & Card Header ─── */
.gt-page-header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.gt-filter-card {
    background: var(--gt-bg-card);
    border: 1px solid var(--gt-border);
    border-radius: var(--gt-radius-lg);
    box-shadow: var(--gt-shadow-sm);
    padding: 20px 24px;
    margin-bottom: 24px;
    transition: var(--gt-transition);
}

.gt-filter-label {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--gt-text-secondary);
    margin-bottom: 6px;
    display: block;
}

.gt-input,
.gt-select {
    width: 100%;
    background-color: var(--gt-bg-input) !important;
    border: 1px solid var(--gt-border) !important;
    color: var(--gt-text-primary) !important;
    border-radius: 8px !important;
    font-size: 0.875rem !important;
    padding: 9px 14px !important;
    transition: var(--gt-transition-fast) !important;
}

.gt-input:focus,
.gt-select:focus {
    border-color: var(--gt-gold) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(245, 166, 35, 0.15) !important;
}

/* Status Badges */
.gt-badge-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: var(--gt-radius-pill);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.gt-badge-status--verified {
    background: rgba(34, 197, 94, 0.12);
    color: #16A34A;
    border: 1px solid rgba(34, 197, 94, 0.25);
}

.gt-badge-status--unverified {
    background: rgba(239, 68, 68, 0.12);
    color: #DC2626;
    border: 1px solid rgba(239, 68, 68, 0.25);
}

.gt-badge-status--active {
    background: rgba(34, 197, 94, 0.12);
    color: #16A34A;
    border: 1px solid rgba(34, 197, 94, 0.25);
}

.gt-badge-status--deactive {
    background: rgba(239, 68, 68, 0.12);
    color: #DC2626;
    border: 1px solid rgba(239, 68, 68, 0.25);
}

/* Quick Action Buttons in Table */
.gt-action-btn-group {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.gt-icon-btn {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
    border: 1px solid transparent;
    cursor: pointer;
    transition: var(--gt-transition-fast);
    text-decoration: none !important;
}

.gt-icon-btn--primary {
    background: rgba(46, 49, 146, 0.08);
    color: var(--gt-blue);
    border-color: rgba(46, 49, 146, 0.15);
}

.gt-icon-btn--primary:hover {
    background: var(--gt-blue);
    color: #FFFFFF;
    transform: translateY(-1px);
}

.gt-icon-btn--warning {
    background: rgba(245, 166, 35, 0.12);
    color: #B45309;
    border-color: rgba(245, 166, 35, 0.25);
}

.gt-icon-btn--warning:hover {
    background: var(--gt-gold);
    color: #FFFFFF;
    transform: translateY(-1px);
}

.gt-icon-btn--danger {
    background: rgba(239, 68, 68, 0.1);
    color: #DC2626;
    border-color: rgba(239, 68, 68, 0.2);
}

.gt-icon-btn--danger:hover {
    background: #DC2626;
    color: #FFFFFF;
    transform: translateY(-1px);
}

.gt-icon-btn--success {
    background: rgba(34, 197, 94, 0.1);
    color: #16A34A;
    border-color: rgba(34, 197, 94, 0.2);
}

.gt-icon-btn--success:hover {
    background: #16A34A;
    color: #FFFFFF;
    transform: translateY(-1px);
}

.gt-icon-btn--secondary {
    background: var(--gt-bg-elevated);
    color: var(--gt-text-secondary);
    border-color: var(--gt-border);
}

.gt-icon-btn--secondary:hover {
    background: var(--gt-border);
    color: var(--gt-text-primary);
    transform: translateY(-1px);
}

/* ═══════════════════════════════════════════
   16. DATATABLES & TABLE THEMING
   ═══════════════════════════════════════════ */
.dataTables_wrapper {
    font-family: var(--gt-font-family);
    color: var(--gt-text-secondary);
}

.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
    color: var(--gt-text-secondary) !important;
    font-size: 0.8125rem;
    padding: 12px 0;
}

.dataTables_wrapper .dataTables_length select {
    background: var(--gt-bg-input) !important;
    border: 1px solid var(--gt-border) !important;
    color: var(--gt-text-primary) !important;
    border-radius: var(--gt-radius-sm) !important;
    padding: 4px 10px !important;
    margin: 0 6px !important;
    font-size: 0.8125rem !important;
}

.dataTables_wrapper .dataTables_filter input {
    background: var(--gt-bg-input) !important;
    border: 1px solid var(--gt-border) !important;
    color: var(--gt-text-primary) !important;
    border-radius: var(--gt-radius-md) !important;
    padding: 6px 12px !important;
    margin-left: 8px !important;
    font-size: 0.8125rem !important;
    transition: var(--gt-transition-fast);
}

.dataTables_wrapper .dataTables_filter input:focus {
    border-color: var(--gt-gold) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(245, 166, 35, 0.15) !important;
}

table.dataTable {
    border-collapse: separate !important;
    border-spacing: 0 !important;
    width: 100% !important;
    border: 1px solid var(--gt-border) !important;
    border-radius: var(--gt-radius-md) !important;
    overflow: hidden;
    margin-top: 12px !important;
    margin-bottom: 16px !important;
}

table.dataTable thead th,
table.dataTable thead td {
    background: var(--gt-bg-elevated) !important;
    color: var(--gt-text-primary) !important;
    font-weight: 700 !important;
    font-size: 0.75rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    padding: 14px 16px !important;
    border-bottom: 2px solid var(--gt-border) !important;
    border-top: none !important;
    white-space: nowrap;
}

table.dataTable tbody tr {
    background-color: var(--gt-bg-card) !important;
    transition: var(--gt-transition-fast);
}

table.dataTable.display tbody tr.odd,
table.dataTable.stripe tbody tr.odd {
    background-color: var(--gt-bg-card) !important;
}

table.dataTable.display tbody tr.even,
table.dataTable.stripe tbody tr.even {
    background-color: rgba(0, 0, 0, 0.015) !important;
}

html.gt-dark table.dataTable.display tbody tr.even,
html.gt-dark table.dataTable.stripe tbody tr.even {
    background-color: rgba(255, 255, 255, 0.015) !important;
}

table.dataTable tbody tr:hover,
table.dataTable.display tbody tr:hover {
    background-color: rgba(245, 166, 35, 0.05) !important;
}

table.dataTable tbody td {
    padding: 14px 16px !important;
    border-bottom: 1px solid var(--gt-border) !important;
    border-top: none !important;
    color: var(--gt-text-primary) !important;
    font-size: 0.84rem !important;
    vertical-align: middle !important;
}

table.dataTable tfoot th,
table.dataTable tfoot td {
    background: var(--gt-bg-elevated) !important;
    border-top: 1px solid var(--gt-border) !important;
    color: var(--gt-text-primary) !important;
    font-weight: 600 !important;
    padding: 12px 16px !important;
}

/* Pagination */
.dataTables_wrapper .dataTables_paginate {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 6px !important;
    padding: 14px 0 !important;
    margin: 0 !important;
    float: right !important;
}

/* Reset the inner span wrapper generated by DataTables */
.dataTables_wrapper .dataTables_paginate span {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Unified styling for all page buttons (numbers, prev, next) */
.dataTables_wrapper .dataTables_paginate .paginate_button,
.dataTables_wrapper .dataTables_paginate span .paginate_button,
.dataTables_wrapper .dataTables_paginate .paginate_button.previous,
.dataTables_wrapper .dataTables_paginate .paginate_button.next {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 34px !important;
    height: 34px !important;
    padding: 0 10px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    border-radius: var(--gt-radius-sm) !important;
    border: 1px solid var(--gt-border) !important;
    background: var(--gt-bg-card) !important;
    color: var(--gt-text-primary) !important;
    font-family: var(--gt-font-family) !important;
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    text-align: center !important;
    cursor: pointer !important;
    user-select: none !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
    transition: all var(--gt-transition-fast) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button i,
.dataTables_wrapper .dataTables_paginate .paginate_button.previous i,
.dataTables_wrapper .dataTables_paginate .paginate_button.next i {
    font-size: 0.75rem !important;
    line-height: 1 !important;
    color: inherit !important;
}

/* Hover state */
.dataTables_wrapper .dataTables_paginate .paginate_button:hover:not(.disabled):not(.current),
.dataTables_wrapper .dataTables_paginate span .paginate_button:hover:not(.disabled):not(.current),
.dataTables_wrapper .dataTables_paginate .paginate_button.previous:hover:not(.disabled),
.dataTables_wrapper .dataTables_paginate .paginate_button.next:hover:not(.disabled) {
    background: var(--gt-bg-elevated) !important;
    color: var(--gt-gold) !important;
    border-color: var(--gt-gold) !important;
    box-shadow: 0 2px 6px rgba(245, 166, 35, 0.2) !important;
    transform: translateY(-1px) !important;
}

/* Active page button (.current) */
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
.dataTables_wrapper .dataTables_paginate span .paginate_button.current,
.dataTables_wrapper .dataTables_paginate span .paginate_button.current:hover {
    background: var(--gt-gold) !important;
    color: #FFFFFF !important;
    border-color: var(--gt-gold) !important;
    font-weight: 700 !important;
    box-shadow: 0 2px 8px rgba(245, 166, 35, 0.4) !important;
    cursor: default !important;
    transform: none !important;
}

/* Disabled state */
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:focus,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active,
.dataTables_wrapper .dataTables_paginate .paginate_button.previous.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.next.disabled {
    opacity: 0.3 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
    background: var(--gt-bg-card) !important;
    border-color: var(--gt-border) !important;
    color: var(--gt-text-muted) !important;
    box-shadow: none !important;
    transform: none !important;
}

/* Ellipsis */
.dataTables_wrapper .dataTables_paginate .ellipsis,
.dataTables_wrapper .dataTables_paginate span .ellipsis {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 28px !important;
    height: 34px !important;
    padding: 0 4px !important;
    margin: 0 !important;
    color: var(--gt-text-muted) !important;
    font-weight: 700 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    line-height: 1 !important;
}

/* Dark mode overrides for pagination */
html.gt-dark .dataTables_wrapper .dataTables_paginate .paginate_button,
html.gt-dark .dataTables_wrapper .dataTables_paginate span .paginate_button,
[data-theme-version="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button,
[data-theme-version="dark"] .dataTables_wrapper .dataTables_paginate span .paginate_button,
[data-theme-version="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.previous,
[data-theme-version="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.next {
    background: var(--gt-bg-card) !important;
    border-color: var(--gt-border) !important;
    color: var(--gt-text-primary) !important;
}

html.gt-dark .dataTables_wrapper .dataTables_paginate .paginate_button:hover:not(.disabled):not(.current),
html.gt-dark .dataTables_wrapper .dataTables_paginate span .paginate_button:hover:not(.disabled):not(.current),
[data-theme-version="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button:hover:not(.disabled):not(.current),
[data-theme-version="dark"] .dataTables_wrapper .dataTables_paginate span .paginate_button:hover:not(.disabled):not(.current),
[data-theme-version="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.previous:hover:not(.disabled),
[data-theme-version="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.next:hover:not(.disabled) {
    background: var(--gt-bg-elevated) !important;
    border-color: var(--gt-gold) !important;
    color: var(--gt-gold) !important;
}

html.gt-dark .dataTables_wrapper .dataTables_paginate .paginate_button.current,
[data-theme-version="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current,
[data-theme-version="dark"] .dataTables_wrapper .dataTables_paginate span .paginate_button.current {
    background: var(--gt-gold) !important;
    border-color: var(--gt-gold) !important;
    color: #FFFFFF !important;
}

html.gt-dark .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
[data-theme-version="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
[data-theme-version="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.previous.disabled,
[data-theme-version="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.next.disabled {
    background: var(--gt-bg-card) !important;
    border-color: var(--gt-border) !important;
    color: var(--gt-text-muted) !important;
    opacity: 0.25 !important;
}

@media (max-width: 768px) {
    .dataTables_wrapper .dataTables_info,
    .dataTables_wrapper .dataTables_paginate {
        float: none !important;
        text-align: center !important;
        justify-content: center !important;
        display: flex !important;
        width: 100% !important;
        padding: 8px 0 !important;
    }
}

/* Standard Bootstrap Pagination fallback */
.pagination {
    display: inline-flex;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.pagination .page-item .page-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 34px;
    padding: 0 10px;
    border-radius: var(--gt-radius-sm) !important;
    border: 1px solid var(--gt-border) !important;
    background: var(--gt-bg-card) !important;
    color: var(--gt-text-primary) !important;
    font-size: 0.8125rem;
    font-weight: 600;
    text-decoration: none;
    transition: all var(--gt-transition-fast);
}

.pagination .page-item.active .page-link {
    background: var(--gt-gold) !important;
    border-color: var(--gt-gold) !important;
    color: #FFFFFF !important;
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(245, 166, 35, 0.4);
}

.pagination .page-item:hover:not(.active):not(.disabled) .page-link {
    background: var(--gt-bg-elevated) !important;
    border-color: var(--gt-gold) !important;
    color: var(--gt-gold) !important;
    transform: translateY(-1px);
}

.pagination .page-item.disabled .page-link {
    opacity: 0.3 !important;
    cursor: not-allowed;
    pointer-events: none;
}


/* Badge Enhancements */
.badge.light {
    font-weight: 600;
    padding: 5px 12px;
    border-radius: var(--gt-radius-pill);
    font-size: 0.75rem;
    letter-spacing: 0.02em;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.badge.light.badge-success {
    background-color: rgba(34, 197, 94, 0.12) !important;
    color: #16A34A !important;
    border: 1px solid rgba(34, 197, 94, 0.25) !important;
}

.badge.light.badge-danger {
    background-color: rgba(239, 68, 68, 0.12) !important;
    color: #DC2626 !important;
    border: 1px solid rgba(239, 68, 68, 0.25) !important;
}

.badge.light.badge-warning {
    background-color: rgba(245, 166, 35, 0.14) !important;
    color: #D97706 !important;
    border: 1px solid rgba(245, 166, 35, 0.3) !important;
}

.badge.light.badge-info {
    background-color: rgba(59, 130, 246, 0.12) !important;
    color: #2563EB !important;
    border: 1px solid rgba(59, 130, 246, 0.25) !important;
}

.badge.light.badge-primary {
    background-color: rgba(46, 49, 146, 0.12) !important;
    color: var(--gt-blue) !important;
    border: 1px solid rgba(46, 49, 146, 0.25) !important;
}

html.gt-dark .badge.light.badge-primary {
    color: #818CF8 !important;
}

/* Sharp Action Buttons */
.btn-xs.sharp {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 8px !important;
    font-size: 0.8125rem !important;
    box-shadow: none !important;
    margin: 0 2px !important;
    transition: var(--gt-transition-fast) !important;
}

.btn-xs.sharp:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12) !important;
}

/* Specific Sharp Button Palettes */
.btn-warning.sharp {
    background: rgba(245, 166, 35, 0.14) !important;
    color: #B45309 !important;
    border: 1px solid rgba(245, 166, 35, 0.25) !important;
}
.btn-warning.sharp:hover {
    background: var(--gt-gold) !important;
    color: #FFFFFF !important;
}

.btn-dark.sharp {
    background: rgba(46, 49, 146, 0.08) !important;
    color: var(--gt-blue) !important;
    border: 1px solid rgba(46, 49, 146, 0.15) !important;
}
html.gt-dark .btn-dark.sharp {
    background: rgba(255, 255, 255, 0.08) !important;
    color: #FFFFFF !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}
.btn-dark.sharp:hover {
    background: var(--gt-blue) !important;
    color: #FFFFFF !important;
}

.btn-secondary.sharp {
    background: var(--gt-bg-elevated) !important;
    color: var(--gt-text-secondary) !important;
    border: 1px solid var(--gt-border) !important;
}
.btn-secondary.sharp:hover {
    background: var(--gt-border) !important;
    color: var(--gt-text-primary) !important;
}

.btn-danger.sharp {
    background: rgba(239, 68, 68, 0.1) !important;
    color: #DC2626 !important;
    border: 1px solid rgba(239, 68, 68, 0.2) !important;
}
.btn-danger.sharp:hover {
    background: #DC2626 !important;
    color: #FFFFFF !important;
}

.btn-success.sharp {
    background: rgba(34, 197, 94, 0.1) !important;
    color: #16A34A !important;
    border: 1px solid rgba(34, 197, 94, 0.2) !important;
}
.btn-success.sharp:hover {
    background: #16A34A !important;
    color: #FFFFFF !important;
}

/* ═══════════════════════════════════════════
   17. DRIVER PROFILE & STAT CARDS
   ═══════════════════════════════════════════ */
.gt-stat-card {
    background: var(--gt-bg-card);
    border: 1px solid var(--gt-border);
    border-radius: var(--gt-radius-lg);
    padding: 20px;
    box-shadow: var(--gt-shadow-sm);
    position: relative;
    overflow: hidden;
    transition: var(--gt-transition);
}

.gt-stat-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--gt-shadow-md);
    border-color: var(--gt-gold-light);
}

.gt-stat-card__accent-bar {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--gt-gold);
}

.gt-stat-card__accent-bar--blue {
    background: var(--gt-blue);
}

.gt-stat-card__accent-bar--danger {
    background: #DC2626;
}

.gt-stat-card__accent-bar--success {
    background: #16A34A;
}

.gt-stat-card__label {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--gt-text-muted);
    margin-bottom: 8px;
}

.gt-stat-card__value {
    font-size: 1.45rem;
    font-weight: 800;
    color: var(--gt-text-primary);
    margin-bottom: 0;
    font-family: var(--gt-font-family);
}

.gt-stat-card__value--danger {
    color: #DC2626;
}

.gt-stat-card__value--success {
    color: #16A34A;
}

/* Profile summary card */
.gt-profile-card {
    background: var(--gt-bg-card);
    border: 1px solid var(--gt-border);
    border-radius: var(--gt-radius-lg);
    box-shadow: var(--gt-shadow-sm);
    overflow: hidden;
    margin-bottom: 24px;
}

.gt-profile-card__header {
    background: linear-gradient(135deg, rgba(46, 49, 146, 0.06) 0%, rgba(245, 166, 35, 0.06) 100%);
    border-bottom: 1px solid var(--gt-border);
    padding: 24px;
}

.gt-profile-avatar {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--gt-gold);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.gt-profile-avatar-placeholder {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: rgba(245, 166, 35, 0.12);
    color: var(--gt-gold);
    border: 3px solid var(--gt-gold);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.2rem;
}

/* Action button bar in profile */
.gt-profile-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.gt-profile-action-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 18px;
    border-radius: var(--gt-radius-md);
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none !important;
    border: 1px solid transparent;
    transition: var(--gt-transition-fast);
}

.gt-profile-action-btn--verify {
    background: #16A34A;
    color: #FFFFFF !important;
    box-shadow: 0 2px 8px rgba(22, 163, 74, 0.25);
}

.gt-profile-action-btn--verify:hover {
    background: #15803D;
    color: #FFFFFF !important;
    transform: translateY(-1px);
}

.gt-profile-action-btn--trips {
    background: rgba(46, 49, 146, 0.08);
    color: var(--gt-blue) !important;
    border-color: rgba(46, 49, 146, 0.2);
}

.gt-profile-action-btn--trips:hover {
    background: var(--gt-blue);
    color: #FFFFFF !important;
    transform: translateY(-1px);
}

.gt-profile-action-btn--commissions {
    background: rgba(245, 166, 35, 0.12);
    color: #B45309 !important;
    border-color: rgba(245, 166, 35, 0.25);
}

.gt-profile-action-btn--commissions:hover {
    background: var(--gt-gold);
    color: #FFFFFF !important;
    transform: translateY(-1px);
}

.gt-profile-action-btn--transfers {
    background: rgba(14, 165, 233, 0.1);
    color: #0284C7 !important;
    border-color: rgba(14, 165, 233, 0.25);
}

.gt-profile-action-btn--transfers:hover {
    background: #0284C7;
    color: #FFFFFF !important;
    transform: translateY(-1px);
}

/* Info List Items */
.gt-info-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.gt-info-list__item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid var(--gt-border);
    font-size: 0.85rem;
}

.gt-info-list__item:last-child {
    border-bottom: none;
}

.gt-info-list__label {
    color: var(--gt-text-muted);
    font-weight: 500;
}

.gt-info-list__value {
    color: var(--gt-text-primary);
    font-weight: 600;
}

/* Document & Vehicle Cards */
.gt-item-card {
    background: var(--gt-bg-card);
    border: 1px solid var(--gt-border);
    border-radius: var(--gt-radius-md);
    padding: 16px;
    margin-bottom: 16px;
    transition: var(--gt-transition);
}

.gt-item-card:hover {
    border-color: var(--gt-gold);
    box-shadow: var(--gt-shadow-sm);
}