/* GiC desktop-only styling for the study-card rating bar (Again / Hard / Good / Easy).
   Everything is inside @media (min-width:960px): mobile/tablet stay untouched.
   The page CSS uses !important + position:fixed, so selectors here are more specific. */
@media (min-width:960px){

/* 1) Un-fix the bar: it now sits right under the card, same width as the card */
html body .gic-rating-bar.gic-premium-rating.gic-ah-rating{
  position:relative!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;
  transform:none!important;z-index:2!important;
  box-sizing:border-box!important;width:min(100%,740px)!important;max-width:740px!important;
  margin:12px auto 0!important;padding:10px!important;gap:10px!important;
  border-radius:28px;
  background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(240,247,243,.94));
  border:1px solid rgba(15,74,59,.10);
  box-shadow:0 26px 46px -28px rgba(8,42,38,.5),0 1px 0 rgba(255,255,255,.95) inset;
}

/* 2) Buttons */
html body .gic-rating-bar.gic-premium-rating.gic-ah-rating button{
  position:relative;min-height:68px!important;padding:12px 8px!important;
  border-radius:20px!important;border:1px solid transparent!important;
  font-family:Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;
  cursor:pointer;-webkit-tap-highlight-color:transparent;
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
}
html body .gic-rating-bar.gic-premium-rating.gic-ah-rating button strong{
  font-size:15px!important;font-weight:800!important;letter-spacing:.01em;line-height:1.1;
}
  background:linear-gradient(180deg,#fef6f5,#f9e6e4)!important;color:#a63f4f!important;
  border-color:rgba(166,63,79,.16)!important;box-shadow:0 10px 18px -14px rgba(166,63,79,.55)!important;
}
html body .gic-rating-bar.gic-premium-rating.gic-ah-rating button[data-gic-rating="hard"]{
  background:linear-gradient(180deg,#fdf7e8,#f7e9c8)!important;color:#8a6829!important;
  border-color:rgba(199,154,59,.30)!important;box-shadow:0 10px 18px -14px rgba(199,154,59,.6)!important;
}
html body .gic-rating-bar.gic-premium-rating.gic-ah-rating button[data-gic-rating="good"]{
  background:linear-gradient(180deg,#eef8f3,#d9eee4)!important;color:#17694f!important;
  border-color:rgba(23,105,79,.18)!important;box-shadow:0 10px 18px -14px rgba(23,105,79,.55)!important;
}
html body .gic-rating-bar.gic-premium-rating.gic-ah-rating button[data-gic-rating="easy"]{
  background:linear-gradient(180deg,#17665a,#0d3b35)!important;color:#fff!important;
  border-color:rgba(230,187,90,.55)!important;
  box-shadow:0 16px 28px -14px rgba(13,59,53,.75),0 1px 0 rgba(255,255,255,.2) inset!important;
}

/* 4) States */
@media (hover:hover){
}
html body .gic-rating-bar.gic-premium-rating.gic-ah-rating button:not(:disabled):active{transform:translateY(0) scale(.985)}
html body .gic-rating-bar.gic-premium-rating.gic-ah-rating button:focus-visible{outline:2px solid #c79a3b;outline-offset:3px}
html body .gic-rating-bar.gic-premium-rating.gic-ah-rating button:disabled{cursor:not-allowed}
@media (prefers-reduced-motion:reduce){
  html body .gic-rating-bar.gic-premium-rating.gic-ah-rating button{transition:none}
}

/* 5) Front side: "Reveal answer" sits right under the card, same dock look as the rating bar */
html body .gic-ah-front .gic-ah-reveal-zone{
  position:relative;top:auto;left:auto;right:auto;bottom:auto;transform:none;z-index:2;
  box-sizing:border-box;width:100%;max-width:none;
  margin:12px auto 0;padding:10px;
  border:1px solid rgba(15,74,59,.10);border-radius:28px;
  background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(240,247,243,.94));
  box-shadow:0 26px 46px -28px rgba(8,42,38,.5),0 1px 0 rgba(255,255,255,.95) inset;
  -webkit-backdrop-filter:none;backdrop-filter:none;
}
html body .gic-ah-front .gic-ah-reveal-zone .gic-ah-reveal{
  min-height:60px;border-radius:20px;cursor:pointer;
  transition:transform .18s ease,filter .18s ease;
}
@media (hover:hover){
  html body .gic-ah-front .gic-ah-reveal-zone .gic-ah-reveal:hover{transform:translateY(-2px);filter:brightness(1.05)}
}
html body .gic-ah-front .gic-ah-reveal-zone .gic-ah-reveal:active{transform:translateY(0) scale(.985)}
html body .gic-ah-front .gic-ah-reveal-zone .gic-ah-reveal:focus-visible{outline:2px solid #c79a3b;outline-offset:3px}

/* 6) Depth: layered card shadow, warm paper body, gold hairline under the header */
html body .gic-ah-card{
  background:linear-gradient(180deg,#fffefb 0%,#fbf8f1 100%)!important;
  border:1px solid rgba(15,74,59,.10)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.95) inset,0 2px 5px rgba(8,42,38,.06),0 22px 34px -18px rgba(8,42,38,.30),0 56px 80px -44px rgba(8,42,38,.38)!important;
}
html body .gic-ah-card .gic-ah-original-header{box-shadow:inset 0 -2px 0 rgba(199,154,59,.45)!important}

/* 7) Content area is a column, so the panel below can fill the free space */
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-card > .gic-ah-content{
  display:flex!important;flex-direction:column!important;
}

/* 8) Answer side: one raised "paper" panel that fills the card, content centred inside it */
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-back:not([hidden]) .gic-ah-card .premium-answer-zone{
  flex:1 0 auto!important;justify-content:center!important;
  box-sizing:border-box!important;min-height:300px!important;
  margin:0!important;padding:30px 26px 32px!important;
  background:linear-gradient(180deg,#ffffff 0%,#f6faf8 100%)!important;
  border:1px solid rgba(15,74,59,.09)!important;border-radius:28px!important;
  box-shadow:0 1px 0 #fff inset,0 14px 28px -20px rgba(8,42,38,.35)!important;
}
html body .gic-ah-card .premium-answer-zone .answer-label{
  font-family:Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:11px;font-weight:800;letter-spacing:.16em;line-height:1;color:#a27b28;
}
html body .gic-ah-card .gic-ah-german{
  color:#0d3b35;letter-spacing:-.03em;text-shadow:0 1px 0 rgba(255,255,255,.9);
  padding:0 12px 20px;
  background:linear-gradient(90deg,#e6bb5a,#c79a3b) no-repeat center bottom/46px 3px;
}
html body .gic-ah-card .gic-ah-german.s{font-size:clamp(3rem,6vw,4.4rem)}
html body .gic-ah-card .gic-ah-german.m{font-size:clamp(2.4rem,4.8vw,3.4rem)}
html body .gic-ah-card .gic-ah-translation{
  font-family:Newsreader,Georgia,"Times New Roman",serif;
  font-size:clamp(1.1rem,1.7vw,1.35rem);color:#6f7d79;margin-top:14px;
}

/* 9) Listen / Record keep their round shape, with a little depth */
html body .gic-ah-card .gic-ah-audio-row{gap:18px;margin:26px auto 0}
html body .gic-ah-card .gic-ah-audio-row .sound-btn{
  box-shadow:0 12px 22px -10px rgba(15,116,105,.55),0 1px 0 rgba(255,255,255,.35) inset!important;
  transition:transform .18s ease,box-shadow .18s ease;
}
html body .gic-ah-card .gic-ah-audio-row .gic-ah-record-btn{
  box-shadow:0 12px 22px -12px rgba(143,106,32,.55),0 1px 0 #fff inset!important;
}
@media (hover:hover){
  html body .gic-ah-card .gic-ah-audio-row .sound-btn:hover{transform:translateY(-2px)}
}

/* 9b) Front side: the question sits in the same kind of raised panel */
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-front .gic-ah-front-text{
  flex:1 1 auto;box-sizing:border-box;width:100%;max-width:none;min-height:280px;margin:0;
  background:linear-gradient(180deg,#ffffff 0%,#f6faf8 100%);
  border:1px solid rgba(15,74,59,.09);border-radius:28px;
  box-shadow:0 1px 0 #fff inset,0 14px 28px -20px rgba(8,42,38,.35);
  color:#0d3b35;font-size:clamp(2.6rem,5.4vw,3.9rem);
}
html body .gic-ah-front .gic-ah-prompt{
  font-family:Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:11.5px;font-weight:800;letter-spacing:.16em;color:#8a9994;margin-bottom:18px!important;
}

/* 11) Voice practice (single sentences): the recorder replaces the answer panel instead of stacking under it */
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-back .gic-ah-content:has(> .gic-ah-recorder:not([hidden])) > .premium-answer-zone{
  display:none!important;
}
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-card .gic-ah-recorder:not([hidden]){
  position:relative!important;flex:1 0 auto;display:flex;flex-direction:column;justify-content:center;
  box-sizing:border-box!important;width:100%!important;max-width:none!important;min-height:300px;
  margin:0!important;padding:34px 40px 30px!important;
  background:linear-gradient(180deg,#ffffff 0%,#f6faf8 100%);
  border:1px solid rgba(15,74,59,.09);border-radius:28px;
  box-shadow:0 1px 0 #fff inset,0 14px 28px -20px rgba(8,42,38,.35);
}
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-card .gic-ah-recorder-head{display:block;text-align:center}
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-card .gic-ah-recorder-head strong{
  font-family:Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:11px;letter-spacing:.16em;color:#a27b28;
}
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-card .gic-ah-recorder-head small{margin-top:6px;font-size:13px;color:#7d8b87}
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-card .gic-ah-recorder-close{
  position:absolute;top:16px;right:18px;width:36px;height:36px;border-radius:50%;
  background:#fff;border:1px solid rgba(15,74,59,.12);color:#5f6f6b;font-size:20px;line-height:1;cursor:pointer;
  box-shadow:0 6px 12px -8px rgba(8,42,38,.4);transition:transform .18s ease;
}
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-card .gic-ah-recorder-close:hover{transform:scale(1.06)}
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-card .gic-ah-voice-target{margin:22px 0 14px}
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-card .gic-ah-voice-target span{
  font-family:Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:11px;letter-spacing:.16em;color:#a27b28;
}
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-card .gic-ah-voice-target strong{
  margin-top:10px;padding:0 12px 20px;
  font-family:Newsreader,Georgia,"Times New Roman",serif;font-size:clamp(2.2rem,4.4vw,3.2rem);font-weight:700;
  line-height:1.1;letter-spacing:-.025em;color:#0d3b35;
  background:linear-gradient(90deg,#e6bb5a,#c79a3b) no-repeat center bottom/46px 3px;
}
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-card .gic-ah-voice-target small{
  margin-top:14px;font-family:Newsreader,Georgia,"Times New Roman",serif;font-style:italic;font-size:1.15rem;color:#6f7d79;
}
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-card .gic-ah-record-status{margin:4px 0 16px;text-align:center;font-size:13px;color:#7d8b87}
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-card .gic-ah-record-button{
  display:block;width:min(100%,340px);margin:0 auto;min-height:58px;border-radius:999px;cursor:pointer;
  font-size:1rem;letter-spacing:.01em;
  box-shadow:0 14px 26px -12px rgba(15,116,105,.6),0 1px 0 rgba(255,255,255,.25) inset;
  transition:transform .18s ease,filter .18s ease;
}
@media (hover:hover){
  html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-card .gic-ah-record-button:hover{transform:translateY(-2px);filter:brightness(1.05)}
}
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-card .gic-ah-recording{margin-top:18px}
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-card .gic-ah-record-actions{justify-content:center;gap:10px}
html body .gic-ah-wrap:not(.is-dialogue) .gic-ah-card .gic-ah-record-actions button{
  min-height:40px;padding:0 16px;border-radius:999px;font-size:.8rem;cursor:pointer;
  box-shadow:0 8px 14px -12px rgba(8,42,38,.45);
}

/* 10) Opened note: tucked under the card, no big gap before the rating bar */
html body .gic-ah-notes .gic-layer-drawer.is-open{margin-top:8px!important;margin-bottom:14px!important}

}

/* GIC_FIX_DUP_TIME: بیرون از قفل /learn، زمان ثابتِ کوچیک (::after) را مخفی کن تا فقط زمان واقعی/شخصی (اسپن بزرگ) دیده شود */
html:not(.gic-direct-learn-lock) .gic-rating-bar.gic-premium-rating.gic-ah-rating button .gic-rating-preview::after{
  content:none!important;
}

/* GIC_FIX_DUP_TIME_v2: هر دو نوع نوار (home-rating و ah-rating) بیرون از قفل /learn */
html:not(.gic-direct-learn-lock) .gic-rating-bar.gic-premium-rating.gic-home-rating .gic-rating-preview::after,
html:not(.gic-direct-learn-lock) .gic-rating-bar.gic-premium-rating.gic-ah-rating .gic-rating-preview::after{
  content:none!important;
}

/* GIC_FIX_DUP_TIME_v3: fallback ثابت gic-rating-time وقتی preview واقعی هست مخفی شود */
html body [data-gic-rating-bar] button:has(.gic-rating-preview) .gic-rating-time{
  display:none!important;
}

/* GIC_DRAWER_OVERLAY_v7: Grammar / Pronunciation / Language Kit داخل کارت شناور باز شود و اسکرول داخلی داشته باشد (فقط دسکتاپ) */
@media (min-width:960px){
  /* والد مرجع برای absolute */
  html body .gic-card-v2.gic-learning-layer-open{
    position:relative!important;
  }
  /* drawer: روی کارت شناور، در جریان صفحه نیست، کارت را دراز نمی‌کند */
  html body .gic-card-v2 .gic-v2-drawer.gic-learning-layer-stage.is-open:not([aria-hidden="true"]){
    display:block!important;
    position:absolute!important;
    top:var(--gic-drawer-top,14px)!important;
    left:var(--gic-drawer-side,14px)!important;
    right:var(--gic-drawer-side,14px)!important;
    bottom:var(--gic-drawer-bottom,84px)!important;
    width:auto!important;
    height:auto!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    transform:none!important;
    z-index:30!important;
    border-radius:22px!important;
    box-shadow:0 18px 44px rgba(17,54,48,.16)!important;
  }
  /* ناحیه‌ی اسکرول */
  html body .gic-card-v2 .gic-v2-drawer.gic-learning-layer-stage.is-open .gic-v2-drawer-inner{
    box-sizing:border-box!important;
    height:100%!important;
    max-height:100%!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    border:1px solid #dedfd8!important;
    border-radius:22px!important;
  }
}

/* GIC_NOTES_OVERLAY_v8: پنل Grammar/Pronunciation/Language Kit (که JS داخل .gic-ah-notes می‌گذارد) روی کارت شناور شود و خودش اسکرول داشته باشد (فقط دسکتاپ) */
@media (min-width:960px){
  /* مرجع موقعیت: خود wrap (هم‌اندازه‌ی کارت)، فقط وقتی پنل باز است */
  html body .gic-ah-wrap:has(> .gic-ah-notes [data-gic-layer-drawer].is-open),
  html body .gic-ah-wrap:has(.gic-ah-notes [data-gic-layer-drawer].is-open){
    position:relative!important;
  }
  /* خود .gic-ah-notes می‌شود صفحه‌ی شناور و اسکرول‌دار داخل کارت */
  html body .gic-ah-wrap .gic-ah-notes:has([data-gic-layer-drawer].is-open){
    position:absolute!important;
    top:var(--gic-drawer-top,14px)!important;
    left:var(--gic-drawer-side,14px)!important;
    right:var(--gic-drawer-side,14px)!important;
    bottom:var(--gic-drawer-bottom,76px)!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
    box-sizing:border-box!important;
    z-index:30!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    max-height:none!important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-y!important;
    background:#fffdfa!important;
    border:1px solid #dedfd8!important;
    border-radius:22px!important;
    box-shadow:0 18px 44px rgba(17,54,48,.16)!important;
  }
  /* خود drawer داخل صفحه‌ی اسکرول: بدون حاشیه‌ی اضافه (قبلاً 120px پایین داشت) */
  html body .gic-ah-wrap .gic-ah-notes [data-gic-layer-drawer].is-open{
    margin:0!important;
    max-height:none!important;
    border:0!important;
    box-shadow:none!important;
    background:transparent!important;
  }
}

/* GIC_NOTES_FIT_v9: ارتفاع پنل متناسب با متن باشد؛ اگر از سقف کارت بلندتر شد، اسکرول داخلی (فقط دسکتاپ؛ بعد از v8) */
@media (min-width:960px){
  html body .gic-ah-wrap .gic-ah-notes:has([data-gic-layer-drawer].is-open){
    bottom:auto!important;
    height:auto!important;
    max-height:calc(100% - var(--gic-drawer-top,14px) - var(--gic-drawer-bottom,76px))!important;
  }
}

/* GIC_NOTES_BOTTOM_v10: پنل به پایین کارت (بالای تب‌ها) بچسبد و به سمت بالا رشد کند، با حرکت نرم از پایین (فقط دسکتاپ؛ بعد از v9) */
@media (min-width:960px){
  html body .gic-ah-wrap .gic-ah-notes:has([data-gic-layer-drawer].is-open){
    top:auto!important;
    bottom:var(--gic-drawer-bottom,76px)!important;
    animation:gic-notes-rise-v10 .2s cubic-bezier(.2,.8,.2,1) backwards;
  }
}
@keyframes gic-notes-rise-v10{
  from{opacity:0;transform:translateY(12px)}
  to{opacity:1;transform:translateY(0)}
}
@media (min-width:960px) and (prefers-reduced-motion:reduce){
  html body .gic-ah-wrap .gic-ah-notes:has([data-gic-layer-drawer].is-open){animation:none!important}
}

/* GIC_DOCK_STABLE_v11: حذف پرش نوار Reveal / امتیازها هنگام Reveal و رفتن به کارت بعدی (فقط دسکتاپ) */
@media (min-width:960px){
  /* 1) تا وقتی سمت جلوی کارت (دکمه‌ی Reveal) دیده می‌شود، نوار امتیازها نمایش داده نشود
        (JS آن را چند ده میلی‌ثانیه زودتر باز می‌کند و باعث دو نوار روی هم و پرش می‌شد) */
  html body .gic-ah-wrap:has(.gic-ah-front:not([hidden])) ~ .gic-ah-rating{
    display:none!important;
  }
  /* 2) هم‌قد کردن دو نوار تا Previous/Next هنگام Reveal جابه‌جا نشود */
  html body .gic-ah-front .gic-ah-reveal-zone{
    display:flex;
    align-items:stretch;
    min-height:92px;
  }
  html body .gic-ah-front .gic-ah-reveal-zone .gic-ah-reveal{
    flex:1 1 auto;
    height:auto!important;
  }
  html body .gic-rating-bar.gic-premium-rating.gic-ah-rating{
    min-height:92px!important;
  }
}