.v-heading-v2 span,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus,
.widget .tagcloud a:hover, 
.widget ul.wp-tag-cloud li:hover > a,
.widget.v-photo-stream-widget li,
.v-bg-stylish.v-bg-stylish-v10,
.v-bg-stylish-v10.v-full-width-text:after,
.v-parallax .v-bg-overlay.overlay-colored,
.recent-post figure,
header div.search .btn-primary:hover,
header div.search .btn-primary,
header ul.nav-pills > li > a:hover,
.portfolio-grid li,
.sf-hover .feature-box-line,
.pricing-column.highlight h3,
span.highlighted,
span.dropcap4,
.progress-bar-primary,
.v-process-steps {
    background-color: #E05410;
}


.v-color,
div.v-color,
.v-link,
a:hover,
.carousel-wrap > a:hover,
#back-to-top:hover,
.v-pagination a:hover,
.sidebar .v-category-widget ul > li a:hover,
.sidebar .v-archive-widget ul > li a:hover,
.sidebar .v-nav-menu-widget ul > li a:hover,
.v-nav-menu-widget ul > li.current-menu-item a,
.sidebar .v-meta-data-widget ul > li a:hover,
.sidebar .v-recent-entry-widget ul > li a:hover,
.list-toggle:after,
.v-right-sidebar-inner > .active > a,
.v-right-sidebar-inner > .active > a:focus,
.v-right-sidebar-inner > .active > a:hover,
footer a:hover,
.copyright a:hover,
.read-more i:before, 
.read-more em:before,
.item-link:hover,
.search-item-meta-down a,
.search-item-meta a,
.v-search-items .star-vote li,
.v-blog-item-details a:hover, 
.author-link,
.v-blog-item .read-more,
.article-body-wrap .share-links a:hover,
.post-header .post-meta-info a:hover,
.post-content h2.title a:hover,
.recent-post .post-item-details a:hover,
a.current-menu-item,
header nav ul.nav-main ul.dropdown-menu > li > a:hover,
header nav ul.nav-main li a:hover,
header nav.mega-menu ul.nav-main li.mega-menu-item ul.sub-menu a:hover,
header nav ul.nav-main li.dropdown.active > a i.fa-caret-down,
header ul.nav-pills > li.active > a,
.nav-pills > li.active > a,
.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus,
header nav ul.nav-main li.dropdown:hover > a i.fa-caret-down,
.slideout-filter ul li a:hover,
.v-portfolio-item .v-portfolio-item-permalink, .read-more-link,
.share-links > a:hover,
.comments-likes a:hover i,
.comments-likes a:hover span,
.comments-likes a:hover span, .comments-likes a:hover i,
.portfolio-pagination div:hover > i,
.v-icon,
.pricing-column ul li i.fa,
.pricing-column h3,
.v-divider.v-up a,
span.dropcap2,
.v-list li i,
.v-list-v2 li i,
.media-body .reply-link:hover  { 
    color: #333;
}

a.current{
    color: #1e73be !important;
}


.v-pagination li a:hover,
ul.bar-styling li:not(.selected) > a:hover,
ul.bar-styling li > .comments-likes:hover,
ul.page-numbers li > a:hover,
ul.page-numbers li > span.current,
a.text-link,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus,
.pagination > li:not(.active) > a:hover,
.pagination > li:not(.active) > span:hover,
.read-more,
.logged-in-as a,
.comment-meta-actions .edit-link,
.comment-meta-actions .comment-reply,
.media-body .reply-link,
.v-bg-stylish-v10.v-full-width-text:after,
.v-blog-item-details a,
header div.search .btn-primary:hover,
header div.search .btn-primary,
.testimonial.testimonial-thumb-side .testimonial-author .featured-thumbnail,
.v-clients-wrap .owl-carousel .owl-item figure:hover,
blockquote.pullquote  { 
    border-color: #E05410;
}

.signup,
header nav ul.nav-main ul.dropdown-menu,
header nav.mega-menu ul.nav-main li.mega-menu-item ul.dropdown-menu,
.v-tagline-box-v1 {
    border-top-color: #E05410;
}

.v-heading-v2 h2, .v-heading-v2 h3, .v-heading-v2 h4,
.v-link:hover,
.v-search-items a:hover,
.post-info a,
.tags-wrap .tags a,
.v-team-member-box .read-more:hover,
.v-tweets-slide-widget .tweet-text a {
   
}

.list-group-item.active, 
.list-group-item.active:hover, 
.list-group-item.active:focus,
.sidebar .v-nav-menu-widget ul > li.active,
.v-control-right .v-smash-text-wrap,
.author-info-wrap,
.testimonial.testimonial-thumb-side .testimonial-author .featured-thumbnail:after,
blockquote.hero,
.v-tagline-box-v2 {
    border-left-color: #E05410;
}

.list-group-item.active-pkb,
.list-group-item.active-pkb:hover,
.list-group-item.active-pkb:focus
{
    background-color: #E05410;
    border-color: #E05410;
}

figure:hover .overlay {
    box-shadow: inset 0 0 0 500px #1e73be;
}


.v-pagination li a:hover,
ul.bar-styling li:not(.selected) > a:hover,
ul.bar-styling li > .comments-likes:hover,
ul.page-numbers li > a:hover,
ul.page-numbers li > span.current,
.pagination > li:not(.active) > a:hover,
.pagination > li:not(.active) > span:hover,
.slideout-filter ul li.selected a,
.btn.v-btn.v-btn-default {
    background: #E05410;
}



h2.v-bg-box-shadow-text-50 {
    margin-top: 25px;
    margin-bottom: 0px;
    background-color: rgba(240,122,61,0.8);
    box-shadow: 8px 0 0 rgba(240,122,61,0.8), -8px 0 0 rgba(240,122,61,0.8);
    color: #ffffff !important;
    font-weight:600;
    font-size: 50px;
    line-height: 50px;
    padding: 10px;
	text-transform:uppercase
}

h2.v-bg-box-shadow-text-40 {
    margin-top: 0px;
    margin-bottom: 25px;
    background-color: rgba(0,0,0,0.5);
    box-shadow: 8px 0 0 rgba(0,0,0,0.5), -8px 0 0 rgba(0,0,0,0.5);
    color: #ffffff !important;
    font-weight: 600;
    font-size: 20px;
    line-height: 35px;
    padding: 10px;
	text-transform:uppercase
}


.ui-widget-content a {
    color: #333333;
}

.ui-widget-content a:hover {
    color: #1dc6df;
}


li>.dropdown-menu {
    position: absolute;
    left: auto;
}

.user-menu>.dropdown-menu, .user-menu>.dropdown-menu>.user-body {
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
}
.user-menu>.dropdown-menu {
    border-top-right-radius: 0;
    border-top-left-radius: 0;
    padding: 1px 0 0 0;
    border-top-width: 0;
    min-width: 220px;
}
li>.dropdown-menu {
    margin-top: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
.open>.dropdown-menu {
    display: block;
}
.dropdown-menu {
    box-shadow: none;
    border-color: #eee;
}

.user-menu>.dropdown-menu>li.user-header {
    height: 135px;
    padding: 0px;
    text-align: center;
}

.user-menu>.dropdown-menu>li.user-header>img {
    z-index: 5;
    height: 90px;
    width: 90px;
    border: 3px solid;
    border-color: transparent;
    border-color: rgba(128,128,128,0.2);
}

.user-menu>.dropdown-menu>.user-footer {
    background-color: #f9f9f9;
    padding: 10px;
}

.user-menu>.dropdown-menu>.user-footer .btn-default {
    color: #666666;
}

.navbar-nav>li>.dropdown-menu {
    position: absolute;
    right: 0;
    left: auto;
}

.user-menu>.dropdown-menu>.user-footer:before, .user-menu>.dropdown-menu>.user-footer:after {
    content: " ";
    display: table;
}

.user-menu>.dropdown-menu>.user-footer:after {
    clear: both;
}

ul.nav-main ul.dropdown-menu {
    padding-bottom: 0px !important;
}

.user-menu>.dropdown-menu>.user-footer {
    background-color: #f9f9f9;
    padding: 10px;
}

footer,
.middle-section::before
{
    /* background: rgba(22, 22, 22, 0.7); */
    background: rgb(7,10,120);
    background: linear-gradient(90deg, rgba(7, 10, 120, 0.32) 0%, rgba(7, 10, 120, 0.51) 100%);
}


body {
    color: #6f6f6f;
}

.middle-section {
    background-size: cover;
}

.header-container {
    background-color: #000000;
}

.dark-mode .header-container,
body.dark-mode .header-container {
    background-color: #000000;
    border-bottom: none;
}

.dark-mode header.header,
body.dark-mode header.header {
    background-color: #000000;
    border-bottom: none;
}

.dark-mode header nav ul.nav-main > li > a,
body.dark-mode header nav ul.nav-main > li > a {
    color: #ffffff;
    border-color: #808080;
}

.dark-mode header nav ul.nav-main > li > a:hover,
body.dark-mode header nav ul.nav-main > li > a:hover,
.dark-mode header nav.nav-main ul.nav-main > li > a:hover,
body.dark-mode header nav.nav-main ul.nav-main > li > a:hover,
.dark-mode header nav ul.nav-main > li:hover > a,
body.dark-mode header nav ul.nav-main > li:hover > a,
.dark-mode header nav.nav-main ul.nav-main > li:hover > a,
body.dark-mode header nav.nav-main ul.nav-main > li:hover > a {
    color: #E05410 !important;
    border-color: #808080 !important;
}

/* Forzar color naranja en hover del menú principal - sobrescribir cualquier JavaScript inline */
.dark-mode header nav ul.nav-main > li > a[style*="color"]:hover,
body.dark-mode header nav ul.nav-main > li > a[style*="color"]:hover {
    color: #E05410 !important;
}

.user-header p {
    color: #16171d;
    font-weight: bold;
}
.user-header p small{
    color: #757575;
}

.search-item ul.list-inline {
    color: #16171d;
}

.search-item-img img, .search-item-img .img-holder {
    -moz-border-radius: 0%;
    -webkit-border-radius: 0%;
    border-radius: 0%;
}

.v-page-heading.v-fancy-heading.v-fancy-top-header-2x {
     padding-top: 28px;
     padding-bottom: 28px;
 }

.fixed-header-on header.header {
    background-color: #000000 !important;
}

.tabs {
    margin-top: 10px;
    color: #16171d;
    line-height: 1rem;
}

.tab-content {
    margin-top: 0;
}

.v-page-heading {
    margin-bottom: 25px !important;
    background-color: #373948;
}

.top_line {
    /*background: #1c1f2f;*/
}

.elementInscInfo,
.elementCatInfo,
.elementCatsInfo,
.elementEvInfo,
.htmlTokenInfo
{
    display: none;
}


figure.animated-overlay figcaption {
    background-color: rgba(0, 0, 0, 0.85);
}

@media only screen and (max-width: 767px) {
    [class*="span"], .row [class*="span"] {
        margin-bottom: 0px;
    }
}

.search-item-content {
    padding-bottom: 3px;
    margin-bottom: 0;
}

.v-page-heading .heading-text h2 {
    color: #fff!important;
}

.v-page-heading.v-bg-stylish.v-bg-stylish-v1 {
    background-color: #000000;
    padding-top: 40px;
}

.panel-body {
    color: #16171d;
}

table.dataTable thead .sorting::after, table.dataTable thead .sorting_asc::after, table.dataTable thead .sorting_desc::after, table.dataTable thead .sorting_asc_disabled::after, table.dataTable thead .sorting_desc_disabled::after {
    bottom: 10px;
    right: 8px;
}

td.child {
    background-color: #f3f3f3;
    border-top: 1px solid darkgrey;
    border-bottom: 3px solid darkgrey;
}

#timer {
    position: fixed;
    bottom: 12px;
    right: 6%;
    background-color: #E05410;
    margin: 0;
    padding: 15px;
    -webkit-border-top-left-radius: 19px;
    -webkit-border-top-right-radius: 19px;
    -webkit-border-bottom-left-radius: 19px;
    -webkit-border-bottom-right-radius: 19px;
    -moz-border-radius-topleft: 19px;
    -moz-border-radius-topright: 19px;
    -moz-border-radius-bottomleft: 19px;
    -moz-border-radius-bottomright: 19px;
    border-top-left-radius: 19px;
    border-top-right-radius: 19px;
    border-bottom-left-radius: 19px;
    border-bottom-right-radius: 19px;
    z-index: 5;
    color: white;
    font-size: 2em;
    font-weight: bold;
}

.search-results
{
    /*width: 280px;*/
    max-height: 200px;
    border: 1px solid #e3e3e3;
    border-radius: 3px;
    box-sizing: border-box;
    overflow-y: auto;
    border-top: none;
}

.search-result:hover {
    background-color: #F07A3D;
    color: white;
}

.search-result {
    background: white;
    padding: 10px;
}

.alert.alert-info-pkb {
    background-color: #E05410;
}
.alert-info-pkb {
    background-color: #5adcff;
    border-color: #E05410;
    color: #FFF;
    box-shadow: 0 1px 2px rgba(0,0,0,0.10), 0 0 2px rgba(0,0,0,0.05);
}

/* Estilos base para info-box-small */
.info-box-small {
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 15px;
    margin-bottom: 15px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.10), 0 0 2px rgba(0,0,0,0.05);
}

.info-box-small .info-box-header {
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.info-box-small .info-box-header h5 {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: #333;
}

.info-box-small .info-box-header h5 i {
    margin-right: 5px;
    color: #666;
}

.info-box-small .score-display {
    background-color: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 4px;
    padding: 10px;
    text-align: center;
    margin-bottom: 10px;
}

.info-box-small .score-display .info-box-number {
    font-size: 18px;
    font-weight: bold;
    color: #333;
}

.info-box-small .score-details {
    font-size: 12px;
    color: #666;
    text-align: center;
}

.info-box-small .score-details i {
    margin-right: 5px;
    color: #999;
}

/* Modo oscuro para contenedores nuevos de appeals */
body.dark-mode .info-box-small {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode .info-box-small * {
    color: white !important;
}

body.dark-mode .config-card {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode .config-card * {
    color: white !important;
}

body.dark-mode .timeline-content {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode .timeline-content * {
    color: white !important;
}

body.dark-mode .box {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode .box * {
    color: white !important;
}

body.dark-mode .info-box {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode .info-box * {
    color: white !important;
}

body.dark-mode .score-display {
    background-color: #2c3e50 !important;
    color: white !important;
}

body.dark-mode .score-details {
    color: white !important;
}

body.dark-mode .info-box-header {
    border-bottom-color: #808080 !important;
}

body.dark-mode .info-box-header h5 {
    color: white !important;
}

/* Estilos para PFT time display - Colores corporativos Repify */
.pft-time-display {
    color: #000 !important;
}

body.dark-mode .pft-time-display {
    color: #999 !important;
}

body.dark-mode .info-box-header h5 i {
    color: white !important;
}

body.dark-mode .info-box-actions {
    border-top-color: #808080 !important;
}

body.dark-mode .timeline-header {
    border-bottom-color: #808080 !important;
}

body.dark-mode .timeline-header strong {
    color: white !important;
}

body.dark-mode .timeline-date {
    color: white !important;
}

body.dark-mode .timeline-body {
    color: white !important;
}

body.dark-mode .timeline-body p {
    color: white !important;
}

body.dark-mode .timeline-body strong {
    color: white !important;
}

/* Modo oscuro para paneles específicos de appeals */
body.dark-mode div[style*="padding: 8px; border: 1px solid #ddd; border-radius: 4px; border-left: 4px solid #ddd;"] {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode div[style*="padding: 8px; border: 1px solid #ddd; border-radius: 4px; border-left: 4px solid #ddd;"] * {
    color: white !important;
}

body.dark-mode div[style*="padding: 12px; background-color: #f8f9fa; border: 1px solid #e9ecef; border-radius: 5px; font-size: 13px;"] {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode div[style*="padding: 12px; background-color: #f8f9fa; border: 1px solid #e9ecef; border-radius: 5px; font-size: 13px;"] * {
    color: white !important;
}

body.dark-mode div[style*="padding: 12px; background-color: #f8f9fa; border: 1px solid #e9ecef; border-radius: 5px; font-size: 13px;"] h6 {
    color: white !important;
}

body.dark-mode div[style*="padding: 12px; background-color: #f8f9fa; border: 1px solid #e9ecef; border-radius: 5px; font-size: 13px;"] p {
    color: white !important;
}

body.dark-mode div[style*="padding: 12px; background-color: #f8f9fa; border: 1px solid #e9ecef; border-radius: 5px; font-size: 13px;"] strong {
    color: white !important;
}

body.dark-mode div[style*="padding: 12px; background-color: #f8f9fa; border: 1px solid #e9ecef; border-radius: 5px; font-size: 13px;"] i {
    color: white !important;
}

/* Modo oscuro para iconos específicos de appeals */
body.dark-mode .fa-clock-o,
body.dark-mode .fa-ban,
body.dark-mode .fa-hourglass-half,
body.dark-mode .fa-cog,
body.dark-mode .fa-info-circle,
body.dark-mode .fa-bell,
body.dark-mode .fa-question-circle,
body.dark-mode .fa-mobile,
body.dark-mode .fa-envelope,
body.dark-mode .fa-gavel,
body.dark-mode .fa-lock {
    color: white !important;
}

/* Modo oscuro para alert-secondary específico de appeals */
body.dark-mode .alert.alert-secondary {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode .alert.alert-secondary * {
    color: white !important;
}

body.dark-mode .alert.alert-secondary strong {
    color: white !important;
}

body.dark-mode .alert.alert-secondary h4 {
    color: white !important;
}

body.dark-mode .alert.alert-secondary h4 i {
    color: white !important;
}

/* Modo oscuro para config-card específico */
body.dark-mode .config-card {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode .config-card * {
    color: white !important;
}

body.dark-mode .config-card h6 {
    color: white !important;
}

body.dark-mode .config-card span {
    color: white !important;
}

body.dark-mode .config-card p {
    color: white !important;
}

body.dark-mode .config-card i {
    color: white !important;
}

/* Modo oscuro para banderas de estado específicas */
body.dark-mode .label {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

body.dark-mode .label-default,
body.dark-mode .label-info,
body.dark-mode .label-warning,
body.dark-mode .label-primary,
body.dark-mode .label-success,
body.dark-mode .label-danger {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

body.dark-mode .label i {
    color: white !important;
}

/* Modo oscuro para texto "Cerrado" específico */
body.dark-mode span:contains("Cerrado"),
body.dark-mode *:contains("Cerrado") {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

/* Modo oscuro para info-box-small específico */
body.dark-mode .info-box-small {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode .info-box-small * {
    color: white !important;
}

body.dark-mode .info-box-small .score-display {
    background-color: #2c3e50 !important;
    color: white !important;
}

body.dark-mode .info-box-small .score-details {
    color: white !important;
}

body.dark-mode .info-box-small .score-details i {
    color: white !important;
}

body.dark-mode .info-box-small .info-box-header h5 {
    color: white !important;
}

body.dark-mode .info-box-small .info-box-header h5 i {
    color: white !important;
}

/* Modo oscuro agresivo para banderas de estado en tarjetas de resultados */
body.dark-mode .info-box-small .label,
body.dark-mode .info-box-small span[class*="label"] {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

body.dark-mode .info-box-small .label i,
body.dark-mode .info-box-small span[class*="label"] i {
    color: white !important;
}

/* Modo oscuro específico para texto "Cerrado" y "Abierto" */
body.dark-mode span:contains("Cerrado"),
body.dark-mode span:contains("Abierto"),
body.dark-mode span:contains("Pendiente"),
body.dark-mode span:contains("Aprobado"),
body.dark-mode span:contains("Rechazado") {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

/* Modo oscuro para cualquier elemento que contenga texto de estado */
body.dark-mode *:contains("Cerrado"),
body.dark-mode *:contains("Abierto"),
body.dark-mode *:contains("Pendiente"),
body.dark-mode *:contains("Aprobado"),
body.dark-mode *:contains("Rechazado") {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

/* Modo oscuro para elementos con clases específicas de estado */
body.dark-mode .label-closed,
body.dark-mode .label-open,
body.dark-mode .label-pending,
body.dark-mode .label-approved,
body.dark-mode .label-rejected {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

/* Modo oscuro para elementos con atributos de estado */
body.dark-mode [class*="label"][class*="closed"],
body.dark-mode [class*="label"][class*="open"],
body.dark-mode [class*="label"][class*="pending"] {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

/* Modo oscuro ESPECÍFICO para el botón "Cerrado" en las tarjetas de resultados */
body.dark-mode .info-box-small .btn,
body.dark-mode .info-box-small button {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

body.dark-mode .info-box-small .btn:hover,
body.dark-mode .info-box-small button:hover {
    background-color: #2c3e50 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

/* Modo oscuro para el botón "Cerrado" específicamente */
body.dark-mode .info-box-small .btn:contains("Cerrado"),
body.dark-mode .info-box-small button:contains("Cerrado") {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

/* Modo oscuro para banderas de estado (labels) */
body.dark-mode .info-box-small .label,
body.dark-mode .info-box-small span[class*="label"] {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

/* Modo oscuro para botón "Historial" */
body.dark-mode .info-box-small .btn-default,
body.dark-mode .info-box-small button:contains("Historial") {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

/* Modo oscuro para botón "Cerrado" (no rosa magenta) - ULTRA ESPECÍFICO */
body.dark-mode .info-box-small .btn:contains("Cerrado"),
body.dark-mode .info-box-small button:contains("Cerrado"),
body.dark-mode .info-box-small .btn-default:contains("Cerrado"),
body.dark-mode .info-box-small button[class*="btn-default"]:contains("Cerrado") {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

/* Forzar botón "Cerrado" - Sobrescribir cualquier estilo */
body.dark-mode .info-box-small button[style*="background-color"]:contains("Cerrado"),
body.dark-mode .info-box-small .btn[style*="background-color"]:contains("Cerrado") {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

/* Botón "Cerrado" específico - Sin rosa magenta */
body.dark-mode .info-box-small .btn:not(.btn-primary):contains("Cerrado"),
body.dark-mode .info-box-small button:not([class*="btn-primary"]):contains("Cerrado") {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

/* Modal de Apelación - Títulos Específicos */
body.dark-mode .modal-content h5 {
    color: white !important;
    background-color: transparent !important;
}

body.dark-mode .modal-content h5 i {
    color: #e91e63 !important;
}

body.dark-mode .modal-content .text-danger {
    color: #e74c3c !important;
}

body.dark-mode .modal-content .text-muted {
    color: #bdc3c7 !important;
}

/* Modal de Apelación - Tablas */
body.dark-mode .modal-content .table {
    background-color: #000000 !important;
    color: white !important;
}

body.dark-mode .modal-content .table td {
    background-color: #000000 !important;
    color: white !important;
    border-color: #34495e !important;
}

body.dark-mode .modal-content .table strong {
    color: white !important;
}

/* Modal de Apelación - Wells */
body.dark-mode .modal-content .well {
    background-color: #2c3e50 !important;
    border: 1px solid #34495e !important;
    color: white !important;
}

/* Modal de Apelación - Labels y Badges */
body.dark-mode .modal-content .label {
    background-color: #e91e63 !important;
    color: white !important;
    border: 1px solid #e91e63 !important;
}

body.dark-mode .modal-content .label-warning {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

/* Tiempo restante específico - Sin fondo naranja/amarillo */
body.dark-mode .modal-content #modalTimeLeft,
body.dark-mode .modal-content .label-warning#modalTimeLeft,
body.dark-mode .modal-content span#modalTimeLeft {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

/* Cualquier label de tiempo restante */
body.dark-mode .modal-content .label:contains("Tiempo"),
body.dark-mode .modal-content .label:contains("restante"),
body.dark-mode .modal-content .label:contains("Time"),
body.dark-mode .modal-content span:contains("Tiempo"),
body.dark-mode .modal-content span:contains("restante") {
    background-color: #000000 !important;
    color: white !important;
    border: 1px solid #808080 !important;
}

/* Botón "Apelar" con cuenta atrás - Rosa magenta en ambos modos */
.info-box-small .btn-primary,
.info-box-small .countdown-btn,
.info-box-small button[class*="btn-primary"] {
    background-color: #e91e63 !important;
    color: white !important;
    border: 1px solid #e91e63 !important;
}

.info-box-small .btn-primary:hover,
.info-box-small .countdown-btn:hover,
.info-box-small button[class*="btn-primary"]:hover {
    background-color: #c2185b !important;
    color: white !important;
    border: 1px solid #c2185b !important;
}

/* Modo oscuro - Botón "Apelar" mantiene rosa magenta */
body.dark-mode .info-box-small .btn-primary,
body.dark-mode .info-box-small .countdown-btn,
body.dark-mode .info-box-small button[class*="btn-primary"] {
    background-color: #e91e63 !important;
    color: white !important;
    border: 1px solid #e91e63 !important;
}

body.dark-mode .info-box-small .btn-primary:hover,
body.dark-mode .info-box-small .countdown-btn:hover,
body.dark-mode .info-box-small button[class*="btn-primary"]:hover {
    background-color: #c2185b !important;
    color: white !important;
    border: 1px solid #c2185b !important;
}


/* Modo oscuro para botón de refresh de WODs */
body.dark-mode .refresh-wods-btn,
body.dark-mode button.refresh-wods-btn {
    background-color: #ffffff !important;
    color: #000000 !important;
    border: 1px solid #ccc !important;
}

body.dark-mode .refresh-wods-btn i,
body.dark-mode .refresh-wods-btn span {
    color: #000000 !important;
}

body.dark-mode .refresh-wods-btn:hover:not(:disabled) {
    background-color: #f5f5f5 !important;
    color: #000000 !important;
    border: 1px solid #999 !important;
}

body.dark-mode .refresh-wods-btn:disabled {
    background-color: #f5f5f5 !important;
    color: #666666 !important;
    opacity: 0.6;
}

/* Modo oscuro para contenedores principales de appeals */
body.dark-mode .card {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode .card-body {
    background-color: #000000 !important;
    color: white !important;
}

body.dark-mode .v-page-heading {
    background-color: #000000 !important;
    color: white !important;
}

body.dark-mode .heading-text {
    color: white !important;
}

body.dark-mode .heading-text h1,
body.dark-mode .heading-text h2 {
    color: white !important;
}

body.dark-mode .breadcrumb {
    background-color: #000000 !important;
    color: white !important;
}

body.dark-mode .breadcrumb li {
    color: white !important;
}

body.dark-mode .breadcrumb a {
    color: white !important;
}

body.dark-mode .breadcrumb a:hover {
    color: #F07A3D !important;
}

body.dark-mode .alert-danger {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode .alert-info {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode .modal-content {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode .modal-header {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode .modal-body {
    background-color: #000000 !important;
    color: white !important;
}

body.dark-mode .modal-footer {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode .table {
    background-color: #000000 !important;
    color: white !important;
}

body.dark-mode .table td {
    background-color: #000000 !important;
    color: white !important;
    border-color: #808080 !important;
}

body.dark-mode .well {
    background-color: #2c3e50 !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode .form-control,
body.dark-mode select.form-control,
body.dark-mode select {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode .text-muted {
    color: white !important;
}

body.dark-mode hr {
    border-color: #808080 !important;
}

body.dark-mode .spinner {
    color: white !important;
}

body.dark-mode .global-loader-overlay {
    background: linear-gradient(135deg, #000000 0%, #2c3e50 50%, #34495e 100%) !important;
    color: white !important;
}

body.dark-mode .global-loader-content {
    background: rgba(28, 31, 47, 0.95) !important;
    border-color: #808080 !important;
    color: white !important;
}

body.dark-mode .global-loader-title {
    color: white !important;
}

body.dark-mode .global-loader-percentage {
    color: white !important;
}

body.dark-mode .global-loader-status {
    color: white !important;
}

.row.display-flex {
    display: flex;
    flex-wrap: wrap;
}
.row.display-flex > [class*='col-'] {
    display: flex;
    flex-direction: column;
}

ul.inline-ul li{
    display: inline-block;
}

::selection { background-color: #4d5581; color: #fff; }
::-moz-selection { background-color: #4d5581; color: #fff; }

.search-item-img img, .search-item-img .img-holder
{
    height: 84px;
    width: 84px;
}

.search-item-content
{
    margin-left: 100px;
}

h3, h3 a
{
    color: #1c1f2f;
}

table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > td:first-child::before, table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > th:first-child::before {
    top: 15px;
    left: 4px;
    height: 14px;
    width: 14px;
    display: block;
    position: absolute;
    color: #fff;
    border: 2px solid #ccc;
    border-radius: 14px;
    box-shadow: 0 0 3px #444;
    box-sizing: content-box;
    text-align: center;
    text-indent: 0 !important;
    font-family: 'Courier New', Courier, monospace;
    line-height: 14px;
    content: '+';
    background-color: #474c66;
}



@keyframes spinner {
    0% {
        transform: translate3d(-50%, -50%, 0) rotate(0deg);
    }
    100% {
        transform: translate3d(-50%, -50%, 0) rotate(360deg);
    }
}

.spinner {
    height: 20px;
    position: relative;
    display: block;
    opacity: 1;
    transition: opacity linear 0.1s;
}

.spinner::before {
    animation: 2s linear infinite spinner;
    border: solid 3px #eee;
    border-bottom-color: #E05410;
    border-radius: 50%;
    content: "";
    height: 20px;
    left: 50%;
    opacity: inherit;
    position: absolute;
    top: 50%;
    transform: translate3d(-50%, -50%, 0);
    transform-origin: center;
    width: 20px;
    will-change: transform;
}
/*
.spinMenu
{
    height: 14vh;
}
*/


/*
.fixed-header-on .header.fixed .nav > li > .spinMenu
{
    height: 10vh;
}

@media (min-width: 992px) {
    .fixed-header-on .header.fixed .nav > li > .spinMenu {
        height: 12vh;
    }

    .nav > li > .spinMenu {
        height: 18vh;
    }
}
*/
.image{
    position:relative;
    overflow:hidden;
    padding-bottom:100%;
}
.image img{
    position: absolute;
    max-width: 100%;
    max-height: 100%;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
}

.search-item
{
    border-bottom: 1px solid rgb(231, 231, 231);
    padding-top: 8px;
    padding-bottom: 8px;
}


.v-search-items h3.search-item-caption
{
    margin-top: 0px;
}

.search-item-content {
    border-bottom: none;
}

.home-list .search-item-img img, .search-item-img .img-holder {
    height: 63px;
    width: 63px;
}

.home-list .search-item-content {
    margin-left: 76px;
}

.input-group .form-control:focus {
    z-index: 2;
}

.event-home .v-call-to-action.v-bg-stylish {
    padding-top: 0px;
    padding-bottom: 5px;
    margin-bottom: 20px;
}

.event-home .v-call-to-action-wrap h1,
.event-home .v-call-to-action-wrap p
{
    margin-top: 12px;
}

.event-home .v-call-to-action-wrap p
{
    margin-top: 14px;
    margin-bottom: 0px;
}

/* Bordes izquierdo y derecho blancos para v-call-to-action en modo oscuro */
.dark-mode .event-home .v-call-to-action.v-bg-stylish-v7,
body.dark-mode .event-home .v-call-to-action.v-bg-stylish-v7 {
    border-left: 0.3px solid rgba(128, 128, 128, 0.8);
    border-right: 0.3px solid rgba(128, 128, 128, 0.8);
}

.dark-mode .v-call-to-action.v-bg-stylish-v7,
body.dark-mode .v-call-to-action.v-bg-stylish-v7 {
    border-left: 0.3px solid rgba(128, 128, 128, 0.8);
    border-right: 0.3px solid rgba(128, 128, 128, 0.8);
}

.v-page-heading.v-bg-stylish.v-bg-stylish-v1
{
    margin-bottom: 25px !important;
}

.persist
{
    color: #E05410 !important;
}

nav.mega-menu .dropdown-menu > li.notification:hover
{
    background-color: #f7f7f7;
}

.nav-tabs {
    margin: 0;
    font-size: 0;
    border-bottom-color: #EEE;
    display: inline-flex;
    overflow-y: auto;
    max-width: 100%;
}

.nav-tabs li {
    margin-right: 0px;
}

.nav-tabs li a {
    white-space: nowrap;
}

.progress-bar-pkb {
    background-color: #E05410 ;
}
.progress-group .progress-text {
    font-weight: 600;
}
.progress-group .progress-number {
    float: right;
}

.img-flag-leaderboard {
    border: 1px solid #ddd;
    width: 30px;
    height: 30px;
    display: inline-flex;
    margin-right: 5px;
}


.v-btn-margin-10
{
    margin-top: 10px;
}

.btn-pukie:hover {
    color: #fff;
    background-color: #F07A3D;
    border-color: #E05410;
}

.btn-pukie:active,
.btn-pukie:active:hover
{
    color: #333;
    background-color: #F07A3D;
    border-color: #E05410;
}

.btn-pukie {
    color: #fff;
    background-color: #E05410;
    border-color: #F07A3D;
}

table.dataTable thead > tr > th.sorting_asc, table.dataTable thead > tr > th.sorting_desc, table.dataTable thead > tr > th.sorting, table.dataTable thead > tr > td.sorting_asc, table.dataTable thead > tr > td.sorting_desc, table.dataTable thead > tr > td.sorting {
    padding-right: 27px !important;
}

table.dataTable thead th, table.dataTable thead td {
    padding: 10px 10px;
    padding-right: 10px;
    border-bottom: 1px solid #111111;
}

table.dataTable tbody td, table.dataTable tbody th {
    padding: 10px 10px;
}

.repof {
    font-size: 0.5em;
    opacity: 0.6;
    font-weight: normal;
}

.v-counter .count-number-no {
    line-height: 32px;
    font-size: 28px;
}


body.dark-mode
{
    background: #000000;
}

.dark-mode #container {
    background: #000000;
}

body.dark-mode,
.dark-mode .tabs {
    color: #fff;
}

.dark-mode h1,
.dark-mode h2,
.dark-mode h2 a {
    color: #ffffff;
}

.dark-mode .tab-content {
    background-color: #000000;
    border: 1px solid #343742;
}

.dark-mode .v-color,
.dark-mode div.v-color,
.dark-mode .dark-mode .v-link,
.dark-mode a:hover,
.dark-mode .carousel-wrap > a:hover,
.dark-mode #back-to-top:hover,
.dark-mode .v-pagination a:hover,
.dark-mode .sidebar .v-category-widget ul > li a:hover,
.dark-mode .sidebar .v-archive-widget ul > li a:hover,
.dark-mode .sidebar .v-nav-menu-widget ul > li a:hover,
.dark-mode .v-nav-menu-widget ul > li.current-menu-item a,
.dark-mode .sidebar .v-meta-data-widget ul > li a:hover,
.dark-mode .sidebar .v-recent-entry-widget ul > li a:hover,
.dark-mode .list-toggle:after,
.dark-mode .v-right-sidebar-inner > .active > a,
.dark-mode .v-right-sidebar-inner > .active > a:focus,
.dark-mode .v-right-sidebar-inner > .active > a:hover,
.dark-mode footer a:hover,
.dark-mode .copyright a:hover,
.dark-mode .read-more i:before,
.dark-mode .read-more em:before,
.dark-mode .item-link:hover,
.dark-mode .search-item-meta-down a,
.dark-mode .search-item-meta a,
.dark-mode .v-search-items .star-vote li,
.dark-mode .v-blog-item-details a:hover,
.dark-mode .author-link,
.dark-mode .v-blog-item .read-more,
.dark-mode .dark-mode .dark-mode .dark-mode .article-body-wrap .share-links a:hover,
.dark-mode .post-header .post-meta-info a:hover,
.dark-mode .post-content h2.title a:hover,
.dark-mode .recent-post .post-item-details a:hover,
.dark-mode a.current-menu-item,
.dark-mode header nav ul.nav-main ul.dropdown-menu > li > a:hover,
.dark-mode header nav ul.nav-main li a:hover,
.dark-mode header nav.mega-menu ul.nav-main li.mega-menu-item ul.sub-menu a:hover {
    color: #E05410 !important;
    border-color: #808080 !important;
}

.dark-mode header nav ul.nav-main li.dropdown.active > a i.fa-caret-down,
.dark-mode header ul.nav-pills > li.active > a,
.dark-mode .nav-pills > li.active > a,
.dark-mode .nav-pills > li.active > a:hover,
.dark-mode .nav-pills > li.active > a:focus,
.dark-mode header nav ul.nav-main li.dropdown:hover > a i.fa-caret-down {
    color: #E05410 !important;
}
.dark-mode .slideout-filter ul li a:hover,
.dark-mode .v-portfolio-item .v-portfolio-item-permalink,
.dark-mode .read-more-link,
.dark-mode .share-links > a:hover,
.dark-mode .comments-likes a:hover i,
.dark-mode .comments-likes a:hover span,
.dark-mode .comments-likes a:hover span,
.dark-mode .comments-likes a:hover i,
.dark-mode .portfolio-pagination div:hover > i,
.dark-mode .v-icon,
.dark-mode .pricing-column ul li i.fa,
.dark-mode .dark-mode .pricing-column h3,
.dark-mode .v-divider.v-up a, span.dropcap2,
.dark-mode .v-list li i,
.dark-mode .v-list-v2 li i,
.dark-mode .media-body .reply-link:hover {
    color: #fff;
}

.dark-mode .pagination > li > a,
.dark-mode .pagination > li > span {
    border: 1px solid #808080;
    color: #ffffff;
}

.dark-mode .pagination>li>a,
.dark-mode .pagination>li>span {
    background-color: #000000;
    border: 1px solid #808080;
    border-color: #808080;
}

.dark-mode .pagination>li>a i,
.dark-mode .pagination>li>span i {
    color: #ffffff;
}

.dark-mode .pagination > .active > a,
.dark-mode .pagination > .active > a:hover {
    background-color: #E05410;
    border-color: #4f5578;
    color: #ffffff;
}

.dark-mode .panel-group .panel-heading a.accordion-toggle.collapsed {
    background-color: #000000;
}

.dark-mode .panel-default>.panel-heading {
    color: #fff;
    background-color: #f5f5f5;
    border-color: #ddd;
}

.dark-mode .panel-group .panel-heading a.accordion-toggle {
    background-color: #000000;
}

.dark-mode .panel-body {
    color: #ffffff;
    background-color: #000000;
}

.dark-mode .panel-default {
    border-color: #4a4d58;
}

.dark-mode a.dark-blue {
    color: #E05410;
}

.dark-mode a.dark-blue:hover {
    color: #F07A3D;
}

/* Botones btn-primary - Cambiar de azul (#337ab7) a naranja */
.btn-primary,
button.btn-primary,
a.btn-primary {
    background-color: #E05410 !important;
    border-color: #E05410 !important;
    color: #ffffff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
button.btn-primary:hover,
button.btn-primary:focus,
button.btn-primary:active,
a.btn-primary:hover,
a.btn-primary:focus,
a.btn-primary:active {
    background-color: #F07A3D !important;
    border-color: #F07A3D !important;
    color: #ffffff !important;
}

/* Modo oscuro - Botones btn-primary */
.dark-mode .btn-primary,
.dark-mode button.btn-primary,
.dark-mode a.btn-primary,
body.dark-mode .btn-primary,
body.dark-mode button.btn-primary,
body.dark-mode a.btn-primary {
    background-color: #E05410 !important;
    border-color: #E05410 !important;
    color: #ffffff !important;
}

.dark-mode .btn-primary:hover,
.dark-mode .btn-primary:focus,
.dark-mode .btn-primary:active,
.dark-mode .btn-primary.active,
.dark-mode button.btn-primary:hover,
.dark-mode button.btn-primary:focus,
.dark-mode button.btn-primary:active,
.dark-mode a.btn-primary:hover,
.dark-mode a.btn-primary:focus,
.dark-mode a.btn-primary:active,
body.dark-mode .btn-primary:hover,
body.dark-mode .btn-primary:focus,
body.dark-mode .btn-primary:active,
body.dark-mode button.btn-primary:hover,
body.dark-mode button.btn-primary:focus,
body.dark-mode button.btn-primary:active,
body.dark-mode a.btn-primary:hover,
body.dark-mode a.btn-primary:focus,
body.dark-mode a.btn-primary:active {
    background-color: #F07A3D !important;
    border-color: #F07A3D !important;
    color: #ffffff !important;
}

/* Botones de DataTables AutoFill */
.dt-autofill-list div.dt-autofill-button button,
body.dark-mode .dt-autofill-list div.dt-autofill-button button {
    background-color: #E05410 !important;
    border-color: #E05410 !important;
    color: #ffffff !important;
}

.dt-autofill-list div.dt-autofill-button button:hover,
body.dark-mode .dt-autofill-list div.dt-autofill-button button:hover {
    background-color: #F07A3D !important;
    border-color: #F07A3D !important;
    color: #ffffff !important;
}

.dark-mode .panel-default > .panel-heading {
    background-color: #000000;
    box-shadow: none;
    border-color: #757575;
}

.dark-mode .well {
    background-color: #000000;
    border: 1px solid #000000;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
}

.dark-mode .modal-content {
    background-color: #000000;
}

.dark-mode .modal-header {
    background: #191d2f;
}

.dark-mode h4,
.dark-mode h4 a {
    color: #ffffff;
}

.dark-mode .close {
    color: #fff;
    text-shadow: 0 1px 0 #000;
}

.dark-mode .close:focus,
.dark-mode .close:hover {
    color: #fff;
}

.dark-mode .modal-header {
    border-bottom: 1px solid #53555d;
}

.dark-mode .modal-footer {
    border-top: 1px solid #53555d;
}

.dark-mode .search-result {
    background: #07080c;
}
.dark-mode .search-result:hover {
    background: #242b4f;
}

.dark-mode .search-result-moroso:hover {
    background: #242526;
    color: #797979;
}

.dark-mode .search-result-moroso {
    cursor: default;
    background: #242526;
    color: #797979;
    padding: 10px;
    margin: 0;
}

.dark-mode .search-result-header,
.dark-mode .search-result-header:hover {
    cursor: default;
    background: #191d2f;
    padding: 10px;
    margin: 0;
}

.dark-mode .btn-default {
    color: #fff;
    background-color: #E05410;
    border-color: #E05410;
}

.dark-mode .btn-default:hover {
    color: #fff;
    background-color: #F07A3D;
    border-color: #F07A3D;
}

/* Estilos para botones de flecha en modo oscuro - vista scores */
.dark-mode .btn-default .fa-arrow-left,
.dark-mode .btn-default .fa-arrow-right,
body.dark-mode .btn-default .fa-arrow-left,
body.dark-mode .btn-default .fa-arrow-right {
    color: #112540 !important;
}

.dark-mode .btn-default,
body.dark-mode .btn-default {
    background-color: #E05410 !important;
    border-color: #E05410 !important;
    color: #ffffff !important;
}

.dark-mode .btn-default:hover,
body.dark-mode .btn-default:hover {
    background-color: #F07A3D !important;
    border-color: #F07A3D !important;
    color: #ffffff !important;
}

.dark-mode .btn-default:hover .fa-arrow-left,
.dark-mode .btn-default:hover .fa-arrow-right,
body.dark-mode .btn-default:hover .fa-arrow-left,
body.dark-mode .btn-default:hover .fa-arrow-right {
    color: #112540 !important;
}

/* Forzar estilos para todos los iconos de flecha en botones en modo oscuro */
body.dark-mode button.btn-default i.fa-arrow-left,
body.dark-mode button.btn-default i.fa-arrow-right,
body.dark-mode .btn-default i.fa-arrow-left,
body.dark-mode .btn-default i.fa-arrow-right {
    color: #112540 !important;
}

body.dark-mode button.btn-default,
body.dark-mode .btn-default {
    background-color: #E05410 !important;
    border-color: #E05410 !important;
    color: #ffffff !important;
}

body.dark-mode button.btn-default:hover,
body.dark-mode .btn-default:hover {
    background-color: #F07A3D !important;
    border-color: #F07A3D !important;
    color: #ffffff !important;
}

.dark-mode .dataTables_wrapper .dataTables_filter,
.dark-mode .dataTables_wrapper .dataTables_info,
.dark-mode .dataTables_wrapper .dataTables_length,
.dark-mode .dataTables_wrapper .dataTables_paginate,
.dark-mode .dataTables_wrapper .dataTables_processing {
    color: #ffffff;
}

/* Estilos específicos para paginación de DataTables en modo oscuro */
.dark-mode .dataTables_wrapper .dataTables_paginate .paginate_button {
    color: #ffffff !important; /* Blanco en modo oscuro */
    background-color: transparent !important;
    border: none !important;
}

.dark-mode .dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background-color: #E05410 !important;
    color: #ffffff !important; /* Blanco */
    border: 1px solid #E05410 !important;
    font-weight: bold !important;
}

.dark-mode .dataTables_wrapper .dataTables_paginate .paginate_button:hover:not(.disabled):not(.current) {
    background-color: #F07A3D !important;
    color: #ffffff !important; /* Blanco */
    border: 1px solid #F07A3D !important;
}

.dark-mode .dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
    color: #ffffff !important; /* Blanco */
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

/* Estilos específicos para paginación de DataTables en modo claro - Similar a botón refresh (fondo gris claro, sin bordes) */
/* Números blancos, letras (Previous/Next) grises */
body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button {
    background-color: #fff !important; /* Fondo blanco como botón refresh */
    border: none !important; /* Sin bordes */
    background: #fff !important; /* Sobrescribir cualquier gradiente */
}

/* Botones de navegación (Previous, Next, First, Last) - Letras grises */
body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button.previous,
body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button.next,
body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button.first,
body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button.last {
    color: #1c1f2f !important; /* Gris oscuro para letras */
}

/* Números de página - Blancos */
body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button:not(.previous):not(.next):not(.first):not(.last) {
    color: #ffffff !important; /* Blanco para números */
}

body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button.current,
body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    color: #ffffff !important; /* Blanco para número activo */
    border: none !important; /* Sin bordes */
    background-color: #e6e6e6 !important; /* Fondo gris claro como hover del botón refresh */
    background: #e6e6e6 !important; /* Sobrescribir cualquier gradiente */
    font-weight: bold !important;
}

body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button:hover:not(.disabled):not(.current) {
    border: none !important; /* Sin bordes */
    background-color: #e6e6e6 !important; /* Fondo gris claro como hover del botón refresh */
    background: #e6e6e6 !important; /* Sobrescribir cualquier gradiente */
}

/* Hover para números - Mantener blanco */
body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button:hover:not(.disabled):not(.current):not(.previous):not(.next):not(.first):not(.last) {
    color: #ffffff !important; /* Blanco para números en hover */
}

/* Hover para letras - Mantener gris */
body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button.previous:hover:not(.disabled),
body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button.next:hover:not(.disabled),
body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button.first:hover:not(.disabled),
body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button.last:hover:not(.disabled) {
    color: #1c1f2f !important; /* Gris oscuro para letras en hover */
}

body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
    background-color: #fff !important;
    border: none !important; /* Sin bordes */
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

/* Disabled para números - Blanco */
body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:not(.previous):not(.next):not(.first):not(.last) {
    color: #ffffff !important; /* Blanco para números disabled */
}

/* Disabled para letras - Gris */
body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button.disabled.previous,
body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button.disabled.next,
body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button.disabled.first,
body:not(.dark-mode) .dataTables_wrapper .dataTables_paginate .paginate_button.disabled.last {
    color: #1c1f2f !important; /* Gris oscuro para letras disabled */
}

.dark-mode .table-hover>tbody>tr:hover {
    background-color: #000000;
}

.dark-mode .dataTables_wrapper .dataTables_filter input {
    background-color: #000000 !important;
    border: 1px solid #808080 !important;
    color: #FFFFFF !important;
}

.dark-mode .dataTables_wrapper .dataTables_filter input::placeholder {
    color: #808080 !important;
}

.dark-mode .dataTables_wrapper .dataTables_filter input:focus {
    background-color: #000000 !important;
    border: 1px solid #808080 !important;
    color: #FFFFFF !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.2) !important;
}

.dark-mode table.dataTable {
    width: 100%;
    margin: 0 auto;
    clear: both;
    border-collapse: separate;
    border-spacing: 0;
    color: #ffffff;
}

.dark-mode table.dataTable tbody tr {
    background-color: #000000;
}

.dark-mode h3,
.dark-mode h3 a {
    color: #ffffff;
}

.dark-mode .form-control,
.dark-mode select.form-control,
.dark-mode select {
    color: #fff;
    background-color: #000000 !important;
    border: 1px solid #808080;
}

.dark-mode .form-control:focus,
.dark-mode select.form-control:focus,
.dark-mode select:focus,
body.dark-mode .form-control:focus,
body.dark-mode select.form-control:focus,
body.dark-mode select:focus {
    color: #fff !important;
    background-color: #000000 !important;
    border-color: #ffffff !important;
}

.dark-mode .bootstrap-select .btn,
.dark-mode .bootstrap-select .btn-default,
body.dark-mode .bootstrap-select .btn,
body.dark-mode .bootstrap-select .btn-default {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: #ffffff !important;
}

.dark-mode .bootstrap-select .btn:hover,
.dark-mode .bootstrap-select .btn:focus,
body.dark-mode .bootstrap-select .btn:hover,
body.dark-mode .bootstrap-select .btn:focus {
    background-color: #000000 !important;
    border-color: #808080 !important;
    color: #ffffff !important;
}

/*
.form-control:focus {
    color: #ffffff;
    background-color: rgb(53 57 78);
    border: solid 1px #242b4f;
}
*/
.dark-mode input[type=email],
.dark-mode input[type=password],
.dark-mode input[type=tel],
.dark-mode input[type=text],
.dark-mode textarea {
    border: solid 1px #4f5578;
    color: #fff;
    background-color: rgb(36 43 79);
}

.dark-mode input[type=email]:focus,
.dark-mode input[type=text]:focus,
.dark-mode textarea:focus,
.dark-mode select:focus,
.dark-mode select.form-control:focus {
    color: #ffffff;
    background-color: #000000 !important;
    border-color: #ffffff !important;
}

/* Estilos adicionales para selects en modo oscuro */
.dark-mode select option,
body.dark-mode select option {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.dark-mode select option:hover,
.dark-mode select option:checked,
body.dark-mode select option:hover,
body.dark-mode select option:checked {
    background-color: #F07A3D !important;
    color: #ffffff !important;
}

.dark-mode .input-group-addon {
    color: #fff;
    background-color: #242b4f;
    border: 1px solid #4f5578;
}

.dark-mode .dropdown-menu {
    background-color: #000000 !important;
    border: none;
    border-top: 3px solid #E05410;
}

.dark-mode .bootstrap-select .dropdown-menu,
.dark-mode .selectpicker .dropdown-menu,
.dark-mode .btn-group .dropdown-menu,
.dark-mode select + .dropdown-menu,
body.dark-mode .bootstrap-select .dropdown-menu,
body.dark-mode .selectpicker .dropdown-menu,
body.dark-mode .btn-group .dropdown-menu {
    background-color: #000000 !important;
    border: none;
    border-top: 3px solid #E05410;
}

.dark-mode .bootstrap-select .dropdown-menu > li > a,
.dark-mode .selectpicker .dropdown-menu > li > a,
.dark-mode .btn-group .dropdown-menu > li > a,
.dark-mode .dropdown-menu > li > a {
    background-color: #000000 !important;
    color: #ffffff !important;
}

.dark-mode .bootstrap-select .dropdown-menu > li > a:hover,
.dark-mode .bootstrap-select .dropdown-menu > li > a:focus,
.dark-mode .selectpicker .dropdown-menu > li > a:hover,
.dark-mode .selectpicker .dropdown-menu > li > a:focus,
.dark-mode .btn-group .dropdown-menu > li > a:hover,
.dark-mode .btn-group .dropdown-menu > li > a:focus,
.dark-mode .dropdown-menu > li > a:hover,
.dark-mode .dropdown-menu > li > a:focus {
    background-color: #F07A3D !important;
    color: #ffffff !important;
}

.dark-mode .dropdown-menu > li.active > a,
.dark-mode .dropdown-menu > li.selected > a,
.dark-mode .bootstrap-select .dropdown-menu > li.active > a,
.dark-mode .bootstrap-select .dropdown-menu > li.selected > a {
    background-color: #000000 !important;
    color: #ffffff !important;
}

/* Estilos adicionales para sobrescribir cualquier azul en el hover del select */
.dark-mode .dropdown-menu > li > a:hover,
.dark-mode .dropdown-menu > li > a:focus,
.dark-mode .dropdown-menu > li.active > a:hover,
.dark-mode .dropdown-menu > li.selected > a:hover,
.dark-mode .dropdown-menu > li.highlighted > a,
.dark-mode .bootstrap-select .dropdown-menu > li > a:hover,
.dark-mode .bootstrap-select .dropdown-menu > li > a:focus,
.dark-mode .bootstrap-select .dropdown-menu > li.active > a:hover,
.dark-mode .bootstrap-select .dropdown-menu > li.selected > a:hover,
.dark-mode .bootstrap-select .dropdown-menu > li.highlighted > a,
.dark-mode .selectpicker .dropdown-menu > li > a:hover,
.dark-mode .selectpicker .dropdown-menu > li > a:focus,
body.dark-mode .dropdown-menu > li > a:hover,
body.dark-mode .dropdown-menu > li > a:focus,
body.dark-mode .bootstrap-select .dropdown-menu > li > a:hover,
body.dark-mode .bootstrap-select .dropdown-menu > li > a:focus,
.dark-mode .dropdown-menu li:hover,
.dark-mode .dropdown-menu li:focus,
.dark-mode .bootstrap-select .dropdown-menu li:hover,
.dark-mode .bootstrap-select .dropdown-menu li:focus {
    background-color: #F07A3D !important;
    background: #F07A3D !important;
    color: #ffffff !important;
}

.dark-mode .dropdown-menu > li:hover > a,
.dark-mode .dropdown-menu > li:focus > a,
.dark-mode .bootstrap-select .dropdown-menu > li:hover > a,
.dark-mode .bootstrap-select .dropdown-menu > li:focus > a,
.dark-mode .selectpicker .dropdown-menu > li:hover > a,
.dark-mode .selectpicker .dropdown-menu > li:focus > a {
    background-color: #F07A3D !important;
    background: #F07A3D !important;
    color: #ffffff !important;
}

.dark-mode .search-results {
    border: 1px solid #808080;
    background-color: #000000;
}

.dark-mode .v-tagline-box {
    background: #000000;
}

.dark-mode .v-tagline-box-v1 {
    border: solid 1px #808080;
}

.dark-mode .shadow-effect-2:after,
.dark-mode .shadow-effect-2:before,
.dark-mode .shadow-effect-3:before,
.dark-mode .shadow-effect-4:after {
    -o-transform: rotate(-3deg);
    -ms-transform: rotate(-3deg);
    -moz-transform: rotate(-3deg);
    -webkit-transform: rotate(-3deg);
    transform: rotate(-3deg);
    -moz-box-shadow: 0 15px 10px #999;
    -webkit-box-shadow: 0 15px 10px #999;
    box-shadow: 0 15px 10px #000;
}

.dark-mode header nav ul.nav-main ul.dropdown-menu {
    background: #000000;
    border: none;
    border-top: 3px solid #E05410;
}

.dark-mode header nav ul.nav-main ul.dropdown-menu > li > a {
    color: #fff;
    border-bottom: none;
}

.dark-mode header nav ul.nav-pills > li a:hover {
    color: #ffffff!important;
}

.dark-mode .dropdown-menu>li>a:focus,
.dark-mode .dropdown-menu>li>a:hover {
    color: #ffffff !important;
    background-color: #F07A3D !important;
    background: #F07A3D !important;
    border: none;
}

/* Estilos adicionales al final para sobrescribir cualquier azul de Bootstrap */
body.dark-mode .dropdown-menu li:hover a,
body.dark-mode .dropdown-menu li:focus a,
body.dark-mode .dropdown-menu li a:hover,
body.dark-mode .dropdown-menu li a:focus,
body.dark-mode .bootstrap-select .dropdown-menu li:hover a,
body.dark-mode .bootstrap-select .dropdown-menu li:focus a,
body.dark-mode .bootstrap-select .dropdown-menu li a:hover,
body.dark-mode .bootstrap-select .dropdown-menu li a:focus,
.dark-mode .dropdown-menu li:hover a,
.dark-mode .dropdown-menu li:focus a,
.dark-mode .bootstrap-select .dropdown-menu li:hover a,
.dark-mode .bootstrap-select .dropdown-menu li:focus a {
    background-color: #F07A3D !important;
    background: #F07A3D !important;
    color: #ffffff !important;
}

.dark-mode header nav ul.nav-main ul.dropdown-menu li:hover > a {
    filter: none;
    background: #E05410;
    color: #ffffff !important;
    border-color: #808080;
}

.dark-mode nav.mega-menu .dropdown-menu {
    border-top: 3px solid #E05410;
}

.dark-mode nav.mega-menu .dropdown-menu > li.notification:hover {
    background-color: #000000;
    border: none;
}
.dark-mode .user-footer > div {
    background-color: #000000 !important;
    color: #fff !important;
    border: none !important;
}

.dark-mode .user-menu > .dropdown-menu > .user-footer {
    background-color: #000000;
    border: none;
}

.dark-mode .user-menu > .dropdown-menu {
    background-color: #000000;
    border: 1px solid #808080;
    border-top: 3px solid #E05410;
}

.dark-mode .v-smash-text .v-call-text,
.dark-mode .smash-text,
.dark-mode .v-smash-text-large {
    color: #ffffff;
}

.dark-mode .v-counter .count-number-no {
    color: #fff;
}

.dark-mode .list-group-item {
    background-color: #191d2f;
    border: 1px solid #53555d;
}

.dark-mode h6,
.dark-mode h6 a {
    color: #ffffff;
}

.dark-mode .dropdown-menu>li>a {
    color: #fff;
}

.dark-mode a {
    color: #fff;
}

.dark-mode .search-item ul.list-inline {
    color: #ffffff;
}

.dark-mode .nav-tabs li a,
.dark-mode .nav-tabs li a:hover {
    border-bottom: none;
    border-right: 1px solid #343742;
    border-top: 1px solid #343742;
}

.dark-mode .nav-tabs li {
    border-bottom: 1px solid #343742;
}

.dark-mode .nav-tabs>li.active>a,
.dark-mode .nav-tabs>li.active>a:focus,
.dark-mode .nav-tabs>li.active>a:hover {
    background-color: #E05410 !important;
    border: 1px solid #E05410 !important;
    color: #ffffff !important;
}

.dark-mode .nav-tabs li:first-child a {
    border-left: 1px solid #343742;
}

.dark-mode .nav-tabs>li>a:hover {
    border-color: #343742 #343742 #343742;
}

.dark-mode .nav-tabs li a {
    color: #fff;
}

.dark-mode .nav-tabs {
    border-bottom-color: #1c1f2f;
}

.dark-mode #searcher {
    background-color: #1d1f2b !important;
    color: #fff !important;
}

.dark-mode #searcher:focus {
    background-color: #323758 !important;
    color: #fff !important;
}

.dark-mode table.dataTable.hover tbody tr:hover,
.dark-mode table.dataTable.display tbody tr:hover {
    background-color: #F07A3D !important;
}

.dark-mode .banner-section {
    background: #000000;
    padding: 50px 0;
    text-align: center;
}

.dark-mode .nav-tabs {
    border-bottom-color: #343742;
}

.dark-mode .btn-outline {
    background-color: #191d2f;
}

.dark-mode .btn-outline:hover {
    color: #fff;
}

.pagination>li>a, .pagination>li>span {
    padding: 3px 7px;
}

.pagination > .active > a,
.pagination > .active > a:hover {
    background-color: #E05410;
    border-color: #4f5578;
    color: #ffffff;
    font-weight: bold;
}

.dark-mode .float {
    box-shadow: 2px 2px 2px #1c1f2f;
}

.dark-mode .list-group-item {
    background-color: #343742;
}

.nav-tabs li a {
    color: #1c1f2f;
}

.nav-tabs li a:hover {
    color: #ffffff;
    background-color: #F07A3D !important;
}

.responsive-replace-nav {
    display: none !important;
}

@media (min-width: 991px) {
    .responsive-replace-nav {
        display: block !important;
    }
}

.responsive-insert-nav {
    display: inline-block !important;
}

@media (min-width: 991px) {
    .responsive-insert-nav {
        display: none !important;
    }
}

input.btn-spacing,
.btn-spacing button {
    margin-bottom: 5px;
    margin-right: 10px;
}

.dark-mode table.dataTable.row-border tbody th,
.dark-mode table.dataTable.row-border tbody td,
.dark-mode table.dataTable.display tbody th,
.dark-mode table.dataTable.display tbody td {
    border-top: 1px solid #4a4b4d;
}

.dark-mode table.dataTable,
.dark-mode table.dataTable.no-footer {
    border-top: 1px solid #4a4b4d;
    border-bottom: 1px solid #4a4b4d;
}

.dark-mode table.dataTable thead td,
.dark-mode table.dataTable thead th {
    border-bottom: 1px solid #4a4b4d;
}


.open > .dropdown-menu {
    max-height: 189px;
    overflow-y: auto;
}


input.btn-spacing,
.btn-spacing button {
    margin-bottom: 5px;
}

.card.card-record {
    border: 1px solid #f7f7f7;
    margin-bottom: 16px;
    padding: 5px;
}

.card.card-record img {
    display: inline-block;
    width: 60px;
    height: 60px;
    vertical-align: top;
    margin: 5px;
}

.card.card-record .card-body {
    display: inline-block;
}

.label.label-assertive {
    background-color: #E05410;
    display: inline-block;
    margin: 5px;
}

pr-log-item .item {
    border: 1px solid #f7f7f7;
    padding:5px;
}

.button-bar{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-moz-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex:1;-moz-box-flex:1;-moz-flex:1;-ms-flex:1;flex:1;width:100%}
.button-bar.button-bar-inline{display:block;width:auto}
.button-bar.button-bar-inline:after,.button-bar.button-bar-inline:before{display:table;content:"";line-height:0}
.button-bar.button-bar-inline:after{clear:both}
.button-bar.button-bar-inline>.button{width:auto;display:inline-block;float:left}
.button-bar.bar-positive>.button{border-color:#0c60ee}
.button-bar>.button{-webkit-box-flex:1;-webkit-flex:1;-moz-box-flex:1;-moz-flex:1;-ms-flex:1;flex:1;display:block;overflow:hidden;padding:0 16px;width:0;border-width:1px 0 1px 1px;border-radius:0;text-align:center;text-overflow:ellipsis;white-space:nowrap;border: 1px solid;}
.button-bar>.button .icon:before,.button-bar>.button:before{line-height:44px}
.button-bar>.button:first-child{border-radius:4px 0 0 4px}
.button-bar>.button:last-child{border-right-width:1px;border-radius:0 4px 4px 0}
.button-bar>.button:only-child{border-radius:4px}
.button-bar>.button-small .icon:before,.button-bar>.button-small:before{line-height:28px}

.button.button-positive{border-color:transparent;background-color:#E05410;color:#fff;font-weight: bold;}

.dark-mode .button.button-positive {
    background-color: #042248;
    color: #fff;
    font-weight: 700;
}

.dark-mode .button.button-positive-2 {
    background-color: #387ef5 !important;
}

.record-insert .label
{
    font-weight: bold;
    margin-right: 15px;
}


.nav.nav-stacked li a {
    padding: 0;
    color: #757575;
}
ul.vert-men.nav.nav-stacked,
ol.vert-men.nav.nav-stacked {
    margin: 0;
    padding: 0;
}

ul.vert-men.nav-pills > li {
    margin: 0 0;
    margin-right: 0;
    padding: 5px 15px;
}

ul.vert-men.nav-pills > li:first-child
{
    padding-top: 10px;
}

ul.vert-men.nav-pills > li:last-child
{
    padding-bottom: 10px;
}

ul.vert-men.nav-pills > li:hover,
ul.vert-men.nav-pills > li:hover > a,
ul.vert-men.nav-pills > li > a:hover {
    background: #E05410 !important;
    color: #ffffff !important;
    cursor: pointer;
    font-weight: bold;
}

.fixed-header-on .header.fixed .nav.vert-men > li > a {
    padding-top: initial !important;
    padding-bottom: initial !important;
}

.chromaContainerHeat
{
    /*background-color: #00bb2d !important;*/
    background-color: #ffffff !important;
    padding-top:50px;
    padding-bottom:50px;
}

.header-Placa {
    position: relative;
    background-color: #ffffff;
    width: 1080px;
    height: 141px;
}
.content-Placa {
    padding-top:9px;
    width: 1080px;
}
.content-Placa tr {
    background-color: #000000;
}
.content-Placa tr td {
    margin-bottom:4px;
}

.content-Placa tr td:not(:first-child) {
    border-left: 2px solid #26303e;
}

.powered-Placa {
    position: absolute;
    bottom: 0;
    right: 0;
    background-color: #000000;
    padding: 0px 23px;
}
.accordion-toggle-disabled {
    cursor: default;
}


.flex-container {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: normal;
    align-content: normal;
    min-height: 100%;
}

.flex-items:nth-child(1) {
    display: block;
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    align-self: center;
    order: 0;
}

.flex-items:nth-child(2) {
    display: block;
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: auto;
    align-self: center;
    order: 0;
}

/* Estilos finales para sobrescribir cualquier azul en el hover del select - Máxima prioridad */
body.dark-mode .dropdown-menu li a:hover,
body.dark-mode .dropdown-menu li a:focus,
body.dark-mode .dropdown-menu li:hover > a,
body.dark-mode .dropdown-menu li:focus > a,
body.dark-mode .bootstrap-select .dropdown-menu li a:hover,
body.dark-mode .bootstrap-select .dropdown-menu li a:focus,
body.dark-mode .bootstrap-select .dropdown-menu li:hover > a,
body.dark-mode .bootstrap-select .dropdown-menu li:focus > a,
body.dark-mode .selectpicker .dropdown-menu li a:hover,
body.dark-mode .selectpicker .dropdown-menu li a:focus,
.dark-mode .dropdown-menu li a:hover,
.dark-mode .dropdown-menu li a:focus,
.dark-mode .dropdown-menu li:hover > a,
.dark-mode .dropdown-menu li:focus > a,
.dark-mode .bootstrap-select .dropdown-menu li a:hover,
.dark-mode .bootstrap-select .dropdown-menu li a:focus,
.dark-mode .bootstrap-select .dropdown-menu li:hover > a,
.dark-mode .bootstrap-select .dropdown-menu li:focus > a,
/* Estilos adicionales para el selector de categorías específicamente */
body.dark-mode select + .dropdown-menu li:hover,
body.dark-mode select + .dropdown-menu li:hover > a,
body.dark-mode select + .dropdown-menu li a:hover,
.dark-mode select + .dropdown-menu li:hover,
.dark-mode select + .dropdown-menu li:hover > a,
.dark-mode select + .dropdown-menu li a:hover,
body.dark-mode .form-control + .dropdown-menu li:hover,
body.dark-mode .form-control + .dropdown-menu li:hover > a,
body.dark-mode .form-control + .dropdown-menu li a:hover,
.dark-mode .form-control + .dropdown-menu li:hover,
.dark-mode .form-control + .dropdown-menu li:hover > a,
.dark-mode .form-control + .dropdown-menu li a:hover {
    background-color: #F07A3D !important;
    background: #F07A3D !important;
    color: #ffffff !important;
}

/* Sobrescribir cualquier estilo inline o de Bootstrap que pueda estar aplicando azul */
body.dark-mode .dropdown-menu > li:hover,
body.dark-mode .dropdown-menu > li:hover > a,
body.dark-mode .dropdown-menu > li > a:hover,
.dark-mode .dropdown-menu > li:hover,
.dark-mode .dropdown-menu > li:hover > a,
.dark-mode .dropdown-menu > li > a:hover,
body.dark-mode .bootstrap-select .dropdown-menu > li:hover,
body.dark-mode .bootstrap-select .dropdown-menu > li:hover > a,
body.dark-mode .bootstrap-select .dropdown-menu > li > a:hover,
.dark-mode .bootstrap-select .dropdown-menu > li:hover,
.dark-mode .bootstrap-select .dropdown-menu > li:hover > a,
.dark-mode .bootstrap-select .dropdown-menu > li > a:hover {
    background-color: #F07A3D !important;
    background: #F07A3D !important;
    color: #ffffff !important;
}

.flex-items:nth-child(3) {
    display: block;
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: auto;
    align-self: flex-start;
    order: 0;
}

/* Estilos para mensaje de invitación - Modo claro */
.alert-invitation-message {
    background-color: #ffffff !important;
    border: 2px solid #000000 !important;
    color: #000000 !important;
    padding: 12px 15px;
    border-radius: 4px;
}

.alert-invitation-message i.fa-info-circle {
    color: #E05410 !important;
    margin-right: 8px;
}

/* Estilos para mensaje de invitación - Modo oscuro */
body.dark-mode .alert-invitation-message {
    background-color: #000000 !important;
    border: 2px solid #808080 !important;
    color: #ffffff !important;
}

body.dark-mode .alert-invitation-message i.fa-info-circle {
    color: #E05410 !important;
}

/* Línea blanca arriba del footer */
.footer-wrap {
    border-top: 1px solid #808080 !important;
}

/* ESTILOS FINALES - MÁXIMA PRIORIDAD PARA SELECTOR DE CATEGORÍAS - SOBRESCRIBIR CUALQUIER AZUL */
/* Aplicar a todos los posibles selectores del dropdown del select de categorías */
body.dark-mode .dropdown-menu li:hover,
body.dark-mode .dropdown-menu li:hover a,
body.dark-mode .dropdown-menu li a:hover,
body.dark-mode .dropdown-menu > li:hover,
body.dark-mode .dropdown-menu > li:hover a,
body.dark-mode .dropdown-menu > li > a:hover,
.dark-mode .dropdown-menu li:hover,
.dark-mode .dropdown-menu li:hover a,
.dark-mode .dropdown-menu li a:hover,
.dark-mode .dropdown-menu > li:hover,
.dark-mode .dropdown-menu > li:hover a,
.dark-mode .dropdown-menu > li > a:hover,
body.dark-mode .bootstrap-select .dropdown-menu li:hover,
body.dark-mode .bootstrap-select .dropdown-menu li:hover a,
body.dark-mode .bootstrap-select .dropdown-menu li a:hover,
body.dark-mode .bootstrap-select .dropdown-menu > li:hover,
body.dark-mode .bootstrap-select .dropdown-menu > li:hover a,
body.dark-mode .bootstrap-select .dropdown-menu > li > a:hover,
.dark-mode .bootstrap-select .dropdown-menu li:hover,
.dark-mode .bootstrap-select .dropdown-menu li:hover a,
.dark-mode .bootstrap-select .dropdown-menu li a:hover,
.dark-mode .bootstrap-select .dropdown-menu > li:hover,
.dark-mode .bootstrap-select .dropdown-menu > li:hover a,
.dark-mode .bootstrap-select .dropdown-menu > li > a:hover,
body.dark-mode .selectpicker .dropdown-menu li:hover,
body.dark-mode .selectpicker .dropdown-menu li:hover a,
body.dark-mode .selectpicker .dropdown-menu li a:hover,
.dark-mode .selectpicker .dropdown-menu li:hover,
.dark-mode .selectpicker .dropdown-menu li:hover a,
.dark-mode .selectpicker .dropdown-menu li a:hover {
    background-color: #F07A3D !important;
    background: #F07A3D !important;
    color: #ffffff !important;
}

/* Aplicar también al elemento li directamente */
body.dark-mode .dropdown-menu > li:hover,
body.dark-mode .bootstrap-select .dropdown-menu > li:hover,
body.dark-mode .selectpicker .dropdown-menu > li:hover,
.dark-mode .dropdown-menu > li:hover,
.dark-mode .bootstrap-select .dropdown-menu > li:hover,
.dark-mode .selectpicker .dropdown-menu > li:hover {
    background-color: #F07A3D !important;
    background: #F07A3D !important;
}

body.dark-mode .dropdown-menu > li:hover > a,
body.dark-mode .bootstrap-select .dropdown-menu > li:hover > a,
body.dark-mode .selectpicker .dropdown-menu > li:hover > a,
.dark-mode .dropdown-menu > li:hover > a,
.dark-mode .bootstrap-select .dropdown-menu > li:hover > a,
.dark-mode .selectpicker .dropdown-menu > li:hover > a {
    background-color: #F07A3D !important;
    background: #F07A3D !important;
    color: #ffffff !important;
}

/* Estilos específicos para el selector de categorías por ID */
body.dark-mode #sco_category + .dropdown-menu li:hover,
body.dark-mode #sco_category + .dropdown-menu li:hover > a,
body.dark-mode #sco_category + .dropdown-menu li > a:hover,
.dark-mode #sco_category + .dropdown-menu li:hover,
.dark-mode #sco_category + .dropdown-menu li:hover > a,
.dark-mode #sco_category + .dropdown-menu li > a:hover,
body.dark-mode select#sco_category + .dropdown-menu li:hover,
body.dark-mode select#sco_category + .dropdown-menu li:hover > a,
body.dark-mode select#sco_category + .dropdown-menu li > a:hover,
.dark-mode select#sco_category + .dropdown-menu li:hover,
.dark-mode select#sco_category + .dropdown-menu li:hover > a,
.dark-mode select#sco_category + .dropdown-menu li > a:hover,
body.dark-mode .bootstrap-select#sco_category .dropdown-menu li:hover,
body.dark-mode .bootstrap-select#sco_category .dropdown-menu li:hover > a,
body.dark-mode .bootstrap-select#sco_category .dropdown-menu li > a:hover,
.dark-mode .bootstrap-select#sco_category .dropdown-menu li:hover,
.dark-mode .bootstrap-select#sco_category .dropdown-menu li:hover > a,
.dark-mode .bootstrap-select#sco_category .dropdown-menu li > a:hover {
    background-color: #F07A3D !important;
    background: #F07A3D !important;
    color: #ffffff !important;
}

/* Sobrescribir cualquier estilo de Bootstrap que pueda estar aplicando azul */
body.dark-mode .dropdown-menu > li:hover,
body.dark-mode .dropdown-menu > li:hover > a,
body.dark-mode .dropdown-menu > li > a:hover,
.dark-mode .dropdown-menu > li:hover,
.dark-mode .dropdown-menu > li:hover > a,
.dark-mode .dropdown-menu > li > a:hover {
    background-color: #F07A3D !important;
    background: #F07A3D !important;
    color: #ffffff !important;
}

/* ESTILO FINAL - MÁXIMA ESPECIFICIDAD - SOBRESCRIBIR CUALQUIER AZUL DE BOOTSTRAP */
html body.dark-mode .dropdown-menu > li:hover > a,
html body.dark-mode .dropdown-menu > li > a:hover,
html body.dark-mode .bootstrap-select .dropdown-menu > li:hover > a,
html body.dark-mode .bootstrap-select .dropdown-menu > li > a:hover,
html body.dark-mode .selectpicker .dropdown-menu > li:hover > a,
html body.dark-mode .selectpicker .dropdown-menu > li > a:hover,
html .dark-mode .dropdown-menu > li:hover > a,
html .dark-mode .dropdown-menu > li > a:hover,
html .dark-mode .bootstrap-select .dropdown-menu > li:hover > a,
html .dark-mode .bootstrap-select .dropdown-menu > li > a:hover,
html .dark-mode .selectpicker .dropdown-menu > li:hover > a,
html .dark-mode .selectpicker .dropdown-menu > li > a:hover {
    background-color: #F07A3D !important;
    background: #F07A3D !important;
    background-image: none !important;
    color: #ffffff !important;
}

/* ESTILO ULTRA ESPECÍFICO - SOBRESCRIBIR CUALQUIER AZUL DE BOOTSTRAP O PLUGINS */
html body.dark-mode .dropdown-menu > li:hover,
html body.dark-mode .dropdown-menu > li:hover > a,
html body.dark-mode .dropdown-menu > li > a:hover,
html body.dark-mode .dropdown-menu li:hover,
html body.dark-mode .dropdown-menu li:hover > a,
html body.dark-mode .dropdown-menu li > a:hover,
html body.dark-mode .bootstrap-select .dropdown-menu > li:hover,
html body.dark-mode .bootstrap-select .dropdown-menu > li:hover > a,
html body.dark-mode .bootstrap-select .dropdown-menu > li > a:hover,
html body.dark-mode .bootstrap-select .dropdown-menu li:hover,
html body.dark-mode .bootstrap-select .dropdown-menu li:hover > a,
html body.dark-mode .bootstrap-select .dropdown-menu li > a:hover,
html body.dark-mode .selectpicker .dropdown-menu > li:hover,
html body.dark-mode .selectpicker .dropdown-menu > li:hover > a,
html body.dark-mode .selectpicker .dropdown-menu > li > a:hover,
html body.dark-mode .selectpicker .dropdown-menu li:hover,
html body.dark-mode .selectpicker .dropdown-menu li:hover > a,
html body.dark-mode .selectpicker .dropdown-menu li > a:hover,
html .dark-mode .dropdown-menu > li:hover,
html .dark-mode .dropdown-menu > li:hover > a,
html .dark-mode .dropdown-menu > li > a:hover,
html .dark-mode .dropdown-menu li:hover,
html .dark-mode .dropdown-menu li:hover > a,
html .dark-mode .dropdown-menu li > a:hover,
html .dark-mode .bootstrap-select .dropdown-menu > li:hover,
html .dark-mode .bootstrap-select .dropdown-menu > li:hover > a,
html .dark-mode .bootstrap-select .dropdown-menu > li > a:hover,
html .dark-mode .bootstrap-select .dropdown-menu li:hover,
html .dark-mode .bootstrap-select .dropdown-menu li:hover > a,
html .dark-mode .bootstrap-select .dropdown-menu li > a:hover,
html .dark-mode .selectpicker .dropdown-menu > li:hover,
html .dark-mode .selectpicker .dropdown-menu > li:hover > a,
html .dark-mode .selectpicker .dropdown-menu > li > a:hover,
html .dark-mode .selectpicker .dropdown-menu li:hover,
html .dark-mode .selectpicker .dropdown-menu li:hover > a,
html .dark-mode .selectpicker .dropdown-menu li > a:hover {
    background-color: #F07A3D !important;
    background: #F07A3D !important;
    background-image: none !important;
    color: #ffffff !important;
}

/* Menú superior del dashboard - fondo negro siempre en todas las vistas */
.main-header,
.main-header .navbar,
.skin-pukiebook .main-header,
.skin-pukiebook .main-header .navbar,
body .main-header,
body .main-header .navbar {
    background-color: #000000 !important;
    background: #000000 !important;
}

.main-header .logo,
.skin-pukiebook .main-header .logo,
body .main-header .logo {
    background-color: #000000 !important;
    background: #000000 !important;
}

/* Sidebar menu - colores naranja Repify para modo claro */
.skin-pukiebook .sidebar-menu > li:hover > a,
.skin-pukiebook .sidebar-menu > li:hover > a:hover,
.skin-pukiebook .sidebar-menu > li:hover > a:focus {
    color: #fff !important;
    background: #F07A3D !important; /* Naranja Claro - Repify */
    background-color: #F07A3D !important; /* Naranja Claro - Repify */
}

.skin-pukiebook .sidebar-menu > li.active > a,
.skin-pukiebook .sidebar-menu > li.active > a:hover,
.skin-pukiebook .sidebar-menu > li.active > a:focus,
.skin-pukiebook .sidebar-menu > li.active > a:active {
    color: #fff !important;
    background: #E05410 !important; /* Naranja Principal - Repify */
    background-color: #E05410 !important; /* Naranja Principal - Repify */
}

.skin-pukiebook .sidebar-menu > li.active {
    border-left-color: #E05410 !important; /* Naranja Principal - Repify */
}

/* Treeview menu (submenús) - colores naranja Repify para modo claro */
.skin-pukiebook .sidebar-menu .treeview-menu > li > a:hover,
.skin-pukiebook .sidebar-menu .treeview-menu > li:hover > a {
    color: #fff !important;
    background: #F07A3D !important; /* Naranja Claro - Repify */
    background-color: #F07A3D !important; /* Naranja Claro - Repify */
}

.skin-pukiebook .sidebar-menu .treeview-menu > li.active > a {
    color: #fff !important;
    background: #E05410 !important; /* Naranja Principal - Repify */
}

/* Estilos adicionales para elementos treeview activos en modo claro */
.skin-pukiebook .sidebar-menu > li.treeview.active > a,
.skin-pukiebook .sidebar-menu > li.treeview.active > a:hover,
.skin-pukiebook .sidebar-menu > li.treeview.active > a:focus {
    color: #fff !important;
    background: #E05410 !important; /* Naranja Principal - Repify */
}

.skin-pukiebook .sidebar-menu > li.treeview:hover > a {
    color: #fff !important;
    background: #F07A3D !important; /* Naranja Claro - Repify */
}

/* Sobrescribir cualquier color rosa que pueda estar aplicado */
.skin-pukiebook .sidebar-menu > li > a[style*="E05410"],
.skin-pukiebook .sidebar-menu > li > a[style*="E05410"],
.skin-pukiebook .sidebar-menu .treeview-menu > li > a[style*="E05410"],
.skin-pukiebook .sidebar-menu .treeview-menu > li > a[style*="E05410"] {
    background: #E05410 !important; /* Naranja Principal - Repify */
    color: #fff !important;
}

/* Regla general para sobrescribir cualquier color rosa en sidebar (modo claro) */
body:not(.dark-mode) .skin-pukiebook .sidebar-menu > li.active > a,
body:not(.dark-mode) .skin-pukiebook .sidebar-menu > li.treeview.active > a,
body:not(.dark-mode) .skin-pukiebook .sidebar-menu .treeview-menu > li.active > a {
    background: #E05410 !important; /* Naranja Principal - Repify */
    background-color: #E05410 !important; /* Naranja Principal - Repify */
    color: #fff !important;
}

body:not(.dark-mode) .skin-pukiebook .sidebar-menu > li:hover > a,
body:not(.dark-mode) .skin-pukiebook .sidebar-menu > li.treeview:hover > a,
body:not(.dark-mode) .skin-pukiebook .sidebar-menu .treeview-menu > li:hover > a {
    background: #F07A3D !important; /* Naranja Claro - Repify */
    background-color: #F07A3D !important; /* Naranja Claro - Repify */
    color: #fff !important;
}

/* Regla final con máxima especificidad para sobrescribir cualquier color rosa */
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu > li.active > a,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu > li.treeview.active > a,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu .treeview-menu > li.active > a {
    background: #E05410 !important; /* Naranja Principal - Repify */
    background-color: #E05410 !important; /* Naranja Principal - Repify */
    color: #fff !important;
}

/* Regla adicional para asegurar que el hover funcione en modo claro - máxima especificidad */
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu > li:not(.active):hover > a,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu > li.treeview:not(.active):hover > a,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu .treeview-menu > li:not(.active):hover > a,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu .treeview-menu > li:not(.active) > a:hover {
    background: #F07A3D !important; /* Naranja Claro - Repify */
    background-color: #F07A3D !important; /* Naranja Claro - Repify */
    color: #fff !important;
}

html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu > li:hover > a,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu > li:hover > a:hover,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu > li.treeview:hover > a,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu > li.treeview:hover > a:hover,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu .treeview-menu > li:hover > a,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu .treeview-menu > li > a:hover {
    background: #F07A3D !important; /* Naranja Claro - Repify */
    background-color: #F07A3D !important; /* Naranja Claro - Repify */
    color: #fff !important;
}

/* Sidebar menu - colores naranja Repify para modo oscuro */
.dark-mode.skin-pukiebook .sidebar-menu > li:hover > a {
    color: #fff !important;
    background: #F07A3D !important; /* Naranja Claro - Repify */
}

.dark-mode.skin-pukiebook .sidebar-menu > li.active > a {
    color: #fff !important;
    background: #E05410 !important; /* Naranja Principal - Repify */
}

.dark-mode.skin-pukiebook .sidebar-menu > li.active {
    border-left-color: #E05410 !important; /* Naranja Principal - Repify */
}

/* Reglas finales con máxima especificidad para sobrescribir cualquier color rosa en modo claro */
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu > li.active > a,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu > li.active > a:hover,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu > li.active > a:focus,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu > li.active > a:active,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu > li.treeview.active > a,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu > li.treeview.active > a:hover,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu > li.treeview.active > a:focus,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu .treeview-menu > li.active > a,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu .treeview-menu > li.active > a:hover,
html body:not(.dark-mode) .skin-pukiebook .main-sidebar .sidebar-menu .treeview-menu > li.active > a:focus {
    background: #E05410 !important; /* Naranja Principal - Repify */
    background-color: #E05410 !important; /* Naranja Principal - Repify */
    background-image: none !important;
    color: #fff !important;
}

/* Regla adicional para cualquier elemento con clase active en el sidebar */
body:not(.dark-mode) .skin-pukiebook .sidebar-menu li.active > a,
body:not(.dark-mode) .skin-pukiebook .sidebar-menu li.active > a * {
    background: #E05410 !important;
    background-color: #E05410 !important;
    background-image: none !important;
    color: #fff !important;
}

/* Botones - colores naranja corporativos Repify */
.btn-primary,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
    background-color: #E05410 !important; /* Naranja Principal - Repify */
    border-color: #E05410 !important; /* Naranja Principal - Repify */
    color: #fff !important;
}

.btn-primary:hover,
.btn-primary:active:hover,
.btn-primary.hover {
    background-color: #F07A3D !important; /* Naranja Claro - Repify */
    border-color: #F07A3D !important; /* Naranja Claro - Repify */
    color: #fff !important;
}

.btn-info,
.btn-info:focus,
.btn-info:active,
.btn-info.active {
    background-color: #E05410 !important; /* Naranja Principal - Repify */
    border-color: #E05410 !important; /* Naranja Principal - Repify */
    color: #fff !important;
}

.btn-info:hover,
.btn-info:active:hover,
.btn-info.hover {
    background-color: #F07A3D !important; /* Naranja Claro - Repify */
    border-color: #F07A3D !important; /* Naranja Claro - Repify */
    color: #fff !important;
}

/* Copyright footer - Color naranja corporativo para enlace Repify */
.copyright a {
    color: #E05410 !important; /* Naranja Principal - Repify */
}

.copyright a:hover {
    color: #F07A3D !important; /* Naranja Claro - Repify */
}