/* ============================================================================
   REGRAS DO CARRINHO — modal de produto recusado (views/_includes/_modal-regras-carrinho.php)

   Só o que é específico deste modal. O "chrome" (.mc-modal, backdrop, caixa,
   cabeçalho, botão fechar, rodapé de ações) vem de _modal-endereco.css, que é a
   fonte única do visual de modal do projeto — repetir aquilo aqui só criaria
   duas verdades que divergem na primeira alteração.

   Cor: o CTA usa .btn-primary, então herda a cor da loja (template-NN.css).
   Nada de hex de marca fixo aqui.
   ============================================================================ */

.rc-modal .rc-modal-box { max-width: 460px; }

/* ============================================================================
   FAIXA PREVENTIVA na página do produto (_aviso-regra-produto.php): avisa que
   este item não pode entrar no carrinho de agora, ANTES de o cliente preencher.
   ============================================================================ */

.rp-aviso {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: 0 0 20px;   /* colada no breadcrumb, separada do bloco do produto */
    padding: 14px 16px;
    border: 1px solid #f0d9a8;
    border-left: 4px solid #e8a33d;
    border-radius: 8px;
    background: #fdf8ee;
}
.rp-aviso-icone { flex: 0 0 auto; margin-top: 2px; font-size: 18px; color: #e8a33d; }
.rp-aviso-corpo { min-width: 0; }

.rp-aviso p { margin: 0 0 6px !important; line-height: 1.45; }
.rp-aviso-titulo { font-size: 15px; font-weight: 700; color: #7a5a1e; }
.rp-aviso-motivo { font-size: 14px; color: #6b6152; }
.rp-aviso-itens  { font-size: 13px; color: #6b6152; }
.rp-aviso-itens strong { color: #4a4438; }

.rp-aviso-link {
    display: inline-block;
    margin-top: 4px;
    font-size: 14px;
    font-weight: 600;
    color: var(--mc-cor, #7a5a1e);
    text-decoration: underline;
}
.rp-aviso-link:hover, .rp-aviso-link:focus { color: var(--mc-cor, #5c440f); text-decoration: underline; }

@media (max-width: 600px) {
    .rp-aviso { padding: 12px; gap: 10px; }
    .rp-aviso-titulo { font-size: 14px; }
}

/* ---- produto recusado: imagem + nome ---- */
.rc-produto {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border: 1px solid #ececec;
    border-radius: 10px;
    background: #fcfcfd;
}
.rc-produto-img {
    width: 56px;
    height: 56px;
    flex: 0 0 56px;
    object-fit: contain;
    border-radius: 8px;
    background: #fff;
}
.rc-produto-nome {
    margin: 0 !important;
    font-size: 14px;
    line-height: 1.35;
    color: #6b7180;
}
.rc-produto-nome strong { color: #3a3f49; }

/* ---- mensagem cadastrada na regra ---- */
.rc-motivos { margin-top: 14px; }
.rc-motivos p {
    margin: 0 0 8px !important;
    font-size: 14px;
    line-height: 1.45;
    color: #4a4f59;
}
.rc-motivos p:last-child { margin-bottom: 0 !important; }

/* ---- o que já está no carrinho (ou o que falta) ---- */
.rc-itens { margin-top: 16px; }
.rc-itens-rotulo {
    margin: 0 0 8px !important;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .3px;
    color: #9aa0a8;
}
.rc-itens-lista { list-style: none; margin: 0; padding: 0; }
.rc-itens-lista li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    border-top: 1px solid #f1f2f4;
    font-size: 14px;
    color: #3a3f49;
}
.rc-itens-lista li:first-child { border-top: 0; }
.rc-itens-lista img {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    object-fit: contain;
    border-radius: 6px;
    background: #fff;
    border: 1px solid #f1f2f4;
}
.rc-itens-mais { color: #9aa0a8; font-size: 13px; }

/* ---- ações ---- */
.rc-continuar {
    border: 0;
    background: none;
    color: #8a8f99;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    padding: 8px 12px;
}
.rc-continuar:hover { color: #4a4f59; }

.rc-modal-box .rc-ver-carrinho {
    border-radius: 8px;
    font-weight: 600;
    padding: 10px 22px;
    border: 0;
    box-shadow: none;
    text-shadow: none;
}
.rc-modal-box .rc-ver-carrinho i { margin-right: 6px; }

/* ---- mobile: ações empilhadas, CTA primeiro (padrão do projeto) ---- */
@media (max-width: 600px) {
    .rc-produto-img { width: 48px; height: 48px; flex: 0 0 48px; }
    .rc-modal-box .rc-ver-carrinho { width: 100%; text-align: center; }
    .rc-continuar { width: 100%; text-align: center; }
}