/* ════════════════════════════════════════════════════════════════
   miacasa configurator v2.2 — frontend (compact)
   Λιτό, μικρό σε ύψος, κατανοητό: αριθμημένα βήματα, μικρά στρογγυλά
   δείγματα, η επιλογή γράφεται δίπλα στον τίτλο, ζωντανή τιμή.
   Κείμενα ≥ 15px · μεγάλα σημεία αφής · έντονες αντιθέσεις.

   Όλοι οι κανόνες ξεκινούν από .mcc[data-mcc] ώστε να «κερδίζουν» τα
   γενικά στυλ του theme (Woodmart / Elementor). Τα !important υπάρχουν
   μόνο εκεί που το site έχει ήδη !important (π.χ. border-radius στα button).
   ════════════════════════════════════════════════════════════════ */

.mcc[data-mcc] {
    --mcc-ink:        #1A1614;
    --mcc-ink-2:      #3A322E;
    --mcc-muted:      #5C524D;
    --mcc-bg:         #FCFAF7;
    --mcc-cream:      #F8F4EE;
    --mcc-cream-2:    #F0E9DF;
    --mcc-paper:      #FFFFFF;
    --mcc-line:       #E6DED2;
    --mcc-line-2:     #CDC2B3;
    --mcc-bord:       #72383D;
    --mcc-bord-2:     #5A2B30;
    --mcc-bord-tint:  #F7EEEE;
    --mcc-gold:       #B8965A;
    --mcc-gold-ink:   #7A5C25;
    --mcc-gold-tint:  #F5EDDD;
    --mcc-err:        #A8231B;
    --mcc-err-tint:   #FCEDEB;
    --mcc-serif: "EB Garamond", "Cormorant Garamond", Georgia, "Times New Roman", serif;
    --mcc-sans:  "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --mcc-ease:   cubic-bezier(.22, 1, .36, 1);
    --mcc-spring: cubic-bezier(.34, 1.56, .64, 1);

    color: var(--mcc-ink);
    font-family: var(--mcc-sans);
    font-size: 16px;
    line-height: 1.45;
    font-weight: 500;
    letter-spacing: normal;
    text-transform: none;
    text-align: left;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-text-size-adjust: 100%;
}

/* ── Βασικό reset μέσα στον configurator ───────────────────────── */
.mcc[data-mcc] *,
.mcc[data-mcc] *::before,
.mcc[data-mcc] *::after { box-sizing: border-box; }

.mcc[data-mcc] h2, .mcc[data-mcc] h3, .mcc[data-mcc] p,
.mcc[data-mcc] ul, .mcc[data-mcc] ol, .mcc[data-mcc] li,
.mcc[data-mcc] output, .mcc[data-mcc] del, .mcc[data-mcc] label {
    margin: 0; padding: 0; border: 0;
    font: inherit; color: inherit;
    text-transform: none; letter-spacing: normal;
    background: none; list-style: none;
}
.mcc[data-mcc] h2, .mcc[data-mcc] h3 { display: block; line-height: 1.25; }
.mcc[data-mcc] del { text-decoration: line-through; }

.mcc[data-mcc] button {
    all: unset;
    box-sizing: border-box;
    cursor: pointer;
    font: inherit;
    color: inherit;
    text-align: inherit;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    -webkit-user-select: none;
    user-select: none;
}
.mcc[data-mcc] button[disabled] { cursor: default; }
.mcc[data-mcc] img {
    display: block;
    max-width: none; height: auto;
    margin: 0; padding: 0; border: 0;
    border-radius: 0; box-shadow: none;
    opacity: 1;
}
.mcc[data-mcc] a { text-decoration: none; color: inherit; box-shadow: none; }
.mcc[data-mcc] .mcc-ico { width: 20px; height: 20px; flex: 0 0 auto; display: block; }
.mcc[data-mcc] [hidden] { display: none !important; }

/* Ορατό focus για πληκτρολόγιο */
.mcc[data-mcc] button:focus-visible,
.mcc[data-mcc] a:focus-visible,
.mcc[data-mcc] input:focus-visible + .mcc-check__box {
    outline: 3px solid var(--mcc-ink) !important;
    outline-offset: 3px !important;
}

/* ════════════════════════════════════════════════════════════════
   ΚΟΥΤΙ
   ════════════════════════════════════════════════════════════════ */
.mcc-root.mcc[data-mcc] {
    container-type: inline-size;
    container-name: mcc;
    display: block;
    position: relative;
    margin: 22px 0;
    padding: 12px 14px 12px;
    background: var(--mcc-bg);
    border: 1px solid var(--mcc-line);
    border-radius: 16px;
    overflow: visible;
    clear: both;
}
/* Αν ο γύρω χώρος «μαζεύεται» στο περιεχόμενο (βλ. JS), δουλεύουμε χωρίς container queries */
.mcc-root.mcc[data-mcc].mcc-nocq { container-type: normal; }

/* Elementor: το widget που περιέχει τον configurator πιάνει όλο το πλάτος
   (στο miacasa.gr το widget του hook έχει «Align self: center»). */
.elementor-widget:has(> .elementor-widget-container > .mcc-root),
.elementor-widget:has(> .mcc-root) {
    align-self: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* ── Μία γραμμή εξήγηση ───────────────────────────────────────── */
.mcc[data-mcc] .mcc-intro {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 2px 0 12px;
    font-family: var(--mcc-sans);
    font-size: 18px;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: -.005em;
    text-align: center;
    color: var(--mcc-ink);
}
.mcc[data-mcc] .mcc-intro .mcc-ico { width: 15px; height: 15px; flex: none; color: var(--mcc-gold); }

/* ════════════════════════════════════════════════════════════════
   ΒΗΜΑΤΑ
   ════════════════════════════════════════════════════════════════ */
.mcc[data-mcc] .mcc-step {
    position: relative;
    padding: 12px 0 14px;
    border-top: 1px solid var(--mcc-line);
    scroll-margin-top: 96px;
}
.mcc[data-mcc] .mcc-step__head {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 30px;
    margin-bottom: 10px;
}
.mcc[data-mcc] .mcc-step__num {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 27px; height: 27px;
    border-radius: 50%;
    border: 1.5px solid var(--mcc-ink-2);
    background: var(--mcc-paper);
    color: var(--mcc-ink);
    font-size: 15px;
    font-weight: 800;
    line-height: 1;
    font-variant-numeric: lining-nums;
    transition: background-color .35s, border-color .35s, color .35s;
}
.mcc[data-mcc] .mcc-step__num .mcc-ico { display: none; width: 16px; height: 16px; stroke-width: 3; }
.mcc[data-mcc] .mcc-step.is-done .mcc-step__num { background: var(--mcc-bord); border-color: var(--mcc-bord); color: #fff; }
.mcc[data-mcc] .mcc-step.is-done .mcc-step__n { display: none; }
.mcc[data-mcc] .mcc-step.is-done .mcc-step__num .mcc-ico { display: block; }
.mcc[data-mcc] .mcc-step.is-next .mcc-step__num { border-color: var(--mcc-gold-ink); }

.mcc[data-mcc] .mcc-step__title {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.3;
    color: var(--mcc-ink);
    margin: 0;
    overflow-wrap: anywhere;
}
.mcc[data-mcc] .mcc-step__opt { font-size: 15px; font-weight: 600; color: var(--mcc-muted); }
.mcc[data-mcc] .mcc-step__val { display: inline; }
.mcc[data-mcc] .mcc-step__sep { color: var(--mcc-ink); }
.mcc[data-mcc] .mcc-step__vname { color: var(--mcc-bord); font-weight: 800; }
.mcc[data-mcc] .mcc-step__val.is-swap .mcc-step__vname { display: inline-block; animation: mcc-swap .45s var(--mcc-ease); }

.mcc[data-mcc] .mcc-step__side { flex: 0 0 auto; display: flex; align-items: center; margin-left: auto; }
.mcc[data-mcc] .mcc-step__need {
    display: inline-flex;
    align-items: center;
    padding: 3px 11px;
    border-radius: 999px;
    background: var(--mcc-bord-tint);
    color: var(--mcc-bord);
    font-size: 15px;
    font-weight: 800;
    line-height: 1.35;
    white-space: nowrap;
}
.mcc[data-mcc] .mcc-step.is-done .mcc-step__need,
.mcc[data-mcc] .mcc-step.is-optional .mcc-step__need { display: none; }
.mcc[data-mcc] .mcc-step.is-invalid .mcc-step__need { background: var(--mcc-err); color: #fff; animation: mcc-shake .5s; }
.mcc[data-mcc] .mcc-step__price {
    font-size: 15px;
    font-weight: 800;
    color: var(--mcc-gold-ink);
    white-space: nowrap;
}
.mcc[data-mcc] .mcc-step__price:empty { display: none; }
.mcc[data-mcc] .mcc-step__price.is-swap { animation: mcc-swap .45s var(--mcc-ease); }
.mcc[data-mcc] .mcc-step__desc { margin: -4px 0 10px; font-size: 15px; color: var(--mcc-muted); }

/* ════════════════════════════════════════════════════════════════
   ΔΕΙΓΜΑΤΑ (χρώματα / υφάσματα) — μικροί κύκλοι
   ════════════════════════════════════════════════════════════════ */
.mcc[data-mcc] .mcc-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(44px, 1fr));
    gap: 10px 8px;
    align-content: start;
    align-items: start;
}
.mcc[data-mcc] .mcc-tiles:not(.is-open) .mcc-tile.is-hidden { display: none; }

.mcc[data-mcc] .mcc-tile,
.mcc[data-mcc] .mcc-more {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    border-radius: 50% !important;
}
.mcc[data-mcc] .mcc-tile::before,
.mcc[data-mcc] .mcc-more::before { content: ""; display: block; padding-top: 100%; }
.mcc[data-mcc] .mcc-tile__media {
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    display: block;
    border-radius: 50%;
    overflow: hidden;
    background-color: var(--mcc-c, #d9d2c7);
    box-shadow: inset 0 0 0 1px rgba(26, 22, 20, .14);
    transition: transform .25s var(--mcc-ease), box-shadow .25s var(--mcc-ease);
}
.mcc[data-mcc] .mcc-tile__img {
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    max-width: none !important;
    object-fit: cover;
    border-radius: 50% !important;
}
.mcc[data-mcc] .mcc-tile__img:not([src]) { visibility: hidden; }

/* Επιλεγμένο: δαχτυλίδι + ✓ */
.mcc[data-mcc] .mcc-tile.is-selected .mcc-tile__media {
    box-shadow: 0 0 0 2px var(--mcc-bg), 0 0 0 4px var(--mcc-bord), 0 8px 16px -8px rgba(26, 22, 20, .55);
    transform: scale(1.05);
}
.mcc[data-mcc] .mcc-tile__tick {
    position: absolute;
    top: -5px; right: -5px;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 19px; height: 19px;
    border-radius: 50%;
    background: var(--mcc-bord);
    color: #fff;
    box-shadow: 0 0 0 2px var(--mcc-bg);
    transform: scale(0);
    transition: transform .35s var(--mcc-spring);
}
.mcc[data-mcc] .mcc-tile__tick .mcc-ico { width: 12px; height: 12px; stroke-width: 3.6; }
.mcc[data-mcc] .mcc-tile.is-selected .mcc-tile__tick { transform: scale(1); }
.mcc[data-mcc] .mcc-tile:active .mcc-tile__media { transform: scale(.94); }
.mcc[data-mcc] .mcc-tile:focus-visible { outline: none !important; }
.mcc[data-mcc] .mcc-tile:focus-visible .mcc-tile__media { outline: 3px solid var(--mcc-ink); outline-offset: 4px; }

/* «€» = επιπλέον χρέωση */
.mcc[data-mcc] .mcc-tile__cost {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 17px; height: 17px;
    border-radius: 50%;
    background: var(--mcc-gold);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    box-shadow: 0 0 0 2px var(--mcc-bg);
}
.mcc[data-mcc] .mcc-tile > .mcc-tile__cost { position: absolute; left: -3px; bottom: -2px; z-index: 1; }

@media (hover: hover) and (pointer: fine) {
    .mcc[data-mcc] .mcc-tile:hover .mcc-tile__media { transform: scale(1.08); box-shadow: inset 0 0 0 1px rgba(26, 22, 20, .2), 0 8px 16px -8px rgba(26, 22, 20, .5); }
    .mcc[data-mcc] .mcc-tile.is-selected:hover .mcc-tile__media { box-shadow: 0 0 0 2px var(--mcc-bg), 0 0 0 4px var(--mcc-bord), 0 8px 16px -8px rgba(26, 22, 20, .55); }
}

/* «+6» — τα υπόλοιπα δείγματα */
.mcc[data-mcc] .mcc-more { box-shadow: inset 0 0 0 1.5px var(--mcc-line-2); background: var(--mcc-paper); color: var(--mcc-ink-2); transition: background-color .2s, color .2s; }
.mcc[data-mcc] .mcc-more__text {
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 19px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.02em;
    font-variant-numeric: lining-nums tabular-nums;
}
.mcc[data-mcc] .mcc-more.is-long .mcc-more__text { font-size: 15px; }
.mcc[data-mcc] .mcc-more[aria-expanded="true"] .mcc-more__text { font-size: 30px; font-weight: 500; padding-bottom: 3px; }
.mcc[data-mcc] .mcc-more { background: var(--mcc-cream); color: var(--mcc-bord); box-shadow: inset 0 0 0 1.5px var(--mcc-gold); }
.mcc[data-mcc] .mcc-more:hover { background: var(--mcc-bord); color: #fff; box-shadow: none; }
.mcc[data-mcc] .mcc-tile.is-reveal { animation: mcc-pop-in .45s var(--mcc-ease) both; animation-delay: var(--d, 0ms); }

/* «Wow» άνοιγμα: πάτημα του «+» με χρυσό κύμα, «προσγείωση» δειγμάτων με λάμψη */
.mcc[data-mcc] .mcc-more::after {
    content: "";
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    border-radius: 50%;
    box-shadow: 0 0 0 2px var(--mcc-gold);
    opacity: 0;
    pointer-events: none;
}
.mcc[data-mcc] .mcc-more.is-press { animation: mcc-press .5s cubic-bezier(.34, 1.56, .64, 1); }
.mcc[data-mcc] .mcc-more.is-press::after { animation: mcc-ripple .7s cubic-bezier(.22, 1, .36, 1); }
.mcc[data-mcc] .mcc-more.is-land::after { animation: mcc-ripple .8s cubic-bezier(.22, 1, .36, 1); }
.mcc[data-mcc] .mcc-tile.is-land .mcc-tile__media { animation: mcc-land .65s cubic-bezier(.22, 1, .36, 1); }
@keyframes mcc-press { 0% { scale: 1; } 35% { scale: .82; } 100% { scale: 1; } }
@keyframes mcc-ripple {
    0% { opacity: .9; transform: scale(1); box-shadow: 0 0 0 3px var(--mcc-gold); }
    100% { opacity: 0; transform: scale(2.1); box-shadow: 0 0 0 1px var(--mcc-gold); }
}
@keyframes mcc-land {
    0% { box-shadow: inset 0 0 0 1px rgba(26, 22, 20, .14), 0 0 0 0 rgba(184, 150, 90, .9); filter: brightness(1.08); }
    40% { box-shadow: inset 0 0 0 1px rgba(26, 22, 20, .14), 0 0 0 4px rgba(184, 150, 90, .4); }
    100% { box-shadow: inset 0 0 0 1px rgba(26, 22, 20, .14), 0 0 0 10px rgba(184, 150, 90, 0); filter: none; }
}

/* Κάτω από τα δείγματα: υπόμνημα + μεγέθυνση */
.mcc[data-mcc] .mcc-step__foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 4px 14px;
    margin-top: 10px;
}
.mcc[data-mcc] .mcc-legend { display: inline-flex; align-items: center; gap: 6px; font-size: 15px; font-weight: 600; color: var(--mcc-muted); }
.mcc[data-mcc] .mcc-zoom {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: -10px 0 -10px auto;
    padding: 10px 0;
    font-size: 15px;
    font-weight: 800;
    color: var(--mcc-bord);
}
.mcc[data-mcc] .mcc-zoom .mcc-ico { width: 19px; height: 19px; }
.mcc[data-mcc] .mcc-zoom:hover span { text-decoration: underline; text-underline-offset: 3px; }

/* ════════════════════════════════════════════════════════════════
   ΚΟΥΜΠΙΑ ΕΠΙΛΟΓΗΣ (π.χ. προεκτάσεις, σετ)
   ════════════════════════════════════════════════════════════════ */
.mcc[data-mcc] .mcc-choices {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(136px, 1fr));
    gap: 8px;
}
.mcc[data-mcc] .mcc-choice {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 52px;
    padding: 7px 12px;
    border-radius: 12px !important;
    background: var(--mcc-paper);
    box-shadow: inset 0 0 0 1.5px var(--mcc-line-2);
    color: var(--mcc-ink);
    text-align: left;
    transition: box-shadow .2s, background-color .2s;
}
/* ✓ στη γωνία όταν επιλεγεί (όπως στα δείγματα) */
.mcc[data-mcc] .mcc-choice__radio {
    position: absolute;
    top: -6px; right: -6px;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px; height: 20px;
    border-radius: 50%;
    background: var(--mcc-bord);
    color: #fff;
    box-shadow: 0 0 0 2px var(--mcc-bg);
    transform: scale(0);
    transition: transform .35s var(--mcc-spring);
}
.mcc[data-mcc] .mcc-choice__radio .mcc-ico { width: 13px; height: 13px; stroke-width: 3.6; }
.mcc[data-mcc] .mcc-choice__img { flex: 0 0 auto; width: 40px !important; height: 40px !important; object-fit: cover; border-radius: 8px !important; }
.mcc[data-mcc] .mcc-choice__text { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.mcc[data-mcc] .mcc-choice__label { font-size: 16px; font-weight: 800; line-height: 1.25; color: var(--mcc-ink); overflow-wrap: anywhere; }
.mcc[data-mcc] .mcc-choice__price { font-size: 15px; font-weight: 600; line-height: 1.3; color: var(--mcc-muted); }
.mcc[data-mcc] .mcc-choice.has-cost .mcc-choice__price { color: var(--mcc-bord); font-weight: 800; }
.mcc[data-mcc] .mcc-choice.is-selected { background: var(--mcc-bord-tint); box-shadow: inset 0 0 0 2px var(--mcc-bord); }
.mcc[data-mcc] .mcc-choice.is-selected .mcc-choice__radio { transform: scale(1); }
.mcc[data-mcc] .mcc-choice:active { background: var(--mcc-cream-2); }
@media (hover: hover) and (pointer: fine) {
    .mcc[data-mcc] .mcc-choice:hover { box-shadow: inset 0 0 0 1.5px var(--mcc-ink); }
    .mcc[data-mcc] .mcc-choice.is-selected:hover { box-shadow: inset 0 0 0 2px var(--mcc-bord); }
}

/* ════════════════════════════════════════════════════════════════
   ΤΣΕΚ (ναι / όχι)
   ════════════════════════════════════════════════════════════════ */
.mcc[data-mcc] .mcc-checks { display: grid; gap: 6px; }
.mcc[data-mcc] .mcc-check {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 50px;
    margin: 0;
    padding: 8px 12px 8px 10px;
    border-radius: 12px;
    background: var(--mcc-paper);
    box-shadow: inset 0 0 0 1.5px var(--mcc-line-2);
    cursor: pointer;
    color: var(--mcc-ink);
    transition: box-shadow .2s, background-color .2s;
}
.mcc[data-mcc] .mcc-check__input {
    position: absolute !important;
    opacity: 0 !important;
    width: 1px !important; height: 1px !important;
    margin: 0 !important;
    pointer-events: none;
}
.mcc[data-mcc] .mcc-check__box {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px; height: 22px;
    border-radius: 6px;
    background: #fff;
    box-shadow: inset 0 0 0 2px var(--mcc-ink-2);
    color: #fff;
    transition: background-color .2s, box-shadow .2s;
}
.mcc[data-mcc] .mcc-check__box .mcc-ico { width: 15px; height: 15px; stroke-width: 3.4; transform: scale(0); transition: transform .3s var(--mcc-spring); }
.mcc[data-mcc] .mcc-check__label { flex: 1 1 auto; font-size: 16px; font-weight: 700; line-height: 1.3; }
.mcc[data-mcc] .mcc-check__price { flex: 0 0 auto; font-size: 15px; font-weight: 700; color: var(--mcc-muted); text-align: right; }
.mcc[data-mcc] .mcc-check.has-cost .mcc-check__price { color: var(--mcc-bord); font-weight: 800; }
.mcc[data-mcc] .mcc-check.is-selected { background: var(--mcc-bord-tint); box-shadow: inset 0 0 0 2px var(--mcc-bord); }
.mcc[data-mcc] .mcc-check.is-selected .mcc-check__box { background: var(--mcc-bord); box-shadow: none; }
.mcc[data-mcc] .mcc-check.is-selected .mcc-check__box .mcc-ico { transform: scale(1); }
.mcc[data-mcc] .mcc-check.is-ping { animation: mcc-choice-pop .45s var(--mcc-spring); }

/* ════════════════════════════════════════════════════════════════
   ΠΟΣΟΤΗΤΑ
   ════════════════════════════════════════════════════════════════ */
.mcc[data-mcc] .mcc-qty { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.mcc[data-mcc] .mcc-qty__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px; height: 46px;
    border-radius: 50% !important;
    background: var(--mcc-paper);
    box-shadow: inset 0 0 0 1.5px var(--mcc-ink);
    color: var(--mcc-ink);
    transition: background-color .2s, color .2s, opacity .2s;
}
.mcc[data-mcc] .mcc-qty__btn .mcc-ico { width: 22px; height: 22px; stroke-width: 2.6; }
.mcc[data-mcc] .mcc-qty__btn[disabled] { opacity: .35; }
.mcc[data-mcc] .mcc-qty__btn:not([disabled]):active { background: var(--mcc-ink); color: #fff; }
.mcc[data-mcc] .mcc-qty__val {
    min-width: 34px;
    text-align: center;
    font-family: var(--mcc-serif);
    font-size: 28px;
    font-weight: 600;
    line-height: 1;
    font-variant-numeric: lining-nums tabular-nums;
}
.mcc[data-mcc] .mcc-qty__unit { margin-left: 4px; font-size: 15px; font-weight: 700; color: var(--mcc-bord); }

/* ════════════════════════════════════════════════════════════════
   ΤΙΜΗ & ΚΑΛΑΘΙ
   ════════════════════════════════════════════════════════════════ */
.mcc[data-mcc] .mcc-foot { padding-top: 12px; border-top: 1px solid var(--mcc-line); }
.mcc[data-mcc] .mcc-total__row {
    position: relative;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 2px 10px;
}
.mcc[data-mcc] .mcc-total__label { font-size: 16px; font-weight: 800; color: var(--mcc-ink); }
.mcc[data-mcc] .mcc-total__vat { font-size: 15px; font-weight: 600; color: var(--mcc-muted); }
.mcc[data-mcc] .mcc-total__amount {
    position: relative;
    font-family: var(--mcc-serif);
    font-size: 32px;
    font-weight: 600;
    line-height: 1;
    color: var(--mcc-ink);
    font-variant-numeric: lining-nums tabular-nums;
    white-space: nowrap;
    transition: color .3s;
}
.mcc[data-mcc] .mcc-total__was {
    margin-top: 4px;
    text-align: right;
    font-size: 15px;
    font-weight: 600;
    color: var(--mcc-ink-2);
}
.mcc[data-mcc] .mcc-total__del {
    font-weight: 700;
    text-decoration: line-through;
    text-decoration-thickness: 2px;
    text-decoration-color: var(--mcc-bord);
    white-space: nowrap;
}
.mcc[data-mcc] .mcc-total__save { color: var(--mcc-gold-ink); font-weight: 800; white-space: nowrap; }

.mcc[data-mcc] .mcc-status {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
    color: var(--mcc-bord);
}
.mcc[data-mcc] .mcc-status.is-error {
    padding: 8px 12px;
    border-radius: 10px;
    background: var(--mcc-err-tint);
    color: var(--mcc-err);
}

/* Κουμπί καλαθιού */
.mcc[data-mcc] .mcc-cta,
.mcc[data-mcc] .mcc-sticky__cta,
.mcc[data-mcc] .mcc-done__primary {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 54px;
    padding: 10px 18px;
    border-radius: 12px !important;
    background: var(--mcc-bord);
    color: #fff;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    box-shadow: 0 10px 20px -12px rgba(114, 56, 61, .9);
    overflow: hidden;
    transition: background-color .2s, transform .15s, box-shadow .2s;
}
.mcc[data-mcc] .mcc-cta { margin-top: 10px; }
.mcc[data-mcc] .mcc-cta:hover,
.mcc[data-mcc] .mcc-sticky__cta:hover,
.mcc[data-mcc] .mcc-done__primary:hover { background: var(--mcc-bord-2); color: #fff; }
.mcc[data-mcc] .mcc-cta:active,
.mcc[data-mcc] .mcc-sticky__cta:active,
.mcc[data-mcc] .mcc-done__primary:active { transform: scale(.985); }
.mcc[data-mcc] .mcc-cta__in { display: inline-flex; align-items: center; gap: 9px; transition: opacity .2s; }
.mcc[data-mcc] .mcc-cta__in .mcc-ico { width: 22px; height: 22px; }
.mcc[data-mcc] .mcc-cta__spin {
    position: absolute;
    top: 50%; left: 50%;
    width: 24px; height: 24px;
    margin: -12px 0 0 -12px;
    border: 3px solid rgba(255,255,255,.35);
    border-top-color: #fff;
    border-radius: 50%;
    opacity: 0;
    animation: mcc-spin .7s linear infinite;
}
.mcc[data-mcc] .is-loading .mcc-cta__in { opacity: 0; }
.mcc[data-mcc] .is-loading .mcc-cta__spin { opacity: 1; }
@keyframes mcc-spin { to { transform: rotate(360deg); } }
.mcc[data-mcc] .mcc-cta.is-ready-glow::after,
.mcc[data-mcc] .mcc-sticky__cta.is-ready-glow::after {
    content: "";
    position: absolute;
    top: 0; bottom: 0; left: -60%;
    width: 45%;
    background: linear-gradient(100deg, rgba(255,255,255,0), rgba(255,255,255,.3), rgba(255,255,255,0));
    transform: skewX(-14deg);
    animation: mcc-glow 1.3s .2s var(--mcc-ease) both;
}
@keyframes mcc-glow { to { left: 130%; } }

/* Ανάλυση τιμής + τηλέφωνο, σε μία γραμμή */
.mcc[data-mcc] .mcc-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 2px 14px;
    margin-top: 6px;
}
.mcc[data-mcc] .mcc-breakdown,
.mcc[data-mcc] .mcc-help {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 0;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--mcc-ink-2);
}
.mcc[data-mcc] .mcc-breakdown .mcc-ico { width: 18px; height: 18px; transition: transform .3s var(--mcc-ease); }
.mcc[data-mcc] .mcc-breakdown[aria-expanded="true"] .mcc-ico { transform: rotate(180deg); }
.mcc[data-mcc] .mcc-breakdown:hover span { text-decoration: underline; text-underline-offset: 3px; }
.mcc[data-mcc] .mcc-help { margin-left: auto; color: var(--mcc-ink); }
.mcc[data-mcc] .mcc-help .mcc-ico { width: 18px; height: 18px; color: var(--mcc-bord); }
.mcc[data-mcc] .mcc-help__num { font-weight: 800; white-space: nowrap; text-decoration: underline; text-decoration-color: var(--mcc-line-2); text-underline-offset: 3px; }
.mcc[data-mcc] .mcc-help:hover .mcc-help__num { text-decoration-color: currentColor; }

.mcc[data-mcc] .mcc-sum__list {
    margin-top: 4px;
    padding: 4px 12px;
    border-radius: 12px;
    background: var(--mcc-paper);
    box-shadow: inset 0 0 0 1px var(--mcc-line);
    animation: mcc-fold .35s var(--mcc-ease);
}
.mcc[data-mcc] .mcc-sum__row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px dashed var(--mcc-line-2);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.35;
}
.mcc[data-mcc] .mcc-sum__row:last-child { border-bottom: 0; }
.mcc[data-mcc] .mcc-sum__what { min-width: 0; color: var(--mcc-ink-2); overflow-wrap: anywhere; }
.mcc[data-mcc] .mcc-sum__what b { color: var(--mcc-ink); font-weight: 800; }
.mcc[data-mcc] .mcc-sum__amount { flex: 0 0 auto; font-weight: 800; color: var(--mcc-ink); white-space: nowrap; }
.mcc[data-mcc] .mcc-sum__amount.is-included { font-weight: 600; color: var(--mcc-muted); }
.mcc[data-mcc] .mcc-sum__row.is-missing .mcc-sum__what b { color: var(--mcc-err); }
.mcc[data-mcc] .mcc-sum__row.is-flash { animation: mcc-row-flash 1.2s ease-out; }

/* ════════════════════════════════════════════════════════════════
   ΣΤΑΘΕΡΗ ΜΠΑΡΑ ΤΙΜΗΣ (κάτω) — μόνο όσο ο πελάτης διαλέγει
   ════════════════════════════════════════════════════════════════ */
.mcc-sticky.mcc[data-mcc] {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 100000;
    background: #fff;
    border-top: 1px solid var(--mcc-line);
    box-shadow: 0 -10px 26px -14px rgba(26, 22, 20, .38);
    padding: 8px 12px;
    padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px));
    transform: translateY(115%);
    visibility: hidden;
    transition: transform .4s var(--mcc-ease), visibility 0s linear .4s;
}
.mcc-sticky.mcc[data-mcc].is-visible {
    transform: none;
    visibility: visible;
    transition: transform .4s var(--mcc-ease), visibility 0s;
}
.mcc[data-mcc] .mcc-sticky__bar {
    position: absolute;
    top: -1px; left: 0;
    height: 3px;
    width: 0;
    background: var(--mcc-gold);
    transition: width .5s var(--mcc-ease);
}
.mcc[data-mcc] .mcc-sticky__in {
    display: flex;
    align-items: center;
    gap: 10px;
    max-width: 980px;
    margin: 0 auto;
}
.mcc[data-mcc] .mcc-sticky__price { position: relative; display: flex; flex-direction: column; flex: 1 1 auto; min-width: 0; }
.mcc[data-mcc] .mcc-sticky__label { font-size: 15px; font-weight: 700; color: var(--mcc-muted); line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mcc[data-mcc] .mcc-sticky__label b { color: var(--mcc-bord); font-weight: 800; }
.mcc[data-mcc] .mcc-sticky__line { display: flex; align-items: baseline; gap: 8px; white-space: nowrap; }
.mcc[data-mcc] .mcc-sticky__amount {
    position: relative;
    font-family: var(--mcc-serif);
    font-size: 25px;
    font-weight: 600;
    line-height: 1.1;
    color: var(--mcc-ink);
    font-variant-numeric: lining-nums tabular-nums;
    transition: color .3s;
}
.mcc[data-mcc] .mcc-sticky__was { font-size: 15px; font-weight: 700; color: var(--mcc-ink-2); }
.mcc[data-mcc] .mcc-sticky__was del { text-decoration-thickness: 2px; text-decoration-color: var(--mcc-bord); }
.mcc[data-mcc] .mcc-sticky__cta {
    flex: 0 0 auto;
    width: auto;
    min-height: 48px;
    padding: 8px 16px;
    font-size: 16px;
    border-radius: 12px !important;
    box-shadow: none;
}
.mcc[data-mcc] .mcc-sticky__cta .mcc-ico { width: 20px; height: 20px; }
.mcc[data-mcc] .mcc-sticky__cta .mcc-cta__in { animation: none; }
.mcc[data-mcc] .mcc-sticky__cta.is-swap .mcc-cta__in { animation: mcc-swap .45s var(--mcc-ease); }
.mcc[data-mcc] .mcc-sticky__cta.is-next { background: var(--mcc-ink); }
.mcc[data-mcc] .mcc-sticky__cta.is-next:hover { background: #000; color: #fff; }

/* Ανεβάζουμε το κουμπί τηλεφώνου / «πάνω» του site όταν φαίνεται η μπάρα */
body.mcc-sticky-on .mc-phone-wrap,
body.mcc-sticky-on .scrollToTop {
    bottom: calc(var(--mcc-sticky-h, 70px) + 14px) !important;
    transition: bottom .4s cubic-bezier(.22, 1, .36, 1) !important;
}

/* ════════════════════════════════════════════════════════════════
   ΣΥΝΝΕΦΑΚΙ ΜΕ ΟΝΟΜΑ (hover σε υπολογιστή · μετά το πάτημα σε κινητό)
   ════════════════════════════════════════════════════════════════ */
.mcc-peek.mcc[data-mcc] {
    position: fixed;
    top: 0; left: 0;
    z-index: 100001;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    width: max-content;
    max-width: 220px;
    padding: 8px 10px 9px;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 16px 36px -14px rgba(26, 22, 20, .5), 0 0 0 1px rgba(26, 22, 20, .07);
    pointer-events: none;
    text-align: center;
    opacity: 0;
    transform: translate(-50%, -100%) translateY(6px) scale(.96);
    transform-origin: 50% 100%;
    transition: opacity .16s, transform .22s var(--mcc-ease);
}
.mcc-peek.mcc[data-mcc].is-in { opacity: 1; transform: translate(-50%, -100%); }
.mcc-peek.mcc[data-mcc]::after {
    content: "";
    position: absolute;
    left: 50%; bottom: -6px;
    width: 12px; height: 12px;
    margin-left: -6px;
    background: #fff;
    transform: rotate(45deg);
    box-shadow: 3px 3px 6px -3px rgba(26, 22, 20, .2);
}
.mcc[data-mcc] .mcc-peek__img {
    width: 104px !important; height: 104px !important;
    border-radius: 10px !important;
    object-fit: cover;
    background-color: var(--mcc-c, #ddd);
}
.mcc[data-mcc] span.mcc-peek__img { display: block; }
.mcc[data-mcc] .mcc-peek__name { font-size: 15px; font-weight: 800; line-height: 1.25; color: var(--mcc-ink); text-align: center; }
.mcc[data-mcc] .mcc-peek__code,
.mcc[data-mcc] .mcc-viewer__code {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 7px;
    border-radius: 999px;
    background: var(--mcc-cream);
    color: var(--mcc-ink-2);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
    white-space: nowrap;
    vertical-align: 1px;
}
.mcc[data-mcc] .mcc-viewer__code { background: rgba(255,255,255,.16); color: #fff; font-size: 16px; }
.mcc[data-mcc] .mcc-peek__price { font-size: 15px; font-weight: 800; line-height: 1.2; color: var(--mcc-bord); }
.mcc[data-mcc] .mcc-peek__price.is-free { color: var(--mcc-muted); font-weight: 600; }

/* ════════════════════════════════════════════════════════════════
   ΜΕΓΕΘΥΝΣΗ (όλη η οθόνη)
   ════════════════════════════════════════════════════════════════ */
html.mcc-lock, html.mcc-lock body { overflow: hidden !important; }

.mcc-viewer.mcc[data-mcc] {
    position: fixed;
    top: 0; right: 0; bottom: 0; left: 0;
    z-index: 100002;
    display: none;
    flex-direction: column;
    color: #fff;
    overscroll-behavior: contain;
}
.mcc-viewer.mcc[data-mcc].is-open { display: flex; }
.mcc[data-mcc] .mcc-viewer__bg {
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    background: rgba(22, 18, 16, .93);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    opacity: 0;
    transition: opacity .3s;
}
.mcc-viewer.mcc[data-mcc].is-in .mcc-viewer__bg { opacity: 1; }
.mcc[data-mcc] .mcc-viewer__top {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    padding-top: calc(12px + env(safe-area-inset-top, 0px));
    max-width: 752px;
    width: 100%;
    margin: 0 auto;
}
.mcc[data-mcc] .mcc-viewer__count { font-size: 16px; font-weight: 700; color: rgba(255,255,255,.85); }
.mcc[data-mcc] .mcc-viewer__close,
.mcc[data-mcc] .mcc-viewer__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 50px;
    padding: 0 18px;
    border-radius: 999px !important;
    background: rgba(255,255,255,.14);
    color: #fff;
    font-size: 16px;
    font-weight: 800;
    transition: background-color .2s;
}
.mcc[data-mcc] .mcc-viewer__close:hover,
.mcc[data-mcc] .mcc-viewer__btn:hover { background: rgba(255,255,255,.24); color: #fff; }
.mcc[data-mcc] .mcc-viewer__close .mcc-ico { width: 20px; height: 20px; stroke-width: 2.6; }
.mcc[data-mcc] .mcc-viewer__stage {
    position: relative;
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 0;
    padding: 4px 14px;
}
.mcc[data-mcc] .mcc-viewer__frame {
    position: relative;
    width: min(92vw, 56vh, 720px);
    height: min(92vw, 56vh, 720px);
    border-radius: 18px;
    overflow: hidden;
    background-color: var(--mcc-c, #3a3330);
    box-shadow: 0 30px 80px -20px rgba(0,0,0,.6);
    opacity: 0;
    transform: scale(.96);
    transition: opacity .35s, transform .45s var(--mcc-ease);
    touch-action: pan-y;
}
.mcc-viewer.mcc[data-mcc].is-in .mcc-viewer__frame { opacity: 1; transform: none; }
.mcc[data-mcc] .mcc-viewer__img {
    position: absolute;
    top: 0; left: 0;
    width: 100% !important; height: 100% !important;
    object-fit: cover;
    transition: opacity .3s;
}
.mcc[data-mcc] .mcc-viewer__tick {
    position: absolute;
    top: 14px; right: 14px;
    display: none;
    align-items: center;
    gap: 6px;
    padding: 8px 14px 8px 10px;
    border-radius: 999px;
    background: var(--mcc-bord);
    color: #fff;
    font-size: 15px;
    font-weight: 800;
    box-shadow: 0 6px 16px -6px rgba(0,0,0,.6);
}
.mcc[data-mcc] .mcc-viewer__tick .mcc-ico { width: 18px; height: 18px; stroke-width: 3; }
.mcc-viewer.mcc[data-mcc].is-current .mcc-viewer__tick { display: inline-flex; }
.mcc[data-mcc] .mcc-viewer__bottom {
    position: relative;
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
    padding: 12px 16px;
    padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px));
}
.mcc[data-mcc] .mcc-viewer__group { font-size: 15px; font-weight: 700; color: rgba(255,255,255,.72); }
.mcc[data-mcc] .mcc-viewer__name {
    font-family: var(--mcc-serif);
    font-size: 32px;
    font-weight: 600;
    line-height: 1.1;
    color: #fff;
    overflow-wrap: anywhere;
}
.mcc[data-mcc] .mcc-viewer__price { margin-top: 2px; font-size: 17px; font-weight: 700; color: #EAD9B6; }
.mcc[data-mcc] .mcc-viewer__nav { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 14px; }
.mcc[data-mcc] .mcc-viewer__btn { width: 100%; border-radius: 12px !important; min-height: 54px; }
.mcc[data-mcc] .mcc-viewer__btn .mcc-ico { width: 22px; height: 22px; }
.mcc[data-mcc] .mcc-viewer__prev .mcc-ico { transform: rotate(90deg); }
.mcc[data-mcc] .mcc-viewer__next .mcc-ico { transform: rotate(-90deg); }
.mcc[data-mcc] .mcc-viewer__pick {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    min-height: 58px;
    margin-top: 10px;
    padding: 0 18px;
    border-radius: 12px !important;
    background: #fff;
    color: var(--mcc-ink);
    font-size: 18px;
    font-weight: 800;
    transition: background-color .2s, color .2s;
}
.mcc[data-mcc] .mcc-viewer__pick:hover { background: var(--mcc-gold-tint); color: var(--mcc-ink); }
.mcc[data-mcc] .mcc-viewer__pick .mcc-ico { width: 24px; height: 24px; stroke-width: 2.8; }
.mcc-viewer.mcc[data-mcc].is-current .mcc-viewer__pick { background: var(--mcc-bord); color: #fff; }

/* ════════════════════════════════════════════════════════════════
   ΕΠΙΒΕΒΑΙΩΣΗ «ΠΡΟΣΤΕΘΗΚΕ ΣΤΟ ΚΑΛΑΘΙ»
   ════════════════════════════════════════════════════════════════ */
.mcc-done.mcc[data-mcc] {
    position: fixed;
    top: 0; right: 0; bottom: 0; left: 0;
    z-index: 100003;
    display: none;
    align-items: flex-end;
    justify-content: center;
    overscroll-behavior: contain;
}
.mcc-done.mcc[data-mcc].is-open { display: flex; }
.mcc[data-mcc] .mcc-done__bg {
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    background: rgba(22, 18, 16, .62);
    opacity: 0;
    transition: opacity .3s;
}
.mcc-done.mcc[data-mcc].is-in .mcc-done__bg { opacity: 1; }
.mcc[data-mcc] .mcc-done__card {
    position: relative;
    width: 100%;
    max-width: 520px;
    max-height: 94vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background: #fff;
    border-radius: 22px 22px 0 0;
    padding: 22px 18px;
    padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px));
    color: var(--mcc-ink);
    transform: translateY(105%);
    transition: transform .5s var(--mcc-ease);
}
.mcc-done.mcc[data-mcc].is-in .mcc-done__card { transform: none; }
.mcc[data-mcc] .mcc-done__head { display: flex; align-items: center; gap: 12px; }
.mcc[data-mcc] .mcc-done__check { flex: 0 0 auto; width: 48px; height: 48px; color: var(--mcc-bord); }
.mcc[data-mcc] .mcc-done__check circle { stroke-dasharray: 190; stroke-dashoffset: 190; }
.mcc[data-mcc] .mcc-done__check path { stroke-dasharray: 50; stroke-dashoffset: 50; }
.mcc-done.mcc[data-mcc].is-in .mcc-done__check circle { animation: mcc-draw .7s .15s var(--mcc-ease) forwards; }
.mcc-done.mcc[data-mcc].is-in .mcc-done__check path { animation: mcc-draw .45s .6s var(--mcc-ease) forwards; }
@keyframes mcc-draw { to { stroke-dashoffset: 0; } }
.mcc[data-mcc] .mcc-done__title {
    font-family: var(--mcc-serif);
    font-size: 26px;
    font-weight: 600;
    line-height: 1.15;
    color: var(--mcc-ink);
    margin: 0;
}
.mcc[data-mcc] .mcc-done__product { display: flex; align-items: center; gap: 12px; margin-top: 14px; }
.mcc[data-mcc] .mcc-done__pimg { width: 52px !important; height: 52px !important; border-radius: 10px !important; object-fit: cover; flex: 0 0 auto; background: var(--mcc-cream); }
.mcc[data-mcc] .mcc-done__pname { font-size: 17px; font-weight: 800; line-height: 1.3; }
.mcc[data-mcc] .mcc-done__list { margin-top: 6px; }
.mcc[data-mcc] .mcc-done__list .mcc-sum__row:last-child { border-bottom: 0; }
.mcc[data-mcc] .mcc-done__total {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-top: 4px;
    padding-top: 10px;
    border-top: 1.5px solid var(--mcc-ink);
}
.mcc[data-mcc] .mcc-done__total span { font-size: 16px; font-weight: 800; }
.mcc[data-mcc] .mcc-done__total strong { font-family: var(--mcc-serif); font-size: 30px; font-weight: 600; line-height: 1; white-space: nowrap; }
.mcc[data-mcc] .mcc-done__actions { display: grid; gap: 8px; margin-top: 16px; }
.mcc[data-mcc] .mcc-done__secondary {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 0 18px;
    border-radius: 12px !important;
    background: #fff;
    box-shadow: inset 0 0 0 1.5px var(--mcc-ink);
    color: var(--mcc-ink);
    font-size: 17px;
    font-weight: 800;
    text-align: center;
}
.mcc[data-mcc] .mcc-done__secondary:hover { background: var(--mcc-cream); color: var(--mcc-ink); }
.mcc[data-mcc] .mcc-done__link {
    display: block;
    margin-top: 12px;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    color: var(--mcc-bord);
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* ════════════════════════════════════════════════════════════════
   «ΕΝΔΙΑΦΕΡΟΜΑΙ» — σημείωση κάτω από το κουμπί & «Λάβαμε το αίτημα»
   ════════════════════════════════════════════════════════════════ */
.mcc[data-mcc] .mcc-cta-note {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 8px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.35;
    color: var(--mcc-ink-2);
    text-align: center;
}
.mcc[data-mcc] .mcc-cta-note .mcc-ico { width: 17px; height: 17px; stroke-width: 2.8; color: var(--mcc-gold-ink); }
.mcc[data-mcc] .mcc-status.is-sent {
    padding: 8px 12px;
    border-radius: 10px;
    background: var(--mcc-gold-tint);
    color: var(--mcc-ink);
    animation: mcc-swap .45s var(--mcc-ease);
}
.mcc[data-mcc] .mcc-status.is-sent .mcc-ico { width: 18px; height: 18px; stroke-width: 3; color: var(--mcc-bord); }

/* ════════════════════════════════════════════════════════════════
   ΦΟΡΜΑ ΑΙΤΗΜΑΤΟΣ — κάρτα από κάτω (κινητό) / στο κέντρο (υπολογιστής)
   ════════════════════════════════════════════════════════════════ */
.mcc-ask.mcc[data-mcc] {
    position: fixed;
    top: 0; right: 0; bottom: 0; left: 0;
    z-index: 100004;
    display: none;
    align-items: flex-end;
    justify-content: center;
    padding-bottom: var(--mcc-kb, 0px);
    overscroll-behavior: contain;
}
.mcc-ask.mcc[data-mcc].is-open { display: flex; }
.mcc[data-mcc] .mcc-ask__bg {
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    background: rgba(22, 18, 16, .62);
    opacity: 0;
    transition: opacity .3s;
}
.mcc-ask.mcc[data-mcc].is-in .mcc-ask__bg { opacity: 1; }
.mcc[data-mcc] .mcc-ask__card {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 560px;
    max-height: calc(var(--mcc-vvh, 100vh) - 16px);
    overflow: hidden;
    background: #fff;
    border-radius: 22px 22px 0 0;
    box-shadow: 0 -18px 48px -20px rgba(0, 0, 0, .4);
    color: var(--mcc-ink);
    transform: translateY(105%);
    transition: transform .5s var(--mcc-ease);
}
@supports (height: 100dvh) {
    .mcc[data-mcc] .mcc-ask__card { max-height: calc(var(--mcc-vvh, 100dvh) - 16px); }
}
.mcc-ask.mcc[data-mcc].is-in .mcc-ask__card { transform: none; }
.mcc[data-mcc] .mcc-ask__grip {
    display: block;
    flex: none;
    width: 42px; height: 5px;
    margin: 8px auto 0;
    border-radius: 3px;
    background: var(--mcc-line-2);
}
.mcc[data-mcc] .mcc-ask__close {
    position: absolute;
    top: 10px; right: 10px;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px; height: 44px;
    border-radius: 50% !important;
    background: var(--mcc-cream);
    color: var(--mcc-ink);
    transition: background-color .2s, transform .2s;
}
.mcc[data-mcc] .mcc-ask__close:hover { background: var(--mcc-cream-2); color: var(--mcc-ink); }
.mcc[data-mcc] .mcc-ask__close:active { transform: scale(.92); }
.mcc[data-mcc] .mcc-ask__close .mcc-ico { width: 20px; height: 20px; stroke-width: 2.4; }

.mcc[data-mcc] .mcc-ask__form { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; margin: 0; padding: 0; border: 0; }
.mcc[data-mcc] .mcc-ask__body {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding: 8px 18px 4px;
}
.mcc[data-mcc] .mcc-ask__title {
    margin: 6px 0 0;
    padding-right: 50px;
    font-family: var(--mcc-sans);
    font-size: 23px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -.01em;
    color: var(--mcc-ink);
}
.mcc[data-mcc] .mcc-ask__title:focus,
.mcc[data-mcc] .mcc-ask__dtitle:focus { outline: none !important; }
.mcc[data-mcc] .mcc-ask__sub { margin-top: 4px; font-size: 16px; line-height: 1.45; color: var(--mcc-ink-2); }

/* Η επιλογή του πελάτη */
.mcc[data-mcc] .mcc-ask__pick {
    margin-top: 12px;
    padding: 10px 12px 12px;
    border-radius: 14px;
    background: var(--mcc-bg);
    box-shadow: inset 0 0 0 1px var(--mcc-line);
}
.mcc[data-mcc] .mcc-ask__ptop { display: flex; align-items: center; gap: 12px; }
.mcc[data-mcc] .mcc-ask__pimg {
    flex: 0 0 auto;
    width: 50px !important; height: 50px !important;
    border-radius: 10px !important;
    object-fit: cover;
    background: var(--mcc-cream);
}
.mcc[data-mcc] .mcc-ask__pinfo { flex: 1 1 auto; min-width: 0; }
.mcc[data-mcc] .mcc-ask__pname { font-size: 17px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.mcc[data-mcc] .mcc-ask__price { flex: 0 0 auto; text-align: right; }
.mcc[data-mcc] .mcc-ask__total {
    display: block;
    font-family: var(--mcc-serif);
    font-size: 27px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    font-variant-numeric: lining-nums tabular-nums;
}
.mcc[data-mcc] .mcc-ask__was { display: block; margin-top: 4px; font-size: 15px; font-weight: 600; color: var(--mcc-ink-2); white-space: nowrap; }
.mcc[data-mcc] .mcc-ask__was del { font-weight: 700; text-decoration: line-through; text-decoration-thickness: 2px; text-decoration-color: var(--mcc-bord); }
.mcc[data-mcc] .mcc-ask__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed var(--mcc-line-2);
}
.mcc[data-mcc] .mcc-ask__chip {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    max-width: 100%;
    padding: 4px 12px;
    border-radius: 999px;
    background: #fff;
    box-shadow: inset 0 0 0 1px var(--mcc-line);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--mcc-ink-2);
}
.mcc[data-mcc] .mcc-ask__chip b { font-weight: 800; color: var(--mcc-ink); }
.mcc[data-mcc] .mcc-ask__dot {
    display: block;
    flex: 0 0 auto;
    width: 24px !important; height: 24px !important;
    margin-left: -7px;
    border-radius: 50% !important;
    object-fit: cover;
    background: var(--mcc-c, #ddd);
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .1);
}
.mcc[data-mcc] .mcc-ask__change {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 30px;
    margin-top: 1px;
    padding: 0;
    font-size: 15px;
    font-weight: 700;
    color: var(--mcc-bord);
}
.mcc[data-mcc] .mcc-ask__change .mcc-ico { width: 16px; height: 16px; }
.mcc[data-mcc] .mcc-ask__change:hover span { text-decoration: underline; text-underline-offset: 3px; }

/* Πεδία */
.mcc[data-mcc] .mcc-field { margin-top: 12px; }
.mcc[data-mcc] .mcc-field__label {
    display: block;
    margin: 0 0 5px;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.3;
    color: var(--mcc-ink);
    cursor: pointer;
}
.mcc[data-mcc] .mcc-field__opt { font-size: 15px; font-weight: 600; color: var(--mcc-muted); }
.mcc[data-mcc] input.mcc-field__input,
.mcc[data-mcc] textarea.mcc-field__input {
    -webkit-appearance: none;
    appearance: none;
    display: block;
    width: 100%;
    max-width: none;
    height: 52px;
    min-height: 0;
    margin: 0;
    padding: 0 16px;
    border: 1.5px solid var(--mcc-line-2);
    border-radius: 12px !important; /* το site βάζει !important στα πεδία φορμών */
    background: #fff;
    color: var(--mcc-ink);
    font-family: var(--mcc-sans);
    font-size: 17px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: normal;
    text-transform: none;
    box-shadow: none;
    outline: none;
    transition: border-color .2s, box-shadow .2s, background-color .2s;
}
.mcc[data-mcc] textarea.mcc-field__input { height: auto; min-height: 98px; padding: 12px 16px; line-height: 1.45; resize: vertical; }
.mcc[data-mcc] .mcc-field__input::placeholder { color: #857A73; font-weight: 500; opacity: 1; }
.mcc[data-mcc] .mcc-field__input:hover { border-color: var(--mcc-muted); }
.mcc[data-mcc] input.mcc-field__input:focus,
.mcc[data-mcc] textarea.mcc-field__input:focus {
    border-color: var(--mcc-ink);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(184, 150, 90, .3);
    outline: none;
}
.mcc[data-mcc] .mcc-field__input:focus-visible { outline: none !important; }
.mcc[data-mcc] .mcc-field.is-invalid .mcc-field__input { border-color: var(--mcc-err); background: var(--mcc-err-tint); }
.mcc[data-mcc] .mcc-field.is-invalid .mcc-field__input:focus { box-shadow: 0 0 0 4px rgba(168, 35, 27, .16); }
.mcc[data-mcc] .mcc-field__err {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-top: 6px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
    color: var(--mcc-err);
}
.mcc[data-mcc] .mcc-field__err .mcc-ico { width: 18px; height: 18px; margin-top: 1px; }
.mcc[data-mcc] .mcc-field__err.is-in { animation: mcc-fold .35s var(--mcc-ease); }

.mcc[data-mcc] .mcc-ask__more {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    margin-top: 6px;
    padding: 9px 0;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--mcc-ink);
}
.mcc[data-mcc] .mcc-ask__more .mcc-ico {
    width: 26px; height: 26px;
    padding: 4px;
    border-radius: 50%;
    background: var(--mcc-cream);
    color: var(--mcc-bord);
    stroke-width: 2.6;
    transition: transform .3s var(--mcc-ease), background-color .2s;
}
.mcc[data-mcc] .mcc-ask__more em { font-style: normal; font-weight: 600; color: var(--mcc-muted); }
.mcc[data-mcc] .mcc-ask__more.is-open .mcc-ico { transform: rotate(45deg); }
.mcc[data-mcc] .mcc-ask__more:hover .mcc-ico { background: var(--mcc-cream-2); }
.mcc[data-mcc] .mcc-ask__extra > .mcc-field:first-child { margin-top: 4px; }
.mcc[data-mcc] .mcc-ask__extra.is-fold { animation: mcc-fold .4s var(--mcc-ease); }

.mcc[data-mcc] .mcc-ask__hp { position: absolute !important; left: -9999px !important; top: 0; width: 1px; height: 1px; overflow: hidden; }
.mcc[data-mcc] .mcc-ask__privacy { margin: 8px 0 8px; font-size: 15px; line-height: 1.45; color: var(--mcc-muted); }
.mcc[data-mcc] .mcc-ask__privacy a { color: var(--mcc-ink-2); text-decoration: underline; text-underline-offset: 2px; }
.mcc[data-mcc] .mcc-ask__alert {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 14px;
    padding: 10px 12px;
    border-radius: 12px;
    background: var(--mcc-err-tint);
    color: var(--mcc-err);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.4;
}
.mcc[data-mcc] .mcc-ask__alert .mcc-ico { width: 20px; height: 20px; flex: none; }
.mcc[data-mcc] .mcc-ask__alert.is-in { animation: mcc-shake .5s; }

/* Κάτω μέρος: κουμπί αποστολής (πάντα ορατό) */
.mcc[data-mcc] .mcc-ask__foot {
    flex: none;
    padding: 10px 18px calc(12px + env(safe-area-inset-bottom, 0px));
    background: #fff;
    border-top: 1px solid transparent;
    transition: border-color .2s, box-shadow .2s;
}
.mcc[data-mcc] .mcc-ask__card.is-more-below .mcc-ask__foot { border-top-color: var(--mcc-line); box-shadow: 0 -12px 22px -16px rgba(26, 22, 20, .4); }
.mcc[data-mcc] .mcc-ask__send {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 56px;
    padding: 10px 18px;
    border-radius: 12px !important;
    background: var(--mcc-bord);
    color: #fff;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    box-shadow: 0 10px 20px -12px rgba(114, 56, 61, .9);
    overflow: hidden;
    transition: background-color .2s, transform .15s;
}
.mcc[data-mcc] .mcc-ask__send:hover { background: var(--mcc-bord-2); color: #fff; }
.mcc[data-mcc] .mcc-ask__send:active { transform: scale(.985); }
.mcc[data-mcc] .mcc-ask__send.is-shake { animation: mcc-shake .5s; }
.mcc[data-mcc] .mcc-ask__send .mcc-ico { width: 21px; height: 21px; }
.mcc[data-mcc] .mcc-ask__call {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 6px;
    padding: 6px 0 0;
    font-size: 15px;
    font-weight: 600;
    color: var(--mcc-ink-2);
}
.mcc[data-mcc] .mcc-ask__call .mcc-ico { width: 17px; height: 17px; color: var(--mcc-bord); }
.mcc[data-mcc] .mcc-ask__call b { font-weight: 800; color: var(--mcc-ink); white-space: nowrap; text-decoration: underline; text-decoration-color: var(--mcc-line-2); text-underline-offset: 3px; }
.mcc[data-mcc] .mcc-ask__call:hover b { text-decoration-color: currentColor; }
/* Με ανοιχτό πληκτρολόγιο: μόνο τα απαραίτητα */
.mcc-ask.mcc[data-mcc].is-kb .mcc-ask__call,
.mcc-ask.mcc[data-mcc].is-kb .mcc-ask__grip { display: none; }

/* «Ευχαριστούμε» */
.mcc[data-mcc] .mcc-ask__done {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 22px 20px calc(18px + env(safe-area-inset-bottom, 0px));
    text-align: center;
}
.mcc[data-mcc] .mcc-ask__check { display: block; width: 76px; height: 76px; margin: 4px auto 0; color: var(--mcc-bord); }
.mcc[data-mcc] .mcc-ask__check circle { stroke-dasharray: 190; stroke-dashoffset: 190; }
.mcc[data-mcc] .mcc-ask__check path { stroke-dasharray: 50; stroke-dashoffset: 50; }
.mcc[data-mcc] .mcc-ask__done.is-in .mcc-ask__check circle { animation: mcc-draw .7s .1s var(--mcc-ease) forwards; }
.mcc[data-mcc] .mcc-ask__done.is-in .mcc-ask__check path { animation: mcc-draw .45s .55s var(--mcc-ease) forwards; }
.mcc[data-mcc] .mcc-ask__dtitle { margin: 12px 0 0; font-family: var(--mcc-serif); font-size: 32px; font-weight: 600; line-height: 1.1; color: var(--mcc-ink); }
.mcc[data-mcc] .mcc-ask__dtext { max-width: 430px; margin: 8px auto 0; font-size: 17px; line-height: 1.5; color: var(--mcc-ink-2); }
.mcc[data-mcc] .mcc-ask__dtext b { font-weight: 800; color: var(--mcc-ink); }
.mcc[data-mcc] .mcc-nowrap { white-space: nowrap; }
.mcc[data-mcc] .mcc-ask__visit {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 18px;
    padding: 14px;
    border-radius: 14px;
    background: var(--mcc-bg);
    box-shadow: inset 0 0 0 1px var(--mcc-line);
    text-align: left;
    font-size: 15px;
    line-height: 1.45;
    color: var(--mcc-ink-2);
}
.mcc[data-mcc] .mcc-ask__visit > .mcc-ico { width: 36px; height: 36px; padding: 7px; border-radius: 50%; background: var(--mcc-gold-tint); color: var(--mcc-gold-ink); }
.mcc[data-mcc] .mcc-ask__visit b { display: block; font-size: 16px; font-weight: 800; color: var(--mcc-ink); }
.mcc[data-mcc] .mcc-ask__vaddr { display: block; margin-top: 2px; }
.mcc[data-mcc] .mcc-ask__addr { display: block; font-weight: 700; color: var(--mcc-ink); }
.mcc[data-mcc] .mcc-ask__maps { display: inline-block; margin-top: 6px; font-weight: 800; color: var(--mcc-bord); text-decoration: underline; text-underline-offset: 3px; }
.mcc[data-mcc] .mcc-ask__ok {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 54px;
    margin-top: 18px;
    padding: 0 18px;
    border-radius: 12px !important;
    background: var(--mcc-ink);
    color: #fff;
    font-size: 17px;
    font-weight: 800;
    text-align: center;
    transition: background-color .2s;
}
.mcc[data-mcc] .mcc-ask__ok:hover { background: #000; color: #fff; }

/* Είσοδος: τα κομμάτια της φόρμας εμφανίζονται το ένα μετά το άλλο */
.mcc-ask.mcc[data-mcc].is-in .mcc-ask__title,
.mcc-ask.mcc[data-mcc].is-in .mcc-ask__sub,
.mcc-ask.mcc[data-mcc].is-in .mcc-ask__pick,
.mcc-ask.mcc[data-mcc].is-in .mcc-ask__body > .mcc-field,
.mcc-ask.mcc[data-mcc].is-in .mcc-ask__more { animation: mcc-swap .5s var(--mcc-ease) both; }
.mcc-ask.mcc[data-mcc].is-in .mcc-ask__sub { animation-delay: .05s; }
.mcc-ask.mcc[data-mcc].is-in .mcc-ask__pick { animation-delay: .1s; }
.mcc-ask.mcc[data-mcc].is-in .mcc-ask__body > .mcc-field[data-f="name"] { animation-delay: .15s; }
.mcc-ask.mcc[data-mcc].is-in .mcc-ask__body > .mcc-field[data-f="phone"] { animation-delay: .2s; }
.mcc-ask.mcc[data-mcc].is-in .mcc-ask__more { animation-delay: .25s; }
.mcc[data-mcc] .mcc-ask__done.is-in .mcc-ask__dtitle,
.mcc[data-mcc] .mcc-ask__done.is-in .mcc-ask__dtext,
.mcc[data-mcc] .mcc-ask__done.is-in .mcc-ask__visit,
.mcc[data-mcc] .mcc-ask__done.is-in .mcc-ask__ok { animation: mcc-swap .5s var(--mcc-ease) both; }
.mcc[data-mcc] .mcc-ask__done.is-in .mcc-ask__dtitle { animation-delay: .25s; }
.mcc[data-mcc] .mcc-ask__done.is-in .mcc-ask__dtext { animation-delay: .32s; }
.mcc[data-mcc] .mcc-ask__done.is-in .mcc-ask__visit { animation-delay: .4s; }
.mcc[data-mcc] .mcc-ask__done.is-in .mcc-ask__ok { animation-delay: .48s; }

/* Υπολογιστής / tablet: κάρτα στο κέντρο, όνομα & τηλέφωνο δίπλα-δίπλα */
@media (min-width: 700px) {
    /* (στο tablet με ανοιχτό πληκτρολόγιο η κάρτα ανεβαίνει από πάνω του) */
    .mcc-ask.mcc[data-mcc] { align-items: center; padding: 24px 24px calc(24px + var(--mcc-kb, 0px)); }
    .mcc[data-mcc] .mcc-ask__card {
        max-width: 540px;
        max-height: calc(var(--mcc-vvh, 100vh) - 48px);
        border-radius: 22px;
        box-shadow: 0 30px 80px -24px rgba(0, 0, 0, .5);
        transform: translateY(24px) scale(.98);
        opacity: 0;
        transition: transform .45s var(--mcc-ease), opacity .3s;
    }
    .mcc-ask.mcc[data-mcc].is-in .mcc-ask__card { transform: none; opacity: 1; }
    .mcc[data-mcc] .mcc-ask__grip { display: none; }
    .mcc[data-mcc] .mcc-ask__close { top: 16px; right: 16px; }
    .mcc[data-mcc] .mcc-ask__body { padding: 26px 30px 6px; }
    .mcc[data-mcc] .mcc-ask__title { font-size: 25px; }
    .mcc[data-mcc] .mcc-ask__body > .mcc-field[data-f="name"],
    .mcc[data-mcc] .mcc-ask__body > .mcc-field[data-f="phone"] { display: inline-block; width: calc(50% - 6px); vertical-align: top; }
    .mcc[data-mcc] .mcc-ask__body > .mcc-field[data-f="phone"] { margin-left: 12px; }
    .mcc[data-mcc] .mcc-ask__foot { padding: 12px 30px 24px; }
    .mcc[data-mcc] .mcc-ask__done { padding: 30px 34px 28px; }
}
/* Πολύ μικρά κινητά */
@media (max-width: 360px) {
    .mcc[data-mcc] .mcc-ask__body { padding: 6px 14px 4px; }
    .mcc[data-mcc] .mcc-ask__foot { padding-left: 14px; padding-right: 14px; }
    .mcc[data-mcc] .mcc-ask__title { font-size: 21px; }
    .mcc[data-mcc] .mcc-ask__total { font-size: 23px; }
    .mcc[data-mcc] .mcc-ask__pimg { width: 46px !important; height: 46px !important; }
}

/* ════════════════════════════════════════════════════════════════
   ΜΙΚΡΟ ΜΗΝΥΜΑ (μόνο για σφάλματα)
   ════════════════════════════════════════════════════════════════ */
.mcc-toast.mcc[data-mcc] {
    position: fixed;
    left: 50%;
    bottom: calc(var(--mcc-sticky-h, 0px) + 86px);
    z-index: 100001;
    display: flex;
    align-items: center;
    gap: 10px;
    max-width: calc(100vw - 32px);
    padding: 10px 18px 10px 12px;
    border-radius: 999px;
    background: var(--mcc-ink);
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
    box-shadow: 0 12px 30px -10px rgba(0,0,0,.5);
    opacity: 0;
    transform: translate(-50%, 16px);
    transition: opacity .25s, transform .4s var(--mcc-ease);
    pointer-events: none;
}
.mcc-toast.mcc[data-mcc].is-in { opacity: 1; transform: translate(-50%, 0); }
.mcc[data-mcc] .mcc-toast__text { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ════════════════════════════════════════════════════════════════
   ΦΑΡΔΥΤΕΡΟ ΚΟΥΤΙ (tablet / desktop)
   ════════════════════════════════════════════════════════════════ */
@container mcc (min-width: 480px) {
    .mcc[data-mcc] .mcc-tiles { grid-template-columns: repeat(auto-fill, minmax(46px, 1fr)); gap: 12px 10px; }
    .mcc[data-mcc] .mcc-total__amount { font-size: 34px; }
}
@container mcc (max-width: 330px) {
    .mcc[data-mcc] .mcc-help__text { display: none; }
}

/* Πολύ μικρά κινητά */
@media (max-width: 360px) {
    .mcc-root.mcc[data-mcc] { padding: 10px 11px; }
    .mcc[data-mcc] .mcc-tiles { gap: 9px 7px; }
    .mcc[data-mcc] .mcc-sticky__amount { font-size: 22px; }
    .mcc[data-mcc] .mcc-sticky__cta { padding: 8px 12px; font-size: 15px; }
    .mcc[data-mcc] .mcc-sticky__cta .mcc-ico { display: none; }
}

/* Desktop: η επιβεβαίωση στο κέντρο */
@media (min-width: 700px) {
    .mcc-done.mcc[data-mcc] { align-items: center; padding: 24px; }
    .mcc[data-mcc] .mcc-done__card { border-radius: 22px; padding: 28px 28px 24px; transform: translateY(24px) scale(.98); opacity: 0; transition: transform .45s var(--mcc-ease), opacity .3s; }
    .mcc-done.mcc[data-mcc].is-in .mcc-done__card { transform: none; opacity: 1; }
    .mcc[data-mcc] .mcc-sticky__cta { padding: 8px 24px; }
}

/* Μικρή μικρογραφία στο καλάθι / ταμείο */
.mcc-cart-thumb {
    display: inline-block !important;
    width: 28px !important; height: 28px !important;
    margin: 0 8px 0 0 !important;
    border-radius: 6px !important;
    vertical-align: middle !important;
    object-fit: cover;
}

/* ════════════════════════════════════════════════════════════════
   ΕΦΕ
   ════════════════════════════════════════════════════════════════ */

/* Το επόμενο βήμα «αναπνέει» για να δείξει πού να πάει ο πελάτης */
.mcc[data-mcc] .mcc-step__num::after {
    content: "";
    position: absolute;
    top: -2px; right: -2px; bottom: -2px; left: -2px;
    border-radius: 50%;
    pointer-events: none;
    opacity: 0;
}
.mcc[data-mcc] .mcc-step.is-next .mcc-step__num::after { animation: mcc-breathe 2.2s ease-out infinite; }
@keyframes mcc-breathe {
    0%   { opacity: .75; box-shadow: 0 0 0 0 rgba(184, 150, 90, .75); }
    70%  { opacity: 0;   box-shadow: 0 0 0 10px rgba(184, 150, 90, 0); }
    100% { opacity: 0;   box-shadow: 0 0 0 10px rgba(184, 150, 90, 0); }
}

/* Όταν ο πελάτης οδηγείται σε ένα βήμα */
.mcc[data-mcc] .mcc-step.is-attention::before {
    content: "";
    position: absolute;
    top: 4px; right: -8px; bottom: 4px; left: -8px;
    border-radius: 14px;
    background: var(--mcc-gold-tint);
    box-shadow: 0 0 0 2px var(--mcc-gold);
    pointer-events: none;
    z-index: -1;
    animation: mcc-attention 1.6s var(--mcc-ease) both;
}
.mcc[data-mcc] .mcc-step.is-attention { z-index: 0; }
@keyframes mcc-attention {
    0%   { opacity: 0; transform: scale(.985); }
    18%  { opacity: 1; transform: none; }
    75%  { opacity: 1; }
    100% { opacity: 0; }
}
@keyframes mcc-shake {
    0%, 100% { transform: none; }
    20% { transform: translateX(-4px); }
    40% { transform: translateX(4px); }
    60% { transform: translateX(-3px); }
    80% { transform: translateX(2px); }
}

/* Κυματάκι γύρω από το δείγμα που πατήθηκε */
.mcc[data-mcc] .mcc-tile::after {
    content: "";
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    border-radius: 50%;
    pointer-events: none;
    opacity: 0;
}
.mcc[data-mcc] .mcc-tile.is-ping::after { animation: mcc-ping .7s var(--mcc-ease) both; }
@keyframes mcc-ping {
    0%   { opacity: .9; box-shadow: 0 0 0 0 rgba(184, 150, 90, .85); }
    100% { opacity: 0;  box-shadow: 0 0 0 16px rgba(184, 150, 90, 0); }
}
.mcc[data-mcc] .mcc-choice.is-ping { animation: mcc-choice-pop .45s var(--mcc-spring); }
@keyframes mcc-choice-pop { 0% { transform: scale(.98); } 60% { transform: scale(1.02); } 100% { transform: none; } }

/* Ο αριθμός του βήματος γίνεται ✓ με «σκάσιμο» */
.mcc[data-mcc] .mcc-step.is-burst .mcc-step__num { animation: mcc-num-pop .6s var(--mcc-spring); }
@keyframes mcc-num-pop { 0% { transform: scale(.6); } 60% { transform: scale(1.22); } 100% { transform: none; } }

/* Η τιμή «φωτίζεται» όταν αλλάζει */
.mcc[data-mcc] .mcc-total__amount.is-bump,
.mcc[data-mcc] .mcc-sticky__amount.is-bump { animation: mcc-bump .7s var(--mcc-ease); }
@keyframes mcc-bump {
    0%   { transform: none; text-shadow: none; }
    25%  { transform: scale(1.08); color: var(--mcc-gold-ink); text-shadow: 0 0 18px rgba(184, 150, 90, .55); }
    100% { transform: none; text-shadow: none; }
}
@keyframes mcc-row-flash { 0% { background: var(--mcc-gold-tint); } 100% { background: transparent; } }
@keyframes mcc-swap { 0% { opacity: 0; transform: translateY(7px); } 100% { opacity: 1; transform: none; } }
@keyframes mcc-fold { 0% { opacity: 0; transform: translateY(-6px); } 100% { opacity: 1; transform: none; } }
@keyframes mcc-pop-in { 0% { opacity: 0; transform: scale(.55); } 70% { opacity: 1; transform: scale(1.06); } 100% { opacity: 1; transform: none; } }

/* «+210 €» που πετάγεται δίπλα στην τιμή */
.mcc[data-mcc] .mcc-delta-host { position: relative; }
.mcc[data-mcc] .mcc-delta {
    position: absolute;
    right: 0; bottom: 100%;
    z-index: 3;
    padding: 3px 10px;
    border-radius: 999px;
    background: var(--mcc-bord);
    color: #fff;
    font-family: var(--mcc-sans);
    font-size: 15px;
    font-weight: 800;
    line-height: 1.3;
    white-space: nowrap;
    box-shadow: 0 8px 18px -8px rgba(114, 56, 61, .8);
    pointer-events: none;
    animation: mcc-delta 1.6s var(--mcc-ease) both;
}
.mcc[data-mcc] .mcc-delta.is-down { background: var(--mcc-ink); }
@keyframes mcc-delta {
    0%   { opacity: 0; transform: translateY(10px) scale(.8); }
    15%  { opacity: 1; transform: translateY(-4px) scale(1.05); }
    25%  { transform: translateY(-6px) scale(1); }
    75%  { opacity: 1; transform: translateY(-12px); }
    100% { opacity: 0; transform: translateY(-22px); }
}

/* Χρυσά σπινθηράκια */
.mcc-spark {
    position: fixed;
    z-index: 100005;
    width: 7px; height: 7px;
    margin: -3.5px 0 0 -3.5px;
    border-radius: 50%;
    background: #C9A866;
    pointer-events: none;
    animation: mcc-spark var(--dur, 700ms) cubic-bezier(.22, 1, .36, 1) forwards;
}
@keyframes mcc-spark {
    0%   { opacity: 1; transform: translate(0, 0) scale(1); }
    100% { opacity: 0; transform: translate(var(--tx), var(--ty)) scale(.2); }
}

/* Το δείγμα «πετάει» προς το καλάθι */
.mcc-flyer {
    position: fixed;
    z-index: 100006;
    width: 58px; height: 58px;
    margin: -29px 0 0 -29px;
    border-radius: 50%;
    background-color: #ddd;
    background-size: cover;
    background-position: center;
    box-shadow: 0 0 0 3px #fff, 0 14px 30px -8px rgba(0, 0, 0, .45);
    pointer-events: none;
}
.mcc-cart-bump { animation: mcc-cart-bump .6s cubic-bezier(.34, 1.56, .64, 1); }
@keyframes mcc-cart-bump { 0% { transform: none; } 40% { transform: scale(1.3); } 100% { transform: none; } }

/* Είσοδος των δειγμάτων όταν φτάνει ο πελάτης στο βήμα */
.mcc[data-mcc] .mcc-tiles.is-await > .mcc-tile:not(.is-hidden),
.mcc[data-mcc] .mcc-choices.is-await > .mcc-choice { opacity: 0; transform: scale(.6); }
.mcc[data-mcc] .mcc-choices.is-await > .mcc-choice { transform: translateY(10px); }
.mcc[data-mcc] .mcc-tiles.is-enter > .mcc-tile:not(.is-hidden) { animation: mcc-pop-in .5s var(--mcc-ease) both; animation-delay: var(--d, 0ms); }
.mcc[data-mcc] .mcc-choices.is-enter > .mcc-choice { animation: mcc-swap .5s var(--mcc-ease) both; animation-delay: var(--d, 0ms); }

/* Λιγότερη κίνηση όταν το ζητά η συσκευή */
@media (prefers-reduced-motion: reduce) {
    .mcc[data-mcc] *, .mcc[data-mcc] *::before, .mcc[data-mcc] *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
    .mcc-spark, .mcc-flyer { display: none !important; }
    .mcc[data-mcc] .mcc-more::after { display: none; }
    .mcc[data-mcc] .mcc-ask__check circle, .mcc[data-mcc] .mcc-ask__check path { stroke-dashoffset: 0; }
    .mcc[data-mcc] .mcc-tiles.is-await > .mcc-tile,
    .mcc[data-mcc] .mcc-choices.is-await > .mcc-choice { opacity: 1; transform: none; }
}
