/*!
 * 4swingers.com — Goud/zwart thema (site-brede override)
 * ------------------------------------------------------------------
 * Laadt als laatste in de <head> via een sys_injections-regel:
 *   <link rel="stylesheet" href="/theme_4swingers.css?v=1">
 *
 * Mikt op de echte UNA/artificer-klassen (bx-def-color-bg-*, bx-def-border,
 * bx-def-font-*, bx-btn, ...). !important zorgt dat de override wint van de
 * door Studio gegenereerde kleuren, zodat dit zelfstandig werkt.
 *
 * Kleurpalet:
 *   Goud accent : #d4af37  (licht: #f0d472)
 *   Zwart/pagina: #070707
 *   Box/blok    : #141210 / #0e0d0b
 *   Tekst       : #e8e1cf (licht), #9a937f (gedimd)
 * ------------------------------------------------------------------ */

/* ===== Pagina-achtergrond + basis-tekst ===== */
html, body,
.bx-def-color-bg-page,
.bx-std-bg.bx-def-color-bg-page {
    background-color: #070707 !important;
    color: #e8e1cf !important;
}
body {
    background-image:
        radial-gradient(1100px 600px at 50% -120px, rgba(212,175,55,.10), rgba(212,175,55,0) 60%),
        radial-gradient(900px 700px at 50% 120%, rgba(212,175,55,.06), rgba(212,175,55,0) 60%) !important;
    background-attachment: fixed !important;
}

/* ===== Blokken, boxen, secties ===== */
.bx-def-color-bg-block            { background-color: #0e0d0b !important; }
.bx-def-color-bg-box              { background-color: #141210 !important; }
.bx-def-color-bg-box-active,
.bx-def-color-bg-box-hover:hover  { background-color: #1c1813 !important; }
.bx-def-color-bg-sec              { background-color: #100f0c !important; }
.bx-def-color-bg-hl,
.bx-def-color-bg-hl-even:nth-child(even),
.bx-def-color-bg-hl-hover:hover   { background-color: #17140f !important; }

/* Het goud-accent (actieve menu-items, markeringen, ...) */
.bx-def-color-bg-active {
    background-color: #d4af37 !important;
    color: #1a1408 !important;
}

/* ===== Randen / scheidingslijnen ===== */
.bx-def-border,
.bx-def-border-top, .bx-def-border-top-auto,
.bx-def-border-right, .bx-def-border-bottom, .bx-def-border-left,
.bx-def-border-rightbottomleft,
.bx-artificer .bx-def-border {
    border-color: rgba(212,175,55,.22) !important;
}
.bx-def-hr, .bx-def-hr-auto {
    border-top-color: rgba(212,175,55,.22) !important;
}

/* ===== Tekstkleuren ===== */
.bx-def-font-color, .bx-def-font-color:hover { color: #e8e1cf !important; }
.bx-def-font-grayed,
.bx-def-font-meta, a.bx-def-font-meta        { color: #9a937f !important; }
.bx-def-font-contrasted                      { color: #fff !important; }

/* Titels in serif voor een luxere look */
h1, h2, h3,
.bx-def-font-h1, .bx-def-font-h2, .bx-def-font-h3,
.bx-db-title {
    color: #f3ead3 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    letter-spacing: .3px;
}

/* ===== Links ===== */
a, a:visited,
.bx-def-font-link {
    color: #d4af37 !important;
}
a:hover {
    color: #f0d472 !important;
}

/* ===== Knoppen ===== */
.bx-btn {
    background-color: #1c1813 !important;
    color: #e8e1cf !important;
    border: 1px solid rgba(212,175,55,.40) !important;
    transition: border-color .2s ease, box-shadow .2s ease, color .2s ease;
}
.bx-btn:hover {
    border-color: #d4af37 !important;
    color: #f7efd8 !important;
}
/* Primaire / actieve knop = gouden gradient */
.bx-btn.bx-btn-primary,
.bx-btn.bx-btn-active,
.sys-jf .bx-form-input-submit.bx-btn,
.sys-lf .bx-form-input-submit.bx-btn {
    background-image: linear-gradient(180deg, #f0d472, #d4af37) !important;
    background-color: #d4af37 !important;
    color: #1a1408 !important;
    border: 0 !important;
    font-weight: 700 !important;
}
.bx-btn.bx-btn-primary:hover,
.bx-btn.bx-btn-active:hover {
    box-shadow: 0 6px 22px rgba(212,175,55,.40) !important;
}
.bx-btn.bx-btn-disabled,
.bx-btn.bx-btn-disabled:hover,
.bx-btn.bx-btn-disabled:active {
    background-image: none !important;
    background-color: #2a2620 !important;
    color: #6c665a !important;
    border: 1px solid rgba(212,175,55,.15) !important;
}

/* ===== Formulier-velden ===== */
.bx-form-input-text, .bx-form-input-textarea, .bx-form-input-select,
input[type="text"], input[type="email"], input[type="password"],
input[type="search"], input[type="number"], input[type="tel"],
input[type="url"], textarea, select {
    background-color: #0d0c0a !important;
    color: #e8e1cf !important;
    border: 1px solid rgba(212,175,55,.30) !important;
}
.bx-form-input-text:focus, .bx-form-input-textarea:focus,
input:focus, textarea:focus, select:focus {
    border-color: #d4af37 !important;
    outline: 0 !important;
    box-shadow: 0 0 0 2px rgba(212,175,55,.18) !important;
}
::placeholder { color: #7d776a !important; }

/* ===== Bovenbalk / toolbar ===== */
#bx-toolbar, .bx-toolbar,
.bx-toolbar .bx-def-color-bg-box {
    background-color: #0a0a0a !important;
    border-bottom: 1px solid rgba(212,175,55,.22) !important;
}

/* ===== Popups / menu's ===== */
.bx-popup, .bx-popup-content {
    background-color: #141210 !important;
    border: 1px solid rgba(212,175,55,.25) !important;
}
.bx-popup-fog { background-color: rgba(0,0,0,.72) !important; }

/* ===== Hero / cover-banner (homepage + profielen) ===== */
.bx-cover-wrapper,
.bx-cover-homepage {
    background-image: none !important;
    background-color: #070707 !important;
}
.bx-cover-wrapper::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(720px 340px at 50% 0%, rgba(212,175,55,.16), rgba(212,175,55,0) 62%);
}
.bx-cover, .bx-cover-cnt,
.bx-cover-title, .bx-cover-title *,
.bx-cover-cnt p, .bx-cover-cnt span, .bx-cover-cnt h1, .bx-cover-cnt h2 {
    color: #f3ead3 !important;
    text-shadow: none !important;
}
/* gradient-overlay van de cover uitzetten (was bedoeld voor lichte foto's) */
.bx-cover-gradient { display: none !important; }

/* ===== Actief menu-item (bv. "Home") in goud ===== */
.bx-menu-tab-active,
li.bx-menu-tab-active,
li.bx-menu-tab-active > a,
.bx-menu-main .bx-menu-tab-active {
    background-color: #d4af37 !important;
    color: #1a1408 !important;
    border-radius: 8px !important;
}
.bx-menu-tab-active .sys-icon,
.bx-menu-tab-active i,
.bx-menu-tab-active span { color: #1a1408 !important; }

/* ===== Tekstselectie + scrollbar ===== */
::selection { background: #d4af37; color: #1a1408; }
* { scrollbar-color: #d4af37 #141210; }
::-webkit-scrollbar { width: 12px; height: 12px; }
::-webkit-scrollbar-track { background: #0e0d0b; }
::-webkit-scrollbar-thumb { background: #5a4a18; border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: #d4af37; }