/* The selector uses an explicit palette so it remains legible in both themes. */
.theme-selector { position: relative; order: 2; flex: 0 0 auto; margin-left: 0.75rem; }
.main-nav { order: 1; }
.theme-selector-trigger { display: flex; align-items: center; justify-content: center; gap: .35rem; min-width: 44px; min-height: 44px; padding: .45rem .65rem; border: 1px solid var(--color-border, #d9dce3); border-radius: .6rem; background: var(--color-bg, #fff); color: var(--color-text, #20232b); cursor: pointer; list-style: none; font-size: .8rem; font-weight: 600; }
.theme-selector-trigger::-webkit-details-marker { display: none; }
.theme-selector-trigger svg, .theme-choice svg { display: block; width: 22px; height: 22px; flex: none; }
.theme-selector-trigger:hover { border-color: var(--color-primary, #cc2525); }
.theme-selector-trigger:focus-visible, .theme-choice input:focus-visible + .theme-choice-content { outline: 3px solid #2563eb; outline-offset: 2px; }
.theme-selector-panel { position: absolute; z-index: 150; right: 0; top: calc(100% + .55rem); width: min(320px, calc(100vw - 2rem)); padding: 1rem; border: 1px solid #d5dbe5; border-radius: .9rem; background: #fff; color: #202a38; box-shadow: 0 12px 32px rgba(0, 0, 0, .18); }
.theme-selector-title { margin: 0 0 .65rem; font-size: .9rem; font-weight: 700; }
.theme-selector-options { display: grid; grid-template-columns: repeat(3, 1fr); padding: .25rem; gap: .2rem; border: 1px solid #cbd4e0; border-radius: .7rem; background: #f3f5f9; }
.theme-choice { position: relative; cursor: pointer; min-width: 0; margin: 0; }
.theme-choice input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.theme-choice-content { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .3rem; min-height: 68px; padding: .45rem .15rem; border-radius: .5rem; font-size: .78rem; line-height: 1.25; font-weight: 600; text-align: center; color: #334155; }
.theme-choice:hover .theme-choice-content { background: #e3e9f2; }
.theme-choice input:checked + .theme-choice-content { color: #fff; background: #2563eb; }
.theme-selector-note { margin: .65rem 0 0; font-size: .72rem; line-height: 1.45; color: #64748b; }
html[data-theme="dark"] .theme-selector-panel { background: #1b283c; border-color: #50617b; color: #f4f7fc; }
html[data-theme="dark"] .theme-selector-options { background: #122039; border-color: #51617a; }
html[data-theme="dark"] .theme-choice-content { color: #e4ebf5; }
html[data-theme="dark"] .theme-choice:hover .theme-choice-content { background: #30415b; }
html[data-theme="dark"] .theme-choice input:checked + .theme-choice-content { background: #285bb2; color: #fff; }
html[data-theme="dark"] .theme-selector-note { color: #bdc9d9; }
@media (max-width: 1000px) { .theme-trigger-label { display: none; } }
/* Keep the six desktop menu items and the selector within tablet widths. */
@media (min-width: 769px) and (max-width: 1100px) {
  .header-container .logo-image { max-width: 150px; }
  .header-container .nav-list { gap: .5rem; }
  .header-container .nav-item a { font-size: .72rem; white-space: nowrap; }
  .header-container .theme-selector { margin-left: .4rem; }
}
@media (max-width: 768px) {
  .header-container .logo { margin-right: auto; min-width: 0; }
  .header-container .logo-image { max-width: min(210px, calc(100vw - 140px)); }
  .theme-selector { order: 1; margin: 0 .25rem 0 .5rem; }
  .mobile-menu-toggle { order: 2; flex: 0 0 44px; }
  .main-nav { order: 3; }
}