/* 13.9.0 menu/front shell module
 * Only visual shell/menu/modal layout.
 * No audio/meta logic here. Easy to reuse in another station brand.
 */

/* Unified bottom decision area under the PLAY button */
.rk-actions{
  width:min(100%,860px);
  padding:14px;
  border-radius:26px;
  background:linear-gradient(180deg,rgba(7,35,49,.74),rgba(5,24,35,.60));
  border:1px solid rgba(95,172,188,.12);
  box-shadow:0 20px 42px rgba(0,0,0,.16);
  backdrop-filter:blur(10px);
}
.rk-actionsRow{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
  overflow:hidden;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
}
.rk-actionBtn{
  min-height:58px;
  border:0;
  border-right:1px solid rgba(255,255,255,.08);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.rk-actionBtn:last-child{border-right:0}
.rk-actionBtn:hover,.rk-actionBtn:focus-visible{background:rgba(255,255,255,.05)}
.rk-nowSchedule{margin-top:12px}

/* Full-height modal app shell: header top, footer bottom, only middle scrolls */
.rk-modal__dialog--menuFull,
.rk-modal__dialog--schedule,
.rk-modal__dialog--scheduleCard,
.rk-modal__dialog--form{
  display:flex;
  flex-direction:column;
}
.rk-modal__dialog--menuFull{
  width:min(860px,96vw);
  max-height:min(92dvh,960px);
}
.rk-modal__dialog--menuFull .rk-modal__head,
.rk-modal__dialog--schedule .rk-modal__head,
.rk-modal__dialog--scheduleCard .rk-modal__head{
  position:sticky;
  top:0;
  z-index:3;
  background:linear-gradient(180deg,rgba(8,20,29,.98),rgba(8,20,29,.94));
  backdrop-filter:blur(12px);
}
.rk-modal__dialog--menuFull .rk-modal__foot,
.rk-modal__dialog--schedule .rk-modal__foot,
.rk-modal__dialog--scheduleCard .rk-modal__foot{
  position:sticky;
  bottom:0;
  z-index:3;
  background:linear-gradient(180deg,rgba(8,20,29,.90),rgba(8,20,29,.98));
  backdrop-filter:blur(12px);
}
.rk-modal__dialog--menuFull .rk-optionList,
.rk-modal__dialog--schedule .rk-modal__body,
.rk-modal__dialog--scheduleCard .rk-modal__body{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
}

/* Menu entries share one visual system */
.rk-optionList--menu{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  padding:16px;
}
.rk-optionList--menu .rk-optionBtn{
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:18px;
}
.rk-modal__foot--menu .rk-modal__back{
  width:100%;
  max-width:none;
}

/* Schedule card modal is compact, not giant */
.rk-modal__dialog--scheduleCard{width:min(720px,96vw);max-height:min(84dvh,860px)}
.rk-modal__body--scheduleCard{padding:16px}

@media (max-width:720px){
  .rk-actions{padding:10px 10px 12px;border-radius:22px}
  .rk-actionsRow{grid-template-columns:1fr;border-radius:16px}
  .rk-actionBtn{min-height:52px;border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}
  .rk-actionBtn:last-child{border-bottom:0}

  .rk-modal__dialog--menuFull,
  .rk-modal__dialog--schedule,
  .rk-modal__dialog--scheduleCard,
  .rk-modal__dialog--form{
    width:100vw;
    height:100dvh;
    max-height:none;
    border-radius:0;
  }
  .rk-modal{padding:0}
  .rk-modal__dialog--scheduleCard{justify-content:flex-start}
  .rk-modal__dialog--scheduleCard .rk-modal__body{padding:14px}
  .rk-modal__head{padding-top:max(14px, env(safe-area-inset-top));}
  .rk-modal__foot{padding-bottom:max(14px, env(safe-area-inset-bottom));}
}


/* 13.9.4 final polish: action layout + centered shells */
.rk-actionsRow{display:block;background:transparent;border:none;overflow:visible}
.rk-actionsRow__layout{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:stretch}
.rk-actionBtn{min-height:56px;border-radius:18px!important;border:1px solid rgba(255,255,255,.10)!important;background:linear-gradient(180deg,rgba(8,63,82,.82),rgba(5,34,47,.92))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.05);padding:0 14px}
.rk-actionBtn__text{font-size:15px;letter-spacing:.08em}
@media (max-width:720px){
  .rk-actions{padding:10px 10px 12px;border-radius:22px}
  .rk-actionsRow__layout{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .rk-actionBtn--suggest{grid-column:1 / -1;min-height:50px}
  .rk-actionBtn{min-height:52px}
  .rk-actionBtn__text{font-size:14px;letter-spacing:.07em}
}