/* =========================================================
   LONAS LITORAL - DEFAULT COLOR CSS
   Paleta: rojo institucional / negro técnico / blanco limpio
   Joomla / Helix / SP Page Builder
========================================================= */

:root {
  --ll-red: #e30613;
  --ll-red-dark: #b9000a;
  --ll-red-soft: #fff1f2;
  --ll-black: #171717;
  --ll-dark: #202020;
  --ll-text: #252525;
  --ll-muted: #666666;
  --ll-border: #e9e9e9;
  --ll-bg: #ffffff;
  --ll-bg-soft: #f7f7f7;
  --ll-radius: 10px;
  --ll-shadow: 0 10px 28px rgba(0, 0, 0, 0.08);
}

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

body,
.sppb-addon,
.sppb-addon-content,
.sp-page-builder {
  font-family: "Montserrat", Arial, sans-serif;
}

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

.sp-preloader > div:after {
  background: #ffffff;
}

/* TOP BAR */
#sp-top-bar {
  background: var(--ll-red);
  color: #ffffff;
}

#sp-top-bar a {
  color: #ffffff;
}

#sp-top-bar a:hover {
  color: #ffffff;
  opacity: 0.85;
}

/* HEADER */
#sp-header {
  background: #ffffff;
}

/* LINKS GENERALES */
a {
  color: var(--ll-red);
}

a:hover,
a:focus,
a:active {
  color: var(--ll-red-dark);
}

/* SOCIAL ICONS */
#sp-menu ul.social-icons a:hover,
#sp-menu ul.social-icons a:focus,
ul.social-icons > li a:hover {
  color: var(--ll-red);
}

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

.tags > li a {
  background: rgba(227, 6, 19, 0.10);
  color: var(--ll-red-dark);
  border-radius: 999px;
}

.tags > li a:hover {
  background: var(--ll-red);
  color: #ffffff;
}

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

.article-social-share .social-share-icon ul li a:hover,
.article-social-share .social-share-icon ul li a:focus {
  background: var(--ll-red);
  color: #ffffff;
}

/* PAGER */
.pager > li a {
  border: 1px solid rgba(227, 6, 19, 0.20);
  color: var(--ll-text);
}

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

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

/* MEGAMENU */
.sp-megamenu-parent > li > a {
  color: #111111;
}

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

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

/* DROPDOWN */
.sp-megamenu-parent .sp-dropdown .sp-dropdown-inner {
  background: #ffffff;
  border: 1px solid var(--ll-border);
  box-shadow: var(--ll-shadow);
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a {
  color: #161616;
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a:hover,
.sp-megamenu-parent .sp-dropdown li.sp-menu-item.active > a {
  color: var(--ll-red);
}

.sp-megamenu-parent .sp-mega-group > li > a {
  color: #161616;
}

/* OFFCANVAS TOGGLER */
#offcanvas-toggler > .fa,
#offcanvas-toggler > .fas,
#offcanvas-toggler > .far {
  color: #161616;
}

#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(--ll-red);
}

/* OFFCANVAS MENU */
.offcanvas-menu {
  background-color: #ffffff;
  color: #161616;
}

.offcanvas-menu .offcanvas-inner a,
.offcanvas-menu .offcanvas-inner ul.menu > li a,
.offcanvas-menu .offcanvas-inner ul.menu > li span {
  color: #161616;
}

.offcanvas-menu .offcanvas-inner a:hover,
.offcanvas-menu .offcanvas-inner a:focus,
.offcanvas-menu .offcanvas-inner a:active,
.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(--ll-red);
}

.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(22, 22, 22, 0.55);
}

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

/* BOTONES */
.btn-primary,
.sppb-btn-primary,
.sppb-btn-success,
.ll-btn-red {
  border: 0 !important;
  background-color: var(--ll-red) !important;
  background-image: linear-gradient(180deg, #ff1a24 0%, var(--ll-red) 100%) !important;
  color: #ffffff !important;
  border-radius: 8px !important;
  box-shadow: 0 10px 22px rgba(227, 6, 19, 0.22) !important;
  font-weight: 800 !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.sppb-btn-primary:hover,
.sppb-btn-primary:focus,
.sppb-btn-primary:active,
.sppb-btn-success:hover,
.sppb-btn-success:focus,
.sppb-btn-success:active,
.ll-btn-red:hover {
  background-color: var(--ll-red-dark) !important;
  background-image: linear-gradient(180deg, #e30613 0%, var(--ll-red-dark) 100%) !important;
  color: #ffffff !important;
  transform: translateY(-1px);
}

.sppb-btn-secondary,
.ll-btn-dark {
  background: var(--ll-black) !important;
  border-color: var(--ll-black) !important;
  color: #ffffff !important;
  border-radius: 8px !important;
  font-weight: 800 !important;
}

.sppb-btn-outline,
.ll-btn-outline {
  background: #ffffff !important;
  border: 2px solid var(--ll-red) !important;
  color: var(--ll-red) !important;
  border-radius: 8px !important;
  font-weight: 800 !important;
}

.sppb-btn-outline:hover,
.ll-btn-outline:hover {
  background: var(--ll-red) !important;
  color: #ffffff !important;
}

/* PAGE TITLE */
.sp-page-title {
  background: var(--ll-red);
}

.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: #ffffff;
}

/* LAYOUT */
.layout-boxed .body-innerwrapper {
  background: #ffffff;
}

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

.sp-module ul > li > a:hover,
.sp-module .latestnews > div > a:hover {
  color: var(--ll-red);
}

.sp-module .tagscloud .tag-name:hover {
  background: var(--ll-red);
}

/* SEARCH */
.search .btn-toolbar button {
  background: var(--ll-red);
  color: #ffffff;
}

/* FOOTER / BOTTOM */
#sp-footer,
#sp-bottom {
  background: radial-gradient(circle at top left, #2a2a2a 0%, #171717 42%, #0e0e0e 100%);
  color: rgba(255, 255, 255, 0.72);
}

#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: #ffffff;
}

#sp-bottom .sp-module-title,
#sp-bottom h3,
#sp-footer .sp-module-title,
#sp-footer h3 {
  color: #ffffff;
  font-weight: 800;
}

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

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

/* PAGINATION */
.pagination > li > a,
.pagination > li > span {
  color: var(--ll-text);
}

.pagination > li > a:hover,
.pagination > li > a:focus,
.pagination > li > span:hover,
.pagination > li > span:focus {
  color: var(--ll-red);
}

.pagination > .active > a,
.pagination > .active > span {
  border-color: var(--ll-red);
  background-color: var(--ll-red);
  color: #ffffff;
}

.pagination > .active > a:hover,
.pagination > .active > a:focus,
.pagination > .active > span:hover,
.pagination > .active > span:focus {
  border-color: var(--ll-red-dark);
  background-color: var(--ll-red-dark);
  color: #ffffff;
}

/* ERROR / COMING SOON NUMBERS */
.error-code,
.coming-soon-number {
  color: var(--ll-red);
}
