body {
    min-width: 372px;
}

.wrapper {
    min-height: 100vh;
}

p.truncar-3l {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media screen and (max-width: 469px) {
    .mt-xs-3 {
        margin-top: 1rem;
    }
}

label:hover .text-dark {
    transition: color 0.2s ease;
    color: white !important;
}

label .text-dark {
    transition: color 0.2s ease;
}

/* complementado para compatibilizar com Bootstrap >5.3.x mantendo o mesmo efeito de hover */
.btn-check:checked+.btn-outline-danger h3,
.btn-check:active+.btn-outline-danger h3,
.btn-check:hover+.btn-outline-danger h3,
.btn-check:checked+.btn-outline-danger hr,
.btn-check:active+.btn-outline-danger hr,
.btn-check:hover+.btn-outline-danger hr,
.btn-check:checked+.btn-outline-danger h4,
.btn-check:active+.btn-outline-danger h4,
.btn-check:hover+.btn-outline-danger h4,
.btn-check:checked+.btn-outline-danger p,
.btn-check:active+.btn-outline-danger p,
.btn-check:hover+.btn-outline-danger p,
.btn-check:checked+.btn-outline-danger .text-dark,
.btn-check:active+.btn-outline-danger .text-dark,
.btn-check:hover+.btn-outline-danger .text-dark {
    transition: color 0.2s ease;
    color: white !important;
}

/* adicionado para compatibilizar com Bootstrap >5.3.x mantendo o mesmo efeito de hover */
.btn-check:checked+.btn-outline-danger,
.btn-check:active+.btn-outline-danger,
.btn-check:hover+.btn-outline-danger {
    transition: background-color 0.2s ease;
    background-color: #5f49ac !important; /* Roxo Principal */
    border-color: #5f49ac !important; /* Roxo Principal */
}

.flex-even {
    flex: 1;
    min-width: 300px;
}

.accordion-button:not(.collapsed) {
    color: white;
    background-color: #5f49ac; /* Roxo Principal */
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg>");
}

fieldset.row .form-floating>label {
    margin-left: calc(var(--bs-gutter-x) * 0.5);
}

/* adicionado para deixar links de paginação na nova cor de destaque */
.page-link {
    color: #5f49ac; /* Roxo Principal */
}

/* Sobrescrever a cor dos links de paginação ativos/hover */
.page-item.active .page-link,
.page-link:hover {
    background-color: #5f49ac; /* Roxo Principal */
    border-color: #5f49ac; /* Roxo Principal */
    color: white; /* Texto branco */
}

.produto-imagem {
    width: 150px;
    height: 150px;
    object-fit: contain;
}

.align-self-end.d-flex {
    flex-direction: row;
    align-items: center;
}

#authLinks {
    margin-right: 10px;
}

.row.g-3 {
    display: flex;
    flex-wrap: wrap;
    margin-left: calc(var(--bs-gutter-x) * -0.5);
    margin-right: calc(var(--bs-gutter-x) * -0.5);
}

.col-12,
.col-sm-6,
.col-md-4,
.col-lg-3,
.col-xl-2 {
    display: flex;
    flex-direction: column;
    margin-bottom: var(--bs-gutter-y);
    padding-left: calc(var(--bs-gutter-x) * 0.5);
    padding-right: calc(var(--bs-gutter-x) * 0.5);
}

.card {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.card-body {
    flex-grow: 1;
}

.card-footer {
    margin-top: auto;
}

.produto-imagem {
    width: 100%;
    height: auto;
    object-fit: contain;
    max-height: 200px;
}

/* --- Customizações de Cores --- */

/* Sobrescrever a cor da navbar (bg-danger) */
.navbar.bg-danger {
    background-color: #5f49ac !important; /* Roxo Principal */
    border-color: #4c3b8a !important; /* Um tom ligeiramente mais escuro para a borda */
}

/* Mudar a cor dos botões principais (sólidos) */
.btn-danger,
.btn-primary,
.btn-success,
.btn-info {
    background-color: #5f49ac !important;
    border-color: #5f49ac !important;
    color: white !important; /* Garante que o texto seja branco */
}

.btn-danger:hover,
.btn-primary:hover,
.btn-success:hover,
.btn-info:hover {
    background-color: #4c3b8a !important; /* Tom mais escuro para o hover */
    border-color: #4c3b8a !important;
    color: white !important;
}

/* NOVO: Mudar a cor dos botões Outline */
.btn-outline-danger,
.btn-outline-primary,
.btn-outline-success,
.btn-outline-info {
    color: #5f49ac !important; /* Cor do texto e da borda */
    border-color: #5f49ac !important; /* Cor da borda */
    background-color: transparent !important; /* Garante fundo transparente */
}

.btn-outline-danger:hover,
.btn-outline-primary:hover,
.btn-outline-success:hover,
.btn-outline-info:hover {
    color: white !important; /* Texto branco no hover */
    background-color: #5f49ac !important; /* Fundo com a cor principal no hover */
    border-color: #5f49ac !important; /* Borda com a cor principal no hover */
}


/* Mudar a cor dos links em destaque (text-danger) */
.text-danger {
    color: #5f49ac !important;
}

/* Mudar a cor do badge do carrinho */
.badge.rounded-pill.bg-light.text-danger {
    color: #5f49ac !important; /* Cor do número no badge */
    /* background-color: #f1edfa !important; /* Lavanda bem clarinha para o fundo do badge, descomente se quiser */
}

/* Mudar a borda do botão Google Login */
#btnGoogleLogin {
    border: 1px solid transparent;
    background-color: transparent;
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

#btnGoogleLogin:hover {
    background-color: rgba(95, 73, 172, 0.1) !important; /* Um leve hover roxo transparente */
    border-color: transparent !important;
}

#btnGoogleLogin img {
    width: 24px;
    height: 24px;
}

/* Cor de fundo do rodapé - lavanda bem clarinho */
footer.bg-light {
    background-color: #f1edfa !important; /* Lavanda bem clarinho */
    color: #3b2c6e !important; /* Cor do texto no rodapé para contrastar */
}

footer.border-top {
    border-color: #e5def3 !important; /* Uma borda um pouco mais escura para o rodapé claro */
}

/* Cor do nome dos produtos nos cards */
.card-body h5,
.card-body h6,
.card-title {
    color: #5f49ac !important;
}

/* Cor do coração dos favoritos */
.card-img-overlay .bi-heart,
.card-header .bi-heart,
.card-header a.text-dark .bi-heart,
.card-header .favorite-icon,
.card-img-overlay .text-dark {
    color: #dc3545 !important; /* Vermelho Padrão do Bootstrap (danger) */
}

.card-img-overlay .bi-heart:hover,
.card-header .bi-heart:hover,
.card-header a.text-dark .bi-heart:hover,
.card-header .favorite-icon:hover,
.card-img-overlay .text-dark:hover {
    color: #bd2130 !important; /* Um vermelho um pouco mais escuro para o hover */
}