/* style.css */

/* ==========================================
   ABERTURA DA LOJA
========================================== */
body.site-preloader-ativo {
    overflow: hidden !important;
}

html.site-preloader-ja-visto .site-preloader {
    display: none !important;
}

.site-preloader {
    position: fixed;
    inset: 0;
    z-index: 2147483646;
    display: grid;
    place-items: center;
    overflow: hidden;
    padding: 24px;
    background:
        radial-gradient(circle at 50% 38%, rgba(35, 197, 82, .13), transparent 32%),
        linear-gradient(145deg, #080b09 0%, #0f0f11 52%, #111714 100%);
    color: #f5f5f5;
    opacity: 1;
    visibility: visible;
    transition: opacity .58s ease, visibility .58s ease;
}

.site-preloader::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: .13;
    background-image:
        linear-gradient(rgba(255, 255, 255, .08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .08) 1px, transparent 1px);
    background-size: 42px 42px;
    -webkit-mask-image: radial-gradient(circle at center, #000 0%, transparent 72%);
    mask-image: radial-gradient(circle at center, #000 0%, transparent 72%);
}

.site-preloader__ambiente {
    position: absolute;
    width: min(78vw, 620px);
    aspect-ratio: 1;
    border-radius: 50%;
    border: 1px solid rgba(35, 197, 82, .08);
    box-shadow:
        0 0 90px rgba(35, 197, 82, .08),
        inset 0 0 90px rgba(35, 197, 82, .04);
    animation: site-preloader-respirar 2.7s ease-in-out infinite;
}

.site-preloader__conteudo {
    position: relative;
    display: flex;
    width: min(100%, 390px);
    flex-direction: column;
    align-items: center;
    text-align: center;
    animation: site-preloader-entrada .7s cubic-bezier(.2, .75, .25, 1) both;
}

.site-preloader__logo {
    position: relative;
    display: grid;
    width: 108px;
    height: 108px;
    place-items: center;
    margin-bottom: 25px;
}

.site-preloader__logo img {
    position: relative;
    z-index: 2;
    width: 86px;
    height: 86px;
    border: 4px solid rgba(255, 255, 255, .94);
    border-radius: 25px;
    object-fit: cover;
    box-shadow:
        0 18px 50px rgba(0, 0, 0, .5),
        0 0 32px rgba(35, 197, 82, .13);
    animation: site-preloader-flutuar 2.4s ease-in-out infinite;
}

.site-preloader__anel {
    position: absolute;
    inset: 0;
    border: 2px solid transparent;
    border-top-color: #23c552;
    border-right-color: rgba(35, 197, 82, .22);
    border-radius: 50%;
    filter: drop-shadow(0 0 7px rgba(35, 197, 82, .5));
    animation: site-preloader-girar 1.3s linear infinite;
}

.site-preloader__marca {
    margin: 0 0 9px;
    color: #23c552;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .28em;
}

.site-preloader__titulo {
    margin: 0;
    color: #f5f5f5;
    font-size: clamp(20px, 5vw, 27px);
    font-weight: 750;
    line-height: 1.25;
    letter-spacing: -.025em;
}

.site-preloader__titulo strong {
    color: #23c552;
    font-weight: 900;
}

.site-preloader__barra {
    width: min(250px, 72vw);
    height: 3px;
    margin: 27px 0 15px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, .1);
}

.site-preloader__barra span {
    display: block;
    width: 46%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, transparent, #23c552 35%, #79f29d 70%, transparent);
    filter: drop-shadow(0 0 5px rgba(35, 197, 82, .75));
    animation: site-preloader-progresso 1.35s ease-in-out infinite;
}

.site-preloader__status {
    display: flex;
    align-items: center;
    min-height: 18px;
    margin: 0;
    color: #a7ada9;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .025em;
}

.site-preloader__pontos {
    display: inline-flex;
    gap: 4px;
    margin-left: 7px;
}

.site-preloader__pontos i {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #23c552;
    animation: site-preloader-ponto 1.05s ease-in-out infinite;
}

.site-preloader__pontos i:nth-child(2) {
    animation-delay: .14s;
}

.site-preloader__pontos i:nth-child(3) {
    animation-delay: .28s;
}

.site-preloader--saindo {
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
}

.site-preloader--saindo .site-preloader__conteudo {
    transform: scale(1.035);
    opacity: 0;
    transition: transform .55s ease, opacity .4s ease;
}

@keyframes site-preloader-entrada {
    from { opacity: 0; transform: translateY(12px) scale(.97); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes site-preloader-girar {
    to { transform: rotate(360deg); }
}

@keyframes site-preloader-flutuar {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-4px); }
}

@keyframes site-preloader-respirar {
    0%, 100% { transform: scale(.96); opacity: .55; }
    50% { transform: scale(1.04); opacity: 1; }
}

@keyframes site-preloader-progresso {
    from { transform: translateX(-115%); }
    to { transform: translateX(255%); }
}

@keyframes site-preloader-ponto {
    0%, 60%, 100% { transform: translateY(0); opacity: .35; }
    30% { transform: translateY(-4px); opacity: 1; }
}

@media (max-width: 480px) {
    .site-preloader__conteudo {
        width: 100%;
    }

    .site-preloader__logo {
        width: 96px;
        height: 96px;
    }

    .site-preloader__logo img {
        width: 76px;
        height: 76px;
        border-radius: 22px;
    }

    .site-preloader__titulo {
        max-width: 320px;
        padding: 0 10px;
        font-size: 22px;
        line-height: 1.3;
    }

    .site-preloader__titulo strong {
        display: block;
        margin-top: 3px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .site-preloader,
    .site-preloader__conteudo,
    .site-preloader__ambiente,
    .site-preloader__logo img,
    .site-preloader__anel,
    .site-preloader__barra span,
    .site-preloader__pontos i {
        animation: none !important;
        transition-duration: .15s !important;
    }

    .site-preloader__barra span {
        width: 100%;
        background: #23c552;
    }
}

/* Estilização da barra de rolagem (padrão de apps) */
.custom-scrollbar::-webkit-scrollbar { 
    width: 6px; 
}

.custom-scrollbar::-webkit-scrollbar-track { 
    background: transparent; 
}

.custom-scrollbar::-webkit-scrollbar-thumb { 
    background: #333; 
    border-radius: 10px; 
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover { 
    background: #555; 
}
/* ==========================================
   FILTROS COMPACTOS NO CELULAR
========================================== */
@media (max-width: 767px) {
    .campo-busca-mobile {
        border-radius: 14px;
    }

    .filtros-mobile-scroll {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px !important;
        overflow: visible !important;
        width: 100%;
        padding: 0;
    }

    .filtro-pill {
        min-width: 0 !important;
        width: 100%;
    }

    .filtro-pill select {
        min-width: 0 !important;
        width: 100%;
        height: 40px;
        padding: 0 25px 0 8px !important;
        border-radius: 11px;
        font-size: 11px;
        font-weight: 600;
        text-overflow: ellipsis;
    }

    .filtro-pill > div {
        padding-left: 0 !important;
        padding-right: 7px !important;
    }

    .filtro-pill > div svg {
        width: 12px;
        height: 12px;
    }
}


/* Banner e central de preferências de cookies */
.cookie-banner{position:fixed;inset:auto 0 0 0;z-index:100;background:rgba(15,15,17,.98);border-top:1px solid #383838;box-shadow:0 -12px 35px rgba(0,0,0,.35);padding:18px;color:#f5f5f5}.cookie-banner.hidden,.cookie-modal.hidden{display:none!important}.cookie-banner-content{max-width:1150px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px}.cookie-banner-text{max-width:720px}.cookie-banner-text strong{font-size:16px}.cookie-banner-text p{margin:6px 0;color:#c5c7cc;font-size:13px;line-height:1.55}.cookie-banner-text a{color:#23c552;font-size:12px;font-weight:700;text-decoration:underline}.cookie-banner-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.cookie-btn{border-radius:10px;padding:11px 15px;font-size:12px;font-weight:800;cursor:pointer;transition:.2s}.cookie-btn-primary{border:1px solid #23c552;background:#23c552;color:#07140b}.cookie-btn-primary:hover{filter:brightness(1.08)}.cookie-btn-secondary{border:1px solid #505057;background:#242427;color:#fff}.cookie-btn-secondary:hover{border-color:#23c552}.cookie-modal{position:fixed;inset:0;z-index:110;display:flex;align-items:center;justify-content:center;padding:16px}.cookie-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.76);backdrop-filter:blur(5px)}.cookie-modal-card{position:relative;width:min(620px,100%);max-height:92vh;overflow:auto;background:#18181a;border:1px solid #38383d;border-radius:18px;padding:26px;color:#f5f5f5;box-shadow:0 24px 70px rgba(0,0,0,.55)}.cookie-modal-card h2{font-size:21px;font-weight:800;margin:0 35px 8px 0}.cookie-modal-intro{font-size:13px;line-height:1.55;color:#b8bbc2;margin-bottom:18px}.cookie-modal-close{position:absolute;right:18px;top:18px;color:#aaa;background:transparent;border:0;cursor:pointer;font-size:18px}.cookie-category{display:flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid #343439;border-radius:13px;padding:15px;margin-top:10px;background:#202023}.cookie-category strong{font-size:14px}.cookie-category p{font-size:12px;color:#aaaeb7;line-height:1.45;margin:4px 0 0}.cookie-always{font-size:11px;color:#23c552;font-weight:800;white-space:nowrap}.cookie-category-toggle{cursor:pointer}.cookie-switch-input{position:absolute;opacity:0;pointer-events:none}.cookie-switch{width:46px;height:25px;border-radius:999px;background:#555;position:relative;flex:0 0 auto;transition:.2s}.cookie-switch:before{content:"";position:absolute;width:19px;height:19px;border-radius:50%;background:white;top:3px;left:3px;transition:.2s}.cookie-switch-input:checked+.cookie-switch{background:#23c552}.cookie-switch-input:checked+.cookie-switch:before{transform:translateX(21px)}.cookie-modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px;flex-wrap:wrap}@media(max-width:720px){.cookie-banner-content{align-items:stretch;flex-direction:column}.cookie-banner-actions{display:grid;grid-template-columns:1fr 1fr}.cookie-banner-actions .cookie-btn-primary{grid-column:1/-1}.cookie-btn{width:100%}.cookie-category{align-items:flex-start}.cookie-modal-actions{display:grid;grid-template-columns:1fr}.cookie-modal-card{padding:22px 18px}}

/* Links institucionais do rodapé */
footer a[href$="politica-de-privacidade.html"],
footer a[href$="politica-de-cookies.html"],
footer a[href$="termos-de-uso.html"],
footer a[href$="trocas-entregas-cancelamentos.html"]{color:#b8bdc8;text-decoration:none;transition:color .18s ease}
footer a[href$="politica-de-privacidade.html"]:hover,
footer a[href$="politica-de-cookies.html"]:hover,
footer a[href$="termos-de-uso.html"]:hover,
footer a[href$="trocas-entregas-cancelamentos.html"]:hover{color:#23c552}

/* AUTH V3 - modal de termos seguro no desktop e mobile */
#modal-termos-cadastro {
    height: 100dvh;
    max-height: 100dvh;
    overflow: hidden;
    overscroll-behavior: contain;
}
#modal-termos-cadastro > div {
    min-height: 0;
}
#conteudo-termos-cadastro {
    min-height: 0;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}
