/* =========================================================
   GANSELL 0.29/0.30 — shared form + mobile editor system
   One interaction language across merchant, customer and admin forms.
   ========================================================= */
:root{
  --gs-control-border:#dce2de;
  --gs-control-border-focus:#aebbb3;
  --gs-control-bg:#fff;
  --gs-control-text:#18201b;
  --gs-control-placeholder:#9aa29d;
  --gs-control-radius:11px;
  --gs-control-height:46px;
}

html,*{-webkit-tap-highlight-color:transparent}
button,a,input,select,textarea,summary,label,[role="button"],[tabindex]{-webkit-tap-highlight-color:transparent}
a:focus:not(:focus-visible),button:focus:not(:focus-visible),summary:focus:not(:focus-visible),[role="button"]:focus:not(:focus-visible),[tabindex]:focus:not(:focus-visible){outline:0!important;box-shadow:none!important}
input,select,textarea{caret-color:var(--gs-brand)}
input::placeholder,textarea::placeholder{color:var(--gs-control-placeholder)!important;opacity:1!important;font-weight:400!important;letter-spacing:0!important}

/* Touch/mobile focus should not paint a green halo or move the field. */
input:focus,select:focus,textarea:focus{
  outline:0!important;
  box-shadow:none!important;
  transform:none!important;
  border-color:var(--gs-control-border-focus)!important;
}
.search-box input:focus,
.gs-store-search input:focus,
.gs-market-search input:focus,
.gs-vendor-search input:focus{
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  transform:none!important;
}
.gs-store-search.is-searching{box-shadow:none!important;background:#fff!important}
.gs-store-search.is-searching label{box-shadow:none!important;border-color:#e0e5e2!important}

/* Keep a clear keyboard focus cue on desktop without affecting touch typing. */
@media (hover:hover) and (pointer:fine){
  input:focus-visible,select:focus-visible,textarea:focus-visible,
  button:focus-visible,a:focus-visible,summary:focus-visible{
    outline:2px solid rgba(22,166,106,.34)!important;
    outline-offset:2px!important;
  }
  .search-box input:focus-visible,.gs-store-search input:focus-visible,
  .gs-market-search input:focus-visible,.gs-vendor-search input:focus-visible{outline:0!important}
}

/* Do not inherit the heavy label weight into entered text. */
.wa-field input,.wa-field select,.wa-field textarea,
.wizard-step input,.wizard-step select,.wizard-step textarea,
.auth-card input,.auth-card select,.auth-card textarea,
.checkout-field input,.checkout-field select,.checkout-field textarea,
.merchant-settings-fields input,.merchant-settings-fields select,.merchant-settings-fields textarea,
.merchant-v10-pay-fields input,.merchant-v10-pay-fields select,.merchant-v10-pay-fields textarea,
.merchant-domain-form input,.merchant-domain-form select,.merchant-domain-form textarea,
.gs-marketing-form input,.gs-marketing-form select,.gs-marketing-form textarea,
.admin-shell-main input,.admin-shell-main select,.admin-shell-main textarea{
  font-family:inherit!important;
  font-weight:500!important;
  letter-spacing:0!important;
}

/* Product editor: simple, compact, sortable, safe above mobile browser chrome. */
.merchant-product-modal{
  width:min(620px,calc(100vw - 28px))!important;
  max-height:min(86dvh,780px)!important;
  overflow:hidden!important;
  display:flex;
  flex-direction:column;
}
.merchant-product-modal[hidden]{display:none!important}
.merchant-product-modal-body{
  width:100%;
  min-height:0!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding:12px 14px 0!important;
}
.merchant-product-editor-fragment{min-width:0}
.merchant-product-modal-head{
  position:sticky;
  top:-12px;
  z-index:12;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:0 -2px;
  padding:10px 2px 11px;
  background:rgba(255,255,255,.98);
  border-bottom:1px solid #edf0ee;
}
.merchant-product-modal-head small{font-size:7px!important;letter-spacing:.12em!important;color:#919a94!important}
.merchant-product-modal-head h2{font-size:19px!important;line-height:1.1!important;letter-spacing:-.025em!important;margin:2px 0 0!important}
.merchant-product-modal-close{width:36px!important;height:36px!important;min-width:36px!important;background:#f2f4f2!important;color:#253029!important;box-shadow:none!important}

.merchant-product-modal .wa-photo-section,
.merchant-product-modal .wa-fields-section{
  padding:11px 0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:#fff!important;
  box-shadow:none!important;
}
.merchant-product-modal .wa-fields-section{border-top:1px solid #edf0ee!important}
.wa-row-head{margin-bottom:9px!important;gap:10px!important}
.wa-row-head strong{font-size:14px!important;line-height:1.2!important}
.wa-row-head small{font-size:9px!important;line-height:1.35!important;color:#858e88!important}
.wa-row-head>span{padding:4px 7px!important;font-size:8px!important;background:#f1f3f1!important}

.wa-photo-strip{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important;
  overflow:visible!important;
  align-items:stretch!important;
  padding:0!important;
}
.wa-photo-slot,.wa-photo-add{
  width:100%!important;
  min-width:0!important;
  height:auto!important;
  aspect-ratio:1/1!important;
  border-radius:11px!important;
}
.wa-photo-slot{
  border:1px solid #e0e5e1!important;
  background:#f5f7f5!important;
  cursor:grab;
  touch-action:pan-y;
  user-select:none;
  -webkit-user-select:none;
}
.wa-photo-slot:active,.wa-photo-slot.is-sorting{cursor:grabbing}
.wa-photo-slot.is-sorting{opacity:.76!important;transform:scale(.97)!important;outline:2px solid rgba(22,166,106,.24)!important;outline-offset:1px}
.wa-photo-slot img{width:100%!important;height:100%!important;object-fit:contain!important;background:#f7f8f7!important;padding:2px!important;pointer-events:none!important}
.wa-photo-add{border:1px dashed #cbd4ce!important;background:#fafbfa!important;color:#657069!important;gap:4px!important}
.wa-photo-add>span{width:31px!important;height:31px!important;border-radius:10px!important;box-shadow:none!important}
.wa-photo-add>b{font-size:9px!important}
.wa-drag-photo,.wa-remove-photo{
  width:27px!important;height:27px!important;min-width:27px!important;min-height:27px!important;
  top:5px!important;border-radius:999px!important;box-shadow:none!important
}
.wa-drag-photo{left:5px!important;background:rgba(255,255,255,.92)!important;color:#5e6862!important;font-size:13px!important}
.wa-remove-photo{right:5px!important;background:rgba(22,27,24,.72)!important;color:#fff!important;font-size:16px!important}
.wa-cover-tag{left:5px!important;bottom:5px!important;padding:3px 5px!important;border-radius:5px!important;font-size:6.5px!important}
.wa-photo-size{right:5px!important;bottom:5px!important;padding:3px 5px!important;font-size:6px!important}
.wa-photo-note{margin:7px 0 0!important;font-size:8px!important;color:#929a95!important}

.wa-background-choice{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:8px!important;
  margin-top:8px!important;
  padding:8px 9px!important;
  border:0!important;
  border-radius:10px!important;
  background:#f5f8f6!important;
}
.wa-background-choice strong{font-size:10px!important}
.wa-background-choice small{font-size:8px!important;line-height:1.3!important;color:#7d8781!important}
.wa-background-choice>div:last-child{display:flex!important;gap:5px!important;width:auto!important}
.wa-background-choice button{min-height:32px!important;padding:0 8px!important;border-radius:8px!important;font-size:8px!important;white-space:nowrap!important}

.wa-fields-section{gap:10px!important}
.wa-field{gap:5px!important;font-size:11px!important;font-weight:750!important;color:#333b36!important}
.wa-field input,.wa-field select,.wa-field textarea{
  min-height:46px!important;
  margin:0!important;
  border:1px solid var(--gs-control-border)!important;
  border-radius:10px!important;
  padding:10px 11px!important;
  background:#fff!important;
  color:var(--gs-control-text)!important;
  font-size:16px!important;
  font-weight:500!important;
  line-height:1.25!important;
}
.wa-field textarea{min-height:72px!important;resize:vertical!important}
.wa-product-editor .money-input>span{left:12px!important;top:50%!important;margin:0!important;font-size:14px!important;font-weight:700!important;color:#5c665f!important}
.wa-product-editor .money-input input{padding-left:38px!important}
.wa-publish-row{
  padding-top:10px!important;
  gap:9px!important;
  align-items:center!important;
  flex-direction:row!important;
}
.wa-publish-row strong{font-size:10px!important}.wa-publish-row small{font-size:7.5px!important}
.wa-live-switch{width:142px!important;border-radius:9px!important;padding:2px!important;background:#f0f2f0!important}
.wa-live-switch span{min-height:32px!important;border-radius:7px!important;font-size:9px!important}
.wa-live-switch input:checked+span{box-shadow:none!important}
.wa-more{margin-top:0!important}
.wa-more summary{padding-top:10px!important;font-size:10px!important}
.wa-more summary small{font-size:7.5px!important}
.wa-more-body{gap:10px!important;padding-top:10px!important}
.wa-feature-switch{gap:9px!important;padding:4px 0!important}
.wa-feature-switch>span{width:34px!important;height:20px!important}.wa-feature-switch>span:after{width:14px!important;height:14px!important}.wa-feature-switch>input:checked+span:after{left:17px!important}
.wa-feature-switch strong{font-size:10px!important}.wa-feature-switch small{font-size:8px!important}

.merchant-product-modal .wa-submit-bar{
  position:sticky!important;
  bottom:0!important;
  width:auto!important;
  max-width:none!important;
  margin:0 -14px!important;
  padding:9px 14px calc(9px + env(safe-area-inset-bottom))!important;
  border:0!important;
  border-top:1px solid #e8ece9!important;
  border-radius:0!important;
  background:rgba(255,255,255,.98)!important;
  box-shadow:0 -8px 20px rgba(19,38,27,.05)!important;
  backdrop-filter:blur(12px)!important;
  z-index:20!important;
}
.merchant-product-modal .wa-submit-bar .publish-btn{
  min-height:44px!important;
  flex:1 1 auto!important;
  min-width:0!important;
  border-radius:10px!important;
  box-shadow:none!important;
  font-size:12px!important;
  font-weight:800!important;
  margin:0!important;
}
.merchant-product-modal .merchant-modal-cancel{min-height:44px!important;font-size:10px!important}

/* Registration/onboarding: two short steps, form-first on mobile. */
.onboard-v30 .onboard-form-wrap{align-self:start}
.onboard-v30 .wizard-step{gap:11px!important}
.onboard-v30 .wizard-step h2{font-size:21px!important;margin:0!important}
.onboard-v30 .wizard-step>p{font-size:10px!important;margin:-1px 0 2px!important}
.onboard-v30 .wizard-step>label{font-size:11px!important;font-weight:750!important;color:#333b36!important}
.onboard-v30 .wizard-step input,.onboard-v30 .wizard-step select{
  min-height:46px!important;
  margin-top:5px!important;
  border-radius:10px!important;
  padding:9px 11px!important;
  font-size:16px!important;
  font-weight:500!important;
}
.onboard-v30 .wizard-step .primary-btn{min-height:46px!important;border-radius:10px!important;box-shadow:none!important;font-size:12px!important;margin-top:2px!important}
.onboard-v30 .phone-field{margin-top:5px!important;border-radius:10px!important;min-height:46px!important}
.onboard-v30 .phone-field input{margin-top:0!important}
.onboard-v30 .password-field input{margin-top:5px!important;padding-right:58px!important}
.onboard-v30 .password-field button{font-size:9px!important;font-weight:750!important;right:7px!important;bottom:7px!important;min-height:32px!important}
.onboard-v30 .slug-preview{font-size:8px!important;margin-top:4px!important}
.onboard-v30 .progress-line{margin-bottom:10px!important}.onboard-v30 .wizard-meta{margin-bottom:13px!important}

/* Customer storefront: keep the desktop catalogue operational rather than billboard-sized. */
@media(min-width:761px){
  .gs-store-shell{width:min(1240px,100%)!important}
  .gs-store-search{max-width:1040px!important;margin-left:auto!important;margin-right:auto!important}
  .gs-product-section{max-width:1240px!important;margin:0 auto!important}
}

/* General mobile form density. 16px controls prevent iOS auto-zoom. */
@media(max-width:760px){
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=hidden]),select,textarea{font-size:16px}
  .merchant-product-modal{
    left:0!important;right:0!important;top:auto!important;bottom:0!important;
    width:100%!important;
    height:auto!important;
    max-height:88dvh!important;
    border-radius:16px 16px 0 0!important;
    transform:translateY(104%)!important;
    box-shadow:0 -16px 50px rgba(10,26,17,.18)!important;
  }
  .merchant-product-modal.open{transform:none!important}
  .merchant-product-modal-body{padding:8px 12px 0!important}
  .merchant-product-modal-head{top:-8px!important;margin:0!important;padding:8px 0 10px!important}
  .merchant-product-modal-head h2{font-size:17px!important}
  .merchant-product-modal-close{width:34px!important;height:34px!important;min-width:34px!important}
  .merchant-product-modal .wa-photo-section,.merchant-product-modal .wa-fields-section{padding:9px 0!important}
  .wa-row-head strong{font-size:13px!important}.wa-row-head small{font-size:8px!important}
  .wa-photo-strip{gap:7px!important}
  .wa-background-choice{grid-template-columns:minmax(0,1fr) auto!important;padding:7px 8px!important}
  .wa-background-choice small{display:none!important}
  .wa-background-choice button{padding:0 7px!important;font-size:7.5px!important}
  .wa-photo-note{display:none!important}
  .wa-publish-row{align-items:center!important;flex-direction:row!important}
  .merchant-product-modal .merchant-modal-cancel{display:none!important}
  .merchant-product-modal .wa-submit-bar{margin:0 -12px!important;padding:8px 12px calc(10px + env(safe-area-inset-bottom))!important}
  .merchant-product-modal .wa-submit-bar .publish-btn{width:100%!important;min-height:46px!important}

  .onboard-v30{padding-bottom:calc(24px + env(safe-area-inset-bottom))!important}
  .onboard-v30 .onboard-nav{height:58px!important}
  .onboard-v30 .onboard-layout{max-width:460px!important}
  .onboard-v30 .onboard-form-wrap{padding:14px 4px 22px!important}
  .onboard-v30 .onboard-card-intro{margin-bottom:11px!important}
  .onboard-v30 .onboard-card-intro>strong{font-size:18px!important}
  .onboard-v30 .onboard-card-intro>small{font-size:9px!important}
  .onboard-v30 .wizard-step{gap:10px!important}
  .onboard-v30 .wizard-step h2{font-size:20px!important}
  .onboard-v30 .wizard-step>p{font-size:9.5px!important}

  .checkout-field,.merchant-settings-fields label,.merchant-v10-pay-fields label,.merchant-domain-form label{font-size:11px!important}
  .checkout-field input,.checkout-field select,.checkout-field textarea,
  .merchant-settings-fields input,.merchant-settings-fields select,.merchant-settings-fields textarea,
  .merchant-v10-pay-fields input,.merchant-v10-pay-fields select,.merchant-v10-pay-fields textarea,
  .merchant-domain-form input,.merchant-domain-form select,.merchant-domain-form textarea{
    min-height:46px!important;
    border-radius:10px!important;
    font-size:16px!important;
    font-weight:500!important;
  }
}

@media(max-width:360px){
  .wa-background-choice{display:block!important}
  .wa-background-choice>div:last-child{margin-top:7px!important;width:100%!important}
  .wa-background-choice button{flex:1!important}
}

@media(min-width:761px){
  .wa-photo-strip{grid-template-columns:repeat(3,96px)!important;justify-content:start!important}
  .wa-photo-slot,.wa-photo-add{width:96px!important;height:96px!important;aspect-ratio:auto!important}
}
.merchant-product-modal .publish-btn[disabled]{opacity:.68!important}
.merchant-product-editor-fragment:not(.is-modal) .wa-submit-bar{bottom:max(8px,env(safe-area-inset-bottom))!important}
.merchant-product-modal .wa-submit-bar{
  left:auto!important;
  right:auto!important;
  transform:none!important;
}

/* 0.30 consistency pass: every text control uses the same readable weight. */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
select,textarea{
  font-family:inherit!important;
  font-weight:500!important;
  letter-spacing:0!important;
}
.phone-field:focus-within,.password-field:focus-within{
  border-color:var(--gs-control-border-focus)!important;
  box-shadow:none!important;
  transform:none!important;
}
@media(max-width:760px){
  input:focus-visible,select:focus-visible,textarea:focus-visible,
  .phone-field:focus-within,.password-field:focus-within{
    outline:0!important;
    box-shadow:none!important;
  }
}

/* Share + tap polish queued after 0.30: clean touch state, standard share symbol. */
.sheet-share-btn{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important}
.sheet-share-btn .gs-icon{flex:none}

/* Sprint 0.35–0.36: OTP, verification and restrained interaction feedback */
.otp-card{max-width:520px}
.otp-card strong{color:#111827}
.otp-input{font-variant-numeric:tabular-nums;letter-spacing:.42em;text-align:center;font-size:1.45rem!important;font-weight:750!important;padding-left:1.15em!important}
.otp-resend{display:flex;justify-content:center;margin-top:12px}
.text-button{appearance:none;border:0;background:transparent;color:#087c59;font:inherit;font-weight:700;padding:10px 14px;cursor:pointer}
.text-button.muted{color:#737b78;font-weight:600}

@media (prefers-reduced-motion:no-preference){
  button,a,[role="button"],.product-card,.vendor-card{transition:transform .13s ease,box-shadow .16s ease,opacity .16s ease}
  button:active,a:active,[role="button"]:active{transform:scale(.985)}
  .success-check{animation:gansell-confirm-pop .34s cubic-bezier(.2,.8,.2,1)}
  @keyframes gansell-confirm-pop{0%{transform:scale(.78);opacity:.45}65%{transform:scale(1.08)}100%{transform:scale(1);opacity:1}}
}
@media (prefers-reduced-motion:reduce){button,a,[role="button"],.product-card,.vendor-card{transition:none!important;animation:none!important}}
