/* German in Context — Method only · Night legibility + tactile learning tabs V3.
   Leaves editorial content, player buttons, the actual tab JS and all other routes untouched.
   Dark selectors deliberately outrank legacy light example text colors (including !important). */

/* Make Grammar / Pronunciation / Language Kit unmistakable, equal-width buttons. */
.gic-method-v3 .gic-method-v2-layers-shell .gic-method-v2-tab-strip {
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-items:stretch!important;
  gap:10px!important;
  padding:18px clamp(12px,3vw,28px)!important;
  overflow:visible!important;
  background:#eff4ef!important;
  border-bottom:1px solid #d3e1d6!important;
}
.gic-method-v3 .gic-method-v2-layers-shell .gic-method-v2-tab {
  box-sizing:border-box!important;
  display:flex!important;
  flex:initial!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:0!important;
  width:100%!important;
  min-height:55px!important;
  margin:0!important;
  padding:11px 7px!important;
  border:1.5px solid #9dbbad!important;
  border-radius:16px!important;
  background:linear-gradient(180deg,#ffffff,#ecf3ed)!important;
  color:#1d5547!important;
  text-align:center!important;
  font:800 clamp(10.6px,2.8vw,13px)/1.2 Manrope,Inter,system-ui,sans-serif!important;
  letter-spacing:-.01em!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  cursor:pointer!important;
  transform:none!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 3px 0 #aac3b6,0 7px 13px rgba(22,64,49,.09)!important;
  transition:background .16s ease,box-shadow .16s ease,transform .1s ease!important;
  -webkit-tap-highlight-color:transparent;
}
.gic-method-v3 .gic-method-v2-layers-shell .gic-method-v2-tab:is(.is-active,[aria-selected="true"]) {
  border-color:#1f745f!important;
  background:linear-gradient(145deg,#23836d,#115744)!important;
  color:#ffffff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 3px 0 #0e4639,0 9px 18px rgba(13,76,57,.17)!important;
}
.gic-method-v3 .gic-method-v2-layers-shell .gic-method-v2-tab:focus-visible {
  outline:3px solid #bf9248!important;
  outline-offset:4px!important;
}
@media (hover:hover) {
  .gic-method-v3 .gic-method-v2-layers-shell .gic-method-v2-tab:not(.is-active):hover {
    filter:brightness(1.04);
    transform:translateY(-1px)!important;
  }
}
.gic-method-v3 .gic-method-v2-layers-shell .gic-method-v2-tab:active {
  transform:translateY(2px)!important;
  box-shadow:inset 0 1px 4px rgba(0,0,0,.15),0 1px 0 rgba(5,60,44,.5)!important;
}
@media (max-width:600px) {
  .gic-method-v3 .gic-method-v2-layers-shell .gic-method-v2-tab-strip {
    gap:7px!important;
    padding:16px 12px 19px!important;
  }
  .gic-method-v3 .gic-method-v2-layers-shell .gic-method-v2-tab {
    min-height:53px!important;
    border-radius:14px!important;
    font-size:clamp(10px,2.9vw,12px)!important;
    padding:9px 3px!important;
  }
}

/* Warm, low-glare night palette; blue-gray light styles are not allowed through. */
html[data-gic-theme="dark"] .gic-method-v3 .gic-method-v2-layers-shell .gic-method-v2-tab-strip {
  background:linear-gradient(180deg,#1c352a,#223d30)!important;
  border-color:#587563!important;
}
html[data-gic-theme="dark"] .gic-method-v3 .gic-method-v2-layers-shell .gic-method-v2-tab:not(.is-active):not([aria-selected="true"]) {
  background:linear-gradient(180deg,#345d4a,#294839)!important;
  color:#f2f5e7!important;
  border-color:#7e9a84!important;
  box-shadow:inset 0 1px 0 rgba(234,246,227,.15),0 3px 0 #13291e,0 8px 13px rgba(0,11,7,.25)!important;
}
html[data-gic-theme="dark"] .gic-method-v3 .gic-method-v2-layers-shell .gic-method-v2-tab:is(.is-active,[aria-selected="true"]) {
  background:linear-gradient(160deg,#f1dba6,#dbb36b)!important;
  color:#103024!important;
  border-color:#ffebbd!important;
  box-shadow:inset 0 1px 0 rgba(255,250,236,.8),0 3px 0 #8e6c37,0 9px 18px rgba(0,11,7,.27)!important;
}
html[data-gic-theme="dark"] .gic-method-v3 .gic-method-v2-layers-shell .gic-method-v2-tab:focus-visible {
  outline-color:#fff0c7!important;
}

/* Original V3 CSS forces #183f35 on German examples: on a dark card it is invisible.
   Override both the German sentence and the pale-gray English translation. */
html[data-gic-theme="dark"] .gic-method-v3 .gic-method-v3-editorial .gic-method-v3-study-row {
  color:#edf3e7!important;
  background:#2a4639!important;
  border-color:#607866!important;
  border-left-color:#d6b979!important;
}
html[data-gic-theme="dark"] .gic-method-v3 .gic-method-v3-editorial :is(
  .gic-method-v3-example-de,
  .gic-method-v3-study-row .de,
  .gic-method-v3-study-row [lang="de"],
  .gic-method-v3-study-row .word,
  .gic-method-v3-study-row .german,
  .lk-de,
  .gic-lk-de
) {
  color:#fff4df!important;
  -webkit-text-fill-color:#fff4df!important;
  text-shadow:none!important;
}
html[data-gic-theme="dark"] .gic-method-v3 .gic-method-v3-editorial :is(
  .gic-method-v3-example-en,
  .gic-method-v3-study-row .en,
  .gic-method-v3-study-row .translation,
  .lk-en,
  .gic-lk-en
) {
  color:#d7e4d5!important;
  -webkit-text-fill-color:#d7e4d5!important;
  border-top-color:#789180!important;
  text-shadow:none!important;
}
/* Keep ordinary editorial explanations and inline emphasized words readable. */
html[data-gic-theme="dark"] .gic-method-v3 .gic-method-v3-editorial :is(p,li,small,em) {
  color:#e0ebdc!important;
}
html[data-gic-theme="dark"] .gic-method-v3 .gic-method-v3-editorial :is(strong,b) {
  color:#fff1d5!important;
}
html[data-gic-theme="dark"] .gic-method-v3 .gic-method-v3-editorial :is(h1,h2,h3,h4,h5,h6,.lk-h,.lk-title) {
  color:#f7f1df!important;
}
/* Reminder: sentence/translation palette must win over generic editorial p/strong. */
html[data-gic-theme="dark"] .gic-method-v3 .gic-method-v3-editorial :is(
  .gic-method-v3-example-de,
  .gic-method-v3-study-row .de,
  .gic-method-v3-study-row [lang="de"]
) { color:#fff4df!important; -webkit-text-fill-color:#fff4df!important; }
html[data-gic-theme="dark"] .gic-method-v3 .gic-method-v3-editorial :is(
  .gic-method-v3-example-en,
  .gic-method-v3-study-row .en
) { color:#d7e4d5!important; -webkit-text-fill-color:#d7e4d5!important; }
html[data-gic-theme="dark"] .gic-method-v3 .gic-method-v3-editorial :is(.lk-item,.lk-level,.ex,.example,.kit-row,.gic-lk-row,.gic-layer-item) {
  background:#2b4739!important;
  border-color:#617b66!important;
}
html[data-gic-theme="dark"] .gic-method-v3 .gic-method-v3-editorial :is(.lk-reply,.lk-note) {
  background:#325240!important;
  color:#e6f0e3!important;
  border-color:#76917a!important;
}
html[data-gic-theme="dark"] .gic-method-v3 .gic-method-v3-editorial :is(.lk-pill,.lk-tag,.lk-meta) {
  color:#f2dcae!important;
}
html[data-gic-theme="dark"] .gic-method-v3 .gic-method-v3-editorial .gic-method-v3-audio-button {
  background:#305847!important;
  color:#f3f5eb!important;
  border-color:#7da189!important;
}
html[data-gic-theme="dark"] .gic-method-v3 .gic-method-v3-editorial .gic-method-v3-audio-button .gic-method-v3-play-label {
  color:#f3f5eb!important;
}
@media(prefers-reduced-motion:reduce) {
  .gic-method-v3 .gic-method-v2-layers-shell .gic-method-v2-tab { transition:none!important; }
}
