/* dancemore - prosilver child style
   Aesthetic: indra-theme (crystal-panel, RGB borders, dark technomancer)
   Parent: prosilver */
@import url("../../prosilver/theme/stylesheet.css");

/* ============================================
   Color variables (from indra-theme)
   ============================================ */
:root {
    --dm-bg:             #0a0a12;
    --dm-bg-panel:       rgba(12, 12, 20, 0.9);
    --dm-bg-panel-solid: #0c0c14;
    --dm-bg-input:       rgba(0, 0, 0, 0.6);
    --dm-bg-hover:       rgba(251, 191, 36, 0.08);
    --dm-text:           #f8f8f8;
    --dm-text-secondary: #d0d0d0;
    --dm-text-muted:     #b0b0b0;
    --dm-text-dim:       #606060;
    --dm-accent:         #fbbf24;
    --dm-accent-hover:   #fcd34d;
    --dm-accent-border:  rgba(251, 191, 36, 0.4);
    --dm-accent-bg:      rgba(251, 191, 36, 0.15);
    --dm-border:         rgba(255, 255, 255, 0.12);
    --dm-success:        #00ff80;
    --dm-danger:         #ff8c00;
    --dm-warning:        #ffbf00;
    --dm-pink:           #ff3ac4;
    --dm-ghost-blue-rgb: 128, 192, 255;
    --dm-text-bright:    #ffffff;
    --dm-pink-rgb:       255, 58, 196;
    --dm-btn-hover-color:#ff6ed4;
    --dm-h1-gradient:    linear-gradient(to right, #ff0080, #ff00ff, #00ffff, #00ff00, #ffff00, #ff7f00, #ff0000);
    --dm-h1-speed:       4s;
    --dm-bg-dark-rgb:    8, 8, 14;
    --dm-bg-dark2-rgb:   16, 16, 28;
    --dm-bg-dark3-rgb:   20, 20, 36;
    --dm-bg-quote:       rgba(10, 10, 20, 0.8);
    --dm-bg-quote-nested:rgba(15, 15, 30, 0.8);
    --dm-bg-code:        rgba(0, 0, 0, 0.5);
    --dm-bg-attach:      rgba(0, 0, 0, 0.3);
    --dm-bg-overlay:     rgba(0, 0, 0, 0.5);
    --dm-rgb-gradient:   #ff0000, #ff8000, #ffff00, #00ff00, #00ffff, #0080ff, #8000ff, #ff0080, #ff0000;
    --dm-rgb-speed:      8s;
    --dm-link-visited:   #6090c0;
    --dm-reported-bg:    rgba(255, 64, 64, 0.1);
    --dm-reported-hover: rgba(255, 64, 64, 0.15);
    --dm-rules-bg:       rgba(255, 64, 64, 0.15);
    --dm-notice-bg:      rgba(255, 191, 0, 0.15);
    --dm-posthilit-bg:   rgba(255, 0, 128, 0.3);
    --dm-scrollbar-track:rgba(255, 255, 255, 0.05);
    --dm-font-family:    -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --dm-pollbar1:       #ff0080; --dm-pollbar1-border: #cc0066;
    --dm-pollbar2:       #ff00ff; --dm-pollbar2-border: #cc00cc;
    --dm-pollbar3:       #8000ff; --dm-pollbar3-border: #6600cc;
    --dm-pollbar4:       #0080ff; --dm-pollbar4-border: #0066cc;
    --dm-pollbar5:       #00ffff; --dm-pollbar5-border: #00cccc;
}

/* ============================================
   RGB border animation (from indra-theme)
   ============================================ */
@keyframes rgb-border {
    0%   { background-position: 0% 50%; }
    100% { background-position: 400% 50%; }
}

@keyframes rainbow-text {
    0%   { filter: hue-rotate(0deg); }
    100% { filter: hue-rotate(360deg); }
}

/* ============================================
   Base - dark theme foundation
   ============================================ */
html, body {
    color: var(--dm-text);
    background-color: var(--dm-bg);
}

body {
    font-family: var(--dm-font-family);
}

/* ============================================
   Main wrapper - crystal panel style
   ============================================ */
.wrap {
    background-color: var(--dm-bg-panel-solid);
    border-color: transparent;
    position: relative;
    border-radius: 8px;
}

/* RGB animated border on main wrapper */
.wrap::before {
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    background: linear-gradient(90deg, var(--dm-rgb-gradient));
    background-size: 400% 100%;
    border-radius: 10px;
    z-index: -1;
    animation: rgb-border var(--dm-rgb-speed) linear infinite;
    opacity: 0.5;
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 2px;
}

/* ============================================
   Header bar
   ============================================ */
.headerbar {
    color: var(--dm-text-bright);
    background: var(--dm-bg-panel-solid);
    background-image: none;
    position: relative;
    z-index: 100;
}

h1 {
    color: var(--dm-text-bright);
    background: var(--dm-h1-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: rainbow-text var(--dm-h1-speed) infinite linear;
}

/* Site description: stretched logo link makes entire area clickable.
   Logo stays floated (prosilver default). The ::after overlay on the
   logo link covers the full #site-description so h1 + tagline are
   clickable without needing to change the HTML. */
#site-description {
    position: relative;
    cursor: pointer;
}

#site-description .logo::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

#site-description h1,
#site-description p:not(.skiplink) {
    pointer-events: none;
    position: relative;
    z-index: 0;
}

h2 {
    color: var(--dm-text);
}

h3 {
    border-bottom-color: var(--dm-border);
    color: var(--dm-accent);
}

/* ============================================
   Links (from indra-theme)
   ============================================ */
a {
    color: var(--dm-accent);
}

a:hover {
    color: var(--dm-accent-hover);
}

.forumbg .header a, .forabg .header a, th a {
    color: var(--dm-text-bright);
}

.forumbg .header a:hover, .forabg .header a:hover, th a:hover {
    color: var(--dm-accent-hover);
}

.postlink {
    border-bottom-color: var(--dm-accent);
    color: var(--dm-accent);
}

.postlink:visited {
    border-bottom-color: var(--dm-link-visited);
    color: var(--dm-link-visited);
}

.postlink:hover {
    background-color: rgba(var(--dm-ghost-blue-rgb), 0.1);
    color: var(--dm-accent-hover);
}

/* ============================================
   Forum/category headers - crystal panel style
   ============================================ */
.headerbar, .forumbg {
    background-color: var(--dm-bg-panel-solid);
    background-image: none;
    border-radius: 8px;
}

.forabg {
    background-color: var(--dm-bg-panel-solid);
    background-image: none;
    border-radius: 8px;
}

/* RGB border on forum category headers */
.forumbg,
.forabg {
    position: relative;
}

.forumbg::before,
.forabg::before {
    content: '';
    position: absolute;
    top: -1px;
    left: -1px;
    right: -1px;
    bottom: -1px;
    background: linear-gradient(90deg, var(--dm-rgb-gradient));
    background-size: 400% 100%;
    border-radius: 9px;
    z-index: 0;
    animation: rgb-border var(--dm-rgb-speed) linear infinite;
    opacity: 0.6;
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 1px;
}

.forumbg > *,
.forabg > * {
    position: relative;
    z-index: 1;
}

/* ============================================
   Navigation bar
   ============================================ */
.navbar {
    background-color: rgba(var(--dm-bg-dark-rgb), 0.95);
    backdrop-filter: blur(10px);
    position: relative;
    z-index: 100;
}

ul.navlinks {
    border-top-color: var(--dm-border);
}

.navbar .linklist li a {
    padding: 8px 12px;
    display: inline-block;
}

/* ============================================
   Panels & content areas
   ============================================ */
.panel {
    background-color: var(--dm-bg-panel-solid);
    color: var(--dm-text);
    border-radius: 7px;
    position: relative;
}

/* RGB border on panels */
.panel::before {
    content: '';
    position: absolute;
    top: -1px;
    left: -1px;
    right: -1px;
    bottom: -1px;
    background: linear-gradient(90deg, var(--dm-rgb-gradient));
    background-size: 400% 100%;
    border-radius: 8px;
    z-index: 0;
    animation: rgb-border var(--dm-rgb-speed) linear infinite;
    opacity: 0.5;
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 1px;
    pointer-events: none;
}

.panel > * {
    position: relative;
    z-index: 1;
}

/* RGB borders on form elements (login, fieldsets) */
.login::before,
fieldset::before {
    content: '';
    position: absolute;
    top: -1px;
    left: -1px;
    right: -1px;
    bottom: -1px;
    background: linear-gradient(90deg, var(--dm-rgb-gradient));
    background-size: 400% 100%;
    border-radius: 8px;
    z-index: 0;
    animation: rgb-border var(--dm-rgb-speed) linear infinite;
    opacity: 0.5;
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 1px;
}

/* Remove RGB border from utility fieldsets */
fieldset.submit-buttons::before,
#search-box fieldset::before {
    content: none;
}

.login > *,
fieldset > * {
    position: relative;
    z-index: 1;
}

.login,
fieldset {
    position: relative;
}

.post {
    border-radius: 7px;
    overflow: hidden;
    position: relative;
}

/* RGB border on posts - inset version to work with overflow:hidden */
.post::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(90deg, var(--dm-rgb-gradient));
    background-size: 400% 100%;
    border-radius: 7px;
    z-index: 0;
    animation: rgb-border var(--dm-rgb-speed) linear infinite;
    opacity: 0.6;
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 2px;
    pointer-events: none;
}

.post > * {
    position: relative;
    z-index: 1;
}

/* Hide default prosilver online ribbon (it's a background-image GIF) */
.post.online,
.panel.online {
    background-image: none !important;
}

.panel.online {
    overflow: hidden;
}

/* Online indicator corner ribbon - dark with RGB border */
.post.online::after,
.panel.online::after {
    content: 'ONLINE';
    position: absolute;
    top: 14px;
    right: -34px;
    background: var(--dm-bg-panel-solid);
    color: var(--dm-text);
    padding: 6px 42px;
    transform: rotate(45deg);
    font-size: 10px;
    font-weight: bold;
    letter-spacing: 1px;
    border-radius: 5px;
    border: 1px solid var(--dm-accent);
    box-shadow:
        0 2px 8px rgba(0, 0, 0, 0.3),
        0 0 0 2px var(--dm-bg-panel-solid),
        0 0 12px rgba(251, 191, 36, 0.4);
    z-index: 10;
}

.post:target .content {
    color: var(--dm-text-bright);
}

.post:target h3 a,
.post h3 a.first-unread {
    color: var(--dm-text-bright);
}

/* Alternating row backgrounds */
.bg1 {
    background-color: rgba(var(--dm-bg-dark-rgb), 0.6);
}

table.zebra-list tr:nth-child(odd) td,
ul.zebra-list li:nth-child(odd) {
    background-color: rgba(var(--dm-bg-dark-rgb), 0.6);
}

.bg2 {
    background-color: rgba(var(--dm-bg-dark2-rgb), 0.6);
}

table.zebra-list tr:nth-child(even) td,
ul.zebra-list li:nth-child(even) {
    background-color: rgba(var(--dm-bg-dark2-rgb), 0.6);
}

.bg3 {
    background-color: rgba(var(--dm-bg-dark3-rgb), 0.8);
}

/* Topic / forum list rows */
ul.forums {
    background-color: rgba(var(--dm-bg-dark-rgb), 0.5);
    background-image: none;
    filter: none;
}

ul.topiclist li {
    color: var(--dm-text-secondary);
}

ul.topiclist dd {
    border-left-color: var(--dm-border);
}

li.row {
    border-top-color: var(--dm-border);
    border-bottom-color: transparent;
}

li.row strong {
    color: var(--dm-text);
}

li.row:hover {
    background-color: var(--dm-bg-hover);
}

li.row:hover dd {
    border-left-color: var(--dm-border);
}

li.header dt, li.header dd {
    color: var(--dm-text-bright);
}

/* ============================================
   Post body & content
   ============================================ */
.postbody {
    color: var(--dm-text);
}

.content {
    color: var(--dm-text);
}

.content h2, .panel h2 {
    color: var(--dm-accent);
    border-bottom-color: var(--dm-border);
}

dl.faq dt {
    color: var(--dm-text);
}

.posthilit {
    background-color: var(--dm-posthilit-bg);
    color: var(--dm-pink);
}

/* Post signature */
.signature {
    border-top-color: var(--dm-border);
}

.notice {
    border-top-color: var(--dm-border);
}

/* Poster profile */
.postprofile {
    color: var(--dm-text-muted);
    border-color: var(--dm-border);
}

.postprofile strong {
    color: var(--dm-text);
}

/* ============================================
   Quotes & code blocks
   ============================================ */
blockquote {
    background-color: var(--dm-bg-quote);
    border-color: var(--dm-accent-border);
}

blockquote blockquote {
    background-color: var(--dm-bg-quote-nested);
}

blockquote blockquote blockquote {
    background-color: var(--dm-bg-quote);
}

.codebox {
    background-color: var(--dm-bg-code);
    border-color: var(--dm-border);
}

.codebox p {
    border-bottom-color: var(--dm-border);
}

.codebox code {
    color: var(--dm-success);
}

/* ============================================
   Tables (from indra-theme data-table)
   ============================================ */
table.table1 thead th {
    color: var(--dm-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

table.table1 tbody tr {
    border-color: var(--dm-border);
}

table.table1 tbody tr:hover,
table.table1 tbody tr.hover {
    background-color: var(--dm-bg-hover);
    color: var(--dm-text);
}

table.table1 td {
    color: var(--dm-text-secondary);
}

table.table1 tbody td {
    border-top-color: var(--dm-border);
}

table.table1 tbody th {
    border-bottom-color: var(--dm-border);
    color: var(--dm-text);
    background-color: transparent;
}

/* ============================================
   Buttons — neon pink pop
   ============================================ */
.button,
a.button1, input.button1, input.button3,
a.button2, input.button2 {
    position: relative;
    border: 1px solid rgba(var(--dm-pink-rgb), 0.5);
    background-color: rgba(var(--dm-pink-rgb), 0.08);
    background-image: none;
    filter: none;
    box-shadow: none;
    -webkit-box-shadow: none;
    color: var(--dm-pink);
    transition: all 0.3s ease;
    overflow: hidden;
    border-radius: 6px;
}

/* Shimmer sweep on hover */
.button::before,
a.button1::before, input.button1::before,
a.button2::before, input.button2::before,
input.button3::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(var(--dm-pink-rgb), 0.12), transparent);
    transition: left 0.5s ease;
    pointer-events: none;
}

.button:hover::before,
a.button1:hover::before, input.button1:hover::before,
a.button2:hover::before, input.button2:hover::before,
input.button3:hover::before {
    left: 100%;
}

.button:hover,
.button:focus,
a.button1:hover, input.button1:hover,
a.button2:hover, input.button2:hover,
input.button3:hover {
    border-color: var(--dm-pink);
    background-color: rgba(var(--dm-pink-rgb), 0.2);
    background-image: none;
    filter: none;
    color: var(--dm-btn-hover-color);
    box-shadow: 0 0 18px rgba(var(--dm-pink-rgb), 0.3), inset 0 0 18px rgba(var(--dm-pink-rgb), 0.06);
    text-shadow: 0 0 8px rgba(var(--dm-pink-rgb), 0.5);
}

input.button1:focus, input.button2:focus, input.button3:focus {
    border-color: var(--dm-pink);
    color: var(--dm-pink);
    outline: none;
    box-shadow: 0 0 0 2px rgba(var(--dm-pink-rgb), 0.25);
}

.button .icon {
    color: var(--dm-pink);
}

.button:focus .icon,
.button:hover .icon {
    color: var(--dm-btn-hover-color);
}

input.disabled {
    color: var(--dm-text-dim);
    opacity: 0.5;
    box-shadow: none;
}

/* ============================================
   Pagination (from indra-theme)
   ============================================ */
.pagination li a {
    background: var(--dm-bg-input);
    filter: none;
    border-color: var(--dm-accent-border);
    box-shadow: none;
    -webkit-box-shadow: none;
    color: var(--dm-text-secondary);
    transition: all 0.2s ease;
}

.pagination li.ellipsis span {
    background: transparent;
    color: var(--dm-text-muted);
}

.pagination li.active span {
    background: var(--dm-accent-bg);
    border-color: var(--dm-accent);
    color: var(--dm-text-bright);
}

.pagination li a:hover,
.pagination li a:hover .icon,
.pagination .dropdown-visible a.dropdown-trigger,
.nojs .pagination .dropdown-container:hover a.dropdown-trigger {
    background: rgba(var(--dm-ghost-blue-rgb), 0.15);
    border-color: var(--dm-accent);
    filter: none;
    color: var(--dm-text-bright);
    text-shadow: none;
}

/* ============================================
   Forms & inputs (from indra-theme)
   ============================================ */
select {
    border-color: var(--dm-accent-border);
    background-color: var(--dm-bg-panel-solid);
    color: var(--dm-text);
}

label {
    color: var(--dm-text-secondary);
}

fieldset dl:hover dt label {
    color: var(--dm-text);
}

.inputbox {
    background-color: var(--dm-bg-input);
    border-color: var(--dm-accent-border);
    color: var(--dm-text);
}

.inputbox:hover {
    border-color: var(--dm-accent);
}

.inputbox:focus {
    border-color: var(--dm-accent);
    outline: none;
}

.message-box textarea {
    color: var(--dm-text);
}

.message-box textarea.drag-n-drop {
    outline-color: rgba(var(--dm-ghost-blue-rgb), 0.3);
}

.message-box textarea.drag-n-drop-highlight {
    outline-color: rgba(var(--dm-ghost-blue-rgb), 0.6);
}

fieldset.quick-login input.inputbox {
    background-color: var(--dm-bg-input);
}

dd label {
    color: var(--dm-text-secondary);
}

/* ============================================
   Search
   ============================================ */
.search-header {
    position: relative;
}

.search-header::before {
    content: '';
    position: absolute;
    top: -1px;
    left: -1px;
    right: -1px;
    bottom: -1px;
    background: linear-gradient(90deg, var(--dm-rgb-gradient));
    background-size: 400% 100%;
    border-radius: 4px;
    z-index: 0;
    animation: rgb-border var(--dm-rgb-speed) linear infinite;
    opacity: 0.5;
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 1px;
}

.search-header > * {
    position: relative;
    z-index: 1;
}

.search-results li:hover,
.search-results li.active {
    background-color: var(--dm-bg-hover);
}

.search-box .inputbox,
.search-box .inputbox:hover,
.search-box .inputbox:focus {
    border-color: var(--dm-accent-border);
}

/* ============================================
   Alerts & notices (from indra-theme)
   ============================================ */
.error {
    color: var(--dm-danger);
}

.reported {
    background-color: var(--dm-reported-bg);
}

li.reported:hover {
    background-color: var(--dm-reported-hover) !important;
}

div.rules {
    background-color: var(--dm-rules-bg);
    color: var(--dm-danger);
}

p.post-notice {
    background-color: var(--dm-notice-bg);
    background-image: none;
}

/* ============================================
   Dropdowns & popups
   ============================================ */
.phpbb_alert {
    background-color: var(--dm-bg-panel-solid);
    border-color: var(--dm-border);
}

.darken {
    background-color: var(--dm-bg);
}

.dropdown .dropdown-contents {
    background: var(--dm-bg-panel-solid);
    border-color: var(--dm-border);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
}

.dropdown .pointer {
    border-color: var(--dm-border) transparent;
}

.dropdown .pointer-inner {
    border-color: var(--dm-bg-panel-solid) transparent;
}

.dropdown li, .dropdown li li {
    border-color: var(--dm-border);
}

.dropdown li.separator {
    border-color: var(--dm-border);
}

.dropdown-extended ul li {
    border-top-color: var(--dm-border);
}

.dropdown-extended ul li:hover {
    background-color: var(--dm-bg-hover);
    color: var(--dm-text);
}

.dropdown-extended .header, .dropdown-extended .footer {
    border-color: var(--dm-border);
    color: var(--dm-text);
}

.dropdown-extended .header {
    background-color: rgba(var(--dm-bg-dark-rgb), 0.95);
    background-image: none;
    filter: none;
    text-shadow: none;
}

.dropdown-extended .pointer-inner {
    border-color: rgba(var(--dm-bg-dark-rgb), 0.95) transparent;
}

/* Jumpbox */
.jumpbox .dropdown li {
    border-top-color: var(--dm-border);
}

.jumpbox-cat-link {
    background-color: var(--dm-bg-panel-solid);
    border-top-color: var(--dm-border);
    color: var(--dm-accent);
}

.jumpbox-cat-link:hover {
    background-color: var(--dm-accent-bg);
    border-top-color: var(--dm-border);
    color: var(--dm-accent-hover);
}

.jumpbox-forum-link {
    background-color: rgba(var(--dm-bg-dark-rgb), 0.8);
}

.jumpbox-forum-link:hover {
    background-color: var(--dm-bg-hover);
}

.jumpbox .dropdown .pointer-inner {
    border-color: rgba(var(--dm-bg-dark-rgb), 0.8) transparent;
}

.jumpbox-sub-link {
    background-color: rgba(var(--dm-bg-dark-rgb), 0.8);
}

.jumpbox-sub-link:hover {
    background-color: var(--dm-bg-hover);
}

/* ============================================
   Notifications
   ============================================ */
.notification_list p.notification-time {
    color: var(--dm-text-muted);
}

li.notification-reported strong,
li.notification-disapproved strong {
    color: var(--dm-danger);
}

.badge {
    background-color: var(--dm-pink);
    color: var(--dm-text-bright);
}

/* ============================================
   UCP / MCP panels
   ============================================ */
.panel-container h3, .panel-container hr, .cp-menu hr {
    border-color: var(--dm-border);
}

.panel-container .panel li.row {
    border-bottom-color: var(--dm-border);
    border-top-color: var(--dm-border);
}

ul.cplist {
    border-top-color: var(--dm-border);
}

.panel-container .panel li.header dd,
.panel-container .panel li.header dt {
    color: var(--dm-text);
}

.panel-container table.table1 thead th {
    color: var(--dm-text-muted);
    border-bottom-color: var(--dm-border);
}

.cp-main .pm-message {
    border-color: var(--dm-border);
    background-color: var(--dm-bg-panel-solid);
}

/* Tabs */
.tabs .tab > a {
    background: rgba(var(--dm-ghost-blue-rgb), 0.1);
    color: var(--dm-text-secondary);
}

.tabs .tab > a:hover {
    background: var(--dm-accent-bg);
    color: var(--dm-accent);
}

.tabs .activetab > a,
.tabs .activetab > a:hover {
    background-color: var(--dm-bg-panel-solid);
    background-image: none;
    filter: none;
    border-color: var(--dm-accent-border);
    box-shadow: none;
    color: var(--dm-accent);
}

/* Navigation */
.navigation a {
    color: var(--dm-text-secondary);
    background: rgba(var(--dm-ghost-blue-rgb), 0.1);
    filter: none;
}

.navigation a:hover {
    background: var(--dm-accent-bg);
    color: var(--dm-accent);
    filter: none;
}

.navigation .active-subsection a {
    background: var(--dm-bg-panel-solid);
    color: var(--dm-accent);
    filter: none;
}

.panel-container h2 {
    color: var(--dm-text);
}

.panel-container .panel {
    background-color: rgba(var(--dm-bg-dark-rgb), 0.6);
}

.cp-main .pm {
    background-color: var(--dm-bg-panel-solid);
}

.cp-mini {
    background-color: rgba(var(--dm-bg-dark-rgb), 0.5);
}

dl.mini dt {
    color: var(--dm-text-muted);
}

/* ============================================
   Attachments
   ============================================ */
.attachbox {
    background-color: var(--dm-bg-attach);
    border-color: var(--dm-border);
}

.pm-message .attachbox {
    background-color: var(--dm-bg-attach);
}

.attachbox dd {
    border-top-color: var(--dm-border);
}

.attachbox p, .attachbox p.stats {
    color: var(--dm-text-muted);
}

dl.file dd {
    color: var(--dm-text-muted);
}

dl.thumbnail img {
    border-color: var(--dm-border);
    background-color: transparent;
}

dl.thumbnail dd {
    color: var(--dm-text-muted);
}

dl.thumbnail dt a:hover {
    background-color: var(--dm-bg-hover);
}

dl.thumbnail dt a:hover img {
    border-color: var(--dm-accent);
}

/* ============================================
   Polls
   ============================================ */
fieldset.polls dl {
    border-top-color: var(--dm-border);
    color: var(--dm-text-muted);
}

fieldset.polls dl.voted {
    color: var(--dm-text);
}

fieldset.polls dd div {
    color: var(--dm-text-bright);
}

.pollbar1 { background-color: var(--dm-pollbar1); border-bottom-color: var(--dm-pollbar1-border); border-right-color: var(--dm-pollbar1-border); }
.pollbar2 { background-color: var(--dm-pollbar2); border-bottom-color: var(--dm-pollbar2-border); border-right-color: var(--dm-pollbar2-border); }
.pollbar3 { background-color: var(--dm-pollbar3); border-bottom-color: var(--dm-pollbar3-border); border-right-color: var(--dm-pollbar3-border); }
.pollbar4 { background-color: var(--dm-pollbar4); border-bottom-color: var(--dm-pollbar4-border); border-right-color: var(--dm-pollbar4-border); }
.pollbar5 { background-color: var(--dm-pollbar5); border-bottom-color: var(--dm-pollbar5-border); border-right-color: var(--dm-pollbar5-border); }

/* ============================================
   Icons
   ============================================ */
.icon.icon-blue, a:hover .icon.icon-blue { color: var(--dm-accent); }
.icon.icon-green, a:hover .icon.icon-green { color: var(--dm-success); }
.icon.icon-red, a:hover .icon.icon-red { color: var(--dm-danger); }
.icon.icon-orange, a:hover .icon.icon-orange { color: var(--dm-warning); }
.icon.icon-bluegray, a:hover .icon.icon-bluegray { color: var(--dm-text-muted); }
.icon.icon-gray, a:hover .icon.icon-gray { color: var(--dm-text-dim); }
.icon.icon-lightgray, a:hover .icon.icon-lightgray { color: var(--dm-text-muted); }
.icon.icon-black, a:hover .icon.icon-black { color: var(--dm-text); }

.top i {
    color: var(--dm-text-muted);
}

.sep {
    color: var(--dm-accent);
}

/* ============================================
   Post icon radio buttons (posting page)
   ============================================ */
label[for^="icon"] input[type="radio"] {
    display: none;
}

label[for^="icon"] {
    display: inline-block;
    padding: 2px 4px;
    border: 1px solid transparent;
    border-radius: 4px;
    cursor: pointer;
    vertical-align: middle;
}

label[for^="icon"]:hover {
    border-color: var(--dm-accent-border);
    background-color: var(--dm-bg-hover);
}

label[for^="icon"]:has(input:checked) {
    border-color: var(--dm-accent);
    background-color: var(--dm-accent-bg);
}

/* ============================================
   Smiley box (posting page sidebar)
   ============================================ */
#smiley-box a {
    display: inline-block;
    padding: 2px;
    border: 1px solid transparent;
    border-radius: 4px;
    transition: all 0.15s ease;
}

#smiley-box a:hover {
    border-color: var(--dm-accent-border);
    background-color: var(--dm-bg-hover);
    transform: scale(1.2);
}

/* ============================================
   Misc
   ============================================ */
hr {
    border-color: transparent;
    border-top-color: var(--dm-border);
}

.copyright {
    color: var(--dm-text-dim);
}

dl.details dt {
    color: var(--dm-text);
}

dl.details dd {
    color: var(--dm-text-secondary);
}

.ucprowbg {
    background-color: rgba(var(--dm-bg-dark-rgb), 0.6);
}

.fieldsbg {
    background-color: rgba(var(--dm-bg-dark-rgb), 0.4);
}

/* Contact icons */
.contact-icons a { border-color: var(--dm-border); }
.contact-icons a:hover { background-color: var(--dm-bg-hover); }

/* Mark-read link */
.dropdown-extended a.mark_read {
    background-color: var(--dm-bg-panel-solid);
}

/* Gallery */
.gallery label {
    background: var(--dm-bg-panel-solid);
    border-color: var(--dm-border);
}

.gallery label:hover {
    background-color: var(--dm-bg-hover);
}

/* PM colors */
.pmlist li.pm_message_reported_colour, .pm_message_reported_colour {
    border-left-color: var(--dm-danger);
    border-right-color: var(--dm-danger);
}

.pmlist li.pm_marked_colour, .pm_marked_colour {
    border-color: var(--dm-warning);
}

.pmlist li.pm_replied_colour, .pm_replied_colour {
    border-color: var(--dm-text-muted);
}

.pmlist li.pm_friend_colour, .pm_friend_colour {
    border-color: var(--dm-accent);
}

/* Loading indicator */
.loading_indicator {
    background-color: var(--dm-bg);
}

/* Responsive */
@media only screen and (max-width: 900px), only screen and (max-device-width: 900px) {
    #navigation a {
        background: rgba(var(--dm-ghost-blue-rgb), 0.1);
    }
}

/* ============================================
   Custom scrollbar (dark theme)
   ============================================ */
.postbody .content::-webkit-scrollbar,
.topicreview::-webkit-scrollbar,
.codebox code::-webkit-scrollbar,
.dropdown-extended ul::-webkit-scrollbar {
    background: var(--dm-scrollbar-track);
}

.postbody .content::-webkit-scrollbar-thumb,
.topicreview::-webkit-scrollbar-thumb,
.codebox code::-webkit-scrollbar-thumb,
.dropdown-extended ul::-webkit-scrollbar-thumb {
    background: rgba(var(--dm-ghost-blue-rgb), 0.3);
    border-radius: 3px;
}

/* Site logo */
.site_logo {
    background-image: url("./images/site_logo.svg");
    background-size: contain;
    background-repeat: no-repeat;
    width: 52px;
    height: 52px;
}

/* ============================================
   Dark forum/topic icons (override prosilver GIFs)
   ============================================ */
.announce_read                  { background-image: url("./images/announce_read.png"); }
.announce_read_mine             { background-image: url("./images/announce_read_mine.png"); }
.announce_read_locked           { background-image: url("./images/announce_read_locked.png"); }
.announce_read_locked_mine      { background-image: url("./images/announce_read_locked_mine.png"); }
.announce_unread                { background-image: url("./images/announce_unread.png"); }
.announce_unread_mine           { background-image: url("./images/announce_unread_mine.png"); }
.announce_unread_locked         { background-image: url("./images/announce_unread_locked.png"); }
.announce_unread_locked_mine    { background-image: url("./images/announce_unread_locked_mine.png"); }

.forum_link                     { background-image: url("./images/forum_link.png"); }
.forum_read                     { background-image: url("./images/forum_read.png"); }
.forum_read_locked              { background-image: url("./images/forum_read_locked.png"); }
.forum_read_subforum            { background-image: url("./images/forum_read_subforum.png"); }
.forum_unread                   { background-image: url("./images/forum_unread.png"); }
.forum_unread_locked            { background-image: url("./images/forum_unread_locked.png"); }
.forum_unread_subforum          { background-image: url("./images/forum_unread_subforum.png"); }

.sticky_read                    { background-image: url("./images/sticky_read.png"); }
.sticky_read_mine               { background-image: url("./images/sticky_read_mine.png"); }
.sticky_read_locked             { background-image: url("./images/sticky_read_locked.png"); }
.sticky_read_locked_mine        { background-image: url("./images/sticky_read_locked_mine.png"); }
.sticky_unread                  { background-image: url("./images/sticky_unread.png"); }
.sticky_unread_mine             { background-image: url("./images/sticky_unread_mine.png"); }
.sticky_unread_locked           { background-image: url("./images/sticky_unread_locked.png"); }
.sticky_unread_locked_mine      { background-image: url("./images/sticky_unread_locked_mine.png"); }

.topic_moved                    { background-image: url("./images/topic_moved.png"); }
.pm_read,
.topic_read                     { background-image: url("./images/topic_read.png"); }
.topic_read_mine                { background-image: url("./images/topic_read_mine.png"); }
.topic_read_hot                 { background-image: url("./images/topic_read_hot.png"); }
.topic_read_hot_mine            { background-image: url("./images/topic_read_hot_mine.png"); }
.topic_read_locked              { background-image: url("./images/topic_read_locked.png"); }
.topic_read_locked_mine         { background-image: url("./images/topic_read_locked_mine.png"); }
.pm_unread,
.topic_unread                   { background-image: url("./images/topic_unread.png"); }
.topic_unread_mine              { background-image: url("./images/topic_unread_mine.png"); }
.topic_unread_hot               { background-image: url("./images/topic_unread_hot.png"); }
.topic_unread_hot_mine          { background-image: url("./images/topic_unread_hot_mine.png"); }
.topic_unread_locked            { background-image: url("./images/topic_unread_locked.png"); }
.topic_unread_locked_mine       { background-image: url("./images/topic_unread_locked_mine.png"); }

/* ============================================
   Per-forum theme overrides
   Add body.theme-{name} blocks to override
   --dm-* accent variables per forum/category.
   Configure forum IDs in ext/dancemore/forumtheme/event/listener.php
   ============================================ */
body.theme-cyber-pink {
    --dm-accent: #ff3ac4;
    --dm-accent-hover: #ff6cd8;
    --dm-accent-border: rgba(255, 58, 196, 0.4);
    --dm-accent-bg: rgba(255, 58, 196, 0.15);
    --dm-ghost-blue-rgb: 255, 100, 200;
    --dm-text-bright: #ffe0f0;
    --dm-link-visited: #b060a0;
    --dm-h1-gradient: linear-gradient(to right, #ff0080, #ff00ff, #ff3ac4, #ff6cd8, #ff00ff, #ff0080);
}

body.theme-matrix-green {
    --dm-accent: #00ff80;
    --dm-accent-hover: #33ff99;
    --dm-accent-border: rgba(0, 255, 128, 0.4);
    --dm-accent-bg: rgba(0, 255, 128, 0.15);
    --dm-ghost-blue-rgb: 0, 255, 128;
    --dm-text-bright: #e0ffe0;
    --dm-link-visited: #40a060;
    --dm-h1-gradient: linear-gradient(to right, #00ff80, #00ff00, #80ff00, #00ffff, #00ff80);
    --dm-rgb-gradient: #00ff00, #00ff80, #00ffff, #00ff80, #00ff00, #80ff00, #00ff00, #00ff80, #00ff00;
}

body.theme-fantasy-rpg {
    --dm-bg:             #0c1210;
    --dm-bg-panel:       rgba(46, 36, 24, 0.95);
    --dm-bg-panel-solid: #2e2418;
    --dm-bg-input:       rgba(8, 6, 2, 0.7);
    --dm-bg-hover:       rgba(212, 160, 48, 0.12);
    --dm-text:           #d4c4a0;
    --dm-text-secondary: #b8a480;
    --dm-text-muted:     #8a7458;
    --dm-text-dim:       #5a4a38;
    --dm-text-bright:    #f1e0c0;
    --dm-accent:         #d4a030;
    --dm-accent-hover:   #ffd700;
    --dm-accent-border:  rgba(180, 130, 50, 0.5);
    --dm-accent-bg:      rgba(180, 130, 50, 0.12);
    --dm-border:         rgba(160, 120, 60, 0.4);
    --dm-success:        #4a9e3e;
    --dm-danger:         #b83020;
    --dm-warning:        #d48820;
    --dm-pink:           #a86838;
    --dm-pink-rgb:       168, 104, 56;
    --dm-btn-hover-color:#c89060;
    --dm-ghost-blue-rgb: 212, 170, 90;
    --dm-link-visited:   #7a6848;
    --dm-h1-gradient:    linear-gradient(to right, #ffd700, #d4a030, #8b6914, #d4a030, #ffd700);
    --dm-h1-speed:       6s;
    --dm-bg-dark-rgb:    24, 18, 12;
    --dm-bg-dark2-rgb:   34, 26, 16;
    --dm-bg-dark3-rgb:   42, 34, 22;
    --dm-bg-quote:       rgba(24, 18, 8, 0.85);
    --dm-bg-quote-nested:rgba(34, 26, 14, 0.85);
    --dm-bg-code:        rgba(6, 4, 0, 0.7);
    --dm-bg-attach:      rgba(16, 12, 4, 0.6);
    --dm-rgb-gradient:   #d4a030, #b8860b, #8b6914, #6b4c10, #8b6914, #b8860b, #d4a030, #ffd700, #d4a030;
    --dm-rgb-speed:      12s;
    --dm-reported-bg:    rgba(180, 48, 32, 0.14);
    --dm-reported-hover: rgba(180, 48, 32, 0.22);
    --dm-rules-bg:       rgba(180, 48, 32, 0.16);
    --dm-notice-bg:      rgba(180, 130, 50, 0.16);
    --dm-posthilit-bg:   rgba(212, 160, 48, 0.22);
    --dm-scrollbar-track:rgba(160, 120, 60, 0.1);
    --dm-font-family:    Georgia, 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
    --dm-pollbar1:       #d4a030; --dm-pollbar1-border: #a07820;
    --dm-pollbar2:       #b83020; --dm-pollbar2-border: #8a2018;
    --dm-pollbar3:       #4a9e3e; --dm-pollbar3-border: #387830;
    --dm-pollbar4:       #3878a0; --dm-pollbar4-border: #285880;
    --dm-pollbar5:       #8b6914; --dm-pollbar5-border: #6b4c10;
}

body.theme-tvland {
    --dm-bg:             #000000;
    --dm-bg-panel:       rgba(12, 12, 12, 0.95);
    --dm-bg-panel-solid: #0c0c0c;
    --dm-bg-input:       rgba(0, 0, 0, 0.8);
    --dm-bg-hover:       rgba(0, 192, 192, 0.12);
    --dm-text:           #c0c0c0;
    --dm-text-secondary: #909090;
    --dm-text-muted:     #606060;
    --dm-text-dim:       #383838;
    --dm-text-bright:    #ffffff;
    --dm-accent:         #00c0c0;
    --dm-accent-hover:   #00ffff;
    --dm-accent-border:  rgba(0, 192, 192, 0.5);
    --dm-accent-bg:      rgba(0, 192, 192, 0.12);
    --dm-border:         rgba(192, 192, 192, 0.2);
    --dm-success:        #00c000;
    --dm-danger:         #c00000;
    --dm-warning:        #c0c000;
    --dm-pink:           #c000c0;
    --dm-pink-rgb:       192, 0, 192;
    --dm-btn-hover-color:#00ffff;
    --dm-ghost-blue-rgb: 0, 192, 192;
    --dm-link-visited:   #0000c0;
    --dm-h1-gradient:    linear-gradient(to right, #ffffff, #ffff00, #00ffff, #00ff00, #ff00ff, #ff0000, #4444ff);
    --dm-h1-speed:       0s;
    --dm-bg-dark-rgb:    0, 0, 0;
    --dm-bg-dark2-rgb:   8, 8, 8;
    --dm-bg-dark3-rgb:   16, 16, 16;
    --dm-bg-quote:       rgba(8, 8, 8, 0.9);
    --dm-bg-quote-nested:rgba(16, 16, 16, 0.9);
    --dm-bg-code:        rgba(0, 0, 0, 0.8);
    --dm-bg-attach:      rgba(8, 8, 8, 0.7);
    --dm-rgb-gradient:   #c0c0c0, #c0c000, #00c0c0, #00c000, #c000c0, #c00000, #0000c0, #c0c0c0;
    --dm-rgb-speed:      16s;
    --dm-reported-bg:    rgba(192, 0, 0, 0.14);
    --dm-reported-hover: rgba(192, 0, 0, 0.22);
    --dm-rules-bg:       rgba(192, 0, 0, 0.16);
    --dm-notice-bg:      rgba(192, 192, 0, 0.16);
    --dm-posthilit-bg:   rgba(0, 192, 192, 0.22);
    --dm-scrollbar-track:rgba(192, 192, 192, 0.08);
    --dm-font-family:    'Courier New', 'Lucida Console', monospace;
    --dm-pollbar1:       #c0c000; --dm-pollbar1-border: #909000;
    --dm-pollbar2:       #00c0c0; --dm-pollbar2-border: #009090;
    --dm-pollbar3:       #00c000; --dm-pollbar3-border: #009000;
    --dm-pollbar4:       #c000c0; --dm-pollbar4-border: #900090;
    --dm-pollbar5:       #c00000; --dm-pollbar5-border: #900000;
}

/* TV Land CRT effects — scanlines, vignette, phosphor glow */
body.theme-tvland {
    position: relative;
}

body.theme-tvland::before {
    content: '';
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: radial-gradient(ellipse at center, transparent 50%, rgba(0, 0, 0, 0.6) 100%);
    opacity: 0.3;
    pointer-events: none;
    z-index: 9998;
}

body.theme-tvland::after {
    content: '';
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: repeating-linear-gradient(
        to bottom,
        transparent 0px,
        transparent 3px,
        rgba(0, 0, 0, 0.15) 3px,
        rgba(0, 0, 0, 0.15) 4px
    );
    opacity: 0.04;
    pointer-events: none;
    z-index: 9999;
}

body.theme-tvland h1,
body.theme-tvland h2,
body.theme-tvland h3,
body.theme-tvland a {
    text-shadow: 0 0 4px rgba(192, 192, 192, 0.15);
}

/* ============================================
   Reduce motion - OS-level accessibility baseline
   ============================================ */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.001s !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001s !important;
    }
    #smiley-box a:hover { transform: none !important; }
    h1 { filter: none !important; }
}

/* Reduce motion - manual cookie-based toggle */
body.reduce-motion *,
body.reduce-motion *::before,
body.reduce-motion *::after {
    animation-duration: 0.001s !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001s !important;
}
body.reduce-motion #smiley-box a:hover { transform: none !important; }
body.reduce-motion h1 { filter: none !important; }