/* ==========================
   style.css — ready to replace
   Merged + fixed version
   - preserves original look
   - fixes broken rules
   - tightens episodes card layout
   - removes large empty top gaps
   ========================== */

/* Base */
html, body { overflow-x: hidden; width: 100%; margin: 0; padding: 0; } /* Stop page wiggle */
* { box-sizing: border-box; } /* Prevent padding from expanding width */
body{font-family:'Montserrat',Arial,sans-serif;margin:0;background:#15171c;color:#fff}
#main-content,header,.sidebar{background:#15171c;color:#fff}

/* header compacted so page opens at top (reduced top padding) */
header{padding:14px 10px 8px 10px;border-bottom:1px solid #292a2f;position:relative;display:flex;align-items:center;gap:10px}
#sidebarToggle{font-size:2em;background:none;border:none;color:#fff;margin-right:14px}
#mainTitle{display:inline-block;margin:0;font-size:1.65em;color:#fff;flex:0 1 auto}
.searchbar-container{display:flex;align-items:center;background:#23242a;border-radius:32px;margin:16px 0 6px 0;padding:5px 10px;color:#fff}
.search-icon{margin-right:8px;font-size:1.1em;color:#bbb}
#seriesSearch,#search{border:none;outline:none;background:transparent;font-size:1em;width:100%;padding:8px 0;color:#fff}

/* Sidebar - PROFESSIONAL UPGRADE */
.sidebar {
  position: fixed;
  z-index: 20;
  left: 0;
  top: 0;
  width: 260px;
  height: 100vh;
  background: rgba(20,24,37,0.98);
  box-shadow: 0 8px 36px #06def438;
  border-radius: 0 34px 34px 0;
  padding: 27px 0 0 0;
  min-height: 100vh;
  transform: translateX(-100%);
  transition: transform .3s;
}
.sidebar.open {transform:translateX(0);}
.sidebar-header-pro {
  display: flex; align-items: center;
  padding: 0 26px 18px 22px;
  justify-content: space-between;
  border-bottom: 1.5px solid #1bcacc38;
}
.sidebar-logo-pro {
  font-family: 'Montserrat', Arial, sans-serif;
  font-size: 2.05em;
  font-weight: 900;
  color: #06f2fc;
  letter-spacing: .04em;
  text-shadow: 0 4px 22px #06def483;
  line-height: 1.1;
}
.sidebar-close-btn {
  font-size: 2.4em;
  color: #fb5;
  background: none;
  border: none;
  cursor: pointer;
  transition: color .14s;
}
.sidebar-close-btn:hover { color: #fffa74; }
.sidebar-menu-pro {
  display: flex;
  flex-direction: column;
  gap: 22px;
  margin-top: 38px;
  padding: 0 28px;
}
.sidebar-btn-pro {
  display: block;
  background: linear-gradient(96deg,#112c42 35%,#13c6ffcc 100%);
  color: #fff !important;
  font-size: 1.13em;
  font-family: 'Montserrat', Arial, sans-serif;
  font-weight: bold;
  letter-spacing: 0.02em;
  padding: 16px 20px;
  border-radius: 14px;
  margin-bottom: 6px;
  box-shadow: 0 5px 18px #13f4f533, 0 1.2px 7px #0002;
  border: none;
  text-decoration: none;
  transition: background 0.14s, color 0.13s, box-shadow .19s, transform .13s;
  text-align: left;
  outline: none;
}
.sidebar-btn-pro:hover,
.sidebar-btn-pro:focus {
  background: linear-gradient(96deg,#19e8dc 30%,#337df7 99%);
  color: #1f3544 !important;
  transform: translateY(-2px) scale(1.07);
  box-shadow: 0 10px 30px #0ef5c431;
  text-decoration: none;
}
.telegram-pro {
  background: linear-gradient(96deg, #1d5fa9 65%, #27b4ff 100%);
  color: #fff !important;
  box-shadow: 0 0 12px 2px #1d5fa999, 0 6px 22px #27b4ff38;
  border: none;
}
.telegram-pro:hover,
.telegram-pro:focus {
  background: linear-gradient(96deg,#40c7fe 30%,#145080 100%);
  color: #145080 !important;
  box-shadow: 0 0 22px 4px #40c7fe66, 0 10px 36px #015a9680;
}
.whatsapp-pro {
  background: linear-gradient(96deg, #246643 60%, #25d366 100%);
  color: #fff !important;
  box-shadow: 0 0 12px 2px #25d36690, 0 6px 22px #25d36633;
  border: none;
}
.whatsapp-pro:hover, .whatsapp-pro:focus {
  background: linear-gradient(96deg,#25d366 40%,#246643 100%);
  color: #173b21 !important;
}
.brand { display:none !important; }

/* Desktop push content when sidebar open */
@media (min-width:701px){
  #main-content{margin-left:0;transition:margin-left .3s}
  .sidebar.open ~ #main-content{margin-left:260px}
  .sidebar{transform:translateX(-100%)}
  .sidebar.open{transform:translateX(0)}
}
/* Mobile sidebar width */
@media (max-width:700px){
  #main-content{margin-left:0}
  .sidebar{width:90vw; max-width:360px;} /* keep within viewport */
  .sidebar-header-pro{padding:0 10px 13px 12px;}
  .sidebar-logo-pro{font-size:1.28em}
  .sidebar-btn-pro{font-size:1em; padding:13px 8px;}
}

/* Ads */
.ad-space{margin:24px 0 10px 0;text-align:center;min-height:60px;background:#191a23;border-radius:10px}

/* Filter bar – polished large pills (no counts) */
.filter-bar{display:flex;flex-direction:column;gap:10px;margin:12px 10px 8px 10px;max-width:1120px}
.filter-bar .primary,.filter-bar .secondary{display:flex;gap:10px;flex-wrap:wrap}

.pill{
  flex:0 0 auto;
  padding:10px 18px;
  min-height:42px;
  border-radius:999px;
  border:1.5px solid #2b3f52;
  background:linear-gradient(180deg,#172434 0%,#121c28 100%);
  color:#e9f7ff;
  font-family:'Montserrat',Arial,sans-serif;
  font-size:1.02em;
  font-weight:700;
  letter-spacing:.02em;
  cursor:pointer; white-space:nowrap;
  box-shadow:0 2px 10px #00000030,inset 0 1px 0 #2a394a;
  transition:background .18s,color .18s,border-color .18s,box-shadow .18s,transform .08s;
  outline:none;
}
.pill:active{transform:scale(.98)}
.pill.active{
  background:linear-gradient(180deg,#25d2f4 0%,#18a6c7 100%);
  color:#0a1a22;
  border-color:#25d2f4;
  box-shadow:0 6px 22px #19c7ff42,inset 0 1px 0 #7feaff;
}
.secondary.hidden{display:none}
@media (max-width:420px){ .pill{padding:10px 14px;font-size:1em} }

/* Home Poster Grid */
.poster-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px;padding:12px 9px 18px 9px;background:transparent;max-width:1120px;margin:auto}
.poster-item{background:#262838;border-radius:8px;box-shadow:0 1.5px 6px #0003;display:flex;flex-direction:column;align-items:center;cursor:pointer;transition:box-shadow .17s,background .19s;min-width:0;padding:0 0 8px 0;text-decoration:none}
.poster-item:hover{background:#212345;box-shadow:0 4px 18px #0a121c20;transform:translateY(-2px) scale(1.03)}
.poster-item img{width:100%;aspect-ratio:6/8;min-height:108px;max-height:180px;object-fit:cover;border-radius:6px 6px 0 0;background:#191a23}
.poster-item .title{color:#fff;font-size:.95em;font-weight:700;margin:10px 0 0 0;text-align:center;white-space:normal;padding:0 4px;letter-spacing:.01em}
@media (max-width:450px){.poster-grid{grid-template-columns:repeat(2,1fr)}.poster-item img{min-height:80px;max-height:110px}}

/* New Home grid uses the same sizing */
.series-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px;padding:12px 9px 18px 9px;max-width:1120px;margin:auto}
.card{background:#262838;border-radius:8px;box-shadow:0 1.5px 6px #0003;display:block;text-decoration:none;overflow:hidden;transition:transform .17s,box-shadow .17s,background .17s;max-width:100%}
.card:hover{background:#212345;box-shadow:0 4px 18px #0a121c20;transform:translateY(-2px) scale(1.03)}
.card img{width:100%;aspect-ratio:6/8;min-height:108px;max-height:180px;object-fit:cover;display:block;background:#191a23;border-radius:6px 6px 0 0}
.card .title{padding:10px 4px 12px;color:#fff;font-weight:700;font-size:.95em;text-align:center;word-break:break-word;overflow-wrap:anywhere}
@media (max-width:450px){.series-grid{grid-template-columns:repeat(2,1fr)}.card img{min-height:80px;max-height:110px}}

/* ===========================
   Series/Episodes Page
========================== */

/* make header compact; reduces top gap so page opens at top */
.pro-series-header-pro{
  display:flex;
  align-items:flex-start;
  gap:18px;
  margin:12px 0 8px 0; /* reduced top and bottom margins */
  background:#141926;
  border-radius:18px;
  box-shadow:0 2.5px 22px #07163a38;
  padding:16px 16px 14px 12px; /* slightly reduced padding */
  position:relative;
}
.pro-series-back-btn-pro{display:flex;align-items:center;background:#16233b;border-radius:11px;padding:7px 12px;color:#23c6ed;text-decoration:none;border:1.5px solid #23c6ed;font-size:1.05em;box-shadow:0 1px 9px #062a4744;margin-right:9px;position:absolute;left:12px;top:12px;transition:background .14s,border .14s,color .14s,box-shadow .13s;z-index:2}
.pro-series-back-btn-pro:hover{background:#1d2b44;color:#3de9fc;border-color:#3de9fc}
.pro-series-poster-pro{width:140px;border-radius:12px;box-shadow:0 3.5px 30px #03152588;min-width:82px;object-fit:cover}
.pro-series-meta-pro{flex:1;min-width:0;padding-left:12px}
.pro-series-title-pro{font-size:1.44em;margin:0 0 8px 0;color:#00e0ef;line-height:1.12}
.pro-series-desc-pro{color:#e2eaf5;font-size:1em;letter-spacing:.01em;text-shadow:0 1px 8px #0012151c}

/* seasons */
.pro-seasons-tabs-pro{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0 12px 10px}
.pro-season-tab-pro{background:linear-gradient(90deg,#1c285b 0%,#1ec9ee 100%);border:none;color:#fff;font-size:1.02em;padding:8px 22px;border-radius:18px;cursor:pointer;font-weight:700;letter-spacing:.04em;box-shadow:0 1.5px 8px #1a234a19;transition:background .14s,color .14s,box-shadow .18s,transform .12s}
.pro-season-tab-pro.active,.pro-season-tab-pro:focus{background:linear-gradient(90deg,#2cebf9 0%,#2bafe7 90%);color:#24282d;box-shadow:0 7px 32px #0be8d836;transform:scale(1.03)}

/* Episodes container - reduced paddings to avoid empty space */
.pro-episodes-row-wrap-pro{width:100%;background:#181f33e6;border-radius:20px;box-shadow:0 9px 31px #060f2a24;padding:12px 8px;margin-bottom:36px}

/* horizontal scroller tightened */
.pro-episodes-row-pro{display:flex;gap:14px;margin:0 8px;overflow-x:auto;padding:8px 10px 12px 10px;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;align-items:flex-start;scrollbar-color:#17e5ff #191a23}

/* compact episode card */
.pro-episode-card-pro{
  background:#141c33;
  border-radius:14px;
  min-width:140px;    /* reduced size */
  max-width:150px;
  box-shadow:0 8px 22px #2313ef13;
  cursor:pointer;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:8px;
  margin:0;
  border:1.5px solid transparent;
  text-decoration:none;
  transition:box-shadow .16s,transform .12s,border-color .12s;
  scroll-snap-align:center;
}
.pro-episode-card-pro:hover,.pro-episode-card-pro:focus{box-shadow:0 14px 34px rgba(0,0,0,0.48);border-color:rgba(35,198,237,0.12);transform:translateY(-6px);z-index:2}

/* thumbnail box fixed height to avoid variable empty space and to show full thumb */
.pro-ep-thumb-wrap-pro{position:relative;width:100%;height:110px;border-radius:10px;overflow:hidden;display:block;background:#0b0d10;flex-shrink:0}
.pro-ep-thumb-pro{width:100%;height:100%;object-fit:cover;display:block;border-radius:10px}

/* ep badge */
.pro-ep-num-pro{position:absolute;right:8px;top:8px;background:linear-gradient(90deg,#ffcf33,#ff7a5f);color:#111;font-weight:800;padding:6px 10px;border-radius:999px;font-size:12px;box-shadow:0 6px 18px rgba(255,120,60,0.12)}

/* title */
.pro-ep-title-pro{width:94%;text-align:center;font-size:15px;font-weight:800;color:#fff;padding:10px 6px 6px 6px;border-radius:8px;margin-top:8px;background:linear-gradient(180deg, rgba(255,255,255,0.01), rgba(0,0,0,0.02));box-shadow:inset 0 -6px 12px rgba(0,0,0,0.06)}

/* prevent extra big paddings */
.pro-episodes-row-wrap-pro .pro-episodes-row-pro { padding-bottom: 8px; }

/* Tutorial / premium look */
.premium-channel-message{margin-top:14px;padding:16px;border-radius:14px;background:linear-gradient(180deg,#042430 0%,#08323e 100%);border:1px solid rgba(0,160,200,0.12);color:#c6f5ff;box-shadow:0 12px 34px #0008;text-align:center}
.premium-channel-message .join-btn{display:inline-block;margin-top:12px;background:linear-gradient(90deg,#ffd400,#ff8a55);color:#13263a;font-weight:800;padding:12px 20px;border-radius:999px;box-shadow:0 12px 32px rgba(255,136,65,0.15);text-decoration:none}

/* ============================
   Streaming page – Cinematic Pro Look
============================ */
.pro-episode-view-polished{max-width:740px;margin:48px auto 0;background:linear-gradient(136deg,#16223b 80%,#15171c 100%);border-radius:35px;padding:23px 16px 44px 16px;box-shadow:0 8px 40px #03102571,0 1px 8px #fff1;display:flex;flex-direction:column;align-items:center;border:1.5px solid #253669}
.pro-episode-header-polished{display:flex;align-items:center;justify-content:flex-start;width:100%;margin-bottom:40px;gap:20px}
.pro-back-btn-polished{display:flex;align-items:center;padding:10px 33px 10px 15px;background:#17273d;border:2.3px solid #23c6ed;border-radius:900px;color:#23c6ed;font-weight:800;font-size:1.21em;text-decoration:none;box-shadow:0 3.5px 18px #1bc3e830;transition:background .16s,color .17s,border-color .15s,box-shadow .14s,transform .13s}
.pro-back-btn-polished:hover,.pro-back-btn-polished:focus{background:#153352;color:#fff;border-color:#47eaff;box-shadow:0 8px 28px #23c6ed44;outline:none;transform:translateY(-1px) scale(1.07)}
.svg-arrow{margin-right:8px;margin-bottom:-2px;stroke:#23c6ed!important}
.pro-header-title-wrap{display:flex;flex-direction:column;align-items:flex-start;flex:1;margin-left:20px;gap:10px}
.pro-series-bigname{font-family:'Montserrat',Arial,sans-serif;font-size:2.1em;font-weight:900;color:#1dedf0;letter-spacing:.01em;text-shadow:0 4px 29px #0ddbe12e,0 1.2px 6px #11b8ce58;line-height:1.1;text-align:left;filter:drop-shadow(0 2px 8px #00eae45a)}
.pro-ep-strong-title{font-family:'Montserrat',Arial,sans-serif;font-size:1.32em;font-weight:700;color:#ffd267;letter-spacing:.017em;background:linear-gradient(90deg,#2e3857 10%,#1be5d4 95%);padding:8px 24px 7px 22px;border-radius:19px;margin-top:0;box-shadow:0 3px 12px #1be5d433,0 1px 4px #31364b0a;text-align:left;display:inline-block;border:1.2px solid #11b3b1}
.pro-episode-embed-polished{width:100%;max-width:620px;margin:0 0 33px 0;border-radius:18px;box-shadow:0 7px 28px #03103349,0 .5px 8px #18151a1c;background:#0b101b;text-align:center;min-height:200px;overflow:hidden}
.pro-download-btn-polished{display:inline-block;background:linear-gradient(91deg,#0de456,#3b8bea 92%);color:#fff;padding:15px 32px 13px 32px;font-size:1.13em;font-weight:700;border-radius:14px;margin-top:15px;box-shadow:0 2.5px 17px #21a9ff33;text-decoration:none;border:none;transition:background .17s,box-shadow .15s,color .13s;cursor:pointer;letter-spacing:.03em}
.pro-download-btn-polished:hover{background:linear-gradient(89deg,#16e0a7,#368de1 92%);color:#111}
@media (max-width:800px){
  .pro-episode-view-polished{max-width:97vw;padding:11px 2vw 22px 2vw}
  .pro-episode-header-polished{flex-direction:column;align-items:flex-start;gap:10px;margin-bottom:28px}
  .pro-header-title-wrap{margin-left:0;align-items:flex-start}
  .pro-series-bigname{font-size:1.27em}
  .pro-ep-strong-title{font-size:1em;padding:6px 12px}
  .pro-episode-embed-polished{min-height:96px}
}

/* Monetag overlay + utilities */
#adBlockOverlay{position:fixed;z-index:99999;top:0;left:0;width:100vw;height:100vh;background:#111c;padding:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.2em}
.hide{display:none!important}
button,input[type="button"],input[type="submit"]{background:#23242a;color:#fff;border:1px solid #333;border-radius:6px;padding:7px 18px;font-size:1em}
button:hover{background:#272838}

/* Ensure embeds scale nicely */
.pro-episode-embed-polished iframe{width:100%!important;height:100%!important;aspect-ratio:16/9;min-height:170px;max-height:60vw;border-radius:8px;display:block;background:#000}

/* Download buttons */
.pro-download-btn-polished{display:block;background:#198fff;color:#fff;border-radius:7px;text-align:center;padding:14px 0;font-weight:600;text-decoration:none;font-size:1.03em;margin-bottom:8px;cursor:pointer;transition:background .22s,box-shadow .22s;box-shadow:0 2px 8px #0001}
.pro-download-btn-polished[aria-disabled="true"],.pro-download-btn-polished:disabled{pointer-events:none;opacity:.7;background:#666!important}

.pro-download-btns-flex{display:flex;gap:16px;flex-wrap:wrap}
.pro-tutorial-btn{display:block;background:#234a63;color:#fff!important;padding:12px 24px;margin:8px 0 0 0;border-radius:8px;text-align:center;font-weight:600;text-decoration:none;font-size:1.03em;transition:background .16s}
.pro-tutorial-btn:hover{background:#195787}
.pro-premium-btn{display:block;background:#099c7d;color:#fff!important;padding:13px 24px;margin:12px 0 0 0;border-radius:8px;text-align:center;font-weight:600;font-size:1.12em;letter-spacing:.01em;transition:background .16s}
.pro-premium-btn:hover{background:#07785e}

/* ===========================
   Pro Highlighted Tutorial Section
=========================== */
.pro-highlight-section {
  background: linear-gradient(106deg,#124576 20%,#1dc3fa 100%);
  border-radius: 18px 18px 0 0;
  padding: 19px 12px 15px 12px;
  text-align: center;
  box-shadow: 0 4px 20px #12c0fa25;
  max-width: 650px;
  margin: 32px auto 0 auto;
  border: 1.5px solid #15b4eb;
}
.pro-highlight-title {
  font-size: 1.55em;
  color: #fff;
  font-family: 'Montserrat', Arial, sans-serif;
  font-weight: 800;
  letter-spacing: 0.5px;
  margin: 0;
  line-height: 1.16;
  text-shadow: 0 2px 18px #0993ce32, 0 1.5px 9px #0002;
}
.pro-video-card {
  background: #162438;
  border-radius: 0 0 18px 18px;
  box-shadow: 0 6px 24px #1dc3fa1f;
  border: 1.5px solid #15b4eb;
  max-width: 650px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 50px;
  overflow: hidden;
  padding-bottom: 8px;
}
.pro-video-frame-wrap { position: relative; width: 100%; height: 0; padding-bottom: 56.25%; }
.pro-video-frame-wrap iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 0 0 18px 18px; border: none; }
#ad-above-player, #ad-below-player { display: flex; justify-content: center; margin: 18px 0; }
.download-red-btn {
  display: inline-block;
  padding: 15px 38px;
  font-size: 1.16em;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(90deg, #c5162c 0%, #f44336 100%);
  border: none;
  border-radius: 11px;
  box-shadow: 0 2px 6px rgba(197,22,44,0.11), 0 1px 2px rgba(0,0,0,0.09);
  letter-spacing: 0.09em;
  cursor: pointer;
  transition: box-shadow 0.19s, transform 0.14s;
  text-align: center;
  outline: none;
  text-decoration: none;
}
.download-red-btn:hover,
.download-red-btn:focus { background: linear-gradient(90deg, #d81b42 0%, #ff6363 100%); box-shadow: 0 4px 14px rgba(197,22,44,0.13), 0 2px 6px rgba(0,0,0,0.1); transform: translateY(-2px) scale(1.04); }
.download-red-btn:active { background: linear-gradient(90deg, #b31327 0%, #c5162c 100%); box-shadow: 0 1px 3px rgba(197,22,44,0.09), 0 1px 1px rgba(0,0,0,0.07); transform: translateY(1px) scale(0.98); }

/* --- NEW EPISODES PREMIUM SECTION --- */
.new-episodes-section {
  background: radial-gradient(circle at 34% 36%, #232f3e 74%, #101a24 100%);
  margin: 28px 0 16px 0;
  border-radius: 16px;
  box-shadow: 0 5px 22px #0007, 0 2px 10px #ffd70033;
  padding: 18px 0 13px 0;
}
.new-episodes-section h2 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 1.17em;
  margin: 0 0 14px 26px;
  color: #ffd700;
  letter-spacing: .07em;
  text-shadow: 0 2px 8px #ffe49344, 0 1px 6px #1930407a;
  display: flex; align-items: center;
}
.new-episodes-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  justify-content: flex-start;
  padding: 0 24px 14px 24px; /* keep padding; width remains 100% */
  min-height: 120px;
}
.episode-card-pro {
  background: linear-gradient(135deg, #1a232b 85%, #ffd7001b 100%);
  border-radius: 12px;
  box-shadow: 0 3px 18px #0005, 0 1px 7px #ffd70030;
  width: 150px; min-width: 110px; max-width: 184px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  transition: box-shadow .2s;
  max-width: 100%;
}
.episode-card-pro:hover { box-shadow: 0 8px 32px #ffd70048, 0 4px 26px #212f4055; }
.episode-img-pro { width: 100%; height: 92px; object-fit: cover; border-radius: 11px 11px 0 0; box-shadow: 0 2px 10px #ffd70016; }
.series-title-pro {
  font-family: 'Montserrat',sans-serif;
  font-weight: 600;
  color: #23c6ed;
  text-align: center;
  font-size: 1.02em;
  margin: 10px 0 0 0;
  letter-spacing: .02em;
  word-break: break-word; overflow-wrap: anywhere;
}
.episode-title-pro {
  color: #ffd700;
  font-family: 'Montserrat',sans-serif;
  font-weight: 800;
  font-size: 1.02em;
  text-align: center;
  margin: 5px 0 0 0;
  letter-spacing: .01em;
  text-shadow: 0 1px 6px #1a232b42;
  word-break: break-word; overflow-wrap: anywhere;
}
.new-badge-pro {
  background: #ffd700;
  color: #232f3e;
  font-family: 'Montserrat',sans-serif;
  font-weight: 700;
  font-size: 0.8em;
  border-radius: 7px;
  padding: 2px 11px;
  margin-left: 8px;
  box-shadow: 0 0 14px #ffd70038;
  max-width: 100%;
}
.watch-btn-pro {
  margin: 14px 0 14px 0;
  color: #fff;
  background: linear-gradient(90deg, #198fff 70%, #ffd700 100%);
  border-radius: 8px;
  padding: 10px 30px;
  text-decoration: none;
  font-family: 'Montserrat',sans-serif;
  font-weight: 600;
  font-size: 1em;
  box-shadow: 0 1px 9px #198fff22;
  border:none;
  transition: background .2s;
  cursor:pointer;
  max-width: 100%;
}
.watch-btn-pro:hover { background: linear-gradient(90deg,#ffd700 28%,#198fff 100%); color:#1a232b; box-shadow:0 3px 24px #ffd70042; }
@media (max-width: 600px) {
  .new-episodes-grid { gap:7px; padding:0 6px 12px 6px; }
  .episode-card-pro { width:44vw; min-width:90px;}
  .episode-img-pro { height: 60px;}
  .new-episodes-section h2 { margin:7px 0 9px 8px;font-size:1em;}
}

/* Schedule bar (ensure no overflow) */
.schedule-bar {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  background: #232f3e;
  border-radius: 9px;
  box-shadow: 0 1px 8px #0003;
  padding: 7px 12px;
  margin: 13px 16px 6px 16px;
  min-height: 42px;
  max-width: 600px;
  width: 100%;
}
.schedule-entry {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #101a24;
  border-radius: 7px;
  padding: 6px 8px;
  margin-bottom:6px;
}

/* Utility: isolate horizontal scrollers only where needed */
.is-horizontal {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
}
/* Title row already added earlier */
.schedule-title { display:flex; flex-wrap:wrap; gap:6px; align-items:center; }

/* Day + time row before meta */
.schedule-when {
  display:flex; align-items:center; gap:6px;
  margin-top:4px; color:#9fd3ff; font-weight:600;
  flex-wrap:wrap;
}
.schedule-when .day { color:#ffd267; }
.schedule-when .time { color:#9fd3ff; }
.schedule-when .sep { opacity:.6; }

/* Meta row (type, icons) stays below */
.meta { margin-top:2px; color:#cde4ff; opacity:.9; }

/* Small screens: stack neatly */
@media (max-width:420px){
  .schedule-when { gap:4px; }
}
/* Compact single line under title */
.schedule-row{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  font-size:0.86em; line-height:1.25;
}
.schedule-row .day  { color:#ffd267; font-weight:600; }
.schedule-row .time { color:#9fd3ff; font-weight:600; }
.schedule-row .type { color:#23c6ed; font-weight:600; }
.schedule-row .dot  { opacity:.6; }

/* Optional: even tighter on very small screens */
@media (max-width:420px){
  .schedule-row{ font-size:0.84em; gap:6px; }
}

/* Header premium CTA */
.premium-cta{
  margin-left:auto; /* push to right side */
  display:inline-flex; align-items:center; justify-content:center;
  height:34px; padding:0 12px; border-radius:999px;
  background:#ffd400; color:#13263a; font-weight:800; text-decoration:none;
  box-shadow:0 3px 10px #ffd40055; line-height:1;
}
.premium-cta:active{ transform:translateY(1px); }
@media (max-width:420px){
  .premium-cta{ height:32px; padding:0 10px; font-size:.92em; }
}

.intl-note{
  width:100%;
  background:#0d2030;
  border:1px solid #284e70;
  color:#aee6ff;
  padding:8px 10px;
  border-radius:10px;
  font-weight:700;
  text-align:center;
  font-size:.95em;
}

/* Buttons */
.btn-primary{
  display:inline-block;
  background:#ffd400;
  color:#13263a;
  font-weight:800;
  padding:10px 16px;
  border-radius:999px;
  box-shadow:0 4px 14px #ffd40055;
  text-align:center;
}
.btn-primary:active{ transform:translateY(1px); }

.hero p{ margin-bottom:8px; }
.trust{ margin-top:8px; }

/* keep premium-channel-message links tidy */
.premium-channel-message a{ text-decoration:none; color:inherit; }
.premium-channel-message a:hover{ text-decoration:none; }

/* Footer nav fallback spacing helper (ensures content not hidden) */
@media (max-width:600px){
  body { padding-bottom: calc(96px + env(safe-area-inset-bottom)); }
}

/* Responsiveness adjustments */
@media (max-width:850px){
  .pro-series-header-pro{flex-direction:column;align-items:center}
  .pro-series-poster-pro{width:92px}
  .pro-series-title-pro{text-align:center}
}
@media (max-width:440px){
  .pro-episode-card-pro{min-width:110px;max-width:122px;padding:6px}
  .pro-ep-thumb-wrap-pro{height:92px}
  .pro-ep-title-pro{font-size:.95em}
  .pro-series-poster-pro{width:80px}
}
/* Footer Navigation Bar */
.footer-nav {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: rgba(0, 0, 0, 0.95);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    display: flex;
    justify-content: space-around;
    padding: 8px 0 10px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    z-index: 1000;
}

.nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: rgba(255, 255, 255, 0.6);
    text-decoration: none;
    font-size: 0.7rem;
    padding: 5px 15px;
    transition: all 0.3s ease;
    -webkit-tap-highlight-color: transparent;
}

.nav-item:active {
    transform: scale(0.9);
}

.nav-item.active {
    color: #00a8ff;
}

.nav-item:hover {
    color: #00a8ff;
}

.nav-icon {
    font-size: 1.4rem;
    margin-bottom: 3px;
}
.episode-item.active {
  border: 2px solid #4CAF50;
  /* Or background highlight: */
  /* background-color: #e3f2fd; */
  border-radius: 5px;
}
.episode-item {
  transition: none !important;
  -webkit-tap-highlight-color: transparent;
  animation: none !important;
}

.episode-item:active {
  transform: none;
  animation: none;
}

/* End of file */
