/*
 Theme Name: Choisen Child Theme
 Theme URI: https://choisen.com
 Description: Custom dark-mode child theme for Choisen — glassmorphic, neumorphic, AI-focused.
 Author: Mr. Founder
 Template: blocksy
 Version: 2.0.0 (Dark Mode Optimized)
*/

/* Import parent theme */
@import url("../blocksy/style.css");

/* ============================================================
   ROOT VARIABLES — BRAND + DARK MODE TOKENS
============================================================ */
:root {
  --choisen-primary: #FF6E33;
  --choisen-accent:  #FF3F7A;
  --choisen-gradient-1: #FF6E33;
  --choisen-gradient-2: #FF3F7A;

  --choisen-black: #000000;
  --choisen-white: #ffffff;
  --choisen-text-light: #e8e8e8;
  --choisen-text-muted: #bfbfbf;

  --choisen-height: 68px;
}

/* ============================================================
   GLOBAL DARK BACKGROUND
============================================================ */
html, body {
  background: var(--choisen-black) !important;
  color: var(--choisen-text-light) !important;
  margin: 0;
  padding: 0;
}

/* Remove ALL unwanted white backgrounds */
body * ,
.site,
#page,
.container,
.elementor,
.elementor-section,
.elementor-container,
.elementor-widget-container,
.content-area,
.site-main {
  background: transparent !important;
  color: var(--choisen-text-light) !important;
}

img { background: transparent !important; }

/* ============================================================
   TEXT & TYPOGRAPHY
============================================================ */
h1,h2,h3,h4,h5,h6 { color: var(--choisen-white) !important; }
p, span, li, small, strong, em, div, article { color: var(--choisen-text-light) !important; }
.muted, .post-meta, .entry-meta { color: var(--choisen-text-muted) !important; }

/* ============================================================
   LINKS
============================================================ */
a { color: var(--choisen-primary) !important; text-decoration:none; }
a:hover { color: var(--choisen-accent) !important; text-decoration:underline; }

/* ============================================================
   FORMS / INPUTS / PLACEHOLDERS
============================================================ */
input, textarea, select {
  background: rgba(255,255,255,0.05) !important;
  color: var(--choisen-white) !important;
  border: 1px solid rgba(255,255,255,0.22) !important;
  border-radius: 12px !important;
}
input::placeholder, textarea::placeholder { color:#bbbbbb !important; }

/* ============================================================
   BUTTONS
============================================================ */
button, .btn, .button, input[type=submit], .wp-block-button__link {
  background: linear-gradient(90deg, var(--choisen-primary), var(--choisen-accent)) !important;
  color:#fff !important;
  border:none !important;
  border-radius:12px !important;
  padding:10px 18px !important;
  font-weight:700 !important;
  box-shadow: 0 8px 22px rgba(255,63,122,0.22) !important;
  transition: 0.25s ease;
}
button:hover, .btn:hover { transform: translateY(-2px); box-shadow: 0 16px 40px rgba(255,63,122,0.28) !important; }

/* ============================================================
   HEADER — FULL BLACK + CLEAR LINKS
============================================================ */
.site-header, .header-wrapper, .blocksy-header {
  background: rgba(0,0,0,0.8) !important;
  backdrop-filter: blur(8px);
  border: none !important;
}
.site-header a, .main-navigation a { color: var(--choisen-text-light) !important; }
.site-header a:hover { color: var(--choisen-primary) !important; }

/* ============================================================
   HERO SECTION — PRESERVE GRADIENT (DO NOT DARKEN)
============================================================ */
.hero, #choisen-hero, #choisen-hero-dark {
  background: linear-gradient(120deg, var(--choisen-gradient-1), var(--choisen-gradient-2)) !important;
  color: #fff !important;
  position: relative;
  overflow: hidden;
}
.hero * { background: transparent !important; color: inherit !important; }

/* ============================================================
   CARDS, BOXES, GLASS ELEMENTS
============================================================ */
.card, .box, .widget, .elementor-widget, .glass, .neu {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 14px !important;
  backdrop-filter: blur(12px) !important;
}
.card:hover, .box:hover { transform: translateY(-6px); box-shadow: 0 25px 50px rgba(0,0,0,0.55); }

/* ============================================================
   FOOTER — PURE BLACK, SOFT TEXT
============================================================ */
.site-footer { background: #000 !important; color: var(--choisen-text-muted) !important; border-top: 1px solid rgba(255,255,255,0.06) !important; }

/* ============================================================
   SIDEBAR & WIDGETS
============================================================ */
.sidebar-box {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  padding: 18px;
  border-radius: 14px;
}
.sidebar-box a { color: var(--choisen-text-light) !important; }
.sidebar-box a:hover { color: var(--choisen-primary) !important; }

/* ============================================================
   IMAGES IN CARDS / POSTS
============================================================ */
.post-thumbnail img, .entry-content img, .card img { border-radius: 12px; }

/* ============================================================
   RESPONSIVE FIXES
============================================================ */
@media (max-width: 768px) {
  .hero { padding: 40px 16px; min-height: 56vh; }
}

/* GLOBAL ARCHIVE + CATEGORY STYLING FOR CHOISEN */
.choisen-archive-main, .choisen-cat-main { background:#000; padding:60px 6%; color:#fff; }
.choisen-archive-title, .choisen-cat-title { font-size:38px; margin-bottom:10px; color:#fff; text-shadow: 0 0 18px rgba(255,110,51,0.45); }
.choisen-archive-desc, .choisen-cat-sub { color:#dcdcdc; font-size:16px; margin-bottom:30px; }
.choisen-archive-grid, .choisen-cat-grid { display:grid; grid-template-columns: repeat(3,1fr); gap:22px; }
.archive-card, .cat-card { background: rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08); border-radius:14px; overflow:hidden; transition: transform .25s ease, box-shadow .25s ease; backdrop-filter: blur(12px); }
.archive-card:hover, .cat-card:hover { transform: translateY(-6px); box-shadow: 0 20px 60px rgba(255,110,51,0.15); }
.archive-thumb img, .cat-thumb img { width:100%; height:210px; object-fit:cover; display:block; }
.archive-body, .cat-body { padding:16px 18px; }
.archive-h, .cat-h { color:#fff; margin:0 0 8px 0; font-size:20px; }
.archive-ex, .cat-ex { color:#cfcfcf; font-size:14px; }
.choisen-archive-pagination, .choisen-cat-pagination { margin-top:30px; text-align:center; }
.choisen-archive-pagination a, .choisen-cat-pagination a { color:#FF6E33; }
.choisen-archive-pagination a:hover, .choisen-cat-pagination a:hover { color:#FF3F7A; }

@media (max-width: 1024px) {
  .choisen-archive-grid, .choisen-cat-grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 640px) {
  .choisen-archive-grid, .choisen-cat-grid { grid-template-columns: 1fr; }
  .choisen-archive-title, .choisen-cat-title { font-size:30px; }
}

/* FIX: Mobile dropdown overlap & drawer behavior */
@media (max-width: 980px) {

  /* Mobile menu - fixed drawer style (prevents overlap) */
  .choisen-menu.mobile-open {
    position: fixed !important;
    top: 68px;
    right: 12px;
    width: calc(92% - 24px);
    max-width: 380px;
    background: rgba(0,0,0,0.96);
    border-radius: 14px;
    padding: 18px;
    z-index: 3200 !important;
    overflow-y: auto;
    max-height: calc(100vh - 96px);
    backdrop-filter: blur(10px);
    box-shadow: -20px 40px 90px rgba(0,0,0,0.6);
    display: flex !important;          /* FORCE drawer visible */
    flex-direction: column !important; /* ensure stacked items */
  }

  /* Submenu spacing – prevent stacking over next items */
  .choisen-menu.mobile-open li { margin-bottom: 10px; }

  /* Submenu inside mobile drawer */
  .choisen-menu.mobile-open li.open-mobile > .sub-menu {
    position: relative !important;
    display: block !important;
    background: rgba(255,255,255,0.04) !important;
    border-radius: 10px;
    padding: 10px !important;
    margin-top: 8px;
    z-index: 3100;
    max-height: 999px;
  }

  /* Parent buttons stay isolated */
  .choisen-menu.mobile-open > li > a { z-index: 3200; position: relative; }

  /* MOBILE: place toggle to extreme right but to left of search icon */
  .choisen-mobile-toggle { display:inline-flex; order:3; margin-left:auto; }
  .choisen-aux { order:4; display:flex; gap:10px; align-items:center; }
  .choisen-search-icon { order:4; } /* search stays far right */
}


/* Ensure the sidebar column remains visible and does not collapse */
.choisen-sidebar-wrap,
#choisen-sidebar,
.sidebar.widget-area {
  min-width: 260px;
  width: 320px;
  box-sizing: border-box;
}
@media (max-width: 920px) {
  .choisen-sidebar-wrap,
  #choisen-sidebar,
  .sidebar.widget-area {
    width: 100% !important;
    min-width: 0;
  }
}
