/*
Theme Name: Black Box Pizzaco
Theme URI: https://blackboxpizzaco.com
Description: Black Box Pizzaco custom theme — child of Twenty Twenty-Five. Black & gold brand identity for Dubai's finest artisan pizza restaurant.
Author: Black Box Pizzaco
Author URI: https://blackboxpizzaco.com
Template: twentytwentyfive
Version: 1.0.0
Text Domain: blackbox-pizzaco-theme
Requires at least: 6.0
Requires PHP: 7.4
*/

/* ─────────────────────────────────────────
   Black Box Pizzaco — Brand Styles
   Colors: #0d0d0d (black), #c9a84c (gold)
   Fonts: Playfair Display (headings) + Inter (body)
   ───────────────────────────────────────── */

/* Import Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700;900&family=Inter:wght@300;400;500;600;700&display=swap');

/* ── CSS Custom Properties ─────────────── */
:root {
    --bbp-black:       #0d0d0d;
    --bbp-black-soft:  #1a1a1a;
    --bbp-black-mid:   #222;
    --bbp-gold:        #c9a84c;
    --bbp-gold-light:  #e0bf6a;
    --bbp-gold-dark:   #a0852f;
    --bbp-white:       #f5f5f0;
    --bbp-gray:        #888;
    --bbp-gray-light:  #ccc;
    --bbp-font-head:   'Playfair Display', Georgia, 'Times New Roman', serif;
    --bbp-font-body:   'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --bbp-radius:      8px;
    --bbp-max-width:   1200px;
}

/* ── Global Reset & Base ───────────────── */
body {
    background-color: var(--bbp-black) !important;
    color: var(--bbp-white) !important;
    font-family: var(--bbp-font-body) !important;
    font-size: 16px;
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
}

/* ── Typography ────────────────────────── */
h1, h2, h3, h4, h5, h6,
.wp-block-heading {
    font-family: var(--bbp-font-head) !important;
    color: var(--bbp-white) !important;
    line-height: 1.2;
    font-weight: 700;
}

h1, .wp-block-heading h1 { font-size: clamp(2rem, 5vw, 3.5rem); }
h2, .wp-block-heading h2 { font-size: clamp(1.5rem, 3.5vw, 2.5rem); }
h3, .wp-block-heading h3 { font-size: clamp(1.2rem, 2.5vw, 1.8rem); }

p {
    color: #ccc;
    margin-bottom: 1.2em;
}

a {
    color: var(--bbp-gold);
    text-decoration: none;
    transition: color 0.2s ease;
}

a:hover {
    color: var(--bbp-gold-light);
}

strong, b {
    color: var(--bbp-white);
    font-weight: 700;
}

/* ── Header / Site Header ─────────────── */
.wp-block-template-part header,
header.wp-block-template-part,
.wp-site-blocks > header {
    background: rgba(13, 13, 13, 0.97) !important;
    border-bottom: 1px solid #222;
    position: sticky;
    top: 0;
    z-index: 100;
    backdrop-filter: blur(8px);
}

/* Site title */
.wp-block-site-title a,
.wp-block-site-title {
    font-family: var(--bbp-font-head) !important;
    font-weight: 900 !important;
    color: var(--bbp-gold) !important;
    font-size: 1.5rem !important;
    text-transform: uppercase;
    letter-spacing: 2px;
    text-decoration: none !important;
}

/* ── Navigation ───────────────────────── */
.wp-block-navigation,
.wp-block-navigation a {
    color: var(--bbp-white) !important;
    font-family: var(--bbp-font-body) !important;
    font-weight: 500;
    font-size: 14px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.wp-block-navigation a:hover {
    color: var(--bbp-gold) !important;
}

.wp-block-navigation .current-menu-item > a,
.wp-block-navigation a[aria-current="page"] {
    color: var(--bbp-gold) !important;
    border-bottom: 2px solid var(--bbp-gold);
    padding-bottom: 2px;
}

/* Mobile nav toggle */
.wp-block-navigation__responsive-container-close,
.wp-block-navigation__responsive-container-open {
    color: var(--bbp-gold) !important;
}

/* ── Content Area ─────────────────────── */
.wp-site-blocks,
.wp-block-post-content,
.entry-content,
main {
    background: var(--bbp-black) !important;
}

.wp-block-group,
.wp-block-cover {
    background: var(--bbp-black-soft);
}

/* ── Footer ───────────────────────────── */
.wp-block-template-part footer,
footer.wp-block-template-part {
    background: var(--bbp-black-soft) !important;
    border-top: 1px solid #2a2a2a;
    color: #888 !important;
}

.wp-block-template-part footer p,
.wp-block-template-part footer a,
footer.wp-block-template-part p,
footer.wp-block-template-part a {
    color: #888 !important;
    font-size: 14px;
}

footer a:hover {
    color: var(--bbp-gold) !important;
}

/* ── Buttons / CTAs ───────────────────── */
.wp-block-button__link,
.wp-element-button {
    background: var(--bbp-gold) !important;
    color: #000 !important;
    border: none !important;
    border-radius: var(--bbp-radius) !important;
    font-family: var(--bbp-font-body) !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    padding: 14px 32px !important;
    transition: background 0.2s ease, transform 0.15s ease !important;
    text-transform: uppercase;
    font-size: 14px !important;
}

.wp-block-button__link:hover,
.wp-element-button:hover {
    background: var(--bbp-gold-light) !important;
    color: #000 !important;
    transform: translateY(-2px);
}

/* Outline button variant */
.wp-block-button.is-style-outline .wp-block-button__link {
    background: transparent !important;
    color: var(--bbp-gold) !important;
    border: 2px solid var(--bbp-gold) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
    background: var(--bbp-gold) !important;
    color: #000 !important;
}

/* ── Separator ────────────────────────── */
.wp-block-separator {
    border-color: #2a2a2a !important;
    opacity: 1;
}

/* ── Images ───────────────────────────── */
.wp-block-image img {
    border-radius: var(--bbp-radius);
}

.wp-block-cover {
    background-color: var(--bbp-black) !important;
}

/* ── Quote Block ──────────────────────── */
.wp-block-quote {
    border-left: 4px solid var(--bbp-gold) !important;
    padding-left: 20px;
    color: #aaa;
    font-style: italic;
    font-family: var(--bbp-font-head);
    font-size: 1.2em;
}

/* ── List Blocks ──────────────────────── */
.wp-block-list,
.wp-block-list li {
    color: #ccc;
}

/* ── Hero / Cover Overlay ─────────────── */
.wp-block-cover__background {
    opacity: 0.65 !important;
    background: var(--bbp-black) !important;
}

/* ── Gold Accent Text ─────────────────── */
.has-gold-color,
.bbp-gold-text {
    color: var(--bbp-gold) !important;
}

/* ── Page Layout ──────────────────────── */
.wp-block-post-title {
    font-family: var(--bbp-font-head) !important;
    color: var(--bbp-white) !important;
    font-size: clamp(2rem, 5vw, 3.5rem);
    font-weight: 900;
    margin-bottom: 32px;
}

/* ── Admin Bar Adjustment ─────────────── */
.admin-bar .wp-block-template-part header,
.admin-bar header.wp-block-template-part {
    top: 32px;
}

@media (max-width: 782px) {
    .admin-bar .wp-block-template-part header,
    .admin-bar header.wp-block-template-part {
        top: 46px;
    }
}

/* ── Scrollbar ────────────────────────── */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--bbp-black); }
::-webkit-scrollbar-thumb { background: #333; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--bbp-gold); }

/* ── Selection ────────────────────────── */
::selection {
    background: var(--bbp-gold);
    color: #000;
}