/* ============================================================
   UnityHub / AdminKit – Minimal Light/Dark Theme + Tables
   - Keeps only theme + table styling needed for consistency
   - Light is default (no data-theme required)
   - Dark overrides via [data-theme="dark"]
   - Fixes DataTables/Bootstrap striping with RowGroup
   - Neutral (non-brand-heavy) group header styling
   ============================================================ */

/* --------------------------
   Theme variables (LIGHT)
   -------------------------- */
:root {
    /* Base app colors */
    --bs-body-bg: #f8f9fa;
    --bs-body-color: #1b3c4d;
    /* Sidebar (optional: used if your layout relies on these vars) */
    --bs-sidebar-bg: #f8f9fa;
    --bs-sidebar-link-color: #1b3c4d;
    --bs-sidebar-link-hover-color: rgba(0, 0, 0, 0.60);
    --bs-sidebar-link-active-color: #1b3c4d;
    /* Card */
    --bs-card-bg: #ffffff;
    --bs-card-border-color: rgba(0, 0, 0, 0.10);
    /* DataTables / Table rows */
    --dt-row-bg: #ffffff;
    --dt-row-bg-alt: rgba(0, 0, 0, 0.03);
    --dt-row-hover: rgba(0, 0, 0, 0.05);
    --dt-border-color: rgba(0, 0, 0, 0.08);
    /* RowGroup header (neutral, not brand-heavy) */
    --dt-group-bg: rgba(0, 0, 0, 0.06);
    --dt-group-border: rgba(0, 0, 0, 0.12);
    --dt-group-text: inherit;
    --dt-group-accent: rgba(0, 0, 0, 0.25);
}

/* --------------------------
   Theme variables (DARK)
   -------------------------- */
[data-theme="dark"] {
    --bs-body-bg: #121212;
    --bs-body-color: #e0e0e0;
    --bs-sidebar-bg: #1b3c4d;
    --bs-sidebar-link-color: #e0e0e0;
    --bs-sidebar-link-hover-color: rgba(255, 255, 255, 0.80);
    --bs-sidebar-link-active-color: #ffffff;
    --bs-card-bg: #1e1e1e;
    --bs-card-border-color: rgba(255, 255, 255, 0.12);
    --dt-row-bg: #1b232b;
    --dt-row-bg-alt: #242e33;
    --dt-row-hover: rgba(255, 255, 255, 0.10);
    --dt-border-color: rgba(255, 255, 255, 0.10);
    --dt-group-bg: rgba(255, 255, 255, 0.10);
    --dt-group-border: rgba(255, 255, 255, 0.16);
    --dt-group-text: #e9ecef;
    --dt-group-accent: rgba(255, 255, 255, 0.28);
}

/* --------------------------
   Apply theme to page
   -------------------------- */
body {
    background-color: var(--bs-body-bg) !important;
    color: var(--bs-body-color) !important;
}

/* Optional: keep these if you want sidebar to react to theme vars */
.sidebar {
    background-color: var(--bs-sidebar-bg) !important;
}

.sidebar-link {
    color: var(--bs-sidebar-link-color) !important;
}

    .sidebar-link:hover {
        color: var(--bs-sidebar-link-hover-color) !important;
    }

    .sidebar-link.active {
        color: var(--bs-sidebar-link-active-color) !important;
    }

/* --------------------------
   Tables (Bootstrap + DataTables)
   - Works for light default and dark
   - Fixes RowGroup affecting stripe alternation
   -------------------------- */

/* Table head: keep clean and readable */
table.table thead th,
table.table thead td,
table.dataTable thead th,
table.dataTable thead td {
    /* You can change this to match AdminKit header style if you want */
    background-color: #cfcfcf !important;
    color: #615e60 !important;
}

[data-theme="dark"] table.table thead th,
[data-theme="dark"] table.table thead td,
[data-theme="dark"] table.dataTable thead th,
[data-theme="dark"] table.dataTable thead td {
    background-color: rgba(255, 255, 255, 0.08) !important;
    color: #ffffff !important;
}

/* Base table + row background */
table.table {
    background-color: var(--dt-row-bg) !important;
}

    table.table tbody tr > * {
        background-color: var(--dt-row-bg) !important;
        border-color: var(--dt-border-color) !important;
    }

    /* Stripes for data rows ONLY (exclude RowGroup header rows) */
    table.table.table-striped > tbody > tr:not(.dt-group-header):not(.dtrg-group):not(.dtrg-start):nth-of-type(odd) > * {
        background-color: var(--dt-row-bg-alt) !important;
    }

    /* Hover for data rows ONLY (exclude RowGroup header rows) */
    table.table.table-hover > tbody > tr:not(.dt-group-header):not(.dtrg-group):not(.dtrg-start):hover > *,
    table.dataTable.hover > tbody > tr:not(.dt-group-header):not(.dtrg-group):not(.dtrg-start):hover > * {
        background-color: var(--dt-row-hover) !important;
        cursor: pointer;
    }

/* --------------------------
   RowGroup header styling (neutral)
   -------------------------- */
tr.dt-group-header td,
tr.dtrg-group td,
tr.dtrg-start td {
    background-color: var(--dt-group-bg) !important;
    color: var(--dt-group-text) !important;
    border-top: 1px solid var(--dt-group-border) !important;
    border-bottom: 1px solid var(--dt-group-border) !important;
    border-left: 4px solid var(--dt-group-accent) !important;
    font-weight: 600;
    padding: 0.6rem 0.75rem;
}

/* Ensure hover never changes group header color */
tr.dt-group-header:hover td,
tr.dtrg-group:hover td,
tr.dtrg-start:hover td {
    background-color: var(--dt-group-bg) !important;
}


/* --------------------------
   DataTables controls (dropdown text color)
   -------------------------- */
.dt-length select.dt-input,
.dt-length select.dt-input option {
    color: #333 !important;
    background-color: #fff !important;
}

[data-theme="dark"] .dt-length select.dt-input,
[data-theme="dark"] .dt-length select.dt-input option {
    color: #fff !important;
    background-color: #333 !important;
}

[data-theme="dark"] .nav-tabs .nav-item.show .nav-link,
[data-theme="dark"] .nav-tabs .nav-link.active {
    background-color: var(--bs-nav-link-color);
}

[data-theme="light"] .nav-tabs .nav-item.show .nav-link,
[data-theme="light"] .nav-tabs .nav-link.active {
    background-color: var(--bs-nav-link-color);
}
[data-theme="dark"] .tab-toolbar {
    background: var(--bs-secondary-bg);
}
/* ===== UnityHub Toast Layout Upgrade ===== */

.iziToast {
    border-radius: 8px;
    padding: 16px 18px !important;
}

/* Stack content vertically */
.iziToast-body {
    display: flex !important;
    flex-direction: column !important;
}

/* Title = header style */
.iziToast-title {
    font-weight: 600 !important;
    font-size: 0.95rem !important;
    margin-bottom: 4px !important;
}

/* Message = body style */
.iziToast-message {
    font-size: 0.85rem !important;
    opacity: 0.95;
}

/* Optional: slightly wider */
.iziToast {
    width: min(520px, 92vw) !important;
}
/*.iziToast-icon {
    margin-top: 3px !important;
}*/