/* Glayru Spot v21 · presentational layer for the existing interface */
:root{--spot-scroll:#537aab;--spot-scroll-hover:#7bb0ef}
html,body,.app-modal-card,.pricing-modal,.spot-detail-dialog,.ui-select-scroll,.suggest-popover,.tab-screen,.table-scroll,.sheet-plans,.spot-support-card,.spot-support-message{scrollbar-width:thin;scrollbar-color:var(--spot-scroll) transparent}
:where(html,body,.tab-screen,.app-modal-card,.pricing-modal,.spot-detail-dialog,.ui-select-scroll,.suggest-popover,.table-scroll,.spot-support-card,.spot-support-message)::-webkit-scrollbar{width:8px;height:8px}
:where(html,body,.tab-screen,.app-modal-card,.pricing-modal,.spot-detail-dialog,.ui-select-scroll,.suggest-popover,.table-scroll,.spot-support-card,.spot-support-message)::-webkit-scrollbar-track{background:transparent;border-radius:999px;margin-block:7px;margin-inline:7px}
:where(html,body,.tab-screen,.app-modal-card,.pricing-modal,.spot-detail-dialog,.ui-select-scroll,.suggest-popover,.table-scroll,.spot-support-card,.spot-support-message)::-webkit-scrollbar-thumb{background:var(--spot-scroll);border-radius:999px;border:2px solid transparent;background-clip:padding-box;min-height:26px}
:where(html,body,.tab-screen,.app-modal-card,.pricing-modal,.spot-detail-dialog,.ui-select-scroll,.suggest-popover,.table-scroll,.spot-support-card,.spot-support-message)::-webkit-scrollbar-thumb:hover{background:var(--spot-scroll-hover);border:2px solid transparent;background-clip:padding-box}
:where(html,body,.tab-screen,.app-modal-card,.pricing-modal,.spot-detail-dialog,.ui-select-scroll,.suggest-popover,.table-scroll,.spot-support-card,.spot-support-message)::-webkit-scrollbar-corner{background:transparent}
#tab-settings .spot-v21-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start;margin-top:20px}
#tab-settings .spot-v21-grid>.panel,#tab-settings .spot-v21-grid>.owner-push-setup{margin:0!important;min-width:0;min-height:0;width:100%;padding:22px;border-radius:18px;border:1px solid var(--border,#293d5a);background:var(--card,#141d2d);box-shadow:none}
#tab-settings .spot-v21-grid h2{margin:0 0 8px;font-size:17px;letter-spacing:-.3px}
#tab-settings .spot-v21-grid .spot-v21-lead{font-size:12px;line-height:1.6;color:var(--muted,#9aabc1);margin:0 0 16px}
#tab-settings .spot-v21-grid .settings-icon{margin:0 0 12px}
#tab-settings .spot-v21-grid .divider-light{display:none}
#tab-settings .spot-v21-grid .button{max-width:100%}
#tab-settings .spot-v21-grid .spot-v21-span{grid-column:1/-1}
#tab-settings .owner-push-setup{align-items:start;flex-direction:column}
#tab-settings .owner-push-setup>div{min-width:0}
#tab-settings .owner-push-setup>[data-business-push-status]{min-width:0}
#tab-settings .spot-v21-grid .spot-v19-options{gap:12px!important}
#tab-settings .spot-v19-options .spot-fulfillment-row{align-items:center!important;gap:16px;min-height:68px}
#tab-settings .spot-v19-options .spot-fulfillment-row strong{margin:0 0 3px}
#tab-settings .spot-v19-options .spot-fulfillment-row small{margin:0;max-width:480px;line-height:1.45}
#tab-settings .spot-v19-options .spot-fulfillment-toggle input+.spot-switch{flex-shrink:0}
#tab-settings .spot-v19-options .spot-fulfillment-toggle{display:flex;align-items:center}
#tab-settings .spot-v19-options .spot-fulfillment-toggle>span:first-child{flex:1;min-width:0}
#tab-settings .spot-v21-grid .copy-line{max-width:100%;min-width:0}
#tab-settings .spot-v21-grid .copy-line>span{min-width:0;overflow-wrap:anywhere}
#tab-settings .spot-v21-grid .domain-pro-note{margin-top:12px}
/* Replace native square checkboxes only in settings and schedule: keyboard focus stays visible */
#tab-settings .spot-v21-grid input[type=checkbox]:not([hidden]):not(:disabled):not(.spot-v21-native),
#tab-schedule .day-enabled{
  appearance:none;-webkit-appearance:none;width:43px;height:25px;min-width:43px;border-radius:999px;border:1px solid #485977;background:#2a394f;display:inline-block;position:relative;cursor:pointer;vertical-align:middle;flex:0 0 43px;margin:0 2px;transition:background .22s ease,border-color .22s ease;
}
#tab-settings .spot-v21-grid input[type=checkbox]:not([hidden]):not(:disabled):not(.spot-v21-native)::after,
#tab-schedule .day-enabled::after{content:"";position:absolute;left:3px;top:3px;width:17px;height:17px;border-radius:50%;background:#b6c4d8;transition:transform .23s cubic-bezier(.2,.8,.2,1),background .2s}
#tab-settings .spot-v21-grid input[type=checkbox]:not([hidden]):not(:disabled):not(.spot-v21-native):checked,
#tab-schedule .day-enabled:checked{background:var(--accent,#437fe4);border-color:var(--accent,#437fe4)}
#tab-settings .spot-v21-grid input[type=checkbox]:not([hidden]):not(:disabled):not(.spot-v21-native):checked::after,
#tab-schedule .day-enabled:checked::after{transform:translateX(18px);background:#fff}
#tab-settings .spot-v21-grid input[type=checkbox]:focus-visible,#tab-schedule .day-enabled:focus-visible{outline:2px solid #a9cdff;outline-offset:3px}
/* Existing v19 custom switch retains its own visual instead of showing a duplicate */
#tab-settings .spot-fulfillment-toggle input[type=checkbox]{appearance:none!important;width:1px!important;height:1px!important;min-width:1px!important;position:absolute!important;opacity:0!important;border:0!important}
#tab-settings .spot-fulfillment-toggle input[type=checkbox]::after{display:none!important}
#tab-schedule .schedule-row>label{display:flex;align-items:center;gap:11px}
.spot-home-guest .week,.spot-home-live .week{grid-template-columns:repeat(7,minmax(0,1fr))}
.spot-home-guest .preview-left,.spot-home-live .preview-left{min-width:0}
.spot-home-guest .preview-appointments{min-height:104px}
.spot-home-guest .week-day{transition:border-color .2s,background .2s,color .2s,transform .2s}
/* support */
.spot-support-section{margin:34px auto 52px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:30px 34px;border:1px solid #2b3f59;border-radius:22px;background:linear-gradient(110deg,#141f32,#101925);box-shadow:0 16px 40px rgba(0,0,0,.10)}
.spot-support-section h2{margin:9px 0 8px;font-size:clamp(23px,3vw,30px);color:#eff5ff}
.spot-support-section p{max-width:620px;line-height:1.6;margin:0;color:#a5b8d0;font-size:13px}
.spot-support-section .button{flex:0 0 auto}
.spot-support-layer{position:fixed;inset:0;z-index:12000;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(2,8,17,.73);backdrop-filter:blur(8px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .24s ease,visibility 0s linear .24s}
.spot-support-layer.is-open{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .24s ease,visibility 0s}
.spot-support-card{width:min(100%,540px);max-height:min(86dvh,760px);overflow:auto;padding:26px;border:1px solid #365174;border-radius:22px;background:#111c2d;box-shadow:0 26px 80px rgba(0,0,0,.37);transform:translateY(16px) scale(.975);opacity:0;transition:transform .29s cubic-bezier(.2,.85,.2,1),opacity .23s}
.spot-support-layer.is-open .spot-support-card{transform:none;opacity:1}
.spot-support-top{display:flex;align-items:start;justify-content:space-between;gap:10px;margin-bottom:20px}
.spot-support-top h2{margin:7px 0 0;font-size:23px;color:#f3f6ff}
.spot-support-close{width:35px;height:35px;display:grid;place-items:center;border:1px solid #31445f;border-radius:10px;background:#1b2b43;color:#c8d9f2;cursor:pointer}
.spot-support-form{display:grid;gap:14px}
.spot-support-form label{display:grid;gap:7px;font-size:12px;color:#b6c7de;font-weight:630}
.spot-support-form input,.spot-support-form textarea,.spot-support-form select{width:100%;max-width:100%;box-sizing:border-box;background:#0e1726;border:1px solid #334a69;border-radius:11px;color:#f0f5ff;padding:12px 13px;outline:none;font:inherit;font-size:13px}
.spot-support-form input:focus,.spot-support-form textarea:focus,.spot-support-form select:focus{border-color:#73a7f3;box-shadow:0 0 0 2px #477fe325}
.spot-support-form textarea{min-height:128px;resize:vertical}
.spot-support-status{font-size:12px;color:#a7d9ba;min-height:20px;line-height:1.5}
.spot-support-form [data-spam-trap]{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}
body.spot-support-open{overflow:hidden}
@media(max-width:810px){#tab-settings .spot-v21-grid{grid-template-columns:1fr}.spot-support-section{flex-direction:column;align-items:flex-start;padding:22px}.spot-support-section .button{width:100%;justify-content:center}}
@media(max-width:450px){.spot-support-card{padding:20px 17px;border-radius:19px}.spot-support-layer{padding:12px}#tab-settings .spot-v21-grid>.panel,#tab-settings .spot-v21-grid>.owner-push-setup{padding:18px}}
@media(prefers-reduced-motion:reduce){.spot-support-layer,.spot-support-card{transition:none!important}}
/* Existing hand-drawn document scrollbar follows the same palette and radius */
.site-scrollbar{width:8px}
.site-scrollbar-thumb{right:1px!important;width:6px!important;border-radius:999px!important;background:linear-gradient(180deg,#6598d3,#3e6a9e)!important;box-shadow:inset 0 0 0 1px #d0e4ff1a!important}
.site-scrollbar-thumb:hover,.site-scrollbar-thumb.dragging{background:linear-gradient(180deg,#8fbeec,#5686b8)!important}
#profile-modal .app-modal-card{scrollbar-width:thin;scrollbar-color:var(--spot-scroll) transparent}
#profile-modal .app-modal-card::-webkit-scrollbar-thumb{border-radius:999px;background:var(--spot-scroll);border:2px solid transparent;background-clip:padding-box}
