:root {
    --accent: #927946;
    --panel-1: #1a1414;
    --panel-2: #151010;
    --panel-3: #0f0b0b;
    --text: #eae6de;
    --muted: #b7aea2;
    --border: #2e2222;
}

body {
    font-size: 0.875rem;
}

.input-group>.custom-file,
.input-group>.custom-select,
.input-group>.form-control {
    position: relative;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 1%;
    margin-bottom: 0;
}

.input-group>.custom-file+.custom-file,
.input-group>.custom-file+.custom-select,
.input-group>.custom-file+.form-control,
.input-group>.custom-select+.custom-file,
.input-group>.custom-select+.custom-select,
.input-group>.custom-select+.form-control,
.input-group>.form-control+.custom-file,
.input-group>.form-control+.custom-select,
.input-group>.form-control+.form-control {
    margin-left: -1px;
}

.input-group>.custom-file .custom-file-input:focus~.custom-file-label,
.input-group>.custom-select:focus,
.input-group>.form-control:focus {
    z-index: 3;
}

.input-group>.custom-file .custom-file-input:focus {
    z-index: 4;
}

.input-group>.custom-select:not(:last-child),
.input-group>.form-control:not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-group>.custom-select:not(:first-child),
.input-group>.form-control:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.input-group>.custom-file {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
}

.input-group>.custom-file:not(:last-child) .custom-file-label,
.input-group>.custom-file:not(:last-child) .custom-file-label::after {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-group>.custom-file:not(:first-child) .custom-file-label {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.custom-file {
    position: relative;
    display: inline-block;
    width: 100%;
    height: calc(2.25rem + 2px);
    margin-bottom: 0;
}

.custom-file-input {
    position: relative;
    z-index: 2;
    width: 100%;
    height: calc(2.25rem + 2px);
    margin: 0;
    opacity: 0;
}

.custom-file-input:focus~.custom-file-label {
    border-color: #000;
    box-shadow: 0 0 0 0.2rem rgba(0, 0, 0, 0.25);
}

.custom-file-input:focus~.custom-file-label::after {
    border-color: #000;
}

.custom-file-input:disabled~.custom-file-label {
    background-color: #927946;
}

.custom-file-input:lang(en)~.custom-file-label::after {
    content: "Browse";
}

.custom-file-label {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1;
    height: calc(2.25rem + 2px);
    padding: 0.375rem 0.75rem;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
}

.custom-file-label::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
    display: block;
    height: 2.25rem;
    padding: 0.375rem 0.75rem;
    line-height: 1.5;
    color: #495057;
    content: "Browse";
    background-color: #e9ecef;
    border-left: 1px solid #ced4da;
    border-radius: 0 0.25rem 0.25rem 0;
}

.custom-control {
    position: relative;
    display: block;
    min-height: 1.5rem;
    padding-left: 1.5rem;
}

.custom-control-inline {
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 1rem;
}

.custom-control-input {
    position: absolute;
    z-index: -1;
    opacity: 0;
}

.custom-control-input:checked~.custom-control-label::before {
    color: #fff;
    border-color: #927946;
    background-color: #927946;
}

.custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

.custom-control-input:focus:not(:checked)~.custom-control-label::before {
    border-color: #80bdff;
}

.custom-control-input:not(:disabled):active~.custom-control-label::before {
    color: #fff;
    background-color: #b3d7ff;
    border-color: #b3d7ff;
}

.custom-control-input:disabled~.custom-control-label {
    color: #6c757d;
}

.custom-control-input:disabled~.custom-control-label::before {
    background-color: #e9ecef;
}

.custom-control-label {
    position: relative;
    margin-bottom: 0;
    vertical-align: top;
}

.custom-control-label::before {
    position: absolute;
    top: 0.25rem;
    left: -1.5rem;
    display: block;
    width: 1rem;
    height: 1rem;
    pointer-events: none;
    content: "";
    background-color: #fff;
    border: #adb5bd solid 1px;
}

.custom-control-label::after {
    position: absolute;
    top: 0.25rem;
    left: -1.5rem;
    display: block;
    width: 1rem;
    height: 1rem;
    content: "";
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 50% 50%;
}

.custom-checkbox .custom-control-label::before {
    border-radius: 0.25rem;
}

.custom-checkbox .custom-control-input:checked~.custom-control-label::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3e%3c/svg%3e");
}

.custom-checkbox .custom-control-input:indeterminate~.custom-control-label::before {
    border-color: #927946;
    background-color: #927946;
}

.custom-checkbox .custom-control-input:indeterminate~.custom-control-label::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3e%3cpath stroke='%23fff' d='M0 2h4'/%3e%3c/svg%3e");
}

.custom-checkbox .custom-control-input:disabled:checked~.custom-control-label::before {
    background-color: rgba(0, 123, 255, 0.5);
}

.custom-checkbox .custom-control-input:disabled:indeterminate~.custom-control-label::before {
    background-color: rgba(0, 123, 255, 0.5);
}

.custom-radio .custom-control-label::before {
    border-radius: 50%;
}

.custom-radio .custom-control-input:checked~.custom-control-label::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
}

.custom-radio .custom-control-input:disabled:checked~.custom-control-label::before {
    background-color: rgba(0, 123, 255, 0.5);
}

.custom-switch {
    padding-left: 2.25rem;
}

.custom-switch .custom-control-label::before {
    left: -2.25rem;
    width: 1.75rem;
    pointer-events: all;
    border-radius: 0.5rem;
}

.custom-switch .custom-control-label::after {
    top: calc(0.25rem + 2px);
    left: calc(-2.25rem + 2px);
    width: calc(1rem - 4px);
    height: calc(1rem - 4px);
    background-color: #adb5bd;
    border-radius: 0.5rem;
    transition:
        background-color 0.15s ease-in-out,
        border-color 0.15s ease-in-out,
        box-shadow 0.15s ease-in-out,
        -webkit-transform 0.15s ease-in-out;
    transition:
        transform 0.15s ease-in-out,
        background-color 0.15s ease-in-out,
        border-color 0.15s ease-in-out,
        box-shadow 0.15s ease-in-out;
    transition:
        transform 0.15s ease-in-out,
        background-color 0.15s ease-in-out,
        border-color 0.15s ease-in-out,
        box-shadow 0.15s ease-in-out,
        -webkit-transform 0.15s ease-in-out;
}

@media screen and (prefers-reduced-motion: reduce) {
    .custom-switch .custom-control-label::after {
        transition: none;
    }
}

.custom-switch .custom-control-input:checked~.custom-control-label::after {
    background-color: #fff;
    -webkit-transform: translateX(0.75rem);
    transform: translateX(0.75rem);
}

.custom-switch .custom-control-input:disabled:checked~.custom-control-label::before {
    background-color: rgba(0, 123, 255, 0.5);
}

.progress.active .progress-bar {
    -webkit-transition: none !important;
    transition: none !important;
}

.ui-autocomplete {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1081;
    display: none;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    list-style: none;
    font-size: 14px;
    text-align: left;
    background-color: #ffffff;
    border: 1px solid #cccccc;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px #ff002a;
    box-shadow: 0 6px 12px #ff002a;
    background-clip: padding-box;
    overflow-y: auto;
    max-height: 500px;
}

.ui-autocomplete>li>div {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.42857143;
    color: #333333;
    white-space: nowrap;
}

.ui-state-hover,
.ui-state-active,
.ui-state-focus {
    text-decoration: none;
    color: #262626;
    background-color: #f5f5f5;
    cursor: pointer;
}

.ui-helper-hidden-accessible {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.item-details {
    width: 32px;
    height: 32px;
    position: absolute;
    margin-top: 2px;
}

.pvp {
    background: url("../../../../images/icons/pvp_tab.png") no-repeat scroll 0 0;
}

.skillsContent {
    display: none;
}

.tooltip-inner {
    white-space: pre;
    padding: 0px;
    background: transparent !important;
    max-width: 770px;
    position: absolute;
    top: -18px;
    left: 10px;
}

.itemDetails {
    border: 1px solid #525152;
    border-radius: 3px;
    padding: 2px 4px;
    margin: 1px;
    color: #a3a0a3;
    background: rgba(0, 0, 0, 1);
    font-size: 12px;
    font-family: calibri;
    text-align: left;
    display: inline-table;
}

.specification_legend {
    color: #a0845d;
}

.specification {
    color: #daa99c;
    text-shadow: 1px 1px #444;
}

.attribute {
    color: #b09979;
    text-shadow: none;
}

.modal-dialog {
    max-width: 562px;
    margin: 30px auto;
}

.modal-body {
    position: relative;
    padding: 0px;
}

/* INICIO GALERIA DE FOTOS */

.PopBoxImageSmall {
    border: none 0px #000000;
    cursor: url("../../../../images/miscs/magplus.cur"), pointer;
}

.PopBoxImageLarge {
    border: solid 2px #1b222c;
    cursor: url("../../../../images/miscs/magminus.cur"), pointer;
}

.PopBoxImageShrink {
    cursor: url("../../../../images/miscs/magminus.cur"), pointer;
}

.PopBoxImageLink {
    cursor: pointer;
}

.PopBoxImageMove {
    border: 2px solid #000000;
    cursor: pointer;
}

.rules {
    max-height: 11em;
    overflow: hidden;
    overflow-x: hidden;
    overflow-y: auto;
    /* Scrollable contents if viewport is shorter than content. */
}

.news-profile {
    border: 1px solid #ddd;
    border-radius: 6px 6px 0px 0px;
    width: 100px;
    height: 100px;
}

.news-author {
    font-size: 11px;
    line-height: 16px;
    background: rgba(150, 150, 150, 0.1);
    text-align: center;
    border: 1px solid #ddd;
    border-radius: 0px 0px 6px 6px;
    color: #000;
    overflow: hidden;
}

.form-signin {
    width: 100%;
    max-width: 330px;
    padding: 15px;
    margin: auto;
    margin-top: 20px;
}

.form-signin .checkbox {
    font-weight: 400;
}

.form-signin .form-floating:focus-within {
    z-index: 2;
}

.form-signin input[type="text"] {
    margin-bottom: -1px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.form-signin input[type="password"] {
    margin-bottom: 10px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.bd-placeholder-img {
    font-size: 1.125rem;
    text-anchor: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

.feather {
    width: 16px;
    height: 16px;
    vertical-align: text-bottom;
}

/* menu color izquierda */
/* Estilo del contenedor principal */
.menu-container {
    background-color: #ebe1da;
    text-transform: uppercase;
    padding: 20px;
    border: 3px solid #b89c8a;
    /* Marco elegante */
    border-radius: 10px;
    /* Bordes redondeados */
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
    /* Sombra para efecto elegante */
    width: 300px;
    /* Ajusta el ancho según necesites */
    text-align: center;
}

/* Estilo del título */
.menu-title {
    font-size: 20px;
    font-weight: bold;
    color: #5a3e2b;
    /* Color oscuro para resaltar */
    margin-bottom: 10px;
}

/*
 * Sidebar
 */

.sidebar {
    position: fixed;
    top: 0;
    /* rtl:raw:
  right: 0;
  */
    bottom: 0;
    /* rtl:remove */
    left: 0;
    z-index: 100;
    /* Behind the navbar */
    padding: 48px 0 0;
    /* Height of navbar */
    box-shadow: inset -1px 0 0 rgba(0, 0, 0, 0.1);
    overflow-x: hidden;
    overflow-y: auto;
    /* Scrollable contents if viewport is shorter than content. */
}

@media (max-width: 767.98px) {
    .bd-placeholder-img-lg {
        font-size: 3.5rem;
    }

    .sidebar {
        top: 5rem;
    }
}

.sidebar-sticky {
    position: relative;
    top: 0;
    height: calc(100vh - 48px);
    padding-top: 0.5rem;
    overflow-x: hidden;
    overflow-y: auto;
    /* Scrollable contents if viewport is shorter than content. */
}

.sidebar .nav-link {
    font-weight: 500;
    color: #000;
}

.sidebar .nav-link .feather {
    margin-right: 4px;
    color: #927946;
}

.sidebar .nav-link.active {
    color: #927946;
}

.sidebar .nav-link:hover .feather,
.sidebar .nav-link.active .feather {
    color: inherit;
}

.sidebar-heading {
    font-size: 0.75rem;
    text-transform: uppercase;
}

/* Fondo oscuro para barra lateral completa */
.sidebar,
.sidebar-menu,
.py-4,
.bg-light,
#sidebar,
body>div.container-fluid>div.row>nav {
    background-color: #111111 !important;
    color: #f0f0f0 !important;
}

/* Texto dentro del sidebar */
.sidebar a,
.sidebar-menu a,
.nav-link,
.nav-item {
    color: #f0c060 !important;
}

/* Hover y activo */
.sidebar a:hover,
.nav-link:hover,
.nav-link.active {
    background-color: #1f1f1f !important;
    color: #ffffff !important;
}

/* Fondo oscuro para sidebar */
.sidebar,
#sidebar,
.sidebar-menu,
.py-4,
.bg-light {
    background-color: #1a1a1a !important;
    color: #1a1a1a !important;
}

/* Textos en sidebar */
.sidebar a,
.sidebar-menu a,
.sidebar .nav-link {
    color: #ffffff !important;
}

/* Hover y activos */
.sidebar a:hover,
.sidebar .nav-link:hover,
.sidebar .nav-link.active {
    background-color: #1c1c1c !important;
    color: #ffffff !important;
    border-left: 4px solid #f0c060;
}

/*
 * Navbar
 */

.navbar-brand {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    font-size: 1rem;
    background-color: #ffffff;
    box-shadow: inset -1px 0 0 #ebeae9;
}

.navbar .navbar-toggler {
    top: 0.25rem;
    right: 1rem;
}

.navbar .form-control {
    padding: 0.75rem 1rem;
    border-width: 0;
    border-radius: 0;
}

.form-control-dark {
    color: #fff;
    background-color: #612b2b;
    border-color: #612b2b;
}

.form-control-dark:focus {
    border-color: transparent;
    box-shadow: 0 0 0 3px #612b2b;
}

.close {
    float: right;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: 0.5;
}

.close:focus,
.close:hover {
    color: #000;
    text-decoration: none;
    opacity: 0.75;
}

.close:not(:disabled):not(.disabled) {
    cursor: pointer;
}

button.close {
    padding: 0;
    background-color: transparent;
    border: 0;
    -webkit-appearance: none;
}

.modal-header .close {
    padding: 1rem;
    margin: -1rem -1rem -1rem auto;
}

.informerMap {
    margin-top: 20px;
    position: relative;
    overflow: auto;
}

#map {
    background: #612b2b url(../../../../images/miscs/map.jpg) top left no-repeat;
    width: 1808px;
    height: 2616px;
    position: relative;
    top: 0;
    left: 0;
    margin: 0 auto;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: #000000;
    background-color: #0e0505;
    padding: 10px;
    border-radius: 5px;
}

/* Fondo general oscuro */
body {
    background-color: #0e0505 !important;
    color: #f0f0f0 !important;
    font-family: "Segoe UI", sans-serif;
}

/* Fondo del panel lateral */
#side-bar,
.list-group-item {
    background-color: #212529 !important;
    color: #ffffff !important;
    border: none;
}

/* Títulos del menú lateral */
.list-group-item.active,
.list-group-item:focus,
.list-group-item:hover {
    background-color: #0e0505 !important;
    color: #fff !important;
}

/* Paneles de contenido */
.panel,
.panel-default,
.panel-body,
.panel-heading {
    /* background-color: #1e1e1e !important; */
    color: #f0f0f0 !important;
    border-color: #333 !important;
}

/* Botones */
.btn-danger,
.btn-primary {
    background-color: #7c1c1c !important;
    border: none !important;
    color: #fff !important;
}

.btn-danger:hover,
.btn-primary:hover {
    background-color: #a82626 !important;
    color: #fff !important;
}

/* Encabezados */
h1,
h2,
h3,
h4,
h5 {
    color: #ffffff !important;
}

/* Tarjetas sociales */
.card,
.social-box {
    background-color: #1e1e1e !important;
    color: #fff !important;
    border: 4px solid #333 !important;
}

/* =========================================================
   NOSTALGIC — Dark skin + fondo global
   ========================================================= */

/* Fondo global con imagen (se mantiene fijo y ocupa toda la pantalla) */
html,
body {
    min-height: 100%;
}

body {
    background-color: var(--panel-3);
    background-image: url("images/fondo panel.jpg");
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    background-repeat: no-repeat;
    color: var(--text);
}

/*
body::before {
  content: "";
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.35);
  pointer-events: none;
  z-index: -1;
}
*/

/* ---------- Tipografía general en claro sobre oscuro ---------- */
body,
.text-body,
.text-muted {
    color: #f0f0f0 !important;
}

/* ---------- Contenedores y tarjetas ---------- */
.card,
.panel,
.panel-default,
.panel-body,
.panel-heading,
.social-box {
    background-color: #1b1b1b !important;
    color: #f0f0f0 !important;
    border: 1px solid #333 !important;
}

/* Cabeceras de tarjetas/paneles (títulos) */
.card-header,
.panel-heading {
    background-color: #151515 !important;
    color: #927946 !important;
    /* dorado suave, evita “azules” */
    border-bottom: 1px solid #2a2a2a !important;
}

/* Títulos sueltos */
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #ffffff !important;
    background: transparent !important;
}

/* ---------- Formularios (inputs, selects, textareas) ---------- */
.form-control,
.form-select,
.custom-select,
input[type="text"],
input[type="email"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="tel"],
textarea,
select {
    background-color: #202020 !important;
    color: #f0f0f0 !important;
    border: 1px solid #3a3a3a !important;
}

.form-control:focus,
.form-select:focus,
.custom-select:focus,
select:focus,
textarea:focus,
input:focus {
    background-color: #242424 !important;
    color: #ffffff !important;
    border-color: #5b5b5b !important;
    box-shadow: 0 0 0 0.2rem rgba(240, 192, 96, 0.15) !important;
    /* halo dorado sutil */
}

/* placeholders legibles */
.form-control::placeholder,
textarea::placeholder {
    color: #b3b3b3 !important;
    opacity: 1;
}

/* Desplegable de donaciones (select) */
select.form-select,
select.custom-select,
#paypal {
    background-color: #202020 !important;
    color: #f0f0f0 !important;
    border: 1px solid #3a3a3a !important;
}

/* Dropdown menus */
.dropdown-menu {
    background-color: #1b1b1b !important;
    color: #f0f0f0 !important;
    border: 1px solid #2a2a2a !important;
}

.dropdown-item {
    color: #f0f0f0 !important;
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: #252525 !important;
    color: #ffffff !important;
}

/* ---------- Botones ---------- */
.btn-primary,
.btn-danger,
.btn-secondary {
    background-color: #7c3737 !important;
    border-color: #7c3737 !important;
    color: #fff !important;
}

.btn-primary:hover,
.btn-danger:hover,
.btn-secondary:hover {
    background-color: #612b2b !important;
    border-color: #612b2b !important;
}

/* ---------- Sidebar (por si alguna clase clara se cuela) ---------- */
.sidebar,
#sidebarMenu,
.bg-light,
.py-4,
body>div.container-fluid>div.row>nav {
    background-color: #111111 !important;
    color: #f0f0f0 !important;
}

/* Enlaces del sidebar */
.sidebar a,
.sidebar .nav-link,
.nav-item .nav-link {
    color: #f0c060 !important;
}

.sidebar a:hover,
.sidebar .nav-link:hover,
.sidebar .nav-link.active {
    background-color: #1c1c1c !important;
    color: #ffffff !important;
    border-left: 4px solid #f0c060;
}

/* =========================================================
   FONDO GLOBAL + TRANSPARENCIAS
   ========================================================= */

/* 1) Imagen de fondo global en TODAS las páginas */
html,
body {
    min-height: 100%;
}

body {
    background-image: url("images/fondo panel.jpg");
    /* respeta el espacio usando comillas */
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;

    /* color de respaldo si no carga la imagen */
    background-color: #0e0505 !important;
}

/* 2) Evitar que otros fondos “tapen” la imagen */
.bg-white,
.bg-light,
.container,
.container-fluid,
.content,
.content-wrapper,
.page-content,
main {
    background-color: transparent !important;
}

/* Si alguna página pone color directo al body, lo anulamos */
body[style*="background"],
body[style*="background-color"] {
    background: none !important;
}

/* 3) Transparencia controlada (puedes ajustar los alfas) */
:root {
    --alpha-sidebar: 0.92;
    --alpha-panel: 0.86;
    --alpha-header: 0.9;
}

/* Cabeceras de tarjetas */
.card-header,
.panel-heading {
    background-color: rgba(21, 21, 21, var(--alpha-header)) !important;
    color: #927946 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* Inputs / selects (incluye desplegable de donaciones) */
.form-control,
.form-select,
.custom-select,
select,
textarea,
input[type="text"],
input[type="email"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="tel"] {
    background-color: rgba(32, 32, 32, 0.9) !important;
    color: #f7f7f7 !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
}

.form-control:focus,
.form-select:focus,
select:focus,
textarea:focus,
input:focus {
    background-color: rgba(36, 36, 36, 0.95) !important;
    border-color: rgba(240, 192, 96, 0.5) !important;
    box-shadow: 0 0 0 0.2rem rgba(240, 192, 96, 0.15) !important;
}

.form-control::placeholder,
textarea::placeholder {
    color: #bdbdbd !important;
}

/* Dropdowns oscuros */
.dropdown-menu {
    background-color: rgba(27, 27, 27, 0.95) !important;
    color: #eaeaea !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.dropdown-item {
    color: #eaeaea !important;
}

.dropdown-item:hover {
    background-color: rgba(37, 37, 37, 0.95) !important;
    color: #fff !important;
}

/* Botones */
.btn-primary,
.btn-danger,
.btn-secondary {
    background-color: #7c3737 !important;
    border-color: #7c3737 !important;
    color: #fff !important;
}

.btn-primary:hover,
.btn-danger:hover,
.btn-secondary:hover {
    background-color: #612b2b !important;
    border-color: #612b2b !important;
}

.menu-title {
    border-bottom: none !important;
}

.menu-title {
    cursor: default !important;
    color: var(--text);
    font-weight: bold;
    background: none;
    text-decoration: none;
    pointer-events: none;
    /* desactiva clic */
}

.menu-title {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
    color: var(--text);
}

.border-bottom {
    border-bottom: none !important;
}

/* ===== SIDEBAR NOSTALGIC ===== */

/* Fondo del sidebar */
.sidebar {
    background-color: rgba(17, 17, 17, 0.92) !important;
    padding: 20px;
    border-right: 1px solid rgba(255, 255, 255, 0.06);
}

/* Títulos de sección */
.sidebar-heading {
    color: #927946 !important;
    font-weight: bold;
    font-size: 0.85rem;
    text-transform: uppercase;
    margin-top: 20px;
    margin-bottom: 10px;
    border: none !important;
}

/* Enlaces del menú */
.sidebar .nav-link {
    display: block;
    color: #ffffff !important;
    padding: 8px 15px;
    border-radius: 6px;
    transition: all 0.2s ease-in-out;
}

/* Hover de enlaces */
.sidebar .nav-link:hover {
    background-color: rgba(146, 121, 70, 0.15) !important;
    color: #ffffff !important;
}

/* Activo */
.sidebar .nav-link.active {
    background-color: #927946 !important;
    color: #ffffff !important;
}

/* Botones en marrón */
.btn-primary,
.btn-danger,
.btn-secondary {
    background-color: #927946 !important;
    border-color: #927946 !important;
    color: #fff !important;
}

.btn-primary:hover,
.btn-danger:hover,
.btn-secondary:hover {
    background-color: #7d6844 !important;
    border-color: #7d6844 !important;
}

/* Quitamos cualquier línea molesta */
.border-bottom,
.sidebar .border-bottom,
.sidebar-heading.border-bottom {
    border-bottom: none !important;
}

/* Fuente y espaciado general */
.sidebar,
.sidebar a,
.sidebar-heading {
    font-family: "Segoe UI", sans-serif;
    line-height: 1.4;
}

/* ====== SIDEBAR OSCURO TRANSPARENTE NOSTALGIC ====== */

/* Fondo oscuro con transparencia */
#sidebarMenu {
    background-color: rgba(17, 17, 17, 0.92) !important;
    color: #fff !important;
    padding-top: 20px;
    border-right: 1px solid rgba(255, 255, 255, 0.04);
}

/* Fijar color de títulos y evitar hover */
#sidebarMenu .menu-title,
#sidebarMenu .menu-title * {
    color: #927946 !important;
    /* Blanco fijo, cámbialo a #927946 si lo quieres marrón */
    font-weight: 800;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    padding: 8px 0px 4px;
    cursor: default;
    background: transparent !important;
}

/* Enlaces de menú normales */
#sidebarMenu .nav-link {
    color: #ffffff !important;
    font-size: 0.95rem;
    padding: 8px 15px;
    border-radius: 6px;
    transition: all 0.2s ease-in-out;
}

/* Fondo oscuro con transparencia */
.sidebar,
#sidebarMenu,
.bg-light,
.py-4,
body>div.container-fluid>div.row>nav {
    background-color: rgba(17, 17, 17, 0.92) !important;
    color: #fff !important;
}

/* Títulos del sidebar */
.sidebar-heading {
    color: #927946 !important;
    font-weight: bold;
    font-size: 0.85rem;
    text-transform: uppercase;
    margin: 15px 0 8px 0;
    border: none !important;
}

/* Enlaces del menú */
.sidebar .nav-link {
    color: #ffffff !important;
    padding: 8px 15px;
    border-radius: 6px;
    transition: all 0.2s ease-in-out;
}

/* Hover */
.sidebar .nav-link:hover {
    background-color: rgba(146, 121, 70, 0.15) !important;
    color: #ffffff !important;
}

/* Activo */
.sidebar .nav-link.active {
    background-color: #927946 !important;
    color: #ffffff !important;
    border-left: 4px solid #927946;
}

/* Botones marrones */
.btn-primary,
.btn-danger,
.btn-secondary {
    background-color: #927946 !important;
    border-color: #927946 !important;
    color: #fff !important;
}

.btn-primary:hover,
.btn-danger:hover,
.btn-secondary:hover {
    background-color: #7d6844 !important;
    border-color: #7d6844 !important;
}

/* Quitar líneas molestas */
.border-bottom,
.sidebar .border-bottom,
.sidebar-heading.border-bottom {
    border-bottom: none !important;
}

/* Fijar posición del sidebar */
.sidebar {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    overflow-y: auto;
    padding-top: 48px;
    width: 250px;
}

/* ===== Sidebar limpio y elegante ===== */

/* Quitar todas las líneas separadoras */
.sidebar .border-bottom,
.sidebar hr,
.sidebar .dropdown-divider {
    border: none !important;
    display: none !important;
}

/* Títulos marrones más grandes */
.sidebar-heading,
.sidebar .menu-title {
    color: #927946 !important;
    font-size: 1rem;
    font-weight: bold;
    text-transform: uppercase;
    margin-top: 15px;
    margin-bottom: 8px;
}

/* Enlaces del menú en blanco */
.sidebar .nav-link {
    color: #fff !important;
    font-size: 0.99rem;
}

/* Hover de enlaces */
.sidebar .nav-link:hover {
    color: #f0c060 !important;
    background-color: rgba(146, 121, 70, 0.15) !important;
    border-radius: 5px;
}

/* --- Restaurar títulos y quitar sólo la línea --- */
.sidebar .border-bottom {
    border-bottom: none !important;
    display: block !important;
    padding: 0;
    margin: 14px 0 8px;
}

/* TÍTULOS de sección (Panel de usuario, Donaciones, Soporte) */
.sidebar .border-bottom,
.sidebar .sidebar-heading,
.sidebar .menu-title {
    color: #927946 !important;
    font-weight: 800;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    background: transparent !important;
}

/* Enlaces/ opciones en BLANCO (como ahora) */
.sidebar .nav-link,
.sidebar .nav-item>a {
    color: #ffffff !important;
    font-size: 0.98rem;
}

/* Hover de enlaces: dorado suave */
.sidebar .nav-link:hover,
.sidebar .nav-item>a:hover {
    color: #f0c060 !important;
    background-color: rgba(146, 121, 70, 0.15) !important;
    border-radius: 6px;
}

/* Fondo general + texto */
body {
    background-color: var(--panel-3);
    background-image: url("images/fondo panel.jpg");
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    color: var(--text);
}

/* Barra separadora del título */
.border-bottom {
    border-bottom: 1px solid var(--border) !important;
}

h1.h2 {
    color: var(--text);
}

/* Cards (contenedores) */
.card {
    background-color: var(--panel-1);
    border: 1px solid var(--border);
    margin-bottom: 1em;
}

.card-header {
    background-color: var(--panel-1);
    color: var(--text);
    border-bottom: 1px solid var(--border);
    font-weight: 600;
}

.card-body {
    background-color: var(--panel-2);
    color: var(--text);
}

/* Botón personalizado */
.custom-btn {
    padding: 5px 25px;
    font-size: 18px;
    background-color: var(--accent);
    color: #000;
    border-radius: 10px;
    transition:
        transform 0.2s ease,
        box-shadow 0.4s ease;
    text-transform: uppercase;
    font-weight: bold;
    text-decoration: none !important;
}

.custom-btn:hover {
    transform: scale(1.05);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    background-color: #1e1e1e;
    color: #fff;
    text-decoration: none !important;
}

/* DESPLEGABLE DE DONACIÓN (select Bootstrap) */
.form-select {
    background-color: var(--panel-1);
    color: var(--text);
    border: 1px solid var(--border);
    /* flecha en dorado */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='%23927946' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 16px 12px;
    padding-right: 2.25rem;
}

.form-select:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 0.2rem rgba(146, 121, 70, 0.25);
    background-color: var(--panel-1);
    color: var(--text);
}

.form-select option {
    background-color: var(--panel-2);
    color: var(--text);
}

.table {
    --bs-table-bg: var(--panel-2);
    --bs-table-striped-bg: #1e1717;
    --bs-table-striped-color: var(--text);
    --bs-table-hover-bg: #221a1a;
    --bs-table-hover-color: var(--text);
    color: var(--text);
    border-color: var(--border);
}

.table thead th,
.table tfoot th {
    background-color: var(--panel-1);
    color: var(--text);
    border-color: var(--border);
}

.table> :not(caption)>*>* {
    border-bottom-color: var(--border);
}

/* ====== FORM CONTROLS OSCUROS ====== */
.form-control,
.form-select,
textarea,
input[type="text"],
input[type="url"],
input[type="number"],
input[type="email"],
input[type="password"],
input[type="search"] {
    background-color: var(--panel-1) !important;
    color: var(--text) !important;
    border: 1px solid var(--border) !important;
}

.form-control:focus,
.form-select:focus,
textarea:focus,
input[type="text"]:focus,
input[type="url"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="search"]:focus {
    background-color: var(--panel-1) !important;
    color: var(--text) !important;
    border-color: var(--accent) !important;
    box-shadow: 0 0 0 0.2rem rgba(146, 121, 70, 0.25) !important;
}

.form-control::placeholder,
textarea::placeholder {
    color: var(--muted) !important;
    opacity: 0.85;
}

.form-control:disabled,
.form-select:disabled,
input:disabled,
textarea:disabled {
    background-color: #1f1818 !important;
    color: #8f8680 !important;
    border-color: var(--border) !important;
}

/* text del group addon (prefijos, sufijos) */
.input-group-text {
    background-color: var(--panel-1) !important;
    color: var(--text) !important;
    border: 1px solid var(--border) !important;
}

/* checks / radios */
.form-check-input {
    background-color: var(--panel-1) !important;
    border: 1px solid var(--border) !important;
}

.form-check-input:checked {
    background-color: var(--accent) !important;
    border-color: var(--accent) !important;
}

/* select options */
.form-select option {
    background-color: var(--panel-2);
    color: var(--text);
}

/* ====== HEADERS / LINKS DE PANEL ====== */
/* accordion de Bootstrap */
.accordion-button,
.accordion-button:not(.collapsed) {
    background-color: var(--panel-1) !important;
    color: var(--text) !important;
    box-shadow: none !important;
}

.accordion-button:focus {
    border-color: var(--accent) !important;
    box-shadow: 0 0 0 0.15rem rgba(146, 121, 70, 0.25) !important;
}

/* colorea el caret del accordion */
.accordion-button::after {
    filter: invert(85%) sepia(10%) saturate(120%) hue-rotate(350deg) brightness(0.9);
}

/* enlaces (btn-link / títulos clicables) */
.btn-link,
.card-header a,
.panel-title a {
    color: var(--text) !important;
    text-decoration: none !important;
}

.btn-link:hover,
.card-header a:hover,
.panel-title a:hover {
    color: var(--accent) !important;
}

/* Cards/paneles por coherencia */
.card {
    background-color: var(--panel-1);
    border: 1px solid var(--border);
}

.card-header {
    background-color: var(--panel-1);
    color: var(--text);
    border-bottom: 1px solid var(--border);
}

.card-body {
    background-color: var(--panel-2);
    color: var(--text);
}

/* === Dark fix para System configs === */
#collapseFive .bg-light {
    background-color: transparent !important;
    /* elimina franjas blancas */
}

/* Fondo y texto del contenedor derecho */
#collapseFive .col.ms-2.me-2.border.rounded {
    background-color: #111;
    color: #e5e7eb;
}

/* Inputs/selects en oscuro */
#collapseFive .form-control,
#collapseFive .form-select {
    background-color: #1f2937;
    color: #e5e7eb;
    border-color: #374151;
}

/* Texto de labels y switches */
#collapseFive label,
#collapseFive .custom-control-label,
#collapseFive .input-group-text {
    color: #e5e7eb;
    background-color: #1f2937;
    border-color: #374151;
}

/* Líneas divisorias más suaves en oscuro */
#collapseFive .border-bottom {
    border-bottom-color: #2a2f3a !important;
}

/* Quita los spinners de los number inputs SOLO dentro de System configs */
#collapseFive input[type="number"]::-webkit-outer-spin-button,
#collapseFive input[type="number"]::-webkit-inner-spin_button,
#collapseFive input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

#collapseFive input[type="number"] {
    -moz-appearance: textfield;
    /* Firefox */
    appearance: textfield;
    /* Safari/otros */
}

header.navbar.navbar-dark.sticky-top.bg-white.flex-md-nowrap.p-0.shadow {
    background-color: transparent !important;
    box-shadow: none !important;
    /* elimina la sombra */
}

header.navbar.navbar-dark.sticky-top.bg-white.flex-md-nowrap.p-0.shadow a.navbar-brand.col-md-3.col-lg-2.me-0.px-3 {
    background-color: transparent !important;
}

.navbar-brand.col-md-3.col-lg-2.me-0.px-3 {
    color: #f0c060 !important;
    font-size: 18px !important;
    font-weight: bold;
    text-decoration: none;
}

.modal-content {
    background-color: var(--panel-1);
    color: var(--text);
    border: 1px solid var(--border);
}

.modal-header,
.modal-footer {
    background-color: var(--panel-1);
    border-color: var(--border);
}

.modal-body {
    background-color: var(--panel-2);
    color: var(--text);
}

.modal-body * {
    color: var(--text) !important;
}

.modal-footer button {
    border: none;
}

.modal-body ul {
    padding-left: 20px;
}

.modal-body li {
    margin-bottom: 5px;
}