/*!
Theme Name: Blocksy Child
Theme URI: https://creativethemes.com/blocksy/
Description: Child theme for Blocksy to support custom Knowledge Base routing and Sprint 2 UI Tokens.
Author: Custom Dev
Template: blocksy
Version: 1.0.0
Text Domain: blocksy-child
*/

/* ==========================================================================
   SPRINT 2: UNIFIED DESIGN TOKENS & COMPONENT ENGINE STYLESHEET
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Exo+2:wght@700;800&family=Lato:wght@300;400&family=Raleway:ital,wght@1,400&display=swap');

/* 1. Global Color Token Palette */
:root {
  /* Core Theme Colors */
  --amber: #FFB300;
  --amber2: #E0A200;
  --navy: #252B52;
  --navy2: #1E2245;
  --dark: #1A1A2E;
  --gray: #8B8FA8;
  --white: #FFFFFF;
  --light: #E8ECEF;
  --muted: #F5F5F7;

  /* Context Engine High-Contrast Color Bands */
  --ci-bg: #FEF3C7; --ci-tx: #92400E; --ci-bd: #FDE68A; /* Industry (Gold) */
  --cs-bg: #DBEAFE; --cs-tx: #1E40AF; --cs-bd: #BFDBFE; /* System Layer (Blue) */
  --cp-bg: #D1FAE5; --cp-tx: #065F46; --cp-bd: #A7F3D0; /* Impact Layer (Green) */
  --ct-bg: #F3F4F6; --ct-tx: #374151; --ct-bd: #E5E7EB; /* Term Type (Gray) */

  /* Page Structural Defaults */
  --body-bg: #F7F8FA;
  --card-bg: #FFFFFF;
  --border: #E2E4EB;
}

/* 2. Global Base Typographic Assignments */
body,
.blocksy-breakout-container,
.ce-wiki-master-layout {
  background-color: var(--body-bg) !important;
  color: var(--dark) !important;
  font-family: 'Lato', sans-serif !important;
  font-weight: 400;
}

.blocksy-breakout-container h1,
.blocksy-breakout-container h2,
.blocksy-breakout-container h3,
.blocksy-breakout-container h4,
.ce-wiki-master-layout h1,
.ce-wiki-master-layout h2,
.ce-wiki-master-layout h3,
.ce-wiki-master-layout h4 {
  font-family: 'Exo 2', sans-serif !important;
  color: var(--navy) !important;
}

.blocksy-breakout-container h1.node-title,
.ce-wiki-master-layout h1.node-title {
  font-family: 'Exo 2', sans-serif !important;
  font-size: 44px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  margin: 0 0 8px 0 !important;
}

.blocksy-breakout-container .aka,
.ce-wiki-master-layout .aka {
  font-family: 'Raleway', sans-serif !important;
  font-size: 16px !important;
  color: var(--gray) !important;
  margin: 0 0 20px 0 !important;
  font-style: italic !important;
}

/* 3. Taxonomy Pill Chips (Horizontal Row Layout Component) */
.chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 30px;
}

.chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: 'Exo 2', sans-serif !important;
  font-weight: 700;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.25rem 0.75rem;
  border-radius: 50px;
  border: 1px solid transparent;
  line-height: 1;
  white-space: nowrap;
}
.chip.industry { background-color: var(--ci-bg) !important; color: var(--ci-tx) !important; border-color: var(--ci-bd) !important; }
.chip.system   { background-color: var(--cs-bg) !important; color: var(--cs-tx) !important; border-color: var(--cs-bd) !important; }
.chip.impact   { background-color: var(--cp-bg) !important; color: var(--cp-tx) !important; border-color: var(--cp-bd) !important; }
.chip.type     { background-color: var(--ct-bg) !important; color: var(--ct-tx) !important; border-color: var(--ct-bd) !important; }

/* 4. Left Column Content Blocks (Workstream A) */
.definition-block {
  background-color: var(--cs-bg) !important;
  color: var(--cs-tx) !important;
  border: 1px solid var(--cs-bd) !important;
  border-radius: 6px;
  padding: 1.5rem;
  margin-bottom: 1.5rem;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.definition-block p { font-size: 1.1rem; line-height: 1.5; margin: 0; color: var(--cs-tx) !important; }

.section-block {
  background-color: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: 6px;
  margin-bottom: 2rem;
  overflow: hidden;
}
.block-header {
  background-color: var(--muted) !important;
  border-bottom: 1px solid var(--border) !important;
  padding: 0.75rem 1.25rem;
}
.block-header .title {
  font-family: 'Exo 2', sans-serif !important;
  font-weight: 700 !important;
  font-size: 0.85rem !important;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--gray) !important;
  margin: 0;
}
.section-block .block-body {
  padding: 1.5rem;
}
.section-block .block-body p { margin: 0 0 1rem 0; line-height: 1.6; }
.section-block .block-body p:last-child { margin-bottom: 0; }

.key-points-block {
  background-color: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: 6px;
  margin-bottom: 2rem;
  overflow: hidden;
}
.kp-header {
  background-color: var(--navy) !important;
  padding: 1rem 1.5rem;
}
.kp-header .title {
  font-family: 'Exo 2', sans-serif !important;
  font-weight: 700 !important;
  color: var(--white) !important;
  margin: 0;
}
.key-points-block .block-body { padding: 1.5rem; }
.key-points-block ul { padding-left: 1.25rem; margin: 0; }
.key-points-block li { margin-bottom: 0.75rem; color: var(--dark) !important; line-height: 1.5; }

.ce-take {
  background-color: var(--muted) !important;
  border-left: 4px solid var(--amber) !important;
  border-top: 1px solid var(--border) !important;
  border-right: 1px solid var(--border) !important;
  border-bottom: 1px solid var(--border) !important;
  border-radius: 0 6px 6px 0;
  padding: 1.25rem 1.5rem;
  margin-bottom: 1.5rem;
}
.take-label {
  font-family: 'Exo 2', sans-serif !important;
  font-weight: 800 !important;
  color: var(--amber2) !important;
  text-transform: uppercase;
  font-size: 0.85rem;
  letter-spacing: 0.05em;
  display: block;
  margin-bottom: 0.5rem;
}
.ce-take p {
  font-family: 'Raleway', sans-serif !important;
  font-style: italic !important;
  font-weight: 400;
  color: var(--dark) !important;
  margin: 0;
  line-height: 1.6;
}

/* 5. Right Column Sidebar Component Cards (Workstream B) */
.sidebar-block {
  background-color: var(--card-bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: 6px;
  padding: 1.25rem;
  margin-bottom: 1.5rem;
}
.sidebar-block .sb-header {
  border-bottom: 1px solid var(--border) !important;
  padding-bottom: 0.5rem;
  margin-bottom: 1rem;
}
.sidebar-block .sb-title {
  font-family: 'Exo 2', sans-serif !important;
  font-weight: 700;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--gray) !important;
  margin: 0;
}

.meta-property-list {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}
.meta-property-row {
  display: flex;
  flex-direction: column;
  line-height: 1.4;
}
.meta-property-label {
  font-family: 'Lato', sans-serif !important;
  font-weight: 300;
  font-size: 0.8rem;
  color: var(--gray) !important;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.meta-property-value {
  font-family: 'Lato', sans-serif !important;
  font-weight: 400;
  font-size: 0.95rem;
  color: var(--dark) !important;
  word-break: break-word;
}

.context-stack {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.context-block-item {
  padding: 0.75rem 1rem;
  border-radius: 4px;
  border: 1px solid transparent;
}
.context-block-item .label {
  display: block;
  font-family: 'Exo 2', sans-serif !important;
  font-weight: 700;
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 0.25rem;
}
.context-block-item .value {
  font-family: 'Lato', sans-serif !important;
  font-weight: 400;
  font-size: 0.95rem;
}
.context-block-item.system   { background-color: var(--cs-bg) !important; color: var(--cs-tx) !important; border-color: var(--cs-bd) !important; }
.context-block-item.impact   { background-color: var(--cp-bg) !important; color: var(--cp-tx) !important; border-color: var(--cp-bd) !important; }
.context-block-item.industry { background-color: var(--ci-bg) !important; color: var(--ci-tx) !important; border-color: var(--ci-bd) !important; }

.status-pill-container {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: 'Exo 2', sans-serif !important;
  font-weight: 700;
  font-size: 0.85rem;
  text-transform: uppercase;
  color: var(--dark) !important;
}
.status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
}
.status-dot.publish { background-color: #10B981 !important; box-shadow: 0 0 8px rgba(16, 185, 129, 0.4); }
.status-dot.draft   { background-color: var(--amber) !important; box-shadow: 0 0 8px rgba(255, 179, 0, 0.4); }
.status-dot.other   { background-color: var(--gray) !important; }