/* Catalog identity belongs to content. Shared controls stay blue; red remains
   the interaction accent, and member stars retain their gold. */
:root {
  --jav-surface: #103b40;
  --jav-raised: #164c52;
  --jav-hover: #1a5b61;
  --jav-control: #194e54;
  --jav-control-hover: #22636a;
  --jav-action: #128084;
  --jav-action-hover: #116f75;
  --jav-text: #effdff;
  --jav-secondary: #bddfe5;
  --jav-muted: #accfd7;
  --jav-highlight: #7cdfd9;
  --jav-border: #427a83;
  --jav-tag: #1b4e57;
  --jav-tint: rgb(68 201 205 / .16);
}

html[data-catalog-theme="jav"] body { background-color: var(--catalog-page-bg); }

/* Scope the green palette to actual JAV areas, with shared control palettes preserved. The class/link selectors also cover JAV cards on mixed result pages. */
html[data-catalog-theme="jav"] :is(.library-section:has(#javGrid), .entity-page-shell, .catalog-entity-page, .advanced-search-page),
body :is(.video-page-shell:has(#javVideoPageContent), .video-card.jav-card, .video-card:has(.card-page-link[href^="/jav/"])) {
  --bg-primary: #0b2d34;
  --bg-secondary: #0b2d34;
  --bg-card: var(--jav-surface);
  --bg-card-hover: var(--jav-hover);
  --catalog-sort-bg: var(--jav-raised);
  --catalog-control-bg: var(--jav-control);
  --catalog-control-hover: var(--jav-control-hover);
  --catalog-control-text: var(--jav-text);
  --text-primary: var(--jav-text);
  --text-secondary: var(--jav-secondary);
  --text-muted: var(--jav-muted);
  --tag-bg: var(--jav-tag);
  --tag-text: #d7f0f4;
  --border: var(--jav-border);
  --ocean-tint: var(--jav-tint);
  color: var(--text-primary);
}

/* A deeper card base, with teal highlights instead of a pale green wash. */
html body .video-card:is(.jav-card, :has(.card-page-link[href^="/jav/"])) {
  background: var(--jav-surface) !important;
  border-color: var(--jav-border) !important;
  border-top-color: #57939a !important;
  border-bottom-color: #08292e !important;
}
html body .video-card:is(.jav-card, :has(.card-page-link[href^="/jav/"])):is(:hover, :focus-within) {
  background: var(--jav-hover) !important;
  border-color: var(--accent) !important;
}
html body .video-card:is(.jav-card, :has(.card-page-link[href^="/jav/"])):not(.gallery-preview-active) .card-body {
  background-color: transparent;
}
html body .video-card:is(.jav-card, :has(.card-page-link[href^="/jav/"])) :is(.card-category, .card-code-badge) {
  background: var(--jav-action) !important;
  color: #fff;
}
html body.catalog-page .video-grid:not(.list-view) .video-card.jav-card:not(.trending-card) .card-category { background: var(--jav-action) !important; }
html body .video-card:is(.jav-card, :has(.card-page-link[href^="/jav/"])) .card-page-link:focus-visible {
  outline-color: var(--accent-text);
}
html body .video-card:is(.jav-card, :has(.card-page-link[href^="/jav/"])) .card-magnet,
body .video-page-shell:has(#javVideoPageContent) .btn-primary,
html[data-catalog-theme="jav"] .advanced-search-page .btn-primary {
  background: var(--accent);
  color: #fff;
}
html body .video-card:is(.jav-card, :has(.card-page-link[href^="/jav/"])) .card-magnet:hover,
body .video-page-shell:has(#javVideoPageContent) .btn-primary:hover,
html[data-catalog-theme="jav"] .advanced-search-page .btn-primary:hover {
  background: var(--accent-hover);
}
html body .video-card:is(.jav-card, :has(.card-page-link[href^="/jav/"])) .genre-mini {
  border-color: var(--jav-border);
}
html body .video-card:is(.jav-card, :has(.card-page-link[href^="/jav/"])) .genre-mini:hover {
  background: var(--jav-control-hover);
  border-color: var(--accent);
}
html[data-catalog-theme] body .video-card:is(.jav-card, :has(.card-page-link[href^="/jav/"])).gallery-preview-active .card-body {
  background: linear-gradient(to bottom, rgb(6 24 28 / 0) 0%, rgb(6 24 28 / .28) 24%, rgb(6 24 28 / .68) 58%, rgb(6 24 28 / .9) 100%) !important;
}

html[data-catalog-theme="jav"] :is(.entity-page-shell, .catalog-entity-page) :is(.genre-directory-card, .genre-letter-item, .genre-featured-card) { background: var(--jav-surface); }
html[data-catalog-theme="jav"] :is(.library-section:has(#javGrid), .entity-page-shell, .catalog-entity-page, .advanced-search-page) :is(.eyebrow, .catalog-similar-heading a, .trending-rail-heading a, .genre-section-heading a) { color: var(--jav-highlight); }
html[data-catalog-theme="jav"] :is(.entity-page-shell, .catalog-entity-page) :is(.genre-card-artwork, .studio-code-art, .studio-code-art-rail) {
  background: linear-gradient(145deg, #1c6168, #113b43);
  color: var(--jav-text);
}
html[data-catalog-theme="jav"] :is(.entity-page-shell, .catalog-entity-page) :is(.entity-directory-card, .genre-letter-item, .genre-featured-card, .entity-rail-card, .genre-rail-link):hover {
  border-color: var(--accent);
  background-color: var(--jav-hover);
}
body .video-page-shell:has(#javVideoPageContent) .video-page-card { background: var(--jav-surface); }
body .video-page-shell:has(#javVideoPageContent) :is(.btn-secondary, .video-page-meta a, .video-page-back, .video-page-all-matches) { border-color: var(--accent); }
body .video-page-shell:has(#javVideoPageContent) .video-page-meta a { color: var(--jav-highlight); }
body .video-page-shell:has(#javVideoPageContent) :is(.video-page-rail-trending-card, .video-page-related-card):hover { background: var(--jav-hover); border-color: var(--accent); }

/* Shared navigation and the selected catalog segment use the VR styling. */
html[data-catalog-theme="jav"] body #sharedSiteNav {
  --text-primary: #d5e1ee;
  --text-secondary: #c0c7d4;
  --text-muted: #a5afc0;
  color: var(--text-primary);
}
html[data-catalog-theme="jav"] body #sharedSiteNav .header-catalog-toggle button[data-shared-catalog="vr"]:hover { background: #405b7a !important; }

/* Cross-catalog search identifies each column independently of the switch. */
body #sharedSiteNav .global-search-column[data-search-catalog="jav"] {
  --text-primary: var(--jav-text);
  --text-muted: var(--jav-muted);
  background: var(--jav-surface);
}
body #sharedSiteNav .global-search-column[data-search-catalog="jav"] .global-search-heading {
  background: var(--jav-raised);
  color: var(--jav-highlight);
}
body #sharedSiteNav .global-search-column[data-search-catalog="jav"] [data-search-suggestion]:is(:hover, [aria-selected="true"]) { background: var(--jav-control-hover); }
body #sharedSiteNav .global-search-column[data-search-catalog="jav"] .search-suggestion-type { color: var(--jav-highlight); }
body #sharedSiteNav .global-search-column[data-search-catalog="vr"] { background: #18283e; }
body #sharedSiteNav .global-search-column[data-search-catalog="vr"] .global-search-heading { background: #234364; color: #9cd5ff; }
body #sharedSiteNav .global-search-column[data-search-catalog="vr"] [data-search-suggestion]:is(:hover, [aria-selected="true"]) { background: #2e5073; }
body #sharedSiteNav .global-search-column[data-search-catalog="vr"] .search-suggestion-type { color: #9cd5ff; }

/* JAV suggestion panels keep their blue base with a slight green tint. */
html body #javLatestRail,
body .video-page-shell:has(#javVideoPageContent) .video-page-rail-trending {
  background: #223e50;
  border-color: #52627a;
}
/* Match the slight blue-green tint across JAV suggestion panels, including directories,
   profiles, categories and advanced-search results. Change only the panel
   surface so their independently scoped JAV cards stay green. */
html[data-catalog-theme="jav"] body :is(.trending-rail, .video-page-rail-trending, .entity-rail-profiles, .genre-rail-popular) {
  background: #223e50;
  border-color: #52627a;
}

html[data-catalog-theme="jav"] body .catalog-similar-genres { background: #223e50; }

/* Give the JAV sort area the same gently tinted blue surface. */
html[data-catalog-theme="jav"] body :is(.discovery-dock, .entity-directory-header, .entity-release-discovery, .advanced-search-card) {
  background: #223e50;
  border-color: #52627a;
}

/* Sorting and active filters share the VR palette. These local variables do
   not change the green content cards outside the discovery controls. */
html[data-catalog-theme="jav"] body :is(.discovery-dock, .entity-directory-header, .entity-release-discovery, .advanced-search-card, .advanced-catalog-toggle, .advanced-results-toolbar, .active-filter-chips, .profile-release-filter-chips, .genre-letter-picker, .pagination, .library-view-controls) {
  --bg-primary: #0f1117;
  --bg-secondary: #141923;
  --bg-card: #1a2030;
  --bg-card-hover: #222b3d;
  --catalog-sort-bg: #223650;
  --catalog-control-bg: #1a2030;
  --catalog-control-hover: #222b3d;
  --catalog-control-text: #d5e1ee;
  --text-primary: #f3f5f7;
  --text-secondary: #c0c7d4;
  --text-muted: #a5afc0;
  --border: #39445a;
  --tag-bg: #293246;
  --tag-text: #d4dce7;
  color: var(--text-primary);
}
html[data-catalog-theme="jav"] body.catalog-page :is(.discovery-dock, .entity-directory-header, .active-filter-chips, .genre-letter-picker, .pagination, .library-view-controls) {
  --text-primary: var(--catalog-control-text);
}

/* Blue subtitle actions stand out against green JAV cards, including mixed
   results. The existing premium link and authorization flow are unchanged. */
html body .video-card:is(.jav-card, :has(.card-page-link[href^="/jav/"])) :is(.card-subtitle-label, .card-subtitle-toggle) {
  color: #d9efff;
  background: #235b8f;
  border: 1px solid #79baf0;
  border-radius: 5px;
  padding: 4px 7px;
  line-height: 1;
  text-decoration: none;
}
html body .video-card:is(.jav-card, :has(.card-page-link[href^="/jav/"])) :is(.card-subtitle-label, .card-subtitle-toggle):is(:hover, :focus-visible),
html body .video-card:is(.jav-card, :has(.card-page-link[href^="/jav/"])) .card-subtitle-menu.open .card-subtitle-toggle {
  color: #fff;
  background: #306fa6;
  border-color: #a4d8ff;
}


/* JAV uses a blue-green canvas. The selected folder tab meets that exact
   surface; the other tabs sit on a deeper teal. Utility controls stay blue. */
html[data-catalog-theme="jav"] {
  --catalog-page-bg: #25494e;
  --jav-tab-bg: #18373d;
  --jav-tab-hover: #20434a;
  --jav-tab-border: #61818b;
  background-color: var(--catalog-page-bg);
}
html[data-catalog-theme="jav"] body #sharedSiteNav.three-row-header {
  --header-tab-bg: var(--jav-tab-bg);
  --header-tab-hover: var(--jav-tab-hover);
  border-bottom-color: var(--catalog-page-bg);
}
html[data-catalog-theme="jav"] body #sharedSiteNav .header-navigation-row {
  background: var(--jav-tab-bg);
}
html[data-catalog-theme="jav"] body #sharedSiteNav.three-row-header :is(.main-nav, .mobile-menu) a:is(.header-core-link, .header-secondary-link) {
  background: var(--jav-tab-bg);
  border-color: var(--jav-tab-border);
  color: #e3f0f3;
}
html[data-catalog-theme="jav"] body #sharedSiteNav.three-row-header :is(.main-nav, .mobile-menu) a:is(.header-core-link, .header-secondary-link):hover {
  background: var(--jav-tab-hover);
  color: #fff;
}
html[data-catalog-theme="jav"] body #sharedSiteNav.three-row-header :is(.main-nav, .mobile-menu) a.header-core-link.active {
  background: var(--catalog-page-bg);
  border-color: var(--jav-tab-border);
  border-bottom-color: var(--catalog-page-bg);
  box-shadow: none;
  color: #f1fcff;
}
html[data-catalog-theme="jav"] body #sharedSiteNav.three-row-header .mobile-menu {
  background: var(--jav-tab-bg);
  border-color: var(--jav-tab-border);
}

/* The brand follows the selected catalog even on a context-preserving video page. */
body #sharedSiteNav.three-row-header .header-toggle-brand .header-catalog-toggle:has(button[data-shared-catalog="jav"].active) {
  background: var(--jav-raised) !important;
}

/* Folder tabs retain teal; utility links and the surrounding strip stay blue. */
html[data-catalog-theme="jav"] body #sharedSiteNav .header-navigation-row,
html[data-catalog-theme="jav"] body #sharedSiteNav.three-row-header .mobile-menu {
  background: #1d2b40;
}
html[data-catalog-theme="jav"] body #sharedSiteNav.three-row-header :is(.main-nav, .mobile-menu) a.header-secondary-link {
  background: #1a2030;
  border-color: #63758d;
  color: #d5e1ee;
}
html[data-catalog-theme="jav"] body #sharedSiteNav.three-row-header :is(.main-nav, .mobile-menu) a.header-secondary-link:hover {
  background: #222b3d;
  color: #fff;
}

/* All discovery controls keep their established dark blue-green fill. */
html[data-catalog-theme="jav"] body :is(.discovery-dock, .entity-directory-header, .entity-release-discovery, .advanced-search-card) {
  --catalog-control-bg: #142f3b;
  --catalog-control-hover: #1c4350;
}
html[data-catalog-theme="jav"] body :is(.discovery-dock, .entity-directory-header, .entity-release-discovery, .advanced-search-card) :is(.discovery-control > summary, .discovery-sort-menu > summary, .sort-controls select, .sort-picker > select, .subtitle-language-control > select) {
  background-color: var(--catalog-control-bg);
}
html[data-catalog-theme="jav"] body :is(.discovery-dock, .entity-directory-header, .entity-release-discovery, .advanced-search-card) :is(.discovery-control > summary, .discovery-sort-menu > summary, .sort-controls select, .sort-picker > select, .subtitle-language-control > select):hover {
  background-color: var(--catalog-control-hover);
}

/* Reserve the fully populated details footprint, including optional fields.
   Gallery hover freezes the outer card separately and keeps its title gradient. */
body :is(.video-grid:not(.list-view), .video-page-related-grid) > .video-card:not(.trending-card, .gallery-preview-active) .card-body {
  box-sizing: border-box;
  height: 224px;
  min-height: 224px;
  max-height: 224px;
  flex: 0 0 224px;
}
body :is(.video-grid:not(.list-view), .video-page-related-grid) > .video-card:not(.trending-card, .gallery-preview-active) .card-body > :is(.card-eng-title, .card-cast, .card-genres, .card-footer) {
  flex-shrink: 0;
}
body .video-grid.list-view > .video-card:not(.trending-card, .gallery-preview-active) {
  height: 176px;
  min-height: 176px;
  max-height: 176px;
}
@media (max-width: 759px) {
  body :is(.video-grid:not(.list-view), .video-page-related-grid) > .video-card:not(.trending-card, .gallery-preview-active) .card-body {
    height: 220px;
    min-height: 220px;
    max-height: 220px;
    flex-basis: 220px;
  }
}

/* Use the established layered card shadow on every compact suggestion card. */
html body :is(.trending-rail, .advanced-search-rail, .sidebar) .video-card.trending-card,
html body .video-page-rail .video-page-rail-trending-card,
html body .entity-page-shell .entity-rail-card,
html body .entity-rail-profiles .entity-rail-card,
html body .genre-rail-popular :is(.genre-rail-link, .genre-letter-item),
html body .catalog-similar-genres .catalog-similar-genre-link {
  box-shadow: var(--catalog-card-shadow);
  border-top-color: rgb(255 255 255 / .14);
  border-bottom-color: rgb(0 0 0 / .28);
  transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}
html body :is(.trending-rail, .advanced-search-rail, .sidebar) .video-card.trending-card:is(:hover, :focus-within),
html body .video-page-rail .video-page-rail-trending-card:is(:hover, :focus-within),
html body .entity-page-shell .entity-rail-card:is(:hover, :focus-within),
html body .entity-rail-profiles .entity-rail-card:is(:hover, :focus-within),
html body .genre-rail-popular :is(.genre-rail-link, .genre-letter-item):is(:hover, :focus-within),
html body .catalog-similar-genres .catalog-similar-genre-link:is(:hover, :focus-within) {
  box-shadow: var(--catalog-card-shadow-hover);
  border-color: var(--accent);
}
@media (prefers-reduced-motion: reduce) {
  html body :is(.trending-rail, .advanced-search-rail, .sidebar) .video-card.trending-card,
  html body .video-page-rail .video-page-rail-trending-card,
  html body .entity-page-shell .entity-rail-card,
  html body .entity-rail-profiles .entity-rail-card,
  html body .genre-rail-popular :is(.genre-rail-link, .genre-letter-item),
  html body .catalog-similar-genres .catalog-similar-genre-link { transition: none; }
}

/* Give the JAV Actresses, Studios and Categories headers a deeper ocean green. */
html[data-catalog-theme="jav"] body .entity-directory-header {
  background: #14383f;
}