/* Definitiva TV · Premium Theme v7.4
   ADDITIVE ONLY: does not remove or replace existing interface elements.
   Legacy-safe first, modern enhancements second. No external fonts/frameworks. */

/* =========================================================
   1) BASE PALETTE / FALLBACKS
========================================================= */
html,body{
  background:#07090c;
  color:#f4f6f8;
  font-family:Arial,"Helvetica Neue",Helvetica,sans-serif;
  -webkit-text-size-adjust:100%;
}
body{
  background:#07090c;
  background:linear-gradient(180deg,#07090c 0%,#090c10 48%,#07090c 100%);
}
button,input,select,textarea{font-family:Arial,"Helvetica Neue",Helvetica,sans-serif}
a{color:inherit}

/* Accent: refined gold / amber, intentionally restrained */
.sidebar,
.topbar,
.categories,
.catalog,
.card,
.login-card,
.channel-overlay,
.mini-guide{
  -webkit-font-smoothing:antialiased;
}

/* =========================================================
   2) APP SHELL / NAVIGATION
========================================================= */
.sidebar{
  background:#090c10!important;
  border-right:1px solid #222831!important;
  box-shadow:10px 0 34px rgba(0,0,0,.22)!important;
}
.sidebar:before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:2px;
  background:#d99119;
  background:linear-gradient(90deg,#f1b23a 0%,#d98718 42%,rgba(217,135,24,0) 100%);
}
.brand.compact{
  border-bottom:1px solid #20262e!important;
}
.brand.compact strong{
  color:#f7f7f7!important;
  letter-spacing:.12em!important;
}
.brand.compact span{
  color:#dda33f!important;
  letter-spacing:.18em!important;
}
.nav,.logout{
  border-radius:11px!important;
  border:1px solid transparent!important;
  color:#aeb7c2!important;
  background:transparent!important;
  text-shadow:none!important;
}
.nav:hover,.nav:focus,.nav.active,
.logout:hover,.logout:focus{
  color:#fff!important;
  background:#12171d!important;
  border-color:#252c35!important;
  outline:none;
}
.nav.active{
  box-shadow:inset 3px 0 0 #e0a034!important;
}
.nav.active:before{display:none!important}

/* =========================================================
   3) TOPBAR / SEARCH
========================================================= */
.topbar{
  background:#090c10!important;
  background:rgba(9,12,16,.97)!important;
  border-bottom:1px solid #222831!important;
  box-shadow:0 8px 30px rgba(0,0,0,.18)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
.topbar h2{
  color:#f4f5f7!important;
  font-weight:700!important;
  letter-spacing:.01em!important;
}
#accountInfo{
  color:#87919d!important;
}
.search{
  background:#0e1319!important;
  border:1px solid #29323c!important;
  border-radius:12px!important;
  min-height:42px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}
.search:focus-within{
  border-color:#93661f!important;
  box-shadow:0 0 0 2px rgba(213,153,50,.10)!important;
}
.search input{color:#f1f3f5!important}
.search input::-webkit-input-placeholder{color:#687480!important}
.search input::-moz-placeholder{color:#687480!important}
.search input:-ms-input-placeholder{color:#687480!important}
.search input::placeholder{color:#687480!important}

/* =========================================================
   4) CATEGORIES / CONTENT
========================================================= */
.content-layout{background:transparent!important}
.categories{
  background:#0b0f14!important;
  border:1px solid #222a33!important;
  border-radius:16px!important;
  box-shadow:0 14px 34px rgba(0,0,0,.16)!important;
}
.categories h3,.catalog-header h3{
  color:#8d98a4!important;
  letter-spacing:.10em!important;
}
.categories button{
  color:#aeb7c0!important;
  border:1px solid transparent!important;
  border-radius:10px!important;
  background:transparent!important;
}
.categories button:hover,
.categories button:focus,
.categories button.active{
  background:#141a21!important;
  color:#fff!important;
  border-color:#29313b!important;
  outline:none;
}
.categories button.active{
  color:#e9b859!important;
}

/* =========================================================
   5) CONTENT CARDS
========================================================= */
.card{
  background:#0d1217!important;
  border:1px solid #202832!important;
  border-radius:15px!important;
  box-shadow:0 8px 20px rgba(0,0,0,.18)!important;
  overflow:hidden;
  -webkit-transform:translateZ(0);
  transform:translateZ(0);
}
.card:hover,.card:focus{
  border-color:#5b4726!important;
  box-shadow:0 16px 34px rgba(0,0,0,.28),0 0 0 1px rgba(222,165,58,.05)!important;
  -webkit-transform:translateY(-2px);
  transform:translateY(-2px);
  outline:none;
}
.card .poster{
  background:#10151b!important;
}
.card .poster:after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:34%;
  pointer-events:none;
  background:transparent;
  background:linear-gradient(180deg,rgba(13,18,23,0),rgba(13,18,23,.84));
}
.card-body{
  background:#0d1217!important;
  border-top:1px solid rgba(255,255,255,.02);
}
.card-title{
  color:#f3f5f7!important;
  font-weight:700!important;
}
.card-meta{
  color:#d8a64d!important;
  font-weight:700!important;
}
.fav-mini{
  background:#0a0e13!important;
  border:1px solid #343e49!important;
  box-shadow:0 4px 12px rgba(0,0,0,.25)!important;
}
.fav-mini:hover,.fav-mini:focus{
  color:#f0bc5d!important;
  border-color:#8d6829!important;
  outline:none;
}
.play-badge{
  background:#090c10!important;
  color:#e7ebef!important;
  border:1px solid rgba(255,255,255,.10)!important;
}

/* subtle modern depth only if supported */
@supports (box-shadow:0 0 0 rgba(0,0,0,.1)){
  .card:hover{
    box-shadow:0 18px 42px rgba(0,0,0,.32),0 0 22px rgba(201,143,39,.045)!important;
  }
}

/* =========================================================
   6) PLAYER
========================================================= */
.modal,.modal-shell{background:#000!important}
.modal-shell{
  border:0!important;
  box-shadow:none!important;
}
.player-overlay-top{
  background:#000!important;
  background:linear-gradient(180deg,rgba(0,0,0,.90),rgba(0,0,0,.44) 62%,rgba(0,0,0,0))!important;
}
.player-heading strong{
  color:#fff!important;
  font-weight:700!important;
}
.player-heading span{color:#a7b0ba!important}
.top-actions button,.control-btn{
  background:#0c1015!important;
  border:1px solid #303a45!important;
  color:#f5f6f7!important;
  border-radius:10px!important;
  box-shadow:none!important;
}
.top-actions button:hover,.top-actions button:focus,
.control-btn:hover,.control-btn:focus{
  background:#151b22!important;
  border-color:#6c5530!important;
  outline:2px solid rgba(224,165,59,.48)!important;
  outline-offset:2px!important;
}
.primary-control{
  background:#df9c2f!important;
  background:linear-gradient(135deg,#efbd5d,#d98517)!important;
  color:#111!important;
  border:0!important;
}
.controls{
  background:#000!important;
  background:linear-gradient(0deg,rgba(0,0,0,.97),rgba(0,0,0,.70) 58%,rgba(0,0,0,0))!important;
}
.control-select{
  background-color:#0e1319!important;
  border-color:#303944!important;
  color:#ecf0f3!important;
}
.video-status{
  color:#f3f4f5!important;
  text-shadow:0 2px 10px rgba(0,0,0,.75)!important;
}
.spinner{
  border-color:rgba(255,255,255,.25)!important;
  border-top-color:#dfa33c!important;
}
.big-play{
  background:#0b0e12!important;
  background:rgba(11,14,18,.90)!important;
  border:1px solid rgba(255,255,255,.22)!important;
}
.channel-overlay{
  background:#0a0e13!important;
  background:rgba(10,14,19,.95)!important;
  border:1px solid #26303a!important;
  box-shadow:0 16px 40px rgba(0,0,0,.36)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
.mini-guide{
  background:#090d12!important;
  background:rgba(9,13,18,.98)!important;
}

/* =========================================================
   7) LOGIN
========================================================= */
.login-view{
  background:#07090c!important;
  background:linear-gradient(145deg,#07090c,#0a0e13 58%,#07090c)!important;
}
.login-glow{
  display:block!important;
  opacity:.16!important;
  filter:none!important;
  -webkit-filter:none!important;
}
.login-card{
  background:#0b1015!important;
  border:1px solid #27303a!important;
  border-radius:20px!important;
  box-shadow:0 30px 70px rgba(0,0,0,.42)!important;
}
.login-card:before{
  content:"";
  position:absolute;
  top:0;left:28px;right:28px;
  height:2px;
  background:#d89829;
  background:linear-gradient(90deg,transparent,#e5ad49,transparent);
}
.login-card h1{color:#f7f8f9!important}
.login-card p{color:#8e99a4!important}
.login-card input{
  background:#080c10!important;
  color:#f3f4f6!important;
  border-color:#303944!important;
  border-radius:10px!important;
}
.login-card input:focus{
  border-color:#906522!important;
  box-shadow:0 0 0 2px rgba(216,159,53,.10)!important;
}
.primary,.load-more{
  background:#df9d30!important;
  background:linear-gradient(135deg,#efbd5d,#d98517)!important;
  color:#111!important;
  border:0!important;
  border-radius:10px!important;
  font-weight:700!important;
}

/* =========================================================
   8) MICRO-DETAILS
========================================================= */
button,.nav,.card,.categories button,.control-btn,.top-actions button{
  -webkit-tap-highlight-color:rgba(0,0,0,0);
}
button:disabled{opacity:.55!important}
hr{border-color:#202730!important}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:#080b0f}
::-webkit-scrollbar-thumb{background:#2a323b;border:2px solid #080b0f;border-radius:10px}
::-webkit-scrollbar-thumb:hover{background:#46505b}

/* =========================================================
   9) TV / REMOTE FOCUS
========================================================= */
.nav:focus,.logout:focus,.categories button:focus,.card:focus,
.fav-mini:focus,.control-btn:focus,.top-actions button:focus,
.control-select:focus,.load-more:focus{
  outline:3px solid #fff!important;
  outline-offset:2px!important;
  box-shadow:0 0 0 5px rgba(216,157,50,.50)!important;
}
html.tv-mode .card:focus,
html.tv-mode .nav:focus,
html.tv-mode #categoryList button:focus{
  -webkit-transform:scale(1.025)!important;
  transform:scale(1.025)!important;
}

/* =========================================================
   10) OLD BROWSER / OLD SMART TV FALLBACK
========================================================= */
html.dtv-legacy body{background:#080b0f!important}
html.dtv-legacy .sidebar,
html.dtv-legacy .topbar,
html.dtv-legacy .categories,
html.dtv-legacy .card,
html.dtv-legacy .login-card,
html.dtv-legacy .channel-overlay,
html.dtv-legacy .mini-guide{
  box-shadow:none!important;
}
html.dtv-legacy *{
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  filter:none!important;
}
html.dtv-legacy .card,
html.dtv-legacy .nav,
html.dtv-legacy .categories button,
html.dtv-legacy .control-btn,
html.dtv-legacy .top-actions button{
  transition:none!important;
  animation:none!important;
}
html.dtv-legacy .card:hover,
html.dtv-legacy .card:focus{
  -webkit-transform:none!important;
  transform:none!important;
}
html.dtv-legacy .card .poster:after{display:none!important}
html.dtv-legacy ::-webkit-scrollbar{width:auto;height:auto}

/* =========================================================
   11) RESPONSIVE / PERFORMANCE
========================================================= */
@media(max-width:760px){
  .sidebar{box-shadow:none!important}
  .card{border-radius:12px!important}
  .topbar{box-shadow:0 5px 18px rgba(0,0,0,.16)!important}
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
  }
}

/* Modern-only finesse; ignored by older engines */
@supports (color:color-mix(in srgb,#fff,#000)){
  .card{
    border-color:color-mix(in srgb,#2b343e 82%,#b98027 18%)!important;
  }
}