/* Anu’s Public Shame overlay for avt.php
   Link AFTER n.css + style.css */

@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=Source+Serif+4:opsz,wght@8..60,400;8..60,600&display=swap");

:root {
  --bg-red: #c45c3a;
  --bg-white: #e8c9a0;
  --bg-black: #171410;
  --shame-bg: #0a0908;
  --shame-panel: #171410;
  --shame-line: #3a3228;
  --shame-gold: #c4a574;
  --shame-rust: #c45c3a;
  --shame-text: #e6d3b8;
  --shame-muted: #b7a893;
}

html,
body {
  background: var(--shame-bg) !important;
  color: var(--shame-text) !important;
  font-family: "Source Serif 4", Georgia, serif !important;
}

.main-layout {
  max-width: 1180px;
  padding: 12px;
}

.player-wrapper,
.player-container {
  background: var(--shame-bg) !important;
}

.player-wrapper {
  border: 1px solid var(--shame-line);
  background: var(--shame-panel);
  padding: 0.55rem;
}

#player {
  border-radius: 0;
  background: #000;
}
/**/
.video-title,
.video-title:empty + * {
  font-family: "Source Serif 4", Georgia, serif;
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--shame-text);
  margin: 0.7rem 0 0.35rem;
}

/**/
.video-desc,
.video-meta,
.video-meta-bar,
.meta-item,
.ep-time {
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 0.61rem;
  color: var(--shame-muted) !important;
}
/**/
.video-meta-bar .dot {
  color: var(--shame-line);
}

.col-lg-8 .sidebar,
.main-layout .sidebar {
  background: var(--shame-panel) !important;
  border: 1px solid var(--shame-line);
  border-radius: 0;
  color: var(--shame-text);
  max-height: calc(100vh - 24px);
}

.episode {
  border-bottom: 1px solid var(--shame-line) !important;
  background: transparent;
}

.episode:hover {
  background: #110f0c !important;
}

.episode.playing {
  background: #2a1710 !important;
  border-left: 4px solid var(--shame-rust) !important;
}

.ep-title,
.ep-title:link,
.ep-title:visited,
.ep-title-time,
.ep-title-time:link {
  color: var(--shame-text) !important;
  text-decoration: none !important;
}

.ep-title:hover,
.ep-title-time:hover {
  color: var(--shame-gold) !important;
  text-decoration: none !important;
}

.thumb {
  background: #110f0c;
  border-radius: 0;
  border: 1px solid var(--shame-line);
}

.sort-tab,
#loadMoreBtn,
.btn-outline-light {
  background: #2a1710 !important;
  border: 1px solid var(--shame-gold) !important;
  color: var(--shame-gold) !important;
  border-radius: 0 !important;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sort-tab.active,
#loadMoreBtn:hover,
.btn-outline-light:hover {
  background: #3a1e14 !important;
  color: #e8c9a0 !important;
}

.rate label,
.rating-meta .value {
  color: var(--shame-gold);
}

.confirmContent,
.storageContent,
.commentModalContent {
  background: #171410 !important;
  border: 1px solid var(--shame-line) !important;
  border-radius: 0 !important;
  color: var(--shame-text) !important;
}

.confirmActions button,
.createFolderInputGroup button,
#cadd button {
  border-radius: 0 !important;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

#confirmYes {
  background: var(--shame-rust) !important;
}

#confirmNo,
.createFolderInputGroup input,
#cname,
#cmsg {
  background: #110f0c !important;
  color: var(--shame-text) !important;
  border: 1px solid var(--shame-line) !important;
}

.createFolderInputGroup button {
  background: #2a1710 !important;
  color: var(--shame-gold) !important;
  border: 1px solid var(--shame-gold) !important;
}

#toast {
  background: #2a1710 !important;
  border: 1px solid var(--shame-gold);
  border-radius: 0;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 0.78rem;
}

.jwplayer.jw-skin-netflix
  .jw-controlbar
  .jw-button-container
  .jw-button-color:hover,
.jwplayer.jw-skin-netflix
  .jw-display-controls
  .jw-display-icon-container
  .jw-icon:hover {
  color: var(--shame-rust) !important;
}

@media (max-width: 991px) {
  .col-lg-8 .sidebar,
  .main-layout .sidebar {
    max-height: none;
    margin-top: 12px;
  }
}