/* GiC Compact Bonus Drawer v4
   Compact tab strip + adaptive content drawer.
   Loaded after earlier card-polish files, so these rules intentionally win. */

/* Keep the revealed side as a normal vertical column.
   The compact tab strip uses auto margin to sit low without becoming tall. */
.gic-study-back:not([hidden]){
  display:flex !important;
  flex-direction:column !important;
  min-height:0 !important;
}

.gic-study-back[hidden]{
  display:none !important;
}

/* IMPORTANT: the strip itself must stay compact.
   It moves lower because of margin-top:auto, NOT because its own height grows. */
.gic-study-back .gic-layer-tabs{
  flex:0 0 72px !important;
  height:72px !important;
  min-height:72px !important;
  max-height:72px !important;

  margin-top:auto !important;
  margin-bottom:10px !important;

  position:relative !important;
  top:auto !important;
  bottom:auto !important;

  box-sizing:border-box !important;
  padding:8px 10px !important;

  overflow-y:hidden !important;
}

/* Preserve horizontal swipe when extra tabs exist. */
.gic-study-back .gic-layer-tabs.gic-layer-tabs-scroll{
  overflow-x:auto !important;
  overscroll-behavior-x:contain;
}

/* Buttons fill the compact strip, never stretch the strip itself. */
.gic-study-back .gic-layer-tabs > button{
  min-height:0 !important;
  height:100% !important;
}

/* Drawer philosophy:
   - short content = natural content height
   - long content = only the safe space up to just below Listen/Speak
   - anything longer scrolls INSIDE the drawer
*/
.gic-layer-drawer{
  min-height:0 !important;
  height:auto !important;
  max-height:var(--gic-layer-fit-max, 240px) !important;
  overflow:hidden !important;
}

.gic-layer-drawer.is-open{
  min-height:0 !important;
  height:auto !important;
  max-height:var(--gic-layer-fit-max, 240px) !important;
}

.gic-layer-drawer-inner{
  min-height:0 !important;
  height:auto !important;
  max-height:var(--gic-layer-fit-max, 240px) !important;
  overflow:hidden !important;
}

.gic-layer-panel:not([hidden]){
  display:block !important;
  min-height:0 !important;
  height:auto !important;
  max-height:calc(var(--gic-layer-fit-max, 240px) - 8px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}

/* Keep the panel header reachable while long notes scroll. */
.gic-layer-panel:not([hidden]) .gic-layer-head{
  position:sticky;
  top:0;
  z-index:3;
}

/* Don't let editorial/items impose huge inherited minimum heights. */
.gic-layer-panel .gic-layer-editorial,
.gic-layer-panel .gic-layer-items{
  min-height:0 !important;
}

/* On phones keep the bar compact but give the labels enough touch height. */
@media (max-width:640px){
  .gic-study-back .gic-layer-tabs{
    flex-basis:70px !important;
    height:70px !important;
    min-height:70px !important;
    max-height:70px !important;
    margin-bottom:8px !important;
    padding:7px 8px !important;
  }
}