/* Red Leaf Liquidation - Canadian Red & White Theme */

:root {
    --canadian-red: #D80621;
    --canadian-red-dark: #a80018;
    --canadian-red-light: rgba(216, 6, 33, 0.1);
}

/* ============================================
   HEADER & NAVIGATION
   ============================================ */

/* Add a red top stripe to the header */
header.shadow-gray,
header.shadow-sm {
    border-top: 4px solid var(--canadian-red) !important;
}

/* Override navy blue backgrounds to Canadian red */
.bg-navyBlue,
[class*="bg-\[#060C3B\]"] {
    background-color: var(--canadian-red) !important;
}

.text-navyBlue,
[class*="text-\[#060C3B\]"] {
    color: var(--canadian-red) !important;
}

.border-navyBlue,
[class*="border-\[#060C3B\]"] {
    border-color: var(--canadian-red) !important;
}

/* ============================================
   PRIMARY BUTTONS - Canadian Red
   ============================================ */
.primary-button {
    background-color: var(--canadian-red) !important;
    border-color: var(--canadian-red) !important;
    color: #ffffff !important;
}

.primary-button:hover {
    background-color: var(--canadian-red-dark) !important;
    opacity: 1 !important;
}

/* Secondary button */
.secondary-button {
    color: var(--canadian-red) !important;
    border-color: var(--canadian-red) !important;
}

.secondary-button:hover {
    background-color: var(--canadian-red-light) !important;
}

/* ============================================
   LINKS & ACCENTS
   ============================================ */
a:not([class*="text-"]):not([class*="bg-"]) {
    color: inherit;
}

/* Active/focused states */
::selection {
    background-color: rgba(216, 6, 33, 0.2) !important;
}

input:focus,
textarea:focus,
select:focus {
    outline-color: var(--canadian-red) !important;
    border-color: var(--canadian-red) !important;
    box-shadow: 0 0 0 2px rgba(216, 6, 33, 0.15) !important;
}

/* ============================================
   PRICE & BADGES
   ============================================ */
.text-darkPink,
[class*="text-\[#F85156\]"] {
    color: var(--canadian-red) !important;
}

/* Sale/discount badges */
[class*="bg-darkPink"],
.bg-darkPink {
    background-color: var(--canadian-red) !important;
}

/* ============================================
   STORE BRANDING - Header Logo Area
   ============================================ */
/* Red banner at top of page for branding */
body::before {
    content: '';
    display: block;
    width: 100%;
    height: 0;
}

/* Site title display in header */
.store-name-display {
    color: var(--canadian-red) !important;
    font-weight: 700 !important;
}

/* ============================================
   CHECKOUT & CART
   ============================================ */
/* Progress indicators */
[class*="text-blue"],
[class*="bg-blue"] {
    /* Keep as-is for accessibility */
}

/* Checkout button override */
button[type="submit"].primary-button,
.checkout-btn {
    background-color: var(--canadian-red) !important;
    border-color: var(--canadian-red) !important;
}

/* ============================================
   MOBILE NAV 
   ============================================ */
.mobile-nav-bg,
[class*="bg-navyBlue"] {
    background-color: var(--canadian-red) !important;
}

/* ============================================
   CATEGORY PILLS & FILTERS
   ============================================ */
input[type="checkbox"]:checked,
input[type="radio"]:checked {
    accent-color: var(--canadian-red) !important;
}

/* ============================================
   FOOTER
   ============================================ */
footer [class*="bg-navyBlue"],
footer.bg-navyBlue {
    background-color: var(--canadian-red) !important;
}

/* ============================================
   STORE HEADER LOGO CUSTOM
   ============================================ */
.store-logo-text {
    font-size: 1.5rem !important;
    font-weight: 800 !important;
    color: var(--canadian-red) !important;
    letter-spacing: -0.02em !important;
}

/* Red leaf logo emoji positioning */
.store-logo-container {
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
}


/* ================================================
   RED LEAF LIQUIDATION — HOMEPAGE COMPONENTS
   ================================================ */

/* Hero slider */
.rl-hero { position:relative;width:100%;overflow:hidden;line-height:0;background:#C30019;min-height:200px; }
.rl-hero-placeholder { height:480px;background:#C30019; }
.rl-track { display:flex;transition:transform 0.65s cubic-bezier(0.4,0,0.2,1); }
.rl-slide { min-width:100%;flex-shrink:0; }
.rl-slide-img { display:block;width:100%;height:auto;max-height:480px;object-fit:cover; }

.rl-nav {
    position:absolute;top:50%;transform:translateY(-50%);
    background:rgba(0,0,0,0.28);border:none;color:#fff;
    font-size:1.9rem;width:50px;height:50px;border-radius:50%;
    cursor:pointer;display:flex;align-items:center;justify-content:center;
    transition:background 0.2s;z-index:10;padding:0;line-height:1;
}
.rl-nav:hover { background:rgba(0,0,0,0.5); }
.rl-nav-l { left:16px; }
.rl-nav-r { right:16px; }
.rl-dots { position:absolute;bottom:14px;left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:10; }
.rl-dot { width:10px;height:10px;border-radius:50%;border:2px solid rgba(255,255,255,0.65);background:transparent;cursor:pointer;padding:0;transition:all 0.2s; }
.rl-dot.on { background:#fff;border-color:#fff;transform:scale(1.25); }

/* Category chips */
.rl-cats-section { background:#fff;border-bottom:1px solid #ededed;padding:22px 0 18px; }
.rl-cats-placeholder { height:108px;background:#fff; }
.rl-cats-inner-wrap { padding:0 28px; }
.rl-cats-heading { font-size:15px;font-weight:700;color:#111;margin:0 0 14px;letter-spacing:0.3px; }
.rl-cats-row { display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none; }
.rl-cats-row::-webkit-scrollbar { display:none; }
.rl-cat-chip { display:flex;flex-direction:column;align-items:center;gap:6px;text-decoration:none;min-width:72px;flex-shrink:0; }
.rl-cat-circle {
    width:52px;height:52px;border-radius:50%;
    background:#fdeaea;color:#D80621;
    display:flex;align-items:center;justify-content:center;
    font-size:1.15rem;font-weight:800;
    border:2px solid transparent;transition:all 0.2s;
}
.rl-cat-chip:hover .rl-cat-circle { background:#D80621;color:#fff; }
.rl-cat-name { font-size:10.5px;color:#444;text-align:center;max-width:72px;line-height:1.3;font-weight:500; }

/* Products section */
.rl-products-section { background:#f3f3f3;padding:0 20px 72px; }
.rl-products-placeholder { height:260px;background:#f3f3f3; }
.rl-products-header { padding:28px 0 20px;display:flex;flex-direction:column;gap:14px; }
.rl-section-title { font-size:1.75rem;font-weight:800;color:#111;margin:0;letter-spacing:-0.5px; }
.rl-filter-bar { display:flex;gap:8px;flex-wrap:wrap; }
.rl-filter-btn { padding:6px 18px;border-radius:20px;border:1.5px solid #d4d4d4;background:#fff;color:#555;font-size:13px;cursor:pointer;white-space:nowrap;transition:all 0.18s; }
.rl-filter-btn:hover,.rl-filter-btn.active { background:#D80621;border-color:#D80621;color:#fff; }

/* Grid */
/* Grid — auto-fill so last row items stay same width as others */
.rl-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px; }
@media(max-width:720px){.rl-grid{gap:12px;}}

/* Product card */
.rl-card { background:#fff;border-radius:14px;overflow:hidden;display:flex;flex-direction:column;text-decoration:none;border:1px solid #e6e6e6;transition:transform 0.2s,box-shadow 0.2s; }
.rl-card:hover { transform:translateY(-5px);box-shadow:0 16px 40px rgba(0,0,0,0.10); }
.rl-card-media { position:relative;aspect-ratio:1;background:#f7f7f7;overflow:hidden;flex-shrink:0; }
.rl-card-img { width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.3s; }
.rl-card:hover .rl-card-img { transform:scale(1.04); }
.rl-card-noimg { width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#fdeaea;font-size:3rem;font-weight:800;color:#D80621; }
.rl-badge { position:absolute;top:10px;left:10px;background:#D80621;color:#fff;font-size:10px;font-weight:800;padding:3px 9px;border-radius:4px;letter-spacing:0.8px; }
.rl-badge-deal { background:#222; }
.rl-card-body { padding:13px 15px 15px;display:flex;flex-direction:column;gap:7px;flex:1; }
.rl-card-title { font-size:13.5px;font-weight:600;color:#111;margin:0;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden; }
.rl-card-price { font-size:19px;font-weight:800;color:#D80621;margin:0; }
.rl-card-cta { margin-top:auto;width:100%;padding:9px 0;background:#D80621;color:#fff;border:none;border-radius:8px;font-size:13px;font-weight:700;cursor:pointer;transition:background 0.18s; }
.rl-card-cta:hover { background:#a80018; }

/* Skeleton */
.rl-card-skeleton { border-radius:14px;background:linear-gradient(90deg,#eaeaea 25%,#ddd 50%,#eaeaea 75%);background-size:200% 100%;animation:rl-shimmer 1.5s infinite;aspect-ratio:0.82; }
@keyframes rl-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* Load more */
.rl-loadmore { text-align:center;padding:44px 0 8px; }
.rl-loadmore-btn { padding:14px 52px;background:#fff;border:2px solid #D80621;color:#D80621;border-radius:30px;font-size:15px;font-weight:700;cursor:pointer;transition:all 0.2s; }
.rl-loadmore-btn:hover:not(:disabled) { background:#D80621;color:#fff; }
.rl-loadmore-btn:disabled { opacity:0.55;cursor:default; }
.rl-empty { text-align:center;padding:80px 0;color:#999;font-size:16px; }

/* Header logo override */
.logo img,[class*="logo"] img,.logo-area img { content:url('/images/rl-logo.svg') !important;max-height:52px;width:auto !important; }
/* Auth pages (sign-in / sign-up) */
.rl-auth-banner { width:100%;overflow:hidden;line-height:0;max-height:220px; }
.rl-auth-banner-img { width:100%;height:220px;object-fit:cover;object-position:left center;display:block; }
@media(max-width:720px){ .rl-auth-banner-img { height:140px; } }

/* ================================================
   RED LEAF LIQUIDATION — FOOTER
   ================================================ */
.rl-footer { background:#0f0f0f;color:#c8c8c8;font-size:14px; }

/* Newsletter bar */
.rl-footer-nl { background:#D80621;padding:28px 60px; }
.rl-footer-nl-inner { max-width:1400px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap; }
.rl-footer-nl-text { display:flex;flex-direction:column;gap:4px; }
.rl-footer-nl-title { font-size:18px;font-weight:800;color:#fff;letter-spacing:-0.3px; }
.rl-footer-nl-sub { font-size:13px;color:rgba(255,255,255,0.80); }
.rl-footer-nl-form { display:flex;gap:0;flex-shrink:0;border-radius:8px;overflow:hidden; }
.rl-footer-nl-input { padding:12px 18px;border:none;outline:none;font-size:14px;width:280px;background:#fff;color:#111; }
.rl-footer-nl-btn { padding:12px 24px;background:#1a1a1a;color:#fff;border:none;font-size:14px;font-weight:700;cursor:pointer;white-space:nowrap;transition:background 0.2s; }
.rl-footer-nl-btn:hover { background:#333; }
@media(max-width:860px){
    .rl-footer-nl { padding:22px 24px; }
    .rl-footer-nl-inner { flex-direction:column;align-items:flex-start; }
    .rl-footer-nl-form { width:100%; }
    .rl-footer-nl-input { flex:1;width:auto; }
}

/* Body grid */
.rl-footer-body {
    max-width:1400px;margin:0 auto;
    display:grid;
    grid-template-columns:1.8fr 1fr 1fr 1fr;
    gap:48px;
    padding:52px 60px 48px;
}
@media(max-width:1100px){ .rl-footer-body{ grid-template-columns:1fr 1fr;gap:36px;padding:40px 32px; } }
@media(max-width:600px) { .rl-footer-body{ grid-template-columns:1fr;gap:28px;padding:32px 20px; } }

/* Brand col */
.rl-footer-logo-link { display:inline-block;margin-bottom:18px; }
.rl-footer-logo { height:52px;width:auto;filter:brightness(0) invert(1); }
.rl-footer-brand-desc { font-size:13.5px;color:#999;line-height:1.65;max-width:290px;margin-bottom:20px; }

.rl-footer-trust-badges { display:flex;flex-direction:column;gap:10px;margin-bottom:22px; }
.rl-trust-item { display:flex;align-items:center;gap:9px;font-size:12.5px;color:#bbb; }

.rl-footer-social { display:flex;gap:10px; }
.rl-social-link {
    width:36px;height:36px;border-radius:50%;
    background:#1e1e1e;border:1px solid #2e2e2e;
    color:#aaa;display:flex;align-items:center;justify-content:center;
    transition:all 0.2s;text-decoration:none;
}
.rl-social-link:hover { background:#D80621;border-color:#D80621;color:#fff; }

/* Link columns */
.rl-footer-col-title { font-size:13px;font-weight:800;color:#fff;letter-spacing:1.5px;text-transform:uppercase;margin:0 0 18px; }
.rl-footer-links { list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:11px; }
.rl-footer-links a { color:#999;text-decoration:none;font-size:13.5px;transition:color 0.18s; }
.rl-footer-links a:hover { color:#D80621; }

.rl-footer-contact-block { margin-top:24px;padding-top:18px;border-top:1px solid #222; }
.rl-footer-contact-title { font-size:12px;font-weight:700;color:#fff;letter-spacing:1px;text-transform:uppercase;margin:0 0 10px; }
.rl-footer-contact-block p { font-size:12.5px;color:#888;margin:0 0 5px;line-height:1.5; }
.rl-footer-email a { color:#D80621;text-decoration:none; }
.rl-footer-email a:hover { text-decoration:underline; }

/* Bottom bar */
.rl-footer-bottom { border-top:1px solid #1e1e1e;background:#090909; }
.rl-footer-bottom-inner {
    max-width:1400px;margin:0 auto;
    display:flex;align-items:center;justify-content:space-between;
    padding:18px 60px;gap:20px;flex-wrap:wrap;
}
.rl-footer-copy { font-size:12px;color:#555;margin:0; }

.rl-footer-payments { display:flex;align-items:center;gap:8px;flex-wrap:wrap; }
.rl-pay-label { font-size:11.5px;color:#555;margin-right:4px; }
.rl-pay-badge { border-radius:5px;overflow:hidden;opacity:0.85;transition:opacity 0.2s;line-height:0; }
.rl-pay-badge:hover { opacity:1; }

@media(max-width:860px){
    .rl-footer-bottom-inner { flex-direction:column;align-items:flex-start;padding:18px 20px; }
}
/* Math Captcha */
.rl-captcha-wrap { display:flex;align-items:center;gap:14px;flex-wrap:wrap; }
.rl-captcha-question {
    display:inline-flex;align-items:center;justify-content:center;
    background:#D80621;color:#fff;
    font-size:17px;font-weight:800;letter-spacing:0.5px;
    padding:14px 22px;border-radius:10px;
    white-space:nowrap;flex-shrink:0;min-width:160px;text-align:center;
}
.rl-captcha-input { max-width:140px !important; }
/* Price drop countdown overlay on product card image */
.rl-card-drop { position:absolute;bottom:0;left:0;right:0;background:rgba(15,15,15,0.80);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);padding:5px 8px;display:flex;align-items:center;justify-content:space-between;gap:4px;pointer-events:none; }
.rl-card-drop-timer { font-size:.65rem;font-weight:700;color:#fff;white-space:nowrap;letter-spacing:.02em; }
.rl-card-drop-price { font-size:.65rem;font-weight:800;color:#ff7b7b;white-space:nowrap; }
/* Ghost cards to fill last grid row */
.rl-card-ghost { visibility:hidden;pointer-events:none; }
