/* Virtual Pix Booth look: header, footer, type and colours shared by every
   plugin page (home, My Account, albums, welcome). Colours come from the logo:
   midnight indigo, booth blue, pixel cyan, violet, party pink. */
body.sbx-light{
	--vpb-night:#0c1240;--vpb-night-2:#161d5c;--vpb-ink:#141a4a;--vpb-text:#3b4170;--vpb-muted:#6a7099;
	--vpb-line:#e3e6f5;--vpb-paper:#f5f7ff;--vpb-blue:#2e6bff;--vpb-cyan:#1fd1f0;--vpb-violet:#8b5cf6;
	--vpb-pink:#ff2d8b;--vpb-pink-2:#ff4f9f;--vpb-display:"Unbounded","Figtree",system-ui,sans-serif;
	--vpb-body:"Figtree",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
	margin:0;min-height:100vh;display:flex;flex-direction:column;background:#fff;color:var(--vpb-ink);
	font-family:var(--vpb-body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip
}
body.sbx-light > .sbx-main{flex:1 0 auto;width:100%}
/* the theme's own fonts and heading colours don't apply on these pages */
body.sbx-light p,body.sbx-light li,body.sbx-light td,body.sbx-light th,body.sbx-light label,body.sbx-light input,body.sbx-light select,body.sbx-light textarea,body.sbx-light button,body.sbx-light summary,body.sbx-light figcaption,body.sbx-light small,body.sbx-light a,body.sbx-light span{font-family:var(--vpb-body)}
body.sbx-light .vpb-topbar,body.sbx-light .vpb-footer{display:none !important}
.sbx-wrap{max-width:1160px;margin:0 auto;padding:0 24px;box-sizing:border-box}
body.sbx-light a:focus-visible,body.sbx-light button:focus-visible,body.sbx-light summary:focus-visible,body.sbx-light input:focus-visible{outline:3px solid var(--vpb-cyan);outline-offset:2px}

/* header */
.sbx-header{position:sticky;top:0;z-index:70;background:rgba(255,255,255,.94);-webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--vpb-line)}
body.admin-bar .sbx-header{top:32px}
.sbx-header .sbx-wrap{display:flex;align-items:center;gap:28px;min-height:76px}
.sbx-logo{display:inline-flex;align-items:center;text-decoration:none !important;color:var(--vpb-ink) !important;font-family:var(--vpb-display);font-weight:700;font-size:19px;flex:0 1 auto;min-width:0}
.sbx-logo span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sbx-logo img{height:44px;width:auto;max-width:100%;display:block;object-fit:contain;object-position:left center}
.sbx-nav{display:flex;align-items:center;gap:6px;margin-left:auto}
.sbx-nav a{color:var(--vpb-text) !important;text-decoration:none !important;font-weight:600;font-size:15px;padding:8px 12px;border-radius:8px}
.sbx-nav a:hover{color:var(--vpb-ink) !important;background:var(--vpb-paper)}
.sbx-actions{display:flex;align-items:center;gap:10px;flex:none}
.sbx-actions a{text-decoration:none !important;font-weight:700;font-size:15px}
.sbx-actions .sbx-quiet{color:var(--vpb-ink) !important;padding:9px 14px;border-radius:999px;border:1.5px solid var(--vpb-line)}
.sbx-actions .sbx-quiet:hover{border-color:var(--vpb-ink)}
.sbx-actions .sbx-cta{background:var(--vpb-pink);color:#fff !important;padding:10px 20px;border-radius:999px;box-shadow:0 6px 16px rgba(255,45,139,.28)}
.sbx-actions .sbx-cta:hover{background:var(--vpb-pink-2)}
.sbx-actions a{white-space:nowrap}

/* Menu button (phones and tablets) */
.sbx-menu{display:none;position:relative;flex:none}
.sbx-menu summary{list-style:none;cursor:pointer;width:44px;height:44px;border-radius:999px;border:1.5px solid var(--vpb-line);display:flex;align-items:center;justify-content:center;background:#fff;-webkit-tap-highlight-color:transparent;box-sizing:border-box}
.sbx-menu summary::-webkit-details-marker{display:none}
.sbx-menu summary::marker{content:""}
.sbx-menu[open] summary{border-color:var(--vpb-ink)}
.sbx-burger,.sbx-burger::before,.sbx-burger::after{display:block;width:18px;height:2px;border-radius:2px;background:var(--vpb-ink);position:relative;transition:transform .2s,background .2s}
.sbx-burger::before,.sbx-burger::after{content:"";position:absolute;left:0}
.sbx-burger::before{top:-6px}.sbx-burger::after{top:6px}
.sbx-menu[open] .sbx-burger{background:transparent}
.sbx-menu[open] .sbx-burger::before{transform:translateY(6px) rotate(45deg)}
.sbx-menu[open] .sbx-burger::after{transform:translateY(-6px) rotate(-45deg)}
.sbx-menu-panel{position:absolute;right:0;top:calc(100% + 10px);width:min(300px,calc(100vw - 32px));box-sizing:border-box;background:#fff;border:1px solid var(--vpb-line);border-radius:18px;padding:8px;box-shadow:0 18px 50px rgba(12,18,64,.18);z-index:80;max-height:calc(100vh - 100px);overflow-y:auto}
.sbx-menu-panel nav{display:flex;flex-direction:column}
.sbx-menu-panel a{display:flex;align-items:center;min-height:48px;padding:0 14px;border-radius:12px;color:var(--vpb-ink) !important;text-decoration:none !important;font-weight:600;font-size:16px}
.sbx-menu-panel a:hover,.sbx-menu-panel a:active{background:var(--vpb-paper)}
.sbx-menu-site{border-top:1px solid var(--vpb-line);margin-top:6px;padding-top:6px}
.sbx-menu-site a{font-weight:500;color:var(--vpb-text) !important}
.sbx-menu-panel .sbx-menu-out{color:var(--vpb-muted) !important}
@media (prefers-reduced-motion:reduce){.sbx-burger,.sbx-burger::before,.sbx-burger::after{transition:none}}

/* footer */
.sbx-footer{background:var(--vpb-paper);border-top:1px solid var(--vpb-line);padding:56px 0 28px;font-size:15px;color:var(--vpb-text)}
.sbx-footer-row{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,1fr));gap:36px}
.sbx-footer-brand p{margin:14px 0 0;max-width:34em;line-height:1.6}
.sbx-footer-brand .sbx-logo img{height:38px}
.sbx-footer h4{margin:4px 0 12px !important;font-family:var(--vpb-body) !important;font-size:14px !important;font-weight:700 !important;color:var(--vpb-ink) !important;letter-spacing:0 !important;text-transform:none !important}
.sbx-footer-col a{display:block;color:var(--vpb-text) !important;text-decoration:none !important;padding:4px 0;font-weight:500}
.sbx-footer-col a:hover{color:var(--vpb-blue) !important}
.sbx-copy{margin-top:40px;padding-top:18px;border-top:1px solid var(--vpb-line);color:var(--vpb-muted);font-size:13px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.sbx-pixels{display:inline-flex;gap:4px;align-items:center}
.sbx-pixels i{width:7px;height:7px;border-radius:2px;display:block}
.sbx-pixels i:nth-child(1){background:var(--vpb-blue)}.sbx-pixels i:nth-child(2){background:var(--vpb-cyan)}.sbx-pixels i:nth-child(3){background:var(--vpb-violet)}.sbx-pixels i:nth-child(4){background:var(--vpb-pink)}

/* buttons and shared bits used by the plugin's pages */
body.sbx-light .sbp,body.sbx-light .sbw,body.sbx-light .sba-acct{--sbp-accent:var(--vpb-pink);--sbp-ink:var(--vpb-ink);--sbp-muted:var(--vpb-muted);--sbp-line:var(--vpb-line);--sbp-soft:var(--vpb-paper)}
body.sbx-light .sbp-btn{font-family:var(--vpb-body);font-weight:700}
body.sbx-light h1,body.sbx-light h2{font-family:var(--vpb-display);font-weight:600;letter-spacing:-.02em;color:var(--vpb-ink)}
body.sbx-light h3,body.sbx-light h4{font-family:var(--vpb-body)}
.sbw-page.sbx-light{background:linear-gradient(180deg,#fff 0,var(--vpb-paper) 100%)}
.sbw h1{font-size:clamp(28px,5vw,40px);line-height:1.15}

/* gallery parts on album pages */
body.sbx-light .sbg-head h1{color:var(--vpb-ink)}
body.sbx-light .sbg-head p,body.sbx-light .sbg-empty{color:var(--vpb-muted)}
body.sbx-light .sbg-item{background:#eef0fa}
body.sbx-light .sbg-btn{color:var(--vpb-ink) !important;border-color:#d6d9ec}
body.sbx-light .sbg-btn:hover{background:var(--vpb-paper)}
body.sbx-light .sbg-btn.sbg-primary,body.sbx-light .sbg-lightbox .sbg-btn{color:#fff !important}
body.sbx-light .sba-account{max-width:1160px;margin:0 auto;padding:14px 24px 0;box-sizing:border-box;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:14px;color:var(--vpb-muted)}
body.sbx-light .sba-account a{color:var(--vpb-ink);font-weight:600}
body.sbx-light .sba-albums,body.sbx-light .sba-grid{max-width:1160px;margin-left:auto;margin-right:auto;box-sizing:border-box}

@media (max-width:900px){
	.sbx-nav{display:none}
	.sbx-actions{margin-left:auto}
	.sbx-actions .sbx-quiet{display:none}
	.sbx-menu{display:block}
	.sbx-footer-row{grid-template-columns:1fr 1fr}
	.sbx-footer-brand{grid-column:1 / -1}
}
@media (max-width:600px){
	.sbx-header .sbx-wrap{min-height:62px;gap:10px;padding:0 16px}
	.sbx-logo img{height:30px}
	.sbx-actions{gap:6px}
	.sbx-actions .sbx-cta{padding:9px 16px;font-size:14px}
	body.admin-bar .sbx-header{top:0}
	.sbx-wrap{padding:0 16px}
	.sbx-footer{padding:44px 0 24px}
	.sbx-footer-row{gap:28px 20px}
	.sbx-footer-col a{padding:8px 0}
}
@media (max-width:360px){
	.sbx-header .sbx-wrap{gap:8px;padding:0 12px}
	.sbx-actions .sbx-cta{padding:8px 12px;font-size:13px}
	.sbx-menu summary{width:40px;height:40px}
}
