/*
 Theme Name:   BMC Kadence Child
 Theme URI:    https://blackmarketconcepts.com
 Description:  Black Market Concepts custom child theme for Kadence — premium hospitality marketplace design system.
 Author:       Black Market Concepts
 Author URI:   https://blackmarketconcepts.com
 Template:     kadence
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  https://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  bmc-kadence-child
*/

/* ============================================
   BMC GLOBAL DESIGN SYSTEM
   Black Market Concepts — The Marketing & Hospitality Marketplace
   ============================================ */

/* --- CSS Custom Properties --- */
:root {
    /* Brand Colors */
    --bmc-black: #080808;
    --bmc-yellow: #FFD100;
    --bmc-red: #E8192C;
    --bmc-gold: #C9A84C;
    --bmc-white: #F5F0E8;
    --bmc-dark-gray: #111111;
    --bmc-mid-gray: #1a1a1a;
    --bmc-text-gray: #999999;
    --bmc-border: rgba(255, 209, 0, 0.15);

    /* Typography */
    --bmc-font-headline: 'Bebas Neue', sans-serif;
    --bmc-font-body: 'DM Sans', sans-serif;
    --bmc-font-mono: 'Share Tech Mono', monospace;

    /* Spacing */
    --bmc-section-padding: clamp(60px, 8vw, 120px);
    --bmc-container-max: 1200px;

    /* Transitions */
    --bmc-transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* --- Global Reset & Base --- */
html {
    scroll-behavior: smooth;
}

body,
body.flavor {
    background-color: var(--bmc-black) !important;
    color: var(--bmc-white) !important;
    font-family: var(--bmc-font-body) !important;
    font-size: 16px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Kill ALL white backgrounds from WordPress/Kadence defaults */
.site,
.site-container,
.site-inner,
.entry-content,
.content-area,
#main,
#primary,
.wp-site-blocks,
.wp-block-group,
.kadence-inner-column,
.wp-block-kadence-rowlayout,
.wp-block-kadence-column {
    background-color: transparent !important;
}

/* --- Typography --- */
h1, h2, h3, h4, h5, h6,
.entry-title,
.wp-block-heading,
.kadence-title,
.kt-blocks-heading {
    font-family: var(--bmc-font-headline) !important;
    color: var(--bmc-white) !important;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    line-height: 1.1;
}

h1, .has-h-1-font-size { font-size: clamp(3rem, 6vw, 5.5rem) !important; }
h2, .has-h-2-font-size { font-size: clamp(2.2rem, 4vw, 3.8rem) !important; }
h3, .has-h-3-font-size { font-size: clamp(1.6rem, 3vw, 2.4rem) !important; }
h4, .has-h-4-font-size { font-size: clamp(1.2rem, 2vw, 1.8rem) !important; }

p, li, span, div,
.entry-content p {
    font-family: var(--bmc-font-body) !important;
    color: var(--bmc-white);
}

/* Mono text utility */
.bmc-mono,
code, pre,
.wp-block-code {
    font-family: var(--bmc-font-mono) !important;
    color: var(--bmc-gold);
}

/* --- Links --- */
a {
    color: var(--bmc-yellow);
    text-decoration: none;
    transition: var(--bmc-transition);
}
a:hover {
    color: var(--bmc-gold);
}

/* --- Buttons --- */
.wp-block-button__link,
.kb-button,
.kadence-button,
.button,
button.wp-element-button,
.wc-block-grid__product-add-to-cart a {
    background-color: var(--bmc-yellow) !important;
    color: var(--bmc-black) !important;
    font-family: var(--bmc-font-headline) !important;
    font-size: 1rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 14px 32px !important;
    border: none !important;
    border-radius: 0 !important;
    cursor: pointer;
    transition: var(--bmc-transition);
    font-weight: 700;
}
.wp-block-button__link:hover,
.kb-button:hover,
.kadence-button:hover,
button.wp-element-button:hover {
    background-color: var(--bmc-gold) !important;
    color: var(--bmc-black) !important;
    transform: translateY(-2px);
}

/* Ghost / outline button */
.is-style-outline .wp-block-button__link,
.kb-button.kb-btn-outline {
    background-color: transparent !important;
    color: var(--bmc-yellow) !important;
    border: 1px solid var(--bmc-yellow) !important;
}
.is-style-outline .wp-block-button__link:hover,
.kb-button.kb-btn-outline:hover {
    background-color: var(--bmc-yellow) !important;
    color: var(--bmc-black) !important;
}

/* Red accent button */
.bmc-btn-red,
.wp-block-button.bmc-btn-red .wp-block-button__link {
    background-color: var(--bmc-red) !important;
    color: var(--bmc-white) !important;
}

/* --- Header / Navigation --- */
#masthead,
.site-header,
header.site-header,
.site-header-wrap {
    background-color: rgba(8, 8, 8, 0.95) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--bmc-border);
}

.header-navigation a,
.main-navigation a,
.menu-item a,
#menu-primary-navigation a {
    font-family: var(--bmc-font-body) !important;
    color: var(--bmc-white) !important;
    font-size: 13px !important;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    transition: var(--bmc-transition);
}
.header-navigation a:hover,
.main-navigation a:hover,
.menu-item a:hover {
    color: var(--bmc-yellow) !important;
}

/* Dropdown menus */
.sub-menu,
ul.sub-menu,
.kadence-menu-mega-enabled > .sub-menu {
    background-color: var(--bmc-dark-gray) !important;
    border: 1px solid var(--bmc-border) !important;
    border-radius: 0 !important;
}
.sub-menu a {
    color: var(--bmc-white) !important;
}
.sub-menu a:hover {
    color: var(--bmc-yellow) !important;
    background-color: rgba(255, 209, 0, 0.08) !important;
}

/* Get Started CTA button in nav */
.header-button .kb-button,
.menu-item.highlight-menu-item a,
.header-cta-button a {
    background-color: var(--bmc-yellow) !important;
    color: var(--bmc-black) !important;
    font-family: var(--bmc-font-headline) !important;
    padding: 10px 24px !important;
    border-radius: 0 !important;
}

/* --- Footer --- */
#colophon,
.site-footer,
footer.site-footer,
.footer-wrap {
    background-color: var(--bmc-black) !important;
    border-top: 1px solid var(--bmc-border);
}
.site-footer a {
    color: var(--bmc-text-gray) !important;
}
.site-footer a:hover {
    color: var(--bmc-yellow) !important;
}

/* --- WooCommerce Overrides --- */
.woocommerce .products .product,
.wc-block-grid__product {
    background-color: var(--bmc-dark-gray) !important;
    border: 1px solid var(--bmc-border);
    transition: var(--bmc-transition);
}
.woocommerce .products .product:hover,
.wc-block-grid__product:hover {
    border-color: var(--bmc-yellow);
    transform: translateY(-4px);
}

.woocommerce .products .product .woocommerce-loop-product__title,
.wc-block-grid__product-title {
    font-family: var(--bmc-font-headline) !important;
    color: var(--bmc-white) !important;
    text-transform: uppercase;
}

.woocommerce .products .product .price,
.wc-block-grid__product-price {
    color: var(--bmc-yellow) !important;
    font-family: var(--bmc-font-mono) !important;
    font-size: 1.1rem;
}

.woocommerce .quantity .qty,
.woocommerce input,
.woocommerce select,
.woocommerce textarea {
    background-color: var(--bmc-dark-gray) !important;
    color: var(--bmc-white) !important;
    border: 1px solid var(--bmc-border) !important;
    border-radius: 0 !important;
}

.woocommerce-cart .cart-collaterals,
.woocommerce-checkout #payment,
.woocommerce table.shop_table {
    background-color: var(--bmc-dark-gray) !important;
    color: var(--bmc-white) !important;
}

.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info {
    background-color: var(--bmc-dark-gray) !important;
    color: var(--bmc-white) !important;
    border-top-color: var(--bmc-yellow) !important;
}

/* Star ratings gold */
.woocommerce .star-rating span::before,
.woocommerce .star-rating::before {
    color: var(--bmc-gold) !important;
}

/* --- Kadence Block Overrides --- */
.wp-block-kadence-rowlayout {
    padding-top: var(--bmc-section-padding);
    padding-bottom: var(--bmc-section-padding);
}

.kt-row-layout-inner {
    max-width: var(--bmc-container-max);
}

/* Section labels (BMC uses small all-caps labels above headings) */
.bmc-section-label {
    font-family: var(--bmc-font-mono) !important;
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--bmc-yellow);
    display: inline-block;
    padding: 4px 12px;
    border: 1px solid var(--bmc-border);
    margin-bottom: 16px;
}

/* Gold accent line */
.bmc-gold-line {
    width: 60px;
    height: 2px;
    background: var(--bmc-gold);
    margin: 16px 0;
}

/* --- Scrollbar --- */
::-webkit-scrollbar {
    width: 6px;
}
::-webkit-scrollbar-track {
    background: var(--bmc-black);
}
::-webkit-scrollbar-thumb {
    background: var(--bmc-gold);
    border-radius: 3px;
}

/* --- Selection --- */
::selection {
    background: var(--bmc-yellow);
    color: var(--bmc-black);
}

/* --- Utility Classes --- */
.bmc-bg-dark { background-color: var(--bmc-dark-gray) !important; }
.bmc-bg-black { background-color: var(--bmc-black) !important; }
.bmc-text-yellow { color: var(--bmc-yellow) !important; }
.bmc-text-gold { color: var(--bmc-gold) !important; }
.bmc-text-red { color: var(--bmc-red) !important; }
.bmc-text-white { color: var(--bmc-white) !important; }
.bmc-text-gray { color: var(--bmc-text-gray) !important; }
.bmc-border-gold { border: 1px solid var(--bmc-border) !important; }
.bmc-font-headline { font-family: var(--bmc-font-headline) !important; }
.bmc-font-mono { font-family: var(--bmc-font-mono) !important; }

/* --- Responsive --- */
@media (max-width: 768px) {
    :root {
        --bmc-section-padding: 48px;
    }

    h1, .has-h-1-font-size {
        font-size: clamp(2.2rem, 8vw, 3.5rem) !important;
    }

    .wp-block-button__link,
    .kb-button {
        padding: 12px 24px !important;
        font-size: 0.9rem;
    }
}


/* ==============================================
   MOBILE RESPONSIVE FIXES — BMC
   ============================================== */

/* --- Mobile Navigation Fix ---
   Show Kadence header (with hamburger menu) on mobile.
   Hide custom Vercel nav on mobile since it has no hamburger.
   This applies to ALL pages with custom Vercel content. */
@media (max-width: 768px) {
  /* Show Kadence header on mobile for all custom pages */
  /* Use body. prefix for higher specificity to beat inline !important */
  body.page-id-14 header.site-header,
  body.page-id-14 .site-header-wrap,
  body.page-id-15 header.site-header,
  body.page-id-15 .site-header-wrap {
    display: block !important;
    background: #080808 !important;
    border-bottom: 1px solid rgba(255, 209, 0, 0.15);
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
  }

  /* Keep Kadence footer hidden on mobile */
  body.page-id-14 footer.site-footer,
  body.page-id-14 .site-footer-wrap,
  body.page-id-15 footer.site-footer,
  body.page-id-15 .site-footer-wrap {
    display: none !important;
  }

  /* Style the Kadence mobile header to match BMC brand */
  body.page-id-14 .site-header .site-main-header-wrap,
  body.page-id-15 .site-header .site-main-header-wrap {
    background: #080808 !important;
  }

  /* Style the hamburger icon */
  body.page-id-14 .menu-toggle-open,
  body.page-id-15 .menu-toggle-open {
    color: #F5F0E8 !important;
  }

  body.page-id-14 .menu-toggle-icon .kadence-svg-iconset,
  body.page-id-15 .menu-toggle-icon .kadence-svg-iconset {
    color: #F5F0E8 !important;
  }

  /* Style the mobile drawer menu */
  body.page-id-14 .mobile-navigation,
  body.page-id-15 .mobile-navigation {
    background: #080808 !important;
  }

  /* Kadence mobile menu drawer styling */
  .mobile-navigation .drawer-inner {
    background: #080808 !important;
  }

  .mobile-navigation .drawer-content {
    background: #080808 !important;
  }

  .mobile-navigation .mobile-menu a {
    color: #F5F0E8 !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 1rem;
    letter-spacing: 0.05em;
  }

  .mobile-navigation .mobile-menu a:hover,
  .mobile-navigation .mobile-menu .current-menu-item a {
    color: #FFD100 !important;
  }

  /* Hide the custom Vercel nav on mobile */
  body.page-id-14 .entry-content > nav,
  body.page-id-15 .entry-content > nav,
  body.page-id-14 .entry-content > div > nav,
  body.page-id-15 .entry-content > div > nav {
    display: none !important;
  }
  
  /* Hide duplicate custom nav logo on mobile */
  body.page-id-14 .entry-content .nav-logo,
  body.page-id-15 .entry-content .nav-logo {
    display: none !important;
  }

  /* Add padding-top to content so it doesn't hide behind fixed header */
  body.page-id-14 .entry-content,
  body.page-id-15 .entry-content {
    padding-top: 70px !important;
  }

  /* --- Homepage Hero Mobile Fix --- */
  body.page-id-14 .hero {
    padding: 20px 16px 30px !important;
    min-height: auto !important;
  }

  body.page-id-14 .hero-phone {
    width: 200px !important;
    height: 400px !important;
    margin: 0 auto;
  }

  body.page-id-14 .hero-middle-row {
    flex-direction: column !important;
    gap: 16px !important;
    align-items: center !important;
  }

  body.page-id-14 .hero-badge-col {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 12px !important;
  }

  /* Show the mobile badges layout, hide desktop badge columns */
  body.page-id-14 .hero-badges-mobile {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    padding: 0 16px;
    margin-top: 16px;
  }

  /* Fix badge sizing on mobile */
  body.page-id-14 .badge-circle {
    width: 42px !important;
    height: 42px !important;
    font-size: 13px !important;
  }

  body.page-id-14 .badge-label {
    font-size: 7px !important;
    letter-spacing: 0.06em;
  }

  /* --- Homepage Sections Mobile Fix --- */
  body.page-id-14 .hiw-section,
  body.page-id-14 .our-work,
  body.page-id-14 .statement,
  body.page-id-14 .haus-teaser,
  body.page-id-14 .rs-teaser,
  body.page-id-14 .who-section,
  body.page-id-14 .entry-strip,
  body.page-id-14 .cta-section {
    padding-left: 16px !important;
    padding-right: 16px !important;
    overflow: hidden;
  }

  /* Fix overflow on mobile */
  body.page-id-14 .site-container,
  body.page-id-15 .site-container {
    overflow-x: hidden !important;
  }

  body.page-id-14 .entry-content,
  body.page-id-15 .entry-content {
    overflow-x: hidden !important;
  }

  /* Stats grid — 2 columns on mobile */
  body.page-id-14 .stats {
    grid-template-columns: 1fr 1fr !important;
    gap: 16px !important;
    padding: 40px 16px !important;
  }

  /* Services grid — single column on mobile */
  body.page-id-14 .services-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  /* Make marquee text smaller */
  body.page-id-14 .marquee-wrap {
    overflow: hidden !important;
  }

  /* Footer on mobile */
  body.page-id-14 .entry-content > footer {
    padding: 40px 16px !important;
  }

  body.page-id-14 .footer-top {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }

  /* Canvas should not overflow */
  body.page-id-14 .hero-canvas {
    max-width: 100vw !important;
  }
}

/* --- Small Mobile (max-width: 480px) --- */
@media (max-width: 480px) {
  body.page-id-14 .hero-phone {
    width: 160px !important;
    height: 320px !important;
  }

  body.page-id-14 .stats {
    grid-template-columns: 1fr !important;
  }

  body.page-id-14 .hero h2,
  body.page-id-14 .hero-phone-label {
    font-size: 1.6rem !important;
  }

  body.page-id-14 .hiw-step {
    padding: 20px !important;
  }
}

/* --- Design Page Mobile --- */
@media (max-width: 768px) {
  body.page-id-15 .d-hero {
    padding: 20px 16px !important;
    min-height: auto !important;
  }

  body.page-id-15 .d-board {
    font-size: 10px !important;
    overflow-x: auto;
  }

  body.page-id-15 .d-board-row {
    min-width: 600px;
  }

  body.page-id-15 .subway-section {
    padding: 40px 16px !important;
    overflow-x: hidden;
  }

  body.page-id-15 .subway-map {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}