/* =================================================================== */
/* ================ ESTILOS DA PÁGINA DE CARRINHO =============== */
/* =================================================================== */

/* Layout Principal (herdado de perfil.css) */
.pagina-carrinho .main-content {
    padding: 2rem;
    background-color: #000; /* Fundo escuro para destacar os cards */
}

.pagina-carrinho .perfil-container-principal /* Adaptado para pagina-carrinho */
{
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr; /* O carrinho pode precisar de mais espaço horizontal */
    gap: 2rem;
}

/* Estilo Base dos Cards (herdado de perfil.css) */
.perfil-card-secao {
    background-color: var(--cor-bg-cards, #1E1E1E);
    border: 1px solid var(--cor-borda-leve, rgba(255, 255, 255, 0.1));
    border-radius: var(--borda-radius, 8px);
    padding: 2rem;
    box-shadow: var(--sombra-media, 0 4px 12px rgba(0,0,0,0.4));
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.perfil-card-secao:hover {
    transform: translateY(-5px);
    box-shadow: var(--sombra-forte, 0 8px 16px rgba(0,0,0,0.5));
}

/* Cabeçalho dos Cards (herdado de perfil.css) */
.perfil-secao-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--cor-borda, #333);
}

.perfil-secao-header h2, /* Adaptado para h2 */
.perfil-secao-header h3 {
    margin: 0;
    font-size: 1.5em;
    color: var(--cor-texto-claro);
    font-weight: 600;
}

/* Estilos para formulários (se houver, herdado de perfil.css) */
.perfil-dados-formulario .form-group label {
    color: var(--cor-texto-medio);
    margin-bottom: 0.5rem;
    font-weight: 500;
}

.perfil-dados-formulario .form-control {
    background-color: var(--cor-input-bg, #2a2a2a);
    color: var(--cor-input-texto, #e0e0e0);
    border: 1px solid var(--cor-input-borda, #444);
    border-radius: var(--borda-radius-input, 6px);
}

.perfil-dados-formulario .form-control:focus {
    background-color: var(--cor-input-bg-focus, #333);
    border-color: var(--cor-primaria);
    box-shadow: 0 0 0 0.2rem rgba(var(--cor-primaria-rgb), 0.25);
}

/* --- ESTILOS ESPECÍFICOS DO CARRINHO --- */

/* Mensagem de Carrinho Vazio */
.carrinho-vazio-container {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--cor-texto-medio);
}

.carrinho-vazio-container .fas.fa-shopping-cart {
    font-size: 4em;
    color: var(--cor-primaria-fraca, #555);
    margin-bottom: 1rem;
}

.carrinho-vazio-container h4 {
    font-size: 1.5em;
    color: var(--cor-texto-claro);
    margin-bottom: 0.5rem;
}

.carrinho-vazio-container p {
    margin-bottom: 1.5rem;
}

/* Tabela de Itens do Carrinho */
.tabela-carrinho-container.table-responsive {
    background-color: #000000; /* Tom mais escuro para maior contraste */
    border-radius: 6px;
    padding: 0.5rem;
    margin-top: 1rem;
    margin-bottom: 2rem;
}

.tabela-carrinho {
    width: 100%;
    border-collapse: collapse;
    --bs-table-bg: transparent;
    --bs-table-striped-bg: #222222;
    --bs-table-hover-bg: #2A2A2A;
    --bs-table-color: var(--cor-texto-medio);
    --bs-table-border-color: var(--cor-borda-leve);
}

.tabela-carrinho th,
.tabela-carrinho td {
    padding: 1rem 0.75rem;
    text-align: left;
    vertical-align: middle;
}

.tabela-carrinho thead th {
    font-weight: 600;
    color: var(--cor-texto-claro);
    white-space: nowrap;
    border-bottom: 2px solid var(--cor-borda, #333);
    padding-top: 1rem; /* Ajuste de padding */
    padding-bottom: 1rem; /* Ajuste de padding */
}

.tabela-carrinho tbody tr {
    transition: background-color 0.2s ease;
    border-bottom: 1px solid var(--cor-borda-leve, rgba(255,255,255,0.1));
}

.tabela-carrinho tbody tr:last-child {
    border-bottom: none;
}

.carrinho-item-imagem img {
    width: 70px;
    height: 70px;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid var(--cor-borda-leve);
}

.carrinho-item-info h5 {
    margin-bottom: 0.25rem;
    font-size: 1.1em;
    color: var(--cor-texto-claro);
}
.carrinho-item-info small {
    font-size: 0.85em;
    color: var(--cor-texto-fraco);
    display: block;
}

.tabela-carrinho td.carrinho-item-info {
    padding-left: 1rem; /* Espaçamento da imagem */
}

.input-quantidade-container {
    display: flex;
    align-items: center;
}

.input-quantidade {
    /* width, text-align, margin, padding, border-radius são gerenciados por classes Bootstrap (.form-control, .form-control-sm) e style inline no HTML */
    /* Mantemos as cores para garantir consistência com o tema, caso as de .form-control não sejam específicas o suficiente ou sejam sobrescritas. */
    background-color: var(--cor-input-bg, #2a2a2a); 
    color: var(--cor-input-texto, #e0e0e0); 
    border: 1px solid var(--cor-input-borda, #444); /* Esta borda pode ser redundante se .form-control já a define adequadamente */
}

.btn-qtd {
    /* Estilos de cor, fundo, borda, padding e border-radius são primariamente do Bootstrap (.btn-sm, .btn-outline-secondary) */
    cursor: pointer;
    line-height: 1.2; /* Ajuste para melhor alinhamento vertical do texto +/- */
}

/* O hover será o padrão do Bootstrap para .btn-outline-secondary */

.btn-remover-item {
    color: var(--cor-perigo, #e74c3c);
    background: none;
    border: none;
    font-size: 1.2em;
}
.btn-remover-item:hover {
    color: var(--cor-perigo-forte, #c0392b);
}

/* Resumo do Pedido */
/* A classe .carrinho-resumo agora serve apenas como um container sem estilos próprios, 
   pois está dentro de .perfil-card-secao */

.carrinho-resumo h4 {
    font-size: 1.3em;
    color: var(--cor-texto-claro);
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--cor-borda, #333);
}

.resumo-linha {
    display: flex;
    justify-content: space-between;
    margin-bottom: 0.75rem;
    color: var(--cor-texto-medio);
}

.resumo-linha.total {
    font-weight: bold;
    font-size: 1.2em;
    color: var(--cor-texto-claro);
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--cor-borda, #333);
}

/* Ações Globais e Botões de Finalização */
.carrinho-acoes-globais {
    margin-bottom: 1.5rem;
    /* text-align: right; */ /* Substituído por flex para melhor controle */
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.carrinho-resumo .btn-primary,
.carrinho-resumo .btn-secondary {
    width: 100%;
    margin-bottom: 0.5rem;
}

/* Alertas */
#carrinho-alertas .alert {
    margin-top: 1rem;
}