/* ===== CULTURAL THEME SYSTEM ===== */
/* ===== ACTIVE LANGUAGE HIGHLIGHTING (CULTURAL THEMED) ===== */
/* ===== ACTIVE LANGUAGE HIGHLIGHTING ===== */
#lang-menu button.active {
  background: linear-gradient(90deg,
    var(--accent-primary, #007cba) 4px,
    rgba(0, 124, 186, 0.1) 4px
  );
  border-left: 4px solid var(--accent-primary, #007cba) !important;
  position: relative;
}

#lang-menu button.active .lang-option div:first-child {
  font-weight: 700;
  color: var(--accent-primary, #007cba);
}

/* Ensure the border shows even if there are conflicting styles */
#lang-menu button.active {
  border: none;
  border-left: 4px solid var(--accent-primary, #007cba) !important;
  box-shadow: inset 4px 0 0 var(--accent-primary, #007cba);
}
/* Core Languages */
.lang-fr {
  --culture-primary: #0055A4;
  --culture-secondary: #EF4135;
  --culture-accent: #FFFFFF;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-fr-ca {
  --culture-primary: #003F7F;
  --culture-secondary: #FFD700;
  --culture-accent: #DC143C;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-es {
  --culture-primary: #C60B1E;
  --culture-secondary: #FFC400;
  --culture-accent: #C60B1E;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-de {
  --culture-primary: #000000;
  --culture-secondary: #DE0000;
  --culture-accent: #FFCE00;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-it {
  --culture-primary: #009246;
  --culture-secondary: #CE2B37;
  --culture-accent: #FFFFFF;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-pt {
  --culture-primary: #006600;
  --culture-secondary: #FF0000;
  --culture-accent: #FFD700;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-ru {
  --culture-primary: #0039A6;
  --culture-secondary: #D52B1E;
  --culture-accent: #FFFFFF;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-zh {
  --culture-primary: #DE2910;
  --culture-secondary: #FFDE00;
  --culture-accent: #DE2910;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-ja {
  --culture-primary: #BC002D;
  --culture-secondary: #FFFFFF;
  --culture-accent: #BC002D;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-ar {
  --culture-primary: #007A3D;
  --culture-secondary: #CE1126;
  --culture-accent: #000000;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-hi {
  --culture-primary: #FF9933;
  --culture-secondary: #138808;
  --culture-accent: #FFFFFF;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-nl {
  --culture-primary: #21468B;
  --culture-secondary: #AE1C28;
  --culture-accent: #FFFFFF;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-sv {
  --culture-primary: #006AA7;
  --culture-secondary: #FECC00;
  --culture-accent: #006AA7;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-no {
  --culture-primary: #BA0C2F;
  --culture-secondary: #00205B;
  --culture-accent: #FFFFFF;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-ko {
  --culture-primary: #003478;
  --culture-secondary: #CD2E3A;
  --culture-accent: #FFFFFF;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

/* Indigenous Languages */
.lang-mic {
  --culture-primary: #8B4513;
  --culture-secondary: #DAA520;
  --culture-accent: #228B22;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-lut {
  --culture-primary: #2F4F4F;
  --culture-secondary: #CD853F;
  --culture-accent: #006400;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-nuk {
  --culture-primary: #1F4A54;
  --culture-secondary: #8C4A2F;
  --culture-accent: #E6BE8A;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-hur {
  --culture-primary: #37474F;
  --culture-secondary: #8D6E63;
  --culture-accent: #C5E1A5;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-iu-cans,
.lang-iu-Cans {
  --culture-primary: #004C97;
  --culture-secondary: #A7D3F2;
  --culture-accent: #FFFFFF;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

.lang-crk-cans,
.lang-crk-Cans {
  --culture-primary: #7B1FA2;
  --culture-secondary: #CE93D8;
  --culture-accent: #FFE082;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

/* Chinese Variants */
.lang-zh-hans,
.lang-zh-Hans,
.lang-zh-hant,
.lang-zh-Hant,
.lang-yue-hant,
.lang-yue-Hant {
  --culture-primary: #DE2910;
  --culture-secondary: #FFDE00;
  --culture-accent: #DE2910;
  --accent-primary: var(--culture-primary);
  --accent-secondary: var(--culture-secondary);
  --accent-gold: var(--culture-accent);
}

/* ===== FLAG SYSTEM ===== */

.lang-flag {
  position: relative;
  width: 24px;
  height: 16px;
  border-radius: 2px;
  flex-shrink: 0;
  background-size: cover;
  background-position: center;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.12);
  font-feature-settings: "tnum" 1;
}

/* Major Country Flags */
.flag-en { background: linear-gradient(45deg, #012169 25%, #FFF 25%, #FFF 50%, #C8102E 50%); }
.flag-fr { background: linear-gradient(90deg, #0055A4 33%, #FFF 33%, #FFF 66%, #EF4135 66%); }
.flag-es { background: linear-gradient(0deg, #C60B1E 25%, #FFC400 25%, #FFC400 75%, #C60B1E 75%); }
.flag-de { background: linear-gradient(0deg, #000 33%, #DE0000 33%, #DE0000 66%, #FFCE00 66%); }
.flag-it { background: linear-gradient(90deg, #009246 33%, #FFF 33%, #FFF 66%, #CE2B37 66%); }
.flag-pt { background: linear-gradient(90deg, #060 40%, #F00 40%); }
.flag-ru { background: linear-gradient(0deg, #FFF 33%, #039 33%, #039 66%, #D52B1E 66%); }
.flag-zh { background: #DE2910; }
.flag-ja { background: radial-gradient(circle, #BC002D 30%, #FFF 30%); }
.flag-ar { background: linear-gradient(0deg, #000 25%, #FFF 25%, #FFF 50%, #007A3D 50%, #007A3D 75%, #CE1126 75%); }
.flag-hi,
.flag-in { background: linear-gradient(0deg, #F93 33%, #FFF 33%, #FFF 66%, #138808 66%); }
.flag-nl { background: linear-gradient(0deg, #21468B 33%, #FFF 33%, #FFF 66%, #AE1C28 66%); }
.flag-sv { background: linear-gradient(90deg, #06A 40%, #FECC00 40%, #FECC00 60%, #06A 60%); }
.flag-no { background: linear-gradient(90deg, #BA0C2F 25%, #FFF 25%, #FFF 40%, #00205B 40%, #00205B 60%, #FFF 60%, #FFF 75%, #BA0C2F 75%); }
.flag-ko { background: linear-gradient(45deg, #003478 25%, #FFF 25%, #FFF 75%, #CD2E3A 75%); }

/* Regional/Country Flags */
.flag-ph { background: linear-gradient(0deg, #0038A8 50%, #CE1126 50%); }
.flag-pk { background: linear-gradient(90deg, #FFF 25%, #01411C 25%); }
.flag-ir { background: linear-gradient(0deg, #239F40 33%, #FFF 33%, #FFF 66%, #DA0000 66%); }
.flag-ua { background: linear-gradient(0deg, #005BBB 50%, #FFD500 50%); }
.flag-pl { background: linear-gradient(0deg, #FFF 50%, #DC143C 50%); }
.flag-ro { background: linear-gradient(90deg, #002B7F 33%, #FCD116 33%, #FCD116 66%, #CE1126 66%); }
.flag-gr { background: linear-gradient(0deg, #0D5EAF 50%, #FFF 50%); }
.flag-tr { background: #E30A17; }
.flag-bd { background: radial-gradient(circle, #006A4E 40%, #F42A41 40%); }
.flag-lk { background: linear-gradient(90deg, #FF7900 25%, #006A4E 25%, #006A4E 75%, #FF7900 75%); }
.flag-vi { background: linear-gradient(0deg, #DA251D 33%, #FFFF00 33%, #FFFF00 66%, #DA251D 66%); }
.flag-ng { background: linear-gradient(90deg, #008751 33%, #FFF 33%, #FFF 66%, #008751 66%); }
.flag-rw { background: linear-gradient(0deg, #00A1DE 25%, #FAD201 25%, #FAD201 50%, #00A1DE 50%, #00A1DE 75%, #009639 75%); }
.flag-et { background: linear-gradient(0deg, #078930 33%, #FCDD09 33%, #FCDD09 66%, #DA121A 66%); }
.flag-so { background: linear-gradient(0deg, #4189DD 50%, #FFF 50%); }
.flag-ke { background: linear-gradient(0deg, #000 25%, #FFF 25%, #FFF 50%, #000 50%, #000 75%, #006600 75%); }
.flag-ca { background: linear-gradient(90deg, #FF0000 25%, #FFF 25%, #FFF 75%, #FF0000 75%); }

/* Indigenous Symbolic Flags */
.flag-mic { background: linear-gradient(45deg, #8B4513 25%, #DAA520 25%, #DAA520 75%, #228B22 75%); }
.flag-lut { background: linear-gradient(0deg, #2F4F4F 50%, #CD853F 50%); }
.flag-nuk { background: linear-gradient(135deg, #1F4A54 50%, #8C4A2F 50%); }
.flag-hur { background: linear-gradient(135deg, #37474F 50%, #8D6E63 50%); }

/* Constructed Languages */
.flag-eo { background: linear-gradient(90deg, #00a86b 67%, #fff 67%); }
.flag-tok { background: linear-gradient(135deg, #f5f5f5 50%, #1f2937 50%); }
.flag-tlh {
  background:
    radial-gradient(circle at 50% 35%, #000 0 14%, transparent 14%),
    conic-gradient(from 0.15turn, #000 0 0.12turn, transparent 0 1turn),
    linear-gradient(#7a0b0b, #7a0b0b);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.25);
}

/* ===== FALLBACK FLAG CHIPS ===== */
.flag-fallback {
  background: var(--bg-secondary) !important;
  position: relative;
}

.flag-fallback::after {
  content: attr(data-code);
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 10px;
  line-height: 1;
  color: var(--text-primary);
  background: var(--bg-secondary);
}

/* ===== LANGUAGE OPTION STYLING ===== */
.lang-option {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  text-align: left;
}

.lang-option div:last-child {
  min-width: 0;
  flex: 1;
}

.lang-option div:last-child > div:first-child {
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.lang-option div:last-child > div:last-child {
  font-size: 0.8em;
  opacity: 0.8;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ===== DROPDOWN MENU ENHANCEMENTS ===== */
.lang-menu.dropdown-menu {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.25rem;
  min-width: 400px;
  max-width: 650px;
}

.lang-menu button {
  justify-content: flex-start;
  text-align: left;
}

/* ===== MOBILE RESPONSIVE ===== */
@media (max-width: 768px) {
  .lang-menu.dropdown-menu {
    grid-template-columns: 1fr;
    min-width: 280px;
  }

  .lang-flag {
    width: 28px;
    height: 18px;
  }
}