/* =====================================================================
   PlayoVision — PlayoNetwork Design Palette
   Loaded after style.css + night-mode.css (last <link> in layout/header).
   All values are intentional; do not randomize.

   Palette tokens
   --------------
   --pv-bg          #0a0a0a   true black surface (page)
   --pv-surface     #141414   cards / .content panels
   --pv-surface-2   #1c1c1c   nested panels, sidebar drawers
   --pv-border      #2a2a2a   hairlines, dividers
   --pv-text        #ffffff   primary text
   --pv-text-dim    #dcdcdc   secondary text
   --pv-muted       #9f9f9f   meta, timestamps
   --pv-red         #dc2626   primary accent (PlayoNetwork red)
   --pv-red-hi      #ef4444   hover / pressed
   --pv-red-lo      #a01b1b   disabled
   --pv-cyan        #06b6d4   secondary "tech" accent (focus, pills, badges)
   ===================================================================== */

:root {
  --pv-bg: #0a0a0a;
  --pv-surface: #141414;
  --pv-surface-2: #1c1c1c;
  --pv-border: #2a2a2a;
  --pv-text: #ffffff;
  --pv-text-dim: #dcdcdc;
  --pv-muted: #9f9f9f;
  --pv-red: #dc2626;
  --pv-red-hi: #ef4444;
  --pv-red-lo: #a01b1b;
  --pv-cyan: #06b6d4;
}

/* ---- Body / page chrome ---- */
html, body { background: #0a0a0a !important; color: #fff; }
.content { background: #141414 !important; box-shadow: 0 1px 0 0 #2a2a2a, 0 0 0 1px #2a2a2a !important; color: #fff; }

/* Make sure anything still painted white-on-light flips to dark-on-dark */
.user-setting-panel,
.user-setting-panel input[type='text'],
.user-setting-panel input[type='password'],
.user-setting-panel select,
.user-setting-panel textarea,
.setting-panel input[type='text'],
.setting-panel input[type='password'],
.setting-panel select,
.setting-panel textarea,
.setting-panel.no-padding textarea,
.setting-panel.no-padding select,
.pt_featured_video .video-player .video-title,
.pt_featured_video .thumbnail_holder,
.home-page-categories .videos .video-list .video-list-image a,
.video-latest-list .video-thumb a,
.login-page,
nav.navbar-findcond .search-header .search-dropdown,
.yp_pub_elemnt .publisher-element,
.vid_srch_filtr .pt_forms {
  background-color: #141414 !important;
  color: #fff;
  box-shadow: none;
}

/* Generic "light grey" hairlines become dark hairlines */
hr, .divider, .next-video { border-color: #2a2a2a !important; }

/* ---- Header / Navbar ---- */
.navbar-fixed-top,
nav.navbar-findcond,
nav.navbar-findcond.navbar-default.second-header-layout {
  background: #050505 !important;
  border-bottom: 1px solid #2a2a2a !important;
}
nav.navbar-findcond .search-header input {
  background-color: #1c1c1c !important;
  color: #fff !important;
}
nav.navbar-findcond .search-header input:focus {
  border-color: #06b6d4 !important;
  box-shadow: 0 0 0 2px rgba(6, 182, 212, 0.25);
}
nav.navbar-findcond ul.navbar-nav li.active a:not(.category) {
  color: #dc2626 !important;
  background-color: transparent !important;
  border-color: #dc2626 !important;
  box-shadow: 0 0 12px rgba(220, 38, 38, 0.45);
}
nav.navbar-findcond button.navbar-toggle { background: #dc2626; }
nav.navbar-findcond span.badge { background: #dc2626; }
nav.navbar-findcond.search-bar input:focus { border-color: #dc2626; }

/* Sidebar drawer (mobile/left nav) */
.yp_side_drawer { background: #0a0a0a !important; }
.yp_side_drawer ul.sections li.active a { color: #dc2626 !important; }
.yp_side_drawer ul.sections li a:hover { color: #ef4444; }

/* ---- Buttons ---- */
.btn-main {
  background-color: #dc2626 !important;
  color: #fff !important;
  border: 0;
}
.btn-main:hover,
.btn-main:focus {
  background-color: #ef4444 !important;
  color: #fff !important;
  box-shadow: 0 0 18px rgba(220, 38, 38, 0.45);
}
.btn-main:disabled { background-color: #a01b1b !important; color: #fff !important; }

.btn-subscribe { background: #dc2626 !important; color: #fff !important; }
.btn-subscribe:hover { background: #ef4444 !important; }
.yp_pub_elemnt .btn-subscribe { background-color: #dc2626 !important; }

/* ---- Video cards / lists ---- */
.home-page-categories .videos .video-list .video-list-image a,
.video-latest-list .video-thumb a {
  background: #141414;
  border: 1px solid #2a2a2a;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.home-page-categories .videos .video-list .video-list-image a:hover,
.video-latest-list .video-thumb a:hover {
  border-color: rgba(220, 38, 38, 0.6);
  box-shadow: 0 0 0 1px rgba(220, 38, 38, 0.5),
              0 0 24px rgba(220, 38, 38, 0.25),
              0 0 36px rgba(6, 182, 212, 0.18);
}

.home-page-categories .videos .video-list .video-list-title h4,
.video-latest-list .video-title h4 { color: #fff !important; }
.home-page-categories .videos .video-list .video-list-by,
.home-page-categories .videos .video-list .video-list-by a,
.video-latest-list .video-wrapper .video-info,
.video-latest-list .video-wrapper .video-info a,
.video-latest-list .video-wrapper .video-info span { color: #9f9f9f !important; }

.videos-list .video-wrapper .video-title a:hover { color: #ef4444 !important; }
.video-likes .like-btn.active svg.thumbs_up { color: #dc2626 !important; }
.video-likes .like-btn.active svg.thumbs_down { color: #ef4444 !important; }

/* ---- Video player page (watch page) ---- */
.video-info-element .views-bar { background-color: #2a2a2a; }
.video-info-element .blue {
  background: linear-gradient(to right, #ef4444, #dc2626) !important;
}

/* ---- Forms / inputs ---- */
.pp_mat_input input:focus,
.pp_mat_input textarea:focus,
.pp_mat_input select:focus { border-color: #06b6d4 !important; }
.pt_forms .form-group input[type=text]:focus,
.pt_forms .form-group input[type=email]:focus,
.pt_forms .form-group input[type=password]:focus,
.pt_forms .form-group select:focus,
.pt_forms .form-group textarea:focus { border-color: #06b6d4 !important; }

/* ---- Settings sidebar ---- */
.settings-sidebar ul { background: #0a0a0a !important; }
.settings-sidebar ul li a { color: #fff !important; }
.settings-sidebar ul li.active a {
  color: #fff !important;
  background: rgba(220, 38, 38, 0.18) !important;
  box-shadow: inset 4px 0 0 #dc2626;
}

/* ---- Footer ---- */
footer .footer-container,
.pt_footer .container-fluid {
  background: #050505 !important;
  color: #dcdcdc !important;
  border-top: 1px solid #2a2a2a !important;
}
footer .footer-container a:hover,
.pt_footer .footer-container a:hover { color: #ef4444; }

/* ---- Modals / popovers ---- */
.modal-content,
.modal.matdialog .modal-header,
.modal.matdialog .modal-footer,
.swal2-modal { background: #141414 !important; color: #fff !important; }
.swal2-modal button.btn { background: #1c1c1c !important; color: #fff !important; }

/* ---- Universal focus ring (cyan tech accent) ---- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
.btn:focus-visible,
.btn-main:focus-visible {
  outline: 2px solid #06b6d4 !important;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(6, 182, 212, 0.20);
}

/* ---- Glass / gradient panels (PlayoNetwork signature treatment) ---- */
.pv-glass {
  background: linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.01));
  border: 1px solid rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-radius: 12px;
}
.pv-glass-card {
  background: linear-gradient(180deg, #181818 0%, #0e0e0e 100%);
  border: 1px solid #2a2a2a;
  border-radius: 12px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.45);
}
.pv-glass-card:hover {
  border-color: rgba(220, 38, 38, 0.55);
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.55),
              0 0 28px rgba(220, 38, 38, 0.22),
              0 0 56px rgba(6, 182, 212, 0.12);
  transition: all 0.25s ease;
}

/* ---- Pills / badges (cyan tech accent) ---- */
.pv-pill {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  background: rgba(6, 182, 212, 0.12);
  color: #06b6d4;
  border: 1px solid rgba(6, 182, 212, 0.35);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.pv-pill-red {
  background: rgba(220, 38, 38, 0.12);
  color: #ef4444;
  border-color: rgba(220, 38, 38, 0.45);
}

/* ---- Selection / brand markers ---- */
::selection { background: rgba(220, 38, 38, 0.45); color: #fff; }

/* ---- Pagination ---- */
.pagination li a {
  background: #141414 !important;
  border-color: #2a2a2a !important;
  color: #fff !important;
}
.pagination .active a {
  background: #dc2626 !important;
  border-color: #dc2626 !important;
  color: #fff !important;
}

/* ---- Toggles ---- */
.tgl:checked + .tgl-btn:after { background: #dc2626; }

/* ---- Snackbar / notifications ---- */
.snackbar-container { background-color: #0a0a0a !important; color: #fff; }
.snackbar-container .action { color: #ef4444 !important; }
span#new-notifications, span#new-messages { background: #dc2626; }
ul.notfi-dropdown .headtoppoint { border-bottom-color: #dc2626; }