/* Shared owner UI. Storefronts and the specialist's customer preview keep their own theme. */
body:is([data-cabinet], [data-mode="owner"]) {
  --cabinet-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --cabinet-text: #171a20;
  --cabinet-muted: #66717e;
  --cabinet-bg: #f6f7f9;
  --cabinet-panel: #fff;
  --cabinet-line: #dfe4eb;
  --cabinet-primary: #0e7c6b;
  --cabinet-primary-hover: #0a5d50;
  --cabinet-soft: #e6f3f0;
  --cabinet-body-size: 16px;
  --cabinet-title-size: 20px;
  --cabinet-card-title-size: 18px;
  --cabinet-label-size: 14px;
  --cabinet-button-size: 15px;
  --cabinet-radius: 14px;
  --cabinet-control-radius: 10px;
  --cabinet-control-height: 44px;
  --cabinet-panel-padding: 20px;
  --cabinet-shadow: 0 1px 2px rgb(20 22 30 / 4%), 0 4px 16px rgb(20 22 30 / 4%);
  /* Adapters for existing components; status colors intentionally have no alias. */
  --ink: var(--cabinet-text);
  --mut: var(--cabinet-muted);
  --muted: var(--cabinet-muted);
  --bg: var(--cabinet-bg);
  --panel: var(--cabinet-panel);
  --line: var(--cabinet-line);
  --brand: var(--cabinet-primary);
  --teal: var(--cabinet-primary);
  --teal-d: var(--cabinet-primary-hover);
  --teal-soft: var(--cabinet-soft);
  --r: var(--cabinet-radius);
  --sh: var(--cabinet-shadow);
  font-family: var(--cabinet-font);
  font-size: var(--cabinet-body-size);
  line-height: 1.5;
  background: var(--cabinet-bg);
  color: var(--cabinet-text);
}

body:is([data-cabinet], [data-mode="owner"]) :is(.s-title, .calendar-heading h1, .h2):not(.appearance-preview *) {
  font-family: var(--cabinet-font);
  font-size: var(--cabinet-title-size);
  font-weight: 700;
  line-height: 1.3;
}
body:is([data-cabinet], [data-mode="owner"]) :is(.card, .store-card, .purchase-card):not(.appearance-preview *) {
  background: var(--cabinet-panel);
  border: 1px solid var(--cabinet-line);
  border-radius: var(--cabinet-radius);
  padding: var(--cabinet-panel-padding);
  box-shadow: var(--cabinet-shadow);
  min-width: 0;
}
body:is([data-cabinet], [data-mode="owner"]) :is(.card h3, .store-card h2, .purchase-card h2):not(.appearance-preview *) {
  font-family: var(--cabinet-font);
  font-size: var(--cabinet-card-title-size);
  line-height: 1.35;
  font-weight: 700;
}
body:is([data-cabinet], [data-mode="owner"]) :is(.field, .field label, .field > span):not(.appearance-preview *) {
  font-family: var(--cabinet-font);
  font-size: var(--cabinet-label-size);
}
body:is([data-cabinet], [data-mode="owner"]) .field :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]), select, textarea):not(.appearance-preview *) {
  font-family: var(--cabinet-font);
  font-size: var(--cabinet-body-size);
  line-height: 1.5;
  min-height: var(--cabinet-control-height);
  max-width: 100%;
  padding: 10px 12px;
  color: var(--cabinet-text);
  background: var(--cabinet-panel);
  border: 1px solid var(--cabinet-line);
  border-radius: var(--cabinet-control-radius);
}
body:is([data-cabinet], [data-mode="owner"]) :is(.tbtn, .btn, .quiet, .actions > button, .card > button, .slot-note > button, button.primary, .cta, .appearance-actions button):not(.appearance-preview *) {
  font-family: var(--cabinet-font);
  font-size: var(--cabinet-button-size);
  line-height: 1.4;
  font-weight: 600;
  min-height: var(--cabinet-control-height);
  padding: 10px 16px;
  border: 1px solid var(--cabinet-line);
  border-radius: var(--cabinet-control-radius);
  overflow-wrap: anywhere;
}
body[data-mode="owner"] .slot-note:has(> button) { display: flex; flex-wrap: wrap; gap: 8px; }
body[data-mode="owner"] .slot-note > button {
  background: var(--cabinet-panel);
  color: var(--cabinet-text);
}
/* Seven days must keep their labels together on a narrow owner calendar. */
body[data-mode="owner"] .calendar-week button { padding: 8px 0; min-width: 0; }
body[data-mode="owner"] .calendar-week :is(span, strong, small) { white-space: nowrap; }
body[data-mode="owner"] .calendar-week strong { font-size: 18px; }
body[data-mode="owner"] .calendar-week small { font-size: 8px; }
body:is([data-cabinet], [data-mode="owner"]) :is(.tbtn:not(.sec), .btn:not(.secondary), button.primary, .cta):not(.appearance-preview *) {
  background: var(--cabinet-primary);
  color: #fff;
  border-color: var(--cabinet-primary);
}
@media (hover: hover) {
  body:is([data-cabinet], [data-mode="owner"]) :is(.tbtn:not(.sec), .btn:not(.secondary), button.primary, .cta):not(.appearance-preview *):not(:disabled):hover {
    background: var(--cabinet-primary-hover);
  }
}
body:is([data-cabinet], [data-mode="owner"]) :is(button, a, input, select, textarea, summary):not(.appearance-preview *):focus-visible {
  outline: 3px solid var(--cabinet-primary);
  outline-offset: 3px;
}

/* The owner header shares the account destination, without changing customer navigation. */
body[data-mode="owner"] #top { flex-wrap: wrap; }
body[data-mode="owner"] #top > .ava { flex: none; }
body[data-mode="owner"] #top > .tt { flex: 1; min-width: 80px; }
body[data-mode="owner"] #top > .tt b {
  font-family: var(--cabinet-font);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  overflow-wrap: anywhere;
}
body[data-mode="owner"] .cabinet-account-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--cabinet-control-height);
  max-width: 128px;
  padding: 8px 12px;
  border: 1px solid var(--cabinet-line);
  border-radius: var(--cabinet-control-radius);
  background: var(--cabinet-panel);
  color: var(--cabinet-text);
  font: 600 13px/1.3 var(--cabinet-font);
  text-decoration: none;
  text-align: center;
}
@media (max-width: 350px) {
  body:is([data-cabinet], [data-mode="owner"]) { --cabinet-panel-padding: 16px; }
  body[data-mode="owner"] .cabinet-account-link { max-width: 102px; padding-inline: 8px; }
}

/* Common controls, including dynamically rendered dialogs. */
@font-face{font-family:CabinetInter;src:url('/client/assets/fonts/inter-regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:CabinetInter;src:url('/client/assets/fonts/inter-semibold.woff2') format('woff2');font-weight:600;font-display:swap}
body:is([data-cabinet],[data-mode="owner"]){--cabinet-font:CabinetInter,Inter,Arial,sans-serif}
body:is([data-cabinet],[data-mode="owner"]) :is(button,input,select,textarea):not(.appearance-preview *){font-family:var(--cabinet-font);font-size:16px;box-sizing:border-box}
body:is([data-cabinet],[data-mode="owner"]) button:not(.appearance-preview *):not(.sw){border-radius:var(--cabinet-control-radius)}
body:is([data-cabinet],[data-mode="owner"]) :is(input[type="checkbox"],input[type="radio"]):not(.appearance-preview *){appearance:none;-webkit-appearance:none;width:22px;height:22px;min-width:22px;min-height:22px;margin:0;vertical-align:middle;background:var(--cabinet-panel);border:1.5px solid #abb9b6;border-radius:6px;display:inline-grid;place-content:center;cursor:pointer;padding:0;flex:none}
body:is([data-cabinet],[data-mode="owner"]) input[type="radio"]:not(.appearance-preview *){border-radius:50%}
body:is([data-cabinet],[data-mode="owner"]) :is(input[type="checkbox"],input[type="radio"]):checked:not(.appearance-preview *){background:var(--cabinet-primary);border-color:var(--cabinet-primary)}
body:is([data-cabinet],[data-mode="owner"]) input[type="checkbox"]:checked:not(.appearance-preview *)::before{content:'';width:10px;height:6px;border:solid white;border-width:0 0 2px 2px;transform:translateY(-1px) rotate(-45deg)}
body:is([data-cabinet],[data-mode="owner"]) input[type="radio"]:checked:not(.appearance-preview *)::before{content:'';width:8px;height:8px;background:#fff;border-radius:50%}
body:is([data-cabinet],[data-mode="owner"]) :is(input,select,textarea,button):disabled:not(.appearance-preview *){opacity:.55;cursor:not-allowed}
body:is([data-cabinet],[data-mode="owner"]) .check-label{display:flex;align-items:center;gap:10px;min-height:44px}
.cb-select{display:block;position:relative;width:100%;min-width:0}
body:is([data-cabinet],[data-mode="owner"]) .cb-select>select{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;opacity:0!important;pointer-events:none;min-width:0}
body:is([data-cabinet],[data-mode="owner"]) .cb-select-trigger{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:44px;padding:10px 12px;background:var(--cabinet-panel);color:var(--cabinet-text);border:1px solid var(--cabinet-line);font-size:16px;line-height:1.4;text-align:left;font-weight:400;cursor:pointer}
.cb-select-trigger>span{min-width:0;overflow:hidden;text-overflow:ellipsis}.cb-select-trigger>svg{flex:none}
.cb-select-popup{position:fixed;z-index:2147483000;overflow:auto;overscroll-behavior:contain;background:var(--cabinet-panel,#fff);color:var(--cabinet-text,#171a20);border:1px solid var(--cabinet-line,#dfe4eb);border-radius:12px;padding:4px;box-shadow:0 8px 32px #102b2526;box-sizing:border-box;font:400 16px/1.4 var(--cabinet-font,Arial)}
.cb-select-popup [role="option"]{padding:11px 12px;min-height:44px;box-sizing:border-box;border-radius:8px;cursor:pointer;overflow-wrap:anywhere}
.cb-select-popup [role="option"].is-active{background:var(--cabinet-soft,#e6f3f0)}.cb-select-popup [aria-selected="true"]{color:var(--cabinet-primary,#0e7c6b);font-weight:600}.cb-select-popup [aria-disabled="true"]{opacity:.5;cursor:default}
.cab-interval{display:flex;align-items:center;gap:8px;background:var(--cabinet-soft);border:1px solid var(--cabinet-line);border-radius:12px;padding:10px;margin-bottom:8px;min-width:0}
.cab-interval>label{display:grid;gap:4px;font-size:13px;min-width:0;flex:1}.cab-interval>span{padding-top:20px}.cab-interval .cb-select-trigger{min-width:0;padding:8px;font-size:16px}.cab-intervals>[data-interval-status]{display:block;font-size:14px}
body:is([data-cabinet],[data-mode="owner"]) .cab-remove{display:grid;place-items:center;flex:none;min-width:36px;width:36px;height:36px;min-height:36px;padding:0;border:1px solid var(--cabinet-line);background:#fff;color:var(--cabinet-muted);font-size:24px;line-height:1;cursor:pointer}
.cab-token-list{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}.cab-token{display:inline-flex;align-items:center;gap:8px;max-width:100%;padding:4px 6px 4px 12px;background:var(--cabinet-soft);border:1px solid var(--cabinet-line);border-radius:10px;overflow-wrap:anywhere}.cab-token>span{min-width:0}.cab-token-add{display:flex;gap:8px;align-items:center}.cab-token-add>input{min-width:0;flex:1}
@media(max-width:380px){.cab-interval{gap:5px;padding:7px}.cab-interval .cb-select-trigger{padding:8px 5px;gap:2px}.cab-interval .cb-select-trigger svg{width:12px}.cab-token-add{flex-wrap:wrap}}
body:is([data-cabinet],[data-mode="owner"]) :is(.tbtn.sec,.btn.secondary,.quiet):not(.appearance-preview *){background:var(--cabinet-panel);border-color:var(--cabinet-line);color:var(--cabinet-text)}
body:is([data-cabinet],[data-mode="owner"]) .billing-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;box-sizing:border-box;padding:10px 16px;border:1px solid var(--cabinet-primary);border-radius:var(--cabinet-control-radius);background:var(--cabinet-primary);color:#fff;font:600 15px/1.4 var(--cabinet-font);text-decoration:none;text-align:center}