/* create-listing.html — page-specific styles. */

input,textarea,select{font-family:inherit;}
.eyebrow{
  font-family:'IBM Plex Mono',monospace;
  font-size:11.5px;
  letter-spacing:0.09em;
  text-transform:uppercase;
  color:var(--pine);
  font-weight:500;
}
.wrap{max-width:1240px;margin:0 auto;padding:0 32px;}
@media (max-width:720px){.wrap{padding:0 20px;}}
@media (max-width:420px){.wrap{padding:0 16px;}}
/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:13px 24px;border-radius:999px;font-weight:600;font-size:15px;
  border:1px solid transparent;transition:transform .15s ease, background .2s ease, border-color .2s ease, color .2s ease;
  white-space:nowrap;
}
.btn-secondary{background:transparent;color:var(--ink);border-color:var(--ink);}
.btn-sm{padding:9px 16px;font-size:13.5px;}
.btn:disabled{opacity:0.45;cursor:not-allowed;}
.btn:disabled:hover{background:var(--pine);}
.phototile svg{width:100%;height:100%;display:block;}
/* ================= APP HEADER ================= */
.app-header{
  position:sticky;top:0;z-index:100;
  background:rgba(250,247,241,0.9);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.app-header-inner{
  max-width:1240px;margin:0 auto;padding:0 32px;
  height:72px;display:flex;align-items:center;justify-content:space-between;gap:16px;
}
@media (max-width:720px){.app-header-inner{padding:0 20px;height:60px;}}
.logo{display:flex;align-items:center;gap:9px;font-family:'Fraunces',serif;font-weight:600;font-size:20px;letter-spacing:0.01em;color:var(--pine-deep);}
.app-header-left{display:flex;align-items:center;gap:18px;}
.app-back-btn svg{width:17px;height:17px;}
.app-header-right{display:flex;align-items:center;gap:14px;}
.save-status{
  display:flex;align-items:center;gap:7px;font-size:13.5px;color:var(--ink-soft);
  font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:0.01em;
}
.save-status .dot{width:6px;height:6px;border-radius:999px;background:var(--pine);flex-shrink:0;}
.save-status.saving .dot{background:var(--brass);animation:pulse 1s ease-in-out infinite;}
@media (max-width:640px){.save-status{display:none;}}
.save-status-mobile{
  display:none;font-size:11px;color:var(--ink-soft);font-family:'IBM Plex Mono',monospace;
  text-align:center;padding:6px 0 0;
}
@media (max-width:640px){.save-status-mobile{display:block;}}
/* ---------- Demo role switcher (intentionally unobtrusive) ---------- */
.demo-role-switch{
  position:fixed;bottom:16px;left:16px;z-index:90;
  background:var(--white);border:1px solid var(--line);border-radius:999px;
  padding:4px;display:flex;gap:2px;box-shadow:var(--shadow-soft);
  opacity:0.88;transition:opacity .2s ease;
}
.demo-role-label{font-size:9.5px;color:var(--ink-faint);text-transform:uppercase;letter-spacing:0.08em;padding:0 8px 2px;align-self:center;display:none;}
@media (max-width:760px){
  /* Bottom-left would collide with the sticky mobile nav bar, and top overlaps
     header controls, so tuck it just below the header, right-aligned. */
  .demo-role-switch{
    position:absolute;bottom:auto;left:auto;top:68px;right:16px;transform:none;
    opacity:0.85;padding:3px;z-index:80;
  }
  .demo-role-btn{padding:6px 10px;font-size:10.5px;}
}
@media (max-width:420px){.demo-role-switch{right:12px;}}
/* ================= WIZARD LAYOUT ================= */
.wizard-shell{padding:32px 0 80px;}
@media (max-width:640px){.wizard-shell{padding:0 0 100px;}}
.wizard-grid{display:grid;grid-template-columns:25% 1fr;gap:56px;align-items:start;}
@media (max-width:960px){.wizard-grid{grid-template-columns:220px 1fr;gap:32px;}}
@media (max-width:760px){.wizard-grid{grid-template-columns:1fr;gap:0;}}
/* ---------- Desktop progress sidebar ---------- */
.wizard-sidebar{position:sticky;top:100px;}
@media (max-width:760px){.wizard-sidebar{display:none;}}
.sidebar-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;}
.sidebar-step{
  display:flex;align-items:center;gap:12px;padding:12px 0;position:relative;
  color:var(--ink-soft);
}
.sidebar-step::before{
  content:'';position:absolute;left:13px;top:38px;bottom:-12px;width:1.5px;background:var(--line);
}
.sidebar-step:last-child::before{display:none;}
.step-marker{
  width:27px;height:27px;border-radius:999px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;font-family:'IBM Plex Mono',monospace;
  background:var(--white);border:1.5px solid var(--line);color:var(--ink-faint);
  transition:all .2s ease;
}
.sidebar-step .step-label{font-size:14.5px;font-weight:500;transition:color .2s ease;}
.sidebar-step.current .step-marker{background:var(--pine);border-color:var(--pine);color:var(--white);}
.sidebar-step.current .step-label{color:var(--ink);font-weight:600;}
.sidebar-step.done .step-marker{background:var(--pine-tint);border-color:var(--pine-tint);color:var(--pine);}
.sidebar-step.done .step-label{color:var(--ink-soft);}
.sidebar-step.done .step-marker svg{width:13px;height:13px;}
/* ---------- Mobile top progress ---------- */
.mobile-progress{display:none;padding:14px 0 4px;}
@media (max-width:760px){.mobile-progress{display:block;}}
.mobile-progress-inner{padding:0 20px;}
@media (max-width:420px){.mobile-progress-inner{padding:0 16px;}}
.mobile-progress-label{
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.06em;text-transform:uppercase;
  color:var(--pine);margin-bottom:4px;
}
.mobile-progress-title{font-family:'Fraunces',serif;font-size:20px;font-weight:600;margin-bottom:12px;}
.mobile-progress-bar{height:5px;border-radius:999px;background:var(--sand);overflow:hidden;}
.mobile-progress-fill{height:100%;background:var(--pine);border-radius:999px;transition:width .35s ease;}
/* ---------- Main content column ---------- */
.wizard-main{min-width:0;max-width:640px;}
.step-header{margin-bottom:32px;}
@media (max-width:760px){.step-header{margin-top:20px;margin-bottom:24px;}}
.step-header h1{font-size:32px;font-weight:600;letter-spacing:-0.015em;margin-bottom:10px;}
@media (max-width:640px){.step-header h1{font-size:25px;}}
.step-header p{font-size:15.5px;color:var(--ink-soft);margin:0;max-width:480px;}
.step-panel{display:none;}
.step-panel.active{display:block;animation:fadeIn .3s ease;}
/* ---------- Question blocks ---------- */
.q-block{margin-bottom:36px;}
.q-block:last-child{margin-bottom:0;}
.q-label{font-size:16px;font-weight:600;color:var(--ink);margin-bottom:4px;display:flex;align-items:center;gap:8px;}
.q-optional{
  font-size:11px;font-weight:600;color:var(--ink-soft);background:var(--sand);
  padding:2px 9px;border-radius:999px;text-transform:uppercase;letter-spacing:0.04em;font-family:'IBM Plex Mono',monospace;
}
.q-helper{font-size:13.5px;color:var(--ink-soft);margin-top:2px;margin-bottom:14px;}
.q-error{
  font-size:13px;color:#8A5A2E;background:var(--brass-tint);padding:9px 12px;border-radius:var(--radius-s);
  margin-top:8px;display:none;align-items:center;gap:8px;
}
.q-error.show{display:flex;}
.q-error svg{width:15px;height:15px;flex-shrink:0;}
/* ---------- Selection cards (large visual) ---------- */
.selection-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
@media (max-width:640px){.selection-cards{grid-template-columns:repeat(2,1fr);}}
@media (max-width:380px){.selection-cards{gap:9px;}}
.sel-card{
  border:1.5px solid var(--line);border-radius:var(--radius-m);background:var(--white);
  padding:18px 14px;text-align:left;transition:all .15s ease;display:flex;flex-direction:column;gap:10px;
  min-height:44px;
}
.sel-card:hover{border-color:var(--ink-soft);}
.sel-card:active{transform:scale(0.98);}
.sel-card.selected{border-color:var(--pine);background:var(--pine-tint);}
.sel-card-icon{
  width:38px;height:38px;border-radius:var(--radius-s);background:var(--sand);color:var(--pine-deep);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.sel-card.selected .sel-card-icon{background:var(--pine);color:var(--white);}
.sel-card-icon svg{width:19px;height:19px;}
.sel-card-name{font-size:14.5px;font-weight:600;line-height:1.25;}
@media (max-width:380px){
  .sel-card{padding:14px 11px;gap:8px;}
  .sel-card-icon{width:34px;height:34px;}
  .sel-card-icon svg{width:17px;height:17px;}
  .sel-card-name{font-size:13.5px;}
}
/* ---------- Segmented control ---------- */
.segmented{display:inline-flex;background:var(--sand);border-radius:999px;padding:4px;gap:2px;width:100%;max-width:320px;}
.segmented button{
  padding:11px 26px;border-radius:999px;border:none;background:transparent;flex:1;
  font-size:14.5px;font-weight:600;color:var(--ink-soft);transition:all .15s ease;min-height:44px;
}
@media (max-width:480px){.segmented{max-width:none;}}
/* ---------- Chips ---------- */
.chip-row{display:flex;flex-wrap:wrap;gap:9px;}
.chip{
  padding:11px 18px;border-radius:999px;border:1.5px solid var(--line);background:var(--white);
  font-size:14px;font-weight:600;color:var(--ink-soft);transition:all .15s ease;min-height:44px;
}
.chip:hover{border-color:var(--ink-soft);color:var(--ink);}
.chip:active{transform:scale(0.97);}
.chip.selected{background:var(--pine);border-color:var(--pine);color:var(--white);}
.chip.small{padding:9px 14px;font-size:13px;min-height:40px;}
@media (max-width:380px){
  .chip{padding:10px 15px;font-size:13.5px;}
  .chip.small{padding:8px 12px;font-size:12.5px;}
}
/* ---------- Text inputs ---------- */
.field{margin-bottom:0;}
.field-input{
  width:100%;border:1.5px solid var(--line);border-radius:var(--radius-s);padding:14px 16px;
  font-size:15.5px;color:var(--ink);background:var(--white);transition:border-color .15s ease;
}
.field-input:focus{outline:none;border-color:var(--pine);}
.field-input::placeholder{color:var(--ink-faint);}
.field-row{display:flex;justify-content:space-between;align-items:center;margin-top:8px;}
.char-count{font-size:12.5px;color:var(--ink-faint);font-family:'IBM Plex Mono',monospace;}
@media (max-width:480px){.field-input{font-size:16px;}}
/* ---------- Grid for numeric fields ---------- */
.field-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
@media (max-width:480px){.field-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:340px){.field-grid{grid-template-columns:1fr;}}
.field-grid.two{grid-template-columns:repeat(2,1fr);}
.field-group label{font-size:13px;font-weight:600;color:var(--ink-soft);display:block;margin-bottom:7px;}
.stepper{
  display:flex;align-items:center;border:1.5px solid var(--line);border-radius:var(--radius-s);overflow:hidden;background:var(--white);
}
.stepper button{
  width:44px;height:48px;flex-shrink:0;border:none;background:var(--sand);color:var(--ink);
  font-size:18px;font-weight:600;display:flex;align-items:center;justify-content:center;
  -webkit-tap-highlight-color:transparent;
}
.stepper button:hover{background:var(--line);}
.stepper button:active{background:var(--line);}
.stepper input{
  flex:1;border:none;text-align:center;font-size:16px;font-weight:600;background:transparent;color:var(--ink);
  width:100%;min-width:0;
}
.stepper input:focus{outline:none;}
/* ---------- Toggle switch ---------- */
.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px;background:var(--white);border:1.5px solid var(--line);border-radius:var(--radius-m);}
.toggle-switch{
  width:46px;height:27px;border-radius:999px;background:var(--line);border:none;flex-shrink:0;
  position:relative;transition:background .2s ease;
}
.toggle-switch::after{
  content:'';position:absolute;top:3px;left:3px;width:21px;height:21px;border-radius:999px;background:var(--white);
  box-shadow:0 1px 3px rgba(0,0,0,0.2);transition:transform .2s ease;
}
.toggle-switch.on::after{transform:translateX(19px);}
/* ---------- Expandable section ---------- */
.expand-toggle{
  display:flex;align-items:center;gap:8px;font-size:14.5px;font-weight:600;color:var(--pine);
  background:none;border:none;padding:12px 0;min-height:44px;
}
.expand-toggle svg{width:15px;height:15px;transition:transform .2s ease;}
.expand-toggle.open svg{transform:rotate(180deg);}
.expand-content{display:none;padding-top:14px;}
.expand-content.open{display:block;animation:fadeIn .25s ease;}
/* ---------- Searchable selector (city/locality) ---------- */
.selector-trigger{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;
  border:1.5px solid var(--line);border-radius:var(--radius-s);padding:14px 16px;background:var(--white);
  font-size:15.5px;color:var(--ink);text-align:left;
}
.selector-trigger svg{flex-shrink:0;color:var(--ink-faint);}
.selector-panel{
  border:1.5px solid var(--line);border-radius:var(--radius-m);margin-top:10px;background:var(--white);
  overflow:hidden;display:none;box-shadow:var(--shadow-soft);
}
.selector-panel.open{display:block;animation:fadeIn .2s ease;}
.selector-search{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line);}
.selector-search svg{width:16px;height:16px;color:var(--ink-faint);flex-shrink:0;}
.selector-search input{flex:1;border:none;background:transparent;font-size:14.5px;outline:none;color:var(--ink);}
.selector-list{max-height:260px;overflow-y:auto;padding:6px;}
.selector-option{
  display:flex;align-items:center;justify-content:space-between;width:100%;padding:11px 12px;
  border-radius:var(--radius-s);border:none;background:transparent;font-size:14.5px;color:var(--ink);text-align:left;
}
.selector-option:hover{background:var(--sand);}
.selector-option.selected{background:var(--pine-tint);color:var(--pine-deep);font-weight:600;}
.selector-option .check{width:15px;height:15px;color:var(--pine);visibility:hidden;}
.selector-option.selected .check{visibility:visible;}
.selector-section-label{font-size:11px;font-weight:600;color:var(--ink-faint);text-transform:uppercase;letter-spacing:0.05em;padding:8px 12px 4px;}
/* ---------- Map preview ---------- */
.map-preview{
  border-radius:var(--radius-l);overflow:hidden;position:relative;aspect-ratio:16/8;
  background:var(--pine-tint);border:1.5px solid var(--line);margin-top:14px;
}
@media (max-width:480px){.map-preview{aspect-ratio:4/3;}}
.map-preview svg.mapbg{width:100%;height:100%;display:block;}
.map-pin{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-100%);display:flex;flex-direction:column;align-items:center;
}
.map-pin-icon{
  width:38px;height:38px;border-radius:50% 50% 50% 0;background:var(--pine);transform:rotate(-45deg);
  display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-soft);
}
.map-pin-icon svg{transform:rotate(45deg);width:17px;height:17px;color:var(--white);}
.map-adjust-btn{
  position:absolute;bottom:12px;right:12px;background:var(--white);padding:11px 16px;border-radius:999px;
  font-size:13px;font-weight:600;box-shadow:var(--shadow-soft);border:none;display:flex;align-items:center;gap:7px;
  min-height:40px;
}
.map-adjust-btn svg{width:14px;height:14px;flex-shrink:0;}
@media (max-width:360px){.map-adjust-btn{padding:10px 13px;font-size:12px;}}
.location-preview-text{
  display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink-soft);margin-top:14px;
}
.location-preview-text svg{width:16px;height:16px;color:var(--pine);flex-shrink:0;}
/* ---------- Summary bar (step 1) ---------- */
.step-summary{
  margin-top:36px;padding:14px 18px;background:var(--sand);border-radius:var(--radius-m);
  font-size:14px;color:var(--ink-soft);font-weight:500;
}
.step-summary b{color:var(--ink);}
/* ---------- Price input ---------- */
.price-input-wrap{
  border:1.5px solid var(--line);border-radius:var(--radius-m);padding:20px 22px;background:var(--white);
}
.price-input-row{display:flex;align-items:baseline;gap:6px;}
.price-rupee{font-family:'Fraunces',serif;font-size:26px;font-weight:600;color:var(--ink-soft);flex-shrink:0;}
.price-input-row input{
  border:none;outline:none;font-family:'Fraunces',serif;font-size:34px;font-weight:600;color:var(--ink);
  background:transparent;width:100%;min-width:0;
}
@media (max-width:480px){
  .price-input-wrap{padding:18px 16px;}
  .price-input-row input{font-size:26px;}
  .price-rupee{font-size:22px;}
}
@media (max-width:340px){
  .price-input-row input{font-size:22px;}
}
.price-words{font-size:15px;color:var(--pine);font-weight:600;margin-top:6px;}
.price-persqft{
  display:flex;justify-content:space-between;align-items:center;margin-top:18px;padding-top:16px;border-top:1px solid var(--line);
  flex-wrap:wrap;gap:8px;
}
.price-persqft-val{font-family:'IBM Plex Mono',monospace;font-size:14.5px;color:var(--pine-deep);font-weight:500;}
.price-persqft-sub{font-size:12px;color:var(--ink-soft);margin-top:2px;}
.price-preview-card{
  background:var(--pine-tint);border-radius:var(--radius-m);padding:20px 22px;margin-top:16px;
}
@media (max-width:480px){.price-preview-card{padding:16px 18px;}}
.price-preview-amount{font-family:'Fraunces',serif;font-size:24px;font-weight:600;color:var(--pine-deep);}
@media (max-width:480px){.price-preview-amount{font-size:21px;}}
.price-preview-sub{font-size:13.5px;color:var(--ink-soft);margin-top:4px;display:flex;gap:10px;flex-wrap:wrap;}
/* ---------- Radio-style cards (brokerage / ownership etc.) ---------- */
.radio-cards{display:flex;flex-direction:column;gap:8px;}
.radio-card{
  display:flex;align-items:center;gap:12px;border:1.5px solid var(--line);border-radius:var(--radius-m);
  padding:14px 16px;background:var(--white);text-align:left;transition:all .15s ease;min-height:48px;width:100%;
}
.radio-card:hover{border-color:var(--ink-soft);}
.radio-card:active{transform:scale(0.99);}
.radio-card.selected{border-color:var(--pine);background:var(--pine-tint);}
.radio-dot{width:19px;height:19px;border-radius:999px;border:1.5px solid var(--line);flex-shrink:0;position:relative;}
.radio-card.selected .radio-dot{border-color:var(--pine);}
.radio-card.selected .radio-dot::after{content:'';position:absolute;inset:3px;border-radius:999px;background:var(--pine);}
.radio-card-label{font-size:14.5px;font-weight:600;}
/* ---------- Photo uploader ---------- */
.cover-upload{
  border:2px dashed var(--line);border-radius:var(--radius-l);padding:44px 24px;text-align:center;
  background:var(--white);transition:border-color .15s ease;
}
.cover-upload:hover{border-color:var(--pine);}
.cover-upload-icon{
  width:56px;height:56px;border-radius:999px;background:var(--pine-tint);color:var(--pine);
  display:flex;align-items:center;justify-content:center;margin:0 auto 16px;
}
.cover-upload-icon svg{width:24px;height:24px;}
.cover-upload h3{font-size:17px;font-weight:600;margin-bottom:6px;}
.cover-upload p{font-size:13.5px;color:var(--ink-soft);margin-bottom:18px;}
.cover-preview{position:relative;border-radius:var(--radius-l);overflow:hidden;aspect-ratio:16/10;box-shadow:var(--shadow-soft);}
.cover-preview .phototile{position:absolute;inset:0;}
.cover-preview-actions{position:absolute;bottom:14px;right:14px;display:flex;gap:8px;}
.cover-preview-actions button{
  background:rgba(255,255,255,0.95);padding:9px 15px;border-radius:999px;font-size:13px;font-weight:600;
  border:none;display:flex;align-items:center;gap:6px;box-shadow:var(--shadow-soft);
}
.cover-preview-actions svg{width:13px;height:13px;}
.gallery-uploader{margin-top:24px;}
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:14px;}
@media (max-width:640px){.gallery-grid{grid-template-columns:repeat(3,1fr);}}
@media (max-width:420px){.gallery-grid{grid-template-columns:repeat(2,1fr);}}
.gallery-item{
  position:relative;border-radius:var(--radius-s);overflow:hidden;aspect-ratio:1;cursor:grab;
}
.gallery-item .phototile{position:absolute;inset:0;}
.gallery-item-cover-badge{
  position:absolute;top:6px;left:6px;background:var(--pine);color:var(--white);font-size:10px;font-weight:700;
  padding:3px 8px;border-radius:999px;font-family:'IBM Plex Mono',monospace;letter-spacing:0.03em;
}
.gallery-item-remove{
  position:absolute;top:6px;right:6px;width:24px;height:24px;border-radius:999px;background:rgba(21,37,30,0.65);
  color:var(--white);border:none;display:flex;align-items:center;justify-content:center;
}
.gallery-item-remove svg{width:11px;height:11px;}
.gallery-item-setcover{
  position:absolute;bottom:6px;left:6px;right:6px;background:rgba(255,255,255,0.95);color:var(--ink);
  font-size:10.5px;font-weight:600;padding:5px 6px;border-radius:6px;border:none;opacity:0;transition:opacity .15s ease;
}
.gallery-item:hover .gallery-item-setcover{opacity:1;}
.gallery-add-tile{
  border:2px dashed var(--line);border-radius:var(--radius-s);aspect-ratio:1;background:var(--white);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--ink-soft);
}
.gallery-add-tile svg{width:20px;height:20px;}
.gallery-add-tile span{font-size:11px;font-weight:600;}
.gallery-count{font-size:12.5px;color:var(--ink-soft);margin-top:10px;}
.upload-progress-bar{height:4px;background:var(--sand);border-radius:999px;overflow:hidden;margin-top:10px;display:none;}
.upload-progress-bar.show{display:block;}
.upload-progress-fill{height:100%;width:0%;background:var(--pine);border-radius:999px;transition:width .4s ease;}
.photo-guidance{
  display:flex;gap:12px;background:var(--pine-tint);border-radius:var(--radius-m);padding:16px 18px;margin-top:20px;
}
.photo-guidance svg{width:18px;height:18px;color:var(--pine);flex-shrink:0;margin-top:1px;}
.photo-guidance-title{font-size:13.5px;font-weight:600;color:var(--pine-deep);margin-bottom:6px;}
.photo-guidance ul{margin:0;padding-left:16px;font-size:12.5px;color:var(--ink-soft);line-height:1.7;}
/* ---------- Floor plan uploader ---------- */
.floorplan-upload{
  border:2px dashed var(--line);border-radius:var(--radius-l);padding:32px 24px;text-align:center;
  background:var(--white);transition:border-color .15s ease;
}
.floorplan-upload:hover{border-color:var(--pine);}
.floorplan-upload-icon{
  width:48px;height:48px;border-radius:999px;background:var(--pine-tint);color:var(--pine);
  display:flex;align-items:center;justify-content:center;margin:0 auto 14px;
}
.floorplan-upload-icon svg{width:21px;height:21px;}
.floorplan-upload h3{font-size:15.5px;font-weight:600;margin-bottom:5px;}
.floorplan-upload p{font-size:13px;color:var(--ink-soft);margin-bottom:16px;}
.floorplan-preview{
  display:flex;align-items:center;gap:14px;border:1.5px solid var(--line);border-radius:var(--radius-m);
  padding:14px 16px;background:var(--white);flex-wrap:wrap;
}
.floorplan-preview-visual{
  width:56px;height:56px;border-radius:var(--radius-s);background:var(--pine-tint);color:var(--pine);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;
}
.floorplan-preview-visual svg{width:24px;height:24px;}
.floorplan-preview-info{flex:1;min-width:120px;}
.floorplan-preview-name{font-size:14px;font-weight:600;word-break:break-word;}
.floorplan-preview-meta{font-size:12.5px;color:var(--ink-soft);margin-top:2px;}
.floorplan-preview-actions{display:flex;gap:8px;flex-shrink:0;}
.floorplan-preview-actions button{
  background:var(--sand);padding:9px 14px;border-radius:999px;font-size:12.5px;font-weight:600;
  border:none;display:flex;align-items:center;gap:6px;color:var(--ink);
}
.floorplan-preview-actions svg{width:12px;height:12px;}
@media (max-width:480px){
  .floorplan-preview{padding:14px;}
  .floorplan-preview-actions{width:100%;}
  .floorplan-preview-actions button{flex:1;justify-content:center;}
}
/* ---------- Configuration cards (project types: repeatable BHK/plot configs) ---------- */
.config-list{display:flex;flex-direction:column;gap:10px;margin-bottom:14px;}
.config-card{
  border:1.5px solid var(--line);border-radius:var(--radius-m);padding:16px 18px;background:var(--white);
  display:flex;justify-content:space-between;align-items:flex-start;gap:12px;
}
.config-card-main{flex:1;min-width:0;}
.config-card-title{font-size:14.5px;font-weight:600;margin-bottom:4px;}
.config-card-sub{font-size:13px;color:var(--ink-soft);line-height:1.6;}
.config-card-remove{
  width:30px;height:30px;border-radius:999px;background:var(--sand);border:none;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;color:var(--ink-soft);
}
.config-card-remove svg{width:12px;height:12px;}
.config-add-btn{
  display:flex;align-items:center;justify-content:center;gap:8px;width:100%;
  border:1.5px dashed var(--line);border-radius:var(--radius-m);padding:13px;background:var(--white);
  font-size:14px;font-weight:600;color:var(--pine);min-height:48px;
}
.config-add-btn:hover{border-color:var(--pine);background:var(--pine-tint);}
.config-add-btn svg{width:15px;height:15px;}
@media (max-width:480px){
  .config-card{padding:14px;flex-wrap:wrap;}
}
/* ---------- Amenity grid ---------- */
.amenity-select-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
@media (max-width:640px){.amenity-select-grid{grid-template-columns:repeat(2,1fr);}}
.amenity-select-item{
  display:flex;align-items:center;gap:10px;border:1.5px solid var(--line);border-radius:var(--radius-m);
  padding:13px 14px;background:var(--white);transition:all .15s ease;
}
.amenity-select-item:hover{border-color:var(--ink-soft);}
.amenity-select-item.selected{border-color:var(--pine);background:var(--pine-tint);}
.amenity-select-checkbox{
  width:19px;height:19px;border-radius:5px;border:1.5px solid var(--line);flex-shrink:0;
  display:flex;align-items:center;justify-content:center;background:var(--white);
}
.amenity-select-item.selected .amenity-select-checkbox{background:var(--pine);border-color:var(--pine);}
.amenity-select-checkbox svg{width:11px;height:11px;color:var(--white);visibility:hidden;}
.amenity-select-item.selected .amenity-select-checkbox svg{visibility:visible;}
.amenity-select-label{font-size:13.5px;font-weight:600;}
/* ---------- Sticky nav actions ---------- */
.wizard-nav{
  display:flex;justify-content:space-between;align-items:center;margin-top:44px;padding-top:28px;border-top:1px solid var(--line);
}
@media (max-width:760px){.wizard-nav{display:none;}}
.mobile-nav{
  display:none;position:fixed;bottom:0;left:0;right:0;z-index:95;
  background:var(--white);border-top:1px solid var(--line);
  padding:12px 20px calc(12px + env(safe-area-inset-bottom));
  gap:10px;align-items:center;
  box-shadow:0 -4px 20px rgba(21,37,30,0.06);
}
@media (max-width:760px){.mobile-nav{display:flex;}}
.mobile-nav .btn-secondary{flex:0 0 auto;padding:14px 18px;}
.mobile-nav .btn-primary{flex:1;padding:14px 20px;}
/* ================= REVIEW STEP ================= */
.listing-preview-card{
  border:1px solid var(--line);border-radius:var(--radius-l);overflow:hidden;background:var(--white);box-shadow:var(--shadow-soft);
}
.lp-cover{position:relative;aspect-ratio:16/9;}
.lp-cover .phototile{position:absolute;inset:0;}
.lp-gallery-strip{display:flex;gap:6px;padding:8px;}
.lp-gallery-strip .phototile{border-radius:8px;aspect-ratio:1;flex:1;overflow:hidden;}
.lp-body{padding:22px;}
@media (max-width:480px){.lp-body{padding:18px;}}
.lp-price{font-family:'Fraunces',serif;font-size:24px;font-weight:600;color:var(--ink);}
.lp-title{font-size:16px;font-weight:600;margin-top:4px;}
.lp-loc{display:flex;align-items:center;gap:6px;font-size:13.5px;color:var(--ink-soft);margin-top:6px;}
.lp-loc svg{width:14px;height:14px;color:var(--pine);flex-shrink:0;}
.lp-specs{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;}
.lp-spec{
  font-size:12.5px;font-weight:600;color:var(--ink-soft);background:var(--sand);padding:6px 12px;border-radius:999px;
}
.lp-status-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;}
.lp-status{
  font-size:12px;font-weight:600;color:var(--pine-deep);background:var(--pine-tint);padding:6px 12px;border-radius:999px;
}
.lp-section-title{font-size:12.5px;font-weight:600;color:var(--ink-soft);text-transform:uppercase;letter-spacing:0.04em;margin:18px 0 8px;}
.lp-tags{display:flex;gap:6px;flex-wrap:wrap;}
.lp-tag{font-size:12px;color:var(--ink-soft);background:var(--paper);border:1px solid var(--line);padding:5px 11px;border-radius:999px;}
.lp-seller{display:flex;align-items:center;gap:10px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line);}
.lp-seller-avatar{
  width:38px;height:38px;border-radius:999px;background:var(--pine);color:var(--white);
  display:flex;align-items:center;justify-content:center;font-family:'Fraunces',serif;font-weight:600;font-size:15px;flex-shrink:0;
}
.lp-seller-name{font-size:13.5px;font-weight:600;}
.lp-seller-type{font-size:11.5px;color:var(--pine);font-weight:600;}
.lp-preview-btn{margin-top:18px;}
/* ---------- Review summary cards ---------- */
.review-sections{display:flex;flex-direction:column;gap:12px;margin-top:28px;}
.review-card{
  display:flex;justify-content:space-between;align-items:flex-start;gap:16px;
  border:1px solid var(--line);border-radius:var(--radius-m);padding:18px 20px;background:var(--white);
}
.review-card-title{font-size:14px;font-weight:600;color:var(--ink-soft);margin-bottom:8px;}
.review-card-lines{font-size:14.5px;color:var(--ink);line-height:1.65;}
.review-card-edit{
  font-size:13px;font-weight:600;color:var(--pine);background:none;border:none;flex-shrink:0;
  padding:6px 4px;
}
/* ---------- Quality indicator ---------- */
.quality-card{border:1px solid var(--line);border-radius:var(--radius-l);padding:24px;background:var(--white);margin-top:32px;}
@media (max-width:480px){.quality-card{padding:20px;}}
.quality-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
.quality-head h3{font-size:17px;font-weight:600;}
.quality-pct{font-family:'IBM Plex Mono',monospace;font-size:15px;font-weight:500;color:var(--pine);}
.quality-bar{height:7px;background:var(--sand);border-radius:999px;overflow:hidden;margin-bottom:16px;}
.quality-bar-fill{height:100%;background:var(--pine);border-radius:999px;width:90%;}
.quality-checklist{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px;}
.quality-check-item{
  display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--ink-soft);
  background:var(--pine-tint);padding:6px 12px;border-radius:999px;
}
.quality-check-item svg{width:12px;height:12px;color:var(--pine);}
.quality-suggestion{
  display:flex;gap:10px;font-size:13.5px;color:var(--ink-soft);background:var(--brass-tint);
  padding:12px 14px;border-radius:var(--radius-s);
}
.quality-suggestion svg{width:16px;height:16px;color:var(--brass);flex-shrink:0;margin-top:1px;}
/* ---------- Seller preview ---------- */
.seller-preview-card{
  display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid var(--line);
  border-radius:var(--radius-l);padding:20px 22px;background:var(--white);margin-top:20px;flex-wrap:wrap;
}
.seller-preview-left{display:flex;align-items:center;gap:14px;}
.seller-preview-avatar{
  width:48px;height:48px;border-radius:999px;background:var(--pine);color:var(--white);
  display:flex;align-items:center;justify-content:center;font-family:'Fraunces',serif;font-weight:600;font-size:18px;flex-shrink:0;
}
.seller-preview-name{font-size:15px;font-weight:600;}
.seller-preview-badge{font-size:12px;color:var(--pine);font-weight:600;display:flex;align-items:center;gap:4px;margin-top:2px;}
.seller-preview-badge svg{width:12px;height:12px;}
.seller-preview-response{font-size:12.5px;color:var(--ink-soft);margin-top:2px;}
/* ---------- Publish summary ---------- */
.publish-card{
  border:1.5px solid var(--pine);border-radius:var(--radius-l);padding:26px;background:var(--pine-tint);margin-top:32px;
}
@media (max-width:480px){.publish-card{padding:20px;}}
.publish-card h3{font-size:19px;font-weight:600;margin-bottom:16px;}
.publish-row{display:flex;justify-content:space-between;align-items:center;font-size:14.5px;margin-bottom:10px;}
.publish-includes{margin:14px 0 18px;padding:14px 16px;background:var(--white);border-radius:var(--radius-m);}
.publish-includes li{font-size:13.5px;color:var(--ink-soft);padding:4px 0;display:flex;gap:8px;align-items:flex-start;}
.publish-includes li svg{width:14px;height:14px;color:var(--pine);flex-shrink:0;margin-top:3px;}
.publish-includes ul{list-style:none;margin:0;padding:0;}
.publish-total{display:flex;justify-content:space-between;align-items:baseline;padding-top:14px;border-top:1px solid rgba(31,77,62,0.18);margin-bottom:18px;}
.publish-total b{font-family:'Fraunces',serif;font-size:22px;}
.publish-actions{display:flex;flex-direction:column;gap:10px;}
.publish-trust{font-size:12px;color:var(--ink-soft);text-align:center;margin-top:14px;}
/* ================= MODALS ================= */
.modal-overlay{
  position:fixed;inset:0;background:rgba(21,37,30,0.45);z-index:250;
  display:flex;align-items:flex-end;justify-content:center;
  opacity:0;pointer-events:none;transition:opacity .25s ease;padding:0;
}
@media (min-width:640px){.modal-overlay{align-items:center;padding:20px;}}
.modal-sheet{
  background:var(--white);width:100%;max-width:440px;border-radius:20px 20px 0 0;
  padding:28px 24px calc(24px + env(safe-area-inset-bottom));
  transform:translateY(40px);transition:transform .3s ease;max-height:88vh;overflow-y:auto;
}
@media (min-width:640px){.modal-sheet{border-radius:var(--radius-l);padding:30px;}}
@media (max-width:380px){.modal-sheet{padding:22px 18px calc(20px + env(safe-area-inset-bottom));}}
.modal-head h3{font-size:19px;font-weight:600;}
.modal-close{
  width:34px;height:34px;border-radius:999px;background:var(--sand);border:none;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;color:var(--ink);
}
.modal-close svg{width:14px;height:14px;}
.modal-body p{font-size:14.5px;color:var(--ink-soft);line-height:1.6;margin:0 0 20px;}
/* Payment modal specific */
.payment-line{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);font-size:15px;}
.payment-methods{display:flex;flex-direction:column;gap:8px;margin:16px 0 20px;}
.payment-method{
  display:flex;align-items:center;gap:12px;border:1.5px solid var(--line);border-radius:var(--radius-m);
  padding:13px 16px;background:var(--white);text-align:left;width:100%;min-height:48px;
}
.payment-method.selected{border-color:var(--pine);background:var(--pine-tint);}
.payment-method-icon{width:32px;height:32px;border-radius:8px;background:var(--sand);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--pine-deep);}
.payment-method-icon svg{width:16px;height:16px;}
.payment-method-name{font-size:14.5px;font-weight:600;}
.payment-processing{text-align:center;padding:30px 0;}
.payment-spinner{
  width:44px;height:44px;border-radius:999px;border:3px solid var(--sand);border-top-color:var(--pine);
  margin:0 auto 18px;animation:spin 0.8s linear infinite;
}
.payment-processing p{font-size:14.5px;color:var(--ink-soft);}
/* ================= SUCCESS SCREEN ================= */
.success-screen{padding:60px 0 90px;}
@media (max-width:640px){.success-screen{padding:36px 0 90px;}}
.success-inner{max-width:520px;margin:0 auto;text-align:center;}
.success-icon{
  width:68px;height:68px;border-radius:999px;background:var(--pine-tint);color:var(--pine);
  display:flex;align-items:center;justify-content:center;margin:0 auto 22px;
}
.success-icon svg{width:30px;height:30px;}
.success-inner h1{font-size:28px;font-weight:600;margin-bottom:10px;}
@media (max-width:480px){.success-inner h1{font-size:23px;}}
.success-inner > p{font-size:15px;color:var(--ink-soft);max-width:400px;margin:0 auto 32px;}
.workflow-track{display:flex;align-items:center;justify-content:center;gap:0;margin-bottom:32px;flex-wrap:wrap;}
.workflow-step{display:flex;flex-direction:column;align-items:center;gap:8px;width:120px;}
.workflow-dot{
  width:34px;height:34px;border-radius:999px;background:var(--sand);color:var(--ink-faint);
  display:flex;align-items:center;justify-content:center;border:2px solid var(--sand);
}
.workflow-dot svg{width:15px;height:15px;}
.workflow-step.complete .workflow-dot{background:var(--pine);border-color:var(--pine);color:var(--white);}
.workflow-step.current .workflow-dot{background:var(--white);border-color:var(--pine);color:var(--pine);}
.workflow-step span{font-size:12px;font-weight:600;color:var(--ink-soft);}
.workflow-step.current span{color:var(--pine);}
.workflow-connector{width:40px;height:2px;background:var(--sand);margin-bottom:26px;}
@media (max-width:480px){.workflow-connector{width:20px;}.workflow-step{width:90px;}}
.success-status-card{
  background:var(--pine-tint);border-radius:var(--radius-m);padding:16px 20px;margin-bottom:14px;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;
}
.success-status-label{font-size:13px;color:var(--pine-deep);font-weight:600;}
.success-status-val{font-size:13px;color:var(--ink-soft);}
.property-id-row{
  font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--ink-soft);margin-bottom:28px;
}
.success-actions{display:flex;flex-direction:column;gap:10px;max-width:320px;margin:0 auto;}
.success-actions .btn-ghost{margin-top:2px;}
/* Utility */
.hidden{display:none !important;}