/* WEB PLAYER 2 — interface premium, responsiva e leve */
:root { --nx-bg:#09090c; --nx-surface:#121117; --nx-surface-2:#1a1820; --nx-border:#2b2933; --nx-text:#f7f7f8; --nx-muted:#9a97a3; --nx-red:#ff2a30; --nx-red-deep:#530d17; --nx-green:#2dd57b; --nx-radius:16px; }
html { background:var(--nx-bg); }
body { background:var(--nx-bg)!important; color:var(--nx-text)!important; font-family:Inter,Roboto,Arial,sans-serif!important; }
body::selection { background:var(--nx-red); color:#fff; }
.top-nav { height:56px!important; padding:0 20px!important; background:rgba(12,11,15,.95)!important; border-bottom:1px solid rgba(255,255,255,.07)!important; backdrop-filter:blur(18px)!important; }
.top-nav .nav-logo { height:22px!important; filter:brightness(0) invert(1)!important; }
.top-nav .nav-links { gap:5px!important; }
.top-nav .nav-link { padding:9px 13px!important; border:1px solid transparent; border-radius:10px; color:#b9b5c0!important; font-size:12px!important; font-weight:800!important; opacity:1!important; }
.top-nav .nav-link:hover,.top-nav .nav-link.active { color:#fff!important; background:rgba(255,42,48,.13)!important; border-color:rgba(255,42,48,.5)!important; }
.profile-section { margin-right:0!important; background:transparent!important; border:0!important; padding:4px!important; }
.profile-section > span { color:#fff!important; font-size:11px!important; }
.avatar-box { width:31px!important; height:31px!important; border:1px solid var(--nx-border); }
.dropdown-menu { background:var(--nx-surface)!important; border-color:var(--nx-border)!important; }
.mobile-nav { background:rgba(18,17,23,.96)!important; border:1px solid var(--nx-border)!important; border-radius:18px!important; backdrop-filter:blur(18px)!important; }
.mob-item.active,.mob-item:hover { color:#fff!important; }
.mob-item.active i { color:var(--nx-red)!important; }

/* Home */
.hero-wrapper { min-height:560px!important; height:78vh!important; margin:16px!important; width:calc(100% - 32px)!important; border:1px solid var(--nx-border); border-radius:24px; overflow:hidden; align-items:flex-end!important; justify-content:flex-start!important; }
.hero-overlay { background:linear-gradient(90deg,rgba(5,5,7,.95) 0%,rgba(5,5,7,.6) 38%,rgba(5,5,7,.12) 75%),linear-gradient(0deg,#09090c 0%,transparent 45%)!important; }
.hero-content { max-width:640px!important; margin:0 0 72px 30px!important; padding:0!important; align-items:flex-start!important; text-align:left!important; }
.hero-content .meta-row,.hero-content .actions-row { justify-content:flex-start!important; }
.fallback-title { text-align:left!important; font-size:clamp(2.4rem,5vw,4.5rem)!important; }
.movie-desc { text-align:left!important; color:#d2cfd6!important; }
.btn-action { border-radius:13px!important; padding:13px 24px!important; }
.btn-play { background:#fff!important; color:#111!important; }
.btn-info { border:1px solid var(--nx-border)!important; background:rgba(25,24,30,.9)!important; }
.quick-access { margin:-45px auto 90px!important; max-width:1280px!important; }
.quick-card { min-height:132px!important; background:linear-gradient(150deg,#1c1a21,#121116)!important; border-color:var(--nx-border)!important; box-shadow:none!important; }
.quick-card:hover { background:linear-gradient(150deg,#30151b,#171419)!important; border-color:var(--nx-red)!important; }

/* Catálogos */
.center-container { max-width:1380px!important; padding:0 24px; }
.catalog-shell { display:flex; gap:18px; padding-top:56px; }
.catalog-shell .center-container { flex:1; min-width:0; }
.catalog-rail { position:sticky; top:72px; width:265px; height:calc(100vh - 88px); overflow:auto; flex:none; padding:18px 12px; background:#111015; border-right:1px solid var(--nx-border); }
.catalog-rail h2 { margin:0 8px 14px; font-size:18px; }
.catalog-rail input { width:100%; padding:12px; margin:0 0 12px; }
.catalog-rail button { display:flex; align-items:center; width:100%; margin:3px 0; padding:10px 12px; color:#d9d5dd; border:1px solid transparent; border-radius:10px; background:transparent; font-weight:750; font-size:12px; text-align:left; cursor:pointer; }
.catalog-rail button::before { content:'◆'; color:var(--nx-red); font-size:10px; margin-right:8px; }
.catalog-rail button:hover,.catalog-rail button.is-active { color:#fff; background:rgba(255,42,48,.14); border-color:rgba(255,42,48,.55); }
.content-header { padding-top:94px!important; text-align:left!important; display:flex; align-items:center; justify-content:space-between; }
.content-header h1 { font-size:26px!important; letter-spacing:-.7px!important; margin:0!important; }
#MoviesGrid,#SeriesGrid { grid-template-columns:repeat(auto-fill,minmax(142px,1fr))!important; gap:14px!important; padding:16px 0 96px!important; }
.movie-card,.series-card { border-radius:15px!important; background:var(--nx-surface)!important; border:1px solid var(--nx-border)!important; box-shadow:0 8px 24px rgba(0,0,0,.18); }
.movie-card:hover,.series-card:hover { border-color:var(--nx-red)!important; transform:translateY(-5px) scale(1.02)!important; }
.top-nav-inner > div:first-child a,.back-btn { border:1px solid var(--nx-border)!important; background:#17151c!important; border-radius:10px!important; }
.search-container,.top-nav-inner > div:last-child { background:#17151d!important; border:1px solid var(--nx-border); }
#catModal { background:rgba(0,0,0,.78)!important; }
.cat-container { background:#121117!important; border:1px solid var(--nx-border)!important; box-shadow:0 24px 90px rgba(0,0,0,.65); }
.cat-item { background:#1c1a22!important; border:1px solid #2b2933; text-align:left!important; }
.cat-item:hover { background:rgba(255,42,48,.16)!important; border-color:var(--nx-red); }
#DetailModal { background:#09090c!important; }
.hero-info { border-radius:0 0 26px 26px; overflow:hidden; }
.episode-item { background:#141319!important; border-color:var(--nx-border)!important; border-radius:14px!important; }
.episode-item:hover { background:#21141a!important; border-color:var(--nx-red)!important; }

/* Canais */
.app-container { padding:72px 14px 14px!important; gap:0; background:var(--nx-bg)!important; }
.app-container .sidebar { order:-1; width:280px!important; background:#111015!important; border:1px solid var(--nx-border)!important; border-radius:18px 0 0 18px; }
.app-container .main-player { border:1px solid var(--nx-border); border-left:0; border-radius:0 18px 18px 0; overflow:hidden; }
.sidebar-header { padding:16px!important; background:#111015!important; }
.channel-list { padding:10px!important; }
.channel-item { padding:10px!important; border-radius:11px!important; margin-bottom:5px!important; background:transparent!important; }
.channel-item:hover { transform:none!important; background:#1c1a20!important; }
.channel-item.active { background:rgba(255,42,48,.16)!important; border-color:rgba(255,42,48,.65)!important; }
.channel-logo { width:38px!important; height:38px!important; margin-right:11px!important; border-radius:9px!important; }
.channel-name { font-size:12px!important; }
.category-pill { background:#1a1820!important; border-color:var(--nx-border)!important; }
.category-pill.active,.category-pill:hover { background:rgba(255,42,48,.15)!important; border-color:var(--nx-red)!important; }
#player-container { background:#000!important; }
.epg-panel { background:#111015!important; padding:22px!important; }
.now-playing-overlay { background:rgba(14,13,18,.88)!important; border-color:var(--nx-border)!important; }
.btn-back { background:#16151b!important; border-color:var(--nx-border)!important; }

/* Login e perfis */
.login-page,.auth-page { background:radial-gradient(circle at 10% 20%,rgba(139,13,25,.35),transparent 32%),var(--nx-bg)!important; }
input,select { background:#1c1a22!important; color:#fff!important; border-color:var(--nx-border)!important; border-radius:11px!important; }
button { font-family:inherit; }

@media (max-width:768px) {
  .top-nav { height:62px!important; padding:0 14px!important; }
  .top-nav .nav-links,.top-nav .profile-section > span { display:none!important; }
  .top-nav .nav-left-group { width:100%; justify-content:center; }
  .top-nav .nav-logo { height:20px!important; }
  .hero-wrapper { height:560px!important; min-height:0!important; width:calc(100% - 20px)!important; margin:10px!important; border-radius:22px!important; }
  .hero-content { margin:0 22px 58px!important; max-width:none!important; }
  .fallback-title { font-size:36px!important; }
  .quick-access { margin:-16px 14px 96px!important; padding:0!important; }
  .quick-access { display:none!important; }
  .quick-card { min-height:90px!important; }
  .center-container { padding:0 12px!important; }
  .catalog-shell { display:block; padding-top:0; }
  .catalog-rail { display:none; }
  .content-header { padding:85px 4px 16px!important; }
  #MoviesGrid,#SeriesGrid { grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:10px!important; padding-top:10px!important; }
  .app-container { display:block!important; padding:62px 0 0!important; }
  .app-container .main-player { border:0!important; border-radius:0!important; }
  .app-container .sidebar { order:initial; width:100%!important; min-height:0!important; border:0!important; border-radius:0!important; }
  #player-container { position:relative!important; }
  .zoom-btn-container,.engine-stats,#StreamStats,#epg-info { display:none!important; }
  .now-playing-overlay { bottom:12px!important; left:12px!important; max-width:calc(100% - 24px)!important; padding:8px 10px!important; }
  .now-playing-overlay strong { font-size:12px!important; }
  .epg-panel { min-height:0!important; padding:16px 16px 8px!important; border-bottom:1px solid var(--nx-border); }
  .epg-title { font-size:20px!important; }
  .app-container .sidebar { background:var(--nx-bg)!important; }
  .app-container .sidebar-header { padding:14px 16px 8px!important; background:var(--nx-bg)!important; }
  .app-container #KidsToggle { display:none!important; }
  .app-container .channel-list { padding:8px 16px 96px!important; }
  .app-container .channel-item { min-height:58px; margin-bottom:7px!important; background:#141319!important; border:1px solid var(--nx-border)!important; }
  .app-container .channel-item.active { background:rgba(255,42,48,.16)!important; }
  .app-container .custom-select { min-height:54px!important; }
  .app-container .category-pill { padding:10px 13px!important; }
  .sidebar-header { position:sticky; top:62px; z-index:10; }
  .category-pills { padding-bottom:8px!important; }
}

@media (max-width:900px) and (orientation:landscape) {
  #MoviesGrid,#SeriesGrid { grid-template-columns:repeat(6,minmax(0,1fr))!important; gap:9px!important; }
  .movie-card,.series-card { border-radius:11px!important; }
  .top-nav { height:52px!important; }
  .catalog-shell { padding-top:0!important; }
}

#catModal.is-open { display:flex!important; }
@media (max-width:768px) { #catModal { align-items:flex-end!important; padding:0!important; } #catModal .cat-container { width:100%!important; max-width:none!important; max-height:78dvh; overflow:hidden; border-radius:22px 22px 0 0!important; padding:20px!important; } #catModal .cat-list { max-height:56dvh!important; grid-template-columns:1fr!important; } }
