/* =====================================================================
   HyperHQ brand theme for CoreUI panels & auth pages
   Matches the public landing page (public_html): black surface,
   gold (#DEAF1C) accent, Kanit / Chakra Petch type.
   Loaded AFTER panel/assets/css/style.css to override CoreUI defaults.
   ===================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@400;500;600;700&family=Kanit:wght@300;400;500;600;700&display=swap");

:root,
[data-coreui-theme="light"],
[data-coreui-theme="dark"] {
    /* ---- brand palette ---- */
    --hhq-primary: #DEAF1C;
    --hhq-primary-rgb: 222, 175, 28;
    --hhq-primary-hover: #f0c233;
    /*--hhq-bg: #000;*/
    /*--hhq-surface: #0e0e10;*/
    /*--hhq-surface-2: #161618;*/

    --hhq-border: rgba(255, 255, 255, 0.12);
    --hhq-text: #a6a6a6;
    --hhq-heading: #ffffff;

    /* ---- map onto CoreUI primary so btn/link/etc. inherit gold ---- */
    --cui-primary: var(--hhq-primary);
    --cui-primary-rgb: var(--hhq-primary-rgb);
    --cui-link-color: var(--hhq-primary);
    --cui-link-color-rgb: var(--hhq-primary-rgb);
    --cui-link-hover-color: var(--hhq-primary-hover);
}

/* Force the whole panel onto the dark surface regardless of stored mode */
[data-coreui-theme="dark"],
[data-coreui-theme="light"] {
    /*--cui-body-bg: var(--hhq-bg);*/
    --cui-body-bg-rgb: 0, 0, 0;
    --cui-body-color: var(--hhq-text);
    /*--cui-tertiary-bg: var(--hhq-surface-2);*/
    /*--cui-secondary-bg: var(--hhq-surface);*/
    --cui-border-color: var(--hhq-border);
    --cui-emphasis-color: var(--hhq-heading);
}

/* ---- base typography ---- */
body {
    font-family: "Kanit", system-ui, -apple-system, "Segoe UI", sans-serif;
    /*background-color: var(--hhq-bg);*/
    color: var(--hhq-text);
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: "Chakra Petch", "Kanit", sans-serif;
    color: var(--hhq-heading);
    font-weight: 600;
}

a {
    color: var(--hhq-primary);
}
a:hover {
    color: var(--hhq-primary-hover);
}

/* ---- cards / surfaces ---- */
.card {
    /*--cui-card-bg: var(--hhq-surface);*/
    --cui-card-color: var(--hhq-text);
    --cui-card-border-color: var(--hhq-border);
    /*--cui-card-cap-bg: var(--hhq-surface-2);*/
    /*background-color: var(--hhq-surface);*/
    border: 1px solid var(--hhq-border);
    border-radius: 12px;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45);
}
.card-body .text-body-secondary,
.text-body-secondary {
    color: #7c7c7c !important;
}

/* ---- form controls ---- */

.form-control:focus,
.form-select:focus {/*.form-control,*/
    /*.form-select {*/
    /*    background-color: #000;*/
    /*    border: 1px solid var(--hhq-border);*/
    /*    color: var(--hhq-heading);*/
    /*    height: 48px;*/
    /*}*/
    /*background-color: #000;*/
    color: var(--hhq-heading);
    border-color: var(--hhq-primary);
    box-shadow: 0 0 0 0.2rem rgba(var(--hhq-primary-rgb), 0.25);
}
.form-control::placeholder {
    color: #6a6a6a;
}
textarea.form-control {
    height: auto;
}
/*.input-group-text {*/
/*    background-color: var(--hhq-surface-2);*/
/*    border: 1px solid var(--hhq-border);*/
/*    color: var(--hhq-primary);*/
/*}*/
.form-check-input:checked {
    background-color: var(--hhq-primary);
    border-color: var(--hhq-primary);
}
.form-check-label,
label {
    color: var(--hhq-text);
}

/* ---- buttons : primary action = gold pill ----
   NOTE: CoreUI ships `[data-coreui-theme=dark] .btn-primary { ... }` (specificity
   0,2,0) with hard-coded sky-blue values. A plain `.btn-primary` (0,1,0) override
   loses regardless of load order, so every variant below is scoped under the theme
   attribute to match/beat that specificity. */
[data-coreui-theme="dark"] .btn-primary,
[data-coreui-theme="light"] .btn-primary,
.login-button-color {
    --cui-btn-color: #0a0a0a;
    --cui-btn-bg: var(--hhq-primary);
    --cui-btn-border-color: var(--hhq-primary);
    --cui-btn-hover-color: #0a0a0a;
    --cui-btn-hover-bg: var(--hhq-primary-hover);
    --cui-btn-hover-border-color: var(--hhq-primary-hover);
    --cui-btn-active-color: #0a0a0a;
    --cui-btn-active-bg: var(--hhq-primary-hover);
    --cui-btn-active-border-color: var(--hhq-primary-hover);
    --cui-btn-disabled-color: #0a0a0a;
    --cui-btn-disabled-bg: var(--hhq-primary);
    --cui-btn-disabled-border-color: var(--hhq-primary);
    font-weight: 600;
}
.btn {
    border-radius: 24px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    font-size: 14px;
    padding-left: 1.4rem;
    padding-right: 1.4rem;
}
.btn-link {
    text-transform: none;
    letter-spacing: 0;
    color: var(--hhq-primary);
}
[data-coreui-theme="dark"] .btn-outline-primary,
[data-coreui-theme="light"] .btn-outline-primary {
    --cui-btn-color: var(--hhq-primary);
    --cui-btn-border-color: var(--hhq-primary);
    --cui-btn-hover-color: #0a0a0a;
    --cui-btn-hover-bg: var(--hhq-primary);
    --cui-btn-hover-border-color: var(--hhq-primary);
    --cui-btn-active-bg: var(--hhq-primary);
    --cui-btn-active-border-color: var(--hhq-primary);
}
/* Secondary actions (Save / Submit / Create) — outline so gold stays the hero */
[data-coreui-theme="dark"] .btn-success,
[data-coreui-theme="light"] .btn-success {
    --cui-btn-color: #ffffff;
    --cui-btn-bg: transparent;
    --cui-btn-border-color: var(--hhq-border);
    --cui-btn-hover-color: #0a0a0a;
    --cui-btn-hover-bg: var(--hhq-primary);
    --cui-btn-hover-border-color: var(--hhq-primary);
    --cui-btn-active-color: #0a0a0a;
    --cui-btn-active-bg: var(--hhq-primary);
    --cui-btn-active-border-color: var(--hhq-primary);
}

/* ---- auth pages ---- */
.login-logo img {
    filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.6));
}

/* ---- admin sidebar ---- */
/*.sidebar {*/
/*    --cui-sidebar-bg: #0a0a0b;*/
/*    --cui-sidebar-color: var(--hhq-text);*/
/*    --cui-sidebar-brand-bg: #000;*/
/*    --cui-sidebar-nav-link-color: var(--hhq-text);*/
/*    --cui-sidebar-nav-link-hover-color: var(--hhq-heading);*/
/*    --cui-sidebar-nav-link-hover-bg: rgba(var(--hhq-primary-rgb), 0.08);*/
/*    --cui-sidebar-nav-link-active-color: #0a0a0a;*/
/*    --cui-sidebar-nav-link-active-bg: var(--hhq-primary);*/
/*    --cui-sidebar-nav-link-active-icon-color: #0a0a0a;*/
/*    --cui-sidebar-nav-title-color: #6a6a6a;*/
/*    --cui-sidebar-nav-group-indicator-color: var(--hhq-text);*/
/*    border-right: 1px solid var(--hhq-border);*/
/*}*/
/*.sidebar-brand {*/
/*    background-color: #000;*/
/*}*/

/* ---- admin top header ---- */
/*.header {*/
/*    --cui-header-bg: var(--hhq-surface);*/
/*    --cui-header-color: var(--hhq-text);*/
/*    --cui-header-border-color: var(--hhq-border);*/
/*    background-color: var(--hhq-surface);*/
/*}*/
/*.header-toggler {*/
/*    color: var(--hhq-text);*/
/*}*/

/* ---- tables ---- */
.table {
    --cui-table-bg: transparent;
    --cui-table-color: var(--hhq-text);
    --cui-table-border-color: var(--hhq-border);
    --cui-table-striped-bg: rgba(255, 255, 255, 0.03);
    --cui-table-hover-bg: rgba(var(--hhq-primary-rgb), 0.06);
    color: var(--hhq-text);
}
.table thead th {
    color: var(--hhq-heading);
    border-bottom-color: var(--hhq-border);
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: 0.4px;
}

/* ---- dropdowns / modals ---- */
.dropdown-menu {
    /*--cui-dropdown-bg: var(--hhq-surface-2);*/
    --cui-dropdown-color: var(--hhq-text);
    --cui-dropdown-border-color: var(--hhq-border);
    --cui-dropdown-link-color: var(--hhq-text);
    --cui-dropdown-link-hover-bg: rgba(var(--hhq-primary-rgb), 0.1);
    --cui-dropdown-link-hover-color: var(--hhq-heading);
}
.modal-content {
    /*background-color: var(--hhq-surface);*/
    border: 1px solid var(--hhq-border);
    color: var(--hhq-text);
}

/* ---- misc accents ---- */
.text-primary { color: var(--hhq-primary) !important; }
.bg-primary { background-color: var(--hhq-primary) !important; }
.border-primary { border-color: var(--hhq-primary) !important; }
::selection { background: rgba(var(--hhq-primary-rgb), 0.35); color: #fff; }