/* ===== MERCH CARD BUILDER — CARD STYLES ===== */
/* 14 unique card styles + shared components */

/* ===== SHARED BASE ===== */
.merch-card {
    position: relative;
    overflow: hidden;
    font-family: 'Outfit', sans-serif;
    color: #2c1810;
    transition: transform 0.15s, box-shadow 0.15s;
}
.merch-card:hover {
    z-index: 10;
    box-shadow: 4px 4px 16px rgba(0,0,0,0.1);
    transform: translateY(-3px);
}

/* ── Backgrounds ── */
.merch-bg-paper { background: #f5f0e6; }
.merch-bg-cream { background: #ede8df; }
.merch-bg-white { background: #fff; }
.merch-bg-teal { background: #e8f0ee; }
.merch-bg-warm { background: #f0e8d8; }
.merch-bg-brown { background: #3a2a1a; color: #ede8df; }
.merch-bg-red { background: #c0392b; color: #fff; }
.merch-bg-transparent { background: transparent; }

/* Brown/Red text inversions */
.merch-bg-brown .mc-name,
.merch-bg-brown .mc-desc,
.merch-bg-brown .mc-meta,
.merch-bg-red .mc-name,
.merch-bg-red .mc-desc,
.merch-bg-red .mc-meta { color: #ede8df; }
.merch-bg-brown .mc-badge,
.merch-bg-red .mc-badge { background: #ede8df; color: #2c1810; }
.merch-bg-brown .mc-badge .mc-badge-tip,
.merch-bg-red .mc-badge .mc-badge-tip { background: #ede8df; color: #2c1810; }
.merch-bg-brown .mc-badge .mc-badge-tip::after,
.merch-bg-red .mc-badge .mc-badge-tip::after { border-top-color: #ede8df; }
.merch-bg-brown .mc-badge svg,
.merch-bg-red .mc-badge svg { stroke: #2c1810; }
.merch-bg-brown .mc-chip,
.merch-bg-red .mc-chip { border-color: rgba(237,232,223,0.4); color: #ede8df; }
.merch-bg-brown .mc-quote-btn,
.merch-bg-red .mc-quote-btn { background: #ede8df; color: #2c1810; border-color: #ede8df; }

/* ── Borders ── */
.merch-bdr-none { border: none; }
.merch-bdr-solid { border: 2px solid #2c1810; }
.merch-bdr-dashed { border: 2px dashed #8b7355; }
.merch-bdr-double { border: 4px double #2c1810; }
.merch-bdr-left { border: none; border-left: 4px solid #2c1810; }

/* ── Tilt ── */
.merch-tilt-cw { transform: rotate(0.4deg); }
.merch-tilt-ccw { transform: rotate(-0.3deg); }
.merch-tilt-cw:hover { transform: rotate(0.4deg) translateY(-3px); }
.merch-tilt-ccw:hover { transform: rotate(-0.3deg) translateY(-3px); }

/* ── Card Width (grid spans on 6-col grid) ── */
.merch-w-small { grid-column: span 2; }
.merch-w-medium { grid-column: span 3; }
.merch-w-large { grid-column: span 4; }
.merch-w-full { grid-column: span 6; }

/* ── Shared Content Elements ── */
.mc-name {
    font-weight: 800;
    text-transform: uppercase;
    line-height: 1.1;
    color: #2c1810;
}
.mc-desc {
    font-size: 12px;
    font-style: italic;
    opacity: 0.75;
    line-height: 1.4;
    margin-top: 6px;
    color: #5c4a3a;
}
.mc-meta {
    font-size: 11px;
    color: #8b7355;
    margin-top: 4px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.mc-gender {
    background: #2c1810;
    color: #ede8df;
    padding: 1px 6px;
    font-size: 10px;
    font-weight: 600;
}
.mc-price-stamp {
    text-align: center;
    padding: 8px 12px;
    transform: rotate(3deg);
}
.mc-stamp-label { font-size: 8px; text-transform: uppercase; letter-spacing: 1px; display: block; }
.mc-stamp-price { font-size: 28px; font-weight: 900; display: block; line-height: 1; }
.mc-stamp-design { font-size: 8px; display: block; opacity: 0.8; }

/* ── Price Tag Styles ── */
/* Corner banner (default — no extra class needed, uses base .mc-price-stamp) */

/* Starburst */
.mc-tag-starburst .mc-price-stamp {
    background: none !important;
    padding: 0;
    width: 80px; height: 80px;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    transform: rotate(-5deg);
}
.mc-tag-starburst .mc-price-stamp::before {
    content: '';
    position: absolute; inset: 0;
    background: inherit;
    clip-path: polygon(50% 0%, 63% 28%, 93% 25%, 72% 50%, 93% 75%, 63% 72%, 50% 100%, 37% 72%, 7% 75%, 28% 50%, 7% 25%, 37% 28%);
}
.mc-tag-starburst .mc-price-stamp .mc-stamp-label,
.mc-tag-starburst .mc-price-stamp .mc-stamp-price,
.mc-tag-starburst .mc-price-stamp .mc-stamp-design { position: relative; z-index: 1; }
.mc-tag-starburst .mc-price-stamp .mc-stamp-price { font-size: 22px; }
.mc-tag-starburst .mc-price-stamp .mc-stamp-label { font-size: 6px; }
.mc-tag-starburst .mc-price-stamp .mc-stamp-design { font-size: 6px; }

/* Circle Badge */
.mc-tag-circle .mc-price-stamp {
    border-radius: 50%;
    width: 72px; height: 72px;
    padding: 0;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    transform: rotate(5deg);
    box-shadow: 2px 2px 6px rgba(0,0,0,0.2);
}
.mc-tag-circle .mc-price-stamp .mc-stamp-price { font-size: 20px; }
.mc-tag-circle .mc-price-stamp .mc-stamp-label { font-size: 6px; }
.mc-tag-circle .mc-price-stamp .mc-stamp-design { font-size: 6px; }

/* Ribbon Flag */
.mc-tag-ribbon .mc-price-stamp {
    transform: none;
    padding: 6px 16px 6px 12px;
    position: relative;
}
.mc-tag-ribbon .mc-price-stamp::after {
    content: '';
    position: absolute; bottom: -6px; right: 0;
    width: 0; height: 0;
    border-left: 6px solid rgba(0,0,0,0.3);
    border-bottom: 6px solid transparent;
}
.mc-tag-ribbon .mc-price-stamp .mc-stamp-price { font-size: 22px; }

/* Hang Tag */
.mc-tag-hang-tag .mc-price-stamp {
    transform: rotate(8deg);
    border-radius: 0 0 4px 4px;
    padding: 10px 12px 8px;
    position: relative;
    margin-top: 12px;
}
.mc-tag-hang-tag .mc-price-stamp::before {
    content: '';
    position: absolute; top: -12px; left: 50%; transform: translateX(-50%);
    width: 2px; height: 12px;
    background: currentColor; opacity: 0.5;
}
.mc-tag-hang-tag .mc-price-stamp::after {
    content: '';
    position: absolute; top: 3px; left: 50%; transform: translateX(-50%);
    width: 8px; height: 8px; border-radius: 50%;
    background: rgba(255,255,255,0.3);
}
.mc-tag-hang-tag .mc-price-stamp .mc-stamp-label { margin-top: 4px; }

/* Rubber Stamp */
.mc-tag-stamp-outline .mc-price-stamp {
    background: rgba(255,255,255,0.85) !important;
    border: 3px solid currentColor;
    border-radius: 50%;
    width: 72px; height: 72px;
    padding: 0;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    transform: rotate(-8deg);
}
.mc-tag-stamp-outline .mc-price-stamp .mc-stamp-price { font-size: 20px; }
.mc-tag-stamp-outline .mc-price-stamp .mc-stamp-label { font-size: 6px; }
.mc-tag-stamp-outline .mc-price-stamp .mc-stamp-design { font-size: 6px; }

.mc-badges { display: flex; gap: 4px; margin-top: 8px; flex-wrap: wrap; }
.mc-badge {
    font-size: 10px;
    padding: 5px 10px;
    background: #2c1810;
    color: #ede8df;
    font-weight: 700;
    text-transform: uppercase;
    border-radius: 3px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    position: relative;
    cursor: default;
    border: none;
}
.mc-badge svg { width: 14px; height: 14px; flex-shrink: 0; }
.mc-badge .mc-badge-tip {
    display: none;
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    background: #2c1810;
    color: #ede8df;
    padding: 10px 14px;
    border-radius: 6px;
    font-size: 11px;
    width: 200px;
    text-align: left;
    z-index: 20;
    line-height: 1.4;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
    font-weight: 400;
    text-transform: none;
    pointer-events: none;
}
.mc-badge .mc-badge-tip::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-top-color: #2c1810;
}
.mc-badge:hover .mc-badge-tip { display: block; }
/* Mobile tap support */
.mc-badge-tip.show { display: block; }
.mc-badge .mc-badge-tip strong { display: block; margin-bottom: 4px; font-size: 12px; }
.mc-chips { display: flex; gap: 6px; margin-top: 8px; flex-wrap: wrap; }
.mc-chip {
    font-size: 10px;
    padding: 4px 8px;
    border: 1px dashed #8b7355;
    color: #5c4a3a;
    font-weight: 600;
    cursor: pointer;
    background: none;
    font-family: 'Outfit', sans-serif;
}
.mc-quote-btn {
    padding: 10px 16px;
    background: #2c1810;
    color: #ede8df;
    border: none;
    font-family: 'Outfit', sans-serif;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    margin-top: 12px;
    width: 100%;
}
.mc-quote-btn:hover { opacity: 0.85; }
.mc-photo {
    width: 100%;
    object-fit: contain;
    display: block;
}
.mc-photo-ph {
    width: 100%;
    aspect-ratio: 1;
    background: rgba(0,0,0,0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: #999;
}
.mc-swatches { display: flex; gap: 3px; margin-top: 6px; flex-wrap: wrap; }
.mc-swatch {
    width: 14px; height: 14px; border-radius: 50%;
    border: 1px solid rgba(0,0,0,0.15);
}

/* ===== STYLE 1: CATALOG ===== */
/* Split: photo left, info right */
.merch-style-catalog {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 280px;
}
.merch-style-catalog .mc-photo-col {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    position: relative;
}
.merch-style-catalog .mc-photo-col img {
    max-width: 100%;
    max-height: 280px;
    object-fit: contain;
    filter: drop-shadow(3px 3px 6px rgba(0,0,0,0.12));
}
.merch-style-catalog .mc-info-col {
    padding: 20px 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.merch-style-catalog .mc-name { font-size: 20px; }
.merch-style-catalog .mc-price-stamp {
    position: absolute;
    top: 10px;
    right: -10px;
    z-index: 2;
}

/* ===== STYLE 2: STACKED ===== */
/* Photo on top, info below */
.merch-style-stacked { display: flex; flex-direction: column; }
.merch-style-stacked .mc-photo-col {
    display: flex; align-items: center; justify-content: center;
    padding: 20px; min-height: 180px; position: relative;
}
.merch-style-stacked .mc-photo-col img {
    max-width: 80%; max-height: 220px; object-fit: contain;
    filter: drop-shadow(3px 3px 6px rgba(0,0,0,0.12));
}
.merch-style-stacked .mc-info-col { padding: 16px; }
.merch-style-stacked .mc-name { font-size: 18px; }
.merch-style-stacked .mc-price-stamp {
    position: absolute; top: 10px; right: 10px;
}

/* ===== STYLE 3: SPOTLIGHT ===== */
/* Centered dramatic photo, info below */
.merch-style-spotlight { text-align: center; padding: 24px 16px; }
.merch-style-spotlight .mc-photo-col {
    display: flex; justify-content: center; margin-bottom: 16px;
}
.merch-style-spotlight .mc-photo-col img {
    max-width: 60%; max-height: 240px; object-fit: contain;
    filter: drop-shadow(6px 6px 12px rgba(0,0,0,0.2));
}
.merch-style-spotlight .mc-info-col { text-align: center; }
.merch-style-spotlight .mc-name { font-size: 22px; }
.merch-style-spotlight .mc-badges,
.merch-style-spotlight .mc-chips { justify-content: center; }
.merch-style-spotlight .mc-price-stamp { display: inline-block; margin-bottom: 12px; }

/* ===== STYLE 4: FULL BLEED ===== */
/* Photo fills card, text overlaid at bottom */
.merch-style-fullbleed { position: relative; min-height: 320px; overflow: hidden; }
.merch-style-fullbleed .mc-photo-col {
    position: absolute; inset: 0;
}
.merch-style-fullbleed .mc-photo-col img {
    width: 100%; height: 100%; object-fit: cover;
}
.merch-style-fullbleed .mc-info-col {
    position: relative; z-index: 2; margin-top: auto;
    padding: 16px; background: linear-gradient(transparent, rgba(0,0,0,0.75) 30%);
    display: flex; flex-direction: column; justify-content: flex-end; min-height: 320px;
}
.merch-style-fullbleed .mc-name { font-size: 20px; color: #fff; }
.merch-style-fullbleed .mc-desc { color: rgba(255,255,255,0.8); }
.merch-style-fullbleed .mc-meta { color: rgba(255,255,255,0.6); }
.merch-style-fullbleed .mc-badge { background: rgba(255,255,255,0.9); color: #2c1810; }
.merch-style-fullbleed .mc-badge svg { stroke: #2c1810; }
.merch-style-fullbleed .mc-chip { border-color: rgba(255,255,255,0.3); color: #fff; }
.merch-style-fullbleed .mc-quote-btn { background: #fff; color: #2c1810; }
.merch-style-fullbleed .mc-price-stamp {
    position: absolute; top: 12px; right: 12px; z-index: 3;
}

/* ===== STYLE 5: EDITORIAL ===== */
/* Text-heavy left, small photo right */
.merch-style-editorial {
    display: grid; grid-template-columns: 1.5fr 1fr; min-height: 250px;
}
.merch-style-editorial .mc-info-col {
    padding: 20px 16px;
    display: flex; flex-direction: column; justify-content: center;
}
.merch-style-editorial .mc-photo-col {
    display: flex; align-items: center; justify-content: center; padding: 16px;
}
.merch-style-editorial .mc-photo-col img {
    max-width: 100%; max-height: 200px; object-fit: contain;
}
.merch-style-editorial .mc-name { font-size: 24px; }
.merch-style-editorial .mc-desc { font-size: 13px; }
.merch-style-editorial .mc-price-stamp { margin-bottom: 8px; display: inline-block; transform: rotate(-2deg); }

/* ===== STYLE 6: TEXT ONLY ===== */
/* No photo, typography-driven */
.merch-style-textonly { padding: 28px 20px; text-align: center; }
.merch-style-textonly .mc-photo-col { display: none; }
.merch-style-textonly .mc-name { font-size: 32px; margin-bottom: 4px; }
.merch-style-textonly .mc-price-stamp {
    display: inline-block; margin: 8px 0; transform: rotate(0deg);
}
.merch-style-textonly .mc-stamp-price { font-size: 48px; }
.merch-style-textonly .mc-badges,
.merch-style-textonly .mc-chips { justify-content: center; }

/* ===== STYLE 7: POSTCARD ===== */
/* Vintage bordered, photo in a window on left */
.merch-style-postcard {
    display: grid; grid-template-columns: 2fr 3fr;
    border: 3px solid #2c1810; min-height: 220px;
}
.merch-style-postcard .mc-photo-col {
    border-right: 3px solid #2c1810;
    display: flex; align-items: center; justify-content: center; padding: 12px;
    background: #ede8df;
}
.merch-style-postcard .mc-photo-col img {
    max-width: 100%; max-height: 200px; object-fit: contain;
}
.merch-style-postcard .mc-info-col { padding: 16px; }
.merch-style-postcard .mc-name { font-size: 18px; }
.merch-style-postcard .mc-price-stamp { display: inline-block; margin-top: 8px; }

/* ===== STYLE 8: MAGAZINE ===== */
/* Photo top, two-column info below */
.merch-style-magazine { display: flex; flex-direction: column; }
.merch-style-magazine .mc-photo-col {
    display: flex; align-items: center; justify-content: center;
    padding: 16px; min-height: 200px; position: relative;
}
.merch-style-magazine .mc-photo-col img {
    max-width: 70%; max-height: 200px; object-fit: contain;
    filter: drop-shadow(3px 3px 6px rgba(0,0,0,0.12));
}
.merch-style-magazine .mc-info-col {
    display: grid; grid-template-columns: 1fr auto;
    gap: 12px; padding: 16px; align-items: start;
}
.merch-style-magazine .mc-info-main { }
.merch-style-magazine .mc-name { font-size: 18px; }
.merch-style-magazine .mc-price-stamp { margin: 0; transform: rotate(-3deg); }

/* ===== STYLE 9: BILLBOARD ===== */
/* Huge price dominates, name secondary */
.merch-style-billboard { padding: 20px; text-align: center; position: relative; }
.merch-style-billboard .mc-photo-col {
    position: absolute; bottom: 8px; right: 8px; width: 60px; height: 60px; opacity: 0.3;
}
.merch-style-billboard .mc-photo-col img {
    width: 100%; height: 100%; object-fit: contain;
}
.merch-style-billboard .mc-price-stamp { transform: rotate(0deg); margin-bottom: 8px; }
.merch-style-billboard .mc-stamp-price { font-size: 56px; }
.merch-style-billboard .mc-stamp-label { font-size: 10px; }
.merch-style-billboard .mc-name { font-size: 14px; letter-spacing: 2px; }
.merch-style-billboard .mc-desc { font-size: 11px; }

/* ===== STYLE 10: FILMSTRIP ===== */
/* Narrow tall, photo stacked with info strip below */
.merch-style-filmstrip { display: flex; flex-direction: column; }
.merch-style-filmstrip .mc-photo-col {
    flex: 1; display: flex; align-items: center; justify-content: center;
    padding: 12px; min-height: 240px; position: relative;
    border-bottom: 3px solid #2c1810;
}
.merch-style-filmstrip .mc-photo-col img {
    max-width: 85%; max-height: 220px; object-fit: contain;
}
.merch-style-filmstrip .mc-info-col { padding: 12px; }
.merch-style-filmstrip .mc-name { font-size: 14px; }
.merch-style-filmstrip .mc-desc { display: none; }
.merch-style-filmstrip .mc-price-stamp {
    position: absolute; top: 8px; right: 8px;
}
.merch-style-filmstrip .mc-stamp-price { font-size: 22px; }

/* ===== STYLE 11: CLASSIFIED ===== */
/* Dense text, typewriter feel, no frills */
.merch-style-classified {
    padding: 14px 16px;
    font-family: 'Courier New', 'Courier', monospace;
    border: 1px solid #2c1810;
    background: #fff;
}
.merch-style-classified .mc-photo-col { display: none; }
.merch-style-classified .mc-name {
    font-size: 14px; font-family: 'Courier New', monospace;
    font-weight: 700; text-transform: uppercase; border-bottom: 1px solid #ccc;
    padding-bottom: 4px; margin-bottom: 6px;
}
.merch-style-classified .mc-desc {
    font-family: 'Courier New', monospace; font-size: 11px; font-style: normal; opacity: 1;
}
.merch-style-classified .mc-price-stamp {
    transform: rotate(0deg); text-align: left; padding: 4px 0; margin-top: 6px;
}
.merch-style-classified .mc-stamp-price { font-size: 20px; font-family: 'Courier New', monospace; }
.merch-style-classified .mc-stamp-label { font-family: 'Courier New', monospace; font-size: 9px; }
.merch-style-classified .mc-badge { font-family: 'Courier New', monospace; }
.merch-style-classified .mc-quote-btn {
    font-family: 'Courier New', monospace; background: #2c1810; margin-top: 8px;
}

/* ===== STYLE 12: SHOWROOM ===== */
/* Large centered photo, info in two columns flanking */
.merch-style-showroom {
    display: grid; grid-template-columns: 1fr 2fr 1fr;
    min-height: 280px; align-items: center;
}
.merch-style-showroom .mc-info-left {
    padding: 16px; text-align: right;
}
.merch-style-showroom .mc-photo-col {
    display: flex; align-items: center; justify-content: center; padding: 16px;
}
.merch-style-showroom .mc-photo-col img {
    max-width: 100%; max-height: 260px; object-fit: contain;
    filter: drop-shadow(4px 4px 10px rgba(0,0,0,0.15));
}
.merch-style-showroom .mc-info-right {
    padding: 16px;
}
.merch-style-showroom .mc-name { font-size: 18px; }
.merch-style-showroom .mc-price-stamp { transform: rotate(-2deg); margin-bottom: 8px; }

/* ===== STYLE 13: STAMP ===== */
/* Compact, the whole card IS the price stamp */
.merch-style-stamp {
    text-align: center; padding: 16px 12px;
    border: 3px solid currentColor;
}
.merch-style-stamp .mc-photo-col { display: none; }
.merch-style-stamp .mc-price-stamp { transform: rotate(0deg); margin-bottom: 6px; }
.merch-style-stamp .mc-stamp-price { font-size: 36px; }
.merch-style-stamp .mc-name { font-size: 12px; letter-spacing: 2px; margin-top: 4px; }
.merch-style-stamp .mc-desc { display: none; }
.merch-style-stamp .mc-badges { display: none; }
.merch-style-stamp .mc-chips { justify-content: center; margin-top: 6px; }
.merch-style-stamp .mc-chip { font-size: 9px; padding: 2px 6px; }
.merch-style-stamp .mc-quote-btn { padding: 8px; font-size: 10px; margin-top: 8px; }

/* ===== STYLE 14: POLAROID ===== */
/* White instant-photo border, handwritten name */
.merch-style-polaroid {
    background: #fff; padding: 12px 12px 20px; box-shadow: 2px 2px 8px rgba(0,0,0,0.1);
}
.merch-style-polaroid .mc-photo-col {
    background: #f0f0f0; display: flex; align-items: center; justify-content: center;
    aspect-ratio: 1; margin-bottom: 12px; overflow: hidden;
}
.merch-style-polaroid .mc-photo-col img {
    width: 100%; height: 100%; object-fit: cover;
}
.merch-style-polaroid .mc-info-col { text-align: center; }
.merch-style-polaroid .mc-name {
    font-size: 18px; font-weight: 400; text-transform: none;
    font-style: italic;
}
.merch-style-polaroid .mc-desc { font-size: 11px; }
.merch-style-polaroid .mc-price-stamp { display: inline-block; transform: rotate(5deg); }

/* ===== ACCENT COLORS (price stamp) ===== */
.mc-accent-red .mc-price-stamp { background: #c0392b; color: #fff; }
.mc-accent-gold .mc-price-stamp { background: #d4a017; color: #fff; }
.mc-accent-teal .mc-price-stamp { background: #2a9d8f; color: #fff; }
.mc-accent-brown .mc-price-stamp { background: #2c1810; color: #ede8df; }

/* Starburst uses ::before for the shape, so we set its bg */
.mc-accent-red.mc-tag-starburst .mc-price-stamp::before { background: #c0392b; }
.mc-accent-gold.mc-tag-starburst .mc-price-stamp::before { background: #d4a017; }
.mc-accent-teal.mc-tag-starburst .mc-price-stamp::before { background: #2a9d8f; }
.mc-accent-brown.mc-tag-starburst .mc-price-stamp::before { background: #2c1810; }

/* Rubber stamp uses border color, not fill */
.mc-accent-red.mc-tag-stamp-outline .mc-price-stamp { border-color: #c0392b; color: #c0392b; }
.mc-accent-gold.mc-tag-stamp-outline .mc-price-stamp { border-color: #d4a017; color: #d4a017; }
.mc-accent-teal.mc-tag-stamp-outline .mc-price-stamp { border-color: #2a9d8f; color: #2a9d8f; }
.mc-accent-brown.mc-tag-stamp-outline .mc-price-stamp { border-color: #2c1810; color: #2c1810; }

/* ===== PHOTO POSITION OVERRIDES ===== */
/* These override the default photo column order per style */
.mc-photo-right .mc-photo-col { order: 2; }
.mc-photo-right .mc-info-col { order: 1; }
.mc-photo-right .mc-info-left { order: 1; }
.mc-photo-right .mc-info-right { order: 3; }

/* Photo behind: used with fullbleed or as overlay */
.mc-photo-behind .mc-photo-col {
    position: absolute; inset: 0; z-index: 0; opacity: 0.15;
}
.mc-photo-behind .mc-photo-col img {
    width: 100%; height: 100%; object-fit: cover;
}
.mc-photo-behind .mc-info-col { position: relative; z-index: 1; }

/* Photo none */
.mc-photo-none .mc-photo-col { display: none; }

/* Photo overflow */
.mc-photo-overflow .mc-photo-col { overflow: visible; }
.mc-photo-overflow .mc-photo-col img {
    transform: scale(1.15);
}

/* ── Price Tag Position Overrides ── */
.mc-tag-pos-top-right .mc-price-stamp { position: absolute; top: 8px; right: 8px; z-index: 2; width: fit-content; }
.mc-tag-pos-top-left .mc-price-stamp { position: absolute; top: 8px; left: 8px; z-index: 2; width: fit-content; }
.mc-tag-pos-bottom-right .mc-price-stamp { position: absolute; bottom: 8px; right: 8px; z-index: 2; width: fit-content; }
.mc-tag-pos-bottom-left .mc-price-stamp { position: absolute; bottom: 8px; left: 8px; z-index: 2; width: fit-content; }
.mc-tag-pos-inline .mc-price-stamp { position: static; display: inline-block; transform: rotate(2deg); margin-bottom: 6px; }

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
    .merch-w-small { grid-column: span 3; }
    .merch-w-medium { grid-column: span 3; }
    .merch-w-large { grid-column: span 6; }
    .merch-w-full { grid-column: span 6; }
    .merch-style-catalog,
    .merch-style-editorial,
    .merch-style-postcard { grid-template-columns: 1fr; }
    .merch-style-showroom { grid-template-columns: 1fr; }
    .merch-style-showroom .mc-info-left { text-align: left; }
    .merch-style-postcard .mc-photo-col { border-right: none; border-bottom: 3px solid #2c1810; }
}

/* ===== CARD BUILDER OVERLAY CONTROLS ===== */
.cb-group { margin-bottom: 18px; }
.cb-title {
    font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px;
    color: #8b7355; margin-bottom: 8px; padding-bottom: 5px; border-bottom: 1px solid #333;
}
.cb-label { font-size: 11px; font-weight: 600; color: #999; margin-bottom: 4px; display: block; }
.cb-style-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.cb-style-thumb {
    aspect-ratio: 4/3; border: 2px solid #444; border-radius: 4px; cursor: pointer;
    background: #2a2a2a; transition: all 0.15s; display: flex; align-items: center;
    justify-content: center; position: relative;
}
.cb-style-thumb:hover { border-color: #888; }
.cb-style-thumb.active { border-color: #d4a017; background: #332a1a; }
.cb-thumb-label {
    font-size: 9px; color: #888; text-align: center; font-weight: 600;
    text-transform: uppercase; letter-spacing: 0.5px;
}
.cb-style-thumb.active .cb-thumb-label { color: #d4a017; }
.cb-swatches { display: flex; gap: 6px; flex-wrap: wrap; }
.cb-swatch {
    width: 28px; height: 28px; border-radius: 4px; cursor: pointer;
    border: 2px solid transparent; transition: border-color 0.15s;
}
.cb-swatch:hover { border-color: #888; }
.cb-swatch.active { border-color: #d4a017; }
.cb-pills { display: flex; flex-wrap: wrap; gap: 5px; }
.cb-pill {
    padding: 5px 10px; font-size: 11px; font-weight: 600; border: 1px solid #444;
    background: #2a2a2a; color: #999; cursor: pointer; border-radius: 3px; transition: all 0.15s;
}
.cb-pill:hover { border-color: #888; color: #ccc; }
.cb-pill.active { background: #d4a017; color: #1a1a1a; border-color: #d4a017; }
.cb-range-row { display: flex; align-items: center; gap: 8px; }
.cb-range { width: 100%; accent-color: #d4a017; }
.cb-range-val { font-size: 11px; color: #666; min-width: 36px; text-align: right; }
.cb-toggle-row { display: flex; align-items: center; gap: 8px; }
.cb-toggle {
    width: 36px; height: 20px; background: #444; border-radius: 10px; position: relative;
    cursor: pointer; transition: background 0.2s;
}
.cb-toggle.on { background: #d4a017; }
.cb-toggle::after {
    content: ''; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px;
    background: #fff; border-radius: 50%; transition: left 0.2s;
}
.cb-toggle.on::after { left: 18px; }