/* =====================================================================
   ePickMeUp - 2026 golden yellow theme : HEADER + FOOTER (all pages)
   Loaded from templates/CJXv2/top/top_script.php on every website page.
   Home page body styling lives in home-gold-2026.css.
   ===================================================================== */
html body {
    --ep26-gold: #F6B800;
    --ep26-gold-2: #FFCB2E;
    --ep26-gold-deep: #D99500;
    --ep26-gold-ink: #7A5200;
    --ep26-cream: #FFF8E5;
    --ep26-cream-2: #FFF3CC;
    --ep26-ink: #17140C;
    --ep26-ink-2: #2A251A;
    --ep26-muted: #6B6458;
    --ep26-line: #EFE6CF;
    --ep26-font: "Plus Jakarta Sans", "Poppins", "Noto Sans", "Noto Sans KR", "Noto Sans SC", "Noto Sans Devanagari", "Segoe UI", Arial, sans-serif;
}
html body header.fixed *:not(.fa):not([class^="ti-"]):not([class*=" ti-"]),
html body #maine-footer *:not(.fa):not([class^="ti-"]):not([class*=" ti-"]) {
    font-family: var(--ep26-font) !important;
}

/* ---------- header ---------- */
html body header.fixed {
    background: #fff !important;
    border-bottom: 1px solid var(--ep26-line);
    box-shadow: none !important;
}
html body header.fixed.sticky {
    background: rgba(255, 255, 255, .97) !important;
    box-shadow: 0 10px 30px -18px rgba(40, 30, 0, .35) !important;
}
html body header.fixed .logo img,
html body header.fixed.sticky .logo img { filter: hue-rotate(-52deg) saturate(1.5) brightness(1.18) !important; opacity: 1 !important; }
/* white logo version (logo_top.png, swapped in by script on some screens) -> gold */
html body header.fixed .logo img[src*="logo_top"],
html body header.fixed.sticky .logo img[src*="logo_top"] { filter: brightness(0) saturate(100%) invert(62%) sepia(93%) saturate(1352%) hue-rotate(5deg) brightness(97%) contrast(101%) !important; }
html body header.fixed .navmenu-links li a,
html body header.fixed.sticky .navmenu-links li a {
    color: var(--ep26-ink-2) !important;
    font-weight: 600;
    font-size: 14px;
}
html body header.fixed .navmenu-links li a:hover { color: var(--ep26-gold-deep) !important; }
html body header.fixed .navmenu-links li a.active { color: var(--ep26-gold-deep) !important; }
html body header.fixed .header-left ul li a::after,
html body header.fixed.sticky .header-left ul li a::after { background-color: var(--ep26-gold) !important; }
html body header.fixed .navmenu-links .dropdown-content .column a,
html body header.fixed .header-right .dropdown-content .column a { color: var(--ep26-ink) !important; }
html body header.fixed .navmenu-links .dropdown-content .column a:hover,
html body header.fixed .header-right .dropdown-content .column a:hover,
html body header.fixed .header-right .dropdown-content .column a.active { color: var(--ep26-gold-deep) !important; }
html body header.fixed .dropdown-content h3 span { color: var(--ep26-ink); }
/* language selector (all active languages from admin) */
html body header.fixed .header-right ul li.lang > a,
html body header.fixed.sticky .header-right ul li.lang > a {
    color: var(--ep26-ink) !important;
    border: 1px solid var(--ep26-line);
    border-radius: 999px;
    padding: 6px 14px !important;
    font-weight: 700;
    font-size: 13px;
    background: var(--ep26-cream);
    height: auto !important;
    line-height: 1.4 !important;
}
html body header.fixed .header-right ul li.lang > a img,
html body header.fixed.sticky .header-right ul li.lang > a img { filter: brightness(0) !important; width: 16px; margin-right: 6px; }
/* login / register buttons */
html body header.fixed .header-right ul li.login a,
html body header.fixed.sticky .header-right ul li.login a {
    border: 2px solid var(--ep26-ink) !important;
    background: transparent !important;
    color: var(--ep26-ink) !important;
    border-radius: 999px !important;
    padding: 8px 20px !important;
    font-weight: 700;
    font-size: 14px;
}
html body header.fixed .header-right ul li.login + li.login a,
html body header.fixed .header-right ul li.login a:hover {
    background: var(--ep26-gold) !important;
    border-color: var(--ep26-gold) !important;
    color: var(--ep26-ink) !important;
    box-shadow: 0 10px 22px -12px rgba(217, 149, 0, .8);
}
html body header.fixed .header-right ul li.login a img { display: none; }
html body header.fixed .menu-ico span,
html body header.fixed .menu-ico i,
html body header.fixed .menu-icoholder-side .menu-ico span { background-color: var(--ep26-ink) !important; }


/* ---------- footer ---------- */
html body #maine-footer { background: #100E08 !important; color: #BDB4A0; }
html body #maine-footer .footer-top { background: transparent !important; padding-top: 70px; }
html body #maine-footer h4 { color: #fff !important; font-weight: 700; font-size: 15px; }
html body #maine-footer a,
html body #maine-footer address,
html body #maine-footer li { color: #BDB4A0 !important; }
html body #maine-footer a:hover,
html body #maine-footer a.active { color: var(--ep26-gold) !important; }
html body #maine-footer .contact-data i { color: var(--ep26-gold) !important; }
html body #maine-footer .contact-data i img { filter: brightness(0) saturate(100%) invert(72%) sepia(68%) saturate(1000%) hue-rotate(2deg) brightness(101%); }
html body #maine-footer .social-media-list li a {
    border: 1px solid #3A3323 !important;
    background: transparent !important;
    color: var(--ep26-gold) !important;
    border-radius: 50%;
}
html body #maine-footer .social-media-list li a i { color: var(--ep26-gold) !important; }
html body #maine-footer .social-media-list li a:hover { background: var(--ep26-gold) !important; }
html body #maine-footer .social-media-list li a:hover i { color: var(--ep26-ink) !important; }
html body #maine-footer .footer-bottom { background: transparent !important; border-top: 1px solid #2A251A; color: #8E8676; }
html body #maine-footer .footer-bottom span { color: #8E8676 !important; }
html body #maine-footer .gotop { background: var(--ep26-gold) !important; }

/* ---------- newsletter popup buttons ---------- */
html body #newsletter .gen-btn { background: var(--ep26-gold); color: var(--ep26-ink); border-color: var(--ep26-gold); }

@media (max-width: 767px) {
    html body header.fixed .header-right ul li.login + li.login { display: none !important; }
    html body header.fixed .header-right ul li { padding: 0 4px; }
    html body header.fixed .header-right ul li.login a,
    html body header.fixed.sticky .header-right ul li.login a { padding: 6px 14px !important; font-size: 13px; border-width: 2px !important; background: var(--ep26-gold) !important; border-color: var(--ep26-gold) !important; }
    html body header.fixed .header-right ul li.lang > a { padding: 5px 10px !important; }
}