/* Vidapi Guide Door — SAFE FIXED VERSION */

/* === Door Container (safe) === */
.vgd-door {
  position: fixed;
  left: 0;
  right: 0;
  z-index: 9999;
  pointer-events: none;
}

.vgd-door.open {
  pointer-events: auto;
}

.vgd-scrim {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.35);
  opacity: 0;
  transition: opacity 650ms;
  pointer-events: none;
}

.vgd-door.open .vgd-scrim {
  opacity: 1;
}

.vgd-panel {
  position: absolute;
  inset: 0;
  background: #0b151a;
  border-top: 1px solid #173239;
  transform: translateY(100%);
  transition: transform 650ms cubic-bezier(.22,.61,.36,1);
  display: flex;
  flex-direction: column;
  color: #e7eef0;
}

.vgd-door.open .vgd-panel {
  transform: translateY(0);
}

/* === Header === */
.vgd-head {
  position: sticky;
  top: 0;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  padding: 0 12px;
  background: rgba(8,14,17,.95);
  border-bottom: 1px solid #173239;
  backdrop-filter: blur(4px);
}

.vgd-search {
  height: 32px;
  padding: 0 12px;
  border: 1px solid #244c57;
  background: #0d1a20;
  color: #e7eef0;
}

.vgd-lock {
  border: 1px solid #244c57;
  background: #0d1a20;
  color: #e7eef0;
  height: 32px;
  padding: 0 10px;
  cursor: pointer;
}

.vgd-lock[aria-pressed="true"] {
  background: #112027;
}

.vgd-toggle {
  border: 1px solid #244c57;
  background: #0b151a;
  color: #e7eef0;
  padding: 8px 12px;
  cursor: pointer;
}

/* === Body === */
.vgd-body {
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 16px 12px 72px;
}

/* === Card Container === */
.vgd-card {
  border: 1px solid #244c57;
  background: rgba(13,26,32,.6);
  padding: 12px;
  min-height: 420px;
}

/* =======================================
   SAFE TV GRID FIX (only these 2 blocks)
   ======================================= */

.vgd-card .vgd-grid,
.vgd-card #vgdGrid {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  grid-template-columns: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.vgd-card .vgd-grid .vct-grid,
.vgd-card #vgdGrid .vct-grid {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

/* === Week Selector (safe, local only) === */
.vgd-weekbar {
  position: sticky;
  bottom: 0;
  background: rgba(8,14,17,.95);
  border-top: 1px solid #173239;
  backdrop-filter: blur(4px);
}

.vgd-weekrow {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 56px;
  padding: 0 24px;
}

.vgd-day {
  padding: 10px 20px;
  cursor: pointer;
  border: 1px solid #244c57;
  color: #cfe3e8;
}

.vgd-day.active {
  border: 2px solid #72c6d6;
  color: #e7eef0;
}

.vgd-day.active::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 6px;
  width: 72%;
  height: 2px;
  background: #72c6d6;
}

/* === Lock View Mode (safe) === */
body.vgd-grid-locked .channel-player-wrap,
body.vgd-grid-locked .channel-player-box,
body.vgd-grid-locked video,
body.vgd-grid-locked .video-js {
  display: none !important;
}

/* === Mobile === */
@media (max-width:520px){
  .vgd-weekrow {
    gap: 8px;
    padding: 0 12px;
  }
  .vgd-day {
    padding: 8px 12px;
  }
}