/* =========================================================
   EVENTOS PROSHOP - DEFAULT COLOR CSS
   Paleta: negro técnico / amarillo impacto / blanco
========================================================= */

:root {
  --proshop-black: #050505;
  --proshop-black-2: #0B0B0B;
  --proshop-dark: #111111;
  --proshop-card: #171717;
  --proshop-border: rgba(255, 204, 0, 0.32);
  --proshop-yellow: #FFCC00;
  --proshop-yellow-2: #F2B800;
  --proshop-yellow-dark: #C99500;
  --proshop-white: #FFFFFF;
  --proshop-text: #F4F4F4;
  --proshop-muted: rgba(255, 255, 255, 0.72);
}

body,
.sp-preloader {
  background-color: var(--proshop-black);
  color: var(--proshop-text);
}

/* PRELOADER */
.sp-preloader > div {
  background: var(--proshop-yellow);
}

.sp-preloader > div:after {
  background: var(--proshop-black);
}

/* TOP BAR */
#sp-top-bar {
  background: var(--proshop-black);
  color: var(--proshop-white);
  border-bottom: 1px solid rgba(255, 204, 0, 0.18);
}

#sp-top-bar a {
  color: var(--proshop-white);
}

#sp-top-bar a:hover {
  color: var(--proshop-yellow);
}

/* HEADER */
#sp-header {
  background: rgba(5, 5, 5, 0.96);
  color: var(--proshop-white);
  border-bottom: 1px solid rgba(255, 204, 0, 0.14);
  box-shadow: 0 10px 35px rgba(0, 0, 0, 0.38);
}

#sp-header.header-sticky {
  background: rgba(5, 5, 5, 0.98);
}

/* LINKS GENERALES */
a {
  color: var(--proshop-yellow);
}

a:hover,
a:focus,
a:active {
  color: var(--proshop-yellow-2);
}

/* SOCIAL ICONS */
#sp-menu ul.social-icons a,
ul.social-icons > li a {
  color: rgba(255, 255, 255, 0.82);
}

#sp-menu ul.social-icons a:hover,
#sp-menu ul.social-icons a:focus,
ul.social-icons > li a:hover {
  color: var(--proshop-yellow);
}

/* TAGS */
.tags > li {
  display: inline-block;
}

.tags > li a {
  background: rgba(255, 204, 0, 0.12);
  color: var(--proshop-yellow);
  border: 1px solid rgba(255, 204, 0, 0.24);
}

.tags > li a:hover {
  background: var(--proshop-yellow);
  color: var(--proshop-black);
}

/* ARTICLE SOCIAL SHARE */
.article-social-share .social-share-icon ul li a {
  color: var(--proshop-text);
}

.article-social-share .social-share-icon ul li a:hover,
.article-social-share .social-share-icon ul li a:focus {
  background: var(--proshop-yellow);
  color: var(--proshop-black);
}

/* PAGER */
.pager > li a {
  border: 1px solid rgba(255, 204, 0, 0.28);
  color: var(--proshop-text);
  background: rgba(255, 255, 255, 0.03);
}

.pager > li a:hover {
  border-color: var(--proshop-yellow);
  color: var(--proshop-yellow);
}

/* READING PROGRESS */
.sp-reading-progress-bar {
  background-color: var(--proshop-yellow);
}

/* MEGAMENU */
.sp-megamenu-parent > li > a {
  color: var(--proshop-white);
  font-weight: 600;
}

.sp-megamenu-parent > li:hover > a {
  color: var(--proshop-yellow);
}

.sp-megamenu-parent > li.active > a,
.sp-megamenu-parent > li.active:hover > a {
  color: var(--proshop-yellow);
}

.sp-megamenu-parent > li.active > a:after,
.sp-megamenu-parent > li:hover > a:after {
  background: var(--proshop-yellow);
}

/* DROPDOWN */
.sp-megamenu-parent .sp-dropdown .sp-dropdown-inner {
  background: var(--proshop-black-2);
  border: 1px solid rgba(255, 204, 0, 0.24);
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.45);
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a {
  color: rgba(255, 255, 255, 0.88);
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a:hover {
  color: var(--proshop-yellow);
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item.active > a {
  color: var(--proshop-yellow);
}

.sp-megamenu-parent .sp-mega-group > li > a {
  color: var(--proshop-white);
}

/* OFFCANVAS TOGGLER */
#offcanvas-toggler > .fa,
#offcanvas-toggler > .fas,
#offcanvas-toggler > .far {
  color: var(--proshop-white);
}

#offcanvas-toggler > .fa:hover,
#offcanvas-toggler > .fa:focus,
#offcanvas-toggler > .fa:active,
#offcanvas-toggler > .fas:hover,
#offcanvas-toggler > .fas:focus,
#offcanvas-toggler > .fas:active,
#offcanvas-toggler > .far:hover,
#offcanvas-toggler > .far:focus,
#offcanvas-toggler > .far:active {
  color: var(--proshop-yellow);
}

/* OFFCANVAS MENU */
.offcanvas-menu {
  background-color: var(--proshop-black-2);
  color: var(--proshop-text);
  border-left: 1px solid rgba(255, 204, 0, 0.18);
}

.offcanvas-menu .offcanvas-inner a {
  color: var(--proshop-text);
}

.offcanvas-menu .offcanvas-inner a:hover,
.offcanvas-menu .offcanvas-inner a:focus,
.offcanvas-menu .offcanvas-inner a:active {
  color: var(--proshop-yellow);
}

.offcanvas-menu .offcanvas-inner ul.menu > li a,
.offcanvas-menu .offcanvas-inner ul.menu > li span {
  color: var(--proshop-text);
}

.offcanvas-menu .offcanvas-inner ul.menu > li a:hover,
.offcanvas-menu .offcanvas-inner ul.menu > li a:focus,
.offcanvas-menu .offcanvas-inner ul.menu > li span:hover,
.offcanvas-menu .offcanvas-inner ul.menu > li span:focus {
  color: var(--proshop-yellow);
}

.offcanvas-menu .offcanvas-inner ul.menu > li.menu-parent > a > .menu-toggler,
.offcanvas-menu .offcanvas-inner ul.menu > li.menu-parent > .menu-separator > .menu-toggler,
.offcanvas-menu .offcanvas-inner ul.menu > li.menu-parent .menu-toggler {
  color: rgba(255, 255, 255, 0.58);
}

.offcanvas-menu .offcanvas-inner ul.menu > li li a {
  color: rgba(255, 255, 255, 0.76);
}

/* BOTONES */
.btn-primary,
.sppb-btn-primary {
  border-color: var(--proshop-yellow);
  background-color: var(--proshop-yellow);
  background-image: linear-gradient(180deg, #FFD84D 0%, var(--proshop-yellow) 48%, var(--proshop-yellow-2) 100%);
  color: var(--proshop-black) !important;
  font-weight: 800;
  box-shadow: 0 10px 28px rgba(255, 204, 0, 0.28);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.sppb-btn-primary:hover,
.sppb-btn-primary:focus,
.sppb-btn-primary:active {
  border-color: #FFE06A;
  background-color: #FFE06A;
  background-image: linear-gradient(180deg, #FFE06A 0%, var(--proshop-yellow) 100%);
  color: var(--proshop-black) !important;
  box-shadow: 0 12px 34px rgba(255, 204, 0, 0.38);
}

.btn-secondary,
.sppb-btn-secondary,
.sppb-btn-default {
  border-color: rgba(255, 204, 0, 0.75);
  background: rgba(5, 5, 5, 0.58);
  color: var(--proshop-white) !important;
}

.btn-secondary:hover,
.sppb-btn-secondary:hover,
.sppb-btn-default:hover {
  border-color: var(--proshop-yellow);
  background: rgba(255, 204, 0, 0.10);
  color: var(--proshop-yellow) !important;
}

/* PAGE TITLE */
.sp-page-title {
  background: linear-gradient(135deg, var(--proshop-black) 0%, var(--proshop-dark) 100%);
  border-bottom: 1px solid rgba(255, 204, 0, 0.22);
}

.sp-page-title .sp-page-title-heading,
.sp-page-title .sp-page-title-sub-heading,
.sp-page-title .breadcrumb > span,
.sp-page-title .breadcrumb > li,
.sp-page-title .breadcrumb > li + li:before,
.sp-page-title .breadcrumb > li > a {
  color: var(--proshop-white);
}

.sp-page-title .breadcrumb > li > a:hover {
  color: var(--proshop-yellow);
}

/* LAYOUT */
.layout-boxed .body-innerwrapper {
  background: var(--proshop-black);
}

.body-innerwrapper {
  background: var(--proshop-black);
}

/* MODULE LINKS */
.sp-module ul > li > a {
  color: var(--proshop-text);
}

.sp-module ul > li > a:hover {
  color: var(--proshop-yellow);
}

.sp-module .latestnews > div > a {
  color: var(--proshop-text);
}

.sp-module .latestnews > div > a:hover {
  color: var(--proshop-yellow);
}

.sp-module .tagscloud .tag-name:hover {
  background: var(--proshop-yellow);
  color: var(--proshop-black);
}

/* SEARCH */
.search .btn-toolbar button {
  background: var(--proshop-yellow);
  color: var(--proshop-black);
}

/* FORMS */
input,
textarea,
select,
.form-control,
.sppb-form-control {
  background-color: #111111;
  border-color: rgba(255, 255, 255, 0.18);
  color: var(--proshop-text);
}

input:focus,
textarea:focus,
select:focus,
.form-control:focus,
.sppb-form-control:focus {
  border-color: var(--proshop-yellow);
  box-shadow: 0 0 0 0.18rem rgba(255, 204, 0, 0.18);
}

input::placeholder,
textarea::placeholder {
  color: rgba(255, 255, 255, 0.52);
}

/* CARDS / BLOQUES */
.sppb-addon,
.sppb-addon-feature,
.sppb-addon-article,
.sppb-addon-person {
  color: var(--proshop-text);
}

.proshop-card,
.sppb-addon-feature {
  background: linear-gradient(180deg, rgba(255,255,255,0.055) 0%, rgba(255,255,255,0.025) 100%);
  border: 1px solid rgba(255, 255, 255, 0.14);
}

.proshop-card:hover,
.sppb-addon-feature:hover {
  border-color: rgba(255, 204, 0, 0.58);
}

/* FOOTER / BOTTOM */
#sp-footer,
#sp-bottom {
  background: #050505;
  color: rgba(255, 255, 255, 0.72);
  border-top: 1px solid rgba(255, 204, 0, 0.16);
}

#sp-footer a,
#sp-bottom a {
  color: rgba(255, 255, 255, 0.78);
}

#sp-footer a:hover,
#sp-footer a:active,
#sp-footer a:focus,
#sp-bottom a:hover,
#sp-bottom a:active,
#sp-bottom a:focus {
  color: var(--proshop-yellow);
}

#sp-bottom .sp-module-content .latestnews > li > a > span {
  color: var(--proshop-yellow);
}

/* COMING SOON */
.sp-comingsoon body {
  background-color: var(--proshop-black);
}

/* PAGINATION */
.pagination > li > a,
.pagination > li > span {
  color: var(--proshop-text);
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.12);
}

.pagination > li > a:hover,
.pagination > li > a:focus,
.pagination > li > span:hover,
.pagination > li > span:focus {
  color: var(--proshop-yellow);
  border-color: rgba(255, 204, 0, 0.42);
}

.pagination > .active > a,
.pagination > .active > span {
  border-color: var(--proshop-yellow);
  background-color: var(--proshop-yellow);
  color: var(--proshop-black);
}

.pagination > .active > a:hover,
.pagination > .active > a:focus,
.pagination > .active > span:hover,
.pagination > .active > span:focus {
  border-color: var(--proshop-yellow-2);
  background-color: var(--proshop-yellow-2);
  color: var(--proshop-black);
}

/* ERROR / COMING SOON NUMBERS */
.error-code,
.coming-soon-number {
  color: var(--proshop-yellow);
}
/* FIX SOLO ICONO DROPDOWN SERVICIOS */
#sp-header .sp-megamenu-parent > li.sp-has-child > a:after,
#sp-header .sp-megamenu-parent > li.sp-has-child > span:after {
  content: "" !important;
  display: inline-block !important;
  width: 7px !important;
  height: 7px !important;
  margin-left: 10px !important;
  vertical-align: middle !important;
  border: none !important;
  border-right: 2px solid currentColor !important;
  border-bottom: 2px solid currentColor !important;
  background: transparent !important;
  transform: rotate(45deg) translateY(-3px) !important;
  position: relative !important;
  top: 0 !important;
  font-family: initial !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

/* Color del ícono según estado */
#sp-header .sp-megamenu-parent > li.sp-has-child.active > a:after,
#sp-header .sp-megamenu-parent > li.sp-has-child:hover > a:after,
#sp-header .sp-megamenu-parent > li.sp-has-child.active > span:after,
#sp-header .sp-megamenu-parent > li.sp-has-child:hover > span:after {
  border-color: var(--proshop-yellow) !important;
}