/* Small overrides to keep theme look while fitting the IPTVNetworking logo */

header .navbar-header.logo img.logo,
#preloader img.logo,
footer img.logo {
  width: auto !important;
  max-height: 58px;
}

@media (max-width: 767px) {
  header .navbar-default img.logo {
    width: auto !important;
    max-height: 46px;
  }
}

/* Homepage sidebar: subscription + reseller widgets */
.sidebar .sb-it.sb-plans .sb-plans-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.sidebar .sb-it.sb-plans .sb-plan {
  /* force a visible card look; theme sidebar blocks are otherwise very minimal */
  display: flex !important;
  flex-direction: column;
  gap: 10px;
  position: relative;
  background: rgba(11, 28, 48, 0.75) !important;
  border: 1px solid #233a50 !important;
  border-radius: 8px;
  padding: 14px;
  overflow: visible;
}

.sidebar .sb-it.sb-plans .sb-plan-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.sidebar .sb-it.sb-plans .sb-plan-name {
  font-family: 'Dosis', sans-serif;
  font-size: 14px;
  font-weight: bold;
  margin: 0;
  line-height: 1.25;
  flex: 1 1 auto;
  min-width: 0;
}

.sidebar .sb-it.sb-plans .sb-plan-name a {
  color: #ffffff !important;
  display: block;
}

.sidebar .sb-it.sb-plans .sb-plan-name a:hover {
  color: #dcf836;
}

.sidebar .sb-it.sb-plans .sb-plan-price {
  font-family: 'Dosis', sans-serif;
  font-size: 14px;
  font-weight: bold;
  color: #dcf836 !important;
  white-space: nowrap;
  flex: 0 0 auto;
}

.sidebar .sb-it.sb-plans .sb-plan-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
}

.sidebar .sb-it.sb-plans .sb-plan-pill {
  font-family: 'Nunito', sans-serif;
  font-size: 12px;
  color: #abb7c4;
  background: rgba(2, 13, 24, 0.35);
  border: 1px solid #233a50;
  border-radius: 999px;
  padding: 4px 10px;
}

.sidebar .sb-it.sb-plans .sb-plan-btn.redbtn {
  /* make buttons consistent and prevent any overlap */
  display: block !important;
  width: 100% !important;
  text-align: center;
  margin-top: 0;
  padding: 10px 14px;
  font-size: 12px;
  border-radius: 5px;
  line-height: 1.2;
  float: none !important;
  position: static !important;
  z-index: 1;
}

.sidebar .sb-it.sb-plans .sb-more.btn {
  display: inline-block;
  margin-top: 16px;
  padding: 0;
  background: transparent;
  border: 0;
  color: #ffffff;
  font-weight: 600;
  letter-spacing: .2px;
  transition: color .2s ease, opacity .2s ease;
}

.sidebar .sb-it.sb-plans .sb-more.btn:visited {
  color: #ffffff;
}

.sidebar .sb-it.sb-plans .sb-more.btn:hover,
.sidebar .sb-it.sb-plans .sb-more.btn:focus,
.sidebar .sb-it.sb-plans .sb-more.btn:active {
  color: #dcf836;
}

.sidebar .sb-it.sb-plans .sb-more.btn i {
  color: inherit;
}

.sidebar .sb-it.sb-plans .sb-empty {
  font-family: 'Nunito', sans-serif;
  font-size: 13px;
  color: #abb7c4;
  margin: 0 0 12px;
}

/* If the sidebar gets narrow, stack name + price cleanly */
@media (max-width: 1199px) {
  .sidebar .sb-it.sb-plans .sb-plan-head {
    flex-direction: column;
    align-items: flex-start;
  }
  .sidebar .sb-it.sb-plans .sb-plan-price {
    margin-top: -4px;
  }
}

/* Extra safety: make sure any inherited transforms/positioning from theme widgets can't break these cards */
.sidebar .sb-it.sb-plans * {
  box-sizing: border-box;
}
/* =========================
   Global link consistency
   ========================= */

/* Default: no underlines, consistent hover */
a { text-decoration: none; }
a:hover, a:focus { text-decoration: none; }

/* Global link colors (exclude buttons) */
a:not(.btn):not(.button):not([class*="btn"]) {
  color: #ffffff;
  transition: color .2s ease, opacity .2s ease;
}
a:not(.btn):not(.button):not([class*="btn"]):visited {
  color: #ffffff;
}
a:not(.btn):not(.button):not([class*="btn"]):hover,
a:not(.btn):not(.button):not([class*="btn"]):focus {
  color: #dcf836;
}

/* Keep header/nav links white like the theme, but same hover behavior */
.ht-header a,
.navbar-custom a,
header a.nav-link,
header .navbar a {
  color: #ffffff;
}
.ht-header a:hover,
.navbar-custom a:hover,
header a.nav-link:hover,
header .navbar a:hover,
.ht-header a:focus,
.navbar-custom a:focus,
header a.nav-link:focus,
header .navbar a:focus {
  color: #dcf836;
}

/* Footer links follow the same link rules (no underline + same hover) */
footer a {
  color: #ffffff;
}
footer a:visited {
  color: #ffffff;
}
footer a:hover,
footer a:focus {
  color: #dcf836;
}

/* =========================
   Header nav: keep desktop nav on ONE line (no stacked words)
   - Keep LOG OUT / ADMIN on the far right
   - Keep the main menu on one line; if it can't fit, allow horizontal scroll
   ========================= */

@media (min-width: 992px){
  /* The base theme has a typo ("jutify-content") so we re-assert flex layout. */
  header .navbar-default .flex-parent{
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    width: 100%;
  }

  /* Tighten spacing so everything fits better before scrolling kicks in. */
  header .navbar-default .flex-parent .menu-left{
    flex: 1 1 auto;
    min-width: 0;
    margin-left: 12px; /* override theme's 30px */
    flex-wrap: nowrap !important;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none; /* Firefox */
  }
  header .navbar-default .flex-parent .menu-left::-webkit-scrollbar{display:none;}
  header .navbar-default .flex-parent .menu-left > li{flex: 0 0 auto;}

  /* Right menu stays on one line at the far right. */
  header .navbar-default .flex-parent .menu-right{
    flex: 0 0 auto;
    margin-left: auto;
    flex-wrap: nowrap !important;
  }

  /* Never wrap link text on desktop (keeps "LOG OUT" on one line). */
  header .navbar-default .navbar-nav > li > a{
    white-space: nowrap;
    padding: 12px 10px; /* smaller than Bootstrap default */
    font-size: 13px;
    letter-spacing: .2px;
  }

  /* Make sure right-side actions don't get squeezed. */
  header .navbar-default .flex-parent .menu-right > li > a{
    padding-left: 12px;
    padding-right: 12px;
  }
}

/* Alerts (flash messages) - match dark theme */
.alert{
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
}
.alert-success{
  background: rgba(25,135,84,.16) !important;
  color: rgba(255,255,255,.92) !important;
  border-color: rgba(25,135,84,.35) !important;
}
.alert-danger{
  background: rgba(220,53,69,.16) !important;
  color: rgba(255,255,255,.92) !important;
  border-color: rgba(220,53,69,.35) !important;
}

/* =========================
   Admin: sticky footer
   Keep the existing public header/search/footer, but push footer to bottom
   when the admin page content is short.
   ========================= */

body.is-admin {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

body.is-admin footer.ht-footer {
  margin-top: auto;
}

/* Admin page headings should remain readable on the theme's dark background. */
body.is-admin .admin-page{
  padding: 10px 0 40px;
}
body.is-admin .admin-page .top-title{
  color: rgba(255,255,255,.62);
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
  font-size: 12px;
}
body.is-admin .admin-page h2.mb-0{
  color: rgba(255,255,255,.96);
  font-weight: 800;
}

/* Admin dashboard cards use .bg-white; ensure headings/text are dark on that light surface
   (the theme sets headings/link text to white globally on some pages). */
body.is-admin .admin-page .bg-white,
body.is-admin .admin-page .bg-light{
  color: #0b1c30 !important;
}
body.is-admin .admin-page .bg-white h1,
body.is-admin .admin-page .bg-white h2,
body.is-admin .admin-page .bg-white h3,
body.is-admin .admin-page .bg-white h4,
body.is-admin .admin-page .bg-white h5,
body.is-admin .admin-page .bg-white h6,
body.is-admin .admin-page .bg-light h1,
body.is-admin .admin-page .bg-light h2,
body.is-admin .admin-page .bg-light h3,
body.is-admin .admin-page .bg-light h4,
body.is-admin .admin-page .bg-light h5,
body.is-admin .admin-page .bg-light h6{
  color: inherit !important;
}

/* Admin forms live on light cards; ensure inputs/selects remain readable.
   (Theme has some global rules that make form text white/transparent.) */
body.is-admin .admin-page .bg-white .form-label,
body.is-admin .admin-page .bg-light .form-label{
  color: #0b1c30 !important;
  font-weight: 700;
}

body.is-admin .admin-page .bg-white .form-control,
body.is-admin .admin-page .bg-white .form-select,
body.is-admin .admin-page .bg-light .form-control,
body.is-admin .admin-page .bg-light .form-select{
  background-color: #ffffff !important;
  color: #0b1c30 !important;
  border: 1px solid rgba(11, 28, 48, .28) !important;
}

body.is-admin .admin-page .bg-white .form-control::placeholder,
body.is-admin .admin-page .bg-light .form-control::placeholder{
  color: rgba(11, 28, 48, .48) !important;
}

body.is-admin .admin-page select option{
  color: #0b1c30;
}

body.is-admin .admin-page .form-text{
  color: rgba(11, 28, 48, .78) !important;
}

/* Admin: transaction logs table – prevent email/TXID overlap without ugly wrapping.
   Use fixed layout + ellipsis on the long-token columns only. */
body.is-admin .admin-page .tx-log-table{
  table-layout: fixed;
  width: 100%;
  min-width: 1120px; /* allows consistent columns; .table-responsive handles overflow */
}

body.is-admin .admin-page .tx-log-table th,
body.is-admin .admin-page .tx-log-table td{
  vertical-align: middle;
}

/* Email/Handle + TXID columns */
body.is-admin .admin-page .tx-log-table th:nth-child(5),
body.is-admin .admin-page .tx-log-table td:nth-child(5),
body.is-admin .admin-page .tx-log-table th:nth-child(6),
body.is-admin .admin-page .tx-log-table td:nth-child(6){
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.is-admin .admin-page .tx-log-table td:nth-child(6) code{
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* =========================
   Movies & TV page fixes
   ========================= */

/* The theme uses older Bootstrap utilities; emulate the needed layout here. */
.movies-page{ color: rgba(255,255,255,.92); }
.movies-page .top-title{
  color: rgba(255,255,255,.72);
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-size: 12px;
}
.movies-page h1{ color: rgba(255,255,255,.96); }

.movies-page .movies-head{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.movies-page .movie-search-form{
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: nowrap;
}

/* Keep the search input from stretching across the entire page */
.movies-page .movie-search-form .form-control{
  width: 520px;
  max-width: 78vw;
}

/* =========================
   User Portal (portal.php)
   ========================= */

.portal-page{
  /* Add breathing room inside the theme's .page-single wrapper */
  padding: 10px 0 40px;
  color: rgba(255,255,255,.90);
}

.portal-head{
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 18px;
}

.portal-head .top-title{
  color: rgba(255,255,255,.62);
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
  font-size: 12px;
}

.portal-title{
  margin: 6px 0 0;
  font-size: 34px;
  font-weight: 800;
  color: rgba(255,255,255,.96);
}

.portal-head-actions{
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.portal-head-actions .btn{
  border-radius: 12px;
  padding: 10px 14px;
  font-weight: 800;
  text-transform: none;
}

.portal-grid{ margin-top: 6px; }

.portal-card{
  border-radius: 18px;
  background: rgba(0,0,0,.42);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 22px 70px rgba(0,0,0,.35);
  padding: 18px;
}

.portal-card--spaced{ margin-bottom: 16px; }

.portal-card-title{
  margin: 0 0 14px;
  font-size: 18px;
  font-weight: 800;
  color: rgba(255,255,255,.96);
}

.portal-kv{ margin-bottom: 12px; }
.portal-kv:last-child{ margin-bottom: 0; }
.portal-kv .k{
  font-size: 12px;
  letter-spacing: .02em;
  color: rgba(255,255,255,.60);
  font-weight: 700;
  margin-bottom: 3px;
}
.portal-kv .v{ color: rgba(255,255,255,.92); }
.portal-kv code{
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.92);
  padding: 2px 6px;
  border-radius: 8px;
}

.portal-muted{
  color: rgba(255,255,255,.72);
  font-size: 13px;
  line-height: 1.6;
  margin-bottom: 12px;
}

.portal-label{
  display: block;
  font-size: 12px;
  color: rgba(255,255,255,.70);
  font-weight: 800;
  margin: 10px 0 6px;
}

/* Form controls inside portal */
.portal-page .form-control{
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  color: rgba(255,255,255,.92);
  border-radius: 12px;
  height: 44px;
  box-shadow: none;
}
.portal-page .form-control:focus{
  border-color: rgba(220,248,54,.55);
  box-shadow: 0 0 0 3px rgba(220,248,54,.12);
}

/* Fix: ensure <select> dropdown items are readable on dark portal pages.
   Some browsers render the option list with a light background while inheriting
   the white text color from .form-control, making items appear invisible. */
.portal-page select.form-control option,
.portal-page select.form-control optgroup{
  color: #111;
  background: #fff;
}
.portal-page .form-control::placeholder{ color: rgba(255,255,255,.55); }

/* Responsive YouTube embed without Bootstrap 5's .ratio */
.portal-video{
  position: relative;
  padding-top: 56.25%;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
}
.portal-video iframe{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.portal-table-wrap{ margin-top: 18px; }
.portal-subtitle{
  margin: 0 0 10px;
  font-size: 14px;
  font-weight: 800;
  color: rgba(255,255,255,.92);
}

/* Table readability on dark glass */
.portal-page .table{
  background: transparent;
  color: rgba(255,255,255,.85);
}
.portal-page .table > thead > tr > th{
  color: rgba(255,255,255,.70);
  border-bottom: 1px solid rgba(255,255,255,.12);
}
.portal-page .table > tbody > tr > td{
  border-top: 1px solid rgba(255,255,255,.08);
}

/* Flash alerts: keep them compact */
.alert{ border-radius: 14px; padding: 12px 14px; }

@media (max-width: 767px){
  .portal-title{ font-size: 26px; }
  .portal-card{ padding: 14px; }
}

@media (max-width: 767px){
  .movies-page .movie-search-form{ width: 100%; }
  .movies-page .movie-search-form .form-control{
    width: auto;
    flex: 1 1 auto;
    min-width: 0;
  }
}

/* Mode tabs: white text, yellow hover, readable active state */
.movies-page .movie-mode-tabs{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.movies-page .movie-mode-tabs .btn.btn-outline-dark{
  color: #ffffff;
  background: transparent;
  border-color: rgba(255,255,255,.45);
}

.movies-page .movie-mode-tabs .btn.btn-outline-dark:hover,
.movies-page .movie-mode-tabs .btn.btn-outline-dark:focus{
  color: #dcf836;
  background: transparent;
  border-color: #dcf836;
}

.movies-page .movie-mode-tabs .btn.btn-outline-dark.active,
.movies-page .movie-mode-tabs .btn.btn-outline-dark:active{
  color: #111111;
  background: #dcf836;
  border-color: #dcf836;
}

/* ---- Movies page hardening (some themes zero-out .btn styling) ---- */
.movies-page .movie-mode-tabs .btn{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 10px 14px !important;
  border-width: 1px !important;
  border-style: solid !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  line-height: 1.1 !important;
}

.movies-page .movie-mode-tabs .btn .border-style{
  display: block !important;
  line-height: 1 !important;
}

.movies-page .movie-search-form{
  margin-left: auto;
}

.movies-page .movie-search-form .movie-search-btn{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 10px 18px !important;
  border-radius: 12px !important;
}

/* ---- Movies cards/grid (matches the glassy rounded sample) ---- */
.movies-page .reco-grid{
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)) !important;
  gap: 26px !important;
  align-items: stretch;
}

@media (max-width: 1199px){
  .movies-page .reco-grid{ grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)) !important; }
}
@media (max-width: 991px){
  .movies-page .reco-grid{ grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)) !important; gap: 22px !important; }
}
@media (max-width: 575px){
  .movies-page .reco-grid{ grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important; gap: 16px !important; }
}

.movies-page .media-card-wrap{ position: relative; }
.movies-page .media-card-wrap > .reco-grid-card{
  height: 100%;
  display: block;
}

.movies-page .reco-grid-card{
  text-decoration: none !important;
  color: rgba(255,255,255,.95) !important;
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 28px !important;
  overflow: hidden !important;
  box-shadow: 0 20px 70px rgba(0,0,0,.45) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform .14s ease, border-color .14s ease, box-shadow .14s ease;
}

.movies-page .reco-grid-card:hover{
  transform: translateY(-3px);
  border-color: rgba(220,248,54,.55) !important;
  box-shadow: 0 26px 90px rgba(0,0,0,.38) !important;
}

.movies-page .reco-grid-poster{
  width: 100% !important;
  aspect-ratio: 2 / 3;
  background: rgba(255,255,255,.08);
}

.movies-page .reco-grid-poster img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block;
}

.movies-page .reco-grid-body{
  padding: 16px 16px 18px !important;
  background: linear-gradient(180deg, rgba(8, 14, 34, .28), rgba(8, 14, 34, .62));
  border-top: 1px solid rgba(255,255,255,.10);
}

.movies-page .reco-grid-title{
  font-size: 18px !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 2.5em;
}

.movies-page .reco-grid-meta{
  margin-top: 10px !important;
  font-size: 14px !important;
  color: rgba(255,255,255,.78) !important;
}

.movies-page .reco-grid-meta i{
  margin-right: 8px;
  font-size: 15px;
  vertical-align: -1px;
}

.movies-page .reco-grid-poster-fallback{
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,.78);
  font-weight: 800;
  background: rgba(255,255,255,.08);
}


/* Remove the tiny white "shine" marks at the very top of each card */
.movies-page .reco-grid-card::before{
  content: none !important;
  display: none !important;
}
/* =========================
   Movies page FORCE FIX (overrides everything)
   ========================= */

/* Search + tabs layout (no bootstrap required) */
.movies-page .movies-head{ display:flex !important; flex-wrap:wrap !important; align-items:center !important; justify-content:space-between !important; gap:14px !important; }
.movies-page .movie-search-form{ display:flex !important; align-items:center !important; gap:10px !important; flex-wrap:nowrap !important; width:auto !important; }
.movies-page .movie-search-form input[type="search"],
.movies-page .movie-search-form .form-control{
  width:520px !important;
  max-width:78vw !important;
  min-width:260px !important;
}
@media (max-width: 767px){
  .movies-page .movie-search-form{ width:100% !important; }
  .movies-page .movie-search-form input[type="search"],
  .movies-page .movie-search-form .form-control{
    width:auto !important;
    max-width:100% !important;
    min-width:0 !important;
    flex:1 1 auto !important;
  }
}

/* Buttons/tabs: force pill look even if theme zeroed .btn */
.movies-page .movie-mode-tabs{ display:flex !important; flex-wrap:wrap !important; gap:10px !important; }
.movies-page .movie-mode-tabs a.btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:10px 14px !important;
  border:1px solid rgba(255,255,255,.45) !important;
  border-radius:999px !important;
  background:transparent !important;
  color:#fff !important;
  font-weight:800 !important;
  text-decoration:none !important;
  line-height:1.1 !important;
}
.movies-page .movie-mode-tabs a.btn:hover,
.movies-page .movie-mode-tabs a.btn:focus{
  color:#dcf836 !important;
  border-color:#dcf836 !important;
  background:transparent !important;
}
.movies-page .movie-mode-tabs a.btn.active{
  color:#111 !important;
  background:#dcf836 !important;
  border-color:#dcf836 !important;
}

/* Search button */
.movies-page .movie-search-form .movie-search-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:10px 18px !important;
  border-radius:12px !important;
  border:1px solid rgba(255,255,255,.45) !important;
  background:rgba(255,255,255,.08) !important;
  color:#fff !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}
.movies-page .movie-search-form .movie-search-btn:hover,
.movies-page .movie-search-form .movie-search-btn:focus{
  border-color:#dcf836 !important;
  color:#dcf836 !important;
  background:rgba(255,255,255,.10) !important;
}

/* =========================
   Admin Users: universal theme look, fix table overlap (no white card)
   ========================= */

.admin-users-page .admin-search-wrap{
  display:inline-flex !important;
  flex-direction:column !important;
  align-items:flex-start !important; /* Back aligns under the left edge of the search */
}

.admin-users-page .admin-back-link{
  display:inline-block !important;
  margin-top:8px !important;
  font-weight:700 !important;
  color:rgba(255,255,255,.65) !important;
  text-decoration:none !important;
}
.admin-users-page .admin-back-link:hover,
.admin-users-page .admin-back-link:focus{
  color:#dcf836 !important;
}

/* Use our own scroll wrapper (Bootstrap3 .table-responsive forces nowrap) */
.admin-users-page .admin-users-table-wrap{
  width:100% !important;
  overflow-x:auto !important;
  -webkit-overflow-scrolling:touch;
}

/* Keep layout stable and prevent bleed into next column */
.admin-users-page .admin-users-table{
  width:100% !important;
  table-layout:fixed !important;
}

/* Column widths (stable like your screenshot) */
.admin-users-page .admin-users-table th:nth-child(1),
.admin-users-page .admin-users-table td:nth-child(1){ width:70px !important; }
.admin-users-page .admin-users-table th:nth-child(2),
.admin-users-page .admin-users-table td:nth-child(2){ width:210px !important; }
.admin-users-page .admin-users-table th:nth-child(3),
.admin-users-page .admin-users-table td:nth-child(3){ width:320px !important; }
.admin-users-page .admin-users-table th:nth-child(4),
.admin-users-page .admin-users-table td:nth-child(4){ width:110px !important; }
.admin-users-page .admin-users-table th:nth-child(5),
.admin-users-page .admin-users-table td:nth-child(5){ width:120px !important; }
.admin-users-page .admin-users-table th:nth-child(6),
.admin-users-page .admin-users-table td:nth-child(6){ width:120px !important; }
.admin-users-page .admin-users-table th:nth-child(7),
.admin-users-page .admin-users-table td:nth-child(7){ width:90px !important; }
.admin-users-page .admin-users-table th:nth-child(8),
.admin-users-page .admin-users-table td:nth-child(8){ width:140px !important; }
.admin-users-page .admin-users-table th:nth-child(9),
.admin-users-page .admin-users-table td:nth-child(9){ width:120px !important; }

/* Prevent ANY cell from visually spilling into the next one */
.admin-users-page .admin-users-table th,
.admin-users-page .admin-users-table td{
  overflow:hidden !important;
}

/* Wrap the two problematic columns */
.admin-users-page .admin-users-table td.col-name{
  white-space:normal !important;
  word-break:break-word !important;
  overflow-wrap:anywhere !important;
}
.admin-users-page .admin-users-table td.col-email{
  white-space:normal !important;
  word-break:break-all !important;
  overflow-wrap:anywhere !important;
}

/* Edit link: keep it subtle like the theme */
.admin-users-page .admin-edit-link{
  color:rgba(255,255,255,.65) !important;
  text-decoration:none !important;
  font-weight:700 !important;
}
.admin-users-page .admin-edit-link:hover,
.admin-users-page .admin-edit-link:focus{
  color:#dcf836 !important;
}


/* Grid/cards: hard force */
.movies-page .reco-grid{
  display:grid !important;
  grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)) !important;
  gap:26px !important;
  align-items:stretch !important;
}
@media (max-width: 1199px){ .movies-page .reco-grid{ grid-template-columns:repeat(auto-fill, minmax(210px, 1fr)) !important; } }
@media (max-width: 991px){ .movies-page .reco-grid{ grid-template-columns:repeat(auto-fill, minmax(190px, 1fr)) !important; gap:22px !important; } }
@media (max-width: 575px){ .movies-page .reco-grid{ grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)) !important; gap:16px !important; } }

.movies-page .reco-grid-card{
  display:block !important;
  text-decoration:none !important;
  color:rgba(255,255,255,.95) !important;
  background:rgba(255,255,255,.06) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-radius:28px !important;
  overflow:hidden !important;
  box-shadow:0 20px 70px rgba(0,0,0,.45) !important;
  transition:transform .14s ease, border-color .14s ease, box-shadow .14s ease !important;
}
.movies-page .reco-grid-card:hover{
  transform:translateY(-3px) !important;
  border-color:rgba(220,248,54,.55) !important;
  box-shadow:0 26px 90px rgba(0,0,0,.38) !important;
}
.movies-page .reco-grid-poster{ width:100% !important; background:rgba(255,255,255,.08) !important; }
.movies-page .reco-grid-poster img{ width:100% !important; height:100% !important; display:block !important; object-fit:cover !important; }

/* kill ANY random top marks/pseudos */
.movies-page .reco-grid-card::before,
.movies-page .reco-grid-card::after,
.movies-page .media-card-wrap::before,
.movies-page .media-card-wrap::after,
.movies-page .reco-grid::before,
.movies-page .reco-grid::after{
  content:none !important;
  display:none !important;
}



/* ===== Watchlist button on movie cards (force visible) ===== */
.media-card-wrap{ position: relative !important; }
.btn-watchlist{
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 999px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 5 !important;
  background: rgba(0,0,0,.38) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: 0 14px 40px rgba(0,0,0,.45) !important;
  color: #fff !important;
  text-decoration: none !important;
}
.btn-watchlist i{ font-size: 18px !important; line-height: 1 !important; }

.btn-watchlist .ri-heart-fill{ display: none !important; }
.btn-watchlist.wl-active{ background: rgba(255,215,0,.22) !important; border-color: rgba(255,215,0,.55) !important; }
.btn-watchlist.wl-active .ri-heart-line{ display: none !important; }
.btn-watchlist.wl-active .ri-heart-fill{ display: inline-block !important; color: #ffd400 !important; }

.btn-watchlist:hover{ transform: translateY(-1px) !important; }
.btn-watchlist:active{ transform: translateY(0) !important; }

/* Watchlist button on item/detail page (movie.php / tv item) */
.btn-watchlist-detail{
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  background: rgba(0,0,0,.35) !important;
  color: rgba(255,255,255,.95) !important;
  padding: 10px 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 14px 40px rgba(0,0,0,.35) !important;
  text-decoration: none !important;
  font-weight: 700 !important;
  letter-spacing: .01em !important;
  cursor: pointer !important;
}
.btn-watchlist-detail i{ font-size: 18px !important; line-height: 1 !important; }
.btn-watchlist-detail i.ri-heart-line{ margin-right: 8px !important; }
.btn-watchlist-detail i.ri-heart-fill{ display: none !important; margin-right: 8px !important; }
.btn-watchlist-detail:hover{ transform: translateY(-1px) !important; }
.btn-watchlist-detail:active{ transform: translateY(0) !important; }
.btn-watchlist-detail.wl-active{
  background: rgba(255,215,0,.22) !important;
  border-color: rgba(255,215,0,.55) !important;
  color: #ffd400 !important;
}
.btn-watchlist-detail.wl-active i.ri-heart-line{ display: none !important; }
.btn-watchlist-detail.wl-active i.ri-heart-fill{ display: inline-block !important; }


/* =========================================================
   Bootstrap 5 utility compatibility layer
   (site theme is Bootstrap 3; many pages use BS5 classes)
   ========================================================= */

/* Display */
.d-block{ display:block !important; }
.d-inline{ display:inline !important; }
.d-inline-block{ display:inline-block !important; }
.d-none{ display:none !important; }
.d-flex{ display:flex !important; }

/* Flex helpers */
.flex-wrap{ flex-wrap:wrap !important; }
.flex-nowrap{ flex-wrap:nowrap !important; }
.align-items-start{ align-items:flex-start !important; }
.align-items-center{ align-items:center !important; }
.align-items-end{ align-items:flex-end !important; }
.justify-content-start{ justify-content:flex-start !important; }
.justify-content-center{ justify-content:center !important; }
.justify-content-end{ justify-content:flex-end !important; }
.justify-content-between{ justify-content:space-between !important; }
.justify-content-around{ justify-content:space-around !important; }
.justify-content-evenly{ justify-content:space-evenly !important; }

/* Gap (works for flex + grid in modern browsers) */
.gap-0{ gap:0 !important; }
.gap-1{ gap:.25rem !important; }
.gap-2{ gap:.5rem !important; }
.gap-3{ gap:1rem !important; }
.gap-4{ gap:1.5rem !important; }
.gap-5{ gap:3rem !important; }

/* Width / height */
.w-100{ width:100% !important; }
.h-100{ height:100% !important; }

/* Position */
.position-relative{ position:relative !important; }
.position-absolute{ position:absolute !important; }
.top-0{ top:0 !important; }
.bottom-0{ bottom:0 !important; }
.start-0{ left:0 !important; }
.end-0{ right:0 !important; }

/* Overflow */
.overflow-hidden{ overflow:hidden !important; }

/* Text */
.text-muted{ color: rgba(255,255,255,.65) !important; }
.text-decoration-none{ text-decoration:none !important; }
.text-uppercase{ text-transform:uppercase !important; letter-spacing:.06em; }
.text-center{ text-align:center !important; }
.text-white{ color:#fff !important; }
.text-white-50{ color: rgba(255,255,255,.50) !important; }

/* Font weight */
.fw-semibold{ font-weight:600 !important; }
.fw-bold{ font-weight:700 !important; }

/* Background helpers */
.bg-transparent{ background:transparent !important; }
.bg-white{ background: rgba(255,255,255,.96) !important; color: #0b1c30 !important; }
.bg-light{ background: rgba(255,255,255,.90) !important; color: #0b1c30 !important; }
.bg-dark{ background: rgba(0,0,0,.38) !important; }
.bg-black{ background:#000 !important; }

/* Borders */
.border{ border:1px solid rgba(255,255,255,.16) !important; }
.border-0{ border:0 !important; }

/* Rounded corners */
.rounded-0{ border-radius:0 !important; }
.rounded-1{ border-radius:.25rem !important; }
.rounded-2{ border-radius:.375rem !important; }
.rounded-3{ border-radius:.5rem !important; }
.rounded-4{ border-radius:1rem !important; }
.rounded-5{ border-radius:1.5rem !important; }

/* Shadows */
.shadow-sm{ box-shadow: 0 10px 30px rgba(0,0,0,.25) !important; }
.shadow{ box-shadow: 0 18px 55px rgba(0,0,0,.35) !important; }

/* Spacing scale (Bootstrap 5-like) */
.p-0{ padding:0 !important; }
.p-1{ padding:.25rem !important; }
.p-2{ padding:.5rem !important; }
.p-3{ padding:1rem !important; }
.p-4{ padding:1.5rem !important; }
.p-5{ padding:3rem !important; }

.pt-0{ padding-top:0 !important; }
.pt-1{ padding-top:.25rem !important; }
.pt-2{ padding-top:.5rem !important; }
.pt-3{ padding-top:1rem !important; }
.pt-4{ padding-top:1.5rem !important; }
.pt-5{ padding-top:3rem !important; }

.pb-0{ padding-bottom:0 !important; }
.pb-1{ padding-bottom:.25rem !important; }
.pb-2{ padding-bottom:.5rem !important; }
.pb-3{ padding-bottom:1rem !important; }
.pb-4{ padding-bottom:1.5rem !important; }
.pb-5{ padding-bottom:3rem !important; }

.px-0{ padding-left:0 !important; padding-right:0 !important; }
.px-1{ padding-left:.25rem !important; padding-right:.25rem !important; }
.px-2{ padding-left:.5rem !important; padding-right:.5rem !important; }
.px-3{ padding-left:1rem !important; padding-right:1rem !important; }
.px-4{ padding-left:1.5rem !important; padding-right:1.5rem !important; }
.px-5{ padding-left:3rem !important; padding-right:3rem !important; }

.py-0{ padding-top:0 !important; padding-bottom:0 !important; }
.py-1{ padding-top:.25rem !important; padding-bottom:.25rem !important; }
.py-2{ padding-top:.5rem !important; padding-bottom:.5rem !important; }
.py-3{ padding-top:1rem !important; padding-bottom:1rem !important; }
.py-4{ padding-top:1.5rem !important; padding-bottom:1.5rem !important; }
.py-5{ padding-top:3rem !important; padding-bottom:3rem !important; }

.m-0{ margin:0 !important; }
.m-1{ margin:.25rem !important; }
.m-2{ margin:.5rem !important; }
.m-3{ margin:1rem !important; }
.m-4{ margin:1.5rem !important; }
.m-5{ margin:3rem !important; }

.mt-0{ margin-top:0 !important; }
.mt-1{ margin-top:.25rem !important; }
.mt-2{ margin-top:.5rem !important; }
.mt-3{ margin-top:1rem !important; }
.mt-4{ margin-top:1.5rem !important; }
.mt-5{ margin-top:3rem !important; }

.mb-0{ margin-bottom:0 !important; }
.mb-1{ margin-bottom:.25rem !important; }
.mb-2{ margin-bottom:.5rem !important; }
.mb-3{ margin-bottom:1rem !important; }
.mb-4{ margin-bottom:1.5rem !important; }
.mb-5{ margin-bottom:3rem !important; }

.mx-auto{ margin-left:auto !important; margin-right:auto !important; }

/* Responsive padding (lg = 992px+) */
@media (min-width: 992px){
  .p-lg-4{ padding:1.5rem !important; }
  .p-lg-5{ padding:3rem !important; }
}

/* Row gutters (g-*) for BS3 grid */
.row.g-0{ margin-left:0 !important; margin-right:0 !important; }
.row.g-0 > [class*='col-']{ padding-left:0 !important; padding-right:0 !important; }
.row.g-2{ margin-left:-8px !important; margin-right:-8px !important; }
.row.g-2 > [class*='col-']{ padding-left:8px !important; padding-right:8px !important; }
.row.g-3{ margin-left:-16px !important; margin-right:-16px !important; }
.row.g-3 > [class*='col-']{ padding-left:16px !important; padding-right:16px !important; }

/* BS5-like columns used in a few templates */
.col-12{ float:left; width:100%; }

/* Cards (for pages using BS5 card markup) */
.card{
  background: rgba(0,0,0,.42);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  box-shadow: 0 22px 70px rgba(0,0,0,.35);
}
.card-header{
  padding: 12px 16px;
  border-bottom: 1px solid rgba(255,255,255,.10);
  background: transparent;
}
.card-body{ padding: 16px; }

/* Badge (Bootstrap 5 style) */
.badge{
  display:inline-block;
  padding:.35em .6em;
  font-size:12px;
  font-weight:800;
  line-height:1;
  border-radius:999px;
  vertical-align:middle;
}

/* When using light panels, restore readable muted text */
.bg-white .text-muted,
.bg-light .text-muted{ color: rgba(11,28,48,.60) !important; }

/* Misc */
.small{ font-size: 85% !important; }
.align-middle td,
.align-middle th{ vertical-align: middle !important; }

/* Form select (BS5) */
.form-select{
  display:block;
  width:100%;
  height:44px;
  padding: 10px 12px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  color: rgba(255,255,255,.92);
  border-radius: 12px;
  box-shadow:none;
}
.form-select:focus{
  border-color: rgba(220,248,54,.55);
  box-shadow: 0 0 0 3px rgba(220,248,54,.12);
  outline: 0;
}

/* Make native dropdown option list readable (some browsers inherit white text) */
.player-controls .form-select option,
.player-controls .form-select optgroup{
  color: #0b1c30 !important;
  background: #ffffff !important;
}

/* Detail page: playback controls polish */
.media-detail .player-controls{
  padding: 14px 16px !important;
  margin-top: 14px !important;
}
@media (min-width: 768px){
  .media-detail .player-controls{ padding: 16px 18px !important; }
}
.media-detail .player-controls .player-select{
  min-height: 46px;
  border-radius: 14px;
}
/* The theme doesn't ship full Bootstrap button styles; define a proper Play button */
.media-detail .player-play-btn{
  border: 0 !important;
  background: linear-gradient(135deg, #e50914, #b20710) !important;
  color: #ffffff !important;
  box-shadow: 0 14px 40px rgba(229, 9, 20, .22);
  transition: transform .12s ease, filter .12s ease, box-shadow .12s ease;
}
.media-detail .player-play-btn .border-style{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.media-detail .player-play-btn i{ font-size: 18px; line-height: 1; }
.media-detail .player-play-btn:hover{
  transform: translateY(-1px);
  filter: brightness(1.02);
  box-shadow: 0 18px 52px rgba(229, 9, 20, .26);
}
.media-detail .player-play-btn:focus{
  outline: none;
  box-shadow: 0 0 0 .25rem rgba(255,255,255,.12), 0 18px 52px rgba(229, 9, 20, .26);
}
.media-detail .player-play-btn:disabled{
  background: rgba(255,255,255,.14) !important;
  color: rgba(255,255,255,.75) !important;
  box-shadow: none;
  transform: none;
}

/* Ratio embeds (BS5) */
.ratio{ position: relative; width:100%; }
.ratio::before{ content:""; display:block; }
.ratio-16x9::before{ padding-top:56.25%; }
.ratio > iframe,
.ratio > embed,
.ratio > video,
.ratio > object,
.ratio > div{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}

/* Pagination flex alignment */
.pagination.justify-content-center{
  display:flex;
  justify-content:center;
}



/* Home: payment badges ("WE ACCEPT") */
.we-accept-section{
  /* Keep it in the dark area under the cards (no white band) */
  background-color: #020d18;
  /* Tight, professional spacing */
  padding: 6px 0 14px;
  text-align: center;
  /* No separator line above the title */
  border-top: none;
  /* The homepage tab blocks add a large bottom margin; pull this section up a bit */
  margin-top: -45px;
}
.we-accept-section .we-accept-title{
  text-transform: uppercase;
  letter-spacing: .5px;
  margin: 0 0 8px;
  color: #ffffff;
  font-size: 14px;
  text-align: center !important;
}
.we-accept-section .we-accept-img{
  display: block;
  max-width: 300px;
  width: 100%;
  height: auto;
  margin: 0 auto !important;
  background: transparent;
}


/* Subscribe: plan selection (professional, compact, scoped to subscribe markup) */
.portal-page .subscribe-plans{
  padding: 22px 22px 10px;
}
.portal-page .subscribe-plans .portal-card-title{
  margin-bottom: 10px;
}
.portal-page .subscribe-plans .portal-subtitle{
  margin: 18px 0 14px;
  font-size: 13px;
  letter-spacing: .6px;
  text-transform: uppercase;
  color: rgba(255,255,255,.82);
}
.portal-page .subscribe-plans .portal-subtitle::after{
  content:"";
  display:block;
  height:1px;
  margin-top: 10px;
  background: rgba(255,255,255,.10);
}

/* Plan cards: make them cleaner + less "billboard" */
.portal-page .plan-promo-card{
  height: 100%;
  border-radius: 16px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 18px 50px rgba(0,0,0,.32);
}
.portal-page .plan-promo-card::before{ opacity: .55; }
.portal-page .plan-promo-top{
  background: rgba(255,255,255,.06);
  font-size: 14px;
  padding: 12px 14px;
}
.portal-page .plan-promo-inner{
  padding: 16px 16px 18px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.portal-page .plan-duration{ font-size: 18px; margin-top: 2px; }
.portal-page .plan-price{
  font-size: 44px;
  line-height: 1;
  margin: 6px 0 4px;
}
.portal-page .plan-subtext{ font-size: 12px; margin-bottom: 8px; }
.portal-page .plan-meta{
  font-size: 12px;
  color: rgba(255,255,255,.75);
  margin-bottom: 12px;
}
.portal-page .plan-cta{
  margin-top: auto;
  display: inline-block;
  padding: 11px 16px;
  border-radius: 12px;
  background: var(--iptv-red);
  color: #ffffff;
  font-weight: 800;
  letter-spacing: .4px;
  text-transform: uppercase;
  font-size: 12px;
}
.portal-page .plan-cta:hover{ color:#ffffff; filter: brightness(1.05); }
.portal-page .plan-cta:focus{
  color:#ffffff;
  outline: none;
  box-shadow: 0 0 0 3px rgba(220,248,54,.12);
}

@media (max-width: 991px){
  .portal-page .subscribe-plans{ padding: 18px 16px 6px; }
  .portal-page .plan-price{ font-size: 38px; }
}

@media (max-width: 767px){
  .portal-page .plan-price{ font-size: 34px; }
}

/* -------------------------------------------------------------------------- */
/* Global link behavior: WHITE by default, YELLOW on hover/focus/active        */
/* (Excludes button-like links so we don't break CTAs)                         */
/* -------------------------------------------------------------------------- */

:root{
  --iptv-link-color: #ffffff;
  --iptv-link-hover: #dcf836;
}

/* default + visited */
a:not(.btn):not(.button):not([class*="btn"]):not(.plan-cta):not(.redbtn):not(.theme-btn):not(.navbar-brand),
a:not(.btn):not(.button):not([class*="btn"]):not(.plan-cta):not(.redbtn):not(.theme-btn):not(.navbar-brand):visited{
  color: var(--iptv-link-color) !important;
  text-decoration: none;
  transition: color .15s ease;
}

/* hover/focus/active */
a:not(.btn):not(.button):not([class*="btn"]):not(.plan-cta):not(.redbtn):not(.theme-btn):not(.navbar-brand):hover,
a:not(.btn):not(.button):not([class*="btn"]):not(.plan-cta):not(.redbtn):not(.theme-btn):not(.navbar-brand):focus,
a:not(.btn):not(.button):not([class*="btn"]):not(.plan-cta):not(.redbtn):not(.theme-btn):not(.navbar-brand):focus-visible,
a:not(.btn):not(.button):not([class*="btn"]):not(.plan-cta):not(.redbtn):not(.theme-btn):not(.navbar-brand):active{
  color: var(--iptv-link-hover) !important;
  outline: none;
}

/* If a link wraps an icon, keep the icon in sync */
a:not(.btn):not(.button):not([class*="btn"]):not(.plan-cta):not(.redbtn):not(.theme-btn):not(.navbar-brand):hover i,
a:not(.btn):not(.button):not([class*="btn"]):not(.plan-cta):not(.redbtn):not(.theme-btn):not(.navbar-brand):hover svg,
a:not(.btn):not(.button):not([class*="btn"]):not(.plan-cta):not(.redbtn):not(.theme-btn):not(.navbar-brand):focus i,
a:not(.btn):not(.button):not([class*="btn"]):not(.plan-cta):not(.redbtn):not(.theme-btn):not(.navbar-brand):focus svg{
  color: var(--iptv-link-hover) !important;
  fill: currentColor;
}

/* =========================
   Movies grid: cleaner poster cards (Netflix-style overlay)
   Scoped to .movies-page so it won't impact other grids.
   ========================= */

.movies-page .reco-grid-card{
  position: relative;
}

/* Badge (uses data-type="TV" / "Movie" on the link) */
.movies-page .reco-grid-card[data-type]::before{
  content: attr(data-type);
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 2;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(0,0,0,.38);
  border: 1px solid rgba(255,255,255,.18);
  color: rgba(255,255,255,.92);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

/* Make the info area an overlay instead of a big block */
.movies-page .reco-grid-body{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  padding: 12px 12px 14px;
  background: linear-gradient(to top, rgba(0,0,0,.78) 0%, rgba(0,0,0,.30) 55%, rgba(0,0,0,0) 100%) !important;
  border-top: 0 !important;
}

.movies-page .reco-grid-title{
  font-size: 16px !important;
  font-weight: 900 !important;
  text-shadow: 0 10px 24px rgba(0,0,0,.38);
}

.movies-page .reco-grid-meta{
  font-size: 12px !important;
  color: rgba(255,255,255,.78) !important;
}

/* Slight hover lift and stronger border, keeps it crisp */
.movies-page .reco-grid-card:hover{
  transform: translateY(-3px);
  border-color: rgba(255,255,255,.18);
}

/* Ensure poster area stays clean behind the overlay */
.movies-page .reco-grid-poster{
  position: relative;
}
.movies-page .reco-grid-poster::after{
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(120% 80% at 50% 10%, rgba(255,255,255,.06) 0%, rgba(255,255,255,0) 55%);
  pointer-events: none;
}

/* =====================================================================
   GLOBAL LINKS (ACROSS ALL PAGES)
   Make EVERY <a> behave the same: white by default, yellow on hover/click.
   This is intentionally aggressive to override theme/plugin specificity.
   ===================================================================== */

body:not(.is-admin) a,
body:not(.is-admin) a:visited {
  color: #ffffff !important;
}

body:not(.is-admin) a:hover,
body:not(.is-admin) a:focus,
body:not(.is-admin) a:active {
  color: #dcf836 !important;
}

/* Ensure nested text/icon elements inside links follow the link color */

body:not(.is-admin) a:hover *,
body:not(.is-admin) a:focus *,
body:not(.is-admin) a:active * {
  color: inherit !important;
}

/* =========================================================
   Movies page – compact, poster-first catalog tuning
   (reduces card height + increases density, without affecting other pages)
   ========================================================= */

/* More posters per row on desktop */
.movies-page .reco-grid{
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)) !important;
  gap: 20px !important;
}
@media (min-width: 1400px){
  .movies-page .reco-grid{
    grid-template-columns: repeat(auto-fill, minmax(175px, 1fr)) !important;
    gap: 18px !important;
  }
}
@media (max-width: 575px){
  .movies-page .reco-grid{
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)) !important;
    gap: 14px !important;
  }
}

/* Make the text sit ON the poster (no extra block underneath) */
.movies-page .reco-grid-card{
  position: relative !important;
  border-radius: 22px !important;
}
.movies-page .reco-grid-body{
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  padding: 14px 14px 14px !important;
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.50) 35%, rgba(0,0,0,.82) 100%) !important;
  border-top: none !important;
}

.movies-page .reco-grid-title{
  font-size: 16px !important;
  font-weight: 900 !important;
  line-height: 1.15 !important;
  min-height: 0 !important;
  -webkit-line-clamp: 2;
  text-shadow: 0 2px 14px rgba(0,0,0,.38);
}

.movies-page .reco-grid-meta{
  margin-top: 8px !important;
  font-size: 13px !important;
  color: rgba(255,255,255,.85) !important;
  text-shadow: 0 2px 14px rgba(0,0,0,.38);
}

/* Give the poster a subtle fade at the bottom for readability */
.movies-page .reco-grid-poster{
  position: relative !important;
}
.movies-page .reco-grid-poster::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 42%;
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.38) 70%, rgba(0,0,0,.38) 100%);
  pointer-events: none;
}

/* Keep the watchlist heart crisp over the poster */
.movies-page .btn-watchlist{
  background: rgba(0,0,0,.60) !important;
  border-color: rgba(255,255,255,.16) !important;
}

/* =========================
   Global: remove poster/body overlays on catalog cards
   ========================= */
.reco-grid-poster::after{
  content: none !important;
  display: none !important;
  background: none !important;
}
.reco-grid-body{
  background: transparent !important;
  border-top: 0 !important;
}
/* keep typography readable without dark overlays */
.reco-grid-title,
.reco-grid-meta{
  text-shadow: 0 2px 10px rgba(0,0,0,.35);
}
/* =========================
   Item view page: Recommended grid (movie.php / tv)
   Make it clean, compact, and consistent (no poster overlays)
   Scoped to .media-detail so it won't affect other grids.
   ========================= */
.media-detail .reco-grid{
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)) !important;
  gap: 18px !important;
  align-items: start !important;
}

@media (max-width: 992px){
  .media-detail .reco-grid{ grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)) !important; gap: 14px !important; }
}
@media (max-width: 576px){
  .media-detail .reco-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; }
}

.media-detail .media-card-wrap{ margin: 0 !important; }

.media-detail .reco-grid-card{
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  text-decoration: none !important;
  border-radius: 22px !important;
  overflow: hidden !important;
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: 0 18px 60px rgba(0,0,0,.32) !important;
  transition: transform .14s ease, border-color .14s ease, box-shadow .14s ease;
}

.media-detail .reco-grid-card:hover{
  transform: translateY(-2px);
  border-color: rgba(220,248,54,.45) !important;
  box-shadow: 0 22px 78px rgba(0,0,0,.34) !important;
}

.media-detail .reco-grid-poster{
  width: 100% !important;
  aspect-ratio: 2 / 3;
  background: rgba(255,255,255,.06);
}

.media-detail .reco-grid-poster img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* Info lives BELOW the poster (no overlay on the image) */
.media-detail .reco-grid-body{
  position: static !important;
  padding: 12px 14px 14px !important;
  background: transparent !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
}

.media-detail .reco-grid-title{
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 1.15 !important;
  margin: 0 0 6px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

.media-detail .reco-grid-meta{
  font-size: 12px !important;
  color: rgba(255,255,255,.72) !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

/* Watchlist heart sits cleanly */
.media-detail .media-card-wrap .watchlist-icon{
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  z-index: 3 !important;
  width: 34px !important;
  height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  background: rgba(0,0,0,.32) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

/* =========================================================
   Anti-copy / anti-select (site-wide)
   Note: This is a deterrent only (can be bypassed).
   ========================================================= */
html, body{
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Admin pages must remain usable (selection/copy/paste, context menus, etc.) */
body.is-admin, body.is-admin *{
  -webkit-touch-callout: default !important;
  -webkit-user-select: text !important;
  -moz-user-select: text !important;
  -ms-user-select: text !important;
  user-select: text !important;
}

/* Allow selection in form fields */
input, textarea, select, option, [contenteditable="true"]{
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}

/* Prevent dragging images/links */
img, a{
  -webkit-user-drag: none;
  user-drag: none;
}

/* =========================
   Portal "Your Submissions" table: prevent cell overlap WITHOUT ugly wrapping.
   - Keep headers/badges on one line
   - Ellipsize long emails/transaction IDs
   - Give columns sensible fixed widths + allow horizontal scroll via .table-responsive
   ========================= */
.portal-table-wrap .table{
  table-layout: fixed;
  width: 100%;
  min-width: 980px; /* ensures columns don't collapse into multi-line soup */
}

.portal-table-wrap .table thead th{
  white-space: nowrap;
}

/* Default: keep cells single-line; prevent bleed into neighbor columns */
.portal-table-wrap .table tbody td{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}

/* Column sizing (matches your portal.php columns order) */
.portal-table-wrap .table th:nth-child(1),
.portal-table-wrap .table td:nth-child(1){ width: 180px; } /* Date */
.portal-table-wrap .table th:nth-child(2),
.portal-table-wrap .table td:nth-child(2){ width: 120px; } /* Method */
.portal-table-wrap .table th:nth-child(3),
.portal-table-wrap .table td:nth-child(3){ width: 260px; } /* Plan */
.portal-table-wrap .table th:nth-child(4),
.portal-table-wrap .table td:nth-child(4){ width: 240px; } /* Email/Handle */
.portal-table-wrap .table th:nth-child(5),
.portal-table-wrap .table td:nth-child(5){ width: 190px; } /* Transaction */
.portal-table-wrap .table th:nth-child(6),
.portal-table-wrap .table td:nth-child(6){ width: 120px; } /* Status */

/* Badges/pills: never wrap */
.portal-table-wrap .badge,
.portal-table-wrap .pill,
.portal-table-wrap .status,
.portal-table-wrap .btn{
  white-space: nowrap;
}

/* Transaction IDs are often rendered inside <code> which can be long */
.portal-table-wrap td code{
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
