.agtv-tvs-calendar{background:#0b0b0b;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.agtv-tvs-toolbar{display:flex;justify-content:space-between;align-items:center;padding:12px 12px;border-bottom:1px solid rgba(255,255,255,.08);gap:10px}
.agtv-tvs-toolbar .agtv-tvs-left,.agtv-tvs-toolbar .agtv-tvs-right{display:flex;align-items:center;gap:8px}
.agtv-tvs-date-label{font-weight:700;color:rgba(255,255,255,.92)}
.agtv-tvs-view{padding:12px}
.agtv-tvs-week-grid{width:100%}

/* ============================
   WEEK HEAD
============================ */
.agtv-tvs-week-head{display:grid;grid-template-columns:90px repeat(7,1fr);gap:8px;margin-bottom:10px}
.agtv-tvs-week-timecol{color:rgba(255,255,255,.7);font-size:12px;padding:6px 8px}
.agtv-tvs-week-dayhead{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:10px 10px}
.agtv-tvs-week-dayhead.is-today{border-color:rgba(255,255,255,.25)}
.agtv-tvs-week-dayname{font-weight:800}
.agtv-tvs-week-daydate{font-size:12px;color:rgba(255,255,255,.7);margin-top:2px}

/* ============================
   WEEK BODY GRID
============================ */
.agtv-tvs-week-body{
  display:grid;
  grid-template-columns:90px repeat(7,1fr);
  gap:8px;
  align-items:flex-start;
}

/* ============================
   TIMELINE (LEFT) — MUST FOLLOW STACK RHYTHM
   (Because schedule is card-based, not absolute grid)
============================ */
.agtv-tvs-week-body .agtv-tvs-week-timecol{
  display:flex;
  flex-direction:column;
  gap:12px;            /* MUST MATCH DAY COLUMN GAP */
  padding-top:10px;    /* MUST MATCH DAY COLUMN PADDING */
}

/* Each "time slot" matches one card block visually */
.agtv-tvs-week-time{
  height:auto;
  min-height:120px;    /* MUST MATCH CARD MIN HEIGHT */
  padding:10px 8px;
  display:flex;
  align-items:flex-start;
  justify-content:flex-start;
  font-size:12px;
  color:rgba(255,255,255,.6);
  box-sizing:border-box;
  border-bottom:1px solid rgba(255,255,255,.04);
}

/* ============================
   DAY COLUMN — STACK MODE (NO OVERLAP)
============================ */
.agtv-tvs-week-daycol{
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  padding:10px;
  position:relative;
  overflow:visible;
  min-height:auto;

  display:flex;
  flex-direction:column;
  gap:12px; /* MUST MATCH TIMELINE GAP */
}

/* ============================
   PROGRAM CARDS
============================ */
.agtv-tvs-epg-item{
  all:unset;
  cursor:pointer;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.45);
  padding:14px 14px;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  min-height:120px; /* MUST MATCH TIME SLOT */
}

.agtv-tvs-epg-item:hover{border-color:rgba(255,255,255,.25)}
.agtv-tvs-epg-item.is-now{border-color:rgba(0,200,120,.55);box-shadow:0 0 0 1px rgba(0,200,120,.2) inset}

.agtv-tvs-epg-title{font-weight:800;font-size:14px;margin-top:6px;line-height:1.35;margin-bottom:6px}
.agtv-tvs-epg-meta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  font-size:12px;
  color:rgba(255,255,255,.85);
  line-height:1.4;
  margin-top:auto;
}

/* Badges — inline, never overlap */
.agtv-tvs-calendar .agtv-tvs-badge{
  position:static !important;
  display:inline-flex;
  margin-bottom:8px;
  max-width:100%;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:11px;
  opacity:.95;
}

/* ============================
   DAY VIEW
============================ */
.agtv-tvs-day{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:12px}
.agtv-tvs-day-item{all:unset;display:flex;gap:12px;width:100%;cursor:pointer;padding:10px;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:rgba(0,0,0,.35);margin-top:10px}
.agtv-tvs-day-item:hover{border-color:rgba(255,255,255,.22)}
.agtv-tvs-day-item.is-now{border-color:rgba(0,200,120,.55)}
.agtv-tvs-day-time{min-width:120px;font-weight:800;color:rgba(255,255,255,.9)}
.agtv-tvs-day-title{font-weight:900}
.agtv-tvs-day-meta{font-size:12px;color:rgba(255,255,255,.7);margin-top:2px}

/* ============================
   MONTH VIEW
============================ */
.agtv-tvs-month{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:12px}
.agtv-tvs-month-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-top:10px}
.agtv-tvs-month-dow{font-size:12px;color:rgba(255,255,255,.65);padding:6px 6px}
.agtv-tvs-month-day{all:unset;cursor:pointer;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:rgba(0,0,0,.35);padding:10px;min-height:70px;display:flex;flex-direction:column;gap:6px}
.agtv-tvs-month-day:hover{border-color:rgba(255,255,255,.22)}
.agtv-tvs-month-day.is-out{opacity:.45}
.agtv-tvs-month-day.is-today{border-color:rgba(0,200,120,.55)}
.agtv-tvs-month-num{font-weight:900}
.agtv-tvs-month-count{font-size:12px;color:rgba(255,255,255,.75)}
.agtv-tvs-month-count.is-empty{color:rgba(255,255,255,.35)}

/* ============================
   MODAL (FINAL UI POLISH)
============================ */

.agtv-tvs-modal{
  position:fixed;
  inset:0;
  display:none;
  z-index:999999;
}

.agtv-tvs-modal.is-open{
  display:flex;
  align-items:center;
  justify-content:center;
}

.agtv-tvs-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.72);
}

/* MAIN DIALOG */
.agtv-tvs-modal-dialog{
  position:relative;
  width:100%;
  max-width:760px;
  background:linear-gradient(
    180deg,
    rgba(15,15,15,0.98),
    rgba(5,5,5,0.98)
  );
  border:1px solid rgba(255,255,255,.12);
  border-radius:22px;
  box-shadow:
    0 30px 80px rgba(0,0,0,.8),
    inset 0 1px 0 rgba(255,255,255,.05);
  overflow:hidden;
  z-index:2;
}

/* CONTENT */
.agtv-tvs-modal-content{
  padding:32px 34px 30px;
}

/* CLOSE BUTTON */
.agtv-tvs-modal-close{
  position:absolute;
  top:14px;
  right:16px;
  width:36px;
  height:36px;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.15);
  color:#fff;
  font-size:22px;
  cursor:pointer;
}

.agtv-tvs-modal-close:hover{
  background:rgba(255,255,255,.15);
}

/* TITLE */
.agtv-tvs-modal-title{
  font-size:34px;
  font-weight:900;
  line-height:1.15;
  margin:0 0 14px 0;
  letter-spacing:-.02em;
  color:#fff;
}

/* META ROW */
.agtv-tvs-modal-meta{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  font-size:14px;
  color:rgba(255,255,255,.75);
  margin-bottom:16px;
}

.agtv-tvs-modal-meta span{
  display:inline-flex;
  align-items:center;
  gap:6px;
}

/* DESCRIPTION */
.agtv-tvs-modal-excerpt{
  font-size:15px;
  line-height:1.6;
  color:rgba(255,255,255,.85);
  margin-bottom:22px;
  max-width:640px;
}

/* ACTIONS */
.agtv-tvs-modal-actions{
  display:flex;
  gap:12px;
}

.agtv-tvs-modal-actions a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 18px;
  border-radius:12px;
  font-weight:700;
  font-size:14px;
  text-decoration:none;
  background:#fff;
  color:#000;
}

.agtv-tvs-modal-actions a:hover{
  opacity:.9;
}

/* FORCE WHITE TEXT */
.agtv-tvs-modal-dialog,
.agtv-tvs-modal-dialog *{
  color:#fff;
}