/**
 * Theme: Blood Moon — negro puro, rojo intenso y blanco (referencia WPTHEME)
 */
:root {
    --main-color: #e60000;
    --main-color-dark: #b80000;
    --main-color-lighten: #ff1a1a;
    --anchor-text-color: #ff3333;
    --secondary-color: #121212;
    --secondary-gradient: #1a1a1a;
    --secondary-color-hover: #252525;
    --white-color-hover: rgba(230, 0, 0, 0.15);
    --text-color: #ffffff;
    --supress-text-color: #a0a0a0;
    --white-color: #ffffff;
    --surface-color: #121212;
    --page-bg: #000000;
    --box-bg: #121212;
    --box-border: #2a2a2a;
    --border-color: #333333;
    --border-left: #2a2a2a;
    --border-right: #1a1a1a;
    --text-shadow: #000000;
    --header-bg-color: #000000;
    --header-bg-image: none;
    --vip-highlight-bg: color-mix(in srgb, var(--main-color) 14%, var(--surface-color));
    --vip-success-text: #4ade80;
    --vip-danger-color: #ff4444;
    --vip-danger-bg: color-mix(in srgb, #e60000 12%, var(--surface-color));
}

body {
    background-color: var(--page-bg);
    color: var(--text-color);
}

a {
    color: var(--white-color);
}

a:hover {
    color: var(--main-color-lighten);
}

h1, h2, h3, h4, h5, h6 {
    color: var(--white-color);
}

.content-home h1.center,
h1.center {
    color: var(--main-color);
    font-weight: 700;
}

.brand-container {
    color: var(--white-color);
}

.head-bg {
    min-height: 120px;
    background-image: none;
    border-bottom: 1px solid var(--box-border);
}

nav {
    background: #000000;
    border: 1px solid var(--box-border);
    box-shadow: none;
}

nav li {
    border-left-color: var(--box-border);
    border-right-color: transparent;
}

nav li:hover {
    background: var(--white-color-hover);
}

nav li a {
    color: var(--white-color);
}

nav li a:hover,
nav li a.nav-vip {
    color: var(--main-color-lighten);
}

button,
.btn {
    background: linear-gradient(180deg, var(--main-color) 0%, var(--main-color-dark) 100%);
    border-color: var(--main-color-dark);
    color: var(--white-color);
    border-radius: 6px;
    font-weight: 600;
}

button:hover,
.btn:hover {
    background: var(--main-color-dark);
}

form,
.grey-box {
    background: var(--box-bg);
    border-color: var(--box-border);
    border-radius: 8px;
}

fieldset {
    background: var(--surface-color);
    border-color: var(--box-border);
}

label {
    color: var(--white-color);
}

input:not([type=radio]):not([type=checkbox]),
textarea,
select {
    background-color: #1a1a1a;
    color: var(--white-color);
    border-color: var(--box-border);
}

input:not([type=radio]):not([type=checkbox]):focus,
textarea:focus,
select:focus {
    border-color: var(--main-color);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--main-color) 25%, transparent);
}

.admin-nav {
    background: var(--box-bg);
    border-color: var(--box-border);
    border-radius: 8px;
}

.admin-nav a {
    color: var(--white-color);
}

.admin-nav a:hover {
    color: var(--main-color-lighten);
}

.admin-nav a.active {
    color: var(--main-color);
}

.tabs li {
    background: var(--secondary-color);
    color: var(--supress-text-color);
    border-color: var(--box-border);
}

.tabs li.active,
.tabs li.active > div {
    background: var(--main-color);
    color: var(--white-color);
    border-color: var(--main-color-dark);
}

.tab_container,
.show_container {
    background: var(--surface-color);
    border-color: var(--box-border);
}

.paste-list {
    background: var(--box-bg);
    border-color: var(--box-border);
    border-radius: 8px;
}

.paste-list li {
    border-color: var(--box-border);
}

.paste-list li a {
    color: var(--white-color);
}

.paste-list li a:hover {
    color: var(--main-color-lighten);
}

.pagination .active a,
.pagination .current a,
.pagination .active,
.pagination .current {
    background: var(--main-color);
    color: var(--white-color) !important;
    border-radius: 4px;
}

.paginate_button {
    color: var(--white-color) !important;
    background: var(--secondary-color);
    border-color: var(--box-border) !important;
}

.paginate_button.current,
.paginate_button:hover {
    background: var(--main-color) !important;
    color: var(--white-color) !important;
    border-color: var(--main-color-dark) !important;
}

.native-table .pagination .paginate_button {
    color: var(--white-color) !important;
    background: var(--secondary-color);
    border-color: var(--box-border) !important;
}

.native-table .pagination .paginate_button:hover,
.native-table .pagination .paginate_button.current {
    background: var(--main-color) !important;
    color: var(--white-color) !important;
    border-color: var(--main-color-dark) !important;
}

table.striped > tbody > tr:nth-child(odd),
table.highlight > tbody > tr:hover {
    background-color: #1a1a1a;
}

.native-table-menu {
    background: var(--box-bg) !important;
    border: 1px solid var(--box-border) !important;
}

.native-table-menu .menu-option:hover {
    background: var(--secondary-color-hover) !important;
}

code {
    background: #1a1a1a;
    color: var(--main-color-lighten);
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 0.9em;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
select:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #1a1a1a inset !important;
    -webkit-text-fill-color: var(--white-color) !important;
    caret-color: var(--white-color);
}

.danger {
    color: #ff6b6b;
}

footer,
footer a {
    color: var(--supress-text-color);
}

/* VIP / membresías */
.pricing-card {
    border-radius: 8px;
}

.pricing-card.featured {
    border-color: var(--main-color);
    box-shadow: 0 4px 20px color-mix(in srgb, var(--main-color) 40%, transparent);
}

.pricing-card:hover {
    box-shadow: 0 8px 28px color-mix(in srgb, var(--main-color) 25%, transparent);
}

.pricing-header h2 {
    color: var(--white-color);
}

.pricing-price .amount {
    color: var(--main-color);
}

.pricing-save {
    color: var(--main-color-lighten);
}

.btn-pricing {
    background: var(--secondary-color);
    border-color: var(--box-border);
}

.btn-pricing:hover {
    background: var(--secondary-color-hover);
}

.btn-pricing.btn-featured {
    background: linear-gradient(180deg, var(--main-color) 0%, var(--main-color-dark) 100%);
    border-color: var(--main-color-dark);
}

.btn-pricing.btn-featured:hover {
    background: var(--main-color-dark);
}

.faq-item {
    border-color: var(--box-border);
    border-radius: 8px;
}

.faq-item h3 {
    color: var(--white-color);
}

.pay-section-head h2,
.pay-gateway-head h2,
.pay-section h2 {
    color: var(--white-color);
}

.pay-alert-ok {
    color: var(--main-color-lighten);
}

.jdbtn {
    background: var(--main-color) !important;
    color: var(--white-color) !important;
    border-color: var(--main-color-dark) !important;
}
