/*
  German in Context — Home FAQ Warm Night V15
  Scope: Home FAQ only, Warm Night only.

  V15 = V15 app-panel preserved + visible warm-cream answer gradient + plus/minus toggle.
  Goal:
  - stop treating every FAQ as a separate webpage card
  - create one calm, continuous premium app panel
  - compact rows, restrained cream surface, subtle dividers
  - expanded answer belongs to the same row
  - no typography inflation
*/

:root{
  --gic-faq-v15-surface:#f6f2e8;
  --gic-faq-v15-surface-open:#f8f4eb;
  --gic-faq-v15-text:#5d6b65;
  --gic-faq-v15-strong:#173f36;
  --gic-faq-v15-divider:rgba(23,63,54,.10);
  --gic-faq-v15-border:rgba(181,154,94,.22);
  --gic-faq-v15-icon:#eee8d9;
  --gic-faq-v15-accent:#a98232;
}

:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list{
  display:block!important;
  width:100%!important;
  max-width:640px!important;
  margin:0 auto!important;
  padding:0!important;
  background:var(--gic-faq-v15-surface)!important;
  border:1px solid var(--gic-faq-v15-border)!important;
  border-radius:20px!important;
  overflow:hidden!important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.82) inset,
    0 8px 24px rgba(0,0,0,.055)!important;
}

/* The FAQ becomes a single panel. Adjacent details are rows, not cards. */
:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item{
  position:relative!important;
  display:block!important;
  width:100%!important;
  box-sizing:border-box!important;
  margin:0!important;
  padding:0!important;
  min-height:0!important;
  height:auto!important;

  background:var(--gic-faq-v15-surface)!important;
  background-image:none!important;
  color:var(--gic-faq-v15-text)!important;

  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  overflow:hidden!important;

  opacity:1!important;
  filter:none!important;
  mix-blend-mode:normal!important;

  transition:background-color .18s ease!important;
}

:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item + .faq-item{
  border-top:1px solid var(--gic-faq-v15-divider)!important;
}

:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item[open]{
  background:var(--gic-faq-v15-surface-open)!important;
}

:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item:hover{
  background:var(--gic-faq-v15-surface-open)!important;
}

/* =========================================================
   QUESTION ROW
   ========================================================= */
:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item summary{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  width:100%!important;
  min-height:62px!important;
  box-sizing:border-box!important;

  margin:0!important;
  padding:13px 60px 13px 18px!important;

  color:var(--gic-faq-v15-strong)!important;
  -webkit-text-fill-color:var(--gic-faq-v15-strong)!important;

  font-family:inherit!important;
  font-size:16px!important;
  line-height:1.34!important;
  font-weight:600!important;
  letter-spacing:-.006em!important;

  text-shadow:none!important;
  -webkit-font-smoothing:antialiased!important;
  -webkit-text-size-adjust:100%!important;
  text-size-adjust:100%!important;

  cursor:pointer!important;
  list-style:none!important;
}

:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item summary::-webkit-details-marker{
  display:none!important;
}
:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item summary::marker{
  content:""!important;
  display:none!important;
}

/* Kill legacy title sizing only inside the owned FAQ. */
:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item summary :where(
  .faq-q,.faq-question,.faq-title,.question,.faq-question-text
){
  display:block!important;
  flex:1 1 auto!important;
  min-width:0!important;
  width:auto!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;

  color:var(--gic-faq-v15-strong)!important;
  -webkit-text-fill-color:var(--gic-faq-v15-strong)!important;

  font-family:inherit!important;
  font-size:16px!important;
  line-height:1.34!important;
  font-weight:600!important;
  letter-spacing:-.006em!important;

  text-shadow:none!important;
  opacity:1!important;
  -webkit-font-smoothing:antialiased!important;
  -webkit-text-size-adjust:100%!important;
  text-size-adjust:100%!important;
}

/* =========================================================
   TOGGLE — real control if present, otherwise synthesized
   ========================================================= */
:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item summary :where(
  .faq-icon,.faq-toggle,button,[role="button"]
){
  position:absolute!important;
  right:14px!important;
  top:50%!important;
  transform:translateY(-50%)!important;

  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;

  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  min-height:34px!important;
  max-width:34px!important;
  max-height:34px!important;

  margin:0!important;
  padding:0!important;

  background:var(--gic-faq-v15-icon)!important;
  border:1px solid rgba(181,154,94,.16)!important;
  border-radius:50%!important;
  box-shadow:none!important;

  color:var(--gic-faq-v15-accent)!important;
  -webkit-text-fill-color:var(--gic-faq-v15-accent)!important;
  font-family:inherit!important;
  font-size:17px!important;
  line-height:1!important;
  font-weight:500!important;
  font-size:0!important;
  line-height:0!important;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
}

/* V15: normalize the real toggle too — closed = plus, open = minus. */
:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item summary :where(
  .faq-icon,.faq-toggle,button,[role="button"]
)::before{
  content:"+"!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  height:100%!important;
  font-family:inherit!important;
  font-size:18px!important;
  line-height:1!important;
  font-weight:500!important;
  color:var(--gic-faq-v15-accent)!important;
  -webkit-text-fill-color:var(--gic-faq-v15-accent)!important;
}

:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item[open] summary :where(
  .faq-icon,.faq-toggle,button,[role="button"]
)::before{
  content:"−"!important;
  font-size:18px!important;
}

/* Hide a legacy SVG/text icon inside the controlled circle so V15 owns the glyph. */
:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item summary :where(
  .faq-icon,.faq-toggle,button,[role="button"]
) > svg{
  display:none!important;
}

:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item summary:not(:has(.faq-icon,.faq-toggle,button,[role="button"]))::after{
  content:"+"!important;
  position:absolute!important;
  right:14px!important;
  top:50%!important;
  transform:translateY(-50%)!important;

  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;

  width:34px!important;
  height:34px!important;

  background:var(--gic-faq-v15-icon)!important;
  border:1px solid rgba(181,154,94,.16)!important;
  border-radius:50%!important;
  box-shadow:none!important;

  color:var(--gic-faq-v15-accent)!important;
  -webkit-text-fill-color:var(--gic-faq-v15-accent)!important;

  font-family:inherit!important;
  font-size:18px!important;
  line-height:1!important;
  font-weight:500!important;
  text-align:center!important;

  pointer-events:none!important;
}

:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item[open] summary:not(:has(.faq-icon,.faq-toggle,button,[role="button"]))::after{
  content:"−"!important;
  font-size:18px!important;
}

/* =========================================================
   ANSWER — quieter than the question, still comfortable
   ========================================================= */
:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item :where(
  p,.faq-a,.faq-answer,.faq-content
){
  color:var(--gic-faq-v15-text)!important;
  -webkit-text-fill-color:var(--gic-faq-v15-text)!important;

  font-family:inherit!important;
  font-size:15px!important;
  line-height:1.56!important;
  font-weight:400!important;
  letter-spacing:0!important;

  text-shadow:none!important;
  opacity:1!important;
  -webkit-font-smoothing:antialiased!important;
  -webkit-text-size-adjust:100%!important;
  text-size-adjust:100%!important;
}

:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item > :where(
  .faq-a,.faq-answer,.faq-content
),
:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item > p{
  box-sizing:border-box!important;
  margin:0!important;
  padding:0 18px 17px!important;
}

/* V15: answer-only surface depth — light warm cream to slightly deeper warm cream. */
:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item[open] > :where(
  .faq-a,.faq-answer,.faq-content
),
:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item[open] > p{
  background:linear-gradient(
    180deg,
    #fcf9f1 0%,
    #f5efe2 50%,
    #e6dac5 100%
  )!important;
  background-color:#f5efe2!important;
}

:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item[open] summary{
  border-bottom:1px solid var(--gic-faq-v15-divider)!important;
}

:is(
  html[data-gic-theme="dark"],
  html[data-gic-warm-night-notify="dark"],
  html[data-theme="dark"],
  html.dark,
  html.dark-mode,
  html.night-mode,
  html.gic-dark
) body .gic-faq-v15-list > .faq-item[open] :where(
  p,.faq-a,.faq-answer,.faq-content
){
  animation:gicFaqV14AnswerIn .16s ease-out both!important;
}

@keyframes gicFaqV14AnswerIn{
  from{opacity:.01;transform:translateY(-2px)}
  to{opacity:1;transform:translateY(0)}
}


/* =========================================================
   MOBILE
   ========================================================= */
@media (max-width:600px){
  :is(
    html[data-gic-theme="dark"],
    html[data-gic-warm-night-notify="dark"],
    html[data-theme="dark"],
    html.dark,
    html.dark-mode,
    html.night-mode,
    html.gic-dark
  ) body .gic-faq-v15-list{
    max-width:none!important;
    border-radius:18px!important;
    box-shadow:
      0 1px 0 rgba(255,255,255,.82) inset,
      0 6px 18px rgba(0,0,0,.05)!important;
  }

  :is(
    html[data-gic-theme="dark"],
    html[data-gic-warm-night-notify="dark"],
    html[data-theme="dark"],
    html.dark,
    html.dark-mode,
    html.night-mode,
    html.gic-dark
  ) body .gic-faq-v15-list > .faq-item summary{
    min-height:60px!important;
    padding:12px 58px 12px 17px!important;
    font-size:16px!important;
    line-height:1.30!important;
  }

  :is(
    html[data-gic-theme="dark"],
    html[data-gic-warm-night-notify="dark"],
    html[data-theme="dark"],
    html.dark,
    html.dark-mode,
    html.night-mode,
    html.gic-dark
  ) body .gic-faq-v15-list > .faq-item summary :where(
    .faq-q,.faq-question,.faq-title,.question,.faq-question-text
  ){
    font-size:16px!important;
    line-height:1.30!important;
  }

  :is(
    html[data-gic-theme="dark"],
    html[data-gic-warm-night-notify="dark"],
    html[data-theme="dark"],
    html.dark,
    html.dark-mode,
    html.night-mode,
    html.gic-dark
  ) body .gic-faq-v15-list > .faq-item summary:not(:has(.faq-icon,.faq-toggle,button,[role="button"]))::after{
    right:13px!important;
    width:34px!important;
    height:34px!important;
  }

  :is(
    html[data-gic-theme="dark"],
    html[data-gic-warm-night-notify="dark"],
    html[data-theme="dark"],
    html.dark,
    html.dark-mode,
    html.night-mode,
    html.gic-dark
  ) body .gic-faq-v15-list > .faq-item :where(
    p,.faq-a,.faq-answer,.faq-content
  ){
    font-size:15px!important;
    line-height:1.56!important;
  }

  :is(
    html[data-gic-theme="dark"],
    html[data-gic-warm-night-notify="dark"],
    html[data-theme="dark"],
    html.dark,
    html.dark-mode,
    html.night-mode,
    html.gic-dark
  ) body .gic-faq-v15-list > .faq-item > :where(
    .faq-a,.faq-answer,.faq-content
  ),
  :is(
    html[data-gic-theme="dark"],
    html[data-gic-warm-night-notify="dark"],
    html[data-theme="dark"],
    html.dark,
    html.dark-mode,
    html.night-mode,
    html.gic-dark
  ) body .gic-faq-v15-list > .faq-item > p{
    padding-left:17px!important;
    padding-right:17px!important;
    padding-bottom:16px!important;
  }
}