/* =====================================================
   ModernTheme — NzbPlanet  (single stylesheet, no base CSS)
   ===================================================== */

/* ── 1. Font ─────────────────────────────────────── */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");

/* ── 2. Design Tokens ────────────────────────────── */
:root {
  --font: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* Light mode surfaces */
  --c-bg: #ffffff;
  --c-surface: #ffffff;
  --c-subnav: #f1f5f9;
  --c-border: #e2e8f0;
  --c-border-focus: #0070ff;

  /* Primary — matched to design spec */
  --c-primary: #0070ff;
  --c-primary-hov: #3391ff;
  --c-primary-act: #0056cc;
  --c-primary-dark: #003d99;
  --c-primary-muted: rgba(0, 112, 255, 0.1);

  /* Semantic */
  --c-success: #16c784;
  --c-success-dark: #0fa26a;
  --c-warning: #ffb020;
  --c-danger: #ff3b3b;

  /* Light text */
  --c-heading: #0f172a;
  --c-body: #334155;
  --c-secondary: #475569;
  --c-muted: #64748b;
  --c-disabled: #94a3b8;
  --c-link: #0070ff;
  --c-link-hov: #3391ff;

  --c-sidebar-bg: #ffffff;
  --c-sidebar-text: #334155;
  --c-sidebar-hov: #f1f5f9;

  --c-popular-card-bg: #dff5f5;

  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 16px;

  --sh-sm: 0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.05);
  --sh-md: 0 4px 16px rgba(0, 0, 0, 0.08), 0 2px 4px rgba(0, 0, 0, 0.04);
}

/* ── Dark mode — spec palette ────────────────────── */
[data-theme="dark"] {
  /* Backgrounds (spec: Background → Surface 1 → 2 → 3 → Hover) */
  --c-bg: #0b0f19;
  --c-surface: #111827;
  --c-surface-2: #161b26;
  --c-surface-3: #1f2937;
  --c-surface-hov: #252f3f;
  --c-border: #2d3748;
  --c-border-hov: #3d4656;
  --c-border-focus: #0070ff;

  /* Primary — same brand blue in dark mode */
  --c-primary: #0070ff;
  --c-primary-hov: #3391ff;
  --c-primary-act: #0056cc;
  --c-primary-dark: #003d99;
  --c-primary-muted: rgba(0, 112, 255, 0.15);

  /* Semantic */
  --c-success: #16c784;
  --c-success-dark: #0fa26a;
  --c-warning: #ffb020;
  --c-danger: #ff3b3b;

  /* Dark text */
  --c-heading: #f9fafb;
  --c-body: #d1d5db;
  --c-secondary: #9ca3af;
  --c-muted: #9ca3af;
  --c-disabled: #6b7280;
  --c-link: #3391ff;
  --c-link-hov: #0070ff;

  --c-subnav: #1e293b;
  --c-sidebar-bg: #111827;
  --c-sidebar-text: #d1d5db;
  --c-sidebar-hov: #1f2937;

  --c-popular-card-bg: #1e293b;

  --sh-sm: 0 1px 3px rgba(0, 0, 0, 0.4), 0 1px 2px rgba(0, 0, 0, 0.3);
  --sh-md: 0 4px 16px rgba(0, 0, 0, 0.5), 0 2px 4px rgba(0, 0, 0, 0.3);
}

/* ── 3. Reset ────────────────────────────────────── */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
}

body {
  font-family: var(--font);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  color: var(--c-body);
  background: var(--c-bg);
}

ul,
ol {
  list-style: none;
  margin: 0;
  padding: 0;
}
img {
  max-width: 100%;
  height: auto;
  border: 0;
}
a {
  color: var(--c-link);
  text-decoration: none;
}
a:hover {
  color: var(--c-link-hov);
}

input,
select,
textarea,
button {
  font-family: var(--font);
}
/* jQuery UI overrides font to Verdana and inflates font-size — kill both at the source */
.ui-widget {
  font-family: var(--font) !important;
  font-size: 14px !important;
}
.ui-widget *:not(.fa, .fa-solid) {
  font-family: var(--font) !important;
}

/* ── 4. Typography ───────────────────────────────── */
h1 {
  font-size: 28px;
  font-weight: 700;
  line-height: 36px;
  letter-spacing: -0.03em;
  color: var(--c-heading);
  margin: 0;
}
h2 {
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
  letter-spacing: -0.02em;
  color: var(--c-heading);
  margin: 0;
}
h3 {
  font-size: 18px;
  font-weight: 600;
  line-height: 28px;
  color: var(--c-heading);
  margin: 0;
}

th,
table.data th,
table.highlight th {
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--c-muted);
  border-bottom: 1px solid var(--c-border);
  padding: 10px 12px;
  background: var(--c-surface);
  white-space: nowrap;
}

td,
table.data td,
table.highlight td {
  font-size: 11px;
  font-weight: 400;
  line-height: 21px;
  color: var(--c-body);
  padding: 3px 4px;
  border-bottom: 1px solid var(--c-border);
  vertical-align: middle;
}

table.data,
table.highlight {
  font-variant-numeric: tabular-nums;
  border-collapse: collapse;
  width: 100%;
  background: var(--c-surface);
  border-radius: var(--r-md);
  overflow: hidden;
  box-shadow: var(--sh-sm);
}

.hint,
.m_detail,
small {
  font-size: 13px;
  font-weight: 500;
  color: var(--c-muted);
}

/* ── 5. Page Layout ──────────────────────────────── */

/* Full-width header bar — background stretches edge-to-edge */
#statusbar {
  width: 100%;
  background: var(--c-surface);
  border-bottom: 1px solid var(--c-border);
  box-shadow: var(--sh-sm);
}

/* Inner row constrained to same width as #page so logo aligns with sidebar */
.statusbar-nzb-div {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 24px;
}

/* Centered page container */
#page {
  width: 100%;
  max-width: 1320px;
  margin: 0 auto;
  padding: 15px 24px 0;
}

/* CSS Grid: explicit placement so sidebar is always left and content right,
   regardless of DOM order. Extra children (badges div) auto-flow to row 2. */
.contentborder2 {
  border: none;
  background: transparent;
  padding-bottom: 0;
  display: grid;
  grid-template-columns: 210px 1fr;
  grid-template-rows: auto;
  /*gap: 10px;*/
}

#sidebar {
  grid-column: 1;
  grid-row: 1;
  width: 200px;
  padding: 8px 8px 0;
  box-sizing: border-box;
}

#content {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
}

/* Badges/links div and any other children span full width below the columns */
.contentborder2 > div:not(#content):not(#sidebar) {
  grid-column: 1 / -1;
}
.contentborder2.sidebar-hidden {
  grid-template-columns: 1fr;
}
.contentborder2.sidebar-hidden #content {
  grid-column: 1;
}

.mt-0 {
  margin-top: 0 !important;
}

.mb-0 {
  margin-bottom: 0 !important;
}

/* Legacy structural elements hidden by ModernTheme */
#logo {
  display: none;
}
body > hr {
  display: none;
}

/* ═══════════════════════════════════════════════════
   Subnav Zone — two bars that read as one tinted band
   Row 1: #list-nav (Home / Browse / Forum…)
   Row 2: #header   (category tabs + search)
   ═══════════════════════════════════════════════════ */

/* ── Row 1: secondary links — hidden, replaced by sidebar ── */
#list-nav {
  display: none !important;
}
#list-nav_UNUSED {
  display: flex;
  align-items: center;
  list-style: none;
  margin: 0;
  padding: 0 24px;
  height: 36px;
  gap: 0;
  background: var(--c-subnav);
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  width: 100%;
  box-sizing: border-box;
}
#list-nav li {
  list-style: none;
}
#list-nav li a {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 36px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 500;
  color: var(--c-secondary);
  text-decoration: none;
  white-space: nowrap;
  border-radius: 0;
  transition:
    color 0.12s,
    background 0.12s;
}
#list-nav li a i {
  font-size: 11px;
  opacity: 0.8;
}
#list-nav li a:hover {
  color: var(--c-primary);
  background: rgba(0, 112, 255, 0.07);
}
@media (max-width: 1024px) {
  #list-nav {
    display: none;
  }
}

/* ── Row 2: category nav + search ── */
#header {
  width: 100%;
  background: var(--c-subnav);
  border-bottom: 1px solid var(--c-border);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}
#menu {
  display: block;
}

#menucontainer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 24px;
  height: 40px;
  gap: 12px;
}

/* Category tab links */
#menulink > ul {
  display: flex;
  align-items: stretch;
  list-style: none;
  margin: 0;
  padding: 0;
  height: 40px;
  gap: 2px;
}
#menulink > ul > li {
  position: relative;
  display: flex;
  align-items: center;
}
#menulink > ul > li > a {
  display: flex;
  align-items: center;
  gap: 5px;
  height: 40px;
  padding: 0 10px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--c-secondary);
  text-decoration: none;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  transition:
    color 0.12s,
    border-color 0.12s,
    background 0.12s;
}
#menulink > ul > li > a i {
  font-size: 12px;
}
/* Desktop chevron on categories that have a submenu */
#menulink > ul > li:has(> ul) > a::after {
  content: "\f078";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: 8px;
  opacity: 0.45;
  margin-left: 3px;
  transition:
    transform 0.15s,
    opacity 0.15s;
}
#menulink > ul > li:has(> ul):hover > a::after {
  opacity: 1;
  transform: rotate(180deg);
  color: var(--c-primary);
}

#menulink > ul > li:hover > a,
#menulink > ul > li > a:hover {
  color: var(--c-primary);
  border-bottom-color: var(--c-primary);
  background: rgba(0, 112, 255, 0.05);
}

/* Category dropdowns */
#menulink > ul > li > ul {
  display: none;
  position: absolute;
  top: calc(100% + 1px);
  left: 0;
  min-width: 170px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-sm);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  z-index: 3000;
  padding: 4px 0;
  list-style: none;
}
#menulink > ul > li > ul::before {
  content: "";
  position: absolute;
  top: -8px;
  left: 0;
  right: 0;
  height: 8px;
}
#menulink > ul > li:hover > ul {
  display: block;
}
#menulink > ul > li > ul > li > a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  font-size: 13px;
  color: var(--c-body);
  text-decoration: none;
  white-space: nowrap;
  transition:
    background 0.1s,
    color 0.1s;
}
#menulink > ul > li > ul > li > a:hover {
  background: var(--c-sidebar-hov);
  color: var(--c-primary);
}
#menulink > ul > li > ul > li > a > b > u {
  font-weight: 600;
  font-style: normal;
  text-decoration: none;
}

/* Search form — visual order: [text] [category ▾] [🔍 button] */
#menusearchlink {
  flex-shrink: 0;
  display: flex;
  align-items: center;
}
#headsearch_form {
  display: flex;
  align-items: center;
  gap: 0;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-sm);
  padding: 3px;
  transition: border-color 0.15s;
  overflow: hidden;
}
#headsearch_form:focus-within {
  border-color: var(--c-primary);
}
/* Reorder: text → select → button (HTML has button first) */
#headsearch {
  order: 1;
}
#headcat {
  order: 2;
}
.gobutton {
  order: 3;
}
#headsearch {
  height: 26px;
  padding: 0 8px;
  width: 160px;
  border: none;
  background: transparent;
  color: var(--c-body);
  font-size: 13px;
  outline: none;
}
#headcat {
  order: 2;
  height: 26px;
  padding: 0 4px;
  border: none;
  border-left: 1px solid var(--c-border);
  border-right: 1px solid var(--c-border);
  background: transparent;
  color: var(--c-secondary);
  font-size: 12px;
  outline: none;
  cursor: pointer;
}
.gobutton {
  display: flex;
}
.gobutton input[type="button"] {
  width: 28px;
  height: 28px;
  background: #4db5ff;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  flex-shrink: 0;
}
.gobutton input[type="button"]:hover {
  background-color: var(--c-primary-hov);
}

/* Mobile — list-nav hidden, category bar = scroll strip + full-width search below */
@media (max-width: 1024px) {
  #list-nav {
    display: none;
  }

  #header {
    display: block;
    box-shadow: none;
    border-bottom: 1px solid var(--c-border);
  }

  /* Stack: categories row on top, search row below */
  #menucontainer {
    flex-direction: column;
    height: auto;
    padding: 0;
    max-width: 100%;
    gap: 0;
    align-items: stretch;
  }

  /* ── Scrollable category strip ── */
  /* NOTE: no mask-image on #menulink — it creates a stacking context that
     traps position:fixed children (the submenu panel). Use ::after on the
     container instead for the right-edge fade hint. */
  #menucontainer {
    position: relative;
  }
  #menucontainer::after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: 36px;
    height: 42px;
    background: linear-gradient(to right, transparent, var(--c-subnav));
    pointer-events: none;
  }
  #menulink {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  #menulink::-webkit-scrollbar {
    display: none;
  }
  #menulink > ul {
    height: 42px;
    flex-wrap: nowrap;
    gap: 0;
    padding: 0 12px;
    min-width: max-content;
  }
  #menulink > ul > li > a {
    height: 42px;
    padding: 0 12px;
    font-size: 13px;
    border-bottom: none;
    white-space: nowrap;
    touch-action: manipulation;
  }

  /* Mobile: keep desktop submenu hidden — offcanvas handles subcategories */
  #menulink > ul > li > ul {
    display: none !important;
  }
  #menulink > ul > li:has(> ul) > a::after {
    display: none;
  }

  /* ── Full-width search row below strip ── */
  #menusearchlink {
    display: flex;
    padding: 7px 12px;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
  }
  #headsearch_form {
    width: 100%;
    border-radius: var(--r-sm);
  }
  #headsearch {
    flex: 1;
    width: auto;
    min-width: 0;
  }
}

/* ── 6. Header nav ───────────────────────────────── */

/* Flex row: logo left, nav right */
.statusbar-nzb-div {
  display: flex;
  align-items: center;
  height: 64px;
  border: none;
  width: 100%;
}

.hdr-logo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  margin-right: auto;
  text-decoration: none;
}

.hdr-logo img {
  height: 72px;
  width: auto;
  display: block;
}

#dropfix {
  flex-shrink: 0;
  float: none;
  width: auto;
}

/* General anchor style inside header — excludes the nav action buttons */
#statusbar a:not(.nav-btn-login):not(.nav-btn-register) {
  color: var(--c-body);
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  transition: color 0.12s;
}
#statusbar a:not(.nav-btn-login):not(.nav-btn-register):hover {
  color: var(--c-primary);
}

/* Nav list */
.top_navigation {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.top-menu {
  display: flex;
  align-items: center;
  gap: 4px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.top-menu li {
  list-style: none;
  float: none;
  border: none;
  padding: 0;
  margin: 0;
}
.top-menu > li > a:not(.nav-btn-login):not(.nav-btn-register) {
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 500;
  color: var(--c-body);
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

/* ── Logged-in nav ────────────────────────── */
.top-menu-loggedin {
  display: flex;
  align-items: center;
  gap: 2px;
}
.top-menu-loggedin .nav-item {
  position: relative;
  list-style: none;
}

.top-menu-loggedin .nav-link {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  font-size: 13px;
  font-weight: 500;
  color: var(--c-body);
  text-decoration: none;
  border-radius: var(--r-sm);
  white-space: nowrap;
  transition:
    background 0.12s,
    color 0.12s;
  cursor: pointer;
}
.top-menu-loggedin .nav-link:hover {
  background: var(--c-sidebar-hov);
  color: var(--c-primary);
}
.top-menu-loggedin .nav-link i {
  font-size: 13px;
}
.nav-label {
  display: block;
  max-width: 100px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* Sidebar toggle button */
.nav-icon-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--c-muted);
  border-radius: var(--r-sm);
  font-size: 15px;
  transition:
    background 0.12s,
    color 0.12s;
}
.nav-icon-btn:hover {
  background: var(--c-sidebar-hov);
  color: var(--c-primary);
}

/* Unread badge */
.nav-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  background: #4db5ff;
  color: #fff;
  border-radius: 9px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
}

/* Dropdown chevron */
.nav-caret {
  font-size: 10px !important;
  opacity: 0.55;
  margin-left: 1px;
}

/* Dropdown menu */
.nav-dropdown-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 210px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-sm);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
  z-index: 2000;
  padding: 8px 0 8px;
  list-style: none;
  margin: 0;
}
/* Invisible bridge covers the gap between nav link and dropdown so hover doesn't break */
.nav-dropdown-menu::before {
  content: "";
  position: absolute;
  top: -8px;
  left: 0;
  right: 0;
  height: 8px;
}
.nav-dropdown-right {
  left: auto;
  right: 0;
}
.top-menu-loggedin .nav-item:hover > .nav-dropdown-menu {
  display: block;
}
.nav-dropdown-menu a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 18px;
  font-size: 13px;
  color: var(--c-body);
  text-decoration: none;
  white-space: nowrap;
  transition:
    background 0.1s,
    color 0.1s;
}
.nav-dropdown-menu a:hover {
  background: var(--c-sidebar-hov);
  color: var(--c-primary);
}
.nav-dropdown-menu i {
  width: 14px;
  font-size: 13px;
  color: var(--c-muted);
  flex-shrink: 0;
}
.nav-dropdown-menu a:hover i {
  color: var(--c-primary);
}
.nav-dropdown-menu li.nav-dropdown-header {
  padding: 12px 18px 6px 18px !important;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--c-muted);
  display: block;
}
.nav-dropdown-divider {
  height: 1px;
  background: var(--c-border);
  margin: 6px 0;
}
.nav-logout,
.nav-logout i {
  color: #dc2626 !important;
}

/* Theme toggle button in nav */
.nav-theme-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--c-muted);
  border-radius: var(--r-sm);
  font-size: 16px;
  transition:
    background 0.12s,
    color 0.12s;
}
.nav-theme-btn:hover {
  background: var(--c-sidebar-hov);
  color: var(--c-primary);
}
.nav-theme-btn .fa-sun {
  color: #ffb020;
}
.nav-theme-btn:hover .fa-sun {
  color: #e09900;
}

/* Donate CTA button in main nav */
.nav-donate-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  margin-left: 4px;
  background: linear-gradient(135deg, #38bdf8 0%, #0070ff 100%);
  color: #fff !important;
  font-size: 11px;
  font-weight: 600;
  border-radius: 20px;
  text-decoration: none !important;
  white-space: nowrap;
  transition:
    opacity 0.15s,
    box-shadow 0.15s,
    transform 0.1s;
  box-shadow: 0 2px 8px rgba(56, 189, 248, 0.4);
}
.nav-donate-btn:hover {
  opacity: 0.88;
  box-shadow: 0 4px 14px rgba(56, 189, 248, 0.55);
  transform: translateY(-1px);
  color: #fff !important;
}
.nav-donate-btn i {
  font-size: 13px;
  color: #fff !important;
}

/* Login / Register header buttons — use #statusbar for specificity parity */
#statusbar .nav-btn-login,
#statusbar .nav-btn-register {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 10px 22px;
  border-radius: var(--r-sm);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.15s;
  line-height: 1.4;
  outline: none;
}

#statusbar .nav-btn-login {
  border: 1.5px solid var(--c-border);
  color: var(--c-body);
  background: transparent;
}
#statusbar .nav-btn-login:hover,
#statusbar .nav-btn-login:focus {
  border-color: var(--c-primary);
  color: var(--c-primary);
}

#statusbar .nav-btn-register {
  background: var(--c-primary);
  color: #fff;
  border: 1.5px solid var(--c-primary);
}
#statusbar .nav-btn-register:hover,
#statusbar .nav-btn-register:focus {
  background: var(--c-primary-hov);
  border-color: var(--c-primary-hov);
  color: #fff;
}

/* ── 7. Sidebar ──────────────────────────────────── */
#sidebar {
  background: var(--c-sidebar-bg);
  border-radius: var(--r-md);
  box-shadow: var(--sh-sm);
  border: 1px solid var(--c-border);
  overflow: hidden;
  font-size: 13px;
}

#sidebar ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
#sidebar li {
  margin: 0;
  padding: 0;
  border: none;
  background-image: none;
}
#sidebar li li {
  margin: 0;
  padding: 0;
  border: none;
  background-image: none;
}

#sidebar li a,
#sidebar a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  color: var(--c-sidebar-text);
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  transition:
    background 0.15s,
    color 0.15s;
}

#sidebar li a:hover,
#sidebar a:hover {
  background: var(--c-sidebar-hov);
  color: var(--c-primary);
}

/* Active item */
#sidebar li li.active > a {
  background: var(--c-primary-muted);
  color: var(--c-primary);
}

/* Sidebar profile card buttons — override #sidebar a specificity */
#sidebar .sb-view-profile-btn,
#sidebar .sb-view-profile-btn:link,
#sidebar .sb-view-profile-btn:visited {
  background: var(--c-primary) !important;
  color: #fff !important;
  text-decoration: none;
}
#sidebar .sb-view-profile-btn:hover {
  background: var(--c-primary-hov) !important;
  color: #fff !important;
}
#sidebar .sb-upgrade-link {
  background: rgba(255, 176, 32, 0.1) !important;
  color: var(--c-warning) !important;
  border: 1px solid var(--c-warning);
}
#sidebar .sb-upgrade-link:hover {
  background: rgba(255, 176, 32, 0.2) !important;
}

/* Sidebar menu links must never have an unwanted coloured background */
#sidebar li.menu_main ul li a,
#sidebar li.menu_recentposts ul li a,
#sidebar li.menu_useful ul li a {
  background: transparent;
}

/* Section headings — sentence case, bold, dark (matches reference) */
#sidebar h2,
#sidebar .menucaption {
  font-size: 13px;
  font-weight: 700;
  color: var(--c-heading);
  padding: 16px 14px 6px;
  margin: 0;
  height: auto;
  background: none;
}

#sidebar h2 font,
#sidebar h2 u {
  color: var(--c-heading);
  text-decoration: none;
}

#sidebar .m_wel {
  font-weight: 600;
  color: var(--c-heading);
}
#sidebar .m_detail {
  color: var(--c-secondary);
}

/* ── 8. Cards ────────────────────────────────────── */
.contentborder {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-lg);
  box-shadow: var(--sh-md);
  padding: 28px 32px;
  margin-bottom: 20px;
  color: var(--c-body);
}

/* ── 9. Login Page ───────────────────────────────── */
.login-card {
  padding: 0;
  overflow: hidden;
  width: 100%;
  max-width: none;
  margin: 0;
}

.login-panel {
  display: flex;
  min-height: 440px;
}

.login-form-col {
  flex: 0 0 460px;
  width: 460px;
  padding: 40px 48px;
}

.login-deco-col {
  flex: 1;
  min-width: 200px;
  background: linear-gradient(135deg, #dbeafe 0%, #eff6ff 60%, #e0f2fe 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 20px;
}

.login-globe-img {
  width: 100%;
  height: auto;
  object-fit: contain;
  display: block;
}

.login-title {
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--c-heading);
  margin: 0 0 24px;
  text-align: center;
}
.login-subtitle {
  font-size: 14px;
  color: var(--c-muted);
  margin: 0 0 24px;
}

.login-error {
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: var(--r-sm);
  color: #dc2626;
  padding: 12px 16px;
  font-size: 14px;
  margin-bottom: 16px;
}

.login-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.login-field {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}

.lf-icon {
  position: absolute;
  left: 12px;
  color: var(--c-muted);
  display: flex;
  align-items: center;
  pointer-events: none;
  z-index: 1;
  font-size: 15px;
  width: 16px;
  height: 16px;
  justify-content: center;
}

.login-field input[type="text"],
.login-field input[type="password"],
.login-field input[type="email"] {
  width: 100%;
  padding: 12px 42px 12px 40px;
  border: 1.5px solid var(--c-border);
  border-radius: var(--r-sm);
  font-size: 14px;
  color: var(--c-body);
  background: var(--c-surface);
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
  outline: none;
}
.login-field input:focus {
  border-color: var(--c-primary);
  box-shadow: 0 0 0 3px var(--c-primary-muted);
}

.lf-eye {
  position: absolute;
  right: 10px;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--c-muted);
  padding: 4px;
  display: flex;
  align-items: center;
  transition: color 0.12s;
}
.lf-eye:hover {
  color: var(--c-body);
}

.login-remember {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: var(--c-body);
}
.login-remember input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--c-primary);
  cursor: pointer;
  margin: 0;
}
.login-remember label {
  cursor: pointer;
  margin: 0;
}

.btn-login {
  width: 100%;
  padding: 13px;
  background: var(--c-primary);
  color: #fff;
  border: none;
  border-radius: var(--r-sm);
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition:
    background 0.15s,
    box-shadow 0.15s;
  margin-top: 4px;
}
.btn-login:hover {
  background: var(--c-primary-hov);
  box-shadow: 0 4px 14px rgba(37, 99, 235, 0.35);
}

.login-actions {
  display: flex;
  gap: 10px;
  margin-top: 16px;
}

.btn-action {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 12px;
  border: 1.5px solid var(--c-primary);
  border-radius: var(--r-sm);
  font-size: 13px;
  font-weight: 600;
  color: var(--c-primary);
  text-decoration: none;
  background: var(--c-surface);
  transition:
    border-color 0.12s,
    color 0.12s,
    background 0.12s;
}
.btn-action:hover {
  background: var(--c-primary);
  color: #fff;
}

/* ── 10. Register Page ───────────────────────────── */
.reg-title {
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--c-heading);
  margin: 0 0 6px;
  text-align: center;
}
.reg-subtitle {
  font-size: 14px;
  color: var(--c-muted);
  margin: 0 0 24px;
  text-align: center;
}

.reg-form {
  display: flex;
  flex-direction: column;
}
.reg-textarea {
  width: 100%;
  min-height: 140px;
  resize: vertical;
  padding: 12px 14px;
  border: 1.5px solid var(--c-border);
  border-radius: var(--r-sm);
  font-size: 14px;
  color: var(--c-body);
  background: var(--c-surface);
  font-family: inherit;
  line-height: 1.5;
  outline: none;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}
.reg-textarea:focus {
  border-color: var(--c-primary);
  box-shadow: 0 0 0 3px var(--c-primary-muted);
}

/* Contact page bottom row: captcha left, button+note right */
.contact-bottom {
  display: flex;
  gap: 24px;
  align-items: center;
  margin-top: 4px;
}
.contact-captcha {
  flex-shrink: 0;
}
.contact-actions {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.contact-actions .btn-login {
  margin-top: 0;
  width: 100%;
}
@media (max-width: 600px) {
  .contact-bottom {
    flex-direction: column;
    align-items: stretch;
  }
}

/* 2-column field grid */
.reg-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px 20px;
  margin-bottom: 14px;
}

.reg-field-group {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.reg-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--c-body);
}
.reg-label em {
  color: var(--c-primary);
  font-style: normal;
}
.reg-hint {
  font-size: 12px;
  color: var(--c-muted);
}
.reg-generate-link {
  color: var(--c-primary);
  font-weight: 500;
}
.reg-generate-link:hover {
  color: var(--c-primary-hov);
}

.reg-success {
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: var(--r-sm);
  color: #15803d;
  padding: 12px 16px;
  font-size: 14px;
  margin-bottom: 16px;
}
.reg-success-hint {
  font-size: 12px;
  color: #166534;
  margin: 8px 0 0;
}

/* Agree + submit row */
.reg-bottom {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 20px;
  align-items: center;
  margin-top: 4px;
}
.reg-agree {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  color: var(--c-body);
  margin-bottom: 0;
}
.reg-agree input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--c-primary);
  cursor: pointer;
  margin: 2px 0 0;
  flex-shrink: 0;
}
.reg-agree label {
  cursor: pointer;
  line-height: 1.5;
}
.reg-rules-link {
  font-weight: 600;
}
.reg-bottom .btn-login {
  width: auto;
  padding: 13px 28px;
  margin-top: 0;
  white-space: nowrap;
}

.reg-footer-note {
  font-size: 12px;
  color: var(--c-muted);
  text-align: center;
  margin: 14px 0 0;
}

/* Stack to single column on narrow screens */
@media (max-width: 600px) {
  .reg-grid {
    grid-template-columns: 1fr;
  }
  .reg-bottom {
    grid-template-columns: 1fr;
  }
  .reg-bottom .btn-login {
    width: 100%;
  }
}

/* Rules modal */
.reg-modal-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  z-index: 9999;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.reg-modal {
  background: var(--c-surface);
  border-radius: var(--r-lg);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
  max-width: 600px;
  width: 100%;
  max-height: 80vh;
  display: flex;
  flex-direction: column;
}

.reg-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 24px;
  border-bottom: 1px solid var(--c-border);
  flex-shrink: 0;
}
.reg-modal-header h3 {
  margin: 0;
  font-size: 17px;
}

.reg-modal-close {
  background: none;
  border: none;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  color: var(--c-muted);
  padding: 2px 6px;
  border-radius: var(--r-sm);
  transition:
    color 0.12s,
    background 0.12s;
}
.reg-modal-close:hover {
  color: var(--c-body);
  background: var(--c-sidebar-hov);
}

.reg-modal-body {
  padding: 20px 24px;
  overflow-y: auto;
  font-size: 13px;
  color: var(--c-body);
  line-height: 1.7;
}
.reg-modal-body p {
  margin: 0 0 10px;
}
.reg-modal-body ul {
  margin: 0 0 14px;
  padding-left: 20px;
  list-style: disc;
}
.reg-modal-body ul li {
  margin-bottom: 4px;
}

/* ── 10.5 verify2fa Page ───────────────────────────── */

.2fa-title {
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--c-heading);
  margin: 0 0 6px;
  text-align: center;
}



/* ── 11. Buttons (general) ───────────────────────── */
input[type="submit"],
input[type="button"],
button:not(.nav-icon-btn):not(.nav-theme-btn):not(.lf-eye):not(.reg-modal-close):not([class]),
.btn {
  font-family: var(--font);
  font-size: 14px;
  font-weight: 400;
  padding: 10px 20px;
  border-radius: var(--r-sm);
  cursor: pointer;
  border: none;
  outline: none;
  background: var(--c-primary);
  color: #fff;
  transition:
    background 0.12s,
    box-shadow 0.12s;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
  white-space: nowrap;
}
input[type="submit"]:hover,
input[type="button"]:hover,
button:not(.nav-icon-btn):not(.nav-theme-btn):not(.lf-eye):not(.reg-modal-close):not([class]):hover,
.btn:hover {
  background: var(--c-primary-hov);
}

/* ── 11b. Sidebar profile card ───────────────────── */
.sb-profile-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  padding: 16px 14px 14px;
  margin-bottom: 12px;
}
.sb-profile-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}
.sb-avatar-wrap {
  flex-shrink: 0;
}
.sb-avatar {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid var(--c-border);
  display: block;
}
.sb-avatar-initials {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: var(--c-primary);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  font-weight: 700;
  flex-shrink: 0;
}
.sb-user-info {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}
.sb-username {
  font-size: 15px;
  font-weight: 700;
  color: var(--c-heading);
  max-width: 130px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sb-role-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 9px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 600;
  width: fit-content;
  border: 1.5px solid var(--c-primary);
  color: var(--c-primary);
}
.sb-role-admin {
  border-color: #0070ff;
  color: #0070ff;
}
.sb-role-moderator {
  border-color: #16c784;
  color: #16c784;
}
.sb-role-vip {
  border-color: #ffb020;
  color: #ffb020;
}
.sb-role-platinum {
  border-color: #a855f7;
  color: #a855f7;
}
.sb-role-editor {
  border-color: #14b8a6;
  color: #14b8a6;
}
.sb-role-lult {
  border-color: #f97316;
  color: #f97316;
}
.sb-divider {
  height: 1px;
  background: var(--c-border);
  margin: 12px 0;
}
.sb-stat-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 5px 0;
  font-size: 13px;
}
.sb-stat-label {
  color: var(--c-muted);
  display: flex;
  align-items: center;
  gap: 6px;
}
.sb-stat-value {
  font-weight: 600;
  color: var(--c-heading);
}
.sb-val-green {
  color: var(--c-success) !important;
}
.sb-val-red {
  color: var(--c-danger) !important;
}
.sb-val-muted {
  color: var(--c-muted) !important;
  font-weight: 400 !important;
}
.sb-report-link {
  color: inherit;
  text-decoration: none;
}
.sb-report-link:hover {
  text-decoration: underline;
}
.sb-upgrade-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  padding: 8px;
  margin-top: 10px;
  background: rgba(255, 176, 32, 0.1);
  color: var(--c-warning);
  border: 1px solid var(--c-warning);
  border-radius: var(--r-sm);
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.12s;
}
.sb-upgrade-link:hover {
  background: rgba(255, 176, 32, 0.2);
  color: var(--c-warning);
}
.sb-view-profile-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 100%;
  padding: 10px;
  margin-top: 12px;
  background: var(--c-primary);
  color: #fff;
  border-radius: var(--r-sm);
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
  transition: background 0.12s;
}
.sb-view-profile-btn:hover {
  background: var(--c-primary-hov);
  color: #fff;
}

/* ── 11c. Sidebar menu ────────────────────────────── */
#sidebar ul {
  padding: 0;
  margin: 0;
  list-style: none;
}
#sidebar li {
  list-style: none;
}
#sidebar li.menu_main h2,
#sidebar li.menu_recentposts h2,
#sidebar li.menu_useful h2 {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--c-muted);
  padding: 10px 4px 6px;
  margin: 0;
}
#sidebar li.menu_main ul li a,
#sidebar li.menu_recentposts ul li a,
#sidebar li.menu_useful ul li a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  font-size: 13px;
  font-weight: 500;
  color: var(--c-body);
  text-decoration: none;
  border-radius: var(--r-sm);
  transition:
    background 0.12s,
    color 0.12s;
}
#sidebar li.menu_main ul li a:hover,
#sidebar li.menu_recentposts ul li a:hover,
#sidebar li.menu_useful ul li a:hover {
  background: var(--c-sidebar-hov);
  color: var(--c-primary);
}
#sidebar .sb-mi {
  width: 16px;
  font-size: 13px;
  color: var(--c-muted);
  flex-shrink: 0;
  text-align: center;
}
#sidebar li.menu_main ul li a:hover .sb-mi,
#sidebar li.menu_recentposts ul li a:hover .sb-mi,
#sidebar li.menu_useful ul li a:hover .sb-mi {
  color: var(--c-primary);
}
/* Hide legacy img icons embedded in title HTML from the database */
#sidebar li.menu_main ul li a img,
#sidebar li.menu_recentposts ul li a img,
#sidebar li.menu_useful ul li a img {
  display: none;
}

/* ── 11d. Sidebar stats card ──────────────────────── */
.sb-stats-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  padding: 10px 10px 10px;
  margin-top: 12px;
  margin-bottom: 10px;
}
.sb-stats-title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--c-muted);
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
}

/* ── 12. Footer ──────────────────────────────────── */
.footer {
  width: 100%;
  height: auto;
  background: var(--c-sidebar-hov);
  border-top: 1px solid var(--c-border);
  padding: 20px 24px 24px;
  margin-top: 24px;
  text-align: center;
  font-size: 12px;
  color: var(--c-secondary);
}
.footer b,
.footer strong {
  font-weight: 500;
  color: var(--c-secondary);
}
.footer a {
  color: var(--c-secondary);
  text-decoration: none;
}
.footer a:hover {
  color: var(--c-primary);
}

div[style*="clear: both"] {
  padding: 12px 0;
  text-align: center;
}
div[style*="clear: both"] a {
  color: var(--c-secondary);
  font-size: 12px;
}
div[style*="clear: both"] a:hover {
  color: var(--c-primary);
}

/* ── 12. Tables ──────────────────────────────────── */
table.data:not(.innerdata) tr:hover > td,
table.highlight:not(.innerdata) tr:hover > td {
  background: var(--c-sidebar-hov);
}

/* ── 13. Scrollbar ───────────────────────────────── */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: var(--c-bg);
}
::-webkit-scrollbar-thumb {
  background: var(--c-border);
  border-radius: 99px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--c-muted);
}

/* ── 14. Responsive ──────────────────────────────── */

/* Tablet — login card starts to get tight; flex form column, shrink globe */
@media (max-width: 960px) {
  .login-form-col {
    flex: 1 1 320px;
    width: auto;
  }
  .login-deco-col {
    flex: 0 0 220px;
    min-width: 0;
  }
}

/* Tablet/mobile — sidebar becomes slide-in overlay, content goes full-width */
@media (max-width: 1024px) {
  /* Full-width content grid */
  .contentborder2 {
    grid-template-columns: 1fr;
  }
  #content {
    grid-column: 1;
    grid-row: 1;
  }

  /* Sidebar: fixed overlay, hidden off-screen by default */
  #sidebar {
    display: block !important;
    position: fixed;
    left: -250px;
    top: 0;
    width: 240px;
    height: 100vh;
    z-index: 1001;
    overflow-y: auto;
    transition: left 0.25s ease;
    box-shadow: 4px 0 24px rgba(0, 0, 0, 0.18);
    padding: 16px 8px 24px;
  }
  #sidebar.sidebar-mobile-open {
    left: 0;
  }

  /* Backdrop */
  .sidebar-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 1000;
  }
  .sidebar-backdrop.active {
    display: block;
  }

  /* Header: hide non-essential nav items */
  .nav-hide-mobile {
    display: none !important;
  }

  /* Shrink logo a bit */
  .hdr-logo img {
    height: 40px;
  }
}

/* Phablet — tighter spacing, login panel collapses */
@media (max-width: 700px) {
  #page {
    padding: 12px 12px 0;
  }
  .statusbar-nzb-div {
    padding: 0 12px;
    height: 56px;
  }

  .hdr-logo img {
    height: 40px;
  }

  #statusbar .nav-btn-login,
  #statusbar .nav-btn-register {
    padding: 8px 14px;
    font-size: 13px;
  }

  .login-panel {
    flex-direction: column;
    min-height: auto;
  }
  .login-form-col {
    flex: none;
    width: 100%;
    padding: 28px 20px;
  }
  .login-deco-col {
    display: none;
  }

  .contentborder {
    padding: 20px 16px;
  }
  .footer {
    padding: 16px;
  }

  .sf-inner {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .sf-brand {
    padding: 0;
    border-left: none;
  }
  .sf-col,
  .sf-trust {
    padding: 0 0 0 24px;
    border-left: 1px solid var(--c-border);
  }
  .sf-col--mobile-hide {
    display: none;
  }
  .sf-col--mobile-hide + .sf-col {
    border: 0 !important;
    padding-top: 0 !important;
  }
}

/* Narrow — hide nav text labels, show icons only */
@media (max-width: 480px) {
  .nav-label {
    display: none;
  }
  .top-menu-loggedin .nav-link {
    padding: 8px 8px;
  }
  .top-menu-loggedin {
    gap: 0;
  }
}

/* Mobile — very small screens */
@media (max-width: 420px) {
  .hdr-logo img {
    height: 34px;
  }
  .statusbar-nzb-div {
    padding: 0 10px;
    height: 52px;
  }
  #page {
    padding: 8px 10px 0;
  }

  #statusbar .nav-btn-login,
  #statusbar .nav-btn-register {
    padding: 7px 10px;
    font-size: 12px;
    gap: 5px;
  }

  .login-actions {
    flex-direction: column;
    gap: 8px;
  }
  .btn-action {
    padding: 12px;
  }
}

/* 360px — absolute minimum, squeeze everything */
@media (max-width: 380px) {
  .hdr-logo img {
    height: 30px;
  }
  .statusbar-nzb-div {
    padding: 0 8px;
    height: 48px;
  }
  #page {
    padding: 8px 8px 0;
  }
  .top-menu-loggedin .nav-link {
    padding: 7px 6px;
  }
  .nav-icon-btn {
    width: 30px;
    height: 30px;
    font-size: 14px;
  }
  .nav-theme-btn {
    width: 30px;
    height: 30px;
    font-size: 14px;
  }
}

/* ── Category offcanvas (mobile subcategory navigator) ── */
#cat-offcanvas {
  position: fixed;
  top: 0;
  left: -290px;
  width: 280px;
  height: 100%;
  background: var(--c-surface);
  box-shadow: 4px 0 24px rgba(0, 0, 0, 0.22);
  z-index: 5000;
  transition: left 0.25s ease;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
#cat-offcanvas.open {
  left: 0;
}
.cat-oc-hdr {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--c-border);
  flex-shrink: 0;
}
#cat-oc-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--c-text);
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}
#cat-oc-title i {
  color: var(--c-primary);
  font-size: 16px;
}
#cat-oc-title:hover {
  color: var(--c-primary);
}
#cat-oc-close {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--c-text-muted);
  font-size: 16px;
  padding: 6px 8px;
  border-radius: 6px;
  line-height: 1;
  flex-shrink: 0;
}
#cat-oc-close:hover {
  background: var(--c-sidebar-hov);
  color: var(--c-text);
}
#cat-oc-list {
  list-style: none;
  padding: 6px 0;
  margin: 0;
}
#cat-oc-list li a {
  display: block;
  padding: 11px 20px 11px 36px;
  color: var(--c-text);
  font-size: 14px;
  text-decoration: none;
}
#cat-oc-list li a:hover,
#cat-oc-list li a:active {
  background: var(--c-sidebar-hov);
  color: var(--c-primary);
}
#cat-oc-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  z-index: 4999;
  display: none;
}
#cat-oc-backdrop.active {
  display: block;
}

/* ── Announcement section ─────────────────────────── */
.ann-section-heading {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 22px;
  font-weight: 700;
  color: var(--c-heading);
  margin: 20px 0 18px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--c-border);
}
.ann-section-heading i {
  font-size: 16px;
  color: var(--c-primary);
}

/* ── Announcement cards ───────────────────────────── */
.announcements-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 24px;
}
.ann-card {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 12px;
  padding: 16px 20px;
  box-shadow: var(--sh-sm);
}
.ann-card-icon {
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ann-card-icon i {
  font-size: 18px;
}
.ann-card-body {
  flex: 1;
  min-width: 0;
}
.ann-card-title {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 5px;
  line-height: 1.3;
}
.ann-card-desc {
  font-size: 13px;
  color: var(--c-secondary);
  line-height: 1.55;
}

@media (max-width: 600px) {
  .ann-card {
    padding: 13px 15px;
    gap: 11px;
  }
  .ann-card-icon {
    width: 36px;
    height: 36px;
    border-radius: 8px;
  }
  .ann-card-icon i {
    font-size: 15px;
  }
}

/* ── Site Footer ──────────────────────────────────── */
.site-footer {
  margin-top: 48px;
  background: var(--c-surface);
  border-top: 1px solid var(--c-border);
  position: relative;
  overflow: hidden;
}
.site-footer::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 80% 60% at 50% 120%, rgba(0, 112, 255, 0.05) 0%, transparent 70%);
  pointer-events: none;
}

.sf-inner {
  position: relative;
  max-width: 1320px;
  margin: 0 auto;
  padding: 32px 24px 28px;
  display: grid;
  grid-template-columns: 180px 1fr 1fr 1fr auto;
  gap: 0;
  align-items: start;
}

/* Brand */
.sf-brand {
  padding-right: 20px;
}
.sf-logo-link {
  display: inline-block;
  text-decoration: none;
  margin-bottom: 8px;
}
.sf-logo-img {
  height: 40px;
  width: auto;
  display: block;
}
.sf-tagline {
  font-size: 12px;
  color: var(--c-muted);
  margin: 0 0 12px;
  line-height: 1.5;
}
.sf-donate-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 600;
  color: #fff;
  text-decoration: none;
  background: linear-gradient(135deg, #38bdf8 0%, #0070ff 100%);
  border-radius: 20px;
  transition:
    opacity 0.14s,
    box-shadow 0.14s;
margin-left: 25px;
}
.sf-donate-btn:hover {
  opacity: 0.88;
  box-shadow: 0 2px 8px rgba(0, 112, 255, 0.35);
  color: #fff;
}
.sf-donate-btn i {
  font-size: 11px;
}

/* Columns */
.sf-col {
  padding: 0 24px;
  border-left: 1px solid var(--c-border);
}
.sf-col-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--c-heading);
  margin: 0 0 10px;
}
.sf-links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.sf-links a {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  color: var(--c-secondary);
  text-decoration: none;
  transition: color 0.12s;
}
.sf-links a:hover {
  color: var(--c-primary);
}
.sf-links a i {
  width: 14px;
  text-align: center;
  font-size: 11px;
  opacity: 0.7;
  flex-shrink: 0;
}

/* Trust / badges column */
.sf-trust {
  padding-left: 24px;
  border-left: 1px solid var(--c-border);
}
.sf-trust-heading {
  font-size: 13px;
  font-weight: 700;
  color: var(--c-heading);
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 14px;
}
.sf-trust-heading i {
  font-size: 11px;
  color: var(--c-primary);
}
.sf-badges {
  display: flex;
  flex-direction: row;
  gap: 7px;
  flex-wrap: nowrap;
}
.sf-badge {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--c-border);
  border-radius: 7px;
  overflow: hidden;
  text-decoration: none;
  transition:
    border-color 0.14s,
    box-shadow 0.14s;
}
.sf-badge:hover {
  border-color: var(--c-primary);
  box-shadow: var(--sh-sm);
}
.sf-badge-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  flex-shrink: 0;
}
.sf-badge-icon i {
  font-size: 12px;
}
.sf-badge-text {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
  padding: 3px 8px 3px 6px;
  border-left: 1px solid var(--c-border);
}
.sf-badge-text small {
  font-size: 8px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--c-muted);
}
.sf-badge-label {
  font-size: 10px;
  font-weight: 700;
  color: var(--c-heading);
}
.sf-badge-ssl .sf-badge-icon {
  background: rgba(0, 112, 255, 0.1);
}
.sf-badge-ssl .sf-badge-icon i {
  color: #0070ff;
}
.sf-badge-dmca .sf-badge-icon {
  background: rgba(22, 199, 132, 0.1);
}
.sf-badge-dmca .sf-badge-icon i {
  color: #16c784;
}
.sf-badge-rss .sf-badge-icon {
  background: rgba(249, 115, 22, 0.1);
}
.sf-badge-rss .sf-badge-icon i {
  color: #f97316;
}

/* Bottom bar */
/* Wave divider */
.sf-wave {
  line-height: 0;
  overflow: hidden;
}
.sf-wave svg {
  display: block;
  width: 100%;
  height: 32px;
  fill: #dbeafe;
}
[data-theme="dark"] .sf-wave svg {
  fill: rgba(0, 112, 255, 0.07);
}

.sf-bottom {
  position: relative;
  background: #deeafe 0%;
}
[data-theme="dark"] .sf-bottom {
  background: #121f3a;
}
.sf-bottom-inner {
  position: relative;
  max-width: 1320px;
  margin: 0 auto;
  padding: 14px 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  gap: 24px;
  flex-wrap: wrap;
}
.sf-legal {
  font-size: 12px;
  color: var(--c-secondary);
  margin: 0;
  line-height: 1.6;
}
.sf-trust-copy {
  font-size: 11px;
  color: var(--c-muted);
  margin: 14px 0 0;
  line-height: 1.4;
}

/* ── jQuery UI Tabs — global override ─────────────── */
.ui-tabs {
  padding: 0;
  border: none;
  background: transparent;
  box-shadow: none;
}
.ui-tabs .ui-widget-header {
  background: transparent;
  border: none;
}
.ui-tabs .ui-tabs-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  margin: 0 0 28px;
  padding: 0;
  border: none;
  border-bottom: 2px solid var(--c-border);
  background: transparent;
}
.ui-tabs .ui-tabs-nav li {
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  border-radius: 0;
  list-style: none;
  top: 0;
}
.ui-tabs .ui-tabs-nav li a {
  display: block;
  padding: 9px 16px;
  font-size: 13px;
  font-weight: 600;
  font-family: inherit;
  color: var(--c-secondary);
  text-decoration: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  transition:
    color 0.15s,
    border-color 0.15s;
  background: transparent;
}
.ui-tabs .ui-tabs-nav li a:hover {
  color: var(--c-primary);
}
.ui-tabs .ui-tabs-nav li.ui-state-active a,
.ui-tabs .ui-tabs-nav li.ui-tabs-active a {
  color: var(--c-primary);
  border-bottom-color: var(--c-primary);
}
.ui-tabs .ui-tabs-nav li.ui-state-active,
.ui-tabs .ui-tabs-nav li.ui-tabs-active {
  background: transparent;
  border: none;
}
.ui-tabs .ui-tabs-panel {
  padding: 0;
  border: none;
  background: transparent;
}

/* ── Global form elements ─────────────────────────── */
input.med,
input.long {
  padding: 8px 12px;
  font-size: 13px;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  background: var(--c-surface);
  color: var(--c-body);
  outline: none;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
  box-sizing: border-box;
}
input.med:focus,
input.long:focus {
  border-color: var(--c-primary);
  box-shadow: 0 0 0 3px var(--c-primary-muted);
}
/* Full-width inside form card fields */
.prof-field input.med,
.prof-field input.long {
  width: 100%;
}
.prof-input-row input.med {
  width: auto;
  flex: 1;
  min-width: 0;
}
select {
  padding: 8px 12px;
  font-size: 13px;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  background: var(--c-surface);
  color: var(--c-body);
  outline: none;
  cursor: pointer;
  transition: border-color 0.15s;
}
select:focus {
  border-color: var(--c-primary);
}
input[type="submit"],
button[type="submit"] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 22px;
  font-size: 13px;
  font-weight: 400;
  color: #fff;
  background: var(--c-primary);
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition:
    background 0.15s,
    box-shadow 0.15s;
  font-family: var(--font);
}
input[type="submit"]:hover,
button[type="submit"]:hover {
  background: var(--c-primary-hov);
  box-shadow: 0 2px 8px rgba(0, 112, 255, 0.3);
}
button[type="submit"].btn-sm {
  padding: 7px 14px;
  font-size: 12px;
}
input[type="button"],
input[type="reset"] {
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 400;
  background: var(--c-subnav);
  color: var(--c-secondary);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.14s;
}
input[type="button"]:hover,
input[type="reset"]:hover {
  background: var(--c-border);
}
.hint {
  font-size: 11px;
  color: var(--c-muted);
  margin-top: 4px;
  line-height: 1.5;
}
code {
  font-family: "SF Mono", "Fira Mono", monospace;
  font-size: 12px;
  color: var(--c-success);
  background: rgba(22, 199, 132, 0.1);
  padding: 2px 7px;
  border-radius: 4px;
}

/* ── Profile Page ─────────────────────────────────── */
.profile-div {
  margin-top: 8px;
}

/* Headings */
.profile-div .box-header h3 {
  font-size: 20px;
  font-weight: 700;
  color: var(--c-heading);
  margin: 0 0 24px;
  padding: 0;
  border: none;
  background: none;
  text-transform: none;
}
.profile-div #setting .box-header h3,
.profile-div #options .box-header h3,
.profile-div #integration .box-header h3,
.profile-div #api_rss .box-header h3,
.profile-div #invites .box-header h3 {
  font-size: 16px;
  margin: 28px 0 16px;
}

/* Two-column flex layout */
.profile-div .optionpanel,
.profile-div .settingpanel {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  align-items: flex-start;
}
.profile-div .optionpanel .left-div,
.profile-div .optionpanel .right-div,
.profile-div .settingpanel .left-div,
.profile-div .settingpanel .right-div,
.profile-div .optionpanel .lw5,
.profile-div .optionpanel .rw5 {
  width: auto !important;
  flex: 1;
  padding: 0 !important;
  float: none !important;
}
/* settingfooter (Update button) spans full width below the two columns */
.profile-div .settingfooter {
  flex: 0 0 100%;
}

/* Card container */
.profile-div .box-content {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  overflow: hidden;
}

/* Data table */
.profile-div table.input {
  width: 100%;
  border-collapse: collapse;
}
.profile-div table.input th,
.profile-div table.input td {
  padding: 10px 14px;
  font-size: 13px;
  border-bottom: 1px solid var(--c-border);
  vertical-align: middle;
  text-align: left;
}
.profile-div table.input th {
  width: 38%;
  font-size: 13px;
  font-weight: 600;
  color: var(--c-secondary);
  white-space: nowrap;
  text-transform: none;
  letter-spacing: normal;
}
.profile-div table.input td {
  color: var(--c-body);
}
.profile-div table.input tr:last-child th,
.profile-div table.input tr:last-child td {
  border-bottom: none;
}

/* Account info box — override inline teal border */
.profile-div [style*="border:1px solid #3AA1B2"],
.profile-div [style*="border: 1px solid #3AA1B2"] {
  border: 1px solid var(--c-border) !important;
  border-radius: 10px !important;
  padding: 0 !important;
  overflow: hidden;
  background: var(--c-surface);
}
.profile-div [style*="border:1px solid #3AA1B2"] table.input th,
.profile-div [style*="border: 1px solid #3AA1B2"] table.input th {
  font-size: 13px;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 600;
  color: var(--c-secondary);
}
.profile-div table.input th[colspan="4"] h3 {
  font-size: 14px;
  font-weight: 700;
  color: var(--c-heading);
  text-transform: none;
  margin: 0;
  padding: 14px 0 4px;
}

/* Broader th override — all tables inside profile page */
.profile-div th {
  text-transform: none;
  letter-spacing: normal;
  font-size: 13px;
  font-weight: 600;
  color: var(--c-secondary);
}
/* savesearchtab has class="data" so table.data th (0,1,2) beats .profile-div th (0,1,1) — needs higher specificity */
.profile-div table.savesearchtab th {
  text-transform: none !important;
  letter-spacing: normal;
  font-size: 12px;
  font-weight: 600;
  color: var(--c-secondary);
}
/* Integration: inputs inside table cells should fill the cell */
.profile-div table.input td input.med,
.profile-div table.input td input.long {
  width: 100%;
  box-sizing: border-box;
}

/* Admin/Mod divider row */
.prof-admin-row {
  background: rgba(255, 59, 59, 0.06) !important;
  border-top: 2px solid rgba(255, 59, 59, 0.15) !important;
}
.prof-admin-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--c-danger);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.prof-admin-badge i {
  font-size: 12px;
}

/* Excluded categories grid */
.exccat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 20px;
  padding: 20px 0;
}
.exccategoryname {
  font-size: 11px;
  font-weight: 700;
  color: var(--c-heading);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 8px;
  padding-bottom: 5px;
  border-bottom: 2px solid var(--c-primary-muted);
}
.exccategorycontent {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 2px 0;
}
.exccategoryvalue {
  font-size: 12px;
  color: var(--c-body);
}
.exccat-hint {
  margin-top: 12px;
  text-align: center;
}

/* Invites tab */
.invite-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  align-items: start;
}
.invite-send-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.invite-count-row {
  display: flex;
  align-items: center;
  gap: 14px;
}
.invite-count-row > i {
  font-size: 28px;
  color: var(--c-primary);
  opacity: 0.8;
}
.invite-count-num {
  display: block;
  font-size: 28px;
  font-weight: 800;
  color: var(--c-heading);
  line-height: 1;
}
.invite-count-label {
  display: block;
  font-size: 12px;
  color: var(--c-muted);
  margin-top: 2px;
}
.invite-form {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.invite-url-row {
  border-top: 1px solid var(--c-border);
  padding-top: 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.invite-url-label {
  font-size: 11px;
  font-weight: 700;
  color: var(--c-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  display: flex;
  align-items: center;
  gap: 5px;
}
.invite-url-code {
  font-size: 11px;
  word-break: break-all;
}
.invite-pending-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  overflow: hidden;
}
.invite-pending-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--c-heading);
  margin: 0;
  padding: 14px 16px;
  border-bottom: 1px solid var(--c-border);
}
.invite-pending-table {
  width: 100%;
  border-collapse: collapse;
}
.invite-pending-table th {
  font-size: 11px;
  font-weight: 700;
  color: var(--c-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 8px 14px;
  border-bottom: 1px solid var(--c-border);
  text-align: left;
}
.invite-pending-table td {
  font-size: 12px;
  color: var(--c-body);
  padding: 8px 14px;
  border-bottom: 1px solid var(--c-border);
}
.invite-pending-table tr:last-child td {
  border-bottom: none;
}

/* Old th h3 cleanup */

/* Host history inner table */
.profile-div table.data {
  border-collapse: collapse;
  width: 100%;
}
.profile-div table.data thead th {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--c-muted);
  padding: 6px 10px;
  border-bottom: 1px solid var(--c-border);
}
.profile-div table.data td {
  font-size: 12px;
  padding: 6px 10px;
  color: var(--c-body);
}

/* Settings tab — modern form layout */
.prof-section-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--c-heading);
  margin: 0 0 20px;
}
.prof-settings-grid {
  display: grid;
  grid-template-columns: 1fr 200px;
  gap: 20px;
  align-items: start;
}
.prof-form-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  overflow: hidden;
}
.prof-field {
  padding: 12px 16px;
  border-bottom: 1px solid var(--c-border);
}
.prof-field:last-child {
  border-bottom: none;
}
.prof-field label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: var(--c-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 6px;
}
.prof-input-row {
  display: flex;
  gap: 8px;
  align-items: center;
}
.prof-input-row input {
  flex: 1;
  min-width: 0;
}
.btn-gen {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 8px 14px;
  font-size: 12px;
  font-weight: 400;
  white-space: nowrap;
  background: var(--c-subnav);
  color: var(--c-secondary);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.14s;
  flex-shrink: 0;
}
.btn-gen:hover {
  background: var(--c-border);
}
.prof-avatar-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  padding: 24px 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}
.prof-avatar-wrap img {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid var(--c-border);
  display: block;
}
.prof-file-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 14px;
  font-size: 12px;
  font-weight: 400;
  color: var(--c-secondary);
  background: var(--c-subnav);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.14s;
}
.prof-file-btn:hover {
  background: var(--c-border);
}
.prof-file-btn input[type="file"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  pointer-events: none;
}
.prof-form-footer {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--c-border);
}

/* Fix integration/options height constraints */
/* Integration panel show/hide (toggled by JS) */
.div-hide {
  display: none !important;
}
#sabnzbDiv,
#nzbDiv {
  height: auto !important;
  margin-top: 16px;
}
/* Api/Rss new components */
.prof-api-code {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: "SF Mono", "Fira Mono", monospace;
  font-size: 12px;
  color: var(--c-success);
  background: rgba(22, 199, 132, 0.1);
  padding: 6px 10px;
  border-radius: 6px;
}
.prof-endpoints {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 4px;
}
.prof-endpoint-row {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  padding: 4px 0;
}
.prof-endpoint-label {
  font-weight: 600;
  color: var(--c-secondary);
  min-width: 90px;
}
.prof-rss-options {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 16px;
  padding: 16px;
  border-bottom: 1px solid var(--c-border);
}
.prof-rss-options > div {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.prof-rss-url-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  flex-wrap: wrap;
  font-size: 13px;
}
.prof-rss-url-row code {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
}
.profile-div .optionpanel[style*="height"] {
  height: auto !important;
}

/* Misc */
.profile-div .settingfooter {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--c-border);
}
.profile-div .profile-box {
  text-align: center;
  padding: 16px;
}
.profile-div .profile-box img {
  border-radius: 50%;
  border: 3px solid var(--c-border);
}
.profile-div .invitesuccess {
  color: var(--c-success);
  font-size: 12px;
  font-weight: 600;
}
.profile-div img[src*="compat.png"] {
  border-radius: 8px;
  opacity: 0.9;
  margin-top: 8px;
}
.profile-div .rss_feed_tab {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 16px;
}
.profile-div .rss_label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: var(--c-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 6px;
}
.profile-div .rss_feed_tab td {
  padding: 0 12px;
  vertical-align: top;
}
.profile-div .rss_feed_tab td:first-child {
  padding-left: 0;
}
.profile-div .error {
  padding: 10px 16px;
  background: rgba(255, 59, 59, 0.1);
  border: 1px solid rgba(255, 59, 59, 0.3);
  border-radius: 8px;
  color: var(--c-danger);
  font-size: 13px;
  margin-bottom: 16px;
}

/* Options / Integration responsive grid */
.prof-options-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  align-items: start;
}
/* Radio / checkbox rows inside prof-field */
.prof-radio-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  margin-top: 4px;
}
.prof-radio-opt,
.prof-checkbox-opt {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--c-body);
  cursor: pointer;
  user-select: none;
}
/* Integration card logo header */
.prof-integ-title {
  padding: 10px 16px;
  border-bottom: 1px solid var(--c-border);
  display: flex;
  align-items: center;
  gap: 10px;
}
.prof-integ-logo {
  height: 32px;
  width: auto;
  object-fit: contain;
}

/* ── Color-coded action buttons ──────────────────── */
/* Compact shared styles for all color-coded action buttons */
.btn-add,
.btn-edit,
.btn-delete,
.btn-warning,
.btn-purple {
  padding: 2px 8px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  border-radius: 4px !important;
  cursor: pointer !important;
  line-height: 1.4 !important;
  border: none !important;
  white-space: nowrap !important;
}
.btn-add {
  background: var(--c-success) !important;
  color: #fff !important;
}
.btn-add:hover {
  background: #12a86e !important;
}
.btn-edit {
  background: var(--c-primary) !important;
  color: #fff !important;
}
.btn-edit:hover {
  background: var(--c-primary-hov) !important;
}
.btn-delete {
  background: var(--c-danger) !important;
  color: #fff !important;
}
.btn-delete:hover {
  background: #e02020 !important;
}

/* ── Custom Searches card layout ─────────────────── */
.prof-cs-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  border-bottom: 1px solid var(--c-border);
}
.prof-cs-form {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1.5fr auto;
  gap: 10px;
  padding: 14px 16px;
  align-items: end;
  border-bottom: 1px solid var(--c-border);
}
.prof-cs-form > div {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.prof-cs-form select,
.prof-cs-form input[type="text"] {
  width: 100%;
  box-sizing: border-box;
}
.prof-cs-form .rss_label {
  text-transform: none;
  letter-spacing: 0;
  font-size: 11px;
  font-weight: 600;
  color: var(--c-muted);
}
.prof-cs-action {
  display: flex;
  align-items: flex-end;
  gap: 6px;
}
.prof-cs-list-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.prof-cs-list-wrap .savesearchtab {
  width: 100%;
  border-collapse: collapse;
  min-width: 460px;
}
.prof-cs-list-wrap .savesearchtab th,
.prof-cs-list-wrap .savesearchtab td {
  padding: 9px 12px;
  border-bottom: 1px solid var(--c-border);
  font-size: 13px;
  text-align: left;
}
.prof-cs-list-wrap .savesearchtab tr:last-child td {
  border-bottom: none;
}
.prof-cs-list-wrap .savesearchtab tr.datalist:hover td {
  background: var(--c-subnav);
}

/* ── Browse Page ─────────────────────────────────── */
/* RSS icon in page heading */
.br-rss-link {
  margin-left: 7px;
  vertical-align: middle;
  text-decoration: none;
}
.br-rss-icon {
  font-size: 16px;
  color: #ee802f;
  vertical-align: middle;
  transition: opacity 0.12s;
}
.br-rss-link:hover .br-rss-icon {
  opacity: 0.7;
}

/* Top header bar (title left, view/filter right) */
.browse-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 0;
}
.browse-row.half-row,
.browse-row .half-row {
  float: none !important;
}
.title-has-rss-link {
  display: flex;
  align-items: center;
}
.title-has-rss-link a {
  position: relative;
  top: -5px;
}
.half-row.pull-right {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: flex-end;
  flex-shrink: 0;
}

/* View toggle buttons (Cinema/Cover/List) */
.br-view-toggles {
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
.br-view-label {
  font-size: 11px;
  color: var(--c-muted);
  margin-right: 2px;
}
.br-view-btn {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 2px 7px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  color: var(--c-secondary);
  text-decoration: none;
  border: 1px solid var(--c-border);
  transition:
    background 0.12s,
    color 0.12s,
    border-color 0.12s;
}
.br-view-btn:hover {
  background: var(--c-primary);
  color: #fff;
  border-color: var(--c-primary);
}
.br-view-active {
  background: var(--c-primary);
  color: #fff !important;
  border-color: var(--c-primary);
}
.br-view-btn i {
  font-size: 11px;
}

/* Search info icon (pager row) */
.br-search-info-icon {
  font-size: 15px;
  color: var(--c-primary);
  cursor: pointer;
  vertical-align: middle;
  padding-top: 2px;
}

/* Password lock icon */
.br-lock-icon {
  color: #4db5ff !important;
  font-size: 12px;
  vertical-align: middle;
  margin-left: 4px;
}
.color-red {
  color: #dc2626;
}

/* Sort arrows in headers */
.br-th {
  position: relative;
  white-space: nowrap;
  padding-right: 16px !important;
}
.br-sort {
  position: absolute;
  right: 3px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.15s;
}
.br-th:hover .br-sort {
  visibility: visible;
  opacity: 1;
}
.br-sort a {
  color: var(--c-muted);
  font-size: 9px;
  line-height: 0.6;
  display: block;
  text-decoration: none;
}
.br-sort a:hover {
  color: var(--c-primary);
}

/* Category pill badge */
.br-cat-link {
  font-size: 12px;
  color: var(--c-primary);
  text-decoration: none;
  white-space: nowrap;
}
.br-cat-link:hover {
  text-decoration: underline;
}

/* Info icons row */
.br-info-cell {
  width: 110px;
  text-align: center;
  vertical-align: middle;
}
.mid {
  text-align: center !important;
}
.br-icons {
  display: inline-flex;
  align-items: center;
  gap: 6.5px;
  flex-wrap: nowrap;
}
.br-icon {
  font-size: 12px;
  color: #1a1a1a;
  transition: color 0.12s;
}
.br-icon-dim {
  color: #9ca3af !important;
  cursor: default !important;
  pointer-events: none;
}
.br-icon-info {
  cursor: pointer;
}
.br-icon-video {
  cursor: pointer;
}
.br-icons a:hover .br-icon,
.br-icons span:hover .br-icon {
  opacity: 0.72;
}
div.icon_nzb::before,
div.icon_cart::before,
div.icon_sab::before,
div.icon_nzbget::before,
.br-icon {
  color: #4db5ff;
}
.br-icon-dim {
  color: #e2e6ee !important;
}

[data-theme="dark"] div.icon_nzbget::before,
[data-theme="dark"] div.icon_nzb::before,
[data-theme="dark"] div.icon_cart::before,
[data-theme="dark"] div.icon_sab::before,
[data-theme="dark"] .br-icon {
  color: var(--c-primary) !important;
}
[data-theme="dark"] .br-icon-dim {
  color: #9ca3af !important;
}

/* Comments link */
.br-cmts-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--c-body);
  font-size: 12px;
  text-decoration: none;
  white-space: nowrap;
}
.br-cmts-link:hover {
  color: var(--c-primary);
}
.br-cmts-link i {
  font-size: 12px;
}
.br-cmts-link.br-cmts-dim {
  color: #9ca3af !important;
  cursor: default;
}
.br-cmts-link.br-cmts-dim:hover {
  color: #9ca3af !important;
}

/* Comments hover popup */
.br-cmts-cell {
  position: relative !important;
  overflow: visible !important;
}
.br-cmts-popup {
  display: none;
  position: absolute;
  right: 0;
  top: 100%;
  width: 400px !important;
  min-width: 400px !important;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  z-index: 999999;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
}
/* CSS hover keeps popup open while mouse is over td OR popup */
.br-cmts-cell:hover .br-cmts-popup {
  display: block !important;
}
.br-cmts-popup table.comment {
  width: 100%;
  border-collapse: collapse;
}
.br-cmts-popup table.comment th {
  padding: 4px 8px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--c-primary);
  border-bottom: 1px solid var(--c-border);
  text-align: left;
  white-space: nowrap;
}
/* !important needed to override #browsetable td { white-space:nowrap; overflow:hidden } */
.br-cmts-popup table.comment td {
  padding: 4px 8px !important;
  font-size: 10px !important;
  color: var(--c-body) !important;
  border-bottom: 1px solid var(--c-border);
  vertical-align: top !important;
  white-space: normal !important;
  overflow: visible !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
  background: none !important;
}

/* Comment hover popup */
[id^="comments"] {
  border-radius: 8px !important;
  border: 1px solid var(--c-border) !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.13) !important;
  background: var(--c-surface) !important;
  padding: 0 !important;
  overflow: hidden;
  width: 500px !important;
}
[id^="comments"] table.comment {
  margin: 0 !important;
  width: 100% !important;
  border-collapse: collapse;
}
[id^="comments"] table.comment th {
  background: rgba(37, 99, 235, 0.07) !important;
  color: var(--c-primary) !important;
  font-size: 10px !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 6px 10px !important;
  border-bottom: 2px solid var(--c-primary) !important;
  font-weight: 700;
}
[id^="comments"] table.comment td {
  font-size: 10px !important;
  padding: 3px 5px !important;
  vertical-align: top !important;
  border-bottom: 1px solid var(--c-border) !important;
  background: none !important;
  color: var(--c-body) !important;
  line-height: 1.5;
}
[id^="comments"] table.comment td:first-child {
  width: 120px;
  min-width: 120px;
}
[id^="comments"] table.comment td:first-child img {
  display: none !important;
}
[id^="comments"] table.comment td:last-child {
  word-break: break-word;
  overflow-wrap: break-word;
  text-align: left !important;
}
[id^="comments"] table.comment tr:last-child td {
  border-bottom: none !important;
}
[id^="comments"] table.comment a {
  color: var(--c-primary);
  text-decoration: none;
}
[id^="comments"] table.comment a:hover {
  text-decoration: underline;
}

/* ── qTip tooltips (preinfo / series / mediainfo / newznab) ── */
/* Base container — border-radius + shadow */
.qtip,
.ui-tooltip {
  border-radius: 8px !important;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.14) !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
  max-width: 340px !important;
  overflow: hidden;
  z-index: 9999 !important;
}

.ui-tooltip.ui-helper-reset {
  height: fit-content !important;
}

/* Titlebar: primary blue strip */
.ui-tooltip-preinfo .ui-tooltip-titlebar,
.ui-tooltip-series .ui-tooltip-titlebar,
.ui-tooltip-mediainfo .ui-tooltip-titlebar,
.ui-tooltip-newznab .ui-tooltip-titlebar {
  background: var(--c-primary) !important;
  border-color: var(--c-primary) !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 4px 10px !important;
  border-radius: 8px 8px 0 0 !important;
}

/* Content area: theme surface */
.ui-tooltip-preinfo .ui-tooltip-content,
.ui-tooltip-series .ui-tooltip-content,
.ui-tooltip-mediainfo .ui-tooltip-content,
.ui-tooltip-newznab .ui-tooltip-content {
  background: var(--c-surface) !important;
  border-color: var(--c-border) !important;
  color: var(--c-body) !important;
  font-size: 12px !important;
  padding: 5px 10px !important;
  line-height: 1.5 !important;
}

/* Content inner elements */
.ui-tooltip-content b {
  color: var(--c-body);
  font-weight: 600;
}
.ui-tooltip-content ul {
  margin: 4px 0 4px 14px;
  padding: 0;
  font-size: 11px;
}
.ui-tooltip-content li {
  margin: 2px 0;
  word-break: break-all;
}
.ui-tooltip-content hr {
  border: none;
  border-top: 1px solid var(--c-border);
  margin: 6px 0;
}
/* Close button in titlebar */
.ui-tooltip-titlebar .ui-state-default {
  background: rgba(255, 255, 255, 0.2) !important;
  border-color: transparent !important;
}
.ui-tooltip-titlebar .ui-state-hover {
  background: rgba(255, 255, 255, 0.35) !important;
}

/* Mediainfo / video-info tooltip — compact, appears above icon */
.ui-tooltip-mediainfo {
  max-width: 260px !important;
  width: 260px !important;
}
.ui-tooltip-mediainfo .ui-tooltip-content {
  padding: 4px 8px !important;
}
.ui-tooltip-mediainfo .ui-tooltip-content table {
  width: 100%;
  border-collapse: collapse;
}
.ui-tooltip-mediainfo .ui-tooltip-content td,
.ui-tooltip-mediainfo .ui-tooltip-content th {
  font-size: 11px !important;
  padding: 2px 4px !important;
  line-height: 1.4 !important;
  word-break: break-word;
  vertical-align: top;
}
.ui-tooltip-mediainfo .ui-tooltip-content th {
  color: var(--c-muted);
  font-weight: 600;
}
.ui-tooltip-mediainfo .ui-tooltip-content td {
  color: var(--c-body);
}

/* Search tips popup */
.ui-tooltip-search {
  max-width: 360px !important;
  border-color: var(--c-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.14) !important;
}
.ui-tooltip-search .ui-tooltip-content {
  background: var(--c-surface) !important;
  border-color: var(--c-border) !important;
  color: var(--c-body) !important;
  font-size: 12px !important;
  line-height: 1.7 !important;
  padding: 12px 14px !important;
  border-radius: 8px !important;
}
.ui-tooltip-search .ui-tooltip-content b {
  color: var(--c-primary) !important;
  font-weight: 600;
  display: block;
  margin-bottom: 4px;
}
.ui-tooltip-search .ui-tooltip-content b + b {
  margin-top: 8px;
  border-top: 1px solid var(--c-border);
  padding-top: 8px;
}

/* ── Top Downloads table (browse10) ── */
.td-section {
  width: 74%;
  margin: 10px auto 12px;
  text-align: center;
}
.td-heading {
  font-size: 14px !important;
  font-weight: 700;
  color: var(--c-body);
  margin: 0 0 6px !important;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.td-heading .td-period {
  font-size: 11px;
  font-weight: 400;
  color: var(--c-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.td-fire-icon {
  color: #ea580c;
  font-size: 14px;
}
/* Use ID selector to beat legacy table.data styles */
#topdownloadstable {
  width: 100%;
  table-layout: fixed;
  margin: 0;
  border-collapse: collapse;
  font-variant-numeric: tabular-nums;
  background: var(--c-surface);
  border-radius: var(--r-md);
  overflow: hidden;
  box-shadow: var(--sh-sm);
}
#topdownloadstable td,
#topdownloadstable th {
  font-family: inherit;
  font-size: 11px;
  font-weight: 500;
  line-height: 21px;
  color: var(--c-body);
  padding: 3px 5px;
  border: 1px solid var(--c-border);
  vertical-align: middle;
  white-space: nowrap;
  text-align: center;
}
#topdownloadstable td:first-child,
#topdownloadstable th:first-child {
  text-align: left;
}
#topdownloadstable th:nth-child(2) {
  width: 7%;
}
#topdownloadstable th:nth-child(3) {
  width: 9%;
}
#topdownloadstable th:nth-child(4) {
  width: 7%;
}
#topdownloadstable th:nth-child(5) {
  width: 65px;
}
#topdownloadstable th {
  font-weight: 600;
  color: var(--c-primary);
  background: rgba(37, 99, 235, 0.07);
  border-bottom: 2px solid var(--c-primary);
  text-transform: none;
  letter-spacing: normal;
}
#topdownloadstable a.title {
  color: var(--c-body);
  text-decoration: none;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
#topdownloadstable a.title:hover {
  color: var(--c-primary);
}
#topdownloadstable tr:hover td {
  background: var(--c-subnav);
}
.site-ad {
  text-align: center;
  margin: 8px 0;
}

/* ── Search page ── */
.sr-header {
  position: relative;
  text-align: center;
  padding: 4px 0 10px;
}
.sr-perpage-wrap {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 500;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  padding: 4px 10px;
  background: var(--c-surface);
}
.sr-perpage-wrap form {
  display: contents;
}
.sr-perpage-label {
  color: var(--c-muted);
}
.sr-perpage-select {
  font-size: 11px;
  padding: 2px 4px;
  border: 1px solid var(--c-border);
  border-radius: 4px;
  background: var(--c-surface);
  color: var(--c-body);
}
.sr-form-wrap {
  margin-bottom: 10px;
}
.sr-input-row {
  display: flex;
  align-items: center;
  gap: 6px;
  justify-content: center;
  flex-wrap: wrap;
}
.sphinxsearchdiv.sr-input-group {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.sqlsearchdiv.sr-input-group {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: center;
}
.sr-flex-inputs {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: center;
}
.sr-flex-inputs select {
  font-size: 11px;
  color: var(--c-body);
  background: var(--c-subnav);
  border: 1px solid var(--c-border);
  border-radius: 5px;
  padding: 2px 8px;
  width: auto !important;
}
.sr-kw-input {
  min-width: 260px;
  width: 260px;
}
.sr-search-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}
.sr-toggle-row {
  display: flex;
  justify-content: center;
  margin-top: 6px;
}
.sr-toggle-btn {
  font-size: 11px;
  background: none;
  border: 1px solid var(--c-border);
  border-radius: 4px;
  padding: 2px 10px;
  cursor: pointer;
  color: var(--c-primary);
  font-weight: 500;
}
.sr-toggle-btn:hover {
  background: var(--c-subnav);
}

#browsetable {
  overflow: visible !important;
  border-collapse: collapse;
  table-layout: fixed;
}

/* Fallback widths using existing th classes — no br-col-* needed.
   Lower specificity (no ID) so overridden by #browsetable th.br-col-* once Smarty cache clears. */
table.data.icons th.mid.br-th {
  width: 8%;
} /* 7 cols × 8% = 56% */
table.data.icons th.mid:not(.br-th) {
  width: 3%;
} /* checkbox = 3%; Name gets remaining 41% */

/* Final widths once br-col-* classes compile (higher specificity via #id — wins over fallback) */
.br-table {
  table-layout: fixed;
}
#browsetable th.br-col-cat {
  width: 8%;
}
#browsetable th.br-col-info {
  width: 10%;
}
#browsetable th.br-col-posted {
  width: 6%;
}
#browsetable th.br-col-size {
  width: 8%;
}
#browsetable th.br-col-hits {
  width: 6%;
}
#browsetable th.br-col-cmts {
  width: 5%;
}
#browsetable th.br-col-links {
  width: 8%;
}
#browsetable th.br-col-chk {
  width: 3%;
}
#browsetable th.br-col-admin {
  width: 3%;
}
#browsetable a.title {
  color: var(--c-body);
  text-decoration: none;
  font-weight: 500;
  font-size: 12px;
}
#browsetable a.title:hover {
  color: var(--c-primary);
}
#browsetable tr:hover td {
  background: var(--c-subnav) !important;
}
#browsetable td {
  vertical-align: middle;
  padding: 3px 4px;
  font-size: 11px;
  font-weight: 500;
  line-height: 21px;
  border: 1px solid var(--c-border);
  white-space: nowrap;
  overflow: hidden;
}
#browsetable td.item {
  white-space: normal;
  text-align: left;
  overflow: visible;
}
.br-name-wrap {
  display: flex;
  align-items: center;
  gap: 5px;
}
.br-name-wrap > label {
  flex: 1;
  min-width: 0;
  overflow: hidden;
}
.br-name-wrap > label a.title {
  display: block;
}
/* Title truncation — browse10 only */
.br-trunc .br-name-wrap > label a.title,
.br-trunc .br-name-wrap > a.title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.br-trunc .br-name-wrap > a.title {
  display: block;
  min-width: 0;
}
.br-name-wrap > .br-lock-icon,
.br-name-wrap > .br-nuke-icon {
  flex-shrink: 0;
}
#browsetable td.br-cat-cell {
  text-align: center;
}
#browsetable td.br-info-cell {
  overflow: visible;
}
#browsetable td.less {
  padding: 4px 5px;
}
#browsetable th {
  padding: 3px 6px;
  font-size: 11px;
  line-height: 21px;
  font-weight: 600;
  text-transform: none;
  letter-spacing: normal;
  color: var(--c-primary);
  border: 1px solid var(--c-border);
}
/* header row — browsers auto-wrap flat <tr> in <tbody> */
#browsetable > tbody > tr:first-child > th {
  background: rgba(37, 99, 235, 0.07);
  border-bottom: 2px solid var(--c-primary);
}

/* Action icon divs — replace sprite images with Font Awesome */
div.icon {
  width: 16px;
  height: 16px;
  background-image: none !important;
  border-radius: 3px;
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.12s;
  position: relative;
}
table.data td.icons div.icon {
  opacity: 1 !important;
}
div.icon:hover {
  background: var(--c-subnav);
}
div.icon_nzb > a {
  display: block;
  position: absolute;
  inset: 0;
  z-index: 1;
  font-size: 0;
}
div.icon_nzb::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f019";
  color: #4db5ff;
  font-size: 12px;
}
div.icon.icon_nzb.tick_icon::before {
  content: "\f019";
  color: var(--c-success) !important;
}
div.icon_sab_clicked::before,
div.icon_nzbget_clicked::before,
div.icon_nzbvortex_clicked::before {
  color: var(--c-success) !important;
}
[data-theme="dark"] div.icon_cart_clicked::before,
[data-theme="dark"] div.icon_sab_clicked::before,
[data-theme="dark"] div.icon_nzbget_clicked::before,
[data-theme="dark"] div.icon_nzbvortex_clicked::before {
  color: var(--c-success) !important;
}
div.icon_cart {
  cursor: pointer;
}
div.icon_cart::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f07a";
  color: #4db5ff;
  font-size: 12px;
}
div.icon_cart_clicked::before {
  color: var(--c-success) !important;
}
div.icon_sab::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f362";
  color: #4db5ff;
  font-size: 12px;
}
div.icon_nzbget::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f0ee";
  font-size: 12px;
}
/* td.icons: keep as table-cell (no display:flex — it breaks td border rendering) */
table.data td.icons {
  width: auto !important;
  padding: 4px 6px;
  vertical-align: middle;
  white-space: nowrap;
}

/* New NZB rows highlight */
tr.new-nzb td {
  background: rgba(22, 199, 132, 0.06) !important;
}
tr.new-nzb:hover td {
  background: rgba(22, 199, 132, 0.12) !important;
}

/* ── Pager ── */
div.pager {
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 3px;
}
div.pager a,
div.pager span {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 28px;
  padding: 0 8px;
  border-radius: 5px !important;
  border: 1px solid var(--c-border) !important;
  background: var(--c-surface) !important;
  color: var(--c-secondary) !important;
  font-size: 12px;
  font-weight: 500;
  text-decoration: none;
  transition:
    background 0.12s,
    color 0.12s,
    border-color 0.12s;
}
div.pager a:hover {
  background: rgba(37, 99, 235, 0.08) !important;
  color: var(--c-primary) !important;
  border-color: var(--c-primary) !important;
}
div.pager .current {
  background: var(--c-primary) !important;
  color: #fff !important;
  border-color: var(--c-primary) !important;
  font-weight: 700 !important;
}
div.pager input#txtjumptopage {
  height: 28px;
  padding: 0 6px;
  border-radius: 5px;
  border: 1px solid var(--c-border);
  background: var(--c-surface);
  color: var(--c-body);
  font-size: 12px;
  width: 50px;
  text-align: center;
  outline: none;
  transition: border-color 0.12s;
}
div.pager input#txtjumptopage:focus {
  border-color: var(--c-primary);
}

/* Pager + multi-ops row */
#browse-row-form {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 4px;
  margin-bottom: 0;
  padding: 10px 0;
}
.browse-row-form {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 8px;
}
.pager-opt-width {
  flex: 1;
  min-width: 0;
}
.selected-opt-width {
  flex-shrink: 0;
}
.nzb_multi_operations--wrapper {
  margin-top: 10px;
}
.nzb_multi_operations {
  display: flex;
  align-items: center;
  gap: 3px;
  flex-wrap: wrap;
  justify-content: flex-end;
  flex: 1;
  margin-top: 10px;
  margin-bottom: 8px;
}
.nzb_multi_operations small {
  color: var(--c-muted);
  font-size: 11px;
  margin-right: 2px;
}

/* Filter box (Top Downloads dropdown) */
.br-filter-box {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  color: var(--c-secondary);
  background: var(--c-subnav);
  border: 1px solid var(--c-border);
  border-radius: 5px;
  padding: 2px 8px;
}
.br-filter-box label,
.br-filter-box span {
  color: var(--c-muted);
  white-space: nowrap;
}
.br-filter-box select {
  border: 1px solid var(--c-border);
  border-radius: 3px;
  padding: 4px 3px;
  background: var(--c-surface);
  color: var(--c-body);
}
.br-filter-box form {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
input[type="submit"].br-clear-new-btn {
  appearance: none;
  display: inline-block;
  padding: 2px 7px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  color: #fff;
  background: var(--c-primary);
  border: 1px solid var(--c-primary);
  cursor: pointer;
  transition: background 0.12s, color 0.12s, border-color 0.12s;
  line-height: 1.6;
}
div.nzb_multi_operations input[type="submit"],
div.nzb_multi_operations input[type="button"] {
  padding: 2px 8px !important;
  font-size: 11px !important;
  border-radius: 4px !important;
}
/* High-specificity overrides to beat legacy div.nzb_multi_operations .class gradient rules */
div.nzb_multi_operations input.nzb_multi_operations_download,
div.nzb_multi_operations input.nzb_multi_operations_download:hover {
  background: var(--c-success) !important;
  color: #fff !important;
  border: none !important;
}
div.nzb_multi_operations input.nzb_multi_operations_cart,
div.nzb_multi_operations input.nzb_multi_operations_cart:hover {
  background: var(--c-primary) !important;
  color: #fff !important;
  border: none !important;
}
div.nzb_multi_operations input.nzb_multi_operations_sab,
div.nzb_multi_operations input.nzb_multi_operations_sab:hover,
div.nzb_multi_operations input.nzb_multi_operations_nzbget,
div.nzb_multi_operations input.nzb_multi_operations_nzbget:hover {
  background: #ee802f !important;
  color: #fff !important;
  border: none !important;
}
div.nzb_multi_operations input.nzb_multi_operations_report,
div.nzb_multi_operations input.nzb_multi_operations_report:hover {
  background: var(--c-primary) !important;
  color: #fff !important;
  border: none !important;
}
div.nzb_multi_operations input.nzb_multi_operations_edit,
div.nzb_multi_operations input.nzb_multi_operations_edit:hover {
  background: #b45309 !important;
  color: #fff !important;
  border: none !important;
}
div.nzb_multi_operations input.nzb_multi_operations_delete,
div.nzb_multi_operations input.nzb_multi_operations_delete:hover {
  background: var(--c-danger) !important;
  color: #fff !important;
  border: none !important;
}
div.nzb_multi_operations input.nzb_multi_operations_reprocess,
div.nzb_multi_operations input.nzb_multi_operations_reprocess:hover,
div.nzb_multi_operations input.nzb_multi_operations_rebuilt,
div.nzb_multi_operations input.nzb_multi_operations_rebuilt:hover {
  background: #64748b !important;
  color: #fff !important;
  border: none !important;
}

/* Nuke icon (nuked release indicator) */
.br-nuke-icon {
  color: var(--c-danger);
  font-size: 11px;
  margin-left: 3px;
  vertical-align: middle;
}

/* Browse All page header */
.ba-header {
  position: relative;
  display: block;
  text-align: left;
  padding: 4px 0 8px;
}
.ba-heading {
  font-size: 20px;
  font-weight: 700;
  margin: 0;
  display: inline-flex;
  align-items: center;
}
.ba-heading .br-rss-link {
  position: relative;
  top: -5px;
}
.ba-header-controls {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  gap: 12px;
}
.ba-top-dl-form {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.ba-top-dl-form label {
  font-size: 13px;
  color: var(--c-muted);
  white-space: nowrap;
  font-weight: 500;
}

/* Browse page footer info box */
.browse-final-box {
  margin-left: auto;
  width: fit-content;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  padding: 8px 14px;
  background: var(--c-subnav);
  font-size: 12px;
}
.browserow {
  display: flex;
  align-items: center;
  gap: 16px;
  justify-content: space-between;
  padding: 3px 0;
}
.browserow + .browserow {
  border-top: 1px solid var(--c-border);
}
.browserow label {
  color: var(--c-muted);
  white-space: nowrap;
  font-weight: 500;
  cursor: default;
  margin: 0;
}
.brsnums {
  display: flex;
  align-items: center;
  gap: 6px;
}
.brsnums font[color="green"] {
  color: var(--c-primary) !important;
  font-weight: 600;
  font-style: normal;
}
.brsrowlink {
  font-size: 11px;
  color: var(--c-muted) !important;
  text-decoration: none;
}
.brsrowlink:hover {
  color: var(--c-primary) !important;
}
.brsrowlink font {
  color: inherit !important;
}

/* Extra button color variants */
.btn-warning {
  background: #ee802f !important;
  color: #fff !important;
}
.btn-warning:hover {
  background: #92400e !important;
}
.btn-purple {
  background: #64748b !important;
  color: #fff !important;
}
.btn-purple:hover {
  background: #475569 !important;
}

@media (max-width: 1024px) {
  .prof-settings-grid {
    grid-template-columns: 1fr;
  }
  .prof-avatar-card {
    flex-direction: row;
    justify-content: flex-start;
  }
  .prof-options-grid {
    grid-template-columns: 1fr;
  }
  .prof-rss-options {
    grid-template-columns: 1fr;
  }
  .sf-inner {
    grid-template-columns: 1fr 1fr;
    gap: 24px 0;
  }
  .sf-brand {
    grid-column: 1 / -1;
    padding-right: 0;
  }
  .sf-col,
  .sf-trust {
    border-left: none;
    padding: 0;
    border-top: 1px solid var(--c-border);
    padding-top: 16px;
  }
  .sf-trust {
    grid-column: 1 / -1;
  }
}
@media (max-width: 600px) {
  .sf-inner {
    grid-template-columns: 1fr;
  }
  .sf-bottom-inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
  .prof-cs-form {
    grid-template-columns: 1fr;
  }
  .prof-cs-action {
    margin-top: 2px;
  }
}

/* ── Colorbox (jquery.colorbox-min.js v1.3.19) ── */
/* Overlay: JS creates it without position:fixed — CSS must provide it */
#cboxOverlay {
  position: fixed !important;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
  background: rgba(0, 0, 0, 0.62);
  z-index: 9000;
}
#colorbox {
  z-index: 9001;
  outline: none;
}
/* Zero out the 9-patch sprite border pieces so JS calculates padding=0 */
#cboxTopLeft,
#cboxTopRight,
#cboxBottomLeft,
#cboxBottomRight {
  width: 0 !important;
  height: 0 !important;
}
#cboxTopCenter,
#cboxBottomCenter {
  height: 0 !important;
}
#cboxMiddleLeft,
#cboxMiddleRight {
  width: 0 !important;
}
/* Wrapper: visual container with rounded corners */
#cboxWrapper {
  background: var(--c-surface);
  border-radius: 10px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  overflow: hidden;
}
/* Content: JS sizes this to innerWidth/innerHeight */
#cboxContent {
  position: relative;
  background: var(--c-surface) !important;
  overflow: hidden;
}
/* NFO pre */
#cboxLoadedContent pre {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  white-space: pre-wrap;
  margin: 0;
  padding: 10px 14px;
  color: var(--c-body);
}
/* Title bar — blue header at top */
#cboxTitle {
  position: absolute !important;
  top: 0;
  bottom: auto;
  left: 0;
  right: 0;
  z-index: 4;
  height: 38px;
  line-height: 38px;
  padding: 0 42px 0 14px;
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  background: var(--c-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#cboxCurrent {
  display: none !important;
}
#cboxLoadedContent {
  overflow: auto !important;
  margin-top: 38px !important;
  height: auto !important;
}
/* Close button — top-right inside the blue header */
#cboxClose {
  position: absolute !important;
  top: 5px !important;
  right: 6px !important;
  bottom: auto !important;
  width: 28px !important;
  height: 28px !important;
  font-size: 0;
  cursor: pointer;
  z-index: 5;
  border-radius: 5px;
  transition: background 0.12s;
}
#cboxClose::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f00d";
  font-size: 14px;
  color: rgba(255, 255, 255, 0.8);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
}
#cboxClose:hover {
  background: rgba(255, 255, 255, 0.15);
}
#cboxClose:hover::before {
  color: #fff;
}
/* Prev / Next navigation — hidden, not used on these modals */
#cboxPrevious,
#cboxNext {
  display: none !important;
}

/* ── Console modal (viewconsole.tpl loaded in colorbox) ── */
/* ── Console/Game modal (viewconsole.tpl loaded in colorbox) ── */
#consoleinfo {
  padding: 0;
  color: var(--c-body);
  font-size: 13px;
  background-image: linear-gradient(rgba(243, 246, 251, 0.88), rgba(243, 246, 251, 0.88)), var(--cv-bg, none);
  background-size: cover;
  background-position: center;
}
body[data-theme="dark"] #consoleinfo {
  background-image: linear-gradient(rgba(13, 18, 28, 0.88), rgba(13, 18, 28, 0.88)), var(--cv-bg, none);
}
.cv-wrap {
  padding: 14px;
}
.cv-body {
  display: flex;
  gap: 18px;
  align-items: flex-start;
}
.cv-left {
  flex-shrink: 0;
  width: 220px;
}
.cv-shot-img {
  /* width: 100%; */
  max-width: 100%;
  display: block;
  border-radius: 6px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18);
}
.cv-right {
  flex: 1;
  min-width: 0;
  overflow: hidden;
}
.cv-title {
  font-size: 17px;
  font-weight: 700;
  color: var(--c-body);
  margin: 0 0 5px;
  line-height: 1.3;
}
.cv-year {
  font-weight: 400;
  color: var(--c-secondary);
}
.cv-genre {
  font-size: 12px;
  color: var(--c-secondary);
  margin: 0 0 8px;
}
.cv-ratings {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
}
.cv-badge {
  display: inline-block;
  padding: 2px 8px;
  background: var(--c-primary);
  color: #fff;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
}
.cv-votes {
  font-size: 11px;
  color: var(--c-secondary);
}
.cv-section {
  margin: 0 0 10px;
}
.cv-label {
  display: block;
  font-size: 10px;
  font-weight: 600;
  color: var(--c-secondary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 3px;
}
.cv-section .more {
  font-size: 12px;
  line-height: 1.55;
}
.cv-details {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 18px;
  margin: 6px 0 10px;
  font-size: 12px;
  color: var(--c-body);
}
.cv-details strong {
  color: var(--c-secondary);
  font-weight: 600;
}
.cv-bottom-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 8px;
  flex-wrap: wrap;
}
.cv-bottom-row .cv-ratings {
  margin: 0;
}
.cv-links {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.cv-btn {
  display: inline-flex;
  align-items: center;
  padding: 5px 14px;
  font-size: 12px;
  font-weight: 500;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  text-decoration: none !important;
  color: var(--c-body) !important;
  transition:
    background 0.12s,
    border-color 0.12s;
}
.cv-btn:hover {
  background: var(--c-surface-2);
}
.cv-btn-primary {
  background: var(--c-primary) !important;
  border-color: var(--c-primary) !important;
  color: #fff !important;
}
.cv-btn-primary:hover {
  background: var(--c-primary-hov) !important;
  border-color: var(--c-primary-hov) !important;
}
span.more {
  color: var(--c-body) !important;
}

/* ── Movie modal (viewmovie.tpl loaded in colorbox) ── */
#movieinfo {
  padding: 0;
  color: var(--c-body);
  font-size: 13px;
  background-image: linear-gradient(rgba(243, 246, 251, 0.88), rgba(243, 246, 251, 0.88)), var(--mv-bg, none);
  background-size: cover;
  background-position: center;
}
body[data-theme="dark"] #movieinfo {
  background-image: linear-gradient(rgba(13, 18, 28, 0.88), rgba(13, 18, 28, 0.88)), var(--mv-bg, none);
}
.mv-wrap {
  padding: 16px;
}
#movieinfo .mv-layout {
  display: flex;
  gap: 18px;
  align-items: flex-start;
}
#movieinfo .mv-cover {
  flex-shrink: 0;
  width: 150px;
}
#movieinfo .mv-cover-img {
  width: 100%;
  display: block;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}
#movieinfo .mv-body {
  flex: 1;
  overflow: hidden;
}
#movieinfo .mv-title {
  font-size: 17px;
  font-weight: 700;
  color: var(--c-body);
  margin: 0 0 6px;
  line-height: 1.3;
  display: flex;
  align-items: center;
  gap: 10px !important;
}
#movieinfo .mv-year {
  font-size: 14px;
  font-weight: 400;
  color: var(--c-muted);
}
#movieinfo .mv-meta {
  font-size: 12px;
  color: var(--c-muted);
  margin: 0 0 10px;
}
#movieinfo .mv-sep {
  margin: 0 5px;
}
#movieinfo .mv-ratings {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 10px;
}
#movieinfo .mv-badge {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 4px;
  background: transparent;
  border: 1px solid;
  white-space: nowrap;
}
#movieinfo .mv-badge-imdb {
  color: #e6a817;
  border-color: #e6a817;
}
#movieinfo .mv-badge-rt {
  color: #fa4032;
  border-color: #fa4032;
}
#movieinfo .mv-badge-mc {
  color: #66cc33;
  border-color: #66cc33;
}
#movieinfo .mv-badge-tmdb {
  color: #01b4e4;
  border-color: #01b4e4;
}
.mv-tomato {
  font-size: 12px;
  line-height: 1;
}
#movieinfo .mv-badge small {
  font-weight: 400;
  opacity: 0.8;
  font-size: 10px;
}
#movieinfo .mv-tagline {
  font-size: 12px;
  font-style: italic;
  color: var(--c-muted);
  margin: 0 0 8px;
}
#movieinfo .mv-plot {
  font-size: 12px;
  color: var(--c-body);
  line-height: 1.6;
  margin: 0 0 10px;
}
#movieinfo .mv-detail {
  font-size: 12px;
  color: var(--c-body);
  line-height: 1.5;
  margin: 0 0 10px;
}
#movieinfo .mv-detail strong {
  color: var(--c-secondary);
  font-weight: 600;
}
#movieinfo .mv-bottom-row {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 10px;
}
#movieinfo .mv-bottom-row .mv-ratings {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
}
#movieinfo .mv-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
/* TV popup overrides */
#movieinfo.tv-popup .mv-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}
#movieinfo.tv-popup .mv-title-row .mv-title {
  margin-bottom: 0;
  flex: 1;
}
#movieinfo.tv-popup .mvm-rating-top {
  flex-shrink: 0;
  margin-top: 2px;
}
#movieinfo.tv-popup .mv-info-grid {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 8px 0 10px;
}
#movieinfo.tv-popup .mv-info-row {
  display: flex;
  align-items: baseline;
  gap: 6px;
  font-size: 13px;
}
#movieinfo.tv-popup .mv-info-label {
  font-weight: 600;
  color: var(--c-secondary, #6b7280);
  min-width: 46px;
  flex-shrink: 0;
}
#movieinfo.tv-popup .mv-info-val {
  flex: 1;
}
#movieinfo.tv-popup .mv-info-net {
  font-size: 12px;
  color: var(--c-secondary, #6b7280);
  flex-shrink: 0;
}
#movieinfo.tv-popup .mv-bottom-row {
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
}
#movieinfo.tv-popup .mv-links {
  justify-content: flex-end;
}
#coverstable {
  margin-top: 8px;
  margin-bottom: 8px;
  border-collapse: collapse;
}
#coverstable td,
#coverstable th {
  border: 1px solid var(--c-border, #d1d5db);
}
#movieinfo .mv-btn {
  display: inline-flex;
  align-items: center;
  padding: 5px 12px;
  font-size: 12px;
  font-weight: 500;
  border-radius: 6px;
  text-decoration: none !important;
  border: 1px solid var(--c-border);
  background: var(--c-bg);
  color: var(--c-body) !important;
  transition:
    background 0.12s,
    border-color 0.12s;
}
#movieinfo .mv-btn:hover {
  background: var(--c-surface);
  border-color: var(--c-primary);
  color: var(--c-primary) !important;
}
#movieinfo .mv-btn-primary {
  background: var(--c-primary);
  border-color: var(--c-primary);
  color: #fff !important;
}
#movieinfo .mv-btn-primary:hover {
  background: var(--c-primary-hov);
  border-color: var(--c-primary-hov);
  color: #fff !important;
}

/* ── Music modal (viewmusic.tpl loaded in colorbox) ── */
#musicinfo {
  padding: 0;
  color: var(--c-body);
  font-size: 13px;
}
.mu-wrap {
  padding: 16px;
}
.mu-layout {
  display: flex;
  gap: 18px;
  align-items: flex-start;
}
.mu-cover {
  flex-shrink: 0;
  width: 160px;
}
.mu-cover-img {
  width: 100%;
  display: block;
  border-radius: 8px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.18);
}
.mu-body {
  flex: 1;
  min-width: 0;
  overflow: hidden;
}
.mu-title {
  font-size: 17px;
  font-weight: 700;
  color: var(--c-body);
  margin: 0 0 4px;
  line-height: 1.3;
}
.mu-year {
  font-size: 14px;
  font-weight: 400;
  color: var(--c-secondary);
}
.mu-artist {
  font-size: 13px;
  font-weight: 600;
  color: var(--c-primary);
  margin: 0 0 4px;
}
.mu-genre {
  font-size: 12px;
  color: var(--c-secondary);
  margin: 0 0 10px;
}
.mu-details {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 18px;
  font-size: 12px;
  color: var(--c-body);
  margin: 0 0 12px;
}
.mu-details strong {
  color: var(--c-secondary);
  font-weight: 600;
}
.mu-details .fa {
  color: var(--c-secondary);
  width: 14px;
  text-align: center;
}
.mu-section {
  margin: 0 0 10px;
}
.mu-label {
  display: block;
  font-size: 10px;
  font-weight: 600;
  color: var(--c-secondary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 5px;
}
.mu-tracklist {
  margin: 0;
  padding-left: 18px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2px 16px;
}
.mu-tracklist li {
  font-size: 12px;
  color: var(--c-body);
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mu-review {
  font-size: 12px;
  color: var(--c-body);
  line-height: 1.6;
  margin: 0;
}

/* ── Edit Release popup ── */
.edit-release-form {
  padding: 12px 16px 4px;
}
.erf-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.erf-row label {
  width: 86px;
  flex-shrink: 0;
  font-size: 12px;
  font-weight: 600;
  color: var(--c-body);
  text-align: right;
}
.erf-row select,
.erf-row input[type="text"],
.erf-row input[type="password"] {
  flex: 1;
  padding: 5px 8px;
  border: 1px solid var(--c-border, #d1d5db);
  border-radius: 5px;
  font-size: 12px;
  background: var(--c-surface, #fff);
  color: var(--c-body);
  min-width: 0;
}
.erf-row select:focus,
.erf-row input:focus {
  outline: none;
  border-color: var(--c-primary, #2563eb);
}
.erf-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 12px;
  padding-bottom: 4px;
}
.erf-save-btn {
  padding: 7px 20px;
  background: var(--c-primary, #2563eb);
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
}
.erf-save-btn:hover {
  opacity: 0.88;
}
.erf-success {
  padding: 20px 16px;
  color: #065f46;
  background: #d1fae5;
  border-radius: 6px;
  margin: 12px;
  font-size: 13px;
  font-weight: 500;
}
body[data-theme="dark"] .erf-success {
  background: #064e3b;
  color: #6ee7b7;
}

/* ── Details page (viewnzb) ── */

/* Strip the browse-grid table treatment — details is a definition list */
/* ── Nested innerdata tables — wrapper owns card styling, table.data does the rest ── */
.innerdata-td {
  padding: 0 !important;
  background: transparent !important;
}
.innerdata-wrap {
  border-radius: var(--r-md);
  overflow: hidden;
  box-shadow: var(--sh-sm);
  border: 1px solid var(--c-border);
}
table.innerdata {
  border-radius: 0 !important;
  overflow: visible !important;
  box-shadow: none !important;
}
table.innerdata th {
  padding: 3px 6px !important;
  font-size: 11px !important;
  line-height: 21px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  color: var(--c-primary) !important;
  border: 1px solid var(--c-border) !important;
  text-align: left !important;
  width: auto !important;
  min-width: unset !important;
  max-width: unset !important;
  background: rgba(37, 99, 235, 0.07) !important;
  border-bottom: 2px solid var(--c-primary) !important;
}

#detailstable {
  box-shadow: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: none !important;
  overflow: visible !important;
}

/* Label column — matches profile page label style */
#detailstable > tbody > tr > th,
#detailstable > tr > th {
  width: 130px !important;
  min-width: 110px !important;
  max-width: 150px !important;
  text-align: right !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: capitalize !important;
  color: var(--c-secondary, #475569) !important;
  background: var(--c-surface) !important;
  vertical-align: top !important;
  padding: 7px 12px 7px 10px !important;
  white-space: nowrap !important;
  border-right: 1px solid var(--c-border) !important;
  border-bottom: 1px solid var(--c-border) !important;
}
[data-theme="dark"] #detailstable > tbody > tr > th,
[data-theme="dark"] #detailstable > tr > th {
  background: var(--c-surface) !important;
  color: var(--c-muted) !important;
}

/* Value column — direct children only, does not cascade into nested tables */
#detailstable > tbody > tr > td,
#detailstable > tr > td {
  background: var(--c-surface) !important;
  padding: 3px 4px !important;
  font-size: 13px !important;
  color: var(--c-body) !important;
  vertical-align: top !important;
  word-break: break-word !important;
  border-bottom: 1px solid var(--c-border) !important;
  vertical-align: middle !important;
}
.movie-info-col a { color: var(--c-link) !important; }
.movie-info-col a:hover { color: var(--c-link-hov) !important; }
.det-link { color: var(--c-link) !important; }
.det-link:hover { color: var(--c-link-hov) !important; }

/* No hover highlight — definition table, not a clickable grid */
#detailstable > tbody > tr:hover > th,
#detailstable > tbody > tr:hover > td:not(.innerdata-td),
#detailstable > tr:hover > th,
#detailstable > tr:hover > td:not(.innerdata-td),
#filestable tr:hover td,
#tabs-8 #browsetable tr:hover td {
  background-color: var(--c-surface) !important;
}

/* Kill hover on data cells in nested tables inside detailstable */
#detailstable table tr:hover > td {
  background-color: initial !important;
}

/* Release name text */
#detailstable td font[size] {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--c-body) !important;
  line-height: 1.4 !important;
}

/* Images inside the table td */
#detailstable td img {
  border-radius: 6px;
  vertical-align: top;
  max-width: 100%;
}

/* Download buttons row — flexbox for reliable side-by-side layout */
.btn-downloads {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  align-items: center !important;
  padding: 4px 0 !important;
  vertical-align: middle !important;
}
.btn-downloads .icon {
  display: contents !important; /* transparent wrapper — child <a> becomes the flex item */
}
.btn-downloads .btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 5px 11px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--c-primary) !important;
  background: transparent !important;
  border-radius: 5px !important;
  border: 1.5px solid var(--c-primary) !important;
  text-decoration: none !important;
  cursor: pointer !important;
  margin: 0 !important;
  transition:
    background 0.15s,
    color 0.15s !important;
  letter-spacing: 0 !important;
  line-height: 1.4 !important;
}
.btn-downloads .btn:hover {
  background: var(--c-primary) !important;
  color: #fff !important;
}

/* FA6 icons for download buttons — same characters as browse page icons */
.btn-downloads .icon_nzb1 > a::before,
.btn-downloads .icon_nzb1 > a:before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f019";
}
.btn-downloads .icon_cart_div > a::before,
.btn-downloads .icon_cart_div > a:before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f07a";
}
.btn-downloads .icon_sab_div > a::before,
.btn-downloads .icon_sab_div > a:before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f362";
}
.btn-downloads .icon_nzbgetbig_div > a::before,
.btn-downloads .icon_nzbgetbig_div > a:before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f0ee";
}

/* Comment info icon — FA6 circle-info (\f05a) via CSS, not FA4 kit */
.nzb-info-icon {
  display: inline-block;
  cursor: pointer;
  vertical-align: middle;
  margin-left: 5px;
  font-style: normal;
}
.nzb-info-icon::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f05a";
  color: var(--c-primary, #0070ff);
  font-size: 15px;
}

/* Report NZB submit buttons (inline form, not the popup) */
.cnfvalidatenxb .report-btn {
  display: inline-block !important;
  width: auto !important;
  padding: 5px 12px !important;
  font-size: 12px !important;
  border-radius: 5px !important;
  cursor: pointer !important;
  font-weight: 500 !important;
  border: none !important;
  margin: 0 4px 0px 0 !important;
}

/* NFO tab — theme-aware monospace block */
#nfo {
  font-family: "Courier New", Courier, monospace;
  font-size: 12px;
  line-height: 1.55;
  white-space: pre;
  overflow-x: auto;
  overflow-y: auto;
  padding: 18px 20px;
  background: #f8fafc;
  color: #1e293b;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  margin: 0;
  max-height: 580px;
}
body[data-theme="dark"] #nfo {
  background: #0f172a;
  color: #cbd5e1;
  border-color: #334155;
}

/* descfull hidden by default; shown when more... is clicked */
span.descfull {
  display: none;
}

/* span.more — fix hardcoded #222 color for dark mode */
#detailstable span.more,
#detailstable .descinitial,
#detailstable .descfull {
  color: var(--c-body) !important;
}
#detailstable td span.more {
  display: block;
  margin-bottom: 5px;
}

/* ── Images row: movie poster left, backdrop right ── */
.images-movie-row {
  display: flex;
  gap: 12px;
  padding-left: 10px;
  align-items: center;
}
.images-movie-row .img-poster {
  height: 260px;
  width: auto;
  border-radius: 6px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18);
  display: block;
}
.images-movie-row .backdrop-wrap {
  display: flex;
}
.images-movie-row .img-backdrop {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 500px !important;
  height: 260px;
  min-height: 260px;
  max-height: 260px;
  object-fit: contain;
  border-radius: 6px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18);
  display: block;
}
.images-movie-row .backdrop-wrap:only-child {
  flex: 1;
}
.images-movie-row .backdrop-wrap:only-child .img-backdrop {
  width: 100%;
  min-width: unset;
  max-width: 100%;
}

/* ── Images row: TV banner / cover + episode screenshot ── */
.images-tv-row {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  flex-wrap: wrap;
}
.img-tv-banner {
  width: 700px;
  height: 130px;
  object-fit: cover;
  border-radius: 6px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18);
  display: block;
  max-width: 100%;
}
.img-tv-poster {
  height: 200px;
  width: auto;
  border-radius: 6px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18);
  display: block;
}
.img-tv-screenshot {
  height: 200px;
  width: auto;
  max-width: 100%;
  border-radius: 6px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18);
  display: block;
}

/* 0day alert banner */
#alert_beta {
  background: #fef2f2;
  border: 1px solid #fca5a5;
  color: #991b1b;
  border-radius: 8px;
  padding: 10px 16px;
  font-size: 13px;
  margin-bottom: 16px;
}
body[data-theme="dark"] #alert_beta {
  background: #450a0a;
  border-color: #7f1d1d;
  color: #fca5a5;
}
#alert_beta .close {
  float: right;
  background: none;
  border: none;
  font-size: 16px;
  cursor: pointer;
  color: inherit;
}

/* Footer hint */
#tabs-1 .hint {
  text-align: center;
  padding: 5px 0;
  font-size: 12px;
  color: var(--c-muted);
}

/* ── Report NZB popup ── */
.report-actions-wrapper {
  padding: 14px 16px 16px;
  font-size: 13px;
}
.report-actions-wrapper > .report-label {
  font-weight: 600;
  margin-bottom: 10px;
  color: var(--c-body);
}
.report-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.report-btn {
  display: block;
  width: 100%;
  padding: 10px 12px;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 500;
  text-align: center;
  transition: opacity 0.15s;
}
.report-btn:hover {
  opacity: 0.85;
}
.report-btn.password {
  background: #fee2e2;
  color: #991b1b;
}
.report-btn.wrongcat {
  background: #fef3c7;
  color: #92400e;
}
.report-btn.wronginfo {
  background: #dbeafe;
  color: #1e40af;
}
.report-btn.other {
  background: #f3f4f6;
  color: #374151;
}
body[data-theme="dark"] .report-btn.password {
  background: #450a0a;
  color: #fca5a5;
}
body[data-theme="dark"] .report-btn.wrongcat {
  background: #451a03;
  color: #fde68a;
}
body[data-theme="dark"] .report-btn.wronginfo {
  background: #1e3a5f;
  color: #93c5fd;
}
body[data-theme="dark"] .report-btn.other {
  background: #1f2937;
  color: #d1d5db;
}
.report-reason-wrapper {
  margin-top: 12px;
}
.report-reason-wrapper label {
  display: block;
  margin-bottom: 6px;
  font-weight: 600;
  font-size: 12px;
  color: var(--c-body);
}
.report-reason-wrapper textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 7px 9px;
  border: 1px solid var(--c-border, #d1d5db);
  border-radius: 6px;
  font-size: 12px;
  resize: vertical;
  background: var(--c-surface, #fff);
  color: var(--c-body);
  min-height: 70px;
}
.report-reason-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  margin-top: 8px;
}
.report-btn.cancel-btn {
  background: #f3f4f6;
  color: #374151;
  width: auto;
  padding: 7px 16px;
}
.report-btn.confirm-btn {
  background: var(--c-primary, #2563eb);
  color: #fff;
  width: auto;
  padding: 7px 16px;
}
body[data-theme="dark"] .report-btn.cancel-btn {
  background: #1f2937;
  color: #d1d5db;
}
#bulk-report-message h4 {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--c-body);
}
#bulk-report-message ul {
  list-style: none;
  padding: 0;
  margin: 0;
  max-height: 160px;
  overflow-y: auto;
}
#bulk-report-message li {
  padding: 4px 8px;
  border-radius: 4px;
  margin-bottom: 4px;
  font-size: 12px;
}
#bulk-report-message li.success {
  background: #d1fae5;
  color: #065f46;
}
#bulk-report-message li.warning {
  background: #fef3c7;
  color: #92400e;
}
#bulk-report-message li.error {
  background: #fee2e2;
  color: #991b1b;
}
body[data-theme="dark"] #bulk-report-message li.success {
  background: #064e3b;
  color: #6ee7b7;
}
body[data-theme="dark"] #bulk-report-message li.warning {
  background: #451a03;
  color: #fde68a;
}
body[data-theme="dark"] #bulk-report-message li.error {
  background: #450a0a;
  color: #fca5a5;
}

/* ══════════════════════════════════════════════════════════════
   ── viewnzb: styles moved from inline <style> block in tpl ──
   ══════════════════════════════════════════════════════════════ */

/* ── Movie info 2-col grid ── */
.movie-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px 24px;
  margin: 8px 0;
}
.movie-info-col {
  line-height: 1.8;
}

/* ── TV info: grid left, buttons right ── */
.tvinfo-meta-wrap {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-top: 8px;
  margin-bottom: 5px;
  margin-right: 10px;
  gap: 16px;
}
.tvinfo-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px 24px;
  flex: 1;
}
.tvinfo-info-col {
  line-height: 1.8;
}
.tvinfo-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: flex-end;
  flex-shrink: 0;
}

/* ── Movie info ratings + link buttons ── */
.rss-link-icon {
  color: #f26522;
  font-size: 14px;
  margin-left: 8px;
  vertical-align: middle;
}
.movie-meta-wrap {
  margin-top: 14px;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 5px;
  margin-right: 10px;
}

.movie-ratings {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.rating-badge {
  display: inline-flex;
  align-items: center;
  gap: 0px;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  white-space: nowrap;
}
.rating-badge small {
  font-weight: 400;
  font-size: 11px;
  opacity: 0.8;
}

/* Icons via FA6 ::before — inherits badge text color, no emoji color issues */
.rating-badge::before {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  font-size: 11px;
  margin-right: 2px;
  line-height: 1;
  display: inline-block;
}

.imdb-badge,
.tmdb-badge,
.rt-badge,
.mc-badge {
  position: relative;
}
.imdb-badge::before {
  content: "";
  background-image: url(/imagesnew/icons/imdb.png);
  width: 30px;
  height: 88%;
  min-height: 15px;
  background-size: contain;
  background-repeat: no-repeat;
} /* fa-star        — IMDb            */
.tmdb-badge::before {
  content: "";
  background-image: url(/imagesnew/icons/tmdb.png);
  width: 20px;
  height: 100%;
  min-height: 18px;
  background-size: contain;
  background-repeat: no-repeat;
}
.rt-badge::before {
  content: "";
  background-image: url(/imagesnew/icons/rt.png);
  width: 20px;
  height: 100%;
  min-height: 18px;
  background-size: contain;
  background-repeat: no-repeat;
}
.mc-badge::before {
  content: "";
  background-image: url(/imagesnew/icons/metacritic.png);
  width: 20px;
  height: 100%;
  min-height: 18px;
  background-size: contain;
  background-repeat: no-repeat;
}
.thetvdb-badge::before {
  content: "";
  background-image: url(/imagesnew/icons/tvdb.png);
  width: 20px;
  height: 100%;
  min-height: 18px;
  background-size: contain;
  background-repeat: no-repeat;
}

.thetvdb-badge {
  background: #f1f5f9;
  color: #166534;
  border: 1px solid #86efac;
}
.rt-badge {
  background: #fff1f0;
  color: #c0392b;
  border: 1px solid #fca5a5;
}
.tmdb-badge {
  background: #f0fdf4;
  color: #166534;
  border: 1px solid #86efac;
}
.mc-badge {
  background: #eff6ff;
  color: #1d4ed8;
  border: 1px solid #93c5fd;
}
.imdb-badge {
  background: #fefce8;
  color: #854d0e;
  border: 1px solid #fde047;
}

[data-theme="dark"] .rt-badge {
  background: #450a0a;
  color: #fca5a5;
  border-color: #7f1d1d;
}
[data-theme="dark"] .mc-badge {
  background: #052e16;
  color: #86efac;
  border-color: #14532d;
}
[data-theme="dark"] .tmdb-badge {
  background: #1e3a5f;
  color: #93c5fd;
  border-color: #1d4ed8;
}
[data-theme="dark"] .imdb-badge {
  background: #422006;
  color: #fde047;
  border-color: #854d0e;
}
[data-theme="dark"] .thetvdb-badge {
  background: #555;
  color: #fdfdfd;
  border: 1px solid #86efac;
}
.movie-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-top: 4px;
}

.tv-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-bottom: 4px;
}

.movie-link-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 12px;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 500;
  border: 1.5px solid var(--c-border);
  color: var(--c-body) !important;
  background: var(--c-surface);
  text-decoration: none !important;
  cursor: pointer;
  transition:
    border-color 0.15s,
    color 0.15s;
  white-space: nowrap;
}
.watchlist-btn {
  border: 1.5px solid #16c784 !important;
}
.watchlist-btn-minus {
  border: 1.5px solid #da4f49 !important;
}
.movie-link-btn:hover {
  border-color: var(--c-primary) !important;
  color: var(--c-primary) !important;
}
button.movie-link-btn {
  -webkit-appearance: none;
  appearance: none;
  font-family: inherit;
  line-height: 1;
}
.movie-link-primary {
  background: var(--c-primary) !important;
  color: #fff !important;
  border-color: var(--c-primary) !important;
}
.movie-link-primary:hover {
  background: var(--c-primary-hov, #3391ff) !important;
  border-color: var(--c-primary-hov, #3391ff) !important;
  color: #fff !important;
}

/* AJAX spinner */
.dataloader {
  border: 3px solid var(--c-border, #e2e8f0);
  border-radius: 50%;
  border-top-color: var(--c-primary, #0070ff);
  width: 20px;
  height: 20px;
  animation: nzb-spin 2s linear infinite;
  margin: 2px auto;
}
@keyframes nzb-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* ── Report NZB popup: explicit per-button hover (prevents global blue override) ── */
.report-btn.password:hover {
  background: #fca5a5 !important;
  color: #991b1b !important;
  opacity: 1 !important;
}
.report-btn.wrongcat:hover {
  background: #fcd34d !important;
  color: #92400e !important;
  opacity: 1 !important;
}
.report-btn.wronginfo:hover {
  background: #93c5fd !important;
  color: #1e40af !important;
  opacity: 1 !important;
}
.report-btn.other:hover {
  background: #e5e7eb !important;
  color: #374151 !important;
  opacity: 1 !important;
}
[data-theme="dark"] .report-btn.password:hover {
  background: #7f1d1d !important;
  color: #fca5a5 !important;
  opacity: 1 !important;
}
[data-theme="dark"] .report-btn.wrongcat:hover {
  background: #78350f !important;
  color: #fde68a !important;
  opacity: 1 !important;
}
[data-theme="dark"] .report-btn.wronginfo:hover {
  background: #1e3a8a !important;
  color: #93c5fd !important;
  opacity: 1 !important;
}
[data-theme="dark"] .report-btn.other:hover {
  background: #374151 !important;
  color: #d1d5db !important;
  opacity: 1 !important;
}

/* ── Files table card shadow ── */
#filestable {
  margin-top: 8px;
  box-shadow: var(--sh-sm);
}

/* ── Comments tab (#tabs-7): style comment listing table ── */
#tabs-7 .comments table {
  width: 100%;
  border-collapse: collapse;
  box-shadow: var(--sh-sm);
  border-radius: var(--r-md);
  overflow: hidden;
  margin-bottom: 20px;
  background: var(--c-surface);
}
#tabs-7 .comments table th {
  background: var(--c-subnav) !important;
  color: var(--c-muted) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.07em !important;
  padding: 9px 14px !important;
  border-bottom: 2px solid var(--c-border) !important;
}
[data-theme="dark"] #tabs-7 .comments table th {
  background: var(--c-surface-3) !important;
}
#tabs-7 .comments table td {
  padding: 10px 14px !important;
  font-size: 13px !important;
  vertical-align: top !important;
  border-bottom: 1px solid var(--c-border) !important;
  color: var(--c-body) !important;
}
#tabs-7 .comments table tr:last-child td {
  border-bottom: none !important;
}
.comment-action-cell {
  white-space: nowrap;
  width: 1px;
  padding: 6px 12px !important;
  text-align: center;
  vertical-align: middle;
}
.comment-action-btn {
  color: var(--c-link) !important;
  font-size: 12px;
  text-decoration: none !important;
  padding: 2px 4px;
  border-radius: 3px;
  transition: color 0.15s;
}
.comment-action-btn:hover {
  color: var(--c-link);
}
.comment-action-delete:hover {
  color: #ef4444;
}
.comment-action-divider {
  color: var(--c-border);
  margin: 0 2px;
  font-size: 11px;
}

/* ── Comments tab: add-comment form ── */
#tabs-7 center {
  text-align: left !important;
  max-width: 700px;
  display: block !important;
  margin: 12px auto 0;
}
#tabs-7 form[name="frmcomment"] {
  display: block;
  text-align: left;
}
#tabs-7 form[name="frmcomment"] label {
  font-size: 14px;
  font-weight: 600;
  color: var(--c-heading);
  display: inline;
}
#tabs-7 form[name="frmcomment"] textarea {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 10px 12px !important;
  border: 1px solid var(--c-border) !important;
  border-radius: var(--r-sm) !important;
  font-size: 13px !important;
  font-family: var(--font) !important;
  resize: vertical !important;
  background: var(--c-surface) !important;
  color: var(--c-body) !important;
  min-height: 110px !important;
  margin-top: 8px !important;
  transition: border-color 0.15s;
}
#tabs-7 form[name="frmcomment"] textarea:focus {
  border-color: var(--c-primary) !important;
  outline: none;
  box-shadow: 0 0 0 3px var(--c-primary-muted);
}
#tabs-7 form[name="frmcomment"] input[type="submit"] {
  display: inline-block !important;
  width: auto !important;
  background: var(--c-primary) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--r-sm) !important;
  padding: 8px 28px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  font-family: var(--font) !important;
  letter-spacing: 0.01em !important;
  margin-top: 10px !important;
  transition:
    opacity 0.15s,
    transform 0.1s;
}
#tabs-7 form[name="frmcomment"] input[type="submit"]:hover {
  opacity: 0.88 !important;
  transform: translateY(-1px);
}

/* ── Similar NZBs tab (#tabs-8): column widths set inline on <th> in viewnzb.tpl ── */
#tabs-8 #browsetable {
  table-layout: fixed !important;
}
#tabs-8 #browsetable th {
  text-transform: capitalize !important;
}
#tabs-8 h1 {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--c-heading) !important;
  margin: 0 0 12px !important;
}
#tabs-8 center {
  text-align: left !important;
}

/* ── Files table — targeted by unique #filestable ID, no page collision ── */
#filestable th {
  padding: 3px 8px !important;
  font-size: 11px !important;
  line-height: 21px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  color: #0070ff !important;
  border: 1px solid var(--c-border) !important;
  background: rgba(0, 112, 255, 0.07) !important;
  border-bottom: 2px solid #0070ff !important;
  white-space: nowrap !important;
}
/* Sortable plugin wraps th content in <a> — jQuery UI .ui-widget-content a { color: #222 }
   overrides inherited color, so we must target <a> directly */
.ui-widget-content a {
  color: var(--c-link);
}
#filestable th a,
#filestable th a:visited,
#filestable th a:hover {
  color: #0070ff !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  font-size: 11px !important;
}
[data-theme="dark"] #filestable th {
  color: #3391ff !important;
  background: rgba(0, 112, 255, 0.1) !important;
  border-bottom-color: #3391ff !important;
}
[data-theme="dark"] #filestable th a,
[data-theme="dark"] #filestable th a:visited,
[data-theme="dark"] #filestable th a:hover {
  color: #3391ff !important;
}

/* Replace GIF sort arrows with FA6 icons */
#filestable .SortArrow img {
  display: none !important;
}
#filestable .SortArrow {
  display: inline-block;
  font-size: 0; /* hide any stray text inside the span */
  margin-left: 4px;
  vertical-align: middle;
  opacity: 0.35;
}
/* Explicit font-family on ::after itself — pseudo-elements do not reliably inherit */
#filestable .SortArrow::after {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  font-size: 10px;
  content: "\f0dc"; /* fa-sort — neutral updown arrows */
  display: inline-block;
}
#filestable th.Selected .SortArrow {
  opacity: 1;
}
#filestable th.Selected .SortArrow[sortdir="down"]::after {
  content: "\f0dd" !important;
} /* fa-sort-down */
#filestable th.Selected .SortArrow[sortdir="up"]::after {
  content: "\f0de" !important;
} /* fa-sort-up  */

/* ── Comments table — sort links + FA6 sort arrows ── */
.comments table th a,
.comments table th a:visited,
.comments table th a:hover {
  color: var(--c-primary) !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  font-size: 11px !important;
}
[data-theme="dark"] .comments table th a,
[data-theme="dark"] .comments table th a:visited,
[data-theme="dark"] .comments table th a:hover {
  color: #3391ff !important;
}
.comments table .SortArrow img {
  display: none !important;
}
.comments table .SortArrow {
  display: inline-block;
  font-size: 0;
  margin-left: 4px;
  vertical-align: middle;
  opacity: 0.35;
}
.comments table .SortArrow::after {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  font-size: 10px;
  content: "\f0dc";
  display: inline-block;
}
.comments table th.Selected .SortArrow {
  opacity: 1;
}
.comments table th.Selected .SortArrow[sortdir="down"]::after {
  content: "\f0dd" !important;
}
.comments table th.Selected .SortArrow[sortdir="up"]::after {
  content: "\f0de" !important;
}

/* Comment user column */
.comment-user-cell {
  vertical-align: top !important;
  padding: 12px 10px !important;
  width: 160px !important;
  min-width: 140px !important;
}
.comment-user {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.comment-avatar {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  flex-shrink: 0;
  border: 2px solid var(--c-border);
  display: block !important;
}
.comment-user-details {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.comment-username {
  font-weight: 600;
  font-size: 13px;
  color: var(--c-link) !important;
  text-decoration: none !important;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 110px;
  display: block;
}
.comment-role-badge {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 10px;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(37, 99, 235, 0.08);
  color: var(--c-primary);
  width: fit-content;
}
.comment-role-badge.comment-role-admin,
.comment-role-badge.comment-role-moderator {
  background: rgba(239, 68, 68, 0.1);
  color: #ef4444;
}
.comment-role-badge.comment-role-lult {
  background: rgba(245, 158, 11, 0.1);
  color: #f59e0b;
}
.comment-role-badge.comment-role-editor {
  background: rgba(16, 185, 129, 0.1);
  color: #10b981;
}
.comment-warned {
  font-size: 11px;
  color: #f59e0b;
}
.comment-provider {
  font-size: 11px;
  color: #16a34a;
  font-weight: 500;
}
.comment-date {
  font-size: 11px;
  color: var(--c-muted);
  line-height: 1.5;
  margin-top: 2px;
}

/* Bordered data rows */
#filestable td {
  border: 1px solid var(--c-border) !important;
  padding: 5px 8px !important;
  font-size: 13px !important;
  vertical-align: middle !important;
}

/* 4 columns: #, Filename (icon inline), Completion, Size */
#filestable th:nth-child(1),
#filestable td.files-col-num {
  width: 44px;
  text-align: center !important;
}
#filestable td.files-col-num {
  color: var(--c-muted) !important;
  font-size: 12px !important;
}
#filestable th:nth-child(3),
#filestable td.files-col-pct {
  width: 100px;
  text-align: center !important;
}
#filestable th:nth-child(4),
#filestable td.files-col-size {
  width: 90px;
  text-align: right !important;
  font-variant-numeric: tabular-nums;
  padding-right: 14px !important;
}
#filestable .files-type-icon {
  width: 18px;
  height: 18px;
  object-fit: contain;
  vertical-align: middle;
  margin-right: 7px;
  opacity: 0.75;
}

/* Alternating stripe */
#filestable tr.alt td {
  background: var(--c-subnav, #f1f5f9) !important;
}
[data-theme="dark"] #filestable tr.alt td {
  background: var(--c-surface-2, #161b26) !important;
}

/* fa-flag not in custom FA4 kit — redirect to FA6 Free (\f024 = flag, same codepoint) */
i.fa.br-flag-icon {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
}

tr.br-flagged td { background-color: #fff0f0 !important; }
tr.br-flagged.alt td { background-color: #ffe8e8 !important; }
#browsetable tr.br-flagged:hover td,
#searchtable tr.br-flagged:hover td,
table.data tr.br-flagged:hover td { background-color: #ffd8d8 !important; }
#browsetable tr.br-flagged.alt:hover td,
#searchtable tr.br-flagged.alt:hover td,
table.data tr.br-flagged.alt:hover td { background-color: #ffd0d0 !important; }
[data-theme="dark"] tr.br-flagged td { background-color: #2a0f0f !important; }
[data-theme="dark"] tr.br-flagged.alt td { background-color: #240c0c !important; }
[data-theme="dark"] #browsetable tr.br-flagged:hover td,
[data-theme="dark"] #searchtable tr.br-flagged:hover td,
[data-theme="dark"] table.data tr.br-flagged:hover td { background-color: #3d1212 !important; }
[data-theme="dark"] #browsetable tr.br-flagged.alt:hover td,
[data-theme="dark"] #searchtable tr.br-flagged.alt:hover td,
[data-theme="dark"] table.data tr.br-flagged.alt:hover td { background-color: #361010 !important; }
.br-flag-tip { display: none; position: fixed; z-index: 9999; pointer-events: none; background: #1e293b; color: #f1f5f9; font-size: 12.5px; font-weight: 500; padding: 6px 12px; border-radius: 8px; box-shadow: 0 4px 16px rgba(0,0,0,.25); max-width: 320px; line-height: 1.4; white-space: pre-wrap; }

/* Show more / show less toggle */
.nzb-rm-content span {
  display: none;
}
.nzb-rm-link {
  display: inline;
}

/* ── Report NZB form ─────────────────────────────── */
.report-nzb-wrap {
  padding: 24px;
  max-width: 520px;
  margin: 0 auto;
  font-family: var(--font);
}
.report-nzb-header {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 17px;
  font-weight: 700;
  color: var(--c-heading);
  margin-bottom: 14px;
}
.report-nzb-header i {
  color: var(--c-danger);
  font-size: 15px;
}
.report-nzb-title {
  background: var(--c-subnav);
  border: 1px solid var(--c-border);
  border-radius: var(--r-sm);
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 500;
  color: var(--c-body);
  margin-bottom: 18px;
  line-height: 1.5;
  word-break: break-word;
}
.report-label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--c-secondary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 6px;
}
.report-textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  font-size: 13px;
  font-family: var(--font);
  color: var(--c-body);
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-sm);
  resize: vertical;
  outline: none;
  transition: border-color 0.15s;
}
.report-textarea:focus {
  border-color: var(--c-border-focus);
}
.report-nzb-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 14px;
}
.report-btn-submit {
  background: var(--c-primary);
  color: #fff;
  border: none;
  border-radius: var(--r-sm);
  padding: 8px 20px;
  font-size: 13px;
  font-weight: 600;
  font-family: var(--font);
  cursor: pointer;
  transition: background 0.15s;
}
.report-btn-submit:hover {
  background: var(--c-primary-hov);
}
.report-alert {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border-radius: var(--r-sm);
  font-size: 13px;
  font-weight: 500;
  margin-bottom: 14px;
}
.report-alert-success {
  background: rgba(22, 199, 132, 0.1);
  color: var(--c-success-dark);
  border: 1px solid rgba(22, 199, 132, 0.25);
}
.report-alert-error {
  background: rgba(255, 59, 59, 0.08);
  color: var(--c-danger);
  border: 1px solid rgba(255, 59, 59, 0.2);
}
.report-nzb-notice {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  margin-top: 18px;
  padding: 10px 14px;
  background: var(--c-primary-muted);
  border-radius: var(--r-sm);
  font-size: 12px;
  color: var(--c-secondary);
  line-height: 1.5;
}
.report-nzb-notice i {
  color: var(--c-primary);
  margin-top: 1px;
  flex-shrink: 0;
}

/* ── NZB Reports queue ───────────────────────────── */
.nzbrep-wrap {
  padding: 20px 0;
}
.nzbrep-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 16px;
}
.nzbrep-title {
  font-size: 17px;
  font-weight: 700;
  color: var(--c-heading);
  display: flex;
  align-items: center;
  gap: 8px;
}
.nzbrep-title i {
  color: var(--c-danger);
}
.nzbrep-bulk {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.nzbrep-select {
  padding: 6px 10px;
  font-size: 12px;
  border: 1px solid var(--c-border);
  border-radius: var(--r-sm);
  background: var(--c-surface);
  color: var(--c-body);
  outline: none;
}
.nzbrep-btn {
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 600;
  font-family: var(--font);
  border: none;
  border-radius: var(--r-sm);
  cursor: pointer;
  transition: background 0.15s;
}
.nzbrep-btn-primary {
  background: var(--c-primary);
  color: #fff;
}
.nzbrep-btn-primary:hover {
  background: var(--c-primary-hov);
}
.nzbrep-btn-secondary {
  background: var(--c-subnav);
  color: var(--c-body);
  border: 1px solid var(--c-border);
}
.nzbrep-btn-secondary:hover {
  background: var(--c-border);
}
.nzbrep-btn-xs {
  padding: 3px 10px;
  font-size: 11px;
  background: var(--c-primary-muted);
  color: var(--c-primary);
  border: 1px solid rgba(0, 112, 255, 0.2);
}
.nzbrep-btn-xs:hover {
  background: var(--c-primary);
  color: #fff;
}
.nzbrep-solved-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 600;
  color: var(--c-success-dark);
}
.nzbrep-solved-badge i {
  font-size: 11px;
}
.nzbrep-empty {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 24px 20px;
  background: var(--c-subnav);
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  font-size: 14px;
  color: var(--c-success-dark);
  font-weight: 500;
}
.nzbrep-denied {
  padding: 20px;
  color: var(--c-danger);
  font-weight: 600;
  font-size: 14px;
}

/* ── Tutorials page ── */
.tutorials-wrap {
  padding: 16px 0 32px;
}
.tutorials-top-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}
.tutorials-add-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 500;
  background: var(--c-primary);
  color: #fff !important;
  text-decoration: none !important;
  border: none;
  cursor: pointer;
  transition: background 0.15s;
}
.tutorials-add-btn:hover {
  background: var(--c-primary-hov, #3391ff);
  color: #fff !important;
}
.tutorials-page-title {
  font-size: 20px;
  font-weight: 700;
  color: var(--c-body);
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
}
.tutorials-category-section {
  margin-bottom: 24px;
}
.tutorials-category-title {
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--c-primary);
  padding-bottom: 7px;
  border-bottom: 2px solid var(--c-primary);
  margin-bottom: 10px;
}
.tutorials-accordion {
  border: 1px solid var(--c-border);
  border-radius: 8px;
  overflow: hidden;
}
.tutorials-item {
  border-bottom: 1px solid var(--c-border);
}
.tutorials-item:last-child {
  border-bottom: none;
}
.tutorials-trigger {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  cursor: pointer;
  background: var(--c-surface);
  transition: background 0.15s;
  user-select: none;
}
.tutorials-trigger:hover {
  background: var(--c-sidebar-hov);
}
.tutorials-icon {
  color: var(--c-primary);
  font-size: 11px;
  transition: transform 0.2s ease;
  flex-shrink: 0;
}
.tutorials-expanded .tutorials-icon {
  transform: rotate(90deg);
}
.tutorials-question {
  font-size: 13px;
  font-weight: 600;
  color: var(--c-body);
  line-height: 1.4;
}
.tutorials-content {
  height: 0;
  overflow: hidden;
  transition: height 0.25s ease;
}
.tutorials-content-inner {
  padding: 14px 20px 16px 36px;
  background: var(--c-subnav);
  border-top: 1px solid var(--c-border);
}
.tutorials-content-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--c-body);
  margin-bottom: 8px;
  text-align: center;
}
.tutorials-content-body {
  font-size: 13px;
  color: var(--c-secondary);
  line-height: 1.7;
}

/* ── Trending page ── */
.tr-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--c-border);
}
.tr-header-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--c-body);
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
}
.tr-header-title > i {
  color: #ef4444;
}
.tr-view-switcher {
  display: flex;
  align-items: center;
  gap: 6px;
}
.tr-view-label {
  font-size: 12px;
  color: var(--c-muted);
  margin-right: 2px;
}
.tr-view-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 5px;
  border: 1px solid var(--c-border);
  color: var(--c-muted);
  text-decoration: none !important;
  font-size: 13px;
  transition: all 0.15s;
}
.tr-view-btn:hover {
  border-color: var(--c-primary);
  color: var(--c-primary) !important;
}
.tr-view-active,
.tr-view-active:hover {
  background: var(--c-primary) !important;
  color: #fff !important;
  border-color: var(--c-primary) !important;
}
.tr-section {
  margin-bottom: 28px;
}
.tr-section-title {
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--c-primary);
  padding-bottom: 7px;
  border-bottom: 2px solid var(--c-primary);
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 7px;
}
.tr-section-title > i {
  color: var(--c-primary);
  font-size: 12px;
}
/* Grid view */
.tr-covers-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.tr-cover-item {
  flex: 0 0 calc(12.5% - 7px);
}
.tr-cover-item a {
  display: block;
}
.tr-cover-item img {
  width: 100%;
  display: block;
  border-radius: 4px;
  border: 1px solid var(--c-border);
  transition:
    opacity 0.15s,
    transform 0.15s;
}
.tr-cover-item img:hover {
  opacity: 0.82;
  transform: translateY(-2px);
}
/* List view */
.tr-list-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  overflow: hidden;
}
.tr-list-item {
  padding: 7px 12px;
  border-bottom: 1px solid var(--c-border);
}
.tr-list-item:nth-child(odd) {
  border-right: 1px solid var(--c-border);
}
.tr-list-item:nth-last-child(-n + 2):not(:nth-child(odd) ~ *),
.tr-list-item:last-child {
  border-bottom: none;
}
.tr-list-item a {
  font-size: 13px;
  color: var(--c-link);
  text-decoration: none;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tr-list-item a:hover {
  color: var(--c-primary);
}

/* ── TV Calendar ── */
.cal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--c-border);
  flex-wrap: wrap;
  gap: 10px;
}
.cal-header-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--c-body);
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
}
.cal-header-title > i {
  color: var(--c-primary);
}
.cal-header-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.cal-search-form {
  display: flex;
  align-items: center;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  overflow: hidden;
  background: var(--c-surface);
}
.cal-search-form input {
  border: none;
  outline: none;
  background: transparent;
  padding: 5px 10px;
  font-size: 13px;
  color: var(--c-body);
  width: 150px;
}
.cal-search-form button {
  border: none;
  background: var(--c-primary);
  color: #fff;
  padding: 5px 10px;
  cursor: pointer;
  font-size: 13px;
  transition: background 0.15s;
}
.cal-search-form button:hover {
  background: var(--c-primary-hov, #3391ff);
}
.cal-nav-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 10px;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 500;
  border: 1px solid var(--c-border);
  color: var(--c-body) !important;
  text-decoration: none !important;
  transition: all 0.15s;
  white-space: nowrap;
}
.cal-nav-btn:hover {
  border-color: var(--c-primary);
  color: var(--c-primary) !important;
}

/* Popular Today */
.cal-popular {
  margin-bottom: 22px;
}
.cal-section-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--c-muted);
  padding-bottom: 7px;
  border-bottom: 2px solid var(--c-primary);
  margin-bottom: 12px;
  #display: flex;
  align-items: center;
  gap: 6px;
  text-align: center;
}
.cal-section-label > i {
  color: #ef4444;
}
.cal-popular-grid {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 4px;
}
.cal-popular-card {
  text-align: center;
  width: 205px;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  overflow: hidden;
  background: var(--c-popular-card-bg);
}
.cal-popular-card img {
  width: 100%;
  display: block;
}
.cal-popular-info {
  text-align: center;
}
.cal-popular-time {
  font-size: 10px;
  color: #00ff64;
  font-weight: 600;
  margin-bottom: 3px;
  background: var(--c-primary);
}
.cal-popular-show {
  font-size: 12px;
  font-weight: 600;
  color: var(--c-body) !important;
  text-decoration: none !important;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-bottom: -3px;
}
.cal-popular-show:hover {
  color: var(--c-primary) !important;
}
.cal-popular-ep {
  font-size: 11px;
  color: var(--c-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cal-popular-code {
  font-size: 11px;
  color: var(--c-primary);
  font-weight: 600;
  margin-top: 2px;
}

/* Month navigation */
.cal-month-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 8px 0;
  margin-bottom: 10px;
}
.cal-month-label {
  font-size: 15px;
  font-weight: 700;
  color: var(--c-body);
}
.cal-month-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 5px;
  border: 1px solid var(--c-border);
  color: var(--c-muted) !important;
  text-decoration: none !important;
  font-size: 12px;
  transition: all 0.15s;
}
.cal-month-arrow:hover {
  border-color: var(--c-primary);
  color: var(--c-primary) !important;
}

/* 7-day week grid */
.cal-week {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
}
.cal-day {
  border: 1px solid var(--c-border);
  border-radius: 6px;
  overflow: hidden;
  min-height: 60px;
}
.cal-day-head {
  text-align: center;
  padding: 8px 10px 6px;
  background: var(--c-subnav);
  border-bottom: 1px solid var(--c-border);
}
.cal-day-name {
  display: block;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--c-muted);
}
.cal-day-date {
  display: block;
  font-size: 15px;
  font-weight: 700;
  color: var(--c-body);
  line-height: 1.3;
}
.cal-day-today .cal-day-head {
  background: var(--c-primary);
  border-bottom-color: transparent;
}
.cal-day-today .cal-day-name {
  color: rgba(255, 255, 255, 0.75);
}
.cal-day-today .cal-day-date {
  color: #fff;
}
.cal-entry {
  text-align: center;
  padding: 5px 8px;
  border-bottom: 1px solid var(--c-border);
}
.cal-entry:last-child {
  border-bottom: none;
}
.cal-entry-time {
  display: block;
  font-size: 10px;
  color: var(--c-primary);
  font-weight: 600;
  background: var(--c-popular-card-bg);
}
.cal-entry-show {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--c-body) !important;
  text-decoration: none !important;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cal-entry-show:hover {
  color: var(--c-primary) !important;
}
.cal-entry-ep {
  display: block;
  font-size: 12px;
  color: var(--c-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cal-entry-code {
  display: inline-block;
  font-size: 11px;
  color: var(--c-primary);
  text-decoration: none !important;
  font-weight: 600;
}
.cal-entry-code:hover {
  text-decoration: underline !important;
}
.cal-empty {
  padding: 12px 8px;
  font-size: 12px;
  color: var(--c-muted);
  text-align: center;
}

/* Search results table */
.cal-search-results-wrap {
  margin-top: 4px;
}
.cal-search-table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  overflow: hidden;
  font-size: 13px;
}
.cal-search-table thead tr {
  background: var(--c-subnav);
}
.cal-search-table th {
  padding: 9px 14px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--c-muted);
  text-align: left;
  border-bottom: 2px solid var(--c-border);
}
.cal-search-table td {
  padding: 9px 14px;
  border-bottom: 1px solid var(--c-border);
  vertical-align: middle;
  color: var(--c-body);
}
.cal-search-table tbody tr:last-child td {
  border-bottom: none;
}
.cal-search-table tbody tr:hover td {
  background: var(--c-sidebar-hov);
}
.cal-today-badge {
  display: inline-block;
  padding: 2px 8px;
  background: var(--c-primary);
  color: #fff;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 600;
}

/* Cover view — date pill nav */
.cal-date-nav {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 6px;
  margin-bottom: 16px;
}
.cal-date-pill {
  flex: 0 0 auto;
  padding: 4px 10px;
  border-radius: 20px;
  border: 1px solid var(--c-border);
  font-size: 11px;
  font-weight: 600;
  color: var(--c-muted) !important;
  text-decoration: none !important;
  transition: all 0.15s;
  white-space: nowrap;
}
.cal-date-pill:hover {
  border-color: var(--c-primary);
  color: var(--c-primary) !important;
}

/* Cover view — 3-column grid */
.cal-cov-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.cal-cov-col {
  border: 1px solid var(--c-border);
  border-radius: 6px;
  overflow: hidden;
}
.cal-cov-entry {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--c-border);
}
.cal-cov-entry:last-child {
  border-bottom: none;
}
.cal-cov-entry img {
  width: 50px;
  object-fit: cover;
  border-radius: 3px;
  border: 1px solid var(--c-border);
  flex-shrink: 0;
}
.cal-cov-info {
  min-width: 0;
}

/* ── Monthly Calendar Grid ── */
.hiderow {
  display: none !important;
}
.cal-month-grid {
  border: 1px solid var(--c-border);
  border-radius: 8px;
  overflow: hidden;
}
.cal-month-headers {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  background: var(--c-subnav);
  border-bottom: 2px solid var(--c-primary);
}
.cal-month-header-cell {
  padding: 8px 10px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--c-muted);
  text-align: center;
  min-width: 0;
  overflow: hidden;
}
.cal-month-header-today {
  color: var(--c-primary);
}
.cal-month-row {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  border-bottom: 1px solid var(--c-border);
}
.cal-month-row:last-child {
  border-bottom: none;
}
.cal-month-cell {
  border-right: 1px solid var(--c-border);
  min-height: 80px;
  padding-bottom: 4px;
  min-width: 0;
  overflow: hidden;
}
.cal-month-cell:last-child {
  border-right: none;
}
.cal-month-cell-head {
  padding: 5px 8px 4px;
  font-size: 13px;
  font-weight: 700;
  color: var(--c-muted);
  background: #f1f5f9;
  border-bottom: 1px solid var(--c-border);
  text-align: center;
}

[data-theme="dark"] .cal-month-cell-head {
  padding: 5px 8px 4px;
  font-size: 13px;
  font-weight: 700;
  color: var(--c-muted);
  background: #1e293b;
  border-bottom: 1px solid var(--c-border);
  text-align: center;
}

.cal-month-today .cal-month-cell-head {
  background: var(--c-primary);
  color: #fff;
  border-bottom-color: transparent;
}
.cal-month-cell .cal-entry {
  border-bottom: 1px solid var(--c-border);
}
.cal-month-cell .cal-entry:last-of-type {
  border-bottom: none;
}
.cal-empty-month {
  padding: 10px 8px;
  font-size: 12px;
  color: var(--c-border);
  text-align: center;
}
.cal-readmore {
  padding: 4px 8px;
}
.cal-readmore-btn {
  font-size: 10px;
  color: var(--c-primary) !important;
  text-decoration: none !important;
  font-weight: 600;
}
.cal-readmore-btn:hover {
  text-decoration: underline !important;
}

/* ── Private Messages ── */
.pm-wrap {
}
.pm-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--c-border);
}
.pm-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--c-body);
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
}
.pm-title i {
  color: var(--c-primary);
}
.pm-compose-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 12px;
  background: var(--c-primary);
  color: #fff !important;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none !important;
}
.pm-tabs {
  display: flex;
  gap: 4px;
  margin-bottom: 12px;
}
.pm-tab {
  padding: 5px 12px;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 500;
  color: var(--c-body) !important;
  text-decoration: none !important;
  border: 1px solid var(--c-border);
  transition:
    border-color 0.15s,
    color 0.15s;
}
.pm-tab:hover {
  border-color: var(--c-primary);
  color: var(--c-primary) !important;
}
.pm-tab-active {
  background: var(--c-primary);
  color: #fff !important;
  border-color: var(--c-primary);
}
.pm-tab-active:hover {
  color: #fff !important;
}
.pm-list {
  border: 1px solid var(--c-border);
  border-radius: 6px;
  overflow: hidden;
  margin-bottom: 8px;
}
.pm-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--c-border);
}
.pm-row:last-child {
  border-bottom: none;
}
.pm-unread {
  background: var(--c-subnav);
}
.pm-row-icon {
  width: 24px;
  flex-shrink: 0;
  padding-top: 2px;
  text-align: center;
  font-size: 12px;
}
.pm-icon-in {
  color: var(--c-primary);
}
.pm-icon-out {
  color: var(--c-muted);
}
.pm-row-body {
  flex: 1;
  min-width: 0;
}
.pm-row-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 3px;
  flex-wrap: wrap;
}
.pm-row-sender {
  font-size: 13px;
  font-weight: 600;
  color: var(--c-body) !important;
  text-decoration: none !important;
}
.pm-row-sender:hover {
  color: var(--c-primary) !important;
}
.pm-badge {
  font-size: 10px;
  font-weight: 700;
  background: var(--c-primary);
  color: #fff;
  padding: 1px 6px;
  border-radius: 10px;
  flex-shrink: 0;
}
.pm-row-date {
  font-size: 11px;
  color: var(--c-muted);
  margin-left: auto;
  white-space: nowrap;
}
.pm-row-preview {
  font-size: 12px;
  color: var(--c-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 4px;
}
.pm-row-actions {
  display: flex;
  gap: 10px;
}
.pm-action-btn {
  font-size: 11px;
  color: var(--c-primary) !important;
  text-decoration: none !important;
  font-weight: 500;
}
.pm-action-btn:hover {
  text-decoration: underline !important;
}
.pm-check {
  flex-shrink: 0;
  margin-top: 3px;
}
.pm-footer {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
  font-size: 12px;
  color: var(--c-body);
  flex-wrap: wrap;
}
.pm-footer label {
  display: flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
}
.pm-pipe {
  color: var(--c-muted);
}
.pm-footer input[type="submit"] {
  padding: 3px 10px;
  border-radius: 4px;
  border: 1px solid var(--c-border);
  background: var(--c-subnav);
  color: var(--c-body);
  font-size: 12px;
  cursor: pointer;
}
.pm-empty {
  padding: 24px;
  text-align: center;
  font-size: 13px;
  color: var(--c-muted);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

/* PM Conversation / Read */
.pm-convo-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--c-border);
  flex-wrap: wrap;
}
.pm-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border: 1px solid var(--c-border);
  border-radius: 5px;
  font-size: 12px;
  font-weight: 500;
  color: var(--c-body) !important;
  text-decoration: none !important;
  flex-shrink: 0;
  transition:
    border-color 0.15s,
    color 0.15s;
}
.pm-back-btn:hover {
  border-color: var(--c-primary);
  color: var(--c-primary) !important;
}
.pm-convo-with {
  font-size: 13px;
  color: var(--c-muted);
}
.pm-convo-with strong {
  color: var(--c-body);
}
.pm-convo-count {
  margin-left: auto;
  font-size: 11px;
  color: var(--c-muted);
}
.pm-single-card {
  border: 1px solid var(--c-border);
  border-radius: 6px;
  overflow: hidden;
}
.pm-single-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px;
  background: var(--c-subnav);
  border-bottom: 1px solid var(--c-border);
  font-size: 12px;
}
.pm-single-body {
  padding: 12px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--c-body);
}

/* PM Chat bubbles */
.pm-bubble-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 16px;
}
.pm-bubble {
  max-width: 72%;
}
.pm-bubble-self {
  align-self: flex-end;
}
.pm-bubble-other {
  align-self: flex-start;
}
.pm-bubble-meta {
  font-size: 11px;
  color: var(--c-muted);
  margin-bottom: 4px;
}
.pm-bubble-self .pm-bubble-meta {
  text-align: right;
}
.pm-bubble-body {
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.5;
  word-break: break-word;
}
.pm-bubble-self .pm-bubble-body {
  background: var(--c-primary);
  color: #fff;
  border-bottom-right-radius: 2px;
}
.pm-bubble-other .pm-bubble-body {
  background: var(--c-subnav);
  color: var(--c-body);
  border: 1px solid var(--c-border);
  border-bottom-left-radius: 2px;
}

/* PM Reply / Compose */
.pm-reply-form {
  border: 1px solid var(--c-border);
  border-radius: 6px;
  overflow: hidden;
  margin-top: 12px;
}
.pm-reply-textarea {
  width: 100%;
  padding: 10px 12px;
  font-size: 13px;
  border: none;
  background: var(--c-surface);
  color: var(--c-body);
  resize: vertical;
  min-height: 80px;
  box-sizing: border-box;
  display: block;
  outline: none;
}
.pm-reply-footer {
  display: flex;
  justify-content: flex-end;
  padding: 8px 10px;
  border-top: 1px solid var(--c-border);
  background: var(--c-subnav);
}
.pm-reply-submit {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 14px;
  background: var(--c-primary);
  color: #fff;
  border: none;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.pm-compose-wrap {
  border: 1px solid var(--c-border);
  border-radius: 6px;
  overflow: hidden;
}
.pm-form-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-bottom: 1px solid var(--c-border);
  background: var(--c-surface);
}
.pm-form-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--c-muted);
  width: 28px;
  flex-shrink: 0;
}
.pm-form-input {
  flex: 1;
  border: none;
  background: transparent;
  color: var(--c-body);
  font-size: 13px;
  outline: none;
}
.pm-form-textarea {
  width: 100%;
  padding: 10px 12px;
  border: none;
  background: var(--c-surface);
  color: var(--c-body);
  resize: vertical;
  min-height: 120px;
  font-size: 13px;
  box-sizing: border-box;
  display: block;
  outline: none;
}
.pm-form-actions {
  padding: 8px 10px;
  border-top: 1px solid var(--c-border);
  background: var(--c-subnav);
  display: flex;
  justify-content: flex-end;
}
.pm-alert {
  padding: 10px 12px;
  border-radius: 6px;
  font-size: 12px;
  margin-bottom: 10px;
  border: 1px solid var(--c-border);
  background: var(--c-subnav);
  color: var(--c-body);
}

/* ── NZB Import ── */
.nimport-wrap {
  padding: 8px 0 16px;
}
.nimport-header {
  margin-bottom: 8px;
}
.nimport-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--c-body);
  margin: 0 0 2px;
}
.nimport-title i {
  color: var(--c-primary);
  margin-right: 5px;
}
.nimport-subtitle {
  font-size: 12px;
  color: var(--c-muted);
  margin: 0;
}
.nimport-rules {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  padding: 8px 12px;
  margin-bottom: 8px;
}
.nimport-rules ul {
  margin: 0;
  padding-left: 16px;
}
.nimport-rules li {
  font-size: 12px;
  color: var(--c-body);
  margin-bottom: 4px;
  line-height: 1.4;
}
.nimport-rules li:last-child {
  margin-bottom: 0;
}
.nimport-example {
  color: var(--c-primary);
  font-weight: 500;
}
.nimport-ext {
  color: var(--c-muted);
}
.nimport-no {
  color: #ef4444;
  font-weight: 600;
}
.nimport-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  padding: 12px 14px;
  margin-bottom: 8px;
}
.nimport-field {
  margin-bottom: 10px;
}
.nimport-field:last-child {
  margin-bottom: 0;
}
.nimport-label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--c-body);
  margin-bottom: 4px;
}
.nimport-file {
  display: block;
  width: 100%;
  font-size: 12px;
  color: var(--c-body);
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 5px;
  padding: 5px 8px;
  cursor: pointer;
  box-sizing: border-box;
}
.nimport-file:focus {
  outline: none;
  border-color: var(--c-border-focus);
}
.nimport-select {
  display: block;
  width: 100%;
  max-width: 280px;
  font-size: 12px;
  color: var(--c-body);
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 5px;
  padding: 5px 8px;
  cursor: pointer;
  box-sizing: border-box;
}
.nimport-select:focus {
  outline: none;
  border-color: var(--c-border-focus);
}
.nimport-check-label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--c-body);
  cursor: pointer;
}
.nimport-checkbox {
  width: 13px;
  height: 13px;
  cursor: pointer;
  accent-color: var(--c-primary);
}
.nimport-hint {
  display: block;
  font-size: 11px;
  color: var(--c-muted);
  margin-top: 3px;
}
.nimport-actions {
  padding-top: 2px;
}
.nimport-submit {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: var(--c-primary);
  color: #fff;
  border: none;
  border-radius: 5px;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s;
}
.nimport-submit:hover {
  background: var(--c-primary-hov);
}
.nimport-results {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  padding: 10px 14px;
  margin-bottom: 8px;
}
.nimport-results-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--c-body);
  margin: 0 0 6px;
}
.nimport-results-title i {
  color: #22c55e;
  margin-right: 5px;
}
.nimport-results-body {
  font-size: 12px;
  color: var(--c-body);
  line-height: 1.6;
}
.nimport-denied {
  text-align: center;
  padding: 24px 16px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  margin-bottom: 8px;
}
.nimport-denied-icon {
  font-size: 22px;
  color: #ef4444;
  margin-bottom: 6px;
  display: block;
}
.nimport-denied p {
  font-size: 13px;
  color: var(--c-body);
  margin: 0 0 4px;
}
.nimport-muted {
  color: var(--c-muted) !important;
  font-size: 12px !important;
}
.nimport-disclaimer {
  font-size: 11px;
  color: var(--c-muted);
  text-align: center;
  padding: 8px 0;
  border-top: 1px solid var(--c-border);
  margin-top: 4px;
}

/* ── NZB Watermark Decoder ── */
.nwm-wrap {
  padding: 8px 0 16px;
}
.nwm-header {
  margin-bottom: 8px;
}
.nwm-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--c-body);
  margin: 0 0 2px;
}
.nwm-title i {
  color: var(--c-primary);
  margin-right: 5px;
}
.nwm-subtitle {
  font-size: 12px;
  color: var(--c-muted);
  margin: 0;
}
.nwm-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  padding: 12px 14px;
  margin-bottom: 8px;
}
.nwm-field {
  margin-bottom: 10px;
}
.nwm-label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--c-body);
  margin-bottom: 4px;
}
.nwm-input {
  display: block;
  width: 100%;
  font-size: 12px;
  color: var(--c-body);
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 5px;
  padding: 5px 8px;
  box-sizing: border-box;
  font-family: monospace;
  transition: border-color 0.15s;
}
.nwm-input:focus {
  outline: none;
  border-color: var(--c-border-focus);
}
.nwm-hint {
  display: block;
  font-size: 11px;
  color: var(--c-muted);
  margin-top: 3px;
}
.nwm-actions {
  padding-top: 2px;
}
.nwm-submit {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: var(--c-primary);
  color: #fff;
  border: none;
  border-radius: 5px;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s;
}
.nwm-submit:hover {
  background: var(--c-primary-hov);
}
.nwm-result {
  border-radius: 6px;
  padding: 8px 12px;
  font-size: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.nwm-result-error {
  background: rgba(239, 68, 68, 0.08);
  border: 1px solid rgba(239, 68, 68, 0.25);
  color: #ef4444;
}
.nwm-result-ok {
  background: rgba(34, 197, 94, 0.08);
  border: 1px solid rgba(34, 197, 94, 0.25);
  color: var(--c-body);
  justify-content: space-between;
}
.nwm-result-label {
  font-weight: 600;
  color: var(--c-muted);
}
.nwm-result-uid {
  font-size: 16px;
  font-weight: 700;
  color: var(--c-primary);
  font-family: monospace;
}

/* ── Advanced Search ── */
.as-wrap {
  padding: 8px 0 16px;
}
.as-search-section {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  padding: 10px 14px;
  margin-bottom: 10px;
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
}
.as-mode-tabs {
  display: flex;
  gap: 14px;
  justify-content: center;
  margin-bottom: 8px;
  border-bottom: 1px solid var(--c-border);
  padding-bottom: 6px;
}
.as-mode-tab {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-weight: 600;
  color: var(--c-muted);
  cursor: pointer;
}
.as-mode-tab input[type="radio"] {
  accent-color: var(--c-primary);
}
.as-mode-tab:has(input:checked) {
  color: var(--c-primary);
}
.as-fields {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-bottom: 6px;
}
.as-fields:last-child {
  margin-bottom: 0;
}
.as-fields-sql {
  padding-top: 4px;
  border-top: 1px solid var(--c-border);
  justify-content: center;
}
.as-input {
  flex: 1 1 200px;
  font-size: 13px;
  color: var(--c-body);
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 5px;
  padding: 5px 8px;
  box-sizing: border-box;
  transition: border-color 0.15s;
}
.as-input:focus {
  outline: none;
  border-color: var(--c-border-focus);
}
.as-select {
  flex: 1 1 120px;
  font-size: 13px;
  color: var(--c-body);
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 5px;
  padding: 5px 7px;
  cursor: pointer;
  box-sizing: border-box;
}
.as-select-sm {
  flex: none;
  font-size: 13px;
}
.as-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: var(--c-primary);
  color: #fff;
  border: none;
  border-radius: 5px;
  padding: 5px 12px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s;
}
.as-btn:hover {
  background: var(--c-primary-hov);
}
.as-perpage {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.as-perpage-label {
  font-size: 11px;
  color: var(--c-muted);
}

/* ── Upcoming Movies ── */
.up-wrap {
  padding: 8px 0 16px;
}

.up-nav {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  padding: 6px 12px;
  margin-bottom: 10px;
}
.up-nav-table {
  width: 100%;
  border-collapse: collapse;
}
.up-nav-table tr + tr td {
  border-top: 1px solid var(--c-border);
}
.up-source-label {
  font-size: 10px;
  font-weight: 700;
  color: var(--c-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  white-space: nowrap;
  padding: 5px 12px 5px 0;
  vertical-align: top;
  width: 100px;
}
.up-links-cell {
  padding: 4px 0;
  line-height: 1.8;
}
.up-list-link {
  display: inline-flex;
  align-items: center;
  font-size: 11px;
  font-weight: 500;
  color: var(--c-muted);
  background: var(--c-bg);
  border: 1px solid var(--c-border);
  border-radius: 4px;
  padding: 2px 8px;
  margin: 2px 3px 2px 0;
  text-decoration: none;
  transition: all 0.15s;
}
.up-list-link:hover {
  color: var(--c-primary);
  border-color: var(--c-primary);
  background: var(--c-surface);
}

.up-heading-row {
  margin-bottom: 8px;
}
.up-heading {
  font-size: 13px;
  font-weight: 700;
  color: var(--c-body);
  margin: 0;
  display: flex;
  align-items: center;
  gap: 6px;
}
.up-heading i {
  color: var(--c-primary);
  font-size: 12px;
}

.up-results {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.up-card {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  padding: 10px 12px;
  transition: border-color 0.15s;
}
.up-card:hover {
  border-color: var(--c-border-focus);
}

.up-poster {
  flex-shrink: 0;
  width: 60px;
}
.up-poster img {
  width: 60px;
  height: auto;
  border-radius: 3px;
  display: block;
}

.up-body {
  flex: 1;
  min-width: 0;
}

.up-title-row {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 4px;
}
.up-title-link {
  font-size: 15px;
  font-weight: 600;
  color: var(--c-body);
  text-decoration: none;
}
.up-title-link:hover {
  color: var(--c-primary);
}
.up-year {
  font-size: 11px;
  color: var(--c-muted);
}
.up-year a {
  color: var(--c-muted);
  text-decoration: none;
}
.up-year a:hover {
  color: var(--c-primary);
}
.up-score {
  font-size: 10px;
  font-weight: 700;
  background: var(--c-primary);
  color: #fff;
  border-radius: 3px;
  padding: 1px 5px;
  line-height: 1.4;
}

.up-synopsis {
  font-size: 11px;
  color: var(--c-muted);
  margin: 0 0 5px;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.up-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 16px;
  margin-bottom: 7px;
}
.up-meta-item {
  font-size: 11px;
  color: var(--c-muted);
}
.up-meta-item b {
  color: var(--c-body);
  font-weight: 600;
}
.up-meta-item a {
  color: var(--c-muted);
  text-decoration: none;
}
.up-meta-item a:hover {
  color: var(--c-primary);
}

.up-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
}
.up-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 600;
  background: var(--c-primary);
  color: #fff;
  border: none;
  border-radius: 4px;
  padding: 3px 9px;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.15s;
}
.up-btn:hover {
  background: var(--c-primary-hov);
  color: #fff;
}
.up-btn-add {
  background: #16a34a;
}
.up-btn-add:hover {
  background: #15803d;
}
.up-btn-del {
  background: #dc2626;
}
.up-btn-del:hover {
  background: #b91c1c;
}

.up-empty {
  padding: 24px;
  text-align: center;
  font-size: 12px;
  color: var(--c-muted);
}

/* ── Movies list (movies.tpl) ── */
.mvm-card {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  padding: 10px 12px;
  margin-bottom: 4px;
}
.mvm-poster {
  flex-shrink: 0;
  width: 80px;
}
.mvm-thumb {
  width: 80px;
  height: auto;
  border-radius: 3px;
  display: block;
}
.mvm-body {
  flex: 1;
  min-width: 0;
}
.mvm-title-row {
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 3px;
}
.mvm-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--c-body);
  text-decoration: none;
}
.mvm-title:hover {
  color: var(--c-primary);
}
.mvm-year {
  font-size: 11px;
  color: var(--c-muted);
}
.mvm-year a {
  color: var(--c-muted);
  text-decoration: none;
}
.mvm-year a:hover {
  color: var(--c-primary);
}
.mvm-tagline {
  font-size: 11px;
  font-style: italic;
  color: var(--c-muted);
  margin: 0 0 3px;
}
.mvm-plot {
  font-size: 11px;
  color: var(--c-muted);
  margin: 0 0 5px;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.mvm-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 3px 14px;
  margin-bottom: 5px;
}
.mvm-meta-item {
  font-size: 11px;
  color: var(--c-muted);
}
.mvm-meta-item b {
  color: var(--c-body);
  font-weight: 600;
}
.mvm-meta-item a {
  color: var(--c-muted);
  text-decoration: none;
}
.mvm-meta-item a:hover {
  color: var(--c-primary);
}
.mvm-ratings {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 6px;
}
.mvm-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
}
.mvm-nzb-table {
  margin-bottom: 10px;
}

/* ── Movie Detail (viewmoviefull.tpl) ── */
/* vmf hero */
.vmf-hero {
  position: relative;
}
.vmf-backdrop {
  position: relative;
  line-height: 0;
  overflow: hidden;
  border-radius: 8px;
}
.vmf-backdrop img {
  width: 100%;
  height: auto;
  display: block;
}
.vmf-hero-bottom {
  display: flex;
  align-items: flex-end;
  gap: 14px;
  padding: 0 12px 10px 14px;
}
.vmf-hero-has-backdrop .vmf-hero-bottom {
  margin-top: -235px;
  position: relative;
  z-index: 2;
}
.vmf-poster {
  flex-shrink: 0;
  margin-left: 5px;
}
.vmf-poster img {
  width: 100%;
  height: auto;
  max-height: 300px;
  display: block;
  border-radius: 8px;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.5);
  border: 2px solid var(--c-surface);
}
.vmf-poster-tv img {
  width: 100%;
  height: auto;
  max-height: 280px;
  display: block;
  border-radius: 8px;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.5);
  border: 2px solid var(--c-surface);
  margin-left: 5px;
}
.vmf-hero-title {
  flex: 1;
  min-width: 0;
  margin-bottom: 12px;
}
.vmf-hero-title h1 {
  font-size: 20px;
  font-weight: 700;
  color: var(--c-heading);
  margin: 0;
  line-height: 1.25;
}
.vmf-hero-title a {
  margin-left: 5px;
  position: relative;
  top: -5px;
}
/* vmf card body */
.vmf-card-body {
  padding: 6px 0;
}
.vmf-plot {
  margin-bottom: 5px;
  font-size: 13px;
  color: var(--c-body);
  line-height: 1.5;
}
.vmf-tagline {
  font-size: 12px;
  font-style: italic;
  color: var(--c-muted);
  margin-bottom: 14px;
}
.vmf-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3px 24px;
  padding-bottom: 8px;
  margin-bottom: 2px;
  border-bottom: 1px solid var(--c-border);
}
.vmf-info-grid-series {
  grid-template-columns: 1fr 260px;
  gap: 16px 24px;
  align-items: start;
}
.vmf-info-col {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.vmf-info-col-box {
  border: 1px solid #6ede95;
  border-radius: 10px;
  padding: 12px 16px;
  gap: 3px;
  background-color: #f1f5f9;
  margin-top: -18px;
}
.vmf-info-col-title {
  font-size: 10px;
  color: #fcfffd;
  font-weight: 600;
  margin-bottom: 3px;
  background: #555;
  text-align: center;
  border-radius: 20px;
}
[data-theme="dark"] .vmf-info-col-box {
  background: rgba(255, 255, 255, 0.04);
}
.vmf-info-row {
  font-size: 13px;
  color: var(--c-body);
}
.vmf-info-rating {
  font-size: 13px;
  margin-bottom: 8px;
  margin-right: 73px;
}
.vmf-info-row strong {
  color: var(--c-heading);
  font-weight: 600;
  margin-right: 3px;
}
.vmf-meta-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 6px;
  padding: 7px 0;
  border-bottom: 1px solid var(--c-border);
  margin-bottom: 6px;
}
.vmf-tv-meta-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 6px;
  border-bottom: 1px solid var(--c-border);
  margin-bottom: 6px;
}
.vmf-staff {
  font-size: 13px;
  color: var(--c-muted);
  margin-bottom: 5px;
}
.vmf-staff a {
  color: var(--c-link);
  text-decoration: none;
}

/* vmf filter bar */
.vmf-filter-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px 0 10px;
}
.vmf-filter-group {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  background: var(--c-subnav);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  padding: 3px;
}
.vmf-filter-label {
  font-size: 10px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 4px;
  background: #4db5ff;
  color: #fff;
  letter-spacing: 0.06em;
  margin-right: 2px;
}
.vmf-filter-label-hd {
  background: #da4f49;
}
.vmf-filter-label-EX {
  background: #16c784;
}
.vmf-filter-link {
  font-size: 13px;
  padding: 3px 9px;
  border-radius: 4px;
  color: var(--c-secondary);
  text-decoration: none;
  transition:
    background 0.12s,
    color 0.12s;
}
.vmf-filter-link:hover {
  background: var(--c-border);
  color: var(--c-body);
}
.vmf-filter-link.vmf-filter-active,
.vmf-filter-link.vmf-filter-active:hover {
  background: var(--c-primary);
  color: #fff;
}
.vmf-filter-all {
  display: inline-flex;
  align-items: center;
  padding: 5px 12px;
  font-size: 11px;
  font-weight: 600;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  color: var(--c-body);
  text-decoration: none;
  transition:
    border-color 0.12s,
    color 0.12s;
}
.vmf-filter-all:hover {
  border-color: var(--c-primary);
  color: var(--c-primary);
}
.vmf-filter-all.vmf-filter-active {
  background: var(--c-primary);
  border-color: var(--c-primary);
  color: #fff !important;
}

.vmf-admin-shift {
  top: 510px !important;
}
.vmf-clear {
  clear: both;
}
.vmf-side-col {
  position: relative;
}
.vmf-movie-ratings {
  margin: 6px 0 10px;
}
.vmf-premium-note {
  color: #dc2626;
}
.vmf-cmts-user {
  width: 90px;
}
.vmf-cmts-td {
  background: none !important;
}
.vmf-no-results {
  width: 100%;
  display: inline-block;
  text-align: center;
  font-size: 15px;
  padding: 16px 0;
}
/* ── View Anime (va-) ── */
/* Episode group title row */
.va-ep-group td {
  padding: 5px 8px !important;
  background: var(--c-subnav, #f3f4f6) !important;
  border-top: 1px solid var(--c-border, #e5e7eb) !important;
  border-bottom: none !important;
}
.va-ep-group-title {
  font-size: 12px;
  font-weight: 600;
  color: #4a9e4a;
  margin-right: 8px;
}
[data-theme="dark"] .va-ep-group td {
  background: var(--c-subnav, #111827) !important;
  border-color: var(--c-border, #374151) !important;
}
.va-card-body {
  padding: 6px 0;
}
.va-info-grid {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 16px 20px;
  align-items: start;
  padding-bottom: 8px;
  margin-bottom: 2px;
  border-bottom: 1px solid var(--c-border);
}
.va-info-col {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  width: 100%;
}
.va-anime-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--c-heading);
  margin: 0 0 4px;
}
.va-cover-col {
  display: flex;
  justify-content: flex-start;
}
.va-cover-img {
  width: 100%;
  max-width: 150px;
  height: auto;
  display: block;
  border-radius: 8px;
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.35);
}
.va-bottom-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  width: 100%;
  margin-top: 6px;
}
.va-rating-cell {
  font-size: 13px;
  color: var(--c-body);
}
.va-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

/* ── Game Console Cards (gc-) ── */
.gc-filter-fields {
  margin-bottom: 8px;
}
.gc-chevron {
  transition: transform 0.2s;
}
.gc-chevron-open {
  transform: rotate(180deg);
}
.gc-card {
  display: flex;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid var(--c-border);
}
.gc-cover {
  flex-shrink: 0;
  width: 110px;
}
.gc-cover-img {
  width: 110px;
  height: auto;
  display: block;
  border-radius: 6px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}
.gc-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.gc-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.gc-title {
  font-size: 16px;
  font-weight: 700;
  margin: 0;
  color: var(--c-heading);
}
.gc-title a {
  color: inherit;
  text-decoration: none;
}
.gc-title a:hover {
  color: var(--c-primary);
}
.gc-platform-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 20px;
  background: var(--c-primary, #2563eb);
  color: #fff;
  white-space: nowrap;
  flex-shrink: 0;
}
.gc-rating {
  font-size: 12px;
}
.gc-plot {
  font-size: 13px;
  color: var(--c-body);
  line-height: 1.5;
}
.gc-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 16px;
  font-size: 12px;
}
.gc-meta-item {
  color: var(--c-body);
}
.gc-meta-item strong {
  color: var(--c-heading);
  font-weight: 600;
}
.gc-links {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 2px;
}
.gc-releases {
  margin-bottom: 6px;
}
.gc-releases .br-table {
  border-top: none;
}

/* ── My Shows (ms-) ── */
.ms-today {
  margin-bottom: 22px;
}
.ms-today-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--c-muted);
  padding-bottom: 7px;
  border-bottom: 2px solid var(--c-primary);
  margin-bottom: 12px;
  align-items: center;
  gap: 6px;
  text-align: center;
}
.ms-today-label > i {
  color: #ef4444;
}
.ms-today-grid {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 4px;
  justify-content: center;
}
.ms-today-card {
  text-align: center;
  width: 150px;
  flex-shrink: 0;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  overflow: hidden;
  background: var(--c-popular-card-bg);
}
.ms-today-time {
  font-size: 10px;
  color: #00ff64;
  font-weight: 600;
  margin-bottom: 3px;
  background: var(--c-primary);
}
.ms-today-card img {
  width: 100%;
  display: block;
}
.ms-today-info {
  text-align: center;
}
.ms-today-show {
  font-size: 12px;
  font-weight: 600;
  color: var(--c-body) !important;
  text-decoration: none !important;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-bottom: -3px;
}
.ms-today-show:hover {
  color: var(--c-primary) !important;
}
.ms-today-ep {
  font-size: 11px;
  color: var(--c-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ms-today-code {
  font-size: 11px;
  color: var(--c-primary);
  font-weight: 600;
  margin-top: 2px;
}

.ms-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.ms-header-browse {
  margin-bottom: 0;
}
.ms-header-left {
  display: flex;
  align-items: center;
  gap: 8px;
}
.ms-page-title {
  font-size: 20px;
  font-weight: 700;
  color: var(--c-heading);
  margin: 0;
}
.ms-watchlist-tag {
  font-size: 12px;
  font-weight: 500;
  color: #22c55e;
  font-style: italic;
}
.ms-rss {
  font-size: 14px;
}
.ms-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: fit-content;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  overflow: hidden;
}
.ms-nav-link {
  font-size: 13px;
  color: var(--c-primary);
  text-decoration: none;
  padding: 5px 12px;
  border-right: 1px solid var(--c-border);
  background: var(--c-surface);
  transition: background 0.15s;
  white-space: nowrap;
}
.ms-nav-link:last-child {
  border-right: none;
}
.ms-nav-link:hover {
  background: var(--c-subnav, #f3f4f6);
  color: var(--c-primary);
}
.ms-nav-active {
  font-weight: 600;
  background: var(--c-primary, #2563eb) !important;
  color: #fff !important;
}
[data-theme="dark"] .ms-nav-link:hover {
  background: var(--c-subnav, #1f2937);
}

.ms-shows-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 14px;
  margin-bottom: 10px;
}
.ms-card {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  overflow: hidden;
  background: var(--c-surface);
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    border-color 0.18s;
}
.ms-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.13);
  border-color: rgba(37, 99, 235, 0.38);
}
.ms-cover {
  width: 100%;
  aspect-ratio: 2 / 3;
  overflow: hidden;
  background: var(--c-subnav, #f3f4f6);
  flex-shrink: 0;
  position: relative;
}
.ms-cover-link {
  display: block;
  width: 100%;
  height: 100%;
}
.ms-cover-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.22s ease;
  text-align: center;
}
.ms-card:hover .ms-cover-img {
  transform: scale(1.05);
}
.ms-cover-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.76);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px;
  opacity: 0;
  transition: opacity 0.2s;
  pointer-events: none;
}
.ms-card:hover .ms-cover-overlay {
  opacity: 1;
}
.ms-overlay-group {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  width: 100%;
}
.ms-overlay-label {
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: rgba(255, 255, 255, 0.45);
}
.ms-cover-overlay .ms-badge-cat {
  background: rgba(37, 99, 235, 0.35) !important;
  color: #93c5fd !important;
  border: 1px solid rgba(37, 99, 235, 0.5);
  white-space: normal;
  text-align: center;
  width: 100%;
  box-sizing: border-box;
}
.ms-cover-overlay .ms-badge-qual {
  background: rgba(20, 184, 166, 0.35) !important;
  color: #5eead4 !important;
  border: 1px solid rgba(20, 184, 166, 0.5);
  white-space: normal;
  text-align: center;
  width: 100%;
  box-sizing: border-box;
}
.ms-body {
  flex: 1;
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.ms-show-title {
  font-size: 12px;
  font-weight: 700;
  color: var(--c-heading);
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.35;
  margin-bottom: 1px;
  text-align: center;
}
.ms-show-title:hover {
  color: var(--c-primary);
}
.ms-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
}
.ms-badge-cat {
  display: inline-block;
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  background: rgba(37, 99, 235, 0.1);
  color: var(--c-primary);
  border-radius: 3px;
  padding: 1px 5px;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ms-badge-qual {
  display: inline-block;
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  background: rgba(20, 184, 166, 0.1);
  color: #14b8a6;
  border-radius: 3px;
  padding: 1px 5px;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ms-airdate {
  font-size: 10px;
  color: var(--c-muted);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
}
.ms-airdate-left {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.ms-airdate i {
  font-size: 9px;
  color: var(--c-primary);
  opacity: 0.65;
}
.ms-airdate-tba {
  font-style: italic;
  color: var(--c-muted);
}
.ms-status {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #fff;
  background: rgba(20, 184, 166, 0.5);
  border-radius: 3px;
  padding: 1px 5px;
}
.ms-status-ended {
  color: #fff;
  background: #ef4444;
}
.ms-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 10px;
  margin-top: auto;
  padding-top: 5px;
  border-top: 1px solid var(--c-border);
}
.ms-act-link {
  color: var(--c-primary);
  text-decoration: none;
  font-weight: 600;
}
.ms-act-link:hover {
  text-decoration: underline;
}
.ms-act-sep {
  display: none;
}
.ms-act-remove {
  color: #ef4444;
}
[data-theme="dark"] .ms-card:hover {
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.35);
}
.ms-upgrade-notice {
  text-align: center;
  padding: 32px 16px;
}
.ms-upgrade-notice i {
  font-size: 32px;
  color: var(--c-primary);
  margin-bottom: 12px;
  display: block;
}
.ms-upgrade-notice p {
  font-size: 16px;
  margin-bottom: 14px;
  color: var(--c-heading);
}
.ms-preview-img {
  max-width: 100%;
  margin-top: 20px;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}
@media (max-width: 768px) {
  .ms-shows-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
  }
}
@media (max-width: 480px) {
  .ms-shows-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }
}

/* ── My Shows Edit All (mea-) ── */
.mea-table-wrap {
  border: 1px solid var(--c-border);
  border-radius: 6px;
}
.mea-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
  table-layout: fixed;
}
.mea-th {
  padding: 5px 4px;
  text-align: center;
  font-size: 10px;
  font-weight: 600;
  border-bottom: 1px solid var(--c-border);
  border-right: 1px solid var(--c-border);
  white-space: nowrap;
  color: var(--c-heading);
  background: var(--c-subnav, #f3f4f6);
}
.mea-th:last-child {
  border-right: none;
}
.mea-th-show {
  text-align: left;
}
.mea-th-group-hdr {
  background: rgba(37, 99, 235, 0.12) !important;
  color: var(--c-primary) !important;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-bottom: 2px solid rgba(37, 99, 235, 0.3) !important;
}
.mea-th-group-hdr-qual {
  background: rgba(20, 184, 166, 0.12) !important;
  color: #14b8a6 !important;
  border-bottom-color: rgba(20, 184, 166, 0.3) !important;
}
.mea-th-cat {
  background: rgba(37, 99, 235, 0.2) !important;
  color: var(--c-primary) !important;
}
.mea-th-qual {
  background: rgba(20, 184, 166, 0.2) !important;
  color: #14b8a6 !important;
}
.mea-th-cat label,
.mea-th-qual label {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  cursor: pointer;
}
.mea-th-qual-first {
  border-left: 2px solid rgba(20, 184, 166, 0.3) !important;
}
.mea-th-size {
  width: 126px;
}
.mea-td {
  padding: 5px 4px;
  border-bottom: 1px solid var(--c-border);
  border-right: 1px solid var(--c-border);
  vertical-align: middle;
}
.mea-td:last-child {
  border-right: none;
}
.mea-td-chk {
  text-align: center;
}
.mea-td-cat {
  background: rgba(37, 99, 235, 0.2);
}
.mea-td-qual {
  background: rgba(20, 184, 166, 0.2);
}
.mea-td-size {
  white-space: nowrap;
}
.mea-row {
  background: var(--c-surface);
}
.mea-row.mea-alt {
  background: var(--c-subnav, #f9fafb);
}
[data-theme="dark"] .mea-row.mea-alt {
  background: var(--c-subnav, #1f2937);
}
.mea-show-link {
  font-size: 12px;
  font-weight: 600;
  color: var(--c-primary);
  text-decoration: none;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mea-show-link:hover {
  text-decoration: underline;
}
.mea-chk {
  cursor: pointer;
  width: 13px;
  height: 13px;
  accent-color: var(--c-primary);
}
.mea-select {
  font-size: 10px;
  padding: 5px 2px;
  border: 1px solid var(--c-border);
  border-radius: 4px;
  background: var(--c-surface);
  color: var(--c-body);
  text-align: center;
}
.mea-browse-row {
  padding: 0 !important;
}
.mys-browse-row {
  padding: 10px 0;
}
.mea-footer {
  margin-top: 10px;
}
.mea-row-chk {
  accent-color: #ef4444;
}

.hdspnactive {
  background-color: #87cefa;
  color: #fff;
  padding: 1px 6px;
  border-radius: 3px;
  display: inline-block;
}

/* ═══════════════════════════════════════
   Cinema Poster Grid  (moviescinema.tpl)
═══════════════════════════════════════ */
.cmc-search-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 12px;
  border-radius: 30px;
  border: 1px solid var(--c-border, #d1d5db);
  background: var(--c-surface, #fff);
  color: var(--c-secondary, #6b7280);
  font-size: 12px;
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  transition:
    background 0.15s,
    border-color 0.15s,
    color 0.15s;
}
.cmc-search-toggle:hover,
.cmc-search-toggle.cmc-search-active {
  background: var(--c-primary, #2563eb);
  border-color: var(--c-primary, #2563eb);
  color: #fff;
}
.cmc-chevron {
  font-size: 11px;
  transition: transform 0.2s ease;
}
.cmc-chevron-open {
  transform: rotate(180deg);
}
.cmc-filter-fields {
  margin-bottom: 4px;
}
/* ── Sort + filter bar ── */
.cmc-sort-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0 12px;
}
.cmc-sort-pills {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  align-items: center;
}
.cmc-sort-btn {
  display: inline-block;
  padding: 1px 10px;
  border-radius: 30px;
  border: 1px solid var(--c-border, #d1d5db);
  background: var(--c-surface, #fff);
  color: var(--c-secondary, #6b7280);
  font-size: 12px;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition:
    background 0.15s,
    border-color 0.15s,
    color 0.15s;
}
.cmc-sort-btn:hover,
.cmc-sort-btn.active {
  background: var(--c-primary, #2563eb);
  border-color: var(--c-primary, #2563eb);
  color: #fff;
  text-decoration: none;
}
.cmc-filter-form {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.cmc-filter-label {
  font-size: 13px;
  color: var(--text-secondary, #6b7280);
}
/* ── Poster grid ── */
.cmc-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 14px;
  padding: 4px 0 16px;
}
.cmc-card {
  border-radius: 8px;
  overflow: hidden;
  background: var(--surface, #fff);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}
.cmc-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.16);
}
.cmc-poster-wrap {
  position: relative;
  aspect-ratio: 2 / 3;
  overflow: hidden;
  background: var(--surface-alt, #f3f4f6);
  text-align: center;
}
.cmc-poster-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
/* ── Hover overlay ── */
.cmc-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.72);
  opacity: 0;
  transition: opacity 0.28s ease;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 36px 8px 8px;
}
.cmc-card:hover .cmc-overlay {
  opacity: 1;
}
.cmc-overlay-badges {
  position: absolute;
  top: 6px;
  left: 0;
  right: 0;
  padding: 0 5px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 4px;
}
.cmc-badge {
  display: inline-block;
  font-size: 10px;
  line-height: 1.2;
  padding: 2px 5px;
  border-radius: 3px;
  border: 1px solid rgba(255, 255, 255, 0.55);
  color: #fff;
  background: rgba(0, 0, 0, 0.45);
  white-space: nowrap;
}
.cmc-res {
  border-color: rgba(37, 99, 235, 0.8);
  background: rgba(37, 99, 235, 0.5);
}
/* ── New / Flagged card corner ribbons ── */
.cmc-card-new .cmc-poster-wrap::after {
  content: 'NEW';
  position: absolute;
  top: 3px;
  left: -30px;
  width: 100px;
  padding: 2px 0;
  background: #16c784;
  color: #fff;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-align: center;
  transform: rotate(-45deg);
  z-index: 10;
  pointer-events: none;
  box-shadow: 0 2px 4px rgba(0,0,0,.3);
}
.cmc-card-flagged .cmc-poster-wrap::after {
  content: 'REPORTED';
  position: absolute;
  top: 16px;
  right: -30px;
  width: 120px;
  padding: 4px 0;
  background: #dc2626;
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-align: center;
  transform: rotate(45deg);
  z-index: 10;
  pointer-events: none;
  box-shadow: 0 2px 6px rgba(0,0,0,.35);
}
.cmc-more-btn {
  display: inline-block;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.8);
  border-radius: 5px;
  padding: 5px 14px;
  font-size: 12px;
  text-decoration: none;
  transition: background 0.15s;
}
.cmc-more-btn:hover {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
  text-decoration: none;
}
.cmc-downloads {
  color: rgba(255, 255, 255, 0.75);
  font-size: 11px;
}
/* ── Card info (below poster) ── */
.cmc-info {
  text-align: center;
}
.cmc-title {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-primary, #111827);
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cmc-title:hover {
  color: var(--accent, #2563eb);
}
.cmc-meta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  font-size: 11px;
}
.cmc-meta-movie {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 5px;
}
.cmc-year {
  color: var(--text-muted, #9ca3af);
  text-decoration: none;
}
.cmc-year:hover {
  color: var(--accent, #2563eb);
}
.cmc-rating {
  color: #f59e0b;
  font-size: 13px;
}
.cmc-rating .fa-star {
  font-size: 10px;
}
[data-theme="dark"] .cmc-search-toggle {
  background: var(--c-surface, #1f2937);
  border-color: var(--c-border, #374151);
  color: var(--c-secondary, #9ca3af);
}
[data-theme="dark"] .cmc-search-toggle:hover,
[data-theme="dark"] .cmc-search-toggle.cmc-search-active {
  background: var(--c-primary, #2563eb);
  border-color: var(--c-primary, #2563eb);
  color: #fff;
}
[data-theme="dark"] .cmc-sort-btn {
  background: var(--c-surface, #1f2937);
  border-color: var(--c-border, #374151);
  color: var(--c-secondary, #9ca3af);
}
[data-theme="dark"] .cmc-card {
  background: var(--surface, #1f2937);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
}
[data-theme="dark"] .cmc-poster-wrap {
  background: #111827;
}
[data-theme="dark"] .cmc-title {
  color: var(--text-primary, #f9fafb);
}
/* ═══════════════════════════════════════
   Series Detail Page (viewseries.tpl)
═══════════════════════════════════════ */
.vs-season-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin: 10px 0 12px;
}
.vs-season-tab {
  display: inline-block;
  padding: 4px 13px;
  border-radius: 16px;
  border: 1px solid var(--c-border, #d1d5db);
  background: var(--c-surface, #fff);
  color: var(--c-secondary, #6b7280);
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  transition:
    background 0.12s,
    border-color 0.12s,
    color 0.12s;
}
.vs-season-tab:hover,
.vs-season-tab.active {
  background: var(--c-primary, #2563eb);
  border-color: var(--c-primary, #2563eb);
  color: #fff;
  text-decoration: none;
}
.vs-release-table {
  margin-bottom: 12px;
}
.vs-season-hdr td {
  padding: 10px 14px !important;
  background: linear-gradient(to right, rgba(37, 99, 235, 0.07), transparent) !important;
  border-top: 2px solid var(--c-border, #e5e7eb) !important;
  border-bottom: 1px solid var(--c-border, #e5e7eb) !important;
  border-left: 3px solid var(--c-primary, #2563eb) !important;
}
.vs-season-hdr-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.vs-season-ops {
  display: flex;
  align-items: center;
  gap: 5px;
  flex-shrink: 0;
}
.vs-season-ops small {
  font-size: 11px;
  color: var(--c-secondary, #6b7280);
  margin-right: 2px;
}
.vs-season-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: var(--c-primary, #2563eb);
  text-transform: uppercase;
  letter-spacing: 0.07em;
}
.vs-season-label::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--c-primary, #2563eb);
  flex-shrink: 0;
}
[data-theme="dark"] .vs-season-hdr td {
  background: linear-gradient(to right, rgba(37, 99, 235, 0.12), transparent) !important;
  border-color: var(--c-border, #374151) !important;
  border-left-color: var(--c-primary, #3b82f6) !important;
}
[data-theme="dark"] .vs-season-label {
  color: var(--c-primary, #3b82f6);
}
[data-theme="dark"] .vs-season-label::before {
  background: var(--c-primary, #3b82f6);
}
/* Episode info row */
.vs-episode-info td {
  padding: 5px 8px !important;
  background: var(--c-subnav, #f3f4f6) !important;
  border-top: 1px solid var(--c-border, #e5e7eb) !important;
  border-bottom: none !important;
}
.vs-ep-num {
  display: inline-block;
  font-weight: 700;
  font-size: 10px;
  background: var(--c-primary, #2563eb);
  color: #fff;
  padding: 0px 10px;
  border-radius: 30px;
  margin-right: 6px;
}
.vs-ep-airdate {
  font-size: 11px;
  color: #b565c4;
  margin-right: 8px;
}
.vs-ep-title {
  font-size: 12px;
  font-weight: 600;
  color: #4a9e4a;
  margin-right: 8px;
}
.vs-ep-summary {
  font-size: 11px;
  color: var(--c-secondary, #6b7280);
}
.epmore,
.epless {
  font-size: 11px;
  color: var(--c-link, #2563eb);
  text-decoration: none;
  margin-left: 3px;
}
[data-theme="dark"] .vs-season-tab {
  background: var(--c-surface, #1f2937);
  border-color: var(--c-border, #374151);
  color: var(--c-secondary, #9ca3af);
}
[data-theme="dark"] .vs-episode-info td {
  background: var(--c-subnav, #111827) !important;
  border-color: var(--c-border, #374151) !important;
}
.vs-hidden {
  display: none;
}
/* TV cover page — episode info below poster card */
.cmc-ep-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  color: #fff;
  background: var(--c-primary, #2563eb);
  padding: 0px 10px;
  border-radius: 30px;
  white-space: nowrap;
  flex-shrink: 0;
}
.mv-title-badge {
  font-size: 12px;
  vertical-align: middle;
}
.br-ep-badge {
  margin-left: 6px;
  vertical-align: middle;
}
.cmc-ep-title {
  font-size: 11px;
  color: var(--c-secondary, #6b7280);
  white-space: normal;
  word-break: break-word;
  text-align: center;
  line-height: 1.3;
}

/* Series release table — column widths match viewmoviefull.tpl */
.vs-release-table {
  table-layout: fixed;
}
.vs-release-table th.br-col-cat {
  width: 7%;
}
.vs-release-table th.br-col-info {
  width: 10%;
}
.vs-release-table th.br-col-posted {
  width: 5%;
}
.vs-release-table th.br-col-size {
  width: 7%;
}
.vs-release-table th.br-col-hits {
  width: 6%;
}
.vs-release-table th.br-col-cmts {
  width: 4%;
}
.vs-release-table th.br-col-links {
  width: 6%;
}
.vs-release-table th.br-col-chk {
  width: 3%;
}

/* ═══════════════════════════════════════
   Myshows Add/Edit Page (myshows-add.tpl)
═══════════════════════════════════════ */
.msa-title-stack {
  display: flex;
  flex-direction: column;
}
.msa-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.msa-breadcrumb {
  font-size: 11px;
  color: #22c55e;
}
.msa-show-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--c-text);
  margin: 0 0 16px;
}
.msa-layout {
  display: flex;
  gap: 28px;
  align-items: stretch;
  margin-top: 12px;
}
.msa-cover {
  flex: 0 0 200px;
  display: flex;
  align-items: center;
}
.msa-cover-img {
  width: 100%;
  border-radius: 6px;
  display: block;
}
.msa-form {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-top: 1px solid var(--c-border);
  border-bottom: 1px solid var(--c-border);
  padding: 20px 0;
}
.msa-section {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 14px;
}
.msa-section-label {
  flex: 0 0 90px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--c-primary);
  display: flex;
  align-items: center;
  gap: 4px;
}
.msa-section-label-qual {
  color: #14b8a6;
}
.msa-checks {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 16px;
}
.msa-check-label {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  cursor: pointer;
  color: var(--c-text);
  user-select: none;
}
.msa-check-label input[type="checkbox"] {
  accent-color: var(--c-primary);
  width: 13px;
  height: 13px;
  cursor: pointer;
}
.msa-size-row {
  display: flex;
  gap: 8px;
  align-items: center;
}
.msa-select {
  font-size: 11px;
  padding: 3px 6px;
  border: 1px solid var(--c-border);
  border-radius: 4px;
  background: var(--c-surface);
  color: var(--c-text);
}
.msa-footer {
  margin-top: 20px;
}

@media (max-width: 600px) {
  .msa-layout {
    flex-direction: column;
  }
  .msa-cover {
    width: 140px;
  }
  .msa-section {
    flex-direction: column;
    align-items: flex-start;
  }
  .msa-section-label {
    flex: none;
  }
}

/* browse-row with no left side (myshows) — push filter to the right */
.browse-row-myshows {
  justify-content: flex-end !important;
  padding: 0 !important;
}

/* ═══════════════════════════════════════
   Series List Page (viewserieslist.tpl)
═══════════════════════════════════════ */

/* Toolbar: letter nav + country + search */
.vsl-toolbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin: 12px 0 8px;
  padding: 8px 12px;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  background: var(--c-surface);
}
.vsl-jumpbar-wrap {
  flex: 1;
  width: auto !important;
  float: none !important;
}
.vsl-jumpbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 3px;
}
.vsl-jump-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--c-text-muted);
  margin-right: 6px;
  white-space: nowrap;
}
.vsl-pill {
  display: inline-block;
  padding: 2px 7px;
  font-size: 11px;
  font-weight: 600;
  color: var(--c-text-muted);
  border-radius: 4px;
  text-decoration: none;
  transition:
    background 0.15s,
    color 0.15s;
}
.vsl-pill:hover {
  background: var(--c-border);
  color: var(--c-text);
}
.vsl-pill-active {
  background: var(--c-primary) !important;
  color: #fff !important;
}

/* Pager + search on one row */
.vsl-pager-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 8px 0;
}
.vsl-pager-row > div.pager {
  flex: 1;
}

.vsl-country,
.vsl-country form {
  float: none !important;
  width: auto !important;
  display: flex;
  align-items: center;
}
.vsl-select {
  font-size: 12px;
  padding: 5px 8px;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  background: var(--c-surface);
  color: var(--c-text);
  cursor: pointer;
}
.vsl-search-form {
  display: flex !important;
  align-items: center;
  gap: 6px;
  float: none !important;
  margin: 0 0 0 auto !important;
  width: auto !important;
}
.vsl-search-label {
  font-size: 11px;
  color: var(--c-text-muted);
  white-space: nowrap;
}
.vsl-search-input {
  font-size: 12px;
  padding: 5px 8px;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  background: var(--c-surface);
  color: var(--c-text);
  width: 180px;
}
.vsl-search-btn {
  font-size: 12px;
  padding: 5px 12px;
  background: var(--c-primary);
  color: #fff;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-weight: 600;
  line-height: 1;
}
.vsl-search-btn:hover {
  background: #1d4ed8;
}

/* Letter group header */
.vsl-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 4px !important;
}
.vsl-letter-head {
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--c-primary) !important;
  padding: 0 !important;
  border-bottom: 1px solid var(--c-border);
  margin: 0 0 2px !important;
}

/* Series item */
.vsl-item {
  display: flex !important;
  gap: 14px !important;
  padding: 12px 0 !important;
  border-bottom: 1px solid var(--c-border) !important;
  align-items: flex-start !important;
  background: none !important;
}
.vsl-item:last-child {
  border-bottom: none !important;
}

/* Cover image */
.vsl-item .image_details {
  flex: 0 0 72px !important;
  float: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.vsl-item .image_details img.shadow {
  width: 72px !important;
  height: 100px !important;
  object-fit: cover;
  border-radius: 6px;
  display: block !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18) !important;
}

/* Item body */
.vsl-item .contents {
  flex: 1 !important;
  min-width: 0 !important;
  float: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.vsl-item .contents > a.title {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--c-text) !important;
  text-decoration: none !important;
  display: block !important;
  margin-bottom: 3px !important;
  line-height: 1.3 !important;
}
.vsl-item .contents > a.title font {
  font-size: inherit !important;
}
.vsl-item .contents > a.title:hover {
  color: var(--c-primary) !important;
}
.vsl-last-aired {
  font-size: 11px;
  color: var(--c-text-muted);
  margin-bottom: 4px;
}
.vsl-item .contents .description {
  font-size: 12px !important;
  color: var(--c-text-muted) !important;
  line-height: 1.5 !important;
  margin: 4px 0 8px !important;
}
.vsl-item .contents .actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0px 18px !important;
  align-items: center !important;
}
.vsl-item .contents .actions .country_dtl {
  font-size: 11px !important;
  color: var(--c-text-muted) !important;
  float: none !important;
}
.vsl-item .contents .actions .genre {
  font-size: 11px !important;
  color: var(--c-text-muted) !important;
  float: none !important;
  width: 100% !important;
  order: -1;
  margin-bottom: 2px;
}
.vsl-item .contents .actions .country_dtl b,
.vsl-item .contents .actions .genre b {
  color: var(--c-text) !important;
  font-weight: 600 !important;
}
.vsl-item .contents .actions .genre font {
  color: #14b8a6 !important;
}
.vsl-item .contents .actions .country_dtl a {
  color: #a855f7 !important;
  text-decoration: none !important;
}
.vsl-item .contents .watch_list {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 11px !important;
  float: none !important;
}
.vsl-item .contents .watch_list b {
  color: var(--c-text) !important;
  font-weight: 600 !important;
}
.vsl-item .contents .watch_list a.myshows[rel="edit"] {
  color: var(--c-primary) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
.vsl-item .contents .watch_list a.myshows[rel="add"] {
  color: #22c55e !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
.vsl-item .contents .watch_list a.myshows[rel="remove"] {
  color: #ef4444 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
.vsl-item .contents .buttons {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  float: none !important;
}
.vsl-item .contents .buttons img {
  height: 16px !important;
  vertical-align: middle !important;
}

@media (max-width: 640px) {
  .vsl-toolbar {
    padding: 10px;
  }
  .vsl-controls {
    flex-direction: column;
    align-items: flex-start;
  }
  .vsl-search-input {
    width: 130px;
  }
  .vsl-item {
    gap: 10px !important;
  }
  .vsl-item .image_details {
    flex: 0 0 56px !important;
  }
  .vsl-item .image_details img.shadow {
    width: 56px !important;
    height: 78px !important;
  }
}

/* ═══════════════════════════════════════
   My Movies Search Results (mymovielist.tpl)
═══════════════════════════════════════ */
.mml-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 14px;
  margin-top: 14px;
}
.mml-card {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  overflow: hidden;
  background: var(--c-surface);
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    border-color 0.18s;
}
.mml-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.13);
  border-color: rgba(37, 99, 235, 0.38);
}
.mml-cover {
  width: 100%;
  aspect-ratio: 2 / 3;
  overflow: hidden;
  background: var(--c-border);
  position: relative;
  flex-shrink: 0;
}
.mml-cover-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.22s ease;
}
.mml-card:hover .mml-cover-img {
  transform: scale(1.05);
}
.mml-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.76);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px;
  opacity: 0;
  transition: opacity 0.2s;
  pointer-events: none;
}
.mml-card:hover .mml-overlay {
  opacity: 1;
  pointer-events: auto;
}
.mml-overlay-btn {
  display: inline-block;
  padding: 6px 14px;
  font-size: 11px;
  font-weight: 700;
  border-radius: 5px;
  text-decoration: none;
  background: rgba(255, 255, 255, 0.15);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.3);
  transition: background 0.15s;
  text-align: center;
  width: 100%;
  box-sizing: border-box;
  cursor: pointer;
}
.mml-overlay-btn:hover {
  background: var(--c-primary);
  border-color: var(--c-primary);
  color: #fff;
}
.mml-overlay-imdb:hover {
  background: #f5c518;
  border-color: #f5c518;
  color: #000;
}
.mml-body {
  flex: 1;
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.mml-title {
  font-size: 12px;
  font-weight: 700;
  color: var(--c-text);
  text-decoration: none;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.mml-title:hover {
  color: var(--c-primary);
}
.mml-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.mml-year {
  font-size: 10px;
  color: var(--c-text-muted);
}
.mml-rating {
  font-size: 10px;
  color: #f59e0b;
  font-weight: 600;
}
.mml-plot {
  font-size: 10px;
  color: var(--c-text-muted);
  line-height: 1.4;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.mml-actions {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  margin-top: auto;
  padding-top: 6px;
}
.mml-btn {
  display: inline-flex;
  align-items: center;
  font-size: 10px;
  font-weight: 600;
  padding: 4px 8px;
  border-radius: 4px;
  text-decoration: none;
  background: var(--c-border);
  color: var(--c-text);
  border: none;
  cursor: pointer;
  transition: background 0.15s;
}
.mml-btn:hover {
  background: var(--c-primary);
  color: #fff;
}
.mml-btn-add {
  background: rgba(34, 197, 94, 0.15);
  color: #16a34a;
}
.mml-btn-add:hover {
  background: #22c55e;
  color: #fff;
}
.mml-btn-remove {
  background: rgba(239, 68, 68, 0.12);
  color: #dc2626;
}
.mml-btn-remove:hover {
  background: #ef4444;
  color: #fff;
}

/* My Movies list results (mymovielist.tpl) */
.mml-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.mml-list-item {
  display: flex !important;
  gap: 14px !important;
  padding: 12px 0 !important;
  border-bottom: 1px solid var(--c-border) !important;
  align-items: flex-start !important;
}
.mml-list-item:last-child {
  border-bottom: none !important;
}
.mml-list-cover {
  flex: 0 0 72px !important;
}
.mml-list-cover-img {
  width: 72px !important;
  height: 100px !important;
  object-fit: cover;
  border-radius: 6px;
  display: block !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
}
.mml-list-body {
  flex: 1 !important;
  min-width: 0 !important;
}
.mml-list-title {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--c-text) !important;
  text-decoration: none !important;
  display: block !important;
  margin-bottom: 3px !important;
  line-height: 1.3 !important;
}
.mml-list-title:hover {
  color: var(--c-primary) !important;
}
.mml-list-year {
  font-size: 12px;
  font-weight: 400;
  color: var(--c-text-muted);
}
.mml-list-rating {
  font-size: 11px;
  color: #f59e0b;
  font-weight: 600;
  margin-bottom: 4px;
}
.mml-list-plot {
  font-size: 12px;
  color: var(--c-text-muted);
  line-height: 1.5;
  margin-bottom: 8px;
}
.mml-list-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.mml-list-btn {
  display: inline-flex;
  align-items: center;
  font-size: 11px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 5px;
  text-decoration: none;
  background: var(--c-border);
  color: var(--c-text);
  cursor: pointer;
  transition:
    background 0.15s,
    color 0.15s;
  border: none;
}
.mml-list-btn:hover {
  background: var(--c-primary);
  color: #fff;
}
.mml-list-btn-primary {
  background: var(--c-primary);
  color: #fff;
}
.mml-list-btn-primary:hover {
  background: #1d4ed8;
  color: #fff;
}
.mml-list-btn-imdb {
  background: rgba(245, 197, 24, 0.15);
  color: #92730a;
}
.mml-list-btn-imdb:hover {
  background: #f5c518;
  color: #000;
}
.mml-list-btn-add {
  background: rgba(34, 197, 94, 0.15);
  color: #16a34a;
}
.mml-list-btn-add:hover {
  background: #22c55e;
  color: #fff;
}
.mml-list-btn-remove {
  background: rgba(239, 68, 68, 0.12);
  color: #dc2626;
}
.mml-list-btn-remove:hover {
  background: #ef4444;
  color: #fff;
}

/* My Movies search form */
.mml-search-form {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 24px auto;
  width: fit-content;
}
.mml-search-label {
  font-size: 11px;
  font-weight: 700;
  color: var(--c-text-muted);
  white-space: nowrap;
  flex-shrink: 0;
}
.mml-search-input {
  width: 280px;
  font-size: 12px;
  padding: 6px 10px;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  background: var(--c-surface);
  color: var(--c-text);
  outline: none;
}
.mml-search-input:focus {
  border-color: var(--c-primary);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}
.mml-search-btn {
  font-size: 12px;
  font-weight: 600;
  padding: 6px 14px;
  background: var(--c-primary);
  color: #fff;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}
.mml-search-btn:hover {
  background: #1d4ed8;
}

.mml-loading {
  text-align: center;
  padding: 40px 0;
  font-size: 14px;
  color: var(--c-text-muted);
}
.mml-loading .fa-circle-notch {
  font-size: 28px;
  color: var(--c-primary);
  display: block;
  margin-bottom: 8px;
}

@media (max-width: 1024px) {
  .mml-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media (max-width: 768px) {
  .mml-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 480px) {
  .mml-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ═══════════════════════════════════════
   My Movies Manage page (mymoviesedit.tpl) — mme-*
═══════════════════════════════════════ */
.mme-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
}
.mme-card {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  overflow: hidden;
  background: var(--c-surface);
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    border-color 0.18s;
}
.mme-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.13);
  border-color: rgba(37, 99, 235, 0.38);
}
.mme-cover {
  width: 100%;
  aspect-ratio: 2/3;
  overflow: hidden;
  background: var(--c-subnav, #f3f4f6);
  flex-shrink: 0;
  position: relative;
}
.mme-cover-link {
  display: block;
  width: 100%;
  height: 100%;
}
.mme-cover-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.22s ease;
}
.mme-card:hover .mme-cover-img {
  transform: scale(1.05);
}
.mme-cover-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.76);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px;
  opacity: 0;
  transition: opacity 0.2s;
  pointer-events: none;
}
.mme-card:hover .mme-cover-overlay {
  opacity: 1;
}
.mme-badge-cat {
  display: inline-block;
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  background: rgba(37, 99, 235, 0.35);
  color: #93c5fd;
  border: 1px solid rgba(37, 99, 235, 0.5);
  border-radius: 3px;
  padding: 2px 6px;
  white-space: normal;
  text-align: center;
  width: 100%;
  box-sizing: border-box;
}
.mme-badge-qual {
  display: inline-block;
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  background: rgba(20, 184, 166, 0.35);
  color: #5eead4;
  border: 1px solid rgba(20, 184, 166, 0.5);
  border-radius: 3px;
  padding: 2px 6px;
  white-space: normal;
  text-align: center;
  width: 100%;
  box-sizing: border-box;
}
.mme-body {
  flex: 1;
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.mme-title {
  font-size: 12px;
  font-weight: 700;
  color: var(--c-heading);
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.35;
  text-align: center;
}
.mme-title:hover {
  color: var(--c-primary);
}
.mme-rating {
  font-size: 12px;
  font-weight: 600;
  color: #f59e0b;
}
.mme-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 10px;
  margin-top: auto;
  padding-top: 5px;
  border-top: 1px solid var(--c-border);
}
.mme-movie-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 10px;
  margin-top: auto;
  padding-top: 5px;
}
.mme-act-link {
  color: var(--c-primary);
  text-decoration: none;
  font-weight: 600;
}
.mme-act-link:hover {
  text-decoration: underline;
}
.mme-act-imdb {
  color: #92730a;
}
.mme-act-imdb:hover {
  color: #000;
}
.mme-act-remove {
  color: #ef4444;
}

@media (max-width: 1024px) {
  .mme-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 600px) {
  .mme-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ═══════════════════════════════════════
   My Movies Add/Edit Filters (mymovies-add.tpl) — mma-*
═══════════════════════════════════════ */
.mma-title-stack {
  display: flex;
  flex-direction: column;
}
.mma-show-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--c-text);
  margin: 0 0 16px;
}
.mma-show-year {
  font-weight: 400;
  color: var(--c-text-muted);
  font-size: 15px;
  margin-left: 4px;
}
.mma-layout {
  display: flex;
  gap: 28px;
  align-items: stretch;
  margin-top: 12px;
}
.mma-cover {
  flex: 0 0 200px;
  display: flex;
  align-items: center;
}
.mma-cover-img {
  width: 100%;
  border-radius: 6px;
  display: block;
}
.mma-form {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-top: 1px solid var(--c-border);
  border-bottom: 1px solid var(--c-border);
  padding: 20px 0;
}
.mma-section {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 14px;
}
.mma-section-label {
  flex: 0 0 90px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--c-primary);
  display: flex;
  align-items: center;
  gap: 4px;
}
.mma-section-label-qual {
  color: #14b8a6;
}
.mma-checks {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 16px;
}
.mma-check-label {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  cursor: pointer;
  color: var(--c-text);
  user-select: none;
}
.mma-check-label input[type="checkbox"] {
  accent-color: var(--c-primary);
  width: 13px;
  height: 13px;
  cursor: pointer;
}
.mma-footer {
  margin-top: 20px;
  display: flex;
  gap: 8px;
  align-items: center;
}

@media (max-width: 600px) {
  .mma-layout {
    flex-direction: column;
  }
  .mma-cover {
    width: 140px;
  }
  .mma-section {
    flex-direction: column;
    align-items: flex-start;
  }
  .mma-section-label {
    flex: none;
  }
}

/* ═══════════════════════════════════════
   Forum Category Page (forum_cat.tpl) — frc-*
═══════════════════════════════════════ */
tr.hidelatestpost {
  display: none;
}
.frc-header-right {
  display: flex;
  align-items: center;
}
.frc-search-form {
  display: flex;
  gap: 6px;
  align-items: center;
}
.frc-search-input {
  font-size: 12px;
  padding: 6px 10px;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  background: var(--c-surface);
  color: var(--c-text);
  width: 200px;
  outline: none;
}
.frc-search-input:focus {
  border-color: var(--c-primary);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}
.frc-search-btn {
  padding: 6px 12px;
  background: var(--c-primary);
  color: #fff;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-size: 12px;
}
.frc-search-btn:hover {
  background: #1d4ed8;
}

/* Card wrapper */
.frc-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 20px;
}

/* Table base */
.frc-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}
.frc-table thead th {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--c-text-muted);
  padding: 6px 10px;
  border: 1px solid var(--c-border);
  background: rgba(0, 0, 0, 0.025);
}
[data-theme="dark"] .frc-table thead th {
  background: rgba(255, 255, 255, 0.03);
}
.frc-table tbody tr {
  transition: background 0.12s;
}
.frc-table tbody tr:hover {
  background: rgba(37, 99, 235, 0.04);
}
.frc-table tbody td {
  padding: 6px 10px;
  vertical-align: middle;
  border: 1px solid var(--c-border);
}

/* Section title row (colspan spanning full width) */
.frc-table-title {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: var(--c-primary) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  padding: 7px 10px !important;
  border-bottom: 1px solid var(--c-border) !important;
  background: rgba(37, 99, 235, 0.04) !important;
}
.frc-table-title i {
  margin-right: 6px;
}
.frc-title-left {
  text-align: left !important;
}

/* Subheader row for recent posts */
.frc-table-subhead th {
  background: rgba(0, 0, 0, 0.015) !important;
  font-size: 9px !important;
  color: var(--c-text-muted) !important;
  text-align: center;
}
.frc-table-subhead th:first-child {
  text-align: left;
}
[data-theme="dark"] .frc-table-subhead th {
  background: rgba(255, 255, 255, 0.02) !important;
}

/* Column alignments */
.frc-th-center {
  text-align: center;
}
.frc-th-stat {
  text-align: center;
}
.frc-th-last {
  text-align: left;
}
.frc-td-center {
  text-align: center;
}
.frc-td-stat {
  font-size: 12px;
  font-weight: 600;
  color: var(--c-text);
  text-align: center;
}
.frc-td-time {
  font-size: 11px;
  color: var(--c-text-muted);
  white-space: nowrap;
}
.frc-td-cat {
  font-size: 11px;
  color: var(--c-text-muted);
}

/* Recent posts cells */
.frc-post-cell {
  min-width: 0;
}
.frc-post-title {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--c-text);
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.frc-post-title:hover {
  color: var(--c-primary);
}
.frc-post-preview {
  display: block;
  font-size: 11px;
  color: var(--c-text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Recent posts footer */
.frc-recent-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 14px;
  border-top: 1px solid var(--c-border);
}
.frc-load-more {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 600;
  color: var(--c-text-muted);
  text-decoration: none;
}
.frc-load-more:hover {
  color: var(--c-primary);
}
.frc-board-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 600;
  color: var(--c-text-muted);
  text-decoration: none;
}
.frc-board-link:hover {
  color: var(--c-primary);
}

/* Forum rows */
.frc-icon-cell {
  width: 52px;
}
.frc-icon {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  background: rgba(37, 99, 235, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--c-primary);
  font-size: 14px;
}
.frc-forum-cell {
  min-width: 0;
}
.frc-forum-name {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: var(--c-text);
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.frc-forum-row:hover .frc-forum-name {
  color: var(--c-primary);
}
.frc-forum-tag {
  display: block;
  font-size: 11px;
  color: var(--c-text-muted);
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.frc-last-cell {
  width: 180px;
}
.frc-last-date {
  display: block;
  font-size: 11px;
  font-weight: 500;
  color: var(--c-text);
  text-align: center;
}
.frc-last-by {
  display: block;
  font-size: 10px;
  color: var(--c-text-muted);
  margin-top: 2px;
  text-align: center;
}
.frc-last-empty {
  color: var(--c-text-muted);
  opacity: 0.4;
}

/* Role colours */
.frc-role-admin {
  color: #ef4444;
  font-weight: 700;
}
.frc-role-moderator {
  color: var(--c-primary);
  font-weight: 700;
}
.frc-role-editor {
  color: #a855f7;
  font-weight: 700;
}
.frc-role-lult {
  color: #f97316;
  font-weight: 700;
}
.frc-role-platinum {
  color: #94a3b8;
  font-weight: 700;
}
.frc-role-vip {
  color: #22c55e;
  font-weight: 700;
}

@media (max-width: 768px) {
  .frc-table {
    table-layout: auto;
  }
  .frc-th-stat,
  .frc-td-stat,
  .frc-last-cell,
  .frc-th-last {
    display: none;
  }
  .frc-icon-cell {
    width: 44px;
  }
}

/* ═══════════════════════════════════════
   Search Forum Page (searchforum.tpl) — srf-*
═══════════════════════════════════════ */
.srf-bc-link {
  color: var(--c-text-muted);
  text-decoration: none;
}
.srf-bc-link:hover {
  color: var(--c-primary);
}
.srf-breadcrumb {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--c-text-muted);
  margin-top: 2px;
}
.srf-breadcrumb-link {
  color: var(--c-text-muted);
  text-decoration: none;
}
.srf-breadcrumb-link:hover {
  color: var(--c-primary);
}
.srf-breadcrumb-sep {
  opacity: 0.4;
}
.srf-header-right {
  display: flex;
  align-items: center;
}
.srf-search-form {
  display: flex;
  gap: 6px;
  align-items: center;
}
.srf-search-input {
  font-size: 12px;
  padding: 6px 10px;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  background: var(--c-surface);
  color: var(--c-text);
  width: 220px;
  outline: none;
}
.srf-search-input:focus {
  border-color: var(--c-primary);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}
.srf-search-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 14px;
  background: var(--c-primary);
  color: #fff;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
}
.srf-search-btn:hover {
  background: #1d4ed8;
}

/* Results card */
.srf-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 20px;
}
.srf-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}
.srf-table-head th {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--c-text-muted);
  padding: 5px 8px;
  border: 1px solid var(--c-border);
  background: rgba(0, 0, 0, 0.025);
  text-align: left;
}
[data-theme="dark"] .srf-table-head th {
  background: rgba(255, 255, 255, 0.03);
}
.srf-th-center {
  text-align: center !important;
}
.srf-table tbody tr {
  transition: background 0.12s;
}
.srf-table tbody tr:hover {
  background: rgba(37, 99, 235, 0.04);
}
.srf-table tbody td {
  padding: 4px 8px;
  vertical-align: middle;
  border: 1px solid var(--c-border);
  line-height: 1.3;
}
.srf-topic-cell {
  min-width: 0;
}
.srf-sticky {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 10px;
  font-weight: 700;
  color: #f97316;
  margin-right: 6px;
}
.srf-topic-title {
  font-size: 12px;
  font-weight: 500;
  color: var(--c-text);
  text-decoration: none;
}
.srf-row:hover .srf-topic-title {
  color: var(--c-primary);
}
.srf-td-center {
  text-align: center;
}
.srf-td-cat {
  font-size: 11px;
  color: var(--c-text-muted);
  text-align: center;
}
.srf-td-stat {
  font-size: 12px;
  font-weight: 600;
  color: var(--c-text);
}
.srf-last-cell {
  min-width: 0;
}
.srf-last-date {
  display: block;
  font-size: 11px;
  font-weight: 500;
  color: var(--c-text);
  text-decoration: none;
  text-align: center;
}
.srf-last-date:hover {
  color: var(--c-primary);
}
.srf-last-by {
  display: block;
  font-size: 10px;
  color: var(--c-text-muted);
  text-align: center;
}
.srf-last-empty {
  color: var(--c-text-muted);
  opacity: 0.4;
}

/* Empty / no results */
.srf-no-results {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 48px 24px;
  text-align: center;
  color: var(--c-text-muted);
  font-size: 14px;
}
.srf-no-results-icon {
  font-size: 32px;
  margin-bottom: 12px;
  opacity: 0.4;
}

@media (max-width: 768px) {
  .srf-table {
    table-layout: auto;
  }
  .srf-td-stat,
  .srf-last-cell,
  .srf-table-head th:nth-child(3),
  .srf-table-head th:nth-child(4),
  .srf-table-head th:nth-child(5) {
    display: none;
  }
  .srf-td-cat {
    display: none;
  }
}

/* ═══════════════════════════════════════
   Forum Post / Thread Page (forum_post.tpl) — frp-*
═══════════════════════════════════════ */
.frp-header-right {
  display: flex;
  align-items: center;
  gap: 8px;
}
.frp-reply-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  background: var(--c-primary);
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
}
.frp-reply-btn:hover {
  background: #1d4ed8;
  color: #fff;
}

/* Thread container */
.frp-thread {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-bottom: 10px;
}

/* Single post */
.frp-post {
  display: flex;
  gap: 0;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  overflow: hidden;
}

/* User sidebar */
.frp-user {
  width: 130px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  padding: 14px 10px;
  border-right: 1px solid var(--c-border);
  background: rgba(0, 0, 0, 0.02);
  text-align: center;
}
[data-theme="dark"] .frp-user {
  background: rgba(255, 255, 255, 0.02);
}
.frp-avatar-img {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid var(--c-border);
}
.frp-avatar-placeholder {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: rgba(37, 99, 235, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: var(--c-primary);
}
.frp-username {
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  max-width: 110px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.frp-username:hover {
  text-decoration: underline;
}
.frp-role-badge {
  font-size: 10px;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 20px;
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
.frp-badge-admin,
.frp-badge-moderator {
  background: rgba(239, 68, 68, 0.12);
  color: #ef4444;
}
.frp-badge-editor {
  background: rgba(168, 85, 247, 0.12);
  color: #a855f7;
}
.frp-badge-lult {
  background: rgba(249, 115, 22, 0.12);
  color: #f97316;
}
.frp-badge-platinum {
  background: rgba(148, 163, 184, 0.12);
  color: #94a3b8;
}
.frp-badge-vip {
  background: rgba(34, 197, 94, 0.12);
  color: #22c55e;
}
.frp-badge-member {
  background: rgba(37, 99, 235, 0.08);
  color: var(--c-primary);
}
.frp-provider {
  font-size: 10px;
  color: #22c55e;
  font-weight: 600;
  max-width: 110px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.frp-warned {
  font-size: 10px;
  color: #ef4444;
  font-weight: 600;
}
.frp-post-date {
  font-size: 10px;
  color: var(--c-text-muted);
}
.frp-post-actions {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  justify-content: center;
}
.frp-act-btn {
  font-size: 10px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 4px;
  text-decoration: none;
  background: rgba(37, 99, 235, 0.08);
  color: var(--c-primary);
}
.frp-act-btn:hover {
  background: rgba(37, 99, 235, 0.18);
}
.frp-act-delete {
  background: rgba(239, 68, 68, 0.08);
  color: #ef4444;
}
.frp-act-delete:hover {
  background: rgba(239, 68, 68, 0.18);
}

/* Post content */
.frp-content {
  flex: 1;
  min-width: 0;
  padding: 14px 16px;
}
.frp-message {
  font-size: 13px;
  line-height: 1.6;
  color: var(--c-text);
  word-break: break-word;
}
.frp-message-empty {
  color: var(--c-text-muted);
  opacity: 0.4;
}

/* Role colours for username */
.frp-role-admin,
.frp-role-moderator {
  color: #ef4444;
}
.frp-role-editor {
  color: #a855f7;
}
.frp-role-lult {
  color: #f97316;
}
.frp-role-platinum {
  color: #94a3b8;
}
.frp-role-vip {
  color: #22c55e;
}
.frp-role-member {
  color: var(--c-primary);
}

/* Quick reply card */
.frp-reply-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 20px;
}
.frp-reply-head {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--c-primary);
  padding: 8px 14px;
  border-bottom: 1px solid var(--c-border);
  background: rgba(37, 99, 235, 0.04);
}
.frp-reply-textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 12px 14px;
  font-size: 13px;
  border: none;
  border-bottom: 1px solid var(--c-border);
  background: var(--c-surface);
  color: var(--c-text);
  resize: vertical;
  outline: none;
  display: block;
}
.frp-reply-foot {
  padding: 8px 14px;
  display: flex;
  justify-content: flex-end;
}
.frp-error {
  background: rgba(239, 68, 68, 0.08);
  color: #ef4444;
  font-size: 12px;
  padding: 8px 14px;
  border-bottom: 1px solid rgba(239, 68, 68, 0.2);
}

/* Locked notice */
.frp-locked-notice {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  color: var(--c-text-muted);
  padding: 6px 12px;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  margin-bottom: 16px;
}
.frp-empty {
  text-align: center;
  padding: 40px;
  color: var(--c-text-muted);
  font-size: 13px;
}

@media (max-width: 600px) {
  .frp-post {
    flex-direction: column;
  }
  .frp-user {
    width: auto;
    flex-direction: row;
    flex-wrap: wrap;
    border-right: none;
    border-bottom: 1px solid var(--c-border);
    justify-content: flex-start;
    text-align: left;
  }
  .frp-avatar,
  .frp-avatar-placeholder {
    margin-bottom: 0;
  }
}

/* ═══════════════════════════════════════
   Forum Topic List (forum_topic.tpl) — frt-*
═══════════════════════════════════════ */
.frt-header-right {
  display: flex;
  align-items: center;
  gap: 8px;
}
.frt-pager {
  margin-bottom: 10px;
}

.frt-notice {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  font-weight: 600;
  color: var(--c-primary);
  background: rgba(37, 99, 235, 0.06);
  border: 1px solid rgba(37, 99, 235, 0.15);
  border-radius: 6px;
  padding: 7px 12px;
  margin-bottom: 12px;
}
.frt-notice-warn {
  color: #ef4444;
  background: rgba(239, 68, 68, 0.06);
  border-color: rgba(239, 68, 68, 0.15);
}

.frt-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 12px;
}
.frt-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}
.frt-table-head th {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--c-text-muted);
  padding: 6px 10px;
  border: 1px solid var(--c-border);
  background: rgba(0, 0, 0, 0.025);
  text-align: left;
}
[data-theme="dark"] .frt-table-head th {
  background: rgba(255, 255, 255, 0.03);
}
.frt-th-center {
  text-align: center !important;
}
.frt-table tbody tr {
  transition: background 0.12s;
}
.frt-table tbody tr:hover {
  background: rgba(37, 99, 235, 0.04);
}
.frt-table tbody td {
  padding: 6px 10px;
  vertical-align: middle;
  border: 1px solid var(--c-border);
  line-height: 1.3;
}

.frt-topic-cell {
  min-width: 0;
}
.frt-sticky {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 10px;
  font-weight: 700;
  color: #f97316;
  margin-right: 5px;
}
.frt-locked {
  color: var(--c-text-muted);
  font-size: 11px;
  margin-right: 4px;
}
.frt-topic-title {
  font-size: 13px;
  font-weight: 500;
  color: var(--c-text);
  text-decoration: none;
}
.frt-row:hover .frt-topic-title {
  color: var(--c-primary);
}
.frt-admin-links {
  display: inline-flex;
  gap: 5px;
  margin-left: 8px;
}
.frt-act-btn {
  font-size: 10px;
  font-weight: 600;
  padding: 1px 7px;
  border-radius: 4px;
  text-decoration: none;
  background: rgba(37, 99, 235, 0.08);
  color: var(--c-primary);
}
.frt-act-btn:hover {
  background: rgba(37, 99, 235, 0.18);
}
.frt-act-delete {
  background: rgba(239, 68, 68, 0.08);
  color: #ef4444;
}
.frt-act-delete:hover {
  background: rgba(239, 68, 68, 0.18);
}

.frt-td-center {
  text-align: center;
}
.frt-td-stat {
  font-size: 12px;
  font-weight: 600;
  color: var(--c-text);
}
.frt-last-cell {
  min-width: 0;
}
.frt-last-date {
  display: block;
  font-size: 12px;
  font-weight: 500;
  color: var(--c-text);
  text-align: center;
}
.frt-last-by {
  display: block;
  font-size: 11px;
  color: var(--c-text-muted);
  text-align: center;
}
.frt-last-empty {
  color: var(--c-text-muted);
  opacity: 0.4;
}

.frt-sub-btn {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 9px;
  border-radius: 20px;
  text-decoration: none;
  background: rgba(37, 99, 235, 0.08);
  color: var(--c-primary);
  white-space: nowrap;
}
.frt-sub-btn:hover {
  background: rgba(37, 99, 235, 0.18);
}
.frt-sub-active {
  background: rgba(34, 197, 94, 0.1);
  color: #22c55e;
}
.frt-sub-active:hover {
  background: rgba(34, 197, 94, 0.2);
}

.frt-empty {
  text-align: center;
  padding: 40px;
  color: var(--c-text-muted);
  font-size: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

@media (max-width: 768px) {
  .frt-table {
    table-layout: auto;
  }
  .frt-td-stat,
  .frt-last-cell,
  .frt-table-head th:nth-child(3),
  .frt-table-head th:nth-child(4),
  .frt-table-head th:nth-child(5) {
    display: none;
  }
}

/* ═══════════════════════════════════════
   Forum Topic Edit / New (forum_topic_edit.tpl) — fte-*
═══════════════════════════════════════ */
.fte-fields {
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.fte-field-row {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.fte-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--c-text-muted);
}
.fte-input {
  width: 100%;
  box-sizing: border-box;
  font-size: 13px;
  padding: 8px 10px;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  background: var(--c-surface);
  color: var(--c-text);
  outline: none;
}
.fte-input:focus {
  border-color: var(--c-primary);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}
.fte-checks {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}
.fte-checks-row {
  flex-direction: row;
  align-items: center;
  gap: 16px;
}

/* ═══════════════════════════════════════
   Forum Post Edit / Reply (forum_post_edit.tpl) — fpe-*
═══════════════════════════════════════ */
.fpe-error {
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgba(239, 68, 68, 0.08);
  color: #ef4444;
  font-size: 12px;
  font-weight: 600;
  padding: 10px 14px;
  border: 1px solid rgba(239, 68, 68, 0.2);
  border-radius: 8px;
  margin-bottom: 14px;
}
.fpe-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 20px;
}
.fpe-card-head {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--c-primary);
  padding: 9px 14px;
  border-bottom: 1px solid var(--c-border);
  background: rgba(37, 99, 235, 0.04);
}
.fpe-form {
  display: flex;
  flex-direction: column;
}
.fpe-editor-wrap {
  padding: 14px;
}
.fpe-textarea {
  width: 100%;
  box-sizing: border-box;
  font-size: 13px;
  padding: 10px 12px;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  background: var(--c-surface);
  color: var(--c-text);
  resize: vertical;
  outline: none;
  display: block;
  line-height: 1.6;
}
.fpe-textarea:focus {
  border-color: var(--c-primary);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}
.fpe-footer {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border-top: 1px solid var(--c-border);
  background: rgba(0, 0, 0, 0.015);
}
[data-theme="dark"] .fpe-footer {
  background: rgba(255, 255, 255, 0.02);
}

/* ═══════════════════════════════════════
   Myshows Page (myshows.tpl)
═══════════════════════════════════════ */

/* ═══════════════════════════════════════
   Movies List Page (movies.tpl)
═══════════════════════════════════════ */
/* Search toggle */
.mvb-search-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 14px;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  background: #f8fafc;
  color: #475569;
  font-size: 13px;
  cursor: pointer;
  transition: background 0.15s;
}
.mvb-search-toggle:hover,
.mvb-search-active {
  background: #2563eb;
  color: #fff;
  border-color: #2563eb;
}
.mvb-chevron {
  transition: transform 0.2s;
  font-size: 11px;
}
.mvb-chevron-open {
  transform: rotate(180deg);
}
.mvb-filter-hidden {
  display: none;
}
/* Pager bar */
.mvb-pager-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 5px 0;
}
.mvb-pager-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
}
.mvb-pager-right .br-view-label {
  white-space: nowrap;
}
.mvb-pager-bottom {
  padding: 5px 0;
}
/* Clear button */
.mvb-btn-clear {
  background: #64748b;
  color: #fff;
  border-color: #64748b;
  text-decoration: none;
}
.mvb-btn-clear:hover {
  background: #475569;
  color: #fff;
}
/* Grid */
.mvb-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  margin-top: 4px;
}
.mvb-card {
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  display: flex;
  flex-direction: row;
  background: #fff;
  overflow: hidden;
}
/* Poster */
.mvb-thumb {
  position: relative;
  flex-shrink: 0;
}
.mvb-thumb-new {
  overflow: hidden;
}
.mvb-thumb-new::after {
  content: 'NEW';
  position: absolute;
  top: 3px;
  left: -30px;
  width: 100px;
  padding: 2px 0;
  background: #16c784;
  color: #fff;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-align: center;
  transform: rotate(-45deg);
  z-index: 10;
  pointer-events: none;
  box-shadow: 0 2px 4px rgba(0,0,0,.3);
}
.mvb-thumb-link {
  display: block;
  height: 100%;
}
.mvb-thumb img {
  width: 110px;
  object-fit: cover;
  display: block;
  height: 100%;
}
.mvb-no-cover {
  width: 110px;
  background: #f1f5f9;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #94a3b8;
  font-size: 30px;
  min-height: 161px;
  height: 100%;
}
/* Card content */
.mvb-content {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 14px;
}
.mvb-spacer {
  flex: 1;
}
.mvb-title {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
}
.mvb-title a {
  color: #2563eb;
  text-decoration: none;
}
.mvb-title a:hover {
  text-decoration: underline;
}
.mvb-genre {
  font-size: 12px;
  color: #64748b;
}
.mvb-title-na {
  color: #94a3b8 !important;
}
.mvb-title-na a {
  color: #94a3b8 !important;
}
.mvb-genre-na {
  color: #cbd5e1 !important;
}
.mvb-meta {
  font-size: 12px;
  color: #475569;
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 2px;
  overflow: visible;
  position: relative;
}
.mvb-meta-spacer {
  flex: 1;
}
.mvb-dot {
  color: #cbd5e1;
  margin: 0 3px;
  flex-shrink: 0;
}
.mvb-cat {
  background: #e2e8f0;
  color: #475569;
  padding: 1px 6px;
  border-radius: 3px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  flex-shrink: 0;
}
.mvb-grabs {
  font-size: 11px;
  color: #64748b;
  flex-shrink: 0;
}
.mvb-row2 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 2px;
}
.mvb-ratings {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.mvb-ri {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
  color: #1e293b;
}
.mvb-ri small {
  font-weight: 400;
  color: #64748b;
}
.mvb-ri-img,
.tvb-ri-img {
  height: 14px;
  width: auto;
  object-fit: contain;
  display: block;
}
.mvb-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}
.mvb-btn {
  font-size: 11px;
  padding: 3px 9px;
  border-radius: 4px;
  background: #f1f5f9;
  color: #475569;
  text-decoration: none;
  border: 1px solid #e2e8f0;
  white-space: nowrap;
}
.mvb-btn:hover {
  background: #e2e8f0;
  color: #1e293b;
}
.mvb-btn-dl {
  background: #2563eb;
  color: #fff;
  border-color: #2563eb;
}
.mvb-btn-dl:hover {
  background: #1d4ed8;
  color: #fff;
}
.mvb-relname {
  font-size: 12px;
  font-weight: 600;
  color: #1e293b;
  margin-top: auto;
  padding-top: 8px;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.mvb-relname a {
  color: #1e293b;
  text-decoration: none;
}
.mvb-relname a:hover {
  color: #2563eb;
}
/* Dark mode */
[data-theme="dark"] .mvb-search-toggle {
  background: #1e293b;
  border-color: #334155;
  color: #94a3b8;
}
[data-theme="dark"] .mvb-search-toggle:hover,
[data-theme="dark"] .mvb-search-active {
  background: #2563eb;
  color: #fff;
  border-color: #2563eb;
}
[data-theme="dark"] .mvb-card {
  background: #0b0f19;
  border-color: #334155;
}
[data-theme="dark"] .mvb-cat {
  background: #334155;
  color: #94a3b8;
}
[data-theme="dark"] .mvb-no-cover {
  background: #0f172a;
  color: #475569;
}
[data-theme="dark"] .mvb-genre {
  color: #94a3b8;
}
[data-theme="dark"] .mvb-meta {
  color: #94a3b8;
}
[data-theme="dark"] .mvb-dot {
  color: #334155;
}
[data-theme="dark"] .mvb-ri {
  color: #e2e8f0;
}
[data-theme="dark"] .mvb-ri small {
  color: #94a3b8;
}
[data-theme="dark"] .mvb-grabs {
  color: #64748b;
}
[data-theme="dark"] .mvb-btn {
  background: #0f172a;
  color: #94a3b8;
  border-color: #334155;
}
[data-theme="dark"] .mvb-btn:hover {
  background: #334155;
  color: #e2e8f0;
}
[data-theme="dark"] .mvb-relname {
  color: #cbd5e1;
}
[data-theme="dark"] .mvb-relname a {
  color: #cbd5e1;
}
[data-theme="dark"] .mvb-relname a:hover {
  color: #60a5fa;
}
@media (max-width: 900px) {
  .mvb-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 600px) {
  .mvb-pager-bar {
    flex-direction: column;
    align-items: flex-start;
  }
  .mvb-pager-right {
    margin-left: 0;
  }
}

/* ═══════════════════════════════════════
   TV List Page (tv_new.tpl)
═══════════════════════════════════════ */
.tvb-search-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 14px;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  background: #f8fafc;
  color: #475569;
  font-size: 13px;
  cursor: pointer;
  transition: background 0.15s;
}
.tvb-search-toggle:hover,
.tvb-search-active {
  background: #2563eb;
  color: #fff;
  border-color: #2563eb;
}
.tvb-chevron {
  transition: transform 0.2s;
  font-size: 11px;
}
.tvb-chevron-open {
  transform: rotate(180deg);
}
.tvb-filter-hidden {
  display: none;
}
.tvb-pager-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 5px 0;
}
.tvb-pager-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
}
.tvb-pager-right .br-view-label {
  white-space: nowrap;
}
.tvb-pager-bottom {
  padding: 5px 0;
}
.tvb-btn-clear {
  background: #64748b;
  color: #fff;
  border-color: #64748b;
  text-decoration: none;
}
.tvb-btn-clear:hover {
  background: #475569;
  color: #fff;
}
.tvb-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  margin-top: 4px;
}
.tvb-card {
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  display: flex;
  flex-direction: row;
  background: #fff;
  overflow: hidden;
}
.tvb-thumb {
  position: relative;
  flex-shrink: 0;
}
.tvb-thumb-new {
  overflow: hidden;
}
.tvb-thumb-new::after {
  content: 'NEW';
  position: absolute;
  top: 3px;
  left: -30px;
  width: 100px;
  padding: 2px 0;
  background: #16c784;
  color: #fff;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-align: center;
  transform: rotate(-45deg);
  z-index: 10;
  pointer-events: none;
  box-shadow: 0 2px 4px rgba(0,0,0,.3);
}
.tvb-thumb-link {
  display: block;
  height: 100%;
}
.tvb-thumb img {
  width: 110px;
  object-fit: cover;
  display: block;
  height: 100%;
}
.tvb-no-cover {
  width: 110px;
  background: #f1f5f9;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #94a3b8;
  font-size: 30px;
  min-height: 161px;
  height: 100%;
}
.tvb-content {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 14px;
}
.tvb-title {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
}
.tvb-title a {
  color: #2563eb;
  text-decoration: none;
}
.tvb-title a:hover {
  text-decoration: underline;
}
.tvb-genre {
  font-size: 12px;
  color: #64748b;
}
.tvb-title-na {
  color: #94a3b8 !important;
}
.tvb-title-na a {
  color: #94a3b8 !important;
}
.tvb-genre-na {
  color: #cbd5e1 !important;
}
.tvb-ep {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
  margin-top: 1px;
}
.tvb-ep-tag {
  font-size: 11px;
  font-weight: 700;
  background: #e0f2fe;
  color: #0369a1;
  padding: 1px 5px;
  border-radius: 3px;
}
.tvb-network {
  font-size: 11px;
  color: #64748b;
}
.tvb-meta {
  font-size: 12px;
  color: #475569;
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 2px;
  overflow: visible;
  position: relative;
}
.tvb-meta-spacer {
  flex: 1;
}
.tvb-dot {
  color: #cbd5e1;
  margin: 0 3px;
  flex-shrink: 0;
}
.tvb-cat {
  background: #e2e8f0;
  color: #475569;
  padding: 1px 6px;
  border-radius: 3px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  flex-shrink: 0;
}
.tvb-grabs {
  font-size: 11px;
  color: #64748b;
  flex-shrink: 0;
}
.tvb-row2 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 2px;
}
.tvb-ratings {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.tvb-ri {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
  color: #1e293b;
}
.tvb-ri small {
  font-weight: 400;
  color: #64748b;
}
.tvb-ri-star {
  color: #f59e0b;
  font-size: 11px;
}
.tvb-status {
  font-size: 10px;
  font-weight: 600;
  padding: 1px 6px;
  border-radius: 3px;
  background: #dcfce7;
  color: #166534;
}
.tvb-status-ended {
  background: #ef4444 !important;
  color: #fff !important;
}
.tvb-btn {
  font-size: 11px;
  padding: 3px 9px;
  border-radius: 4px;
  background: #f1f5f9;
  color: #475569;
  text-decoration: none;
  border: 1px solid #e2e8f0;
  white-space: nowrap;
}
.tvb-btn:hover {
  background: #e2e8f0;
  color: #1e293b;
}
.tvb-btn-dl {
  background: #2563eb;
  color: #fff;
  border-color: #2563eb;
}
.tvb-btn-dl:hover {
  background: #1d4ed8;
  color: #fff;
}
.tvb-relname {
  font-size: 12px;
  font-weight: 600;
  color: #1e293b;
  margin-top: auto;
  padding-top: 8px;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.tvb-relname a {
  color: #1e293b;
  text-decoration: none;
}
.tvb-relname a:hover {
  color: #2563eb;
}
.tvb-genre-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.tvb-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}
.tvb-title-row .tvb-title {
  flex: 1;
  min-width: 0;
}
.tvb-title-badges {
  display: flex;
  gap: 5px;
  align-items: center;
  flex-shrink: 0;
  flex-wrap: wrap;
  padding-top: 2px;
}
.tvb-airdate {
  font-size: 11px;
  color: #1a1a1a;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.tvb-airdate i {
  color: #4db5ff;
}
[data-theme="dark"] .tvb-airdate i {
  color: var(--c-primary);
}
[data-theme="dark"] .tvb-airdate {
  color: #94a3b8;
}
.tvb-ri-img-dark {
  display: none;
}
[data-theme="dark"] .tvb-ri-img-light {
  display: none;
}
[data-theme="dark"] .tvb-ri-img-dark {
  display: block;
}
[data-theme="dark"] .tvb-search-toggle {
  background: #1e293b;
  border-color: #334155;
  color: #94a3b8;
}
[data-theme="dark"] .tvb-search-toggle:hover,
[data-theme="dark"] .tvb-search-active {
  background: #2563eb;
  color: #fff;
  border-color: #2563eb;
}
[data-theme="dark"] .tvb-card {
  background: #0b0f19;
  border-color: #334155;
}
[data-theme="dark"] .tvb-cat {
  background: #334155;
  color: #94a3b8;
}
[data-theme="dark"] .tvb-no-cover {
  background: #0f172a;
  color: #475569;
}
[data-theme="dark"] .tvb-genre {
  color: #94a3b8;
}
[data-theme="dark"] .tvb-meta {
  color: #94a3b8;
}
[data-theme="dark"] .tvb-dot {
  color: #334155;
}
[data-theme="dark"] .tvb-ep-tag {
  background: #0c2d48;
  color: #38bdf8;
}
[data-theme="dark"] .tvb-network {
  color: #64748b;
}
[data-theme="dark"] .tvb-ri {
  color: #94a3b8;
}
[data-theme="dark"] .tvb-ri small {
  color: #94a3b8;
}
[data-theme="dark"] .tvb-status {
  background: #14532d;
  color: #86efac;
}
[data-theme="dark"] .tvb-grabs {
  color: #64748b;
}
[data-theme="dark"] .tvb-btn {
  background: #0f172a;
  color: #94a3b8;
  border-color: #334155;
}
[data-theme="dark"] .tvb-btn:hover {
  background: #334155;
  color: #e2e8f0;
}
[data-theme="dark"] .tvb-relname {
  color: #cbd5e1;
}
[data-theme="dark"] .tvb-relname a {
  color: #cbd5e1;
}
[data-theme="dark"] .tvb-relname a:hover {
  color: #60a5fa;
}
@media (max-width: 900px) {
  .tvb-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 600px) {
  .tvb-pager-bar {
    flex-direction: column;
    align-items: flex-start;
  }
  .tvb-pager-right {
    margin-left: 0;
  }
}

/* ── Donate Page ── */
.donate-wrap {
  max-width: 1040px;
  margin: 0 auto;
  padding: 0 0 64px;
}
.donate-top-section {
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  background: #f0f7ff;
  padding: 20px 32px;
  margin-bottom: 32px;
}
.donate-header {
  text-align: center;
  padding: 0 0 0;
}
.donate-tagline {
  font-size: 26px;
  font-weight: 800;
  color: #1e293b;
  margin: 0 0 12px;
  line-height: 1.25;
  letter-spacing: -0.01em;
}
.donate-title {
  font-size: 58px;
  font-weight: 900;
  color: #1e293b;
  margin: 0 0 14px;
  letter-spacing: -0.03em;
  line-height: 1;
}
.donate-title span {
  color: #2563eb;
}
.donate-subtitle {
  font-size: 15px;
  color: #64748b;
  margin: 0 auto;
  max-width: 560px;
  line-height: 1.6;
}
.donate-perks {
  display: flex;
  justify-content: center;
  gap: 14px;
  margin-bottom: 0;
  flex-wrap: wrap;
}
.donate-perk {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0px;
  text-align: center;
  width: 110px;
}
.donate-perk-icon {
  width: 52px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #2563eb;
  font-size: 20px;
  flex-shrink: 0;
}
.donate-perk-label {
  font-size: 11px;
  font-weight: 500;
  color: #374151;
  line-height: 1.4;
}
.donate-tiers {
  display: flex;
  justify-content: center;
  gap: 24px;
  margin-bottom: 32px;
  flex-wrap: wrap;
}
.donate-tier {
  border: 2px solid #e2e8f0;
  border-radius: 16px;
  padding: 42px 26px 28px;
  text-align: center;
  background: #fff;
  position: relative;
  cursor: pointer;
  transition:
    border-color 0.15s,
    background 0.15s,
    box-shadow 0.15s;
  width: 280px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.donate-tier:hover {
  border-color: #93c5fd;
  box-shadow: 0 4px 20px rgba(37, 99, 235, 0.08);
}
.donate-tier-active {
  border-color: #2563eb !important;
  background: #eff6ff !important;
  box-shadow: 0 8px 30px rgba(37, 99, 235, 0.15) !important;
}
.donate-tier-badge {
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
  background: #2563eb;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  padding: 4px 16px;
  border-radius: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}
.donate-tier-name {
  font-size: 22px;
  font-weight: 800;
  color: #1e293b;
  text-transform: none;
  letter-spacing: 0;
  margin-bottom: 10px;
}
.donate-tier-price-row {
  display: flex;
  align-items: flex-end;
  gap: 4px;
  justify-content: center;
  margin-bottom: 4px;
}
.donate-tier-price {
  font-size: 30px;
  font-weight: 900;
  color: #1e293b;
  letter-spacing: -0.03em;
  line-height: 1;
}
.donate-tier-period {
  font-size: 16px;
  color: #94a3b8;
  font-weight: 500;
  padding-bottom: 8px;
  margin: 0;
}
.donate-tier-monthly {
  font-size: 13px;
  color: #94a3b8;
  margin-top: 4px;
  margin-bottom: 22px;
}
.donate-tier-feature-list {
  list-style: none;
  padding: 0;
  margin: 0 0 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
  text-align: left;
}
.donate-tier-feature-list li {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 13.5px;
  color: #475569;
  line-height: 1.3;
}
.donate-tier-feature-list li::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: 12px;
  flex-shrink: 0;
  min-width: 14px;
}
.donate-tier-feature-list .dtf-yes::before {
  content: "\f00c";
  color: #16a34a;
}
.donate-tier-feature-list .dtf-no::before {
  content: "\f00d";
  color: #dc2626;
}
.donate-tier-feature-list .dtf-no {
  color: #94a3b8;
}
.donate-tier-btn {
  display: block;
  width: 100%;
  padding: 13px 0;
  border-radius: 10px;
  font-size: 14.5px;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  border: 2px solid #cbd5e1;
  color: #334155;
  background: transparent;
  cursor: pointer;
  transition:
    background 0.15s,
    color 0.15s,
    border-color 0.15s;
  margin-top: auto;
}
.donate-tier-btn:hover {
  border-color: #94a3b8;
  color: #1e293b;
}
.donate-tier-active .donate-tier-btn {
  background: #2563eb;
  border-color: #2563eb;
  color: #fff;
}
.donate-tier-active .donate-tier-btn:hover {
  background: #1d4ed8;
  border-color: #1d4ed8;
  color: #fff;
}
.donate-mid {
  display: grid;
  grid-template-columns: 3fr 2fr;
  gap: 20px;
  margin-bottom: 20px;
}
.donate-payments,
.donate-why {
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 28px;
  background: #fff;
text-align: center;
}
.donate-payments h3,
.donate-why h3 {
  font-size: 11px;
  font-weight: 700;
  color: #64748b;
  margin: 0 0 22px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.donate-pay-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.donate-pay-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 24px 12px 18px;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #f8fafc;
  gap: 14px;
  text-align: center;
}
.donate-pay-icon {
  width: 100%;
  height: 68px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: auto 48px;
}
.dpi-amazon {
  background-image: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDM1LjQxOCAzNS40MTgiPjxwYXRoIGZpbGw9IiMxMTExMTEiIGQ9Ik0yMC45NDgsOS44OTFjLTAuODU3LDAuMDY4LTEuODQ3LDAuMTM2LTIuODM3LDAuMjY5Yy0xLjUxNiwwLjE5NS0zLjAzMiwwLjQ2MS00LjI4NCwxLjA1MwoJCWMtMi40MzksMC45OTQtNC4wODgsMy4xMDUtNC4wODgsNi4yMDljMCwzLjg5OCwyLjUwNiw1Ljg3NSw1LjY2OSw1Ljg3NWMxLjA1NywwLDEuOTEzLTAuMTI5LDIuNzAzLTAuMzI4CgkJYzEuMjU1LTAuMzk2LDIuMzEtMS4xMjMsMy41NjItMi40NDFjMC43MjcsMC45OSwwLjkyMywxLjQ1MywyLjE3NywyLjUwOWMwLjMyOSwwLjEzMywwLjY1OCwwLjEzMywwLjkyMi0wLjA2NgoJCWMwLjc5MS0wLjY1OSwyLjE3NC0xLjg0OCwyLjkwMS0yLjUwOGMwLjMyOC0wLjI2NywwLjI2My0wLjY2LDAuMDY2LTAuOTkyYy0wLjcyNy0wLjkyNC0xLjQ1LTEuNzE4LTEuNDUtMy40OTh2LTUuOTQzCgkJYzAtMi41MTMsMC4xOTUtNC44MjItMS42NDctNi41MzdjLTEuNTE4LTEuMzkxLTMuODkxLTEuOTE2LTUuNzM1LTEuOTE2Yy0wLjI2NCwwLTAuNTI3LDAtMC43OTIsMAoJCWMtMy4zNjIsMC4xOTctNi45MjEsMS42NDctNy43MTQsNS44MTFjLTAuMTMsMC41MjUsMC4yNjcsMC43MjYsMC41MywwLjc5M2wzLjY5MSwwLjQ2NGMwLjM5Ni0wLjA3LDAuNTkzLTAuMzk4LDAuNjU4LTAuNzMKCQljMC4zMzMtMS40NDksMS41MTgtMi4xNzYsMi44MzYtMi4zMDljMC4wNjcsMCwwLjEzMywwLDAuMjY1LDBjMC43OSwwLDEuNjQ2LDAuMzMyLDIuMTA5LDAuOTg3CgkJYzAuNTIzLDAuNzk1LDAuNDYxLDEuODUzLDAuNDYxLDIuNzc1TDIwLjk0OCw5Ljg5MUwyMC45NDgsOS44OTF6IE0yMC4yMjMsMTcuNzQ5CgkJYy0wLjQ2MSwwLjkyNS0xLjI1MywxLjUxOS0yLjExLDEuNzE4Yy0wLjEzMSwwLTAuMzI3LDAuMDY4LTAuNTI2LDAuMDY4Yy0xLjQ1LDAtMi4zMS0xLjEyMy0yLjMxLTIuNzc1CgkJYzAtMi4xMSwxLjI1NC0zLjEwNCwyLjgzNi0zLjU2NWMwLjg1Ny0wLjE5NywxLjg0Ny0wLjI2NSwyLjgzNi0wLjI2NXYwLjc5M0MyMC45NDgsMTUuMjQzLDIxLjAxLDE2LjQzLDIwLjIyMywxNy43NDl6Ii8+PHBhdGggZmlsbD0iI0ZGOTkwMCIgZD0iTTM1LjQxOCwyNi45MTh2MC4yMTUKCQljLTAuMDM1LDEuMjkxLTAuNzE2LDMuNzY4LTIuMzI4LDUuMTMxYy0wLjMyMiwwLjI1LTAuNjQ1LDAuMTA3LTAuNTAzLTAuMjU0YzAuNDY5LTEuMTQ1LDEuNTQxLTMuODAzLDEuMDQtNC40MTIKCQljLTAuMzU1LTAuNDY1LTEuODI2LTAuNDMtMy4wNzktMC4zMjJjLTAuNTcyLDAuMDcyLTEuMDc1LDAuMTA1LTEuNDY5LDAuMTgzYy0wLjM1NywwLjAzMy0wLjQzMS0wLjI4Ny0wLjA3MS0wLjUzNwoJCWMwLjQ2Ni0wLjMyMywwLjk2OS0wLjU3MywxLjU0MS0wLjc1NmMyLjAzOS0wLjYwOCw0LjQwNi0wLjI1LDQuNzI5LDAuMTQ2QzM1LjM0OCwyNi40MTQsMzUuNDE4LDI2LjYyOSwzNS40MTgsMjYuOTE4eiBNMzIuMDE2LDI5LjQyOGMtMC40NjYsMC4zNTctMC45NjUsMC42ODItMS40NjgsMC45NzNjLTMuNzYxLDIuMjYxLTguNjMxLDMuNDQxLTEyLjg1NiwzLjQ0MWMtNi44MDcsMC0xMi44OTUtMi41MTItMTcuNTE0LTYuNzA5CgkJYy0wLjM5Ni0wLjMyNC0wLjA3My0wLjc4OSwwLjM5My0wLjUzOUM1LjU0OSwyOS41LDExLjcwOSwzMS4yNiwxOC4wODQsMzEuMjZjNC4wMTMsMCw4LjM0Mi0wLjc1NCwxMi40NjMtMi4zNzEKCQljMC4yODUtMC4xMDQsMC42MDgtMC4yNTIsMC44OTUtMC4zNTZDMzIuMDg3LDI4LjI0MiwzMi42NjEsMjguOTY1LDMyLjAxNiwyOS40Mjh6Ii8+PC9zdmc+");
  background-size: auto 54px;
}
.dpi-card {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA5MCA2MCI+CiAgPHJlY3Qgd2lkdGg9IjkwIiBoZWlnaHQ9IjYwIiByeD0iNyIgZmlsbD0iIzI1NjNlYiIvPgogIDxyZWN0IHk9IjEzIiB3aWR0aD0iOTAiIGhlaWdodD0iMTEiIGZpbGw9InJnYmEoMCwwLDAsMC4yNSkiLz4KICA8cmVjdCB4PSI4IiB5PSIyOSIgd2lkdGg9IjE4IiBoZWlnaHQ9IjE0IiByeD0iMiIgZmlsbD0iI2Q0YTg0MyIvPgogIDxyZWN0IHg9IjEwLjUiIHk9IjI5IiB3aWR0aD0iMy41IiBoZWlnaHQ9IjE0IiBmaWxsPSIjYjg5MjJlIiBvcGFjaXR5PSIwLjYiLz4KICA8cmVjdCB4PSI4IiB5PSIzNS41IiB3aWR0aD0iMTgiIGhlaWdodD0iMS41IiBmaWxsPSIjYjg5MjJlIiBvcGFjaXR5PSIwLjYiLz4KICA8Y2lyY2xlIGN4PSIzOCIgY3k9IjQ5IiByPSIyIiBmaWxsPSJyZ2JhKDI1NSwyNTUsMjU1LDAuNjUpIi8+CiAgPGNpcmNsZSBjeD0iNDUiIGN5PSI0OSIgcj0iMiIgZmlsbD0icmdiYSgyNTUsMjU1LDI1NSwwLjY1KSIvPgogIDxjaXJjbGUgY3g9IjUyIiBjeT0iNDkiIHI9IjIiIGZpbGw9InJnYmEoMjU1LDI1NSwyNTUsMC42NSkiLz4KICA8Y2lyY2xlIGN4PSI1OSIgY3k9IjQ5IiByPSIyIiBmaWxsPSJyZ2JhKDI1NSwyNTUsMjU1LDAuNjUpIi8+CiAgPGNpcmNsZSBjeD0iNzQiIGN5PSI0MSIgcj0iMiIgZmlsbD0id2hpdGUiLz4KICA8cGF0aCBkPSJNNzAgMzUgQTggOCAwIDAgMSA3MCA0NyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBmaWxsPSJub25lIiBzdHJva2UtbGluZWNhcD0icm91bmQiLz4KICA8cGF0aCBkPSJNNjcgMzIgQTEzIDEzIDAgMCAxIDY3IDUwIiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjIiIGZpbGw9Im5vbmUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgb3BhY2l0eT0iMC41NSIvPgo8L3N2Zz4=");
  background-size: auto 56px;
}
.dpi-crypto {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48Y2lyY2xlIGN4PSIyNTYiIGN5PSIyNTYiIHI9IjI0OCIgZmlsbD0id2hpdGUiLz48cGF0aCBmaWxsPSIjZjc5MzFhIiBkPSJNNTA0IDI1NmMwIDEzNi45NjctMTExLjAzMyAyNDgtMjQ4IDI0OFM4IDM5Mi45NjcgOCAyNTYgMTE5LjAzMyA4IDI1NiA4czI0OCAxMTEuMDMzIDI0OCAyNDh6bS0xNDEuNjUxLTM1LjMzYzQuOTM3LTMyLjk5OS0yMC4xOTEtNTAuNzM5LTU0LjU1LTYyLjU3M2wxMS4xNDYtNDQuNzAyLTI3LjIxMy02Ljc4MS0xMC44NTEgNDMuNTI0Yy03LjE1NC0xLjc4My0xNC41MDItMy40NjQtMjEuODAzLTUuMTNsMTAuOTI5LTQzLjgxLTI3LjE5OC02Ljc4MS0xMS4xNTMgNDQuNjg2Yy01LjkyMi0xLjM0OS0xMS43MzUtMi42ODItMTcuMzc3LTQuMDg0bC4wMzEtLjE0LTM3LjUzLTkuMzctNy4yMzkgMjkuMDYyczIwLjE5MSA0LjYyNyAxOS43NjUgNC45MTNjMTEuMDIyIDIuNzUxIDEzLjAxNCAxMC4wNDQgMTIuNjggMTUuODI1bC0xMi42OTYgNTAuOTI1Yy43Ni4xOTQgMS43NDQuNDczIDIuODI5LjkwNy0uOTA3LS4yMjUtMS44NzYtLjQ3My0yLjg3Ni0uNzEzbC0xNy43OTYgNzEuMzM4Yy0xLjM0OSAzLjM0OC00Ljc2NyA4LjM3LTEyLjQ3MSA2LjQ2NC4yNzEuMzk1LTE5Ljc4LTQuOTM3LTE5Ljc4LTQuOTM3bC0xMy41MSAzMS4xNDcgMzUuNDE0IDguODI3YzYuNTg4IDEuNjUxIDEzLjA0NSAzLjM3OSAxOS40IDUuMDA2bC0xMS4yNjIgNDUuMjEzIDI3LjE4MiA2Ljc4MSAxMS4xNTMtNDQuNzMzYTEwMzguMjA5IDEwMzguMjA5IDAgMCAwIDIxLjY4NyA1LjYyN2wtMTEuMTE1IDQ0LjUyMyAyNy4yMTMgNi43ODEgMTEuMjYyLTQ1LjEyOGM0Ni40MDQgOC43ODEgODEuMjk5IDUuMjM5IDk1Ljk4Ni0zNi43MjcgMTEuODM2LTMzLjc5LS41ODktNTMuMjgxLTI1LjAwNC02NS45OTEgMTcuNzgtNC4wOTggMzEuMTc0LTE1Ljc5MiAzNC43NDctMzkuOTQ5em0tNjIuMTc3IDg3LjE3OWMtOC40MSAzMy43OS02NS4zMDggMTUuNTIzLTgzLjc1NSAxMC45NDNsMTQuOTQ0LTU5Ljg5OWMxOC40NDYgNC42MDMgNzcuNiAxMy43MTcgNjguODExIDQ4Ljk1NnptOC40MTctODcuNjY3Yy03LjY3MyAzMC43MzYtNTUuMDMxIDE1LjEyLTcwLjM5MyAxMS4yOTJsMTMuNTQ4LTU0LjMyN2MxNS4zNjMgMy44MjggNjQuODM2IDEwLjk3MyA1Ni44NDUgNDMuMDM1eiIvPjwvc3ZnPg==");
}
.donate-pay-label {
  font-size: 13px;
  font-weight: 700;
  color: #334155;
}
.donate-pay-select {
  display: block;
  width: 100%;
  padding: 10px 0;
  background: #2563eb;
  color: #fff;
  text-align: center;
  border-radius: 8px;
  text-decoration: none;
  font-size: 13px;
  font-weight: 700;
  transition: background 0.15s;
  box-sizing: border-box;
}
.donate-pay-select:hover {
  background: #1d4ed8;
  color: #fff;
  text-decoration: none;
}
.donate-why-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.donate-why-list li {
  font-size: 14px;
  color: #475569;
  display: flex;
  align-items: center;
  gap: 10px;
}
.donate-why-list li::before {
  content: "\2713";
  font-weight: 800;
  color: #2563eb;
  font-size: 14px;
  flex-shrink: 0;
}
.donate-features {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  overflow: hidden;
  margin-bottom: 20px;
  background: #fff;
}
.donate-feature {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 24px 20px;
  border-right: 1px solid #e2e8f0;
}
.donate-feature:last-child {
  border-right: none;
}
.donate-feature i {
  font-size: 26px;
  color: #2563eb;
  flex-shrink: 0;
}
.donate-feature strong {
  font-size: 14px;
  color: #1e293b;
  display: block;
  font-weight: 700;
}
.donate-feature p {
  font-size: 12px;
  color: #94a3b8;
  margin: 3px 0 0;
}
.donate-bottom {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 20px;
}
.donate-info {
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 28px;
  background: #fff;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.donate-info h3 {
  font-size: 16px;
  font-weight: 700;
  color: #1e293b;
  margin: 0 0 18px;
  text-transform: none;
  letter-spacing: 0;
}
.donate-info-list {
  list-style: none;
  padding: 0;
  margin: 0 0 18px;
  display: flex;
  flex-direction: column;
  gap: 11px;
}
.donate-info-list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  color: #475569;
  line-height: 1.45;
}
.donate-info-list li::before {
  content: "\f00c";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  color: #2563eb;
  font-size: 12px;
  flex-shrink: 0;
  margin-top: 2px;
}
.donate-info-contact {
  font-size: 13.5px;
  color: #94a3b8;
  margin: 0;
}
.donate-info-contact a {
  color: #2563eb;
  text-decoration: none;
}
.donate-info-contact a:hover {
  text-decoration: underline;
}
.donate-appreciation {
  background: #eff6ff;
  border-radius: 16px;
  padding: 36px 28px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 14px;
}
.donate-appreciation i {
  font-size: 34px;
  color: #2563eb;
}
.donate-appreciation strong {
  font-size: 18px;
  font-weight: 700;
  color: #2563eb;
  line-height: 1.3;
  display: block;
}
.donate-appreciation p {
  font-size: 14px;
  color: #64748b;
  margin: 0;
  line-height: 1.55;
}
[data-theme="dark"] .donate-top-section {
  background: #0f1929;
  border-color: #334155;
}
[data-theme="dark"] .donate-title {
  color: #e2e8f0;
}
[data-theme="dark"] .donate-tagline {
  color: #e2e8f0;
}
[data-theme="dark"] .donate-tier-name {
  color: #e2e8f0;
}
[data-theme="dark"] .donate-tier-period {
  color: #64748b;
}
[data-theme="dark"] .donate-perk-icon {
  color: #60a5fa;
}
[data-theme="dark"] .donate-perk-label {
  color: #94a3b8;
}
[data-theme="dark"] .donate-tier {
  background: #0b0f19;
  border-color: #334155;
}
[data-theme="dark"] .donate-tier:hover {
  border-color: #475569;
}
[data-theme="dark"] .donate-tier-active {
  background: #1e3a5f !important;
  border-color: #2563eb !important;
}
[data-theme="dark"] .donate-tier-price {
  color: #e2e8f0;
}
[data-theme="dark"] .donate-tier-monthly {
  color: #64748b;
}
[data-theme="dark"] .donate-tier-feature-list li {
  color: #94a3b8;
}
[data-theme="dark"] .donate-tier-feature-list .dtf-no {
  color: #64748b;
}
[data-theme="dark"] .donate-tier-btn {
  border-color: #334155;
  color: #94a3b8;
}
[data-theme="dark"] .donate-tier-btn:hover {
  border-color: #475569;
  color: #e2e8f0;
}
[data-theme="dark"] .donate-tier-active .donate-tier-btn {
  background: #2563eb;
  border-color: #2563eb;
  color: #fff;
}
[data-theme="dark"] .donate-payments,
[data-theme="dark"] .donate-why,
[data-theme="dark"] .donate-info {
  background: #0b0f19;
  border-color: #334155;
}
[data-theme="dark"] .donate-info h3 {
  color: #e2e8f0;
}
[data-theme="dark"] .donate-info-list li {
  color: #94a3b8;
}
[data-theme="dark"] .donate-info-contact {
  color: #64748b;
}
[data-theme="dark"] .donate-appreciation {
  background: #1e2d4a;
}
[data-theme="dark"] .donate-appreciation p {
  color: #94a3b8;
}
[data-theme="dark"] .donate-features {
  background: #0b0f19;
  border-color: #334155;
}
[data-theme="dark"] .donate-feature {
  border-color: #334155;
}
[data-theme="dark"] .donate-feature strong {
  color: #e2e8f0;
}
[data-theme="dark"] .donate-payments h3,
[data-theme="dark"] .donate-why h3,
[data-theme="dark"] .donate-info h3 {
  color: #64748b;
}
[data-theme="dark"] .donate-pay-card {
  background: #0f172a;
  border-color: #334155;
}
[data-theme="dark"] .donate-pay-label {
  color: #94a3b8;
}
[data-theme="dark"] .donate-why-list li {
  color: #94a3b8;
}
[data-theme="dark"] .donate-info ul li,
[data-theme="dark"] .donate-info p {
  color: #94a3b8;
}
/* ── Payment hub page ────────────────────────────────────────── */
.pm-wrap { max-width: 740px; margin: 0 auto; padding: 0 0 40px; }

.pm-tabs { display: flex; gap: 8px; background: #f1f5f9; border-radius: 14px; padding: 6px; margin-bottom: 28px; }
.pm-tab { flex: 1; padding: 11px 8px; border: none; border-radius: 10px; background: transparent; color: #64748b; font-size: 14px; font-weight: 600; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 7px; transition: background .15s, color .15s; }
.pm-tab:hover { background: #e2e8f0; color: #334155; }
.pm-tab.pm-tab-active { background: #fff; color: #2563eb; box-shadow: 0 1px 4px rgba(0,0,0,.1); }

.pm-panel { display: none; }

/* Card panel */
.pm-card-info { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 24px; }
.pm-info-box { border: 1px solid #e2e8f0; border-radius: 14px; padding: 22px; background: #fff; }
.pm-info-box-header { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 700; color: #1e293b; margin-bottom: 16px; }
.pm-info-box-header i { font-size: 18px; color: #2563eb; }
.pm-info-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.pm-info-list li { display: flex; align-items: flex-start; gap: 9px; font-size: 13.5px; color: #475569; line-height: 1.4; }
.pm-info-list li i { color: #16a34a; font-size: 12px; flex-shrink: 0; margin-top: 3px; }
.pm-info-list em { font-style: normal; font-weight: 700; color: #dc2626; }

.pm-card-logos { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-top: 6px; }
.pm-card-logo { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; padding: 10px; display: flex; align-items: center; justify-content: center; }
.pm-card-logo svg { height: 34px; width: auto; display: block; }

.pm-card-tiers h3, .pm-crypto-tiers h3 { font-size: 15px; font-weight: 700; color: #1e293b; margin: 0 0 14px; }
.pm-tier-row { display: flex; gap: 12px; }
.pm-tier-btn { flex: 1; border: 2px solid #e2e8f0; border-radius: 12px; padding: 18px 12px 16px; background: #fff; cursor: pointer; text-decoration: none; display: flex; flex-direction: column; align-items: center; gap: 6px; position: relative; transition: border-color .15s, background .15s; }
.pm-tier-btn:hover { border-color: #2563eb; background: #eff6ff; }
.pm-tier-badge { position: absolute; top: -11px; left: 50%; transform: translateX(-50%); background: #2563eb; color: #fff; font-size: 11px; font-weight: 700; padding: 2px 10px; border-radius: 20px; white-space: nowrap; }
.pm-tier-name { font-size: 16px; font-weight: 800; color: #1e293b; }
.pm-tier-price { font-size: 22px; font-weight: 900; color: #2563eb; line-height: 1; }
.pm-tier-price small { font-size: 13px; font-weight: 500; color: #94a3b8; }
.pm-tier-popular { border-color: #2563eb; background: #eff6ff; }

.pm-card-note { font-size: 13px; color: #94a3b8; margin-top: 20px; text-align: center; }
.pm-card-note a { color: #2563eb; text-decoration: none; }

/* Crypto panel */
.pm-crypto-intro { text-align: center; padding: 32px 20px 28px; }
.pm-crypto-icon { width: 68px; height: 68px; border-radius: 16px; background: #fff7ed; color: #f7931a; font-size: 32px; display: flex; align-items: center; justify-content: center; margin: 0 auto 16px; }
.pm-crypto-intro h2 { font-size: 24px; font-weight: 800; color: #1e293b; margin: 0 0 10px; }
.pm-crypto-intro p { font-size: 14.5px; color: #64748b; max-width: 480px; margin: 0 auto; line-height: 1.6; }
.pm-crypto-tiers { margin-top: 24px; }

/* Card modal */
.pm-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 1000; align-items: center; justify-content: center; }
.pm-modal { background: #fff; border-radius: 16px; width: 520px; max-width: 95vw; overflow: hidden; box-shadow: 0 24px 60px rgba(0,0,0,.3); }
.pm-modal-header { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid #e2e8f0; font-size: 16px; font-weight: 700; color: #1e293b; }
.pm-modal-close { background: none; border: none; cursor: pointer; color: #64748b; font-size: 18px; padding: 4px 8px; }
.pm-modal-close:hover { color: #1e293b; }
.pm-modal-iframe { width: 100%; height: 580px; display: block; }

/* Dark mode – payment hub */
[data-theme="dark"] .pm-tabs { background: #1e293b; }
[data-theme="dark"] .pm-tab { color: #64748b; }
[data-theme="dark"] .pm-tab:hover { background: #334155; color: #cbd5e1; }
[data-theme="dark"] .pm-tab.pm-tab-active { background: #0f172a; color: #60a5fa; box-shadow: 0 1px 4px rgba(0,0,0,.3); }
[data-theme="dark"] .pm-info-box { background: #0f172a; border-color: #334155; }
[data-theme="dark"] .pm-info-box-header { color: #e2e8f0; }
[data-theme="dark"] .pm-info-list li { color: #94a3b8; }
[data-theme="dark"] .pm-card-logo { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .pm-card-tiers h3, [data-theme="dark"] .pm-crypto-tiers h3 { color: #e2e8f0; }
[data-theme="dark"] .pm-tier-btn { background: #0f172a; border-color: #334155; }
[data-theme="dark"] .pm-tier-btn:hover { border-color: #2563eb; background: #1e2d4a; }
[data-theme="dark"] .pm-tier-popular { background: #1e2d4a; border-color: #2563eb; }
[data-theme="dark"] .pm-tier-name { color: #e2e8f0; }
[data-theme="dark"] .pm-crypto-intro h2 { color: #e2e8f0; }
[data-theme="dark"] .pm-crypto-icon { background: #2a1a00; }
[data-theme="dark"] .pm-modal { background: #0f172a; }
[data-theme="dark"] .pm-modal-header { color: #e2e8f0; border-color: #334155; }

/* ── Giftcard page ───────────────────────────────────────────── */
.gc-wrap { margin: 0 auto; padding: 0 0 40px; }

.gc-hero { display: flex; align-items: center; gap: 18px; padding: 20px 4px; justify-content: center; }
.gc-hero-icon { width: 64px; height: 64px; border-radius: 16px; background: #fff3e0; background-repeat: no-repeat; background-position: center; flex-shrink: 0; }
.gc-hero-text { text-align: left; }
.gc-hero-amazon { background-image: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDM1LjQxOCAzNS40MTgiPjxwYXRoIGZpbGw9IiMxMTExMTEiIGQ9Ik0yMC45NDgsOS44OTFjLTAuODU3LDAuMDY4LTEuODQ3LDAuMTM2LTIuODM3LDAuMjY5Yy0xLjUxNiwwLjE5NS0zLjAzMiwwLjQ2MS00LjI4NCwxLjA1MwoJCWMtMi40MzksMC45OTQtNC4wODgsMy4xMDUtNC4wODgsNi4yMDljMCwzLjg5OCwyLjUwNiw1Ljg3NSw1LjY2OSw1Ljg3NWMxLjA1NywwLDEuOTEzLTAuMTI5LDIuNzAzLTAuMzI4CgkJYzEuMjU1LTAuMzk2LDIuMzEtMS4xMjMsMy41NjItMi40NDFjMC43MjcsMC45OSwwLjkyMywxLjQ1MywyLjE3NywyLjUwOWMwLjMyOSwwLjEzMywwLjY1OCwwLjEzMywwLjkyMi0wLjA2NgoJCWMwLjc5MS0wLjY1OSwyLjE3NC0xLjg0OCwyLjkwMS0yLjUwOGMwLjMyOC0wLjI2NywwLjI2My0wLjY2LDAuMDY2LTAuOTkyYy0wLjcyNy0wLjkyNC0xLjQ1LTEuNzE4LTEuNDUtMy40OTh2LTUuOTQzCgkJYzAtMi41MTMsMC4xOTUtNC44MjItMS42NDctNi41MzdjLTEuNTE4LTEuMzkxLTMuODkxLTEuOTE2LTUuNzM1LTEuOTE2Yy0wLjI2NCwwLTAuNTI3LDAtMC43OTIsMAoJCWMtMy4zNjIsMC4xOTctNi45MjEsMS42NDctNy43MTQsNS44MTFjLTAuMTMsMC41MjUsMC4yNjcsMC43MjYsMC41MywwLjc5M2wzLjY5MSwwLjQ2NGMwLjM5Ni0wLjA3LDAuNTkzLTAuMzk4LDAuNjU4LTAuNzMKCQljMC4zMzMtMS40NDksMS41MTgtMi4xNzYsMi44MzYtMi4zMDljMC4wNjcsMCwwLjEzMywwLDAuMjY1LDBjMC43OSwwLDEuNjQ2LDAuMzMyLDIuMTA5LDAuOTg3CgkJYzAuNTIzLDAuNzk1LDAuNDYxLDEuODUzLDAuNDYxLDIuNzc1TDIwLjk0OCw5Ljg5MUwyMC45NDgsOS44OTF6IE0yMC4yMjMsMTcuNzQ5CgkJYy0wLjQ2MSwwLjkyNS0xLjI1MywxLjUxOS0yLjExLDEuNzE4Yy0wLjEzMSwwLTAuMzI3LDAuMDY4LTAuNTI2LDAuMDY4Yy0xLjQ1LDAtMi4zMS0xLjEyMy0yLjMxLTIuNzc1CgkJYzAtMi4xMSwxLjI1NC0zLjEwNCwyLjgzNi0zLjU2NWMwLjg1Ny0wLjE5NywxLjg0Ny0wLjI2NSwyLjgzNi0wLjI2NXYwLjc5M0MyMC45NDgsMTUuMjQzLDIxLjAxLDE2LjQzLDIwLjIyMywxNy43NDl6Ii8+PHBhdGggZmlsbD0iI0ZGOTkwMCIgZD0iTTM1LjQxOCwyNi45MTh2MC4yMTUKCQljLTAuMDM1LDEuMjkxLTAuNzE2LDMuNzY4LTIuMzI4LDUuMTMxYy0wLjMyMiwwLjI1LTAuNjQ1LDAuMTA3LTAuNTAzLTAuMjU0YzAuNDY5LTEuMTQ1LDEuNTQxLTMuODAzLDEuMDQtNC40MTIKCQljLTAuMzU1LTAuNDY1LTEuODI2LTAuNDMtMy4wNzktMC4zMjJjLTAuNTcyLDAuMDcyLTEuMDc1LDAuMTA1LTEuNDY5LDAuMTgzYy0wLjM1NywwLjAzMy0wLjQzMS0wLjI4Ny0wLjA3MS0wLjUzNwoJCWMwLjQ2Ni0wLjMyMywwLjk2OS0wLjU3MywxLjU0MS0wLjc1NmMyLjAzOS0wLjYwOCw0LjQwNi0wLjI1LDQuNzI5LDAuMTQ2QzM1LjM0OCwyNi40MTQsMzUuNDE4LDI2LjYyOSwzNS40MTgsMjYuOTE4eiBNMzIuMDE2LDI5LjQyOGMtMC40NjYsMC4zNTctMC45NjUsMC42ODItMS40NjgsMC45NzNjLTMuNzYxLDIuMjYxLTguNjMxLDMuNDQxLTEyLjg1NiwzLjQ0MWMtNi44MDcsMC0xMi44OTUtMi41MTItMTcuNTE0LTYuNzA5CgkJYy0wLjM5Ni0wLjMyNC0wLjA3My0wLjc4OSwwLjM5My0wLjUzOUM1LjU0OSwyOS41LDExLjcwOSwzMS4yNiwxOC4wODQsMzEuMjZjNC4wMTMsMCw4LjM0Mi0wLjc1NCwxMi40NjMtMi4zNzEKCQljMC4yODUtMC4xMDQsMC42MDgtMC4yNTIsMC44OTUtMC4zNTZDMzIuMDg3LDI4LjI0MiwzMi42NjEsMjguOTY1LDMyLjAxNiwyOS40Mjh6Ii8+PC9zdmc+"); background-size: auto 42px; }
.gc-hero-title { font-size: 26px; font-weight: 800; color: #1e293b; margin: 0 0 4px; }
.gc-hero-sub { font-size: 14px; color: #64748b; margin: 0; line-height: 1.5; }

.gc-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 20px; }

.gc-step { display: flex; flex-direction: column; align-items: flex-start; background: #fff; border: 1px solid #e2e8f0; border-radius: 16px; padding: 22px 20px 20px; }
.gc-step-title { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.gc-step-num { width: 22px; height: 22px; border-radius: 50%; background: #2563eb; color: #fff; font-size: 11px; font-weight: 800; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.gc-step h3 { font-size: 15px; font-weight: 700; color: #1e293b; margin: 0; }
.gc-step p { font-size: 13.5px; color: #64748b; margin: 0 0 14px; line-height: 1.55; flex: 1; }

.gc-link-btn { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 18px; border-radius: 9px; background: #ff9900; color: #111; font-size: 14px; font-weight: 700; text-decoration: none; width: 100%; box-sizing: border-box; }
.gc-link-btn:hover { background: #e68900; color: #111; }

.gc-email-box { display: flex; align-items: center; gap: 10px; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 10px; padding: 12px 16px; }
.gc-email-addr { font-size: 15px; font-weight: 600; color: #16a34a; flex: 1; }

.gc-ref-box { display: flex; align-items: center; gap: 10px; background: #fff7ed; border: 2px solid #fed7aa; border-radius: 10px; padding: 14px 16px; }
.gc-ref-label { font-size: 11px; font-weight: 700; color: #9a3412; text-transform: uppercase; letter-spacing: 0.05em; display: none; }
.gc-ref-code { font-size: 16px; font-weight: 800; color: #dc2626; flex: 1; letter-spacing: 0.02em; font-family: monospace; }

.gc-copy-btn { flex-shrink: 0; min-width: 95px; padding: 7px; border-radius: 8px; border: 1px solid #cbd5e1; background: #fff; color: #334155; font-size: 13px; font-weight: 600; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 6px; }
.gc-copy-btn:hover { background: #f1f5f9; }

.gc-details { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.gc-amounts { background: #fff; border: 1px solid #e2e8f0; border-radius: 14px; padding: 20px 22px; }
.gc-info-notes { background: #f0f7ff; border: 1px solid #dbeafe; border-radius: 14px; padding: 20px 22px; }
.gc-amounts h3, .gc-info-notes h3 { font-size: 14px; font-weight: 700; color: #1e293b; margin: 0 0 14px; text-align: center; display: flex; align-items: center; justify-content: center; gap: 7px; }
.gc-amounts h3 i { color: #2563eb; }
.gc-info-notes h3 i { color: #2563eb; }
.gc-amount-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.gc-amount-item { display: flex; flex-direction: column; align-items: center; gap: 4px; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 10px; padding: 12px 8px; }
.gc-amount-item.gc-amount-popular { background: #eff6ff; border-color: #bfdbfe; }
.gc-amount-tier { font-size: 12px; font-weight: 700; color: #64748b; text-transform: uppercase; letter-spacing: 0.04em; }
.gc-amount-popular .gc-amount-tier { color: #2563eb; }
.gc-amount-price { font-size: 22px; font-weight: 900; color: #1e293b; letter-spacing: -0.02em; line-height: 1; }
.gc-amount-popular .gc-amount-price { color: #2563eb; }
.gc-amount-period { font-size: 12px; font-weight: 500; color: #94a3b8; }
.gc-amount-mo { font-size: 11.5px; color: #94a3b8; }
.gc-info-ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 9px; }
.gc-info-ul li { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; color: #475569; line-height: 1.45; }
.gc-info-ul li::before { content: '\f00c'; font-family: 'Font Awesome 6 Free'; font-weight: 900; font-size: 11px; color: #2563eb; flex-shrink: 0; margin-top: 2px; }

[data-theme="dark"] .gc-amounts { background: #0f172a; border-color: #334155; }
[data-theme="dark"] .gc-info-notes { background: #0f1929; border-color: #1e3a8a; }
[data-theme="dark"] .gc-amounts h3, [data-theme="dark"] .gc-info-notes h3 { color: #e2e8f0; }
[data-theme="dark"] .gc-amount-item { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .gc-amount-popular { background: #1e2d4a; border-color: #1e3a8a; }
[data-theme="dark"] .gc-amount-price { color: #e2e8f0; }
[data-theme="dark"] .gc-info-ul li { color: #94a3b8; }

.gc-notices { display: flex; flex-direction: column; gap: 12px; margin-bottom: 28px; }
.gc-notice { display: flex; align-items: flex-start; gap: 12px; padding: 16px 18px; border-radius: 12px; }
.gc-notice i { font-size: 16px; flex-shrink: 0; margin-top: 2px; }
.gc-notice p { margin: 0; font-size: 14px; line-height: 1.5; }
.gc-notice-warn { background: #fef9c3; border: 1px solid #fde047; }
.gc-notice-warn i { color: #ca8a04; }
.gc-notice-warn p { color: #713f12; }
.gc-notice-info { background: #eff6ff; border: 1px solid #bfdbfe; }
.gc-notice-info i { color: #2563eb; }
.gc-notice-info p { color: #1e3a8a; }

.gc-back { text-align: center; }
.gc-back-link { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: #64748b; text-decoration: none; }
.gc-back-link:hover { color: #2563eb; }

[data-theme="dark"] .gc-hero-icon { background-color: #2a1a00; }
[data-theme="dark"] .gc-hero-amazon { background-color: #fff3e0 !important; }
[data-theme="dark"] .gc-hero-title { color: #e2e8f0; }
[data-theme="dark"] .gc-hero-sub { color: #94a3b8; }
[data-theme="dark"] .gc-step { background: #0f172a; border-color: #334155; }
[data-theme="dark"] .gc-step h3 { color: #e2e8f0; }
[data-theme="dark"] .gc-step p { color: #94a3b8; }
[data-theme="dark"] .gc-email-box { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .gc-ref-box { background: #2a1200; border-color: #7c2d12; }
[data-theme="dark"] .gc-copy-btn { background: #1e293b; border-color: #475569; color: #cbd5e1; }
[data-theme="dark"] .gc-copy-btn:hover { background: #334155; }
[data-theme="dark"] .gc-notice-warn { background: #2a1f00; border-color: #78350f; }
[data-theme="dark"] .gc-notice-warn p { color: #fef3c7; }
[data-theme="dark"] .gc-notice-info { background: #0f1929; border-color: #1e3a8a; }
[data-theme="dark"] .gc-notice-info p { color: #bfdbfe; }
[data-theme="dark"] .gc-back-link { color: #64748b; }

/* ── Card payment page ───────────────────────────────────────── */
.cp-wrap { margin: 0 auto; padding: 0 0 40px; }

.cp-hero { display: flex; align-items: center; gap: 18px; padding: 36px 4px 28px; justify-content: center; }
.cp-hero-icon { width: 64px; height: 64px; border-radius: 16px; background: #eff6ff; display: flex; align-items: center; justify-content: center; font-size: 28px; color: #2563eb; flex-shrink: 0; }
.cp-hero-text { text-align: left; }
.cp-hero-title { font-size: 26px; font-weight: 800; color: #1e293b; margin: 0 0 4px; }
.cp-hero-sub { font-size: 14px; color: #64748b; margin: 0; }

.cp-mid-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.cp-box { background: #fff; border: 1px solid #e2e8f0; border-radius: 14px; padding: 22px; }
.cp-box-secure { background: #f0f7ff; border-color: #dbeafe; }
.cp-box-info { background: #f0f7ff; border-color: #dbeafe; }
.cp-box-title { display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 14px; font-weight: 700; color: #1e293b; margin: 0 0 16px; text-align: center; }
.cp-box-title i { color: #2563eb; font-size: 15px; }

.cp-process-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 9px; counter-reset: process-counter; }
.cp-process-list li { display: flex; align-items: flex-start; gap: 10px; font-size: 13.5px; color: #475569; line-height: 1.45; counter-increment: process-counter; }
.cp-process-list li::before { content: counter(process-counter); min-width: 22px; height: 22px; border-radius: 50%; background: #2563eb; color: #fff; font-size: 11px; font-weight: 800; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 1px; }

.cp-secure-list { list-style: none; padding: 0; margin: 0 0 14px; display: flex; flex-direction: column; gap: 10px; }
.cp-secure-list li { display: flex; align-items: flex-start; gap: 9px; font-size: 13.5px; color: #334155; line-height: 1.4; }
.cp-secure-list li i { color: #2563eb; font-size: 13px; flex-shrink: 0; margin-top: 2px; }
.cp-encrypt-note { font-size: 12px; color: #64748b; line-height: 1.5; margin: 0; border-top: 1px solid #dbeafe; padding-top: 12px; }

.cp-info-list2 { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 11px; }
.cp-info-list2 li { display: flex; align-items: flex-start; gap: 9px; font-size: 13.5px; color: #475569; line-height: 1.4; }
.cp-info-list2 li::before { content: '\f05a'; font-family: 'Font Awesome 6 Free'; font-weight: 900; font-size: 12px; color: #2563eb; flex-shrink: 0; margin-top: 2px; }
.cp-info-list2 a { color: #2563eb; text-decoration: none; display: inline; }

.cp-card-logos { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.cp-card-logo { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; padding: 10px; display: flex; align-items: center; justify-content: center; }
.cp-card-logo svg { height: 34px; width: auto; display: block; }
.cp-card-note-small { font-size: 12px; color: #94a3b8; margin: 14px 0 0; text-align: center; }

.cp-tiers { margin-bottom: 28px; }
.cp-tiers h3 { font-size: 15px; font-weight: 700; color: #1e293b; margin: 0 0 14px;text-align: center; }
.cp-tier-row { display: flex; gap: 12px; }
.cp-tier-btn { flex: 1; border: 2px solid #e2e8f0; border-radius: 14px; padding: 22px 14px 18px; background: #fff; cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 4px; position: relative; transition: border-color .15s, background .15s, box-shadow .15s; }
.cp-tier-btn:hover { border-color: #2563eb; background: #eff6ff; box-shadow: 0 4px 16px rgba(37,99,235,.12); }
.cp-tier-badge { position: absolute; top: -11px; left: 50%; transform: translateX(-50%); background: #2563eb; color: #fff; font-size: 11px; font-weight: 700; line-height: 1; padding: 2px 10px; border-radius: 20px; white-space: nowrap; }
.cp-tier-name { font-size: 15px; font-weight: 800; color: #1e293b; }
.cp-tier-price { font-size: 32px; font-weight: 900; color: #2563eb; line-height: 1; letter-spacing: -0.02em; }
.cp-tier-period { font-size: 13px; color: #94a3b8; font-weight: 500; }
.cp-tier-monthly { font-size: 12px; color: #94a3b8; }
.cp-tier-popular { border-color: #2563eb; background: #eff6ff; }

.cp-footer-note { font-size: 13px; color: #94a3b8; text-align: center; margin-bottom: 20px; }
.cp-footer-note a { color: #2563eb; text-decoration: none; }

.cp-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 1000; align-items: center; justify-content: center; }
.cp-modal { background: #fff; border-radius: 16px; width: 540px; max-width: 95vw; overflow: hidden; box-shadow: 0 24px 60px rgba(0,0,0,.3); }
.cp-modal-header { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid #e2e8f0; font-size: 16px; font-weight: 700; color: #1e293b; }
.cp-modal-close { background: none; border: none; cursor: pointer; color: #64748b; font-size: 18px; padding: 4px 8px; }
.cp-modal-close:hover { color: #1e293b; }
.cp-modal-iframe { width: 100%; height: 580px; display: block; }

[data-theme="dark"] .cp-hero-title { color: #e2e8f0; }
[data-theme="dark"] .cp-hero-icon { background: #1e2d4a; color: #60a5fa; }
[data-theme="dark"] .cp-box { background: #0f172a; border-color: #334155; }
[data-theme="dark"] .cp-box-secure { background: #0f1929; border-color: #1e3a8a; }
[data-theme="dark"] .cp-box-info { background: #0f1929; border-color: #1e3a8a; }
[data-theme="dark"] .cp-box-title { color: #e2e8f0; }
[data-theme="dark"] .cp-process-list li { color: #94a3b8; }
[data-theme="dark"] .cp-secure-list li { color: #cbd5e1; }
[data-theme="dark"] .cp-encrypt-note { color: #64748b; border-color: #1e3a8a; }
[data-theme="dark"] .cp-info-list2 li { color: #94a3b8; }
[data-theme="dark"] .cp-card-logo { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .cp-tiers h3 { color: #e2e8f0; }
[data-theme="dark"] .cp-tier-btn { background: #0f172a; border-color: #334155; }
[data-theme="dark"] .cp-tier-btn:hover { background: #1e2d4a; border-color: #2563eb; }
[data-theme="dark"] .cp-tier-popular { background: #1e2d4a; border-color: #2563eb; }
[data-theme="dark"] .cp-tier-name { color: #e2e8f0; }
[data-theme="dark"] .cp-modal { background: #0f172a; }
[data-theme="dark"] .cp-modal-header { color: #e2e8f0; border-color: #334155; }

/* ── Crypto payment page ─────────────────────────────────────── */
.cry-wrap { margin: 0 auto; padding: 0 0 40px; }

.cry-hero { display: flex; align-items: center; gap: 18px; padding: 36px 4px 28px; justify-content: center; }
.cry-hero-icon { width: 64px; height: 64px; border-radius: 16px; background: #fff7ed; display: flex; align-items: center; justify-content: center; font-size: 28px; color: #f7931a; flex-shrink: 0; }
.cry-hero-text { text-align: left; }
.cry-hero-title { font-size: 26px; font-weight: 800; color: #1e293b; margin: 0 0 4px; }
.cry-hero-sub { font-size: 14px; color: #64748b; margin: 0; }

.cry-tiers { margin-bottom: 20px; }
.cry-tiers h3 { font-size: 15px; font-weight: 700; color: #1e293b; margin: 0 0 14px;text-align: center; }
.cry-tier-row { display: flex; gap: 12px; }
.cry-tier-btn { flex: 1; border: 2px solid #e2e8f0; border-radius: 14px; padding: 22px 14px 18px; background: #fff; text-decoration: none; display: flex; flex-direction: column; align-items: center; gap: 4px; position: relative; transition: border-color .15s, background .15s, box-shadow .15s; }
.cry-tier-btn:hover { border-color: #2563eb; background: #eff6ff; box-shadow: 0 4px 16px rgba(37,99,235,.12); }
.cry-tier-badge { position: absolute; top: -11px; left: 50%; transform: translateX(-50%); background: #2563eb; color: #fff; font-size: 11px; font-weight: 700; line-height: 14px; padding: 2px 10px; border-radius: 20px; white-space: nowrap; }
.cry-tier-active { border-color: #2563eb !important; background: #eff6ff !important; }
.cry-tier-name { font-size: 15px; font-weight: 800; color: #1e293b; }
.cry-tier-price { font-size: 32px; font-weight: 900; color: #2563eb; line-height: 1; letter-spacing: -0.02em; }
.cry-tier-period { font-size: 13px; color: #94a3b8; font-weight: 500; }
.cry-tier-mo { font-size: 12px; color: #94a3b8; }

.cry-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 8px; align-items: start; }

.cry-form-box { background: #fff; border: 1px solid #e2e8f0; border-radius: 14px; padding: 22px; }
.cry-info-box { background: #f0f7ff; border: 1px solid #dbeafe; border-radius: 14px; padding: 22px; }

.cry-form { display: flex; flex-direction: column; gap: 16px; }
.cry-field { display: flex; flex-direction: column; gap: 6px; }
.cry-label { font-size: 13px; font-weight: 600; color: #475569; }
.cry-select { width: 100%; padding: 10px 14px; border: 1px solid #e2e8f0; border-radius: 9px; font-size: 14px; color: #1e293b; background: #fff; cursor: pointer; }
.cry-select:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.1); }
.cry-submit { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 13px; border-radius: 10px; background: #2563eb; color: #fff; border: none; font-size: 15px; font-weight: 700; cursor: pointer; margin-top: 4px; }
.cry-submit:hover { background: #1d4ed8; }

.cry-accepted { margin-top: 18px; padding-top: 14px; border-top: 1px solid #dbeafe; }
.cry-accepted-label { font-size: 11px; font-weight: 700; color: #64748b; text-transform: uppercase; letter-spacing: 0.05em; display: block; margin-bottom: 8px; }
.cry-coins { display: flex; gap: 10px; flex-wrap: wrap; }
.cry-coins span { display: flex; align-items: center; gap: 5px; font-size: 13px; font-weight: 600; color: #334155; background: #fff; border: 1px solid #dbeafe; border-radius: 8px; padding: 5px 10px; }
.cry-coins i { color: #f7931a; }

[data-theme="dark"] .cry-hero-title { color: #e2e8f0; }
[data-theme="dark"] .cry-hero-icon { background: #2a1a00; }
[data-theme="dark"] .cry-tiers h3 { color: #e2e8f0; }
[data-theme="dark"] .cry-tier-btn { background: #0f172a; border-color: #334155; }
[data-theme="dark"] .cry-tier-btn:hover { background: #1e2d4a; border-color: #2563eb; }
[data-theme="dark"] .cry-tier-active { background: #1e2d4a !important; }
[data-theme="dark"] .cry-tier-name { color: #e2e8f0; }
[data-theme="dark"] .cry-form-box { background: #0f172a; border-color: #334155; }
[data-theme="dark"] .cry-info-box { background: #0f1929; border-color: #1e3a8a; }
[data-theme="dark"] .cry-label { color: #94a3b8; }
[data-theme="dark"] .cry-select { background: #1e293b; border-color: #334155; color: #e2e8f0; }
[data-theme="dark"] .cry-coins span { background: #1e293b; border-color: #334155; color: #cbd5e1; }

/* ── End giftcard page ───────────────────────────────────────── */

@media (max-width: 768px) {
  .donate-perks {
    gap: 14px;
  }
  .donate-perk {
    width: 80px;
  }
  .donate-perk-icon {
    width: 44px;
    height: 44px;
    font-size: 17px;
  }
  .donate-perk-label {
    font-size: 11.5px;
  }
  .donate-tiers {
    flex-direction: column;
    align-items: center;
  }
  .donate-tier {
    width: 100%;
    max-width: 340px;
  }
  .donate-mid {
    grid-template-columns: 1fr;
  }
  .donate-features {
    grid-template-columns: repeat(2, 1fr);
  }
  .donate-pay-grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .donate-title {
    font-size: 42px;
  }
  .donate-tier-price {
    font-size: 30px;
  }
  .donate-bottom {
    grid-template-columns: 1fr;
  }
}


/* client images ------------------- */

.client-top-section {
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  background: #f0f7ff;
  padding: 20px 32px;
  margin-bottom: 32px;
}
.client-header {
  text-align: center;
  padding: 0 0 0;
}
.client-perks {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-bottom: 0;
  flex-wrap: wrap;
  padding-top: 20px;
}
.client-sabznbd {
  background-image: url(/imagesnew/clients/sabnzbd.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 150px;
  height: 52px;
margin-top: 5px;
}
.client-nzbget {
  background-image: url(/imagesnew/clients/nzbget.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 130px;
  height: 52px;
}
.client-radarr {
  background-image: url(/imagesnew/clients/radarr.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 130px;
  height: 52px;
margin-top: 3px;
}
.client-sonarr {
  background-image: url(/imagesnew/clients/sonarr.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 130px;
  height: 52px;
}
.client-nzbhydra {
  background-image: url(/imagesnew/clients/nzbhydra.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 150px;
  height: 52px;
margin-top: 5px;
}
.client-potatoe {
  background-image: url(/imagesnew/clients/potatoe.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 130px;
  height: 52px;
}
.client-lidarr {
  background-image: url(/imagesnew/clients/lidarr.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 50px;
  height: 52px;
}
/* client images -------------------end */