@import url('https://fonts.googleapis.com/css2?family=Syne:wght@600;700;800&family=Manrope:wght@400;500;600&display=swap');

/* ── Design tokens ──────────────────────────────────────────────── */
:root {
    --frado-bg:           #0F0F23;
    --frado-surface:      #1B1B30;
    --frado-accent:       #CA8A04;
    --frado-accent-light: #FBBF24;
    --frado-text:         #F8FAFC;
    --frado-muted:        #94A3B8;
}

/* ── Global dark base — body/html/page wrappers ─────────────────── */
html,
body,
#page,
.site,
.wp-site-blocks,
.site-container,
.site-inner,
.site-content,
.site-content-inner,
.site-content-container,
.site-below-header,
.site-main,
.content-area,
.content-container,
.content-container-inner,
.content-bg,
.main-content-width {
    background-color: #0F0F23 !important;
    color: #F8FAFC !important;
}

/* ── Kadence specific layout containers ─────────────────────────── */
.kadence-content,
.kadence-inside-inner-row,
.kadence-column,
.kadence-column > .kadence-column-inner,
.kb-inside-container,
.kb-row-layout-wrap,
.kb-row-layout-inner,
.kb-theme-content-width,
.kt-inside-inner-col,
.kadence-blocks-row,
.wp-block-kadence-rowlayout,
.wp-block-kadence-column,
.wp-block-group,
.wp-block-group > .wp-block-group__inner-container {
    background-color: #0F0F23 !important;
}

/* ── Kadence hero container — THE white-box culprit on art pages ── */
/* content.min.css sets: .entry-hero-container-inner { background: var(--global-palette7) }  */
/* --global-palette7 = #EDF2F7 (light gray) → causes white corners  */
.entry-hero-container-inner,
.entry-hero-container,
.entry-hero-section-overlay,
.page-hero-section,
.entry-hero,
.hero-section-overlay,
.hero-container {
    background-color: #0F0F23 !important;
    background: #0F0F23 !important;
}

/* Kadence boxed layout — sidebar areas outside content box */
body.content-style-boxed .site,
body.content-style-boxed #page,
body.content-style-boxed .entry-hero-container-inner {
    background-color: #0F0F23 !important;
}

/* ── Entry/article wrappers ─────────────────────────────────────── */
.entry,
.hentry,
.post,
.article-content-wrap,
.entry-content-wrap,
.entry-header,
.entry-content,
.entry-footer,
.entry-summary,
.loop-entry,
.site-main > article,
.site-main > .loop-entry {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    color: #F8FAFC !important;
}

/* ── Sidebar / widget areas ─────────────────────────────────────── */
aside,
#secondary,
.secondary,
.widget-area,
.widget,
.widget-title {
    background-color: #0F0F23 !important;
    color: #94A3B8 !important;
    border-color: rgba(202, 138, 4, 0.15) !important;
}

/* ── FRADO custom header — hide Kadence header when nav present ── */
.site-header,
#masthead,
.site-header-row-container,
.site-header-row-container-inner,
.site-header-upper-inner-wrap,
.site-header-bottom-inner-wrap,
.site-header-upper-section,
.site-branding-container,
.header-navigation-layout,
.kadence-pro-header-wrap,
.kadence-sticky-header,
.wp-site-header,
.main-navigation,
.kb-header {
    background: transparent !important;
    background-color: transparent !important;
}

/* Hide Kadence's own header only when FRADO nav is present */
.frado-nav ~ .site-header,
.frado-nav ~ #masthead {
    display: none !important;
}

/* ── Page hero / title area ─────────────────────────────────────── */
.entry-hero-section-overlay,
.entry-hero-layout-standard,
.page-title,
.entry-title {
    background-color: #0F0F23 !important;
    color: #F8FAFC !important;
    font-family: 'Syne', sans-serif !important;
}

.entry-title {
    color: #CA8A04 !important;
}

/* ── Breadcrumbs ────────────────────────────────────────────────── */
.kadence-breadcrumbs {
    background-color: #0F0F23 !important;
}

.kadence-breadcrumbs a,
.kadence-breadcrumbs span {
    color: #94A3B8 !important;
}

/* ── Entry content typography ────────────────────────────────────── */
.entry-content p,
.entry-content li,
.entry-content span,
.entry-content div,
.entry-content td {
    color: #94A3B8 !important;
    font-family: 'Manrope', sans-serif !important;
}

.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
    color: #F8FAFC !important;
    font-family: 'Syne', sans-serif !important;
}

.entry-content a {
    color: #CA8A04 !important;
}

.entry-content a:hover {
    color: #EAB308 !important;
}

.entry-content img {
    border-radius: 8px;
    max-width: 100%;
}

/* ── Footer ──────────────────────────────────────────────────────── */
.site-footer,
.site-bottom-footer-wrap,
.site-footer-row-container-inner,
.site-footer-row-container {
    background-color: #0A0A1A !important;
    color: #94A3B8 !important;
}

/* ── Kadence Blocks — force dark background ──────────────────────── */
.kb-btns-wrap,
.kb-btn-custom-colors,
.kb-image,
.kb-spacer,
.kb-divider {
    background-color: transparent !important;
}

/* ── Body class overrides — single & page templates ─────────────── */
body.single,
body.page,
body.archive,
body.search,
body.post-type-archive {
    background-color: #0F0F23 !important;
}

body.single .content-area,
body.page .content-area,
body.archive .content-area {
    background-color: #0F0F23 !important;
}

body.single .site-content-inner,
body.page .site-content-inner {
    background-color: #0F0F23 !important;
}

/* ── White-kill: catch any remaining Kadence white boxes ─────────── */
body {
    background-color: #0F0F23 !important;
}

.home .content-container,
.page .content-container,
.single .content-container {
    background-color: #0F0F23 !important;
    padding: 0 !important;
}

/* ── Global focus styles (keyboard accessibility) ───────────────── */
/* All interactive elements get a visible gold ring on focus */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[role="button"]:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid #CA8A04 !important;
    outline-offset: 3px !important;
    border-radius: 4px;
}

/* Remove browser default focus only when we have focus-visible */
a:focus:not(:focus-visible),
button:focus:not(:focus-visible) {
    outline: none;
}

/* FRADO nav specific focus */
.frado-nav__links a:focus-visible {
    outline: 2px solid #CA8A04 !important;
    outline-offset: 4px !important;
    border-radius: 3px;
}

.frado-nav__cta:focus-visible {
    outline: 2px solid #EAB308 !important;
    outline-offset: 3px !important;
}

/* ── Responsive ──────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .frado-nav__links {
        display: none;
    }

    .frado-nav {
        padding: 0.75rem 1rem;
    }
}
