/* v34: flatter liquid glass, dark-theme completion, question actions, and swipe-safe collection items. */

:root{
  --v34-blue-1:#5c93ef;
  --v34-blue-2:#3568d4;
  --v34-blue-3:#2f5fc5;
  --v34-glass-line:rgba(255,255,255,.56);
  --v34-glass-shadow:0 5px 14px rgba(41,86,180,.14);
  --v34-surface:#fff;
  --v34-surface-2:#f4f6f9;
}

/* --------------------------------------------------------------------------
   Flatter liquid-glass language
   -------------------------------------------------------------------------- */
.nav-scroll{
  border:1px solid rgba(255,255,255,.68)!important;
  background:
    linear-gradient(90deg,
      rgba(82,143,238,.14) 0,
      rgba(82,143,238,.08) var(--v32-progress),
      rgba(255,255,255,0) var(--v32-progress),
      rgba(255,255,255,0) 100%),
    linear-gradient(180deg,rgba(255,255,255,.54),rgba(241,246,252,.43))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.64),0 7px 20px rgba(39,68,112,.075)!important;
}

/* Only the selected item gets a visual pill. Inactive chips stay quiet. */
.nav-chip{
  background:transparent!important;
  border-color:transparent!important;
  box-shadow:none!important;
  color:#4e545e!important;
  text-shadow:none!important;
}
.nav-chip:hover{background:rgba(255,255,255,.26)!important}
.nav-chip.is-active{
  background:linear-gradient(180deg,rgba(91,146,239,.92),rgba(52,103,211,.94))!important;
  color:#fff!important;
  box-shadow:0 4px 12px rgba(45,91,190,.13),inset 0 1px 0 rgba(255,255,255,.32)!important;
}
.nav-scroll.v33-liquid-ready .nav-chip.is-active{
  background:transparent!important;
  box-shadow:none!important;
}

.nav-v33-indicator,
.collection-v33-indicator,
.theme-v34-indicator{
  border-radius:999px!important;
  border:1px solid rgba(255,255,255,.56)!important;
  background:linear-gradient(180deg,rgba(94,149,241,.82),rgba(53,103,211,.86))!important;
  box-shadow:0 4px 12px rgba(45,91,190,.14),inset 0 1px 0 rgba(255,255,255,.30),inset 0 -1px 0 rgba(31,72,157,.12)!important;
  -webkit-backdrop-filter:blur(15px) saturate(145%)!important;
  backdrop-filter:blur(15px) saturate(145%)!important;
}
.nav-v33-indicator::before,
.collection-v33-indicator::before,
.theme-v34-indicator::before{
  content:"";
  position:absolute;
  left:12%;
  right:12%;
  top:7%;
  height:18%;
  border-radius:999px;
  background:linear-gradient(180deg,rgba(255,255,255,.42),rgba(255,255,255,.03));
  opacity:.62;
  pointer-events:none;
}
.nav-v33-indicator::after,
.collection-v33-indicator::after,
.theme-v34-indicator::after{display:none!important}

.collection-tabs{
  background:linear-gradient(180deg,rgba(242,245,250,.72),rgba(232,237,245,.54))!important;
  border-color:rgba(31,46,74,.05)!important;
  box-shadow:inset 0 2px 5px rgba(34,48,74,.07),inset 0 -1px 0 rgba(255,255,255,.78)!important;
}
.collection-tab{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  color:#707680!important;
}
.collection-tab.is-active{
  background:linear-gradient(180deg,rgba(91,146,239,.92),rgba(52,103,211,.94))!important;
  color:#fff!important;
  box-shadow:0 4px 12px rgba(45,91,190,.13),inset 0 1px 0 rgba(255,255,255,.31)!important;
}
.collection-tabs.v33-liquid-ready .collection-tab.is-active{
  background:transparent!important;
  box-shadow:none!important;
}

/* --------------------------------------------------------------------------
   Theme chooser now uses the same recessed rail + moving liquid pill.
   -------------------------------------------------------------------------- */
.theme-choice{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  padding:4px!important;
  border:1px solid rgba(31,44,70,.055)!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,rgba(31,44,70,.045),rgba(255,255,255,.42))!important;
  box-shadow:inset 0 2px 5px rgba(31,44,70,.075),inset 0 -1px 0 rgba(255,255,255,.72)!important;
}
.theme-choice button{
  position:relative;
  z-index:1;
  border-radius:999px!important;
  background:transparent!important;
  color:#717782!important;
  box-shadow:none!important;
}
.theme-choice button.is-active{
  background:linear-gradient(180deg,rgba(91,146,239,.92),rgba(52,103,211,.94))!important;
  color:#fff!important;
  box-shadow:0 4px 12px rgba(45,91,190,.13),inset 0 1px 0 rgba(255,255,255,.31)!important;
}
.theme-choice.v34-liquid-ready button.is-active{
  background:transparent!important;
  box-shadow:none!important;
}
.theme-v34-indicator{
  position:absolute;
  z-index:0;
  left:0;
  top:0;
  width:0;
  height:0;
  pointer-events:none;
  transform:translate3d(0,0,0);
  will-change:transform,width,height;
}

/* --------------------------------------------------------------------------
   Question workspace: explicit copy / save / ChatGPT actions.
   -------------------------------------------------------------------------- */
.v34-question-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
  margin-top:10px;
}
.v34-question-actions button,
.v34-question-actions a{
  min-height:46px;
  display:grid;
  place-items:center;
  padding:0 14px;
  border-radius:16px;
  border:1px solid rgba(31,44,70,.06);
  text-decoration:none;
  font:inherit;
  font-size:13px;
  font-weight:760;
  cursor:pointer;
}
.v34-chatgpt-open{
  background:linear-gradient(180deg,#3f7be8,#3166d8)!important;
  color:#fff!important;
  box-shadow:0 5px 14px rgba(47,99,214,.15),inset 0 1px 0 rgba(255,255,255,.26)!important;
}
.v34-chatgpt-install{
  background:#f2f4f7!important;
  color:#454b55!important;
}
.v34-gpt-note{
  margin-top:8px;
  color:#8b919b;
  font-size:11px;
  line-height:1.48;
}
.v34-gpt-note.is-success{color:#3568d4}

/* --------------------------------------------------------------------------
   Saved-item removal: stable action position + swipe affordance.
   -------------------------------------------------------------------------- */
.collection-item{
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate;
}
.collection-item__thumb,
.collection-item__main,
.collection-item__question-icon{
  position:relative;
  z-index:1;
  transition:transform 220ms cubic-bezier(.22,.72,.22,1)!important;
  will-change:transform;
}
.collection-item__remove{
  position:absolute!important;
  z-index:3!important;
  top:50%!important;
  right:12px!important;
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  transform:translateY(-50%)!important;
  border-radius:999px!important;
  border:1px solid rgba(31,44,70,.065)!important;
  background:rgba(245,247,250,.94)!important;
  color:#7c828c!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82),0 3px 9px rgba(31,44,70,.045)!important;
  transition:width 190ms ease,background 190ms ease,color 190ms ease,transform 190ms ease!important;
}
.collection-item__remove svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.collection-item.is-swipe-open .collection-item__thumb,
.collection-item.is-swipe-open .collection-item__main,
.collection-item.is-swipe-open .collection-item__question-icon{
  transform:translateX(-54px)!important;
}
.collection-item.is-swipe-open .collection-item__remove{
  width:56px!important;
  background:#e94d4d!important;
  color:#fff!important;
  border-color:transparent!important;
  box-shadow:0 5px 14px rgba(196,48,48,.16)!important;
}

/* --------------------------------------------------------------------------
   Dark theme completion. Fix card surfaces and text that previously remained
   in the light palette because of component or inline backgrounds.
   -------------------------------------------------------------------------- */
html[data-theme="dark"]{
  --v34-surface:#171a20;
  --v34-surface-2:#1d2128;
}
html[data-theme="dark"] body,
html[data-theme="dark"] .app,
html[data-theme="dark"] .section,
html[data-theme="dark"] .section.grouped,
html[data-theme="dark"] .grouped{
  background:#0d0f13!important;
}

html[data-theme="dark"] .nav-scroll{
  background:
    linear-gradient(90deg,rgba(90,146,241,.15) 0,rgba(90,146,241,.08) var(--v32-progress),transparent var(--v32-progress),transparent 100%),
    linear-gradient(180deg,rgba(31,36,45,.78),rgba(19,22,28,.72))!important;
  border-color:rgba(255,255,255,.11)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 8px 24px rgba(0,0,0,.18)!important;
}
html[data-theme="dark"] .nav-chip{
  background:transparent!important;
  color:#bac1cc!important;
  border-color:transparent!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .nav-chip:hover{background:rgba(255,255,255,.045)!important}
html[data-theme="dark"] .nav-chip.is-active{color:#fff!important}

html[data-theme="dark"] :is(
  .market-card,
  .market-card__body,
  .market-card__price,
  .edu-option,
  .check-card,
  .skill-card,
  .skill-card--media,
  .case-card,
  .case-card__body,
  .product-card,
  .product-card__body,
  .product-table,
  .product-row,
  .phase-card,
  .offer-card,
  .metric-card,
  .callout-card,
  .source-card,
  .script-card,
  .lesson-preview,
  .lesson-preview__body,
  .preset-card,
  .preset-card__body,
  .lesson__panel,
  .mission-card,
  .message-bubble,
  .guide-key--soft,
  .v32-inline-sync,
  .login-card
){
  background:#171a20!important;
  border-color:rgba(255,255,255,.09)!important;
  color:#e2e6ed!important;
  box-shadow:0 9px 25px rgba(0,0,0,.16)!important;
}

html[data-theme="dark"] .guide-block [style*="background:#fff"],
html[data-theme="dark"] .guide-block [style*="background: #fff"]{
  background:#171a20!important;
  color:#e2e6ed!important;
}

html[data-theme="dark"] :is(
  .market-card h3,.edu-option h3,.check-card span,.skill-card h3,.case-card h3,
  .product-card h3,.product-row h4,.phase-card h3,.offer-card h3,.metric-card b,
  .source-card h3,.script-card h3,.lesson-preview h3,.preset-card h3,.lesson h3,
  .lesson__panel h4,.message-bubble strong,.guide-block h3,.subhead h3
){color:#f3f5f8!important}

html[data-theme="dark"] :is(
  .market-card p,.market-card__customer,.edu-option small,.skill-card p,.case-card p,
  .product-card__line,.product-row p,.phase-card p,.offer-card p,.source-card p,
  .script-card__meta,.message-bubble p,.lesson-preview p,.preset-card p,.lesson__lead,
  .lesson__panel li,.micro,.muted,.guide-block__body p
){color:#aeb6c2!important}

html[data-theme="dark"] :is(.soft-tag,.market-card__price,.product-row__meta span){
  background:#20252d!important;
  color:#b7bfcb!important;
  border-color:rgba(255,255,255,.06)!important;
}
html[data-theme="dark"] .market-card__price b,
html[data-theme="dark"] .offer-card__price,
html[data-theme="dark"] .preset-card__exposure,
html[data-theme="dark"] .phase-card__profit{color:#f3f5f8!important}

html[data-theme="dark"] .message-bubble{background:#1f232a!important}
html[data-theme="dark"] .copy-btn{
  background:#20252d!important;
  color:#74a2ff!important;
  border-color:rgba(255,255,255,.07)!important;
}
html[data-theme="dark"] .lesson__visual,
html[data-theme="dark"] .market-card__image,
html[data-theme="dark"] .case-card__image,
html[data-theme="dark"] .product-card__image,
html[data-theme="dark"] .preset-card__image,
html[data-theme="dark"] .lesson-preview__image{background:#14171c!important}

html[data-theme="dark"] .collection-tabs{
  background:linear-gradient(180deg,rgba(5,7,10,.38),rgba(29,33,40,.72))!important;
  border-color:rgba(255,255,255,.075)!important;
  box-shadow:inset 0 2px 6px rgba(0,0,0,.38),inset 0 -1px 0 rgba(255,255,255,.045)!important;
}
html[data-theme="dark"] .collection-tab{
  background:transparent!important;
  color:#9ea6b2!important;
  border-color:transparent!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .collection-tab.is-active{color:#fff!important}

html[data-theme="dark"] .theme-setting-card{background:#171a20!important}
html[data-theme="dark"] .theme-choice{
  background:linear-gradient(180deg,rgba(0,0,0,.34),rgba(31,35,43,.72))!important;
  border-color:rgba(255,255,255,.07)!important;
  box-shadow:inset 0 2px 6px rgba(0,0,0,.38),inset 0 -1px 0 rgba(255,255,255,.045)!important;
}
html[data-theme="dark"] .theme-choice button{color:#9ca4b0!important}
html[data-theme="dark"] .theme-choice button.is-active{color:#fff!important}

html[data-theme="dark"] .v34-chatgpt-install{
  background:#20242b!important;
  color:#c0c7d1!important;
  border-color:rgba(255,255,255,.07)!important;
}
html[data-theme="dark"] .v34-gpt-note{color:#8e97a5!important}
html[data-theme="dark"] .v34-gpt-note.is-success{color:#78a5ff!important}

html[data-theme="dark"] .collection-item__remove{
  background:#242830!important;
  color:#aeb6c2!important;
  border-color:rgba(255,255,255,.07)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05)!important;
}
html[data-theme="dark"] .collection-item.is-swipe-open .collection-item__remove{
  background:#d84a4a!important;
  color:#fff!important;
}

/* Question segment follows the same glass language as the other selectors. */
.v32-question-segment{
  border-radius:999px!important;
  padding:4px!important;
  background:linear-gradient(180deg,rgba(31,44,70,.045),rgba(255,255,255,.42))!important;
  box-shadow:inset 0 2px 5px rgba(31,44,70,.075),inset 0 -1px 0 rgba(255,255,255,.72)!important;
}
.v32-question-segment button{border-radius:999px!important}
.v32-question-segment button.is-active{
  background:linear-gradient(180deg,rgba(91,146,239,.92),rgba(52,103,211,.94))!important;
  color:#fff!important;
  box-shadow:0 4px 12px rgba(45,91,190,.13),inset 0 1px 0 rgba(255,255,255,.31)!important;
}
html[data-theme="dark"] .v32-question-segment{
  background:linear-gradient(180deg,rgba(0,0,0,.34),rgba(31,35,43,.72))!important;
  border-color:rgba(255,255,255,.07)!important;
  box-shadow:inset 0 2px 6px rgba(0,0,0,.38),inset 0 -1px 0 rgba(255,255,255,.045)!important;
}
html[data-theme="dark"] .v32-question-segment button{color:#9ca4b0!important}
html[data-theme="dark"] .v32-question-segment button.is-active{color:#fff!important}

@media(max-width:430px){
  .v34-question-actions{grid-template-columns:1fr 1fr}
  .collection-item__remove{right:10px!important}
}

@media(prefers-reduced-motion:reduce){
  .collection-item__thumb,.collection-item__main,.collection-item__question-icon{transition:none!important}
}
