/* Shopping List Frontend */
.mwc-slist { max-width: 680px; margin: 0 auto; }

.mwc-slist-promo-banner {
    background: linear-gradient(135deg, var(--mwc-secondary, #ff6b35), var(--mwc-primary, #e91e63));
    color: #fff; text-align: center; padding: 10px 16px;
    border-radius: 8px; font-weight: 700; font-size: .95em; margin-bottom: 16px;
}

/* Items */
.mwc-slist-items { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }

.mwc-slist-item {
    display: flex; align-items: center; gap: 12px;
    padding: 10px 14px; background: #fff; border: 2px solid #eee;
    border-radius: 10px; cursor: pointer; transition: all .2s;
}
.mwc-slist-item:hover { border-color: #ccc; }
.mwc-slist-item:has(.mwc-slist-check:checked) { border-color: var(--mwc-primary, #e91e63); background: color-mix(in srgb, var(--mwc-primary, #e91e63) 10%, white); }
.mwc-slist-item.mwc-slist-oos { opacity: .5; cursor: not-allowed; }

.mwc-slist-check { flex-shrink: 0; width: 20px; height: 20px; accent-color: var(--mwc-primary, #e91e63); }

.mwc-slist-img { width: 50px; height: 50px; border-radius: 6px; object-fit: cover; flex-shrink: 0; }

.mwc-slist-info { flex: 1; }
.mwc-slist-info strong { display: block; font-size: .9em; margin-bottom: 2px; }
.mwc-slist-meta { font-size: .82em; color: #666; }
.mwc-slist-note { margin-left: 6px; color: #888; font-style: italic; }
.mwc-slist-oos-label { color: #c00; font-weight: 600; margin-left: 6px; }

/* Footer */
.mwc-slist-footer {
    background: #f8f8f8; border: 2px solid #e0e0e0; border-radius: 12px;
    padding: 14px 20px; display: flex; flex-wrap: wrap;
    align-items: center; justify-content: space-between; gap: 10px;
}

.mwc-slist-summary { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.mwc-slist-count { font-size: .9em; color: #666; }
.mwc-slist-total { font-size: 1.1em; font-weight: 700; }
.mwc-slist-discount { color: var(--mwc-primary, #e91e63); font-size: .9em; }

.mwc-slist-atc {
    background: linear-gradient(135deg, var(--mwc-secondary, #ff6b35), var(--mwc-primary, #e91e63));
    color: #fff; border: none; padding: 12px 24px; border-radius: 8px;
    font-size: 1em; font-weight: 700; cursor: pointer; transition: opacity .2s;
}
.mwc-slist-atc:hover { opacity: .9; }
.mwc-slist-atc:disabled { opacity: .4; cursor: not-allowed; }

@media (max-width: 480px) {
    .mwc-slist-footer { flex-direction: column; text-align: center; }
    .mwc-slist-atc { width: 100%; }
}