/* AXIS UI color themes — CSS variables only (no extra assets) */

:root,
html[data-ui-theme="default"] {
    --primary: var(--axis-primary-light);
    --accent: var(--axis-accent);
    --axis-btn-primary-top: #2563eb;
    --axis-btn-primary-bottom: #1d4ed8;
    --axis-btn-primary-border: #1e40af;
    --axis-btn-primary-shadow: rgba(29, 78, 216, 0.25);
    --axis-table-hover: #eff6ff;
    --axis-table-stripe: #fafbfc;
    --axis-table-head: #f8fafc;
    --axis-table-foot: #f1f5f9;
    --axis-focus-ring: rgba(29, 78, 216, 0.35);
}

html[data-ui-theme="ocean"] {
    --axis-primary-light: #0f766e;
    --axis-primary-hover: #115e59;
    --axis-accent: #f0fdfa;
    --axis-sidebar-active: #0d9488;
    --axis-bg: #f3f8f8;
    --axis-border: #dbe8e8;
    --primary: var(--axis-primary-light);
    --accent: var(--axis-accent);
    --axis-btn-primary-top: #0d9488;
    --axis-btn-primary-bottom: #0f766e;
    --axis-btn-primary-border: #115e59;
    --axis-btn-primary-shadow: rgba(15, 118, 110, 0.28);
    --axis-table-hover: #ecfdf5;
    --axis-table-stripe: #f8fcfb;
    --axis-table-head: #f0f9f8;
    --axis-table-foot: #e6f4f1;
    --axis-focus-ring: rgba(15, 118, 110, 0.35);
    --bs-primary: #0f766e;
    --bs-primary-rgb: 15, 118, 110;
}

html[data-ui-theme="forest"] {
    --axis-primary-light: #047857;
    --axis-primary-hover: #065f46;
    --axis-accent: #ecfdf5;
    --axis-sidebar-active: #059669;
    --axis-bg: #f6f9f6;
    --axis-border: #dce8df;
    --primary: var(--axis-primary-light);
    --accent: var(--axis-accent);
    --axis-btn-primary-top: #059669;
    --axis-btn-primary-bottom: #047857;
    --axis-btn-primary-border: #065f46;
    --axis-btn-primary-shadow: rgba(4, 120, 87, 0.28);
    --axis-table-hover: #ecfdf5;
    --axis-table-stripe: #f9fbf9;
    --axis-table-head: #f3faf5;
    --axis-table-foot: #e8f3ec;
    --axis-focus-ring: rgba(4, 120, 87, 0.35);
    --bs-primary: #047857;
    --bs-primary-rgb: 4, 120, 87;
}

html[data-ui-theme="indigo"] {
    --axis-primary-light: #4f46e5;
    --axis-primary-hover: #4338ca;
    --axis-accent: #eef2ff;
    --axis-sidebar-active: #6366f1;
    --axis-bg: #f7f7fb;
    --axis-border: #e2e4f0;
    --primary: var(--axis-primary-light);
    --accent: var(--axis-accent);
    --axis-btn-primary-top: #6366f1;
    --axis-btn-primary-bottom: #4f46e5;
    --axis-btn-primary-border: #4338ca;
    --axis-btn-primary-shadow: rgba(79, 70, 229, 0.28);
    --axis-table-hover: #eef2ff;
    --axis-table-stripe: #fafafe;
    --axis-table-head: #f5f6ff;
    --axis-table-foot: #eceef8;
    --axis-focus-ring: rgba(79, 70, 229, 0.35);
    --bs-primary: #4f46e5;
    --bs-primary-rgb: 79, 70, 229;
}

html[data-ui-theme="amber"] {
    --axis-primary-light: #b45309;
    --axis-primary-hover: #92400e;
    --axis-accent: #fffbeb;
    --axis-sidebar-active: #d97706;
    --axis-bg: #faf8f5;
    --axis-border: #e8e0d4;
    --primary: var(--axis-primary-light);
    --accent: var(--axis-accent);
    --axis-btn-primary-top: #d97706;
    --axis-btn-primary-bottom: #b45309;
    --axis-btn-primary-border: #92400e;
    --axis-btn-primary-shadow: rgba(180, 83, 9, 0.28);
    --axis-table-hover: #fffbeb;
    --axis-table-stripe: #fdfbf7;
    --axis-table-head: #fef9ef;
    --axis-table-foot: #f5efe4;
    --axis-focus-ring: rgba(180, 83, 9, 0.35);
    --bs-primary: #b45309;
    --bs-primary-rgb: 180, 83, 9;
}

html[data-ui-theme="rose"] {
    --axis-primary-light: #be123c;
    --axis-primary-hover: #9f1239;
    --axis-accent: #fff1f2;
    --axis-sidebar-active: #e11d48;
    --axis-bg: #fdf8f9;
    --axis-border: #ead6da;
    --primary: var(--axis-primary-light);
    --accent: var(--axis-accent);
    --axis-btn-primary-top: #e11d48;
    --axis-btn-primary-bottom: #be123c;
    --axis-btn-primary-border: #9f1239;
    --axis-btn-primary-shadow: rgba(190, 18, 60, 0.28);
    --axis-table-hover: #fff1f2;
    --axis-table-stripe: #fefafb;
    --axis-table-head: #fef2f4;
    --axis-table-foot: #fae8ec;
    --axis-focus-ring: rgba(190, 18, 60, 0.35);
    --bs-primary: #be123c;
    --bs-primary-rgb: 190, 18, 60;
}

html[data-ui-theme="steel"] {
    --axis-primary-light: #0369a1;
    --axis-primary-hover: #075985;
    --axis-accent: #f0f9ff;
    --axis-sidebar-active: #0284c7;
    --axis-bg: #f4f7fa;
    --axis-border: #d5dee8;
    --primary: var(--axis-primary-light);
    --accent: var(--axis-accent);
    --axis-btn-primary-top: #0284c7;
    --axis-btn-primary-bottom: #0369a1;
    --axis-btn-primary-border: #075985;
    --axis-btn-primary-shadow: rgba(3, 105, 161, 0.28);
    --axis-table-hover: #f0f9ff;
    --axis-table-stripe: #f8fafc;
    --axis-table-head: #eef6fc;
    --axis-table-foot: #e3edf5;
    --axis-focus-ring: rgba(3, 105, 161, 0.35);
    --bs-primary: #0369a1;
    --bs-primary-rgb: 3, 105, 161;
}

/* Polish-layer overrides driven by theme tokens */
.table-hover tbody tr:hover {
    background: var(--axis-table-hover);
}
.table-striped > tbody > tr:nth-of-type(odd) > * {
    background: var(--axis-table-stripe);
}
.table thead th {
    background: var(--axis-table-head);
}
.table tfoot td,
.table tr.row-total td {
    background: var(--axis-table-foot);
}
.btn-primary {
    background: linear-gradient(
        180deg,
        var(--axis-btn-primary-top) 0%,
        var(--axis-btn-primary-bottom) 100%
    );
    border-color: var(--axis-btn-primary-border);
    box-shadow: 0 1px 2px var(--axis-btn-primary-shadow);
}
.btn-primary:hover,
.btn-primary:focus {
    background: linear-gradient(
        180deg,
        var(--axis-btn-primary-bottom) 0%,
        var(--axis-btn-primary-border) 100%
    );
    border-color: var(--axis-btn-primary-border);
}
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
.form-control:focus-visible,
.form-select:focus-visible,
[tabindex]:focus-visible {
    outline-color: var(--axis-focus-ring);
}

/* Change Theme modal — one theme per row */
.profile-theme-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.profile-theme-option {
    position: relative;
    display: block;
    margin: 0;
    cursor: pointer;
}
.profile-theme-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.profile-theme-card {
    border: 1px solid var(--axis-border);
    border-radius: 10px;
    padding: 10px 14px;
    background: var(--axis-surface);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.profile-theme-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.profile-theme-option input:checked + .profile-theme-card {
    border-color: var(--axis-primary-light);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--axis-primary-light) 22%, transparent);
}
.profile-theme-swatch {
    display: flex;
    gap: 5px;
    flex-shrink: 0;
}
.profile-theme-swatch span {
    width: 22px;
    height: 22px;
    border-radius: 6px;
    border: 1px solid rgba(15, 23, 42, 0.08);
}
.profile-theme-name {
    font-size: 13px;
    font-weight: 600;
    color: var(--axis-text);
    line-height: 1.3;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}
.profile-theme-default-badge {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
    padding: 2px 6px;
    border-radius: 4px;
    background: var(--axis-bg);
    border: 1px solid var(--axis-border);
}