/* ==========================================================================
   Amazon Afiliados — grid de produtos para [amazon_produtos]
   ========================================================================== */

.aaf-bloco {
    --aaf-radius: 14px;
    --aaf-shadow: 0 4px 18px rgba(0,0,0,0.06), 0 1px 3px rgba(0,0,0,0.04);
    --aaf-shadow-hover: 0 12px 30px rgba(0,0,0,0.12), 0 2px 6px rgba(0,0,0,0.08);
    --aaf-primary: #ff9900;          /* laranja Amazon */
    --aaf-primary-dark: #e88b00;
    --aaf-text: #111;
    --aaf-muted: #555;
    --aaf-bg: #fff;
    --aaf-border: #e5e7eb;

    margin: 32px 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    color: var(--aaf-text);
}

.aaf-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(3, 1fr);
}
.aaf-grid.aaf-grid-1 { grid-template-columns: 1fr; max-width: 360px; margin: 0 auto; }
.aaf-grid.aaf-grid-2 { grid-template-columns: repeat(2, 1fr); }
.aaf-grid.aaf-grid-4 { grid-template-columns: repeat(4, 1fr); }
.aaf-grid.aaf-grid-5,
.aaf-grid.aaf-grid-6 { grid-template-columns: repeat(3, 1fr); }

.aaf-card {
    background: var(--aaf-bg);
    border: 1px solid var(--aaf-border);
    border-radius: var(--aaf-radius);
    overflow: hidden;
    box-shadow: var(--aaf-shadow);
    transition: transform .22s ease, box-shadow .22s ease;
}
.aaf-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--aaf-shadow-hover);
}

.aaf-card .aaf-link {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 14px 14px 16px;
    text-decoration: none !important;
    color: inherit !important;
}

.aaf-img-wrap {
    height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fafafa;
    border-radius: 10px;
    margin-bottom: 12px;
}
.aaf-img-wrap img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.aaf-titulo {
    margin: 0 0 8px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
    color: var(--aaf-text);

    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 3.7em;
}

.aaf-preco {
    margin: 0 0 12px;
    font-size: 17px;
    font-weight: 700;
    color: #b12704;             /* vermelho de preço Amazon */
}

.aaf-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: auto;
    background: var(--aaf-primary);
    color: #111 !important;
    font-weight: 700;
    font-size: 13px;
    padding: 10px 14px;
    border-radius: 999px;
    transition: background .2s ease;
    text-align: center;
}
.aaf-card:hover .aaf-btn {
    background: var(--aaf-primary-dark);
}

.aaf-aviso {
    margin: 14px 0 0;
    font-size: 11px;
    color: #888;
    text-align: center;
    font-style: italic;
}

/* ----------- Skeleton (loading) ---------- */
.aaf-skeleton-wrap {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(3, 1fr);
}
.aaf-skeleton {
    height: 320px;
    border-radius: var(--aaf-radius);
    background: linear-gradient(90deg, #f0f0f4 0%, #e6e6ec 50%, #f0f0f4 100%);
    background-size: 200% 100%;
    animation: aaf-shimmer 1.4s infinite linear;
}
@keyframes aaf-shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ----------- Dark mode ----------- */
@media (prefers-color-scheme: dark) {
    .aaf-bloco {
        --aaf-bg: #1c1f24;
        --aaf-text: #f3f4f6;
        --aaf-muted: #aab0bb;
        --aaf-border: #2a2e36;
    }
    .aaf-img-wrap { background: #fff; }   /* fundo branco para a foto do produto */
    .aaf-preco { color: #ff7a5c; }
    .aaf-skeleton {
        background: linear-gradient(90deg, #23262d 0%, #2e323a 50%, #23262d 100%);
        background-size: 200% 100%;
    }
}

/* ----------- Mobile ----------- */
@media (max-width: 768px) {
    .aaf-grid,
    .aaf-grid.aaf-grid-4,
    .aaf-grid.aaf-grid-5,
    .aaf-grid.aaf-grid-6,
    .aaf-skeleton-wrap {
        grid-template-columns: repeat(2, 1fr);
    }
    .aaf-img-wrap { height: 130px; }
    .aaf-skeleton { height: 260px; }
}
@media (max-width: 420px) {
    .aaf-grid,
    .aaf-grid.aaf-grid-4,
    .aaf-grid.aaf-grid-5,
    .aaf-grid.aaf-grid-6,
    .aaf-skeleton-wrap {
        grid-template-columns: 1fr;
    }
    .aaf-img-wrap { height: 180px; }
}