/* =============================================================
   THEME: Light Indigo Modern
   File:  themes/light-indigo.css
   Usage: Applied automatically when data-theme="light" data-theme-color="indigo"
   ============================================================= */

:root,
[data-theme="light"][data-theme-color="indigo"],
[data-theme-color="indigo"] {
    /* Primary Palette */
    --primary:             #4f46e5;
    --primary-rgb:         79, 70, 229;
    --primary-strong:      #4338ca;
    --primary-soft:        #eef2ff;
    --primary-glow:        rgba(79, 70, 229, 0.20);
    --primary-border:      rgba(79, 70, 229, 0.28);
    --sidebar-accent:      #818cf8;

    /* Page & Surface Backgrounds */
    --bg:                  #f8fafc;
    --bg-gradient:
        radial-gradient(ellipse at 15% 5%,  rgba(79, 70, 229, 0.06), transparent 40%),
        radial-gradient(ellipse at 85% 80%, rgba(20, 184, 166, 0.04), transparent 35%),
        linear-gradient(180deg, #f8fafc 0%, #f0f4ff 100%);
    --surface:             #ffffff;
    --surface-alt:         #f8fafc;
    --surface-hover:       #f1f5f9;
    --surface-elevated:    #ffffff;
    --card-bg:             #ffffff;
    --card-border:         rgba(148, 163, 184, 0.18);

    /* Topbar & Sidebar */
    --topbar-bg:           rgba(255, 255, 255, 0.90);
    --topbar-border:       rgba(148, 163, 184, 0.16);
    --sidebar-bg:          #ffffff;
    --sidebar-bg-2:        #f8fafc;

    /* Overlays */
    --modal-bg:            #ffffff;
    --dropdown-bg:         #ffffff;

    /* Inputs */
    --input-bg:            #ffffff;
    --input-border:        #cbd5e1;
    --input-placeholder:   #94a3b8;
    --input-focus-border:  #4f46e5;

    /* Tables */
    --table-header-bg:     #f8fafc;
    --table-hover-bg:      rgba(79, 70, 229, 0.03);

    /* Typography */
    --text:                #0f172a;
    --text-heading:        #0f172a;
    --text-soft:           #334155;
    --muted:               #64748b;
    --text-disabled:       #94a3b8;

    /* Borders & Dividers */
    --border:              rgba(148, 163, 184, 0.22);
    --border-subtle:       rgba(148, 163, 184, 0.14);
    --divider:             rgba(148, 163, 184, 0.18);

    /* Semantic Soft Colors */
    --primary-soft:        #eef2ff;
    --secondary-soft:      #ccfbf1;
    --amber-soft:          #fef3c7;
    --danger-soft:         #fee2e2;
    --success-soft:        #dcfce7;
    --info-soft:           #e0f2fe;

    /* Shadows */
    --shadow-card:         0 2px 8px rgba(15, 23, 42, 0.04), 0 1px 3px rgba(15, 23, 42, 0.02);
    --shadow-card-hover:   0 10px 25px -3px rgba(15, 23, 42, 0.08), 0 4px 6px -2px rgba(15, 23, 42, 0.04);
    --shadow-dropdown:     0 16px 36px -4px rgba(15, 23, 42, 0.12), 0 6px 12px -2px rgba(15, 23, 42, 0.06);
    --shadow-soft:         0 18px 40px rgba(15, 23, 42, 0.06);
    --shadow-hover:        0 10px 30px rgba(15, 23, 42, 0.12);
    --focus-ring:          0 0 0 3px rgba(79, 70, 229, 0.20);

    /* Buttons */
    --btn-disabled-bg:     #e2e8f0;
    --btn-disabled-text:   #94a3b8;
    --btn-disabled-border: #e2e8f0;

    /* Icons */
    --icon-default:        #64748b;
    --icon-active:         #4f46e5;
    --icon-hover:          #0f172a;
    --icon-disabled:       #cbd5e1;

    /* Links */
    --link-color:          #4f46e5;
    --link-hover:          #4338ca;

    /* Brand */
    --brand-primary:       #4f46e5;
    --brand-gradient:      linear-gradient(135deg, #4f46e5, #4338ca);
    --primary-dark:        #4338ca;

    /* Aliases */
    --page:                var(--bg);
    --line:                var(--border);
    --ink:                 var(--text);
    --soft-text:           var(--text-soft);
    --text-main:           var(--text);
    --text-muted:          var(--muted);
    --border-color:        var(--border);
    --green:               var(--success);
    --surface-card:        #ffffff;
}

/* ---- Light Indigo Modern: Nav-Tabs Active ---- */
[data-theme-color="indigo"] .nav-tabs .nav-link.active {
    color: #4f46e5 !important;
    border-bottom-color: #4f46e5 !important;
}

/* ---- Light Indigo Modern: Pagination Active ---- */
[data-theme-color="indigo"] .page-item.active .page-link,
[data-theme-color="indigo"] .dataTables_wrapper .dataTables_paginate .paginate_button.current,
[data-theme-color="indigo"] .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: linear-gradient(135deg, #4f46e5 0%, #4338ca 100%) !important;
    border-color: #4f46e5 !important;
    color: #ffffff !important;
}

/* ---- Light Indigo Modern: Table Row Hover ---- */
[data-theme-color="indigo"] .table tbody tr:hover {
    background: rgba(79, 70, 229, 0.03);
}

/* ---- Light Indigo Modern: Buttons ---- */
[data-theme-color="indigo"] .btn-primary {
    background: linear-gradient(135deg, #4f46e5, #4338ca) !important;
    border-color: #4f46e5 !important;
}

[data-theme-color="indigo"] .btn-primary:hover {
    background: linear-gradient(135deg, #4338ca, #4f46e5) !important;
}

[data-theme-color="indigo"] .btn-outline-primary {
    color: #4f46e5 !important;
    border-color: #4f46e5 !important;
}

[data-theme-color="indigo"] .btn-outline-primary:hover {
    background: #4f46e5 !important;
    color: #ffffff !important;
}

/* ---- Light Indigo Modern: Sidebar Active Link ---- */
[data-theme-color="indigo"] .sidebar .nav-link.active {
    color: #ffffff !important;
}

[data-theme-color="indigo"] .sidebar .nav-link.active::before {
    background: #818cf8 !important;
}

/* ---- Light Indigo Modern: Chat Messages Scroll ---- */
[data-theme-color="indigo"] .chat-messages-scroll {
    background: var(--surface-alt, #f8fafc);
}