/* OZWraps Shop v3 */

.ozwraps-shop { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; color: #333; line-height: 1.5; }

/* ── Step indicator ───────────────────────────── */
.oz-steps { display:flex; align-items:center; margin:0 0 24px; padding:14px 20px; background:#f8f8f8; border-radius:10px; border:1px solid #e8e8e8; }
.oz-step { display:flex; align-items:center; gap:8px; }
.oz-step-num { width:28px; height:28px; border-radius:50%; background:#ddd; color:#888; font-size:13px; font-weight:700; display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:all .2s; }
.oz-step-label { font-size:13px; color:#888; font-weight:500; }
.oz-step-active .oz-step-num  { background:#1a1a2e; color:#fff; }
.oz-step-active .oz-step-label { color:#1a1a2e; font-weight:700; }
.oz-step-done .oz-step-num    { background:#27ae60; color:#fff; }
.oz-step-done .oz-step-label  { color:#27ae60; }
.oz-step-line { flex:1; height:2px; background:#ddd; margin:0 8px; min-width:20px; }

/* ── Cart bar ──────────────────────────────────── */
.oz-cart-bar {
    position:sticky; bottom:20px; z-index:100;
    background:#1a1a2e; color:#fff;
    border-radius:12px; padding:14px 20px; margin:0 0 24px;
    display:flex; align-items:center; justify-content:space-between;
    box-shadow:0 4px 20px rgba(0,0,0,.25);
}
.oz-cart-info { font-size:15px; }
.oz-sep { margin:0 8px; opacity:.4; }
.oz-cart-bar-actions { display:flex; gap:10px; align-items:center; }

/* ── Product grid ─────────────────────────────── */
.oz-products-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:20px; }

.oz-product-card {
    background:#fff; border:1px solid #e0e0e0; border-radius:12px;
    overflow:hidden; box-shadow:0 2px 8px rgba(0,0,0,.06);
    transition:box-shadow .2s, transform .2s;
}
.oz-product-card:hover { box-shadow:0 6px 20px rgba(0,0,0,.12); transform:translateY(-2px); }

/* image area */
.oz-card-img { background:#f5f5f5; aspect-ratio:4/3; overflow:hidden; cursor:pointer; position:relative; }
.oz-card-img img { width:100%; height:100%; object-fit:cover; transition:transform .3s; display:block; cursor:pointer; }
.oz-card-img:hover img { transform:scale(1.04); }
.oz-img-placeholder { width:100%; height:100%; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.oz-img-placeholder svg { width:80px; opacity:.5; }

/* card body */
.oz-card-body { padding:14px 16px 16px; }
.oz-card-body h3 { margin:0 0 6px; font-size:14px; font-weight:700; color:#1a1a2e; line-height:1.3; cursor:pointer; }
.oz-card-body h3:hover { color:#3a3a6e; text-decoration:underline; }
.oz-card-desc { font-size:12px; color:#777; line-height:1.5; margin:0 0 12px; }
.oz-card-footer { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; padding-top:10px; border-top:1px solid #f0f0f0; }
.oz-price { font-size:18px; font-weight:700; color:#1a1a2e; }
.oz-price small { font-size:11px; font-weight:400; color:#999; }
.oz-card-actions { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }

/* qty controls — dark bg, white text, high contrast */
.oz-qty-wrap { display:flex; align-items:center; border:2px solid #1a1a2e; border-radius:8px; overflow:hidden; }
.oz-qty-btn { background:#1a1a2e; border:none; width:32px; height:32px; font-size:18px; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; color:#fff; transition:background .15s; line-height:1; }
.oz-qty-btn:hover { background:#3a3a6e; }
.oz-qty-val { width:32px; text-align:center; font-size:13px; font-weight:700; line-height:32px; color:#1a1a2e; background:#fff; }
.oz-qty-sm .oz-qty-btn { width:28px; height:28px; font-size:15px; }
.oz-qty-sm .oz-qty-val { width:28px; font-size:13px; line-height:28px; }
.oz-qty-lg .oz-qty-btn { width:44px; height:44px; font-size:22px; }
.oz-qty-lg .oz-qty-val { width:44px; font-size:18px; font-weight:700; line-height:44px; }

/* ── Buttons ──────────────────────────────────── */
.oz-btn { display:inline-flex; align-items:center; justify-content:center; padding:10px 18px; border-radius:8px; font-size:14px; font-weight:600; cursor:pointer; border:2px solid transparent; transition:all .2s; text-decoration:none; white-space:nowrap; }
.oz-btn-primary   { background:#1a1a2e; color:#fff; border-color:#1a1a2e; }
.oz-btn-primary:hover { background:#2d2d4e; border-color:#2d2d4e; color:#fff; }
.oz-btn-secondary { background:#fff; color:#1a1a2e; border-color:#1a1a2e; }
.oz-btn-secondary:hover { background:#1a1a2e; color:#fff; }
.oz-btn-outline   { background:transparent; color:#1a1a2e; border-color:#1a1a2e; padding:7px 14px; font-size:13px; }
.oz-btn-outline:hover { background:#1a1a2e; color:#fff; }
.oz-btn-ghost     { background:transparent; color:rgba(255,255,255,.8); border-color:rgba(255,255,255,.3); }
.oz-btn-ghost:hover { background:rgba(255,255,255,.1); color:#fff; }
.oz-btn-wide { width:100%; padding:14px; font-size:16px; }
.oz-btn-add  { flex:1; padding:12px 20px; font-size:15px; }
.oz-btn-pay  { width:100%; padding:16px; font-size:16px; margin-top:16px; }
.oz-back-link { background:none; border:none; color:#666; cursor:pointer; font-size:14px; padding:0 0 16px; display:block; }
.oz-back-link:hover { color:#1a1a2e; }

/* ── Product detail ───────────────────────────── */
.oz-detail-layout { display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:start; margin-bottom:32px; }
.oz-detail-img-wrap { border-radius:12px; overflow:hidden; border:1px solid #e8e8e8; background:#f5f5f5; aspect-ratio:4/3; }
.oz-detail-img-wrap img { width:100%; height:100%; object-fit:cover; }
.oz-detail-ph { width:100%; height:100%; display:flex; align-items:center; justify-content:center; }
.oz-detail-right h2 { font-size:24px; margin:0 0 10px; color:#1a1a2e; }
.oz-detail-price-row { margin-bottom:14px; }
.oz-detail-price { font-size:30px; font-weight:700; color:#1a1a2e; }
.oz-detail-price-row small { font-size:13px; color:#888; margin-left:6px; }
.oz-divider { border:none; border-top:2px solid #f0f0f0; margin:16px 0; }
.oz-detail-short { font-size:15px; color:#555; line-height:1.6; margin:0 0 20px; }
.oz-detail-add-row { display:flex; gap:14px; align-items:center; margin-bottom:14px; }
.oz-added-msg { color:#27ae60; font-weight:600; font-size:14px; margin-bottom:10px; }
.oz-detail-meta { font-size:13px; color:#888; margin-top:14px; }
.oz-full-desc-panel { border-top:2px solid #f0f0f0; padding-top:28px; margin-top:8px; }
.oz-full-desc-panel h3 { font-size:18px; color:#1a1a2e; margin:0 0 16px; }
.oz-full-desc-panel > div { font-size:15px; line-height:1.7; color:#444; }
.oz-full-desc-panel h2,.oz-full-desc-panel h3,.oz-full-desc-panel h4 { color:#1a1a2e; margin-top:20px; }
.oz-full-desc-panel ul,.oz-full-desc-panel ol { padding-left:20px; }
.oz-full-desc-panel li { margin-bottom:6px; }
.oz-full-desc-panel img { max-width:100%; border-radius:8px; }

/* ── Panel titles / nav ───────────────────────── */
.oz-panel-title { font-size:22px; color:#1a1a2e; margin:0 0 20px; }
.oz-panel-nav { margin-top:16px; }

/* ── Box ──────────────────────────────────────── */
.oz-box { background:#fff; border:1px solid #e8e8e8; border-radius:12px; padding:24px; margin-bottom:20px; }

/* ── Shipping form ────────────────────────────── */
.oz-ship-form { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.oz-field { display:flex; flex-direction:column; gap:5px; }
.oz-field-full { grid-column:span 2; }
.oz-field label { font-size:12px; font-weight:700; color:#444; text-transform:uppercase; letter-spacing:.5px; }
.oz-input { width:100%; padding:10px 12px; border:2px solid #e0e0e0; border-radius:8px; font-size:14px; background:#fff; transition:border-color .2s; box-sizing:border-box; }
.oz-input:focus { border-color:#1a1a2e; outline:none; }
select.oz-input { appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23333' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 12px center; padding-right:32px; }
.oz-field-error { color:#c00; font-size:12px; margin-top:3px; display:block; }

/* ── Customer details form ────────────────────── */
.oz-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }

/* ── Rate options ─────────────────────────────── */
.oz-rates-box { margin-top:8px; }
.oz-rates-box h3 { font-size:15px; color:#1a1a2e; margin:0 0 12px; }
.oz-rate-list { display:flex; flex-direction:column; gap:10px; }
.oz-rate-option { display:flex; align-items:center; gap:14px; border:2px solid #e0e0e0; border-radius:10px; padding:14px 16px; cursor:pointer; transition:border-color .2s, background .2s; }
.oz-rate-option:hover { border-color:#1a1a2e; }
.oz-rate-option.oz-selected { border-color:#1a1a2e; background:#f0f2ff; }
.oz-rate-option input[type=radio] { width:18px; height:18px; accent-color:#1a1a2e; flex-shrink:0; }
.oz-rate-name { font-weight:600; font-size:14px; }
.oz-rate-days { font-size:12px; color:#888; }
.oz-rate-price { margin-left:auto; font-weight:700; font-size:16px; color:#1a1a2e; }
.oz-note-warn { font-size:12px; color:#e07000; margin-top:8px; }
.oz-note-info { font-size:12px; color:#888; margin-top:8px; font-style:italic; }

/* ── Cart table ───────────────────────────────── */
.oz-cart-table { width:100%; border-collapse:collapse; font-size:14px; margin-bottom:14px; }
.oz-cart-table th { background:#1a1a2e; color:#fff; padding:10px 12px; text-align:left; font-size:13px; }
.oz-cart-table td { padding:12px; border-bottom:1px solid #f0f0f0; vertical-align:middle; }
.oz-rm-btn { background:none; border:none; color:#bbb; cursor:pointer; font-size:16px; padding:0; }
.oz-rm-btn:hover { color:#c00; }
.oz-cart-sub { text-align:right; font-size:15px; padding:10px 0; }
.oz-sum-table td { padding:8px 0; }

/* ── Order totals ─────────────────────────────── */
.oz-totals { border-top:2px solid #f0f0f0; padding-top:14px; margin-bottom:16px; }
.oz-total-row { display:flex; justify-content:space-between; padding:7px 0; border-bottom:1px solid #f5f5f5; font-size:14px; }
.oz-total-row.oz-grand { border-bottom:none; font-size:20px; font-weight:700; color:#1a1a2e; padding-top:12px; }
.oz-delivery-address { font-size:13px; color:#666; background:#f9f9f9; padding:12px 14px; border-radius:8px; margin-bottom:8px; }
.oz-delivery-address strong { color:#1a1a2e; display:block; margin-bottom:4px; }
.oz-stripe-note { font-size:12px; color:#888; text-align:center; margin:8px 0 0; }
.oz-error-msg { color:#c00; font-size:13px; margin-top:10px; padding:10px 14px; background:#fff0f0; border-radius:6px; border:1px solid #fcc; }

/* ── Result pages ─────────────────────────────── */
.oz-result-page { text-align:center; padding:40px 20px; }
.oz-result-icon { width:70px; height:70px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:32px; margin:0 auto 20px; }
.oz-success-icon { background:#e6f9ee; color:#27ae60; }
.oz-cancel-icon  { background:#ffeaea; color:#c0392b; }
.oz-result-page h2 { font-size:26px; margin-bottom:12px; color:#1a1a2e; }

/* ── Responsive ───────────────────────────────── */
@media (max-width:700px) {
    .oz-products-grid { grid-template-columns:1fr; }
    .oz-detail-layout { grid-template-columns:1fr; gap:20px; }
    .oz-ship-form, .oz-form-grid { grid-template-columns:1fr; }
    .oz-field-full { grid-column:span 1; }
    .oz-cart-bar { flex-direction:column; gap:10px; text-align:center; }
    .oz-cart-bar-actions { flex-direction:column; width:100%; }
    .oz-cart-bar-actions .oz-btn { width:100%; }
    .oz-steps { overflow-x:auto; flex-wrap:nowrap; padding:12px 10px; }
    .oz-step-label { display:none; }
    .oz-step-line { min-width:16px; }
}