/* SwissArtGallery — mobile seller excellence / Safari compatibility — 25 Oct 2026 */
/* Legacy Safari fallback: never depend on :has() to display the ivory login screen. */
body.sag-client-page:not(.sag-client-space){
  --bg:#faf7f0;--panel:#fffdf8;--line:#ded2bf;--ink:#3c3429;--muted:#736655;
  --gold:#987342;--green:#557257;
  color-scheme:light!important;
  color:#3c3429!important;
  background:radial-gradient(ellipse at 14% 5%,rgba(227,202,155,.2),transparent 58%),#faf7f0!important
}
body.sag-client-page:not(.sag-client-space) .client-header{
  background:#fffdf8!important;border-bottom:1px solid #e2d4bb!important;color:#4f3d27!important
}
body.sag-client-page:not(.sag-client-space) .wordmark,
body.sag-client-page:not(.sag-client-space) .client-header a,
body.sag-client-page:not(.sag-client-space) #auth-view h1,
body.sag-client-page:not(.sag-client-space) #auth-view h2,
body.sag-client-page:not(.sag-client-space) #auth-view h3{color:#604323!important}
body.sag-client-page:not(.sag-client-space) #auth-view .auth-intro,
body.sag-client-page:not(.sag-client-space) #auth-view .auth-intro p{color:#5e4c37!important}
body.sag-client-page:not(.sag-client-space) #auth-view .eyebrow{color:#85632c!important}
body.sag-client-page:not(.sag-client-space) #auth-view .lead{color:#615446!important}
body.sag-client-page:not(.sag-client-space) #auth-view .offer-pair article{
  background:linear-gradient(140deg,#fffefa,#faf2e6)!important;border:1px solid #ddcaa9!important;
  box-shadow:0 8px 24px rgba(115,82,35,.08)!important;color:#473a2c!important
}
body.sag-client-page:not(.sag-client-space) #auth-view .offer-pair article p,
body.sag-client-page:not(.sag-client-space) #auth-view .offer-pair article .mini{color:#6b5d4b!important}
body.sag-client-page:not(.sag-client-space) #auth-view .offer-number{color:#936a2d!important}
body.sag-client-page:not(.sag-client-space) .client-footer{background:#faf7f0;color:#695c4c;border-color:#dfd2bd}
body.sag-client-page:not(.sag-client-space) .client-footer a{color:#745024}

/* Native dialog is absent in Safari 14: it must not appear on login. */
body.sag-client-page dialog#listing-preview:not([open]){display:none!important}
body.sag-client-page.sag-dialog-legacy #listing-preview[open]{
 display:block;position:fixed;inset:4vh auto auto 50%;
 transform:translateX(-50%);box-sizing:border-box;z-index:2147483400;
 width:min(1080px,calc(100vw - 28px));max-height:90vh;max-height:90dvh;
 overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
 background:#fffdf8;color:#40352a;border:1px solid #d4b787;border-radius:14px;
 box-shadow:0 22px 72px rgba(47,31,17,.28);padding:clamp(13px,2vw,28px);
}
body.sag-client-page #listing-preview[open]{max-width:calc(100vw - 20px);max-height:90vh;overflow:auto;box-sizing:border-box;background:#fffdf8;color:#40352a}
body.sag-client-page #listing-preview[open] .preview-topbar{
 background:#fffdf8!important;color:#40352a!important;
 position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;
 flex-wrap:wrap;gap:9px;border-bottom:1px solid #eadcc4;padding:9px 0 12px;margin-bottom:18px
}
body.sag-client-page #listing-preview[open] .preview-topbar .eyebrow{color:#86602c!important}
body.sag-client-page #listing-preview[open] #close-preview{min-height:44px;min-width:44px;white-space:normal}
body.sag-client-page .sag-preview-backdrop-legacy{
 position:fixed;inset:0;z-index:2147483300;background:rgba(48,34,20,.55);
 -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)
}
body.sag-client-page.sag-preview-modal-open{overflow:hidden!important}
/* Mobile form, explicit stable class rather than unsupported :has selectors. */
@media(max-width:760px){
 body.sag-client-page{overflow-x:clip;overflow-x:hidden}
 body.sag-client-page .client-shell{width:calc(100% - 24px);max-width:100%;padding-top:18px;padding-bottom:calc(54px + env(safe-area-inset-bottom,0px));margin-inline:auto}
 body.sag-client-page .client-header{padding:13px 12px!important;gap:10px!important;max-width:100%;flex-wrap:wrap}
 body.sag-client-page .client-header .wordmark{min-width:0;overflow-wrap:anywhere}
 body.sag-client-page .client-header nav{max-width:100%;min-width:0;flex-wrap:wrap;gap:9px 13px}
 body.sag-client-page #auth-view{grid-template-columns:minmax(0,1fr);gap:18px;max-width:100%}
 body.sag-client-page #auth-view .auth-card{order:-1;min-width:0;padding:22px 16px;margin:0;border-radius:13px}
 body.sag-client-page #auth-view .auth-intro{min-width:0;padding:12px 3px 20px}
 body.sag-client-page #auth-view .auth-intro h1{font-size:clamp(2rem,8.3vw,3rem);line-height:1.13;overflow-wrap:break-word}
 body.sag-client-page #auth-view .offer-pair{grid-template-columns:minmax(0,1fr);gap:12px}
 body.sag-client-page #auth-view .offer-pair article{min-width:0;border-radius:12px;padding:16px 18px}
 body.sag-client-page #auth-view :is(input,button,select){max-width:100%;min-height:44px}
 body.sag-client-page #auth-view input:not([type="checkbox"]){font-size:16px!important}
 body.sag-client-page #auth-view .password-control{min-width:0;max-width:100%}
 body.sag-client-page #auth-view .password-control button{min-width:76px;padding-inline:7px}
 body.sag-client-page #auth-view .check{align-items:flex-start;gap:10px}
 body.sag-client-page #auth-view .check input[type=checkbox]{flex:0 0 20px;min-width:20px;min-height:20px;margin-top:3px}
 body.sag-client-page #auth-view .auth-tabs button{min-height:45px}
 body.sag-client-page #dashboard .page-heading{display:flex;align-items:flex-start;flex-wrap:wrap;gap:12px}
 body.sag-client-page #dashboard .dashboard-main-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:8px}
 body.sag-client-page #dashboard .dashboard-main-actions :is(a,button){display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;white-space:normal;text-align:center;line-height:1.28;padding:10px 8px;overflow-wrap:anywhere}
 body.sag-client-page #dashboard .dashboard-tabs{
  display:flex;gap:0;max-width:100%;overflow-x:auto;overflow-y:hidden;
  -webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;
  border-bottom:1px solid #dfceb3;padding-bottom:2px;
 }
 body.sag-client-page #dashboard .dashboard-tabs button{
  flex:0 0 auto;min-width:100px;min-height:49px;max-width:65%;
  padding:12px 13px;line-height:1.3;white-space:normal;text-align:center;
  scroll-snap-align:start;overflow-wrap:anywhere;
 }
 body.sag-client-page #dashboard .artwork-card,
 body.sag-client-page #dashboard .card-body,
 body.sag-client-page #dashboard .dashboard-benefit{min-width:0;max-width:100%;overflow-wrap:anywhere}
 body.sag-client-page #dashboard .works-toolbar{grid-template-columns:minmax(0,1fr)!important;gap:9px}
 body.sag-client-page #dashboard .works-toolbar input,
 body.sag-client-page #dashboard .works-toolbar select{font-size:16px!important;min-height:47px}
 body.sag-client-page.sag-mobile-editor .client-header{
  display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:9px
 }
 body.sag-client-page.sag-mobile-editor .client-header .wordmark{grid-column:1/-1;max-width:100%}
 body.sag-client-page.sag-mobile-editor .client-header nav[aria-label="Navigation"]{
  grid-column:1;min-width:0;justify-content:flex-start;gap:8px 11px;font-size:.79rem
 }
 body.sag-client-page.sag-mobile-editor .client-header nav.sag-commerce-languages{
  grid-column:2;min-width:0;flex-wrap:wrap;justify-content:flex-end
 }
 body.sag-client-page #editor-view{width:100%;min-width:0;max-width:100%}
 body.sag-client-page #editor-view #artwork-form{min-width:0;max-width:100%}
 body.sag-client-page #editor-view #artwork-form > section.panel{padding:17px 13px;max-width:100%;min-width:0;border-radius:12px}
 body.sag-client-page #editor-view .steps{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;
  position:sticky;top:0;z-index:15;margin:8px 0 17px;
  padding:9px 6px;border-radius:12px;
  background:rgba(255,252,246,.97);
  border:1px solid #e5d7bf;box-shadow:0 7px 22px rgba(85,65,34,.12)
 }
 body.sag-client-page #editor-view .steps li{min-width:0;width:100%}
 body.sag-client-page #editor-view .steps li a{
  min-height:45px;display:flex;align-items:center;justify-content:center;
  max-width:100%;min-width:0;white-space:normal;overflow-wrap:anywhere;
  text-align:center;line-height:1.28;font-size:.83rem;padding:7px 6px
 }
 body.sag-client-page #editor-view .steps li.current a{font-weight:750}
 body.sag-client-page #editor-view #artwork-form :is(input:not([type="checkbox"]),select,textarea){
  max-width:100%;min-width:0;font-size:16px!important;line-height:1.4
 }
 body.sag-client-page #editor-view #artwork-form :is(input:not([type="checkbox"]),select){min-height:47px}
 body.sag-client-page #editor-view #artwork-form label.check input[type="checkbox"]{
  min-width:20px;min-height:20px;flex:0 0 20px;margin-top:3px
 }
 body.sag-client-page #editor-view #artwork-form .form-grid{
  display:grid;grid-template-columns:minmax(0,1fr);max-width:100%;gap:13px
 }
 body.sag-client-page #editor-view .photo-slots{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 body.sag-client-page #editor-view :is(.photo-slot,.photo-box){min-width:0;max-width:100%}
 body.sag-client-page #editor-view :is(.photo-slot button,.friendly-nav button,.preview-action button,#generate-ai,#submit-listing){min-height:48px}
 body.sag-client-page #editor-view .friendly-nav{gap:8px}
 body.sag-client-page #editor-view .friendly-nav > .primary{flex:1 0 100%;width:100%;order:1}
 body.sag-client-page #editor-view .friendly-nav > .secondary,
 body.sag-client-page #editor-view .friendly-nav > .text-button{flex:1 1 120px;min-width:0;order:2}
 body.sag-client-page #editor-view .friendly-save{order:3;flex:1 0 100%;width:100%;text-align:center;white-space:normal}
 body.sag-client-page #editor-view :is(.terms-box,.wizard-preview-card,.plan-fieldset,.plan-grid){max-width:100%;min-width:0;overflow-wrap:anywhere}
 body.sag-client-page #editor-view .plan-grid{grid-template-columns:minmax(0,1fr)}
 body.sag-client-page #editor-view .plan-card.sag-plan-checked{
  background:#f7ead2;border-color:#a7803d;box-shadow:inset 0 0 0 1px #a7803d
 }
 body.sag-client-page.sag-dialog-legacy #listing-preview[open]{
  width:calc(100vw - 18px);max-height:calc(100vh - 28px);
  max-height:calc(100dvh - 28px);inset:12px auto auto 50%;padding:13px;border-radius:12px
 }
 body.sag-client-page #listing-preview[open] .preview-topbar{top:0;margin-bottom:12px}
 body.sag-client-page #listing-preview[open] #close-preview{min-height:46px}
}
@media(max-width:385px){
 body.sag-client-page.sag-mobile-editor .client-header{grid-template-columns:minmax(0,1fr)}
 body.sag-client-page.sag-mobile-editor .client-header nav[aria-label="Navigation"],
 body.sag-client-page.sag-mobile-editor .client-header nav.sag-commerce-languages{grid-column:1;justify-content:flex-start}
 body.sag-client-page #dashboard .dashboard-main-actions{grid-template-columns:minmax(0,1fr)}
 body.sag-client-page #dashboard .dashboard-tabs button{min-width:107px;padding:11px 9px;font-size:.78rem}
 body.sag-client-page #editor-view .steps li a{font-size:.78rem}
}
@media(max-width:620px){
 body.sag-shop-page{overflow-x:hidden}
 body.sag-shop-page .sag-j-public{max-width:100%;margin:18px auto 48px;padding:0 12px}
 body.sag-shop-page .sag-j-public h1{font-size:clamp(1.8rem,8vw,3rem);overflow-wrap:break-word}
 body.sag-shop-page .sag-j-highlights{grid-template-columns:minmax(0,1fr);gap:8px;margin:15px 0}
 body.sag-shop-page .sag-j-highlights>div{padding:13px}
 body.sag-shop-page .sag-j-shop{max-width:100%;margin:14px 0;padding:13px 10px}
 body.sag-shop-page .sag-j-shop .sag-j-grid-standard,
 body.sag-shop-page .sag-j-shop .sag-j-grid-prestige{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
 body.sag-shop-page .sag-j-grid .sag-j-plan{min-width:0;max-width:100%}
 body.sag-shop-page .sag-j-line{grid-template-columns:minmax(0,1fr) 70px 42px;gap:5px}
 body.sag-shop-page .sag-j-line :is(select,input){font-size:16px!important;min-height:46px}
 body.sag-shop-page .sag-j-line button{min-width:42px;min-height:46px}
 body.sag-shop-page .sag-j-main{min-height:49px;max-width:100%;white-space:normal}
 body.sag-shop-page .sag-j-accept-row{flex-wrap:wrap;gap:9px}
 body.sag-shop-page .sag-j-accept-row label.sag-j-terms{white-space:normal!important;min-width:0}
 body.sag-shop-page .sag-j-accept-row label.sag-j-terms span{white-space:normal!important}
 body.sag-shop-page .sag-j-conditions-link{overflow-wrap:anywhere;white-space:normal!important}
 body.sag-shop-page .sag-j-quickpacks button,body.sag-shop-page .sag-j-guided-packs button{min-height:44px}
}
@media(prefers-reduced-motion:reduce){
 body.sag-client-page *{scroll-behavior:auto!important;animation-duration:.001ms!important;transition-duration:.001ms!important}
}
