/* Tú servicio - Red Brand Color (Minimal Override) */
/* Only change buttons and key brand elements - preserve all text visibility */

/* DISABLE PRELOADER */
.preloader {
    display: none !important;
}

/* BREADCRUMB BACKGROUND IMAGE */
.breadcumb-area {
    background: url(../images/hero/bg-img-3.jpg) !important;
    background-position: center !important;
    background-size: cover !important;
}

/* BUTTONS ONLY - Red background with white text */
.theme-btn,
.theme-btn-s2,
.theme-btn-s3,
.theme-btn-s4 {
    background-color: #dc143c !important;
    border-color: #dc143c !important;
    color: #ffffff !important;
}

.theme-btn:hover,
.theme-btn-s2:hover,
.theme-btn-s3:hover,
.theme-btn-s4:hover {
    background-color: #a8102e !important;
    border-color: #a8102e !important;
    color: #ffffff !important;
}

/* ALL elements inside buttons should be white */
.theme-btn *,
.theme-btn-s2 *,
.theme-btn-s3 *,
.theme-btn-s4 *,
.theme-btn span,
.theme-btn-s2 span,
.theme-btn-s3 span,
.theme-btn-s4 span,
.theme-btn i,
.theme-btn-s2 i,
.theme-btn-s3 i,
.theme-btn-s4 i,
.rolling-text {
    color: #ffffff !important;
}

/* SVG icons inside buttons should be white with black borders for visibility */
.theme-btn svg,
.theme-btn-s2 svg,
.theme-btn-s3 svg,
.theme-btn-s4 svg {
    fill: #ffffff !important;
}

.theme-btn svg path,
.theme-btn-s2 svg path,
.theme-btn-s3 svg path,
.theme-btn-s4 svg path {
    fill: #ffffff !important;
    stroke: #000000 !important;
    stroke-width: 1.5 !important;
}

/* Header phone icon */
.header-contact-icon a {
    background-color: #dc143c !important;
    color: #ffffff !important;
}

/* Language switcher active state */
.language-switcher button.active {
    background-color: #dc143c !important;
    border-color: #dc143c !important;
    color: #ffffff !important;
}

/* Form focus states */
.form-control:focus {
    border-color: #dc143c !important;
}

/* Accordion active state */
.accordion-button:not(.collapsed) {
    background-color: #dc143c !important;
    color: #ffffff !important;
}

/* Swiper navigation */
.swiper-pagination-bullet-active {
    background-color: #dc143c !important;
}

/* Service boxes with red background */
.service-items.red-bg {
    background-color: #dc143c !important;
}

/* BACK TO TOP BUTTON - Red background with white border */
.back-to-top {
    background-color: #dc143c !important;
    border-color: #ffffff !important;
}

.back-to-top:hover {
    background-color: #a8102e !important;
    border-color: #ffffff !important;
}

.back-to-top i {
    color: #ffffff !important;
}

/* MOBILE MENU TOGGLE BUTTON - Red background with white lines */
.navbar-toggler {
    background-color: #dc143c !important;
    border-color: #dc143c !important;
}

.navbar-toggler:hover {
    background-color: #a8102e !important;
    border-color: #a8102e !important;
}

/* White hamburger lines */
.navbar-toggler span {
    background-color: #ffffff !important;
}

.wpo-site-header .navbar-toggler .first-angle,
.wpo-site-header .navbar-toggler .middle-angle,
.wpo-site-header .navbar-toggler .last-angle {
    background-color: #ffffff !important;
}

.service-items.red-bg .service-text h3,
.service-items.red-bg .service-text h3 a,
.service-items.red-bg .service-text p,
.service-items.red-bg .service-bottom .text a,
.service-items.red-bg .service-bottom .text span {
    color: #ffffff !important;
}

.service-items.red-bg .service-bottom .icon svg path {
    stroke: #ffffff !important;
}

/* Service boxes without red background - add red border */
.service-items:not(.red-bg) {
    border: 2px solid #dc143c !important;
}

/* Service boxes without red background - red "Explore More" text and red email icon */
.service-items:not(.red-bg) .service-bottom .text a,
.service-items:not(.red-bg) .service-bottom .text span {
    color: #dc143c !important;
}

.service-items:not(.red-bg) .service-bottom .icon svg path {
    stroke: #dc143c !important;
}

/* Why Choose section - red background boxes */
.wpo-choose-right-items.red-bg {
    background-color: #dc143c !important;
}

.wpo-choose-right-items.red-bg .wpo-choose-right-content h3,
.wpo-choose-right-items.red-bg .wpo-choose-right-content p {
    color: #ffffff !important;
}

/* DO NOT override any other text colors - let original CSS handle all text */
/* DO NOT override any background colors - let original CSS handle sections */
/* This ensures all text remains visible */
/* Footer customization */
.wpo-site-footer .widget-title h3 {
    color: #dc143c !important;
}

.wpo-site-footer .widget.link-widget ul li a {
    transition: color 0.3s ease;
}

.wpo-site-footer .widget.link-widget ul li a:hover {
    color: #dc143c !important;
    padding-left: 5px;
}

.wpo-site-footer .widget.link-widget ul li i {
    color: #dc143c !important;
    margin-right: 8px;
}

.wpo-site-footer .wpo-top-footer h3 span {
    color: #dc143c !important;
}

.wpo-site-footer .newsletter-widget .theme-btn {
    background-color: #dc143c !important;
}

.wpo-site-footer .newsletter-widget .theme-btn:hover {
    background-color: #a8102e !important;
}

.wpo-site-footer .links li a {
    transition: all 0.3s ease;
}

.wpo-site-footer .links li a:hover {
    background-color: #dc143c !important;
    color: #ffffff !important;
    transform: translateY(-3px);
}

.wpo-site-footer .copyright span {
    color: #dc143c !important;
    font-weight: 600;
}

/* MARQUEE SECTION STYLING */
/* Middle box - permanent red background */
.marquee-item.middle-red {
    background-color: #dc143c !important;
    color: #ffffff !important;
    padding: 10px 20px;
    border-radius: 5px;
    transition: all 0.3s ease;
}

.marquee-item.middle-red img {
    filter: brightness(0) invert(1);
}

/* Other marquee items - hover effect */
.marquee-item {
    padding: 10px 20px;
    border-radius: 5px;
    transition: all 0.3s ease;
    cursor: pointer;
}

.marquee-item:not(.middle-red):hover {
    background-color: #dc143c !important;
    color: #ffffff !important;
}

.marquee-item:not(.middle-red):hover img {
    filter: brightness(0) invert(1);
}

/* CONTACT PAGE INFO BOXES */
/* Middle box (Phone) - permanent red background */
.office-info-item.active {
    background-color: #dc143c !important;
    border-color: #dc143c !important;
}

.office-info-item.active .office-info-text h2,
.office-info-item.active .office-info-text p {
    color: #ffffff !important;
}

.office-info-item.active .office-info-icon .icon i {
    color: #ffffff !important;
}

/* Other info boxes - hover effect */
.office-info-item {
    transition: all 0.3s ease;
}

.office-info-item:not(.active):hover {
    background-color: #dc143c !important;
    border-color: #dc143c !important;
}

.office-info-item:not(.active):hover .office-info-text h2,
.office-info-item:not(.active):hover .office-info-text p {
    color: #ffffff !important;
}

.office-info-item:not(.active):hover .office-info-icon .icon i {
    color: #ffffff !important;
}