/* =====================================================
   Aviarmada — app.css BASE (SEM @MEDIA)
   Cores: Teal #2BA8B5 | Red/Pink #C0205A | Dark Navy #1B2A4A
   ===================================================== */

/* ---------- RESET & BAE ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
    --teal:       #2BA8B5;
    --teal-dark:  #1e8a96;
    --red:        #C0205A;
    --red-dark:   #9e1a4a;
    --navy:       #1B2A4A;
    --gray-light: #f4f6f8;
    --gray:       #e0e0e0;
    --blue:       #2192d8;
    --gray-mid:   #999;
    --text:       #333;
    --white:      #fff;
    --font:       'Segoe UI', Arial, sans-serif;
    --radius:     10px;
    --shadow:     0 2px 12px rgba(0,0,0,.08);
    --transition: .2s ease;
    --cor-principal: #2BA8B5;
}

html { scroll-behavior: smooth; }
body { font-family: var(--font); color: var(--text); background: var(--white); font-size: 15px; line-height: 1.55; }
a    {color: var(--cor-principal) ; text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--cor-principal); }
img  { max-width: 100%; display: block; }
ul   { list-style: none; }

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ---------- TOPBAR ---------- */
.topbar {
    background-color: var(--cor-principal) !important;
    border-color: var(--cor-principal) !important;
    color: var(--white);
    font-size: 12px;
    padding: 6px 0;
}
.topbar__inner {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}
.topbar__phone { font-weight: 600;margin-left: auto; }
.topbar__note  { color: rgba(255,255,255,.6); font-size: 11px; }

/* ---------- HEADER ---------- */
.header {
    background: var(--white);
    border-bottom: 1px solid var(--gray);
    padding: 14px 0;
    position: sticky;
    top: 0;
    z-index: 100;
    box-shadow: var(--shadow);
}
.header__inner {
    display: flex;
    align-items: center;
    gap: 24px;
}
.header__logo { flex-shrink: 0; }
.header__logo img { height: 60px; width: auto; }

/* Search Box */
.header__search { flex: 1; min-width: 200px; }
.search-box {
    background-color: var(--cor-principal) !important;
    border-color: var(--cor-principal) !important;
    color: #ffffff !important;
    display: flex;
    border: 2px solid var(--cor-principal);
    border-radius: 30px;
    overflow: hidden;
    height: 44px;       
}
.search-box__cat {
    border: none;
    border-right: 1px solid var(--gray);
    padding: 0 14px;
    font-size: 13px;
    color: var(--text);
    background: var(--white);
    cursor: pointer;
    outline: none;
    min-width: 160px;
}
.search-box__input {
    flex: 1;
    border: none;
    padding: 0 14px;
    font-size: 14px;
    outline: none;
}
.search-box__btn {
    border: none;
    color: var(--cor-principal) !important;
    padding: 0 18px;
    cursor: pointer;
    font-size: 16px;
}


/* Header Actions */
.header__actions {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-shrink: 0;
}
.header__action {
    font-size: 22px;
    color: var(--navy);
    position: relative;
    transition: color var(--transition);
}
.header__action:hover { color: var(--cor-principal); }
.header__cart { position: relative; }
.cart-badge {
    position: absolute;
    top: -8px;
    right: -8px;
    background: var(--red);
    color: var(--white);
    border-radius: 50%;
    width: 18px;
    height: 18px;
    font-size: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}

/* ---------- NAVBAR ---------- */
.navbar {
    background: var(--white);
    border-bottom: 1px solid var(--gray);
    padding: 0;
    position: relative; 
}
.navbar__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
/* Slider Promoções */
.promocoes-slider-item {
    width: calc(25% - 18px); /* 4 visíveis no desktop */
}

/* --- MENU --- */
.navbar__menu {
    display: flex;
    align-items: center;
    gap: 0;
    flex-shrink: 0;
    margin: 0;        /* NOVO: Remove a margem padrão do <ul> */
    padding: 0;       /* NOVO: Remove o padding padrão do <ul> */
    list-style: none; /* NOVO: Limpa as marcas de lista */
}
.navbar__menu li { 
    position: relative; 
}
.navbar__menu li a {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 14px 18px;
    color: var(--text);
    font-size: 14px;
    font-weight: 500;
    border-top: 3px solid transparent; /* NOVO: Faz o peso visual contrapeso com os 3px de baixo */
    border-bottom: 3px solid transparent;
    transition: all var(--transition);
    white-space: nowrap;
}
.navbar__menu li.active > a,
.navbar__menu li > a:hover {
    color: var(--cor-principal) !important;
}

/* --- DROPDOWN --- */
.navbar__menu .dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    background: var(--white);
    border: 1px solid var(--gray);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    min-width: 220px;
    z-index: 99999 !important;
    display: none;
    margin: 0;        /* NOVO: Remove a margem do submenu */
    padding: 0;       /* NOVO: Remove o padding do submenu */
    list-style: none; /* NOVO */
}
.navbar__menu .has-dropdown:hover .dropdown { 
    display: block; 
}
.navbar__menu .dropdown li a {
    padding: 10px 18px;
    border-top: none; /* NOVO: Remove a borda superior para os dropdowns ficarem normais */
    border-bottom: none;
    font-weight: 400;
    white-space: normal;
}
.navbar__menu .dropdown li a:hover { 
    background: var(--gray-light); 
    color: var(--cor-principal); 
}

/* --- SOCIAL --- */
.navbar__social {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-shrink: 0;
    margin: 0;  /* NOVO: Reset de segurança */
    padding: 0; /* NOVO: Reset de segurança */
}
.navbar__social a { 
    color: var(--navy); 
    font-size: 16px; 
    transition: color var(--transition);
    display: flex;         /* NOVO: Centra o próprio ícone perfeitamente a nível milimétrico */
    align-items: center;   /* NOVO */
}
.navbar__social a:hover { 
    color: var(--cor-principal); 
}

/* ========================================================
   MAGIA DO SUBMENU (Categorias Filhas)
   ======================================================== */

/* 1. Preparar a Categoria Mãe para ancorar o submenu */
.navbar__menu .has-submenu {
    position: relative;
}

/* 2. Esconder a lista das filhas e posicioná-la de lado */
.navbar__menu .submenu-lateral {
    display: none;
    position: absolute;
    top: -1px;
    left: 100%;
    background: var(--white);
    border: 1px solid var(--gray);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    min-width: 220px;
    z-index: 99999;
    padding: 0;
    margin: 0;
    list-style: none;
}

/* 3. O "gatilho": Mostrar as filhas quando passas o rato na mãe! */
.navbar__menu .has-submenu:hover .submenu-lateral {
    display: block;
}

/* 4. Estilo dos links das subcategorias para ficarem iguaizinhos ao resto */
.navbar__menu .submenu-lateral li a {
    padding: 10px 18px;
    display: block;
    border-bottom: none;
    font-weight: 400;
    white-space: normal;
    color: var(--text);
}

/* Efeito ao passar o rato nas subcategorias */
.navbar__menu .submenu-lateral li a:hover {
    background: var(--gray-light); 
    color: var(--cor-principal); 
}

/* ---------- PAGE HEADER ---------- */
.page-header {
    background-color: var(--cor-principal) !important;
    border-color: var(--cor-principal) !important;
    color: #ffffff !important;
    text-align: center;
    padding: 22px 0;
}
.page-header h1 { font-size: 28px; font-weight: 700; }
.page-header--conta { padding-bottom: 80px !important; margin-bottom: 0; }
.page-header--conta p { font-size: 14px; opacity: .85; }

/* ---------- BUTTONS ---------- */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 11px 26px;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    border: 2px solid transparent;
    transition: all var(--transition);
    text-decoration: none;
}
.btn--teal    { background: var(--cor-principal); color: var(--white); border-color: var(--cor-principal); }
.btn--teal:hover { background: var(--white); border-color: var(--cor-principal); color: var(--cor-principal); }
.btn--red     { background: var(--red); color: var(--white); border-color: var(--red); }
.btn--red:hover { background: var(--red-dark); border-color: var(--red-dark); color: var(--white); }
.btn--navy    { background: var(--navy); color: var(--white); border-color: var(--navy); }
.btn--navy:hover { background: var(--navy); border-color: var(--navy); opacity: .88; color: var(--white); }   
.btn--white   { background-color: var(--cor-principal); color: #ffffff !important; border: 2px solid #ffffff !important; }
.btn--white:hover { background:var(--white); color: var(--cor-principal) !important; border-color: var(--white); }
.btn--dark    { background: #333; color: var(--white); border-color: #333; }
.btn--outline { background: transparent; color: var(--cor-principal); border-color: var(--cor-principal); }
.btn--outline:hover { background: var(--cor-principal); color: var(--white); }
.btn--sm  { padding: 8px 18px; font-size: 13px; }
.btn--lg  { padding: 14px 36px; font-size: 15px; }
.btn--block { width: 75%; margin: 0 auto 15px auto !important; display: block; border-radius: 6px !important; text-align: center; font-weight: bold; padding: 12px; }
.mt-2 { margin-top: 10px; }
.mt-3 { margin-top: 18px; }
.mt-5 { margin-top: 36px; }

.btn-icon {
    background: transparent;
    border: 1.5px solid var(--gray);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--gray-mid);
    transition: all var(--transition);
    font-size: 15px;
}
.btn-icon:hover { border-color: var(--cor-principal); color: var(--cor-principal); }
.btn-remover:hover { border-color: var(--red); color: var(--red); }
.btn-favorito.ativo { color: var(--red); border-color: var(--red); }
.btn-remover {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent;
}

/* ---------- ALERTS (Flutuante no Topo Centro) ---------- */
.alert {
    padding: 10px 16px; 
    border-radius: var(--radius);
    font-size: 13px; 
    font-weight: 500;
    width: fit-content; 
    min-width: 250px; 
    text-align: center; 
    
    position: fixed;
    top: 550px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9999;
}

.alert--success { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
.alert--error   { background: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }

/* ---------- HERO ---------- */
.hero {
    background-color: var(--cor-principal) !important;
    border-color: var(--cor-principal) !important;
    position: relative;
    overflow: hidden;
    margin-bottom: 0;
}
.hero__inner {
    display: flex;
    align-items: center;
    padding: 60px 0 40px;
    gap: 40px;
}
.hero__text { flex: 1; color: var(--white); }
.hero__text h1 {
    font-size: 38px;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 14px;
}
.hero__text p { font-size: 16px; opacity: .9; margin-bottom: 28px; }
.hero__image { flex: 1; display: flex; justify-content: flex-end; }
.hero__image img { max-height: 340px; width: auto; filter: drop-shadow(0 10px 30px rgba(0,0,0,.2)); }
.hero__scroll {
    text-align: center;
    padding: 18px 0 24px;
}
.hero__scroll a {
    color: rgba(255,255,255,.8);
    font-size: 20px;
    border: 2px solid rgba(255,255,255,.5);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    animation: bounce .8s infinite alternate;
}
@keyframes bounce { from { transform: translateY(0); } to { transform: translateY(6px); } }

/* ---------- CATEGORIAS SLIDERS ---------- */
.section-categorias { padding: 30px 0; }
.section-categorias--inner { background: var(--white); }
.categorias-slider {
    display: flex;
    align-items: center;
    gap: 12px;
    position: relative;
}
.categorias-slider__track {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-behavior: smooth;
    flex: 1;
    scrollbar-width: none;
}
/* ==========================================================
       ELIMINAR DEFINITIVAMENTE AS SOMBRAS DO SLIDER
       ========================================================== */
    .categorias-slider::before,
    .categorias-slider::after {
        display: none !important; /* Remove o elemento do ecrã */
        content: none !important; /* Limpa qualquer conteúdo residual */
        background: none !important; /* Garante que não há fundo */
    }
.btn-mobile-filtro {
            display: none !important;
        }
.categorias-slider__track::-webkit-scrollbar { display: none; }
.categoria-pill {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-align: center;
    flex-shrink: 0;
    min-width: 90px;
    color: var(--cor-principal);
    font-size: 12px;
    font-weight: 600;
    transition: transform var(--transition);
}
.categoria-pill:hover { transform: translateY(-3px); }
.categoria-pill.active .categoria-pill__img { border-color: var(--cor-principal); box-shadow: 0 0 0 3px rgba(43,168,181,.2); }

/* ========================================================
   ESTILOS DO BANNER DINÂMICO NA SIDEBAR (Técnica Infalível)
   ======================================================== */

.sidebar-banner {
    background-color: transparent;
    padding: 4px;
    border-radius: 14px;
    width: 100%;
    
    transition: transform 0.3s ease;
}

.sidebar-banner:hover {
    transform: scale(1.02);
}

.sidebar-banner img {
    border: 3px solid var(--cor-principal);
    border-radius: 10px;
    background-color: transparent;
    display: block;
    width: 100%;
    object-fit: cover;
}

/* Categoria pill — círculo com fundo cor principal */
.categoria-pill__img--box {
    width: 125px;
    height: 125px;
    border-radius: 50%;
    background-color: var(--cor-principal);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    border: 2px solid transparent;
    transition: border-color var(--transition), box-shadow var(--transition);
    overflow: hidden;
}

/* Efeito de "Anel" para a categoria selecionada */
.categoria-pill__img--box.active {
    border: 4px solid #ffffff;
    box-shadow: 0 0 0 4px var(--cor-principal);
    transform: scale(1.05);
}

/* Opcional: Para o texto também ficar destacado (a negrito) quando a categoria está ativa */
.categoria-pill__img--box.active + span {
    font-weight: 800;
}

.categoria-pill__img--box img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

/* Hover e activo */
.categoria-pill:hover .categoria-pill__img--box,
.categoria-pill.active .categoria-pill__img--box {
    border-color: var(--white);
    box-shadow: 0 0 0 3px rgba(255,255,255,0.3);
}
.categoria-pill__img img { width: 100%; height: 100%; object-fit: cover; }

/* Slider buttons */
.slider-btn {
    background: var(--white);
    border: 1.5px solid var(--gray);
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--gray-mid);
    flex-shrink: 0;
    transition: all var(--transition);
    font-size: 13px;
}
.slider-btn:hover { border-color: var(--cor-principal); color: var(--cor-principal); }

/* Slider buttons */
.slider-btn1 {
    background: var(--white);
    border: 1.5px solid var(--gray);
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--gray-mid);
    flex-shrink: 0;
    transition: all var(--transition);
    font-size: 13px;
}
.slider-btn1:hover { border-color: var(--cor-principal); color: var(--cor-principal); }

/* ---------- SECTION HEADERS ---------- */
.section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
    flex-wrap: wrap;
    gap: 12px;
}
.section-header__actions,
.section-header__tabs {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.section-title {
    font-size: 24px;
    font-weight: 700;
    color: var(--text);
    font-style: italic;
}
.section-title--red  { color: var(--red); font-size: 32px; }
.section-title--center { text-align: center; }
.section-subtitle { text-align: center; color: var(--gray-mid); margin: 8px 0 36px; }
.ver-todos { font-size: 13px; color: var(--cor-principal); font-weight: 600; }
.tab-btn {
    background: transparent;
    border: none;
    padding: 6px 14px;
    font-size: 13px;
    cursor: pointer;
    border-radius: 20px;
    color: var(--gray-mid);
    transition: all var(--transition);
    white-space: nowrap;
}
.tab-btn.active, .tab-btn:hover { background: var(--cor-principal); color: var(--white); }

/* ---------- DESTAQUES DO DIA ---------- */
.section-destaques { padding: 16px 0 32px; }
.destaques-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.destaque-card {
    border-radius: var(--radius);
    padding: 24px 22px;
    background: var(--gray-light);
    border-left: 4px solid var(--cor-principal);
}
.destaque-card h3 { font-size: 18px; font-weight: 700; margin-bottom: 6px; }
.destaque-card p  { font-size: 14px; margin-bottom: 16px; color: var(--gray-mid); }
.destaque-card p strong { color: var(--red); }

/* ---------- PRODUTOS GRID ---------- */
.section-produtos { padding: 32px 0; }
.produtos-grid { display: grid; gap: 20px; }
.produtos-grid--3 { grid-template-columns: repeat(3, 1fr); }
.produtos-grid--4 { grid-template-columns: repeat(4, 1fr); }

/* Produto Card */
.produto-card {
    border-radius: var(--radius);
    border: 1px solid var(--gray);
    overflow: hidden;
    background: var(--white);
    transition: box-shadow var(--transition), transform var(--transition);
}
.produto-card:hover { box-shadow: var(--shadow); transform: translateY(-3px); }
.produto-card__image {
    position: relative;
    aspect-ratio: 1;
    overflow: hidden;
    background: var(--gray-light);
}
.produto-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition);
}
.produto-card:hover .produto-card__image img { transform: scale(1.04); }
.produto-card__badge {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    color: var(--white);
}
.badge--promo { background: var(--red); }
.produto-card__cart-btn {
    position: absolute;
    bottom: 10px;
    right: 10px;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: var(--cor-principal);
    border: none;
    color: var(--white);
    font-size: 15px;
    cursor: pointer;
    opacity: 0;
    transform: translateY(6px);
    transition: all var(--transition);
    display: flex;
    align-items: center;
    justify-content: center;
}
.produto-card:hover .produto-card__cart-btn { opacity: 1; transform: translateY(0); }
.produto-card__info { padding: 14px 14px 16px; }
.produto-card__price { display: flex; align-items: baseline; gap: 8px; margin-bottom: 4px; }
.price--final   { font-size: 15px; font-weight: 700; color: var(--text); }
.price--original { font-size: 13px; color: var(--gray-mid); text-decoration: line-through; }
.produto-card__rating { display: flex; align-items: center; gap: 3px; font-size: 12px; color: #f5a623; margin-bottom: 6px; }
.produto-card__rating small { color: var(--gray-mid); }
.produto-card__name { font-size: 13px; color: var(--cor-principal); font-weight: 500; display: block; }
.produto-card__name:hover { color: var(--teal-dark); }

/* ---------- BANNERS COUNTDOWN ---------- */
.section-banners { padding: 0 0 36px; }
.banners-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.banner-countdown {
    border-radius: var(--radius);
    padding: 28px 30px;
    display: flex;
    align-items: center;
    gap: 20px;
    min-height: 160px;
    position: relative;
    overflow: hidden;
}
.banner-countdown--teal { background: var(--cor-principal); color: var(--white); }
.banner-countdown--light { background: var(--gray-light); border: 1px solid var(--gray); }
.banner-countdown__text h3 { font-size: 20px; font-weight: 800; margin-bottom: 4px; }
.banner-countdown__text p  { font-size: 13px; margin-bottom: 12px; opacity: .85; }
.countdown { display: flex; gap: 10px; margin-bottom: 16px; flex-wrap: wrap; }
.countdown span {
    background: rgba(255,255,255,.2);
    border-radius: 6px;
    padding: 5px 10px;
    font-size: 13px;
    font-weight: 700;
}
.banner-countdown--light .countdown span { background: var(--cor-principal); color: var(--white); }
.banner-label {
    display: inline-block;
    background: var(--red);
    color: var(--white);
    font-size: 11px;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 4px;
    margin-bottom: 14px;
}

/* ---------- PARCEIROS ---------- */
.section-parceiros { padding: 32px 0; }
.parceiros-slider { display: flex; align-items: center; gap: 36px; justify-content: center; flex-wrap: wrap; }
.parceiro-logo { opacity: .7; transition: opacity var(--transition); }
.parceiro-logo:hover { opacity: 1; }
.parceiro-logo img { max-height: 55px; width: auto; filter: grayscale(1); transition: filter var(--transition); }
.parceiro-logo:hover img { filter: grayscale(0); }

/* ---------- LOJA ---------- */
.loja-content { padding: 32px 0 48px; }
.loja-layout  { display: grid; grid-template-columns: 240px 1fr; gap: 32px; align-items: start; }

/* =========================================
   DESIGN DA SIDEBAR DE FILTROS (LOJA)
   ========================================= */

/* 1. Container Principal (Estilo Cartão) */
.loja-sidebar {
    background: #ffffff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    position: sticky;
    top: 100px;
}

/* Espaçamento entre cada grupo (Preço, Categorias, etc) */
.filter-group {
    margin-bottom: 25px;
}

/* 2. Cabeçalhos dos Filtros (Preço, Categorias...) */
.filter-group__label, 
.filter-toggle {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    background: transparent;
    border: none;
    padding: 0 0 8px 0;
    font-size: 16px;
    font-weight: 700;
    color: #004b87;
    border-bottom: 2px solid #555555;
    margin-bottom: 15px;
    cursor: pointer;
}

/* Esconder o conteúdo (opcional se usares JavaScript para abrir/fechar) */
.filter-group__body {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* 3. Checkboxes e Textos */
.checkbox-label {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 11px;
    color: #333333;
    cursor: pointer;
    font-family: Arial, Helvetica, sans-serif;
    text-transform: uppercase;
}


.checkbox-label input[type="checkbox"] {
    width: 14px;
    height: 14px;
    cursor: pointer;
    accent-color: #2ba8b5;
}

/* =========================================
   4. O TRUQUE DO SLIDER DUPLO DE PREÇO
   ========================================= */

/* O contentor que junta as duas barras num só espaço */
.price-range {
    position: relative;
    height: 30px;
    margin-bottom: 5px;
}

/* A linha fina azul que fica por trás das bolas vermelhas */
.price-range::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background: #004b87; 
    top: 50%;
    transform: translateY(-50%);
    z-index: 1;
}

/* Os inputs originais (escondemos a barra deles e mantemos só as bolinhas) */
.range-slider {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    pointer-events: none;
    z-index: 2;
    margin: 0;
}

/* Design da Bolinha Vermelha (Chrome, Safari, Edge) */
.range-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: #a81b39;
    cursor: pointer;
    pointer-events: auto;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

/* Design da Bolinha Vermelha (Firefox) */
.range-slider::-moz-range-thumb {
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: #a81b39;
    cursor: pointer;
    pointer-events: auto;
    border: none;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

/* Textos debaixo do Slider (Ex: 20,00 €  ---  1000,00 €) */
.price-range__labels {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: #004b87;
    font-weight: 600;
}

/* Toolbar */
.loja-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--gray);
    flex-wrap: wrap;
    gap: 10px;
}
.results-count { font-size: 14px; color: var(--gray-mid); }
.toolbar-right  { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--gray-mid); flex-wrap: wrap; }
.vis-btn {
    padding: 6px 9px;
    border: 1.5px solid var(--gray);
    border-radius: 6px;
    color: var(--gray-mid);
    font-size: 15px;
    transition: all var(--transition);
}
.vis-btn.active, .vis-btn:hover { border-color: var(--cor-principal); color: var(--cor-principal); }

/* Lista view */
.produtos-list { display: flex; flex-direction: column; gap: 12px; }
.produto-list-item {
    display: grid;
    grid-template-columns: 80px 1fr 120px 100px 60px 110px;
    align-items: center;
    gap: 16px;
    border: 1px solid var(--gray);
    border-radius: var(--radius);
    padding: 14px 18px;
    background: var(--white);
}
.produto-list-item__img img { width: 70px; height: 70px; object-fit: cover; border-radius: 6px; }
.produto-list-item__info h3 { font-size: 14px; font-weight: 600; margin-bottom: 4px; }
.produto-list-item__info h3 a { color: var(--cor-principal); }
.produto-list-item__desc { font-size: 12px; color: var(--gray-mid); }
.produto-list-item__ref .label { display: block; font-size: 11px; color: var(--gray-mid); }
.produto-list-item__ref .ref-value { font-size: 13px; font-weight: 600; color: var(--red); }

/* ---------- PRODUTO DETALHE ---------- */
.produto-detalhe { padding: 40px 0; }
.produto-detalhe__layout { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; margin-bottom: 48px; }

.produto-galeria__main {
    border: 1px solid var(--gray);
    border-radius: var(--radius);
    overflow: hidden;
    aspect-ratio: 1;
    background: var(--gray-light);
}
.produto-galeria__main img { width: 100%; height: 100%; object-fit: contain; }
.produto-galeria__thumbs { display: flex; gap: 10px; margin-top: 12px; }
.thumb {
    width: 70px;
    height: 70px;
    object-fit: cover;
    border-radius: 6px;
    border: 2px solid transparent;
    cursor: pointer;
    transition: border-color var(--transition);
}
.thumb:hover, .thumb.active { border-color: var(--cor-principal); }

.produto-info__nome  { font-size: 32px; font-weight: 800; margin-bottom: 10px; color: var(--navy); }
.produto-info__rating { display: flex; gap: 3px; color: #f5a623; margin-bottom: 14px; font-size: 18px; }
.produto-info__price { margin-bottom: 16px; }
.price-big  { font-size: 30px; font-weight: 800; color: var(--navy); margin-right: 12px; }
.price-old  { font-size: 20px; color: var(--gray-mid); text-decoration: line-through; }
.produto-info__meta { display: flex; gap: 20px; margin-top: 10px; font-size: 13px; flex-wrap: wrap; }
.produto-info__desc { font-size: 14px; color: var(--gray-mid); margin-bottom: 18px; line-height: 1.6; }

/* Variações */
.produto-variacoes { display: flex; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.variacao-btn {
    border: 2px solid var(--gray);
    border-radius: 50%;
    width: 32px;
    height: 32px;
    cursor: pointer;
    transition: border-color var(--transition);
}
.variacao-btn:hover, .variacao-btn.active { border-color: var(--navy); }
.variacao-btn--tam {
    border-radius: 6px;
    width: auto;
    padding: 0 12px;
    font-size: 13px;
    font-weight: 600;
    background: var(--white);
    color: var(--text);
}

/* Tabela descontos */
.produto-descontos { margin-bottom: 18px; }
.desconto-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.desconto-table th { background: var(--gray-light); padding: 9px 12px; text-align: left; font-weight: 600; }
.desconto-table td { padding: 9px 12px; border-bottom: 1px solid var(--gray); }


/* Nutri-score */
.nutri-score { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; flex-wrap: wrap; }
.nutri-score__label { font-size: 12px; font-weight: 700; }
.nutri-score__bar { display: flex; gap: 3px; flex-wrap: wrap; }
.nutri-score__bar span {
    width: 28px;
    height: 28px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    color: var(--white);
    opacity: .4;
}
.nutri-score__bar span.active { opacity: 1; box-shadow: 0 0 0 2px var(--navy); }
.ns-a { background: #038141; } .ns-b { background: #85BB2F; } .ns-c { background: #FECB02; }
.ns-d { background: #EE8100; } .ns-e { background: #E63E11; }

/* IVA info */
.produto-iva-info {
    background: var(--gray-light);
    border-radius: var(--radius);
    padding: 14px 18px;
    margin-bottom: 16px;
    font-size: 14px;
}
.iva-row { display: flex; justify-content: space-between; padding: 5px 0; border-bottom: 1px solid var(--gray); }
.iva-row:last-child { border-bottom: none; }

/* Seletor caixa */
.select-caixa {
    width: 100%;
    border: 1.5px solid var(--gray);
    border-radius: 30px;
    padding: 10px 18px;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 16px;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23999'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    background-size: 10px;
    cursor: pointer;
}

/* Add to cart row */
.add-to-cart-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.qty-control { display: flex; align-items: center; border: none; border-radius: 30px; overflow: hidden; }
.qty-control--sm { transform: scale(0.9); }
.qty-btn { background: transparent; border: none; padding: 8px 14px; font-size: 18px; cursor: pointer; color: var(--text); transition: background var(--transition); }
.qty-btn:hover { background: var(--gray-light); }
.qty-input { 
    border: none; 
    width: 50px; 
    text-align: center; 
    font-size: 15px; 
    font-weight: 600; 
    outline: none;
    cursor: text;
    border-radius: 6px; 
    transition: all 0.2s ease;
    background: transparent;
}

/* 2. Mostra um fundo clarinho quando o rato passa por cima */
.qty-input:hover {
    background: var(--gray-light, #f8f9fa); 
}

/* 3. Faz um contorno elegante da tua cor quando a pessoa clica para escrever */
.qty-input:focus {
    background: #ffffff;
    box-shadow: 0 0 0 2px var(--cor-principal) !important; 
}

/* Tabs */
.produto-tabs { border: 1px solid var(--gray); border-radius: var(--radius); overflow: hidden; margin-bottom: 48px; }
.tabs-header { display: flex; border-bottom: 1px solid var(--gray); flex-wrap: wrap; }
.tabs-header .tab-btn { border-radius: 0; padding: 14px 22px; font-size: 14px; border-bottom: 3px solid transparent; }
.tabs-header .tab-btn.active { border-bottom-color: var(--cor-principal); color: var(--cor-principal); background: transparent; }
.tab-content { display: none; padding: 24px; }
.tab-content.active { display: block; }
.caracteristicas-list dt { font-weight: 700; font-size: 13px; margin-top: 12px; color: var(--navy); }
.caracteristicas-list dd { font-size: 13px; color: var(--gray-mid); margin-left: 0; }
.avaliacao { border-bottom: 1px solid var(--gray); padding: 14px 0; }
.avaliacao:last-child { border-bottom: none; }

/* ---------- CARRINHO ---------- */
.carrinho-layout {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 32px;
    padding: 40px 0;
    align-items: start;
}
/* ---------- TABELA DO CARRINHO ---------- */

/* 1. A Tabela Principal (Moldura e Cantos Redondos) */
.carrinho-table { 
    width: 100%; 
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px; 
    border: 1px solid var(--cor-principal) !important;
    border-radius: var(--radius) !important;
    overflow: hidden;
    min-width: 650px;
}

/* 2. As células: deixamos APENAS a linha de baixo para não haver duplicados */
.carrinho-table th, 
.carrinho-table td { 
    border-bottom: 1px solid var(--gray) !important;
    border-top: none !important;
    border-left: none !important; 
    border-right: none !important;
}

/* 3. Tira a linha do último produto para não fazer linha dupla com a borda de baixo da tabela */
.carrinho-table tbody tr:last-child td,
.carrinho-table tr:last-child td {
    border-bottom: none !important;
}

/* 4. Impede que o "Valor Uni." e o "Total" quebrem a linha */
.carrinho-table td:nth-child(5),
.carrinho-table td:nth-child(6) {
    white-space: nowrap;
}

/* ========================================================
   APENAS PARA A TABELA DOS RECIBOS (Versão à Prova de Bala)
   ======================================================== */

.tabela-recibo {
    width: max-content !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 auto !important; 
}

/* 1. Imagem (Só no Topo e Meio) */
.tabela-recibo thead th:nth-child(1), 
.tabela-recibo tbody td:nth-child(1) {
    text-align: center !important;
    padding-left: 16px !important;
    padding-right: 16px !important; 
}

/* 2. Produto (Só no Topo e Meio - Livre para esticar) */
.tabela-recibo thead th:nth-child(2),
.tabela-recibo tbody td:nth-child(2) {
    text-align: left !important;
    padding-right: 40px !important;
}

/* 3. Qtd (Só no Topo e Meio) */
.tabela-recibo thead th:nth-child(3),
.tabela-recibo tbody td:nth-child(3) {
    text-align: right !important;
    padding-right: 24px !important;
}

/* 4. TOTAL E PREÇOS (Sempre colados à direita, seja em que linha for) */
.tabela-recibo th:last-child,
.tabela-recibo td:last-child {
    text-align: right !important;
    padding-right: 16px !important;
    white-space: nowrap !important;
}

/* 5. A palavra TOTAL PAGO (Agora colada ao preço) */
.tabela-recibo tfoot td[colspan] {
    text-align: right !important;
    padding-right: 6px !important;
}

/* ========================================================
   REMOVER A CAIXA FANTASMA EM VOLTA DO RECIBO
   ======================================================== */
.sucesso-resumo,
.sucesso-resumo .card,
.sucesso-resumo .table-responsive {
    border: none !important;
    box-shadow: none !important;
    background-color: transparent !important;
}

/* Truncate específico para Links na tabela */
.truncate-link {
    display: inline-block;
    max-width: 275px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    
    color: #444; 
    text-decoration: none; 
    font-weight: 500;
}

/* Modo escuro para o link (se ainda precisares) */
[data-bs-theme="dark"] .truncate-link {
    color: #ffffff !important;
}

/* Truncate específico para a Referência (Aprox. 10 caracteres) */
.truncate-ref {
    display: inline-block; 
    max-width: 10ch;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}
[data-bs-theme="dark"] .truncate-ref {
    color: #ffffff !important;
}

/* --- Restante formatação (Fundo, alinhamentos, etc) --- */
.carrinho-table th { 
    background: var(--gray-light); 
    padding: 14px 10px; 
    text-align: center; 
    font-weight: 600; 
}

.carrinho-table td { 
    padding: 16px 10px; 
    vertical-align: middle; 
    text-align: center; 
}

/* ========================================================
   ALINHAMENTO ESPECÍFICO: NOME COLADO À REFERÊNCIA
   ======================================================== */

/* 1. Reduz o espaço morto à direita da Referência (2ª coluna) */
.carrinho-table th:nth-child(2), 
.carrinho-table td:nth-child(2) {
    padding-right: 5px !important;
    width: 140px;
}

/* 2. Encosta o cabeçalho e o texto do Nome (3ª coluna) à esquerda */
.carrinho-table th:nth-child(3), 
.carrinho-table td:nth-child(3) {
    text-align: left !important;
    padding-left: 0 !important;
}

.carrinho-table td a { 
    color: #444; 
    text-decoration: none; 
    font-weight: 500; 
}

.cart-img img { width: 60px; height: 60px; object-fit: cover; border-radius: 6px; }
.carrinho-resumo { background: var(--white); border: 1px solid var(--cor-principal); border-radius: var(--radius); padding: 22px; }
.promo-form { margin-bottom: 20px; border-bottom: 1px solid var(--gray); }
.resumo-linhas { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; border: 1px solid var(--gray); }
.resumo-linha { display: flex; justify-content: space-between; font-size: 14px; padding: 5px 9px; border-bottom: 1px solid var(--gray); }
.resumo-linha--desconto { color: var(--cor-principal); }
.resumo-linha--total { font-size: 17px; font-weight: 700; padding: 12px 16px; }

/* ---------- CHECKOUT ---------- */
.checkout-layout {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 32px;
    padding: 40px 0;
    align-items: start;
}
/* Remove a borda e o fundo geral do formulário */
.checkout-form-wrapper {
    background: transparent;
    border: none; 
    padding: 0;
    overflow: visible;
}

/* Coloca a borda azul e o fundo cinza APENAS no título principal */
.checkout-section-header {
    background: var(--gray-light, #f4f4f4);
    border: 1px solid var(--navy, #1e2b4d);
    padding: 14px 24px;
    font-size: 16px;
    font-weight: 700;
    color: var(--navy, #1e2b4d);
    margin-bottom: 30px;
}
.checkout-form-wrapper .form-group,
.checkout-form-wrapper .form-row,
.checkout-form-wrapper .radio-group { 
    padding-left: 0; 
    padding-right: 0; 
}
.checkout-form-wrapper hr.divider { padding-left: 24px; padding-right: 24px; }
.checkout-form-wrapper hr.divider { border: none; border-top: 1px solid var(--navy); margin: 30px 0; }
.form-group--inline { display: grid; grid-template-columns: 140px 1fr; align-items: center; gap: 14px; margin-bottom: 14px; }
.form-group--inline label { font-size: 14px; font-weight: 500; }
.checkout-resumo {
    background: var(--white);
    border: 1px solid var(--gray);
    border-radius: var(--radius);
    padding: 22px;
}
.checkout-resumo h3 { font-size: 18px; font-weight: 700; margin-bottom: 16px; }
.checkout-item { display: flex; align-items: center; gap: 14px; padding: 12px 24px; border-bottom: 1px solid var(--gray); font-size: 14px; }
.checkout-item img { width: 50px; height: 50px; object-fit: cover; border-radius: 6px; }
.checkout-item__name { flex: 1; font-weight: 500; }
.checkout-item__qty  { color: var(--gray-mid); }
.checkout-item__total { font-weight: 700; }
.dados-row { display: grid; grid-template-columns: 140px 1fr; align-items: center; gap: 14px; margin-bottom: 12px; }
.dados-row label { font-size: 14px; font-weight: 500; }

/* ---------- CONTA ---------- */
.conta-content { padding: 0 0 48px;  }
.conta-nav {
    display: flex;
    gap: 16px;
   width: 100%;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: -55px;
    position: relative;
    z-index: 10;
    margin-bottom: 40px;
}
.conta-nav__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    background: var(--white);
    border: none; 
    border-radius: 12px; 
    
    /* AS DUAS LINHAS ALTERADAS */
    flex: 1; /* Faz o cartão esticar para ocupar o espaço livre */
    min-width: 120px; /* Garante que nunca ficam mais pequenos que o teu tamanho original */
    
    height: 120px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 700;
    color: var(--text);
    transition: all 0.3s ease;
    text-align: center;
    box-shadow: 0 4px 15px rgba(0,0,0,0.06);
    text-decoration: none;
}
.conta-nav__item i { font-size: 32px; color: var(--cor-principal); transition: color var(--transition); }
.conta-nav__item:hover,
.conta-nav__item.active { transform: translateY(-6px); box-shadow: 0 10px 25px rgba(0,0,0,0.12); color: var(--cor-principal); }
.conta-nav__item:hover i,
.conta-nav__item.active i { color: var(--red);}
.button.conta-nav__item { outline: none; }
.conta-nav__item--logout i { color: var(--text); }
.conta-nav__item--logout:hover i { color: var(--red); }
/* ==========================================================
       IGNORAR O FORM DO LARAVEL NO LAYOUT
       ========================================================== */
    .conta-nav form {
        display: contents !important; 
    }

.conta-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 30px;
}
.stat-card {
    background: var(--white);
    border: 1px solid var(--cor-principal);
    border-radius: 8px;
    padding: 20px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    width: 100%;
}
.stat-card__top {display: flex;align-items: center;justify-content: center;gap: 18px;}
.stat-card i { font-size: 38px;color: var(--red); }
.stat-card__num { font-size: 42px; font-weight: 700; color: var(--cor-principal); line-height: 1;}
.stat-card__label { font-size: 13px; font-weight: 700; color: var(--text); }

/* A Caixa Principal */
.comercial-card {
    background-color: transparent;
    border: 1px solid var(--cor-principal) !important;
    border-radius: var(--radius, 12px);
    box-shadow: none !important;
}
/* O Ícone Solto */
.comercial-card__icon i { 
    font-size: 50px; 
    color: var(--cor-principal); 
}
/* Os Separadores Verticais (Só aparecem no Desktop graças ao d-none d-md-block) */
.comercial-card__sep { 
    width: 1px; 
    height: 45px; 
    background-color: #000000;
}
/* Os Títulos (Comercial, Email, Telefone) */
.comercial-card__label { 
    color: var(--cor-principal); 
}

/* Os Nomes, Emails e Telefones */
.comercial-card__name, 
.comercial-card__value { 
    color: var(--cor-principal) !important;
    font-weight: 700;
}
@media (min-width: 992px) {
    .conta-content {
        max-width: 790px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

.conta-section { margin-bottom: 40px; }
.conta-section__title { font-size: 18px; font-weight: 700; color: var(--red); margin-bottom: 18px; }


    /* 5. QUANTIDADE (Puxada mais para dentro) */
    .tabela-ultimos-produtos th:nth-child(5),
    .tabela-ultimos-produtos td:nth-child(5) {
        width: 20% !important;
        text-align: center !important;
    }

    /* 6. TOTAL (Puxado mais para dentro com ajuda de margem interna) */
    .tabela-ultimos-produtos th:nth-child(6),
    .tabela-ultimos-produtos td:nth-child(6) {
        width: 18%; /* Aumentamos a largura para o centro da coluna vir mais para a esquerda */
        text-align: center !important; 
        padding-right: 3rem !important; /* Cria um espaço vazio obrigatório na ponta direita */
    }
     

    /* 2. DESCRIÇÃO (Puxada mais para a direita) */
    .tabela-produtos-favoritos th:nth-child(2),
    .tabela-produtos-favoritos td:nth-child(2) {
        width: 58%;
        text-align: left !important; 
        padding-left: 15rem !important; /* <-- Aumenta este valor (ex: 5rem, 6rem) para empurrar mais para a direita */
    }

    /* 3. VALOR UNITÁRIO (Puxado mais para a esquerda) */
    .tabela-produtos-favoritos th:nth-child(3),
    .tabela-produtos-favoritos td:nth-child(3) {
        width: 15%;
        text-align: center !important; 
        padding-right: 15rem !important; /* <-- Aumenta este valor (ex: 5rem, 6rem) para empurrar mais para a esquerda */
    }
    .conta-content {
    padding-bottom: 3rem; /* ou o padding que já lá tinhas */
    
    /* ADICIONAS SÓ ISTO: */
    max-width: 1140px !important; /* Usa o número que assentou bem no teu painel */
    width: 100% !important;
}
/* --- TABELA DE ENCOMENDAS (Estilo Tabela Clássica Limpa) --- */
.conta-table { 
    width: 100%; 
    border-collapse: separate; 
    border-spacing: 0; 
    font-size: 14px; 
    border: 1px solid var(--cor-principal, #1593c6) !important;
    border-radius: var(--radius, 12px) !important;
    overflow: hidden;
    table-layout: auto;
}

/* Protege o Valor Uni. (5) E o Total (6) contra quebras */
.conta-table td:nth-child(5), .conta-table th:nth-child(5),
.conta-table td:nth-child(6), .conta-table th:nth-child(6) {
    white-space: nowrap !important;
}

/* --- TRUQUE PARA JUNTAR O TEXTO À IMAGEM --- */

/* 1. A coluna da Imagem (1ª) encolhe e ocupa apenas os 50px da foto */
.conta-table th:nth-child(1),
.conta-table td:nth-child(1) {
    width: 1%;
    white-space: nowrap;
    padding-right: 16px !important;
}

/* 2. As últimas colunas da direita (Quantidade e Total) também encolhem */
.conta-table th:nth-last-child(1), .conta-table td:nth-last-child(1),
.conta-table th:nth-last-child(2), .conta-table td:nth-last-child(2) {
    width: 1%;
    white-space: nowrap;
}

/* Cabeçalho cinza suave */
.conta-table thead { 
    background-color: #f8f9fa; 
}

.conta-table th { 
    white-space: nowrap;
    padding: 16px 14px; 
    text-align: left; 
    font-weight: 600; 
    font-size: 13px;
    border-bottom: 1px solid var(--gray, #dee2e6) !important;
}

/* Células: apenas a linha horizontal a separar */
.conta-table td { 
    padding: 14px; 
    border-bottom: 1px solid var(--gray, #dee2e6) !important; 
    border-top: none !important;
    border-left: none !important; 
    border-right: none !important;
    vertical-align: middle; 
}

/* Remover a linha inferior do último produto */
.conta-table tbody tr:last-child td {
    border-bottom: none !important;
}

/* Ajuste da imagem para ficar igual ao carrinho */
.conta-table td img { 
    width: 55px; 
    height: 55px; 
    object-fit: cover; 
    border-radius: 6px; 
}

.estado-badge {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
}
.badge-success { background: #d4edda; color: #155724; }
.badge-warning { background: #fff3cd; color: #856404; }
.badge-info    { background: #d1ecf1; color: #0c5460; }
.badge-primary { background: #cce5ff; color: #004085; }
.badge-danger  { background: #f8d7da; color: #721c24; }

/* Estado text colors */
.text-green { color: #28a745; }
.text-red   { color: var(--red); }
.text-teal  { color: var(--cor-principal); }
.text-muted { color: var(--gray-mid); }

/* --- PAGINAÇÃO MINIMALISTA --- */

/* 1. Remover o "pedaço branco" (Retira margens gigantes) */
.paginacao-simples {
    margin-bottom: 0 !important; 
    padding-bottom: 10px;
}

/* 2. Suavizar as palavras "Showing..." */
.paginacao-simples p.small {
    margin-bottom: 0 !important;
    color: #888;
    font-size: 13px;
}

/* 3. Os Quadrados e o Gap */
.paginacao-simples .pagination {
    margin-left: 24px !important;
    gap: 6px;
    margin-bottom: 0;
    align-items: center;
}

/* 4. Estilo dos Quadrados (Pequenos e Minimalistas) */
.paginacao-simples .page-link {
    width: 32px;
    height: 32px;
    padding: 0 !important;
    
    display: flex;
    align-items: center;
    justify-content: center;
    
    font-size: 13px;
    font-weight: 500;
    color: #555;
    background-color: transparent;
    border: 1px solid #e0e0e0;
    border-radius: 6px !important;
    box-shadow: none !important;
    transition: all 0.2s ease;
}

/* Quadrado quando passas o rato */
.paginacao-simples .page-link:hover {
    background-color: #f8f9fa;
    border-color: #ccc;
    color: #333;
}

/* Quadrado Ativo (Página atual) */
.paginacao-simples .page-item.active .page-link {
    background-color: var(--cor-principal, #1593c6);
    color: white;
    border-color: var(--cor-principal, #1593c6);
}

/* Quadrados desativados (ex: Setas quando já não dá para recuar) */
.paginacao-simples .page-item.disabled .page-link {
    opacity: 0.4;
    background-color: transparent;
    border-color: #e0e0e0;
}

/* ---------- MORADA FORM ---------- */
.morada-form { max-width: 680px; margin-bottom: 32px; margin-left: auto;
    margin-right: auto; }

/* ---------- AUTH ---------- */
.auth-wrapper { padding: 60px 0; display: flex; justify-content: center; }
.auth-card {
    background: var(--white);
    border: 1px solid var(--gray);
    border-radius: var(--radius);
    padding: 40px;
    width: 100%;
    max-width: 420px;
    box-shadow: var(--shadow);
}
.auth-card--wide { max-width: 640px; }
.auth-card__header { text-align: center; margin-bottom: 28px; }
.auth-card__header img { margin: 0 auto 16px; }
.auth-card__header h2 { font-size: 22px; font-weight: 700; }
.auth-form { display: flex; flex-direction: column; gap: 16px; }
.auth-card__footer { text-align: center; margin-top: 22px; font-size: 14px; color: var(--gray-mid); }

/* ---------- FORMS ---------- */
.form-control {
    width: 100%;
    border: 1.5px solid var(--gray);
    border-radius: 8px;
    padding: 10px 14px;
    font-size: 14px;
    color: var(--text);
    transition: border-color var(--transition);
    background: var(--white);
    outline: none;
    font-family: var(--font);
}
.form-control:focus { border-color: var(--cor-principal); }
.form-control.is-invalid { border-color: var(--red); }
.invalid-feedback { color: var(--red); font-size: 12px; display: block; margin-top: 4px; }
.form-group { margin-bottom: 16px; }
.form-group label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; color: var(--navy); }
.form-group--row { display: flex; justify-content: space-between; align-items: center; }
.form-row { display: grid; gap: 16px; margin-bottom: 16px; }
.form-row--2 { grid-template-columns: 1fr 1fr; }
.form-row--3 { grid-template-columns: 1fr 1fr 1fr; }
.form-actions { margin-top: 20px; }
.radio-group { display: flex; flex-direction: row ; gap: 30px; padding-top: 8px; flex-wrap: wrap; }
.radio-group1 { display: flex; flex-direction: column; gap: 12px; padding-top: 8px; flex-wrap: wrap; }
.radio-label { display: flex; align-items: center; gap: 15px !important ; font-size: 14px; cursor: pointer; }
.radio-label input { accent-color: var(--cor-principal); }
.input-password { position: relative; }
.input-password .form-control { padding-right: 44px; }
.toggle-password {
    position: absolute;
    right: 13px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: var(--gray-mid);
    cursor: pointer;
    font-size: 15px;
}
.link-forgot { font-size: 13px; color: var(--cor-principal); }

/* ---------- NEWSLETTER (Domada e Elegante) ---------- */

.newsletter {
    background: var(--cor-principal);
    border-radius: 20px;
    
    max-width: 1100px;
    margin: 60px auto;
    overflow: hidden;
}

.newsletter__inner {
    background-color: transparent !important;
    color: #ffffff !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 40px 50px;
    gap: 30px;
    flex-wrap: wrap;
}

.newsletter__text { 
    color: var(--white); 
    flex: 1;
    min-width: 300px;
}

/* 2. O TÍTULO DOMADO */

.newsletter__text h2 { 
    font-size: 32px;
    font-weight: 800; 
    line-height: 1.2; 
    margin-bottom: 10px; 
}

.newsletter__text h2 em { font-style: normal; }
.newsletter__text p  { font-size: 15px; margin-bottom: 24px; opacity: 0.9; }

/* 3. O FORMULÁRIO ENCOLHIDO */

.newsletter__form { 
    display: flex; 
    gap: 15px; 
    border-radius: 0; 
    overflow: visible; 
    max-width: 500px; 
    flex-wrap: wrap; 
}

.newsletter__form input {
    flex: 1;
    border: none;
    padding: 12px 20px;
    font-size: 14px;
    outline: none;
    border-radius: 8px;
    min-width: 200px;
}

.newsletter__form .btn { 
    border-radius: 8px; 
    font-size: 15px; 
    padding: 12px 28px;
    white-space: nowrap; 
}

.newsletter__text small { font-size: 11px; opacity: 0.7; display: block; margin-top: 10px; }

/* 4. A IMAGEM NO SÍTIO CERTO */

.newsletter__image { 
    flex-shrink: 0; 
    display: flex;
    align-items: center;
    justify-content: center;
}

.newsletter__image img { 
    max-height: 180px;
    width: auto; 
}

/* ---------- FOOTER ---------- */
.footer { background: var(--white);padding: 48px 0 0; }
.footer__grid {
    display: grid;
    grid-template-columns: 180px 1fr 1fr 1.5fr;
    gap: 40px;
    padding-bottom: 40px;
}
.footer__brand img { margin-bottom: 14px; }
.footer__col h4 { font-size: 20px; font-weight: 700; color: var(--red); margin-bottom: 16px; }
.footer__col ul { display: flex; flex-direction: column; gap: 8px; padding: 0; list-style: none; }
.footer__col ul li a { font-size: 15px; font-weight: 700; color: var(--cor-principal); transition: color var(--transition); }
.footer__col ul li a:hover { color: var(--cor-principal); }
.footer__col p { font-size: 15px;  font-weight: 700; color: var(--cor-principal) !important; margin-bottom: 6px; }
.footer__col a { color: var(--blue); }
.footer__col a:hover { color: var(--cor-principal); }
.footer__bottom {
    background: var(--red);
    color: rgba(255,255,255,.8);
    text-align: center;
    padding: 14px;
    font-size: 13px;
}

/* ---------- SOBRE ---------- */
.sobre-quem { padding: 56px 0; }
.sobre-quem__layout { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.sobre-quem__img img { border-radius: var(--radius); width: 100%; }
.sobre-quem__text h2 { font-size: 26px; font-weight: 800; margin-bottom: 6px; color: var(--red); }
.sobre-quem__text .subtitle { color: var(--cor-principal) !important; font-weight: 600; margin-bottom: 16px; font-style: italic; }
.sobre-quem__text p { font-size: 14px; color: var(--gray-mid); margin-bottom: 10px; line-height: 1.7; }
.sobre-valores { padding: 0 0 48px; }
.valores-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.valor-card { text-align: center; padding: 30px 20px; }
.valor-card__icon { font-size: 48px; color: var(--cor-principal) !important; margin-bottom: 14px; }
.valor-card h3 { font-size: 18px; font-weight: 700; color: var(--cor-principal) !important; margin-bottom: 8px; }
.valor-card p  { font-size: 13px; color: var(--gray-mid); }
.sobre-galeria { background-color: var(--cor-principal) !important; border-color: var(--cor-principal) !important; color: #ffffff !important; padding: 48px 0; margin-bottom: 48px; }
.sobre-galeria .section-title { color: var(--white); margin-bottom: 24px; text-align: center; }
.galeria-slider { display: flex; align-items: center; gap: 16px; }
.galeria-track { display: flex; gap: 16px; flex: 1; overflow: hidden; }
.galeria-track img { border-radius: var(--radius); height: 220px; width: auto; object-fit: cover; flex: 1; }
.sobre-galeria .slider-btn { border-color: rgba(255,255,255,.4); color: var(--white); }
.sobre-galeria .slider-btn:hover { background: rgba(255,255,255,.15); }
.missao-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; margin-top: 36px; }
.missao-card { text-align: center; padding: 20px; }
.missao-card__icon { font-size: 44px; color: var(--cor-principal) !important; margin-bottom: 14px; }
.missao-card h3 { font-size: 17px; font-weight: 700; color: var(--cor-principal) !important; margin-bottom: 10px; }
.missao-card p  { font-size: 13px; color: var(--gray-mid); line-height: 1.6; }
.area-mapa { text-align: center; margin-top: 30px; }
.area-mapa img { max-width: 480px; margin: 0 auto; }
.hide-scrollbar {
    -ms-overflow-style: none;  /* IE e Edge */
    scrollbar-width: none;  /* Firefox */
}

.hide-scrollbar::-webkit-scrollbar {
    display: none; /* Chrome, Safari e Opera */
}
/* ---------- REVENDA FORM ---------- */
.revenda-form-wrapper { padding: 48px 0; max-width: 760px; margin: 0 auto; }
.revenda-form { background: transparent; border: none; padding: 36px; }

/* ---------- CONTACTOS ---------- */
.contactos-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; padding: 56px 0; }
.contactos-info h2 { font-size: 26px; font-weight: 700; margin-bottom: 10px; }
.contactos-info > p { color: var(--gray-mid); margin-bottom: 28px; font-size: 14px; }
.contactos-lista { display: flex; flex-direction: column; gap: 20px; margin-bottom: 28px; }
.contactos-lista li { display: flex; gap: 16px; align-items: flex-start; }
.contactos-lista i { font-size: 20px; color: var(--cor-principal); margin-top: 2px; }
.contactos-lista strong { display: block; font-size: 13px; font-weight: 700; margin-bottom: 3px; }
.contactos-lista span, .contactos-lista a { font-size: 14px; color: var(--gray-mid); }
.contactos-lista small { font-size: 11px; color: var(--gray-mid); display: block; }
.contactos-social { display: flex; gap: 12px; flex-wrap: wrap; }
.social-btn { width: 50px; height: 50px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--white); font-size: 16px; }
.social-btn--facebook { background: #1877f2; }
.social-btn--youtube   { background: #ff0000; }
.social-btn--twitter   { background: #1da1f2; }

.contactos-form { display: flex; flex-direction: column; gap: 16px; }

/* ---------- EMPTY STATE ---------- */
.empty-state { text-align: center; padding: 60px 20px;}
.empty-state i { display: inline-block; font-size: 64px; color: var(--gray); margin-bottom: 20px; }
.empty-state p { font-size: 16px; color: var(--gray-mid); margin-bottom: 24px; }
.empty-msg { font-size: 14px; color: var(--gray-mid); }

/* ---------- SUCESSO ---------- */
.sucesso-wrapper { padding: 60px 0; display: flex; justify-content: center; }
.sucesso-card { text-align: center; max-width: 680px; width: 100%; }
.sucesso-card__icon { font-size: 72px; color: #28a745; margin-bottom: 20px; }
.sucesso-card h2 { font-size: 28px; font-weight: 700; margin-bottom: 8px; }
.sucesso-card p  { font-size: 15px; color: var(--gray-mid); margin-bottom: 6px; }
.sucesso-resumo { margin: 30px 0; border: 1px solid var(--cor-principal); border-radius: var(--radius); overflow: hidden; }
.sucesso-actions { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }

/* ---------- PAGINATION ---------- */
.pagination-wrapper { margin-top: 28px; display: flex; justify-content: center; }
.pagination-wrapper nav { display: flex; gap: 6px; flex-wrap: wrap; }
.pagination-wrapper span, .pagination-wrapper a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 14px;
    border: 1.5px solid var(--gray);
    border-radius: 8px;
    font-size: 14px;
    color: var(--text);
    background: var(--white);
    transition: all var(--transition);
}
.pagination-wrapper a:hover { border-color: var(--cor-principal); color: var(--cor-principal); }
.pagination-wrapper [aria-current] { background: var(--cor-principal); border-color: var(--cor-principal); color: var(--white); }

/* ---------- FILTER COLLAPSE ---------- */
.filter-group--collapsible .filter-group__body { display: flex; }
.filter-group--collapsible.collapsed .filter-group__body { display: none; }

/* DARK MODE COMPLETO */
[data-bs-theme="dark"] body,
[data-bs-theme="dark"] .bg-light,
[data-bs-theme="dark"] .card,
[data-bs-theme="dark"] .product-card,
[data-bs-theme="dark"] .header,
[data-bs-theme="dark"] .navbar,
[data-bs-theme="dark"] .footer,
[data-bs-theme="dark"] .loja-sidebar,
[data-bs-theme="dark"] .filter-sidebar,
[data-bs-theme="dark"] .carrinho-resumo,
[data-bs-theme="dark"] .checkout-resumo,
[data-bs-theme="dark"] .carrinho-table th,
[data-bs-theme="dark"] .carrinho-table td,
[data-bs-theme="dark"] .produto-iva-info {
    background-color: #1f1f1f !important;
    border-color: #333333 !important;
    color: #e0e0e0 !important;
}

[data-bs-theme="dark"] .card-img-top,
[data-bs-theme="dark"] .product-image,
[data-bs-theme="dark"] .img-wrapper,
[data-bs-theme="dark"] .product-img-box {
    background-color: #ffffff !important;
    padding: 10px;
    border-radius: var(--bs-border-radius) var(--bs-border-radius) 0 0;
}

[data-bs-theme="dark"] h1, 
[data-bs-theme="dark"] h2, 
[data-bs-theme="dark"] h3, 
[data-bs-theme="dark"] h4, 
[data-bs-theme="dark"] h5, 
[data-bs-theme="dark"] h6,
[data-bs-theme="dark"] p,
[data-bs-theme="dark"] .card-text,
[data-bs-theme="dark"] .form-check-label,
[data-bs-theme="dark"] .product-card h3 a,
[data-bs-theme="dark"] .product-card h4 a,
[data-bs-theme="dark"] .product-title,
[data-bs-theme="dark"] .product-title a,
[data-bs-theme="dark"] .categoria-pill,
[data-bs-theme="dark"] .produto-card__name,
[data-bs-theme="dark"] .form-group label,
[data-bs-theme="dark"] .form-row label,
[data-bs-theme="dark"] .radio-label,
[data-bs-theme="dark"] .checkout-form-wrapper label,
[data-bs-theme="dark"] .revenda-form-wrapper label {
    color: #f5f5f5 !important;
}

[data-bs-theme="dark"] .categoria-pill span{ color:  var(--cor-principal) !important; }
[data-bs-theme="dark"] .produto-card__name:hover { color: var(--cor-principal) !important; }
[data-bs-theme="dark"] .price,
[data-bs-theme="dark"] h3.text-primary,
[data-bs-theme="dark"] strong.text-primary { color: var(--cor-principal) !important; }
[data-bs-theme="dark"] .price--original { color: #999999 !important; }

[data-bs-theme="dark"] .search-box__cat,
[data-bs-theme="dark"] .navbar__menu .dropdown,
[data-bs-theme="dark"] .search-box__cat option,
[data-bs-theme="dark"] select.search-box__cat {
    background-color: #1f1f1f !important;
    border-color: #333333 !important;
    color: #e0e0e0 !important;
}

[data-bs-theme="dark"] .navbar__menu li a,
[data-bs-theme="dark"] .navbar__menu .dropdown li a,
[data-bs-theme="dark"] .header__action {
    color: #e0e0e0 !important;
}

[data-bs-theme="dark"] .navbar__menu li.active > a,
[data-bs-theme="dark"] .navbar__menu li:hover > a,
[data-bs-theme="dark"] .navbar__menu .dropdown li a:hover,
[data-bs-theme="dark"] .header__action:hover {
    background-color: transparent !important;
    color: var(--cor-principal) !important;
}

[data-bs-theme="dark"] .search-box__cat { border-right-color: #333333 !important; }

[data-bs-theme="dark"] .footer p,
[data-bs-theme="dark"] .footer span,
[data-bs-theme="dark"] .footer a {
    color: #b0b0b0 !important;
}

[data-bs-theme="dark"] .footer h4 { color: #ffffff !important; }
[data-bs-theme="dark"] .footer a:hover { color: var(--cor-principal) !important; }

[data-bs-theme="dark"] .loja-sidebar .filter-group__label,
[data-bs-theme="dark"] .loja-sidebar .checkbox-label,
[data-bs-theme="dark"] .loja-sidebar .price-range__labels span,
[data-bs-theme="dark"] .loja-sidebar .filter-toggle,
[data-bs-theme="dark"] .loja-sidebar .filter-toggle i {
    color: #e0e0e0 !important;
}

[data-bs-theme="dark"] .loja-sidebar .btn--outline {
    border-color: #e0e0e0 !important;
    color: #e0e0e0 !important;
}

[data-bs-theme="dark"] .loja-sidebar .btn--outline:hover {
    background-color: #333333 !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .btn-icon,
[data-bs-theme="dark"] .qty-control,
[data-bs-theme="dark"] .qty-btn,
[data-bs-theme="dark"] .qty-input {
    background-color: transparent !important;
    border-color: #555555 !important;
    color: #e0e0e0 !important;
}

[data-bs-theme="dark"] .qty-btn:hover,
[data-bs-theme="dark"] .btn-icon:hover {
    background-color: #333333 !important;
    color: #ffffff !important;
}

[data-bs-theme="dark"] .promo-form .form-control {
    background-color: #121212 !important;
    color: #e0e0e0 !important;
    border-color: #333333 !important;
}

[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] input.form-control,
[data-bs-theme="dark"] textarea.form-control,
[data-bs-theme="dark"] select.form-control,
[data-bs-theme="dark"] .select-caixa {
    background-color: #2a2a2a !important;
    border-color: #444444 !important;
    color: #e0e0e0 !important;
}

[data-bs-theme="dark"] .form-control:focus {
    border-color: var(--cor-principal) !important;
    box-shadow: 0 0 0 3px rgba(43,168,181,.15) !important;
}

[data-bs-theme="dark"] .form-control::placeholder {
    color: #777777 !important;
}

[data-bs-theme="dark"] .conta-nav__item {
    background-color: #2a2a2a !important;
    border-color: #444444 !important;
    color: #e0e0e0 !important;
}

[data-bs-theme="dark"] .conta-nav__item:hover,
[data-bs-theme="dark"] .conta-nav__item.active {
    background-color: #333333 !important;
    border-color: var(--cor-principal) !important;
    color: var(--cor-principal) !important;
}

[data-bs-theme="dark"] select.form-control option,
[data-bs-theme="dark"] select option {
    background-color: #2a2a2a !important;
    color: #e0e0e0 !important;
}

[data-bs-theme="dark"] .checkout-section-header {
    background-color: #2a2a2a !important;
    border-color: #555555 !important;
    color: #e0e0e0 !important;
}

[data-bs-theme="dark"] .toggle-password {
    color: #999999 !important;
}

[data-bs-theme="dark"] .toggle-password:hover {
    color: var(--cor-principal) !important;
}

[data-bs-theme="dark"] .navbar__social a {
    color: #ffffff !important;
}

[data-bs-theme="dark"] .navbar__social a:hover {
    color: var(--cor-principal) !important;
}

[data-bs-theme="dark"] .conta-nav__item--logout i {
    color: var(--cor-principal) !important;
}

[data-bs-theme="dark"] .conta-nav__item--logout:hover i {
    color: var(--red) !important;
}

[data-bs-theme="dark"] .search-box__btn {
    background-color: #2a2a2a !important;
    border-color: #444444 !important;
    color: #e0e0e0 !important;
}

[data-bs-theme="dark"] .search-box__btn:hover {
    background-color: #333333 !important;
    color: var(--cor-principal) !important;
}

[data-bs-theme="dark"] .search-box {
    background-color: #2a2a2a !important;
    border-color: #444444 !important;
}

[data-bs-theme="dark"] .search-box__input {
    background-color: #2a2a2a !important;
    color: #e0e0e0 !important;
}

[data-bs-theme="dark"] .search-box__input::placeholder {
    color: #777777 !important;
}

[data-bs-theme="dark"] .conta-nav__item {
    background-color: #181818 !important;
    border-color: #333333 !important;
}

[data-bs-theme="dark"] .conta-nav__item:hover,
[data-bs-theme="dark"] .conta-nav__item.active {
    background-color: #222222 !important;
    border-color: var(--cor-principal) !important;
}

[data-bs-theme="dark"] .conta-table th {
    background-color: #111111 !important;
    color: #e0e0e0 !important;
    border-bottom: 2px solid #333333 !important;
}

[data-bs-theme="dark"] .morada-form .checkout-section-header {
    background-color: #111111 !important;
    color: #e0e0e0 !important;
    border-color: #333333 !important;
}

[data-bs-theme="dark"] .stat-card {
    background-color: #222222 !important;
    border-color: var(--cor-principal) !important;
}

[data-bs-theme="dark"] .stat-card__label {
    color: #e0e0e0 !important;
}

[data-bs-theme="dark"] .stat-card i {
    color: #ff4d6d !important;
}

[data-bs-theme="dark"] .stat-card__num {
    color: var(--cor-principal) !important;
}

/* ==========================================================
       DARK MODE: TABELA DO CARRINHO NA COR PRINCIPAL
       ========================================================== */
    [data-bs-theme="dark"] .carrinho-table {
        border-left-color: var(--cor-principal) !important;
        border-right-color: var(--cor-principal) !important;
    }

    [data-bs-theme="dark"] .carrinho-table th,
    [data-bs-theme="dark"] .carrinho-table td {
        border-top-color: var(--cor-principal) !important;
        border-bottom-color: var(--cor-principal) !important;
    }

    [data-bs-theme="dark"] .carrinho-table td:nth-child(2) a {
        color: var(--cor-principal) !important;
    }

[data-bs-theme="dark"] .truncate-link {
    color: #ffffff !important;
}

[data-bs-theme="dark"] .truncate-ref {
    color: #ffffff !important;
}

[data-bs-theme="dark"] .comercial-card {
    background-color: transparent;
    border: 1px solid var(--cor-principal) !important;
    border-radius: var(--radius, 12px);
    box-shadow: none !important;
}
/* ==========================================================
       SOMBRAS DO SLIDER NO DARK MODE
       ========================================================== */
    [data-bs-theme="dark"] .parceiros-fade--left {
        background: linear-gradient(to right, var(--bs-body-bg, #212529) 15%, transparent 100%);
    }

    [data-bs-theme="dark"] .parceiros-fade--right {
        background: linear-gradient(to left, var(--bs-body-bg, #212529) 15%, transparent 100%);
    }

    [data-bs-theme="dark"] .price--final {
        margin-bottom: 0.5rem !important; /* O valor equivalente ao mb-2 */
        color: var(--bs-light) !important; /* Garante que o preço se destaca no fundo escuro */
        font-weight: 700 !important;
        display: block !important;
    }

    /* ==========================================================
       DARK MODE: DESCRIÇÃO DO PRODUTO (MODO LISTA)
       ========================================================== */
    [data-bs-theme="dark"] .produto-list-item__desc {
        color: var(--bs-gray-300) !important; /* Cor de texto legível para fundo escuro */
    }
    [data-bs-theme="dark"] .carrinho-resumo {
        border-color: var(--cor-principal) !important;
    }