/* Canastón Suite — frontend styles. Inherits theme CSS vars (--primary, --accent, --line, --cream, --ink). */

/* ---------- Zone gate modal (reuses .modal base from theme) ---------- */
.cansuite-zone-modal .locsearch{display:flex;align-items:center;gap:10px;border:1px solid var(--line,#eee);border-radius:12px;padding:12px 14px;background:#fff}
.cansuite-zone-modal .locsearch input{border:0;outline:0;flex:1;font-size:15px;font-family:inherit;background:transparent}
.cansuite-zone-result{min-height:22px;font-weight:700;font-size:14px;margin:4px 0 14px;border-radius:10px;padding:0}
.cansuite-zone-result.ok{color:#0c831f;background:#e7f7ea;padding:10px 12px}
.cansuite-zone-result.bad{color:#b42318;background:#fdecea;padding:10px 12px}
.cansuite-zone-skip{display:block;width:100%;background:none;border:0;color:var(--grey,#666);font-weight:700;margin-top:10px;cursor:pointer;font-family:inherit;font-size:14px}

/* ---------- Guest checkout note ---------- */
.cansuite-guest-note{background:var(--cream,#FAF4E8);border:1px dashed var(--accent,#B45A2A);color:var(--accent-dark,#7d3a16);font-weight:700;border-radius:12px;padding:14px 16px;margin:0 0 20px;font-size:14px;line-height:1.4}

/* ---------- Wishlist heart on product card ---------- */
.pcard{position:relative}
.cansuite-heart{position:absolute;top:8px;right:8px;width:34px;height:34px;border-radius:50%;border:0;background:rgba(255,255,255,.92);color:#cfcfcf;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.12);transition:transform .12s,color .12s;z-index:3}
.cansuite-heart:hover{transform:scale(1.12)}
.cansuite-heart.on{color:#e0245e}
.cansuite-wishgrid .pcard{min-height:auto}

/* ---------- Deal ribbon ---------- */
.cansuite-deal-ribbon{position:absolute;top:8px;left:8px;color:#fff;font-weight:800;font-size:11px;letter-spacing:.3px;padding:4px 8px;border-radius:8px;z-index:3;box-shadow:0 1px 4px rgba(0,0,0,.18)}

/* ---------- Order status tracker ---------- */
.cansuite-track{margin:20px 0;background:#fff;border:1px solid var(--line,#eee);border-radius:14px;padding:18px}
.cansuite-track h3{font-size:16px;font-weight:800;margin:0 0 16px}
.cansuite-track.cancelled{color:#b42318;background:#fdecea;border-color:#f5c2bc;font-weight:700}
.cansuite-steps{display:flex;gap:0;position:relative;flex-wrap:wrap}
.cansuite-step{flex:1;min-width:90px;text-align:center;position:relative;padding-top:4px}
.cansuite-step .dot{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;margin:0 auto 8px;font-size:18px;background:#f1f1f1;border:2px solid #e3e3e3;position:relative;z-index:2}
.cansuite-step .lbl{font-size:12px;font-weight:700;color:var(--grey,#666);display:block;line-height:1.2}
.cansuite-step.done .dot{background:#e7f7ea;border-color:#0c831f}
.cansuite-step.current .dot{background:var(--primary,#1B5C5C);border-color:var(--primary,#1B5C5C);box-shadow:0 0 0 4px rgba(27,92,92,.15)}
.cansuite-step.current .lbl{color:var(--primary,#1B5C5C)}
.cansuite-step:not(:last-child)::after{content:"";position:absolute;top:23px;left:50%;width:100%;height:2px;background:#e3e3e3;z-index:1}
.cansuite-step.done:not(:last-child)::after{background:#0c831f}
.cansuite-track-card{font-size:14px;margin:18px 0 -8px;color:var(--ink,#1c1c1c)}

/* ---------- Delivery date at checkout ---------- */
.cansuite-deldate{margin:20px 0;padding:16px;background:var(--cream,#FAF4E8);border-radius:12px}
.cansuite-deldate h3{font-size:15px;font-weight:800;margin:0 0 10px}
.cansuite-cutoff-note{color:var(--accent-dark,#7d3a16);font-weight:700;font-size:13px;margin:0 0 10px}

/* ---------- WhatsApp FAB ---------- */
.cansuite-wa-fab{position:fixed;right:18px;bottom:84px;width:54px;height:54px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(0,0,0,.25);z-index:60;transition:transform .15s}
.cansuite-wa-fab:hover{transform:scale(1.08)}
@media(max-width:768px){.cansuite-wa-fab{bottom:140px}}

/* ---------- Account dashboard tiles ---------- */
.cansuite-acct-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin:16px 0}
.cansuite-acct-tile{background:#fff;border:1px solid var(--line,#eee);border-radius:14px;padding:16px;text-align:center}
.cansuite-acct-tile .v{font-size:24px;font-weight:900;color:var(--primary,#1B5C5C)}
.cansuite-acct-tile .k{font-size:12px;font-weight:700;color:var(--grey,#666);margin-top:4px}

/* ---------- Login modal social buttons (feature 7) ---------- */
.cansuite-social{display:flex;flex-direction:column;gap:10px;margin:14px 0}
.cansuite-social .sbtn{display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid var(--line,#e3e3e3);border-radius:12px;padding:11px;font-weight:700;font-size:14px;background:#fff;cursor:pointer;text-decoration:none;color:var(--ink,#1c1c1c);font-family:inherit}
.cansuite-social .sbtn:hover{background:#fafafa}
.cansuite-social .sbtn.google{}
.cansuite-or{display:flex;align-items:center;gap:10px;color:var(--grey,#999);font-size:12px;font-weight:700;margin:6px 0}
.cansuite-or::before,.cansuite-or::after{content:"";flex:1;height:1px;background:var(--line,#eee)}

/* ---------- Persistent mobile cart bar (feature 2) ---------- */
.cansuite-mini-cart{position:fixed;left:0;right:0;bottom:0;z-index:55;background:var(--primary,#1B5C5C);color:#fff;display:none;align-items:center;justify-content:space-between;padding:12px 16px;box-shadow:0 -2px 14px rgba(0,0,0,.18);cursor:pointer}
.cansuite-mini-cart.show{display:flex}
.cansuite-mini-cart .mc-left{display:flex;align-items:center;gap:10px;font-weight:800;font-size:14px}
.cansuite-mini-cart .mc-count{background:#fff;color:var(--primary,#1B5C5C);border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:900}
.cansuite-mini-cart .mc-go{display:flex;align-items:center;gap:6px;font-weight:800;font-size:14px}
@media(min-width:769px){.cansuite-mini-cart{display:none !important}}