/* ── Layout pagină produs ── */
.pp-wrap {
    max-width: 760px; margin: 0 auto; padding: 74px 16px 48px;
}
.pp-card {
    background: var(--card-bg, #1e2a38);
    border-radius: 14px; overflow: hidden;
    box-shadow: 0 4px 24px rgba(0,0,0,.3);
}
.pp-img-wrap { position: relative; }
.pp-img-wrap img {
    width: 100%; max-height: 380px; object-fit: cover; display: block;
}
.pp-img-placeholder {
    width: 100%; height: 220px; display: flex; align-items: center;
    justify-content: center; font-size: 5rem;
    background: rgba(255,255,255,.04);
}
.pp-discount-badge {
    position: absolute; bottom: 8px; right: 12px;
    background: #e53935; color: #fff;
    font-size: .8rem; font-weight: 700;
    padding: 3px 10px; border-radius: 20px;
}
.pp-body { padding: 20px 22px 24px; }
.pp-name {
    font-size: 1.45rem; font-weight: 700;
    color: var(--text-main, #e8f0fa); margin-bottom: 6px;
}
.pp-badges { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.pp-desc {
    color: var(--text-dim, #8aa7cf); font-size: .95rem;
    line-height: 1.55; margin-bottom: 16px;
}
.pp-price-row {
    display: flex; align-items: baseline; gap: 10px; margin-bottom: 18px;
}
.pp-price {
    font-size: 1.6rem; font-weight: 700; color: var(--price, #5b9ef4);
}
.pp-price.sale { color: #ff6b6b; }
.pp-price-original {
    font-size: 1rem; color: var(--text-dim, #8aa7cf); text-decoration: line-through;
}
.pp-currency { font-size: .85rem; opacity: .7; }
.pp-attrs { margin-bottom: 16px; }
.pp-attrs-title { font-size: .8rem; font-weight: 600; color: var(--text-dim, #8aa7cf); margin-bottom: 6px; text-transform: uppercase; letter-spacing: .05em; }
.pp-attr-row {
    display: flex; justify-content: space-between; align-items: center;
    padding: 7px 10px; border-radius: 8px;
    background: rgba(255,255,255,.04); margin-bottom: 4px; font-size: .9rem;
}
.pp-attr-attrs { display: flex; gap: 8px; flex-wrap: wrap; }
.pp-attr-chip { background: rgba(255,255,255,.08); color: rgba(255,255,255,.85); border-radius: 5px; padding: 4px 12px; font-size: .8rem; font-weight: 600; border: 1px solid rgba(255,255,255,.2); white-space: nowrap; cursor: default; }
.pp-attr-price { font-weight: 700; color: var(--price, #5b9ef4); white-space: nowrap; }
.pp-allergens { margin-bottom: 16px; }
.pp-allergen-chip {
    display: inline-block; background: rgba(255,200,0,.12);
    color: #f0c040; border-radius: 5px; border: 1px solid rgba(240,192,64,.35);
    padding: 4px 12px; font-size: .8rem; font-weight: 600;
    margin: 2px 3px 2px 0; white-space: nowrap; cursor: default;
}
.pp-meta { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 18px; font-size: .82rem; color: var(--text-dim, #8aa7cf); }
.pp-btn-back {
    display: inline-flex; align-items: center; gap: 8px;
    background: rgba(255,255,255,.08); color: var(--text-dim, #8aa7cf);
    text-decoration: none; padding: 9px 18px; border-radius: 8px;
    font-size: .9rem; transition: background .2s;
}
.pp-btn-back:hover { background: rgba(255,255,255,.14); }

/* ── Variant buttons ── */
.pp-variant-btns { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 6px; }
.pp-variant-btn {
    display: flex; flex-direction: column; align-items: center;
    gap: 2px; padding: 8px 14px; border-radius: 9px; border: 2px solid rgba(255,255,255,.15);
    background: rgba(255,255,255,.05); cursor: pointer; font-size: .88rem;
    transition: border-color .15s, background .15s; min-width: 70px;
}
.pp-variant-btn.selected, .pp-variant-btn:focus {
    border-color: var(--price, #5b9ef4); background: rgba(91,158,244,.1);
}
.pp-variant-btn .vb-label { font-weight: 600; }
.pp-variant-btn .vb-price { font-size: .78rem; color: var(--price, #5b9ef4); }
.pp-variant-btn .vb-price s { opacity: .5; font-weight: 400; color: inherit; margin-right: 3px; }

/* ── Ingrediente ── */
.pp-ingredients { margin-bottom: 16px; }
.pp-ingredients-list { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.ingredient-label { padding: 4px 12px; background: #fff7dc; border-radius: 5px; font-size: .8rem; white-space: nowrap; border: 1px solid #e8d890; font-weight: 600; color: #5a4a10; cursor: default; }
.ingredient-label.removable { cursor: pointer; user-select: none; transition: opacity .15s; }
.ingredient-label.removed { opacity: .5; text-decoration: line-through; }
.ing-remove-x { font-weight: 700; font-size: .85rem; }

/* ── Toppings ── */
.pp-toppings { margin-bottom: 16px; }
.pm-topping-row { display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; border-radius: 8px; background: rgba(255,255,255,.04); margin-bottom: 4px; gap: 8px; }
.pm-topping-name { flex: 1; font-size: .88rem; }
.pm-topping-price { font-size: .82rem; color: var(--price, #5b9ef4); white-space: nowrap; }
.pm-topping-qty-control { display: flex; align-items: center; gap: 6px; }
.pm-topping-qty-btn { width: 28px; height: 28px; border-radius: 50%; border: none; background: rgba(255,255,255,.1); color: inherit; font-size: 1rem; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.pm-topping-qty-btn:disabled { opacity: .3; cursor: default; }
.pm-topping-qty-display { min-width: 20px; text-align: center; font-weight: 700; font-size: .92rem; }

/* ── Qty + Add to cart ── */
.pp-cart-footer { display: flex; align-items: center; gap: 12px; margin-top: 20px; flex-wrap: wrap; }
.pp-qty-ctrl { display: flex; align-items: center; gap: 6px; background: rgba(255,255,255,.07); border-radius: 25px; padding: 5px 8px; }
.pp-qty-btn { width: 32px; height: 32px; border: none; background: none; color: inherit; font-size: 1.1rem; cursor: pointer; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.pp-qty-btn:hover { background: rgba(255,255,255,.1); }
.pp-qty-display { min-width: 24px; text-align: center; font-weight: 700; font-size: 1rem; }
.pp-cart-footer .prod-modal-add-btn { flex: 1; min-height: 46px; }
.pp-add-btn-price { font-size: .88rem; opacity: .85; font-weight: 400; margin-left: 4px; }

/* ── Toast ── */
.toast-menu { position: fixed; bottom: 90px; left: 50%; transform: translateX(-50%) translateY(20px); background: #1e2a38; border: 1px solid #2a4060; color: #e8f0fa; padding: .65rem 1.25rem; border-radius: 10px; font-size: .9rem; font-weight: 500; opacity: 0; transition: all .3s; z-index: 500; pointer-events: none; white-space: normal; max-width: calc(100vw - 2rem); width: max-content; text-align: center; }
.toast-menu.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ── Header pagină produs ── */
.pp-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 8px 16px; background: var(--bg-blue, #1a2a3a);
    position: sticky; top: 54px; z-index: 200; min-height: 68px;
}
.pp-header-left { display: flex; align-items: center; gap: 10px; }
.pp-header-left a { color: inherit; text-decoration: none; opacity: .75; font-size: .9rem; }
.pp-header-left a:hover { opacity: 1; }
.pp-header-left .sep { opacity: .4; }
.pp-header-right { display: flex; align-items: center; gap: 10px; }
.pp-share-btn {
    display: inline-flex; align-items: center; gap: .35rem;
    background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.15);
    color: inherit; border-radius: 20px;
    padding: .3rem .85rem; font-size: .8rem; font-weight: 500;
    cursor: pointer; transition: background .15s;
}
.pp-share-btn:hover { background: rgba(255,255,255,.15); }

@media (max-width: 600px) {
    .pp-name { font-size: 1.2rem; }
    .pp-price { font-size: 1.35rem; }
    .pp-img-wrap img { max-height: 260px; }
    .pp-header { flex-wrap: wrap; gap: 6px; }

    .prod-modal.pp-card {
        max-width: 90% !important;
    }
}

/* ── Modal produs (products.php) — folosește aceleași clase pp-* ── */
.prod-modal.pp-card {
    max-width: 600px; width: calc(100% - 32px);
    max-height: 90vh; overflow-y: auto;
    overflow-x: hidden;
    position: relative;
    /* override pp-card overflow:hidden */
    overflow: hidden auto;
}
.prod-modal.pp-card .pp-body {
    padding-bottom: 24px;
}

/* ── Desktop: ascundem cart bar, drawer devine modal centrat ── */
@media (min-width: 769px) {
    #pp-cart-bar { display: none !important; }
    #pp-cart-drawer {
        position: fixed !important; bottom: auto !important;
        top: 50% !important; left: 50% !important; right: auto !important;
        width: 100% !important; max-width: 520px !important;
        border-radius: 20px !important; max-height: 82vh !important;
        transform: translate(-50%, calc(-50% + 24px)) !important;
        opacity: 0 !important; pointer-events: none !important;
        transition: transform .28s cubic-bezier(.34,1.4,.64,1), opacity .22s ease !important;
    }
    #pp-cart-drawer.open {
        transform: translate(-50%, -50%) !important;
        opacity: 1 !important; pointer-events: auto !important;
    }
    #pp-cart-drawer .cart-drawer-handle { display: none !important; }
}
