/**
 * Mooze Connect — winkelwagen en afrekenen: potlood-link "Aanpassen" bij printopdrachten.
 */
a.mzc-pencil-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: 1px solid #ddd;
    background: #f8f8f8;
    color: #666;
    text-decoration: none;
    vertical-align: middle;
    margin-left: 6px;
    transition: background .15s, color .15s, border-color .15s;
}

a.mzc-pencil-link:hover {
    background: #fff;
    color: #1a1a1a;
    border-color: #999;
}

/* Hieronder: stijlen van de eigen winkelwagen-template (stonden tot 2.10.6 in configurator.css,
   dat op de winkelwagen niet laadt). */

/* ── Winkelwagen: potlood-link ────────────────────────────── */
.mzc-cart-edit-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 1px solid #ddd;
    background: #f8f8f8;
    color: #666;
    text-decoration: none;
    vertical-align: middle;
    margin-left: 6px;
    transition: background .15s, color .15s, border-color .15s;
}
.mzc-cart-edit-link:hover {
    background: #fff;
    color: #1a1a1a;
    border-color: #999;
}
.mzc-cart-edit-link svg {
    display: block;
}

/* ── Mooze winkelwagen — huisstijl mooze.nl ───────────────── */

/* Variabelen afgestemd op Woodmart child theme */
.mzc-cart-form {
    --mzc-gold:        rgb(200, 172, 118);
    --mzc-gold-light:  rgb(224, 195, 158);
    --mzc-text:        #777;
    --mzc-title:       #242424;
    --mzc-border:      #e8e8e8;
    --mzc-radius:      0px;
    font-family: "Helvetica W01 Regular", Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: var(--mzc-text);
}

/* Tabel */
.mzc-cart-table {
    width: 100%;
    border-collapse: collapse;
}
.mzc-cart-table th,
.mzc-cart-table td {
    padding: 20px 16px;
    vertical-align: top;
    border-bottom: 1px solid var(--mzc-border);
}
.mzc-cart-table thead th {
    font-family: "Helvetica W01 Bold", Arial, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #aaa;
    border-bottom: 2px solid var(--mzc-border);
    padding-top: 0;
    padding-bottom: 12px;
}
.mzc-cart-table .product-thumbnail { width: 90px; padding-right: 0; }
.mzc-cart-table .product-subtotal  { text-align: right; white-space: nowrap; font-family: "Helvetica W01 Bold", Arial, Helvetica, sans-serif; color: var(--mzc-title); }
.mzc-cart-table .product-remove    { width: 48px; text-align: center; padding-left: 8px; }

/* Thumbnail */
.mzc-cart-table .product-thumbnail img {
    width: 74px;
    height: 74px;
    object-fit: contain;
    border: 1px solid var(--mzc-border);
    display: block;
}

/* Naam-rij */
.mzc-name-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}
a.mzc-product-title,
span.mzc-product-title {
    font-family: "Helvetica W01 Bold", Arial, Helvetica, sans-serif;
    font-size: 15px;
    font-weight: 700;
    color: var(--mzc-title);
    text-decoration: none;
    line-height: 1.3;
}
a.mzc-product-title:hover { color: var(--mzc-gold); }

/* Potlood-knop — goud, aansluitend bij Woodmart accent */
.mzc-pencil-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 26px;
    height: 26px;
    border: 1px solid var(--mzc-gold);
    background: transparent;
    color: var(--mzc-gold);
    text-decoration: none !important;
    transition: background .15s, color .15s;
    border-radius: var(--mzc-radius);
}
.mzc-pencil-link:hover {
    background: var(--mzc-gold);
    color: #fff;
}
.mzc-pencil-link svg { display: block; }

/* Meta-opties — compact op één regel */
.mzc-meta-line {
    margin: 4px 0 0;
    font-size: 13px;
    color: var(--mzc-text);
    line-height: 1.6;
}
.mzc-meta-key {
    color: var(--mzc-title);
    font-family: "Helvetica W01 Bold", Arial, Helvetica, sans-serif;
    font-weight: 700;
}
.mzc-meta-sep { color: #ccc; margin: 0 2px; }

/* Verwijderknop */
.mzc-cart-table .product-remove a.remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: 1px solid var(--mzc-border);
    background: transparent;
    color: #bbb;
    text-decoration: none;
    transition: border-color .15s, color .15s, background .15s;
    border-radius: var(--mzc-radius);
    font-size: 0;
}
.mzc-cart-table .product-remove a.remove:hover {
    border-color: #e00;
    color: #e00;
    background: #fff5f5;
}
.mzc-cart-table .product-remove a.remove svg { display: block; }

/* Qty voor reguliere producten */
.mzc-qty-wrapper { margin-top: 10px; }

/* Actiebalk */
.mzc-cart-table .actions { border-bottom: none; padding-top: 12px; }
.mzc-cart-form .coupon {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}
.mzc-cart-form .coupon input.input-text {
    border: 1px solid var(--mzc-border);
    padding: 8px 12px;
    font-size: 14px;
    color: var(--mzc-text);
    font-family: inherit;
    outline: none;
    border-radius: var(--mzc-radius);
}
.mzc-cart-form .coupon input.input-text:focus { border-color: var(--mzc-gold); }
.mzc-cart-form .coupon .button {
    background: var(--mzc-gold);
    color: #fff;
    border: none;
    padding: 8px 18px;
    font-family: "Helvetica W01 Bold", Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: background .15s;
    border-radius: var(--mzc-radius);
    letter-spacing: .04em;
}
.mzc-cart-form .coupon .button:hover { background: var(--mzc-gold-light); }

/* Responsive */
@media (max-width: 600px) {
    .mzc-cart-table .product-thumbnail,
    .mzc-cart-table thead th.product-thumbnail { display: none; }
    .mzc-cart-table th, .mzc-cart-table td { padding: 14px 10px; }
    .mzc-meta-line { font-size: 12px; }
}

/* Legacy: potlood-link vanuit vorige versies */
.mzc-cart-edit-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border: 1px solid rgb(200,172,118);
    background: transparent;
    color: rgb(200,172,118);
    text-decoration: none;
    vertical-align: middle;
    margin-left: 6px;
    transition: background .15s, color .15s;
}
.mzc-cart-edit-link:hover { background: rgb(200,172,118); color: #fff; }
.mzc-cart-edit-link svg { display: block; }

/* Winkelwagen: ontwerp-miniatuur, specificaties en ontwerpregel (2.10.5) */
.mzc-cart-table .product-thumbnail .mzc-cart-thumb {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    object-fit: contain;
    background: #fff;
    border: 1px solid var(--mzc-border);
    border-radius: var(--mzc-radius);
}
.mzc-cart-table .product-thumbnail:has(.mzc-cart-thumb) { width: 72px; }
.mzc-cart-thumb--file { font-size: 12px; font-weight: 700; color: #888; background: #f6f6f6 !important; }
.mzc-cart-thumb-link { display: inline-block; transition: opacity .15s; }
.mzc-cart-thumb-link:hover { opacity: .8; }

.mzc-cart-summary {
    margin: 2px 0 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--mzc-title);
}
.mzc-specs-toggle { margin: 4px 0 0; font-size: 12px; }
.mzc-specs-toggle > summary {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    color: #999;
    list-style: none;
}
.mzc-specs-toggle > summary::-webkit-details-marker { display: none; }
.mzc-specs-toggle > summary::after { content: '▾'; font-size: 10px; transition: transform .15s; }
.mzc-specs-toggle[open] > summary::after { transform: rotate(180deg); }
.mzc-specs-toggle > summary:hover { color: var(--mzc-title); }
.mzc-specs {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 2px 14px;
    margin: 6px 0 0;
    padding: 0;
}
.mzc-spec { display: contents; }
.mzc-spec dt { margin: 0; color: #999; font-weight: 400; }
.mzc-spec dd { margin: 0; color: var(--mzc-title); overflow-wrap: anywhere; }

.mzc-cart-design {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 2px 8px;
    margin: 4px 0 0;
    font-size: 12px;
    color: var(--mzc-text);
}
.mzc-cart-design__label { color: #999; }
.mzc-cart-design__name { color: var(--mzc-title); overflow-wrap: anywhere; }
.mzc-cart-design__link { color: var(--mzc-gold); text-decoration: underline; }
.mzc-cart-design__link:hover { color: var(--mzc-title); }

/* Thema (Woodmart) zet een eigen × voor .remove; wij tonen alleen de prullenbak. */
.mzc-cart-table .product-remove a.remove::before,
.mzc-cart-table .product-remove a.remove::after { content: none !important; display: none !important; }


/* Geen afbeelding of ontwerp in de hele winkelwagen: lege miniatuurkolom weglaten. */
.mzc-cart-table:not(:has(td.product-thumbnail img, td.product-thumbnail .mzc-cart-thumb)) .product-thumbnail { display: none; }