/*
 Theme Name:   Blocksy Child
 Theme URI:    https://businesscommunity.ai
 Description:  Blocksy Child Theme for BusinessCommunity.ai
 Author:       BusinessCommunity.ai
 Author URI:   https://businesscommunity.ai
 Template:     blocksy
 Version:      1.0.1
 Text Domain:  blocksy-child
*/

/*
 * All BusinessCommunity.ai customisations live below.
 * Parent Blocksy styles are loaded via functions.php (wp_enqueue_scripts).
 * The homepage template (page-homepage-v2-option-d-draft.php) carries all its
 * own scoped styles inside #bcv2 — nothing here affects the homepage.
 *
 * Every value below is taken directly from Homepage V2 header CSS.
 * Source: #bcv2 .hdr / #bcv2 nav / #bcv2 .search in page-homepage-v2-option-d-draft.php
 *
 * Sections:
 *   1. Logo  (.bc-logo Custom HTML element)
 *   2. Header shell
 *   3. Navigation — list, links, hover, dropdowns
 *   4. Live search — input, focus, dropdown results
 */


/* ============================================================
   1. LOGO — Blocksy Logo element (image) + built-in Site Title text
   V2 source: #bcv2 .logo / .logo-icon / .logo-text
   Note: gold "Community" colour is not achievable without a Custom HTML
   element. All other V2 logo properties are matched exactly.
   Blocksy settings required: Logo image = logo-2.webp, height = 38px,
   Site Title ON, Site Tagline OFF.
   ============================================================ */

/* Branding container — V2: .logo { display:flex; align-items:center; gap:10px } */
#header .site-branding {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-shrink: 0 !important;
}

/* Logo image — V2: .logo-icon { height:38px; width:auto } */
#header .site-branding img {
  height: 38px !important;
  width: auto !important;
  display: block !important;
  flex-shrink: 0 !important;
}

/* Site title container — remove any extra margin Blocksy adds */
#header .site-title {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}

/* Site title link — V2: .logo-text { font-size:15px; font-weight:600;
   color:#0A1628; letter-spacing:-0.01em; white-space:nowrap; line-height:1 }
   Note: entire text is navy — cannot split-colour "Community" gold via CSS alone */
#header .site-title a {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #0A1628 !important;
  letter-spacing: -0.01em !important;
  white-space: nowrap !important;
  line-height: 1 !important;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-style: normal !important;
  text-transform: none !important;
  text-decoration: none !important;
}


/* ============================================================
   2. HEADER SHELL
   V2 source: #bcv2 .hdr / .hdr-inner
   ============================================================ */

#header {
  background: #fff !important;
  border-bottom: 1px solid #e5e7eb !important; /* V2: border-bottom: 1px solid #e5e7eb */
}

/* 66px height — V2: .hdr-inner height: 66px */
#header .ct-container,
#header .header-row-inner {
  min-height: 66px !important;
}


/* ============================================================
   3. NAVIGATION
   V2 source: #bcv2 nav ul / nav a / nav a:hover / nav .drop / nav .drop li a
   ============================================================ */

/* Nav list — V2: gap: 2px, align-items: center */
#header .ct-menu {
  gap: 2px !important;
  align-items: center !important;
}

/* Top-level link default
   V2: font-size:14px; font-weight:600; color:#374151; padding:8px 13px;
       border-radius:6px; transition:background .15s,color .15s */
#header .ct-menu > li > a.ct-menu-link {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #374151 !important;
  padding: 8px 13px !important;
  border-radius: 6px !important;
  transition: background .15s, color .15s !important;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-style: normal !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  display: block !important;
}

/* Top-level link hover — V2: background:#f3f4f6; color:#7C3AED */
#header .ct-menu > li > a.ct-menu-link:hover,
#header .ct-menu > li.current-menu-item > a.ct-menu-link,
#header .ct-menu > li.current-menu-ancestor > a.ct-menu-link {
  background: #f3f4f6 !important;
  color: #7C3AED !important;
}

/* Dropdown panel
   V2: background:#fff; border:1px solid #e5e7eb; border-radius:8px;
       box-shadow:0 8px 24px rgba(0,0,0,.10); padding:5px 0; min-width:210px */
#header .ct-main-nav .sub-menu {
  background: #fff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.10) !important;
  padding: 5px 0 !important;
  min-width: 210px !important;
  list-style: none !important;
}

/* Dropdown item default
   V2: font-size:13px; font-weight:500; color:#374151; padding:9px 16px;
       border-radius:0; white-space:nowrap; display:block; background:transparent */
#header .ct-main-nav .sub-menu a.ct-menu-link {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #374151 !important;
  padding: 9px 16px !important;
  border-radius: 0 !important;
  white-space: nowrap !important;
  display: block !important;
  background: transparent !important;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-style: normal !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  transition: background .12s, color .12s !important;
}

/* Dropdown item hover — V2: background:#f3f4f6; color:#7C3AED */
#header .ct-main-nav .sub-menu a.ct-menu-link:hover {
  background: #f3f4f6 !important;
  color: #7C3AED !important;
}


/* ============================================================
   4. LIVE SEARCH
   Markup: <div class="bc-search-wrap">
             <input id="bc-global-search" class="bc-search" …>
             <div id="bc-global-search-drop" class="bc-search-drop" …></div>
           </div>
   V2 source: #bcv2 .search-wrap / .search / .search:focus /
              .search-drop / .search-item / .search-more / .search-empty
   ============================================================ */

.bc-search-wrap {
  position: relative;
  display: inline-block;
}

/* Input pill
   V2: border:1px solid #d1d5db; border-radius:20px; padding:7px 36px 7px 16px;
       font-size:13px; width:190px; color:#374151; background:#f9fafb */
.bc-search {
  border: 1px solid #d1d5db !important;
  border-radius: 20px !important;
  padding: 7px 36px 7px 16px !important;
  font-size: 13px !important;
  width: 190px !important;
  height: auto !important;
  line-height: 1.4 !important;
  color: #374151 !important;
  background: #f9fafb !important;
  outline: none !important;
  box-shadow: none !important;
  transition: border-color 0.15s !important;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-weight: normal !important;
  box-sizing: border-box !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  display: inline-block !important;
}

/* Focus — V2: border-color: #7C3AED */
.bc-search:focus {
  border-color: #7C3AED !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Dropdown panel
   V2: position:absolute; top:calc(100%+6px); right:0; width:320px;
       background:#fff; border:1px solid #e5e7eb; border-radius:10px;
       box-shadow:0 8px 24px rgba(0,0,0,.12) */
.bc-search-drop {
  display: none;
  position: fixed; /* fixed escapes Blocksy overflow:hidden on header */
  width: 320px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  z-index: 99999;
  overflow: hidden;
}

.bc-search-drop.active {
  display: block;
}

/* Result row — V2: .search-item */
.bc-search-item {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 10px 14px;
  text-decoration: none;
  color: #1a1a2e;
  transition: background 0.12s;
  border-bottom: 1px solid #f3f4f6;
}

.bc-search-item:last-of-type {
  border-bottom: none;
}

.bc-search-item:hover {
  background: #f8fafc;
}

/* Thumbnail — V2: .search-item-img */
.bc-search-item-img {
  width: 52px;
  height: 40px;
  flex-shrink: 0;
  border-radius: 5px;
  object-fit: cover;
  background: #e5e7eb;
}

/* Placeholder when no thumbnail — V2: .search-item-img-ph */
.bc-search-item-img-ph {
  width: 52px;
  height: 40px;
  flex-shrink: 0;
  border-radius: 5px;
  background: linear-gradient(135deg, #0A1628, #1a2040);
}

/* Result title — V2: .search-item-title */
.bc-search-item-title {
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
  color: #111827;
}

/* "Show more" footer link — V2: .search-more */
.bc-search-more {
  display: block;
  text-align: center;
  padding: 9px 14px;
  font-size: 12px;
  font-weight: 600;
  color: #2563EB;
  text-decoration: none;
  background: #f8fafc;
  border-top: 1px solid #e5e7eb;
  transition: background 0.12s;
}

.bc-search-more:hover {
  background: #eff6ff;
}

/* Empty state — V2: .search-empty */
.bc-search-empty {
  padding: 14px;
  font-size: 13px;
  color: #9ca3af;
  text-align: center;
}


/* ============================================================
   5. MOBILE — Unified Drawer System (2026-05-30 Session 10)
   Strategy: suppress Blocksy off-canvas entirely. Intercept
   .ct-header-trigger click via JS to open our custom drawer
   (#bc-nav-drawer), which is injected by functions.php
   wp_footer hook on all non-homepage pages. The homepage
   carries its own identical drawer inside its PHP template.
   ============================================================ */

/* Suppress Blocksy off-canvas — our drawer replaces it */
#offcanvas,
#offcanvas-panel {
  display: none !important;
}

/* Keep Blocksy burger trigger visible — JS intercepts its click */
.ct-header-trigger {
  --theme-link-initial-color: #374151 !important;
  --theme-link-hover-color: #7C3AED !important;
}
@media (max-width: 999.98px) {
  .ct-header-trigger {
    display: flex !important;
  }
}

/* ── Overlay ── */
.bc-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.35);
  z-index: 8999;
}
.bc-overlay.open { display: block; }

/* ── Drawer panel ── */
.bc-nav-drawer {
  position: fixed;
  top: 0;
  right: 0;
  width: 280px;
  max-width: 85vw;
  height: 100%;
  background: #fff;
  z-index: 9000;
  box-shadow: -4px 0 24px rgba(0,0,0,0.12);
  transform: translateX(100%);
  transition: transform .25s ease;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
.bc-nav-drawer.open { transform: translateX(0); }

/* ── Drawer header row (logo + close button) ── */
.bc-drawer-hdr {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 18px;
  border-bottom: 1px solid #e5e7eb;
  flex-shrink: 0;
}
.bc-drawer-logo {
  font-size: 14px;
  font-weight: 600;
  color: #0A1628;
  letter-spacing: -0.01em;
  text-decoration: none;
  white-space: nowrap;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.bc-drawer-logo span { color: #C9A227; }
.bc-close {
  background: none;
  border: none;
  cursor: pointer;
  padding: 6px 9px;
  border-radius: 6px;
  color: #374151;
  font-size: 20px;
  line-height: 1;
  flex-shrink: 0;
  transition: background .15s, color .15s;
}
.bc-close:hover { background: #f3f4f6; color: #7C3AED; }

/* ── Drawer nav list ── */
.bc-drawer-nav { padding: 8px 0; flex: 1; }
.bc-drawer-nav > ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0;
  padding: 0;
}
.bc-drawer-nav > ul > li { display: flex; flex-direction: column; }

/* ── Top-level link row (link + optional chevron) ── */
.bc-link-row { display: flex; align-items: center; }
.bc-link-row > a {
  flex: 1;
  font-size: 15px;
  font-weight: 600;
  color: #374151;
  padding: 11px 18px;
  display: block;
  text-decoration: none;
  transition: background .15s, color .15s;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.bc-link-row > a:hover { color: #7C3AED; background: #f3f4f6; }

/* ── Submenu chevron toggle ── */
.bc-sub-toggle {
  background: none;
  border: none;
  cursor: pointer;
  padding: 11px 14px;
  color: #9ca3af;
  font-size: 11px;
  line-height: 1;
  flex-shrink: 0;
  transition: color .15s, transform .2s;
}
.bc-sub-toggle:hover { color: #7C3AED; }
.bc-drawer-nav > ul > li.bc-open > .bc-link-row > .bc-sub-toggle {
  transform: rotate(180deg);
  color: #7C3AED;
}

/* ── Submenu list (accordion-style, fully flush with menu) ── */
.bc-sub-menu {
  display: none;
  flex-direction: column;
  background: #fff;
  list-style: none;
  margin: 0;
  padding: 0;
}
.bc-sub-menu li { list-style: none; }
.bc-drawer-nav > ul > li.bc-open > .bc-sub-menu { display: flex; }
.bc-sub-menu a {
  font-size: 14px;
  font-weight: 500;
  color: #6b7280;
  padding: 9px 18px 9px 32px;
  display: block;
  text-decoration: none;
  transition: color .12s, background .12s;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  text-align: left;
}
.bc-sub-menu a:hover { color: #7C3AED; background: #f3f4f6; }
