/* ═══════════════════════════════════════════════
   OneLink Scanner — Frontend Styles
   ═══════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap');

.olscan-grid { font-family: 'DM Sans', system-ui, sans-serif; }

.olscan-product:hover { transform: translateY(-4px); box-shadow: 0 8px 30px rgba(0,0,0,0.12) !important; }

.olscan-product a:hover { background: #6366F1 !important; color: #fff !important; }

.olscan-product button:hover { opacity: 0.9; transform: scale(1.01); }

#olscan-cart-widget { font-family: 'DM Sans', system-ui, sans-serif; }

#olscan-cart-items .olscan-cart-row {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 0;
    border-bottom: 1px solid #f0f0f0;
}

#olscan-cart-items .olscan-cart-row img {
    width: 56px;
    height: 56px;
    border-radius: 10px;
    object-fit: cover;
    background: #f5f5f8;
}

#olscan-cart-items .olscan-cart-row .cart-info { flex: 1; }
#olscan-cart-items .olscan-cart-row .cart-title { font-weight: 600; font-size: 14px; }
#olscan-cart-items .olscan-cart-row .cart-price { color: #888; font-size: 13px; }

#olscan-cart-items .olscan-cart-row .cart-qty {
    display: flex;
    align-items: center;
    gap: 8px;
}

#olscan-cart-items .olscan-cart-row .cart-qty button {
    width: 28px;
    height: 28px;
    border: 1px solid #ddd;
    border-radius: 6px;
    background: #fff;
    cursor: pointer;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s;
}

#olscan-cart-items .olscan-cart-row .cart-qty button:hover {
    border-color: #6366F1;
    color: #6366F1;
}

#olscan-cart-items .olscan-cart-row .cart-remove {
    color: #ccc;
    cursor: pointer;
    font-size: 18px;
    transition: color 0.15s;
    background: none;
    border: none;
}
#olscan-cart-items .olscan-cart-row .cart-remove:hover { color: #ef476f; }

.olscan-empty-cart {
    text-align: center;
    padding: 30px 0;
    color: #aaa;
}
.olscan-empty-cart .empty-icon { font-size: 40px; display: block; margin-bottom: 8px; }

/* Frontend scanner */
#olscan-front-scan-zone:hover {
    border-color: #6366F1 !important;
    background: rgba(99,102,241,0.02);
}

#olscan-front-barcode:focus {
    outline: none;
    border-color: #6366F1 !important;
    box-shadow: 0 0 0 3px rgba(99,102,241,0.12);
}

/* Toast notification */
.olscan-toast {
    position: fixed;
    bottom: 30px;
    right: 30px;
    background: #1a1a2e;
    color: #fff;
    padding: 14px 24px;
    border-radius: 12px;
    font-family: 'DM Sans', system-ui, sans-serif;
    font-size: 14px;
    font-weight: 500;
    box-shadow: 0 8px 30px rgba(0,0,0,0.2);
    z-index: 99999;
    animation: olscan-slide-in 0.3s ease, olscan-fade-out 0.3s ease 2.5s forwards;
}

@keyframes olscan-slide-in {
    from { transform: translateY(20px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

@keyframes olscan-fade-out {
    to { opacity: 0; transform: translateY(10px); }
}

/* Responsive */
@media (max-width: 768px) {
    .olscan-grid { grid-template-columns: 1fr 1fr !important; gap: 16px !important; }
}
@media (max-width: 480px) {
    .olscan-grid { grid-template-columns: 1fr !important; }
}
