/* LANEB-337 (2026-09-26): seller-experience layer for camerasellonline.com (journey strip, step hints, selected states,
   solid bottom button bar on the quote steps, OTP step, quote screen, booking form, thank-you). Loaded after green336.css from
   common/lb337.php (one line in common/header.php). Kill switch: create the file lb337.off in the private dir. Developer files
   untouched except three one-line hooks. Colours fall back to the LANEB-336 green palette when that layer is off. */
:root{--lb337-brand:var(--g336-brand,#0F5132);--lb337-dark:var(--g336-brand-dark,#0B3D2E);--lb337-hover:var(--g336-brand-hover,#166B44);--lb337-mint:var(--g336-mint,#E9F4EE);--lb337-mint2:var(--g336-mint-2,#D4E9DC);--lb337-ink:var(--g336-ink,#14201A);--lb337-muted:var(--g336-muted,#4F5F57);--lb337-line:var(--g336-line,#D6E3DB);--lb337-wa:var(--g336-wa,#128C4A);--lb337-r:var(--g336-radius,14px);--lb337-shadow:var(--g336-shadow-sm,0 2px 10px rgba(15,81,50,.08))}
.lb337-hidden{display:none !important}
/* journey strip: Camera > Questions > Verify > Price > Pickup */
.lb337-journey{list-style:none;display:flex;gap:4px;height:56px;box-sizing:border-box;margin:0 auto;padding:10px 12px 0;max-width:1140px;counter-reset:lb337;overflow:hidden;background:transparent}
.lb337-journey li{flex:1;position:relative;text-align:center;font-size:12px;font-weight:700;color:var(--lb337-muted);padding-top:6px;letter-spacing:.01em;white-space:nowrap}
.lb337-journey li::before{content:"";display:block;height:6px;border-radius:3px;background:var(--lb337-mint2);margin-bottom:6px}
.lb337-journey li.is-done::before,.lb337-journey li.is-current::before{background:var(--lb337-brand)}
.lb337-journey li.is-current{color:var(--lb337-dark)}
.lb337-journey li.is-done{color:var(--lb337-brand)}
/* model page: what happens next */
.lb337-next{margin:14px 0 6px;padding:12px 14px;border:1px solid var(--lb337-line);border-radius:var(--lb337-r);background:#fff;font-size:14px;color:var(--lb337-ink);line-height:1.5;box-shadow:var(--lb337-shadow)}
.lb337-next strong{color:var(--lb337-dark)}
/* quote steps (lens.php) */
.lb337-hint{margin:-6px 0 14px;font-size:14.5px;color:var(--lb337-muted);line-height:1.5}
.lb337-hint b{color:var(--lb337-dark);font-weight:700}
.lb337-cond{font-size:14px;color:var(--lb337-ink);margin:2px 0 8px;line-height:1.45}
.form-step .idCondition .card{height:auto !important;min-height:0}
.form-step .idCondition .card-body{height:auto !important;padding:14px 14px 10px}
.form-step .idCondition .card-title{font-size:18px;margin-bottom:4px}
.form-step .idCondition ol.ol{font-size:13px;color:var(--lb337-muted);padding-left:18px;margin:0}
.lb337-picked{border:2px solid var(--lb337-brand) !important;background:var(--lb337-mint) !important;box-shadow:none !important;position:relative}
.lb337-picked::after{content:"";position:absolute;top:8px;right:8px;width:24px;height:24px;border-radius:50%;background:var(--lb337-brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/16px no-repeat;z-index:2}
.idCondition.lb337-picked{border:0 !important;background:transparent !important}
.idCondition.lb337-picked::after{display:none}
.idCondition.lb337-picked .card{border:2px solid var(--lb337-brand) !important;background:var(--lb337-mint) !important}
/* solid bottom button bar on the steps (was a translucent sticky box floating over the cards) */
.form-step .btn-container{position:sticky;bottom:0;left:0;right:0;z-index:20;background:#fff;border-top:1px solid var(--lb337-line);box-shadow:0 -4px 16px rgba(0,0,0,.08);padding:10px 12px !important;margin:12px 0 0;max-width:none;width:100%}
.form-step .btn-container .d-flex{margin:0 !important;gap:10px}
.form-step .btn-container .btn{margin:0 !important;min-height:48px;flex:1 1 0;max-width:320px}
.form-step .btn-container .btn[onclick*="prevStep"]{flex:0 0 auto;min-width:110px;background:#fff !important;color:var(--lb337-dark) !important;border:1.5px solid var(--lb337-line) !important}
.form-step > .container.py-5:first-child{padding-bottom:8px !important}
@media (max-width:767.98px){
  body.lb102-has-bar .form-step .btn-container{bottom:calc(68px + env(safe-area-inset-bottom,0px))}
  .form-step .btn-container .btn{max-width:none}
  .lb337-journey{gap:3px;padding:0 8px}
  .lb337-journey li{font-size:11px}
}
/* OTP step (price.php) */
.lb337-sum{display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center;margin:0 0 16px;padding:10px 12px;border:1px solid var(--lb337-line);border-radius:12px;background:var(--lb337-mint);font-size:14px;color:var(--lb337-ink)}
.lb337-sum b{font-size:15px;color:var(--lb337-dark)}
.lb337-sum span::before{content:"\00B7";margin:0 2px 0 0;color:var(--lb337-muted)}
.lb337-sum b::before{content:none}
.lb337-h1{font-size:26px;font-weight:800;line-height:1.2;margin:0 0 8px;color:var(--lb337-ink)}
.lb337-why{font-size:15px;color:var(--lb337-muted);margin:0 0 16px;line-height:1.5}
.lb337-label{display:block;font-size:13.5px;font-weight:700;color:var(--lb337-dark);margin:0 0 4px}
.lb337-optional{font-weight:500;color:var(--lb337-muted)}
.lb337-link{background:none;border:0;padding:6px 0;color:var(--lb337-brand);font-weight:700;font-size:14px;text-decoration:underline;cursor:pointer;min-height:36px}
.lb337-link[disabled]{color:var(--lb337-muted);text-decoration:none;cursor:default}
#idForm #otpSendbutton,#idForm #submitOtp{width:100%;max-width:420px;min-height:52px;font-size:17px;background:var(--lb337-brand) !important;border-color:var(--lb337-brand) !important;color:#fff !important;border-radius:12px}
#idForm #otpSendbutton:hover,#idForm #submitOtp:hover{background:var(--lb337-hover) !important}
#idForm .form-control{border-radius:12px;border:1.5px solid var(--lb337-line)}
#idForm .form-control:focus{border-color:var(--lb337-brand);box-shadow:0 0 0 3px var(--lb337-mint2)}
#idForm #phone,#idForm #lb337_city{font-size:18px}
#otpbox .display-5{font-size:24px !important;font-weight:800 !important}
#otpbox .lead{font-size:15px !important;color:var(--lb337-muted)}
#otpField{max-width:220px;letter-spacing:.4em;font-size:24px;font-weight:700;text-align:center}
.lb337-otp-meta{display:flex;flex-wrap:wrap;gap:4px 18px;align-items:center;font-size:14px;color:var(--lb337-muted);margin:6px 0 10px}
.lb337-fallback{margin:14px 0 0;padding:12px 14px;border-radius:12px;background:#FFF8E6;border:1px solid #F1E0A6;font-size:14px;color:#5B4A0E;line-height:1.5}
.lb337-fallback a{color:var(--lb337-dark);font-weight:700}
.lb337-tel-help{font-size:13px;color:var(--lb337-muted);margin:4px 0 0}
input.lb337-invalid{border-color:#c0392b !important}
.lb337-err{color:#b03a2e;font-size:13.5px;margin:4px 0 0;font-weight:600}
/* quote screen (price-page.php) */
.lb337-price{font-size:34px !important;font-weight:800 !important;color:var(--lb337-dark) !important;letter-spacing:-.02em}
.lb337-card{margin:14px 0;padding:16px;border:1px solid var(--lb337-line);border-radius:var(--lb337-r);background:#fff;box-shadow:var(--lb337-shadow)}
.lb337-card h3{font-size:17px;font-weight:800;margin:0 0 10px;color:var(--lb337-ink)}
.lb337-card ul{list-style:none;margin:0;padding:0}
.lb337-card ul li{display:flex;gap:10px;padding:6px 0;font-size:15px;line-height:1.45;color:var(--lb337-ink);border-bottom:1px dashed var(--lb337-line)}
.lb337-card ul li:last-child{border-bottom:0}
.lb337-card ul li span:first-child{flex:0 0 118px;color:var(--lb337-muted);font-size:13.5px;padding-top:2px}
.lb337-note{font-size:13.5px;color:var(--lb337-muted);margin:10px 0 0;line-height:1.5}
.lb337-timeline{counter-reset:lb337t;list-style:none;margin:0;padding:0}
.lb337-timeline li{position:relative;padding:0 0 12px 40px;font-size:15px;line-height:1.45;color:var(--lb337-ink)}
.lb337-timeline li::before{counter-increment:lb337t;content:counter(lb337t);position:absolute;left:0;top:0;width:28px;height:28px;border-radius:50%;background:var(--lb337-mint);color:var(--lb337-brand);font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center}
.lb337-timeline li strong{display:block;color:var(--lb337-dark)}
.lb337-ctas{display:flex;flex-direction:column;gap:10px;margin:14px 0 6px;max-width:520px}
.lb337-ctas a,.lb337-ctas button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;border-radius:12px;font-weight:700;font-size:16px;text-decoration:none;padding:0 18px;border:0;cursor:pointer}
.lb337-ctas .lb337-wa{background:var(--lb337-wa);color:#fff !important}
.lb337-ctas .lb337-call{background:#fff;color:var(--lb337-dark) !important;border:1.5px solid var(--lb337-line)}
.lb337-ctas svg{width:20px;height:20px;flex:none}
.product-list-body .lb337-model{font-size:14px;color:var(--lb337-muted);margin:2px 0 0}
form[action="submitExquiry.php"] .btn-success{width:100%;max-width:520px;min-height:54px;font-size:17px;border-radius:12px;background:var(--lb337-brand) !important;border-color:var(--lb337-brand) !important}
.works a[href="listing-detail.html"]{pointer-events:none}
/* booking form (submitExquiry.php) */
.lb337-book-intro{margin:4px 0 14px;padding:12px 14px;border-radius:12px;background:var(--lb337-mint);border:1px solid var(--lb337-line);font-size:15px;color:var(--lb337-ink)}
.lb337-book-intro b{color:var(--lb337-dark)}
#idForm input[name="pincode"],#idForm input[name="mobile"],#idForm input[name="alternateMobile"]{font-size:17px}
.lb337-date-help{font-size:13.5px;color:var(--lb337-muted);margin:-6px 0 12px}
#idForm .btn-success.btn-lg{width:100%;max-width:520px;min-height:54px;font-size:17px;border-radius:12px;background:var(--lb337-brand) !important;border-color:var(--lb337-brand) !important}
/* thank-you */
.lb337-thanks{max-width:560px;margin:18px auto 0;text-align:left}
.lb337-thanks .lb337-card{margin:0 0 14px}
.lb337-thanks .lb337-ctas{margin:0 auto;max-width:none}
@media (min-width:768px){.lb337-ctas{flex-direction:row;flex-wrap:wrap}.lb337-ctas a,.lb337-ctas button{flex:1 1 200px}}
@media (prefers-reduced-motion:reduce){.lb337-picked,.form-step .btn-container{transition:none}}
/* desktop: the site's fixed Call/WhatsApp icons sit at the right edge - keep the sidebar booking button clear of them */
@media (min-width:992px){form[action="submitExquiry.php"]{padding-right:72px}}
/* LANEB-338 loop 1: home model search + trust line (facts only) */
.lb337-search{max-width:720px;margin:0 auto 14px;position:relative;text-align:left}
.lb337-search .form-control{min-height:52px;font-size:17px;border-radius:14px;border:1.5px solid var(--lb337-line);padding-left:16px;background:#fff}
.lb337-search .form-control:focus{border-color:var(--lb337-brand);box-shadow:0 0 0 3px var(--lb337-mint2)}
.lb337-search-help{font-size:13px;color:var(--lb337-muted);margin:6px 0 0}
.lb337-results{list-style:none;margin:4px 0 0;padding:6px;position:absolute;left:0;right:0;z-index:30;background:#fff;border:1px solid var(--lb337-line);border-radius:14px;box-shadow:0 10px 30px rgba(15,81,50,.14);max-height:360px;overflow:auto}
.lb337-results li a{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:46px;padding:8px 12px;border-radius:10px;color:var(--lb337-ink);text-decoration:none;font-weight:600;font-size:15px}
.lb337-results li a:hover,.lb337-results li a:focus{background:var(--lb337-mint);color:var(--lb337-dark)}
.lb337-results li a svg{width:18px;height:18px;flex:none;color:var(--lb337-brand)}
.lb337-results .lb337-nohit{padding:10px 12px;font-size:14px;color:var(--lb337-muted)}
.lb337-results .lb337-nohit a{color:var(--lb337-dark);font-weight:700}
.lb337-trust{display:flex;flex-wrap:wrap;gap:6px 14px;margin:14px 0 0;padding:0;font-size:13px;color:var(--lb337-muted);line-height:1.4}
.lb337-trust span{display:inline-flex;align-items:center;gap:6px}
.lb337-trust span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--lb337-brand);flex:none}
