/* ── PAGE CONTENT ─────────────────────────── */
.pi-content{padding:22px 28px 60px;flex:1}

/* HERO */
.pi-hero{background:linear-gradient(130deg,#1B6B2F 0%,#2E9E3E 55%,#3CB84B 100%);border-radius:18px;padding:22px 28px;margin-bottom:22px;display:flex;align-items:center;gap:18px;position:relative;overflow:hidden;box-shadow:0 6px 24px rgba(46,158,62,.25)}
.pi-hero::before{content:'';position:absolute;width:300px;height:300px;border-radius:50%;background:rgba(255,255,255,.05);top:-120px;right:40px;pointer-events:none}
.pi-hero::after{content:'📦';position:absolute;right:28px;top:50%;transform:translateY(-50%);font-size:72px;opacity:.08;pointer-events:none;z-index:0}
.hero-ico{width:58px;height:58px;border-radius:16px;background:rgba(255,255,255,.18);border:1.5px solid rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center;font-size:26px;flex-shrink:0;position:relative;z-index:1}
.hero-txt{position:relative;z-index:1}
.hero-title{font-family:var(--ff);font-weight:900;font-size:20px;color:#fff;margin-bottom:4px}
.hero-sub{font-size:13.5px;color:rgba(255,255,255,.8);line-height:1.45}

/* STEP BAR */
.step-bar{display:flex;background:var(--card);border:1px solid var(--border);border-radius:14px;overflow:hidden;margin-bottom:20px;box-shadow:0 2px 10px rgba(24,48,32,.05)}
.step-item{flex:1;display:flex;align-items:center;gap:9px;padding:12px 14px;border-right:1px solid var(--border);transition:background .15s}
.step-item:last-child{border-right:none}
.step-item.done  {background:var(--green-light)}
.step-item.active{background:#F5FBF6}
.s-num{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--ff);font-weight:900;font-size:12px;flex-shrink:0;transition:all .2s}
.step-item.done   .s-num{background:var(--green);color:#fff;box-shadow:0 2px 8px rgba(46,158,62,.3)}
.step-item.active .s-num{background:var(--green-dark);color:#fff;box-shadow:0 2px 8px rgba(46,158,62,.4)}
.step-item.pending .s-num{background:var(--border);color:var(--text-3)}
.s-lbl{font-family:var(--ff);font-weight:700;font-size:12.5px}
.step-item.done   .s-lbl{color:var(--green-dark)}
.step-item.active .s-lbl{color:var(--text)}
.step-item.pending .s-lbl{color:var(--text-3)}

/* PAGE GRID */
.page-grid{display:grid;grid-template-columns:1fr 310px;gap:20px;align-items:start}

/* SECTION CARD */
.sec-card{background:var(--card);border:1px solid var(--border);border-radius:16px;overflow:hidden;margin-bottom:16px;box-shadow:0 2px 12px rgba(24,48,32,.06);transition:box-shadow .2s,border-color .2s}
.sec-card:focus-within{box-shadow:0 4px 20px rgba(46,158,62,.12);border-color:rgba(46,158,62,.25)}
.sec-head{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--border);background:var(--card-2)}
.sec-title{font-family:var(--ff);font-weight:800;font-size:14.5px;color:var(--text);display:flex;align-items:center;gap:10px}
.sec-ico{width:32px;height:32px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:16px}
.sec-step{font-size:10px;font-weight:800;padding:2px 9px;border-radius:20px;background:var(--green-light);color:var(--green-dark);font-family:var(--ff)}
.sec-body{padding:20px}

/* FIELD */
.field{margin-bottom:18px}
.field:last-child{margin-bottom:0}
.f-label{display:flex;align-items:center;justify-content:space-between;font-size:11.5px;font-weight:700;color:var(--text-2);margin-bottom:7px;text-transform:uppercase;letter-spacing:.5px}
.f-req{color:var(--red)}
.f-cnt{font-size:10.5px;color:var(--text-3);font-weight:600;text-transform:none;letter-spacing:0}
.f-in,.f-sel,.f-ta{width:100%;border:1.5px solid var(--border);border-radius:10px;padding:11px 14px;font-size:14px;font-family:var(--ff-body);color:var(--text);background:var(--card);outline:none;transition:border-color .15s,box-shadow .15s;resize:none}
.f-in:focus,.f-sel:focus,.f-ta:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(46,158,62,.1)}
.f-ta{min-height:110px;line-height:1.65}
.f-hint{font-size:11.5px;color:var(--text-3);margin-top:5px}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.f-row-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.f-ico-wrap{position:relative}
.f-ico-wrap .fi{position:absolute;left:13px;top:50%;transform:translateY(-50%);font-size:15px;pointer-events:none}
.f-ico-wrap .f-in{padding-left:38px}

/* CATEGORY ROW (tap to open modal) */
.cat-row{display:flex;align-items:center;justify-content:space-between;padding:13px 14px;background:var(--bg);border-radius:var(--radius-sm,10px);cursor:pointer;transition:background .15s;border:1.5px solid var(--border);margin-bottom:0}
.cat-row:hover{background:var(--green-light);border-color:var(--green)}
.cat-row-label{font-size:13px;font-weight:600;color:var(--text-2)}
.cat-val{font-size:14px;font-weight:800;color:var(--green);display:flex;align-items:center;gap:4px}
.cat-hint{font-size:12px;color:var(--red);margin-top:8px;display:none}
.cat-hint.show{display:block}

/* CATEGORY MODAL */
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:99999;align-items:flex-end;justify-content:center}
.modal-overlay.open{display:flex}
.cat-modal{background:var(--card,#fff);border-radius:22px 22px 0 0;padding:20px 16px 36px;width:100%;max-width:520px;animation:slideUp .25s ease;max-height:75vh;overflow-y:auto}
@keyframes slideUp{from{transform:translateY(40px);opacity:0}to{transform:translateY(0);opacity:1}}
.modal-handle{width:44px;height:5px;border-radius:3px;background:var(--border);margin:0 auto 18px}
.modal-title{font-family:var(--ff);font-weight:900;font-size:18px;margin-bottom:14px;text-align:center;color:var(--text)}
.cat-option{display:flex;align-items:center;gap:12px;padding:13px 10px;border-radius:10px;cursor:pointer;transition:background .15s;font-size:14px;font-weight:500;color:var(--text)}
.cat-option:hover{background:var(--bg)}
.cat-option.selected{background:var(--green-light);color:var(--green-dark);font-weight:700}

/* CONDITION TOGGLE */
.cond-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.cond-opt{border:1.5px solid var(--border);border-radius:11px;padding:11px 14px;display:flex;align-items:center;gap:9px;cursor:pointer;transition:all .16s;user-select:none}
.cond-opt:hover{border-color:var(--green);background:var(--green-light)}
.cond-opt.active{border-color:var(--green);background:var(--green-light);box-shadow:0 2px 8px rgba(46,158,62,.12)}
.cond-ico{font-size:18px}
.cond-lbl{font-family:var(--ff);font-weight:800;font-size:13px;color:var(--text)}
.cond-sub{font-size:11px;color:var(--text-3)}

/* PHOTO UPLOAD */
.drop-zone{border:2px dashed var(--border);border-radius:14px;min-height:140px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer;transition:all .18s;background:var(--bg);position:relative;overflow:hidden;margin-bottom:10px}
.drop-zone:hover,.drop-zone.drag-over{border-color:var(--blue);background:#EEF5FF}
.drop-zone input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.dz-icon{width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,#e0f0ff,#c8e3ff);border:2px solid rgba(26,95,168,.15);display:flex;align-items:center;justify-content:center;font-size:24px}
.dz-title{font-family:var(--ff);font-weight:800;font-size:13.5px;color:var(--text)}
.dz-sub{font-size:11.5px;color:var(--text-3)}
.photo-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:4px}
.photo-thumb{position:relative;aspect-ratio:1;border-radius:9px;overflow:hidden;border:1.5px solid var(--border);background:var(--bg)}
.photo-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.photo-thumb .rm{position:absolute;top:3px;right:3px;width:20px;height:20px;background:rgba(0,0,0,.65);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;cursor:pointer;font-weight:700;line-height:1;border:none;outline:none}
.photo-thumb.is-main::after{content:'MAIN';position:absolute;bottom:0;left:0;right:0;background:rgba(46,158,62,.85);color:#fff;font-size:8px;font-weight:800;text-align:center;padding:2px 0;letter-spacing:.5px}
.photo-count{font-size:12px;color:var(--text-3);margin-top:6px}

/* ATTRIBUTES */
.attr-row{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;align-items:center;margin-bottom:8px}
.attr-row .f-in{margin:0}
.attr-del{width:32px;height:32px;border-radius:8px;background:var(--bg);border:1.5px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:15px;cursor:pointer;color:var(--red);transition:all .15s;flex-shrink:0}
.attr-del:hover{background:#fff0f0;border-color:var(--red)}
.add-attr-btn{display:flex;align-items:center;gap:7px;background:var(--green-light);border:1.5px dashed var(--green);border-radius:10px;padding:9px 14px;cursor:pointer;font-family:var(--ff);font-weight:700;font-size:13px;color:var(--green-dark);width:100%;justify-content:center;transition:all .16s;margin-top:6px}
.add-attr-btn:hover{background:#d6f0d9;border-color:var(--green-dark)}
.attr-select{width:100%;border:1.5px solid var(--border);border-radius:10px;padding:9px 12px;font-size:13px;font-family:var(--ff-body);color:var(--text);background:var(--card);outline:none;transition:border-color .15s}
.attr-select:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(46,158,62,.1)}
.attr-empty-msg{text-align:center;padding:14px;color:var(--text-3);font-size:13px}

/* NEGOTIABLE TOGGLE */
.neg-wrap{display:flex;align-items:center;justify-content:space-between;background:var(--card-2);border:1.5px solid var(--border);border-radius:11px;padding:13px 16px}
.neg-info .neg-title{font-family:var(--ff);font-weight:800;font-size:14px;color:var(--text);margin-bottom:2px}
.neg-info .neg-sub{font-size:12px;color:var(--text-3)}
.tog{width:46px;height:26px;border-radius:13px;background:var(--border);position:relative;cursor:pointer;transition:background .2s;flex-shrink:0}
.tog::after{content:'';position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.2);transition:left .2s}
.tog.on{background:var(--green)}
.tog.on::after{left:23px}

/* DELIVERY CHECKBOXES */
.delivery-row{display:flex;gap:10px}
.del-opt{flex:1;border:1.5px solid var(--border);border-radius:11px;padding:11px 14px;display:flex;align-items:center;gap:9px;cursor:pointer;transition:all .16s;user-select:none}
.del-opt:hover{border-color:var(--green);background:var(--green-light)}
.del-opt.active{border-color:var(--green);background:var(--green-light)}
.del-opt input[type=checkbox]{display:none}
.del-ico{font-size:18px}
.del-lbl{font-family:var(--ff);font-weight:700;font-size:13px;color:var(--text)}

/* LOCATION */
.loc-tabs{display:flex;gap:0;background:var(--bg);border-radius:10px;border:1.5px solid var(--border);overflow:hidden;margin-bottom:10px}
.loc-tab{flex:1;padding:9px 12px;text-align:center;font-family:var(--ff);font-weight:700;font-size:12.5px;cursor:pointer;color:var(--text-3);transition:all .15s;border-right:1.5px solid var(--border)}
.loc-tab:last-child{border-right:none}
.loc-tab.active{background:var(--card);color:var(--green-dark)}
.loc-panel{display:none}
.loc-panel.show{display:block}
.gps-btn{width:100%;padding:10px 16px;border-radius:10px;background:var(--green);color:#fff;font-family:var(--ff);font-weight:800;font-size:13.5px;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:background .15s}
.gps-btn:hover{background:var(--green-dark)}
.loc-detected{display:none;margin-top:8px;background:var(--green-light);border:1.5px solid rgba(46,158,62,.3);border-radius:9px;padding:9px 13px;font-size:13px;color:var(--green-dark);font-weight:700}
.loc-detected.show{display:block}
.loc-suggs{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.loc-sugg{background:var(--card-2);border:1.5px solid var(--border);border-radius:20px;padding:4px 12px;font-size:12px;font-weight:700;cursor:pointer;transition:all .15s;color:var(--text-2)}
.loc-sugg:hover{border-color:var(--green);color:var(--green-dark);background:var(--green-light)}

/* PHONE CONTACT SECTION */
.phone-sec-wrap{display:flex;align-items:stretch;border:1.5px solid var(--border);border-radius:10px;overflow:hidden;transition:border-color .15s,box-shadow .15s}
.phone-sec-wrap:focus-within{border-color:var(--green);box-shadow:0 0 0 3px rgba(46,158,62,.1)}
.phone-flag-biz{background:var(--green);color:#fff;font-family:var(--ff);font-weight:900;font-size:13px;padding:0 14px;display:flex;align-items:center;flex-shrink:0;gap:5px}
.phone-input-biz{flex:1;border:none;padding:11px 14px;font-size:14px;font-family:var(--ff-body);font-weight:600;color:var(--text);background:var(--card);outline:none}
.phone-input-biz::placeholder{font-weight:400}
.biz-consent-row{display:flex;align-items:flex-start;gap:12px;padding:13px 14px;margin-top:10px;background:linear-gradient(135deg,#FFF8EC,#FFFBF0);border:2px solid var(--yellow);border-radius:10px;cursor:pointer;transition:all .2s;user-select:none}
.biz-consent-row.checked{background:linear-gradient(135deg,#E8F5EA,#F0FBF2);border-color:var(--green)}
.biz-consent-check{flex-shrink:0;width:22px;height:22px;border-radius:6px;border:2px solid var(--yellow);background:var(--card);display:flex;align-items:center;justify-content:center;margin-top:1px;transition:all .18s}
.biz-consent-row.checked .biz-consent-check{background:var(--green);border-color:var(--green)}
.biz-consent-check svg{display:none}
.biz-consent-row.checked .biz-consent-check svg{display:block}
.biz-consent-title{font-family:var(--ff);font-weight:800;font-size:13px;color:var(--text);margin-bottom:3px}
.biz-consent-row.checked .biz-consent-title{color:var(--green-dark)}
.biz-consent-sub{font-size:11.5px;color:var(--text-2);line-height:1.55}
.biz-phone-preview{display:none;align-items:center;gap:10px;margin-top:10px;padding:10px 14px;background:var(--green-light);border:1.5px solid var(--green);border-radius:10px}
.biz-phone-preview.visible{display:flex}
.biz-phone-preview-num{font-family:var(--ff);font-weight:800;font-size:14px;color:var(--green-dark)}
.biz-phone-preview-sub{font-size:11px;color:var(--text-2);margin-top:1px}

/* SIDEBAR CARDS */
.side-card{background:var(--card);border:1px solid var(--border);border-radius:16px;overflow:hidden;margin-bottom:16px;box-shadow:0 2px 12px rgba(24,48,32,.06)}
.side-head{padding:14px 18px;border-bottom:1px solid var(--border);background:var(--card-2);font-family:var(--ff);font-weight:800;font-size:14px;color:var(--text);display:flex;align-items:center;gap:8px}
.side-body{padding:16px 18px}

/* LIVE PREVIEW */
.prev-lbl{font-size:10.5px;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}
.prev-val{font-family:var(--ff);font-weight:700;font-size:15px;color:var(--text);margin-bottom:10px}
.prev-price{font-family:var(--ff);font-weight:900;font-size:20px;color:var(--green);margin-bottom:3px}
.prev-empty{font-style:italic;color:var(--text-3);font-weight:400;font-size:13px}
.prev-div{height:1px;background:var(--border);margin:10px 0}
.prev-cat-pill{background:var(--green-light);color:var(--green-dark);border-radius:20px;padding:3px 10px;font-size:12.5px;font-weight:700;display:inline-block}
.prev-cond-pill{border-radius:20px;padding:3px 10px;font-size:12.5px;font-weight:700;display:inline-block}
.prev-cond-pill.new{background:#E3F2FD;color:#1565C0}
.prev-cond-pill.used{background:#FFF8E1;color:#E65100}

/* TIPS */
.tip-r{display:flex;align-items:flex-start;gap:9px;font-size:13px;color:var(--text-2);padding:6px 0;border-bottom:1px solid var(--border);line-height:1.5}
.tip-r:last-child{border-bottom:none;padding-bottom:0}
.tip-i{font-size:15px;flex-shrink:0;margin-top:1px}

/* PUBLISH BUTTON */
.pub-btn{width:100%;padding:14px 20px;border-radius:12px;background:linear-gradient(135deg,var(--green),var(--green-dark));color:#fff;font-family:var(--ff);font-weight:900;font-size:16px;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 4px 16px rgba(46,158,62,.35);transition:all .2s;letter-spacing:-.2px}
.pub-btn:hover{transform:translateY(-1px);box-shadow:0 6px 22px rgba(46,158,62,.45)}
.pub-btn:active{transform:none}
.pub-btn:disabled{opacity:.65;cursor:not-allowed;transform:none}

/* ALERT BANNERS */
.alert{border-radius:11px;padding:12px 16px;margin-bottom:18px;font-size:13.5px;font-weight:600;display:flex;align-items:center;gap:10px}
.alert-err{background:#FFF0F0;border:1.5px solid rgba(217,64,64,.3);color:var(--red)}
.alert-ok{background:var(--green-light);border:1.5px solid rgba(46,158,62,.35);color:var(--green-dark)}

/* ANIMATIONS */
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.anim{animation:fadeUp .3s ease both}
.a1{animation-delay:.04s}.a2{animation-delay:.08s}.a3{animation-delay:.12s}.a4{animation-delay:.16s}

@media(max-width:900px){
    .page-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
    .pi-content{padding:14px 12px 80px}
    .f-row,.f-row-3{grid-template-columns:1fr}
    .step-bar{display:none}
}