﻿/*
 * Dynamic brand overrides — generated from settings.
 * Primary: #deba49  |  Dark: #1c1c1c  |  Accent: #303030
 */

/* ── CSS Variables ───────────────────────────────────────────────────────── */
:root {
    --color-primary:             #deba49;
    --color-primary-dark:        #c3a340;
    --color-primary-transparent: rgba(222,186,73,0.15);
    --bg-surface-dark:           #1c1c1c;
    --bg-surface:                #161616;
    --bg-surface-alt:            #303030;
    --border-color:              #303030;
}

/* ── Body / page background ──────────────────────────────────────────────── */
body,
.admin-layout,
.portal-layout {
    background-color: #1c1c1c;
}

/* ── Auth layout ─────────────────────────────────────────────────────────── */
.auth-layout {
    background: #1c1c1c;
}
.auth-layout::before {
    background: #deba49;
}
.auth-card {
    background: #161616;
}
.auth-logo__icon {
    background: #deba49;
    box-shadow: 0 0 0 8px rgba(222,186,73,0.1);
}

/* ── Sidebar ─────────────────────────────────────────────────────────────── */
.sidebar {
    background: #161616;
}
.sidebar__brand-icon {
    background: #deba49;
}
.sidebar__link:hover {
    background: #303030;
}
.sidebar__link.is-active {
    background: rgba(222,186,73,0.12);
    color: #deba49;
}
.sidebar__link.is-active::before {
    background: #deba49;
}
.sidebar__link .badge {
    background: #deba49;
}

/* ── Topbar ──────────────────────────────────────────────────────────────── */
.topbar {
    background: #161616;
}
.topbar__icon-btn:hover {
    background: #303030;
}
.topbar__badge {
    background: #deba49;
}

/* ── Buttons — primary ───────────────────────────────────────────────────── */
.btn--primary {
    background-color: #deba49;
}
.btn--primary:hover:not(:disabled) {
    background-color: #c3a340;
}
.btn--primary:focus:not(:disabled),
.btn--secondary:focus:not(:disabled) {
    box-shadow: 0 0 0 3px rgba(222,186,73,0.1);
}

/* ── Forms ───────────────────────────────────────────────────────────────── */
.form-label .required {
    color: #deba49;
}
.form-input:focus,
.form-select:focus,
.form-textarea:focus,
.search-bar input:focus {
    border-color: #deba49;
    box-shadow: 0 0 0 3px rgba(222,186,73,0.1);
}
.form-check__input {
    accent-color: #deba49;
}
.form-toggle__input:checked ~ .form-toggle__track {
    background: #deba49;
}

/* ── Cards ───────────────────────────────────────────────────────────────── */
.card,
.card--elevated,
.card--bordered {
    background-color: #161616;
}
.card__title i {
    color: #deba49;
}

/* ── Stat cards ──────────────────────────────────────────────────────────── */
.stat-card {
    background-color: #161616;
}
.stat-card__icon--primary {
    background: rgba(222,186,73,0.12);
    color: #deba49;
}

/* ── Tables ──────────────────────────────────────────────────────────────── */
.table thead {
    background: #303030;
}
.table thead th.sortable.asc,
.table thead th.sortable.desc {
    color: #deba49;
}
.table tbody tr.is-selected {
    background: rgba(222,186,73,0.08);
}

/* ── Badges ──────────────────────────────────────────────────────────────── */
.badge--primary,
.status-badge--shortlisted {
    background: rgba(222,186,73,0.15);
    color: #deba49;
}
.role-badge--super_admin {
    background: rgba(222,186,73,0.15);
    color: #deba49;
}

/* ── Pagination ──────────────────────────────────────────────────────────── */
.pagination__item.is-active {
    background: #deba49;
    border-color: #deba49;
}
.pagination__item:hover:not(.is-active):not(.is-disabled) {
    background: #303030;
}

/* ── Progress bars ───────────────────────────────────────────────────────── */
.progress__fill {
    background: #deba49;
}
.step-bar__step.is-active {
    background: #deba49;
}

/* ── Job cards ───────────────────────────────────────────────────────────── */
.job-card:hover {
    border-color: #deba49;
    box-shadow: 0 10px 15px -3px rgba(0,0,0,.5), 0 0 0 1px rgba(222,186,73,0.2);
}

/* ── Modals ──────────────────────────────────────────────────────────────── */
.modal {
    background: #161616;
}
.modal__title i {
    color: #deba49;
}
.modal__close:hover {
    background: #303030;
}

/* ── Notifications / panels ──────────────────────────────────────────────── */
.notif-panel {
    background: #303030;
}
.notif-panel__dot {
    background: #deba49;
}
.notif-panel__item.is-unread {
    background: rgba(222,186,73,0.08);
}

/* ── Dropdowns ───────────────────────────────────────────────────────────── */
.dropdown__menu,
.filter-dropdown__menu,
.user-menu__dropdown {
    background: #303030;
}

/* ── User menu ───────────────────────────────────────────────────────────── */
.user-menu__avatar-placeholder {
    background: #deba49;
}

/* ── Page loader ─────────────────────────────────────────────────────────── */
.page-loader {
    background: #1c1c1c;
}
.page-loader__icon {
    background: #deba49;
}

/* ── Skeleton ────────────────────────────────────────────────────────────── */
.skeleton {
    background: linear-gradient(90deg, #303030 25%, rgba(222,186,73,0.08) 50%, #303030 75%);
    background-size: 800px 100%;
}

/* ── Tab / section active indicators ────────────────────────────────────── */
.sidebar__link.is-active,
.nav-tabs .is-active {
    color: #deba49;
}
