/* ============================================================
   TEMPLATE 2 — CONTEXTUAL CATEGORY PROMOTION OVERRIDES
   Coffee Shop vintage style: warm cream cards, Playfair Display
   headings, gold accents, rounded corners, soft shadows.
   Scoped to .tpl-template2 so it only affects Template 2.
   ============================================================ */

.tpl-template2 .cat-promo-banner-wrap {
    padding: 0;
    margin: 0 0 18px;
}

.tpl-template2 .cat-promo-banner {
    border-radius: 20px;
    border: 1px solid var(--border, rgba(0,0,0,.08));
    box-shadow: 0 6px 22px rgba(31,29,43,.07);
    background: var(--cream-card, var(--color-card, #fcfbfa));
}

/* Image: taller, rounded right edge */
.tpl-template2 .cat-promo-media {
    flex: 0 0 42%;
    max-width: 42%;
    min-height: 170px;
    border-right: 3px solid var(--gold, var(--color-secondary, #d69733));
}
.tpl-template2 .cat-promo-media img {
    border-radius: 0;
}

/* Body: vintage typography */
.tpl-template2 .cat-promo-body {
    padding: 18px 22px;
    gap: 7px;
}
.tpl-template2 .cat-promo-badge {
    background: var(--coral-grad, linear-gradient(135deg, var(--color-primary, #ea6045), var(--color-primary-hover, #d14f38)));
    font-family: 'Montserrat', sans-serif;
    font-size: 0.62rem;
    letter-spacing: 0.08em;
    border-radius: 4px;
    padding: 4px 10px;
}
.tpl-template2 .cat-promo-banner-title {
    font-family: 'Playfair Display', serif;
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--text-dark, var(--color-text, #1e1d1b));
    line-height: 1.2;
}
.tpl-template2 .cat-promo-banner-subtitle {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.82rem;
    color: var(--text-dark-muted, var(--color-text-secondary, #75716b));
    font-style: italic;
}

/* Price: gold accent */
.tpl-template2 .cat-promo-price-now {
    font-family: 'Playfair Display', serif;
    font-size: 1.35rem;
    color: var(--gold, var(--color-secondary, #d69733));
    font-weight: 700;
}
.tpl-template2 .cat-promo-price-old {
    font-family: 'Montserrat', sans-serif;
    color: var(--text-dark-muted, var(--color-text-secondary, #75716b));
}
.tpl-template2 .cat-promo-price-off {
    background: var(--gold, var(--color-secondary, #d69733));
    border-radius: 4px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
}

/* CTA: pill button with vintage feel */
.tpl-template2 .cat-promo-cta {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    font-size: 0.78rem;
    border-radius: 50px;
    padding: 10px 24px;
    background: var(--coral, var(--color-primary, #ea6045));
    box-shadow: 0 4px 14px rgba(234,96,69,.28);
}

/* Multi-product chips: cream style */
.tpl-template2 .cat-promo-product {
    background: var(--cream-bg, var(--color-surface, #f5f0e9));
    border: 1px solid var(--border, rgba(0,0,0,.06));
    border-radius: 50px;
}
.tpl-template2 .cat-promo-product-name {
    font-family: 'Montserrat', sans-serif;
    color: var(--text-dark, var(--color-text, #1e1d1b));
}
.tpl-template2 .cat-promo-product-price {
    color: var(--gold, var(--color-secondary, #d69733));
}
.tpl-template2 .cat-promo-product-cta {
    background: var(--coral, var(--color-primary, #ea6045));
    border-radius: 50%;
}

/* Dark mode overrides for Template 2 */
.tpl-template2.dark-mode .cat-promo-banner,
[data-theme="dark"] .tpl-template2 .cat-promo-banner {
    background: var(--slate-dark, #1b1b1d);
    border-color: rgba(255,255,255,.06);
    box-shadow: 0 6px 22px rgba(0,0,0,.4);
}
.tpl-template2.dark-mode .cat-promo-product,
[data-theme="dark"] .tpl-template2 .cat-promo-product {
    background: var(--slate-dark-2, #242426);
    border-color: rgba(255,255,255,.06);
}
.tpl-template2.dark-mode .cat-promo-banner-title,
[data-theme="dark"] .tpl-template2 .cat-promo-banner-title {
    color: var(--text-slate-light, #d6d3cc);
}
.tpl-template2.dark-mode .cat-promo-product-name,
[data-theme="dark"] .tpl-template2 .cat-promo-product-name {
    color: var(--text-slate-light, #d6d3cc);
}

/* Responsive — Template 2 */
@media (max-width: 768px) {
    .tpl-template2 .cat-promo-media { flex-basis: 38%; max-width: 38%; min-height: 140px; }
    .tpl-template2 .cat-promo-body { padding: 14px 16px; }
    .tpl-template2 .cat-promo-banner-title { font-size: 1.05rem; }
}
@media (max-width: 560px) {
    .tpl-template2 .cat-promo-banner { flex-direction: column; border-radius: 16px; }
    .tpl-template2 .cat-promo-media { flex: none; max-width: 100%; width: 100%; height: 150px; border-right: none; border-bottom: 3px solid var(--gold, var(--color-secondary, #d69733)); }
    .tpl-template2 .cat-promo-body { padding: 14px 16px 18px; }
    .tpl-template2 .cat-promo-cta { width: 100%; justify-content: center; }
}
