/* =========================================
   DTECH Cart Widget — Sliding Drawer
   ========================================= */
.voom-cart-wrapper { position: fixed; z-index: 99999; }
/* iOS: prevent double-tap zoom on interactive elements */
.voom-cart-wrapper button,.voom-cart-wrapper a,.voom-cart-wrapper input{touch-action:manipulation}
/* Floating toggle button — hidden (cart opens from header/bottom bar) */
.voom-cart-toggle { display: none !important; }
.voom-cart-toggle-bg { display: none; }
.voom-cart-icon { display: none; }
.voom-cart-count { display: none; }
.voom-cart-overlay {
    position: fixed; inset: 0; background: rgba(0,0,0,0.45); z-index: 99995;
    opacity: 0; visibility: hidden; transition: opacity 0.3s var(--dtech-ease), visibility 0.3s;
}
.voom-cart-overlay.active { opacity: 1; visibility: visible; }
.voom-cart-drawer {
    position: fixed; top: 0; right: 0; width: 400px; max-width: 88vw; height: 100%;
    z-index: 99996; transform: translateX(100%); transition: transform 0.35s var(--dtech-ease);
}
.voom-cart-drawer.open { transform: translateX(0); }
.voom-cart-drawer-inner {
    display: flex; flex-direction: column; height: 100%; background: var(--dtech-white);
    box-shadow: -4px 0 40px rgba(0,0,0,0.15); overflow: hidden;
}
.voom-cart-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 18px 22px; background: var(--dtech-dark); flex-shrink: 0;
}
.voom-cart-header-title {
    display: flex; align-items: center; gap: 10px; font-family: var(--dtech-latin);
    font-size: 12px; font-weight: 700; letter-spacing: 0.08em;
    text-transform: uppercase; color: #fff;
}
.voom-cart-header-title svg { width: 18px; height: 18px; color: var(--dtech-red); }
.voom-cart-header-count {
    font-family: var(--dtech-mono); font-weight: 500;
    color: rgba(255,255,255,0.4); font-size: 11px;
}
.voom-cart-close {
    width: 36px; height: 36px; border: none; background: rgba(255,255,255,0.06);
    border-radius: 8px; cursor: pointer; display: flex; align-items: center;
    justify-content: center; transition: all 0.15s; color: rgba(255,255,255,0.5);
}
.voom-cart-close svg { width: 18px; height: 18px; }
.voom-cart-close:hover { background: rgba(255,255,255,0.1); color: #fff; }
.voom-cart-shipping {
    padding: 14px 22px; background: var(--dtech-g50);
    border-bottom: 1px solid var(--dtech-g200); flex-shrink: 0;
}
.voom-cart-shipping-text {
    font-family: var(--dtech-geo); font-size: 12px; color: var(--dtech-g500);
    margin-bottom: 8px; text-align: center;
}
.voom-cart-shipping-text strong { color: var(--dtech-red); font-weight: 600; }
.voom-cart-shipping-bar {
    height: 4px; background: var(--dtech-g200); border-radius: 2px; overflow: hidden;
}
.voom-cart-shipping-fill {
    height: 100%; border-radius: 2px; background: var(--dtech-red);
    transition: width 0.5s var(--dtech-ease);
}
.voom-cart-shipping-fill.complete { background: #16a34a; }
.voom-cart-items {
    flex: 1; overflow-y: auto; padding: 4px 0;
    scrollbar-width: thin; scrollbar-color: var(--dtech-g200) transparent;
}
.voom-cart-items::-webkit-scrollbar { width: 3px; }
.voom-cart-items::-webkit-scrollbar-track { background: transparent; }
.voom-cart-items::-webkit-scrollbar-thumb { background: var(--dtech-g200); border-radius: 2px; }
.voom-cart-item {
    display: flex; gap: 14px; padding: 16px 22px;
    transition: background 0.15s, opacity 0.2s; position: relative;
}
.voom-cart-item:not(:last-child)::after {
    content: ""; position: absolute; bottom: 0; left: 22px; right: 22px;
    height: 1px; background: var(--dtech-g200);
}
.voom-cart-item:hover { background: var(--dtech-g50); }
.voom-cart-item.is-busy { opacity: 0.45; pointer-events: none; }
.voom-cart-item-img {
    width: 68px; height: 68px; border-radius: 6px; background: var(--dtech-g100);
    border: 1px solid var(--dtech-g200); overflow: hidden; flex-shrink: 0;
}
.voom-cart-item-img img { width: 100%; height: 100%; object-fit: cover; }
.voom-cart-item-details {
    flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px;
}
.voom-cart-item-name {
    font-family: var(--dtech-geo); font-size: 13px; font-weight: 600;
    color: var(--dtech-black); white-space: nowrap; overflow: hidden;
    text-overflow: ellipsis; line-height: 1.3;
}
.voom-cart-item-variation { font-family: var(--dtech-geo); font-size: 11px; color: var(--dtech-g400); }
.voom-cart-item-price { font-family: var(--dtech-mono); font-size: 11px; color: var(--dtech-g500); font-weight: 500; }
.voom-cart-item-actions {
    display: flex; align-items: center; gap: 2px; margin-top: 4px;
    background: var(--dtech-g100); border-radius: 6px; padding: 2px; width: fit-content;
}
.voom-cart-qty-btn {
    width: 26px; height: 26px; border: none; border-radius: 4px;
    background: transparent; cursor: pointer; display: flex; align-items: center;
    justify-content: center; font-size: 14px; font-weight: 600;
    color: var(--dtech-g600); transition: all 0.15s;
}
.voom-cart-qty-btn:hover {
    background: var(--dtech-white); color: var(--dtech-black);
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}
.voom-cart-qty-value {
    width: 26px; text-align: center; font-family: var(--dtech-mono);
    font-size: 12px; font-weight: 600; color: var(--dtech-black);
}
.voom-cart-item-remove {
    border: none; background: none; cursor: pointer; padding: 4px;
    color: var(--dtech-g400); transition: color 0.15s;
}
.voom-cart-item-remove:hover { color: var(--dtech-red); }
.voom-cart-item-remove svg { width: 15px; height: 15px; }
.voom-cart-item-line-total {
    font-family: var(--dtech-mono); font-size: 13px; font-weight: 600;
    color: var(--dtech-black); white-space: nowrap;
}
.voom-cart-footer {
    padding: 20px 22px; border-top: 1px solid var(--dtech-g200);
    background: var(--dtech-white); flex-shrink: 0;
}
.voom-cart-subtotal {
    display: flex; justify-content: space-between; align-items: center;
    font-family: var(--dtech-geo); font-size: 14px; font-weight: 600; margin-bottom: 2px;
}
.voom-cart-subtotal-amount {
    font-family: var(--dtech-mono); font-size: 16px; font-weight: 700; color: var(--dtech-black);
}
.voom-cart-shipping-note {
    font-family: var(--dtech-geo); font-size: 11px; color: var(--dtech-g400); margin-bottom: 16px;
}
.voom-cart-actions { display: flex; gap: 8px; }
.voom-cart-btn {
    flex: 1; display: flex; align-items: center; justify-content: center;
    padding: 12px 16px; border-radius: 8px; font-family: var(--dtech-latin);
    font-size: 12px; font-weight: 700; letter-spacing: 0.04em;
    text-transform: uppercase; text-decoration: none; cursor: pointer;
    border: none; transition: all 0.2s var(--dtech-ease);
}
.voom-cart-btn--primary { background: var(--dtech-red); color: #fff; }
.voom-cart-btn--primary:hover { background: var(--dtech-red-h); }
.voom-cart-btn--secondary {
    background: transparent; color: var(--dtech-g600); border: 1.5px solid var(--dtech-g200);
}
.voom-cart-btn--secondary:hover { border-color: var(--dtech-g400); color: var(--dtech-black); }
.voom-cart-empty {
    flex: 1; display: flex; flex-direction: column; align-items: center;
    justify-content: center; padding: 48px 22px; text-align: center;
}
.voom-cart-empty-icon { width: 56px; height: 56px; color: var(--dtech-g300); margin-bottom: 18px; }
.voom-cart-empty-title {
    font-family: var(--dtech-latin); font-size: 14px; font-weight: 700;
    letter-spacing: 0.02em; margin-bottom: 4px; color: var(--dtech-g700);
}
.voom-cart-empty-text {
    font-family: var(--dtech-geo); font-size: 13px; color: var(--dtech-g400); margin-bottom: 24px;
}
.voom-cart-empty-btn { max-width: 240px; width: auto; white-space: nowrap; padding: 14px 24px; flex: none !important; height: auto !important; }
@keyframes voomSlideIn {
    from { opacity: 0; transform: translateX(12px); }
    to   { opacity: 1; transform: translateX(0); }
}
.voom-cart-item { animation: voomSlideIn 0.25s var(--dtech-ease) both; }
.voom-cart-item:nth-child(1) { animation-delay: 0.04s; }
.voom-cart-item:nth-child(2) { animation-delay: 0.08s; }
.voom-cart-item:nth-child(3) { animation-delay: 0.12s; }
.voom-cart-item:nth-child(4) { animation-delay: 0.16s; }
.voom-cart-item:nth-child(5) { animation-delay: 0.20s; }
@keyframes voomBump {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.2); }
}
.voom-cart-count.bump { animation: voomBump 0.3s var(--dtech-ease); }
@media (max-width: 480px) {
    .voom-cart-drawer { width: 100vw; max-width: 100vw; }
}