/*
 * IFEX3000 Theme Override CSS
 * PDF Requirement: Colors of old IFEX homepage (except yellow).
 * Red and blue are important (exact tones from reference site).
 *
 * Primary Red:    #F0181F (buttons, CTAs, accents)
 * Primary Blue:   #00486D (header, footer, dark sections)
 * Dark Blue:      #003854 (hover states, deeper sections)
 * Light Blue:     #00B6F1 (links, secondary accents)
 * Light Gray BG:  #ECEDF1 (section backgrounds)
 * NO YELLOW (#FAC012 is explicitly excluded per PDF)
 */

:root {
    --ifex-red: #F0181F;
    --ifex-blue: #00486D;
    --ifex-blue-dark: #003854;
    --ifex-blue-light: #00B6F1;
    --ifex-gray-bg: #ECEDF1;
    --ifex-white: #FFFFFF;
    --ifex-black: #000000;
    --ifex-text: #333333;
}

/* ===== BUTTONS ===== */
.btn-primary,
.btn-ifex,
a.btn-primary,
.cta-button {
    background-color: var(--ifex-red) !important;
    border-color: var(--ifex-red) !important;
    color: var(--ifex-white) !important;
}

.btn-primary:hover,
.btn-ifex:hover,
a.btn-primary:hover,
.cta-button:hover {
    background-color: #d01419 !important;
    border-color: #d01419 !important;
}

.btn-secondary,
a.btn-secondary {
    background-color: var(--ifex-blue) !important;
    border-color: var(--ifex-blue) !important;
    color: var(--ifex-white) !important;
}

.btn-secondary:hover,
a.btn-secondary:hover {
    background-color: var(--ifex-blue-dark) !important;
    border-color: var(--ifex-blue-dark) !important;
}

/* ===== HEADER ===== */
.top-bar,
.header-top {
    background-color: var(--ifex-blue) !important;
}

.header-bottom,
.main-nav {
    background-color: var(--ifex-white);
}

/* ===== FOOTER ===== */
.footer,
footer,
.site-footer {
    background-color: var(--ifex-blue) !important;
    color: var(--ifex-white);
}

.footer-bottom {
    background-color: var(--ifex-blue-dark) !important;
}

/* ===== LINKS ===== */
a {
    color: var(--ifex-blue);
}

a:hover {
    color: var(--ifex-red);
}

/* ===== HERO SECTION ===== */
.hero-content .hero-btn,
.hero-btn {
    background-color: var(--ifex-red) !important;
    color: var(--ifex-white) !important;
    border: none;
}

.hero-content .hero-btn:hover,
.hero-btn:hover {
    background-color: #d01419 !important;
}

/* ===== SECTION ACCENTS ===== */
.section-title::after,
.underline-accent {
    background-color: var(--ifex-red);
}

.section-dark,
.dark-section {
    background-color: var(--ifex-blue);
    color: var(--ifex-white);
}

/* ===== AWARDS / CAROUSEL ===== */
.awards-section {
    background-color: var(--ifex-blue-dark);
}

/* ===== CUSTOMER LOGOS ===== */
.customer-logos-section {
    background-color: var(--ifex-gray-bg);
    padding: 40px 0;
}

.customer-logos-section .slick-slide img {
    max-height: 60px;
    width: auto;
    margin: 0 auto;
    filter: grayscale(100%);
    opacity: 0.7;
    transition: all 0.3s ease;
}

.customer-logos-section .slick-slide img:hover {
    filter: grayscale(0%);
    opacity: 1;
}

/* ===== PRODUCT TABS ===== */
.product-tabs .tab-active,
.product-tabs [data-tab].active {
    border-bottom-color: var(--ifex-red);
    color: var(--ifex-red);
}

/* ===== DOWNLOADS CAROUSEL ===== */
.download-card {
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 20px;
    text-align: center;
    transition: box-shadow 0.3s ease;
}

.download-card:hover {
    box-shadow: 0 4px 15px rgba(0, 72, 109, 0.15);
}

.download-card .download-icon {
    color: var(--ifex-red);
    font-size: 2rem;
    margin-bottom: 10px;
}

/* ===== SERVICES ===== */
.service-card {
    border-left: 4px solid var(--ifex-red);
}

/* ===== TECHNOLOGY SECTIONS ===== */
#tech-description,
#tech-animation {
    padding: 40px 0;
}

#tech-animation {
    background-color: var(--ifex-gray-bg);
}

/* ===== REMOVE ANY YELLOW OVERRIDES ===== */
/* Ensure no yellow (#FAC012) leaks through from any template */
