/* Shared workspace surfaces. The approved calendar/sidebar keep their own layout. */
:root {
  --ws-bg:#14171c; --ws-panel:#22262e; --ws-raised:#292e37; --ws-input:#1b1f26;
  --ws-line:#3b424d; --ws-line-soft:#323842; --ws-ink:#f5f4f1; --ws-muted:#b0b6c1;
  --ws-shadow:0 12px 34px #00000024,inset 0 1px 0 #ffffff07;
  --ws-tint:#ffffff04; --ws-hover:#ffffff06; --ws-red:#ee8c82;
}
:root[data-theme="light"] {
  --ws-bg:#f4f1ec; --ws-panel:#ffffff; --ws-raised:#faf8f5; --ws-input:#fdfcfb;
  --ws-line:#c9c5c0; --ws-line-soft:#e4dfd9; --ws-ink:#292c32; --ws-muted:#64656b;
  --ws-shadow:0 10px 30px #453a2b09,0 2px 5px #453a2b04,inset 0 1px 0 #fff;
  --ws-tint:#b29a7706; --ws-hover:#8d766b08; --ws-red:#ad302d;
}
#main-content:has(>.view:not(#view-calendar):not(.hidden)) {
  background:radial-gradient(ellipse at 100% 0%,#b7443808,transparent 42%),var(--ws-bg);
  min-height:100vh;
}
#main-content>.view:not(#view-calendar) { color:var(--ws-ink); font-size:15px; line-height:1.55; }
#main-content>.view:not(#view-calendar) .page-heading {
  padding:4px 0 22px; margin-bottom:24px; border-bottom:1px solid var(--ws-line-soft); align-items:center;
}
#main-content>.view:not(#view-calendar) .page-heading h1 {font-size:clamp(28px,2.4vw,36px);font-weight:750;letter-spacing:-1px;margin-bottom:8px;color:var(--ws-ink)}
#main-content>.view:not(#view-calendar) .page-heading p {font-size:15px;color:var(--ws-muted);line-height:1.6}
#main-content>.view:not(#view-calendar) .page-heading::after {width:56px;height:4px;background:linear-gradient(90deg,var(--accent),#b5353220)}
#main-content>.view:not(#view-calendar) :is(.toolbar,.table-wrap,.report-section,.settings-section,.loyalty-rules-surface,.card) {
  background:linear-gradient(130deg,var(--ws-tint),transparent 65%),var(--ws-panel);
  border:1px solid var(--ws-line-soft);border-radius:18px;box-shadow:var(--ws-shadow);
}
#main-content>.view:not(#view-calendar) .toolbar {padding:18px;gap:14px;align-items:end}
#main-content>.view:not(#view-calendar) :is(input:not([type=checkbox],[type=radio],[type=color]),select,.bl-select-trigger,.date-display) {
  background:var(--ws-input);color:var(--ws-ink);border-color:var(--ws-line);font-size:15px;min-height:44px;border-radius:10px;
}
#main-content>.view:not(#view-calendar) input::placeholder {color:var(--ws-muted)}
#main-content>.view:not(#view-calendar) :is(.dialog-field-caption,.toolbar-filter>span) {font-size:13px;font-weight:600;color:var(--ws-muted)}
#main-content>.view:not(#view-calendar) :is(button.primary,.toolbar>button,.toolbar .import-btn) {min-height:44px;font-size:14px;font-weight:600;padding:10px 16px}
#main-content>.view:not(#view-calendar) button.ghost {color:var(--ws-muted)}
#main-content>.view:not(#view-calendar) button.ghost:hover {color:var(--ws-ink);background:var(--ws-hover)}
#main-content>.view:not(#view-calendar) button.danger {color:var(--danger)}
#main-content>.view:not(#view-calendar) :is(.muted,.loyalty-help,.loyalty-data-note) {color:var(--ws-muted)}
#main-content>.view:not(#view-calendar) th {background:var(--ws-raised);color:var(--ws-muted);font-size:13px;font-weight:600;padding:15px 18px;border-color:var(--ws-line-soft)}
#main-content>.view:not(#view-calendar) td {font-size:14px;padding:17px 18px;line-height:1.55;border-color:var(--ws-line-soft)}
#main-content>.view:not(#view-calendar) tbody tr:hover>td {background:var(--ws-hover)}
#main-content>.view:not(#view-calendar) .table-actions .ghost {font-size:13px;padding:8px 10px;border-radius:8px}
#main-content>.view:not(#view-calendar) :is(.cell-name,.cell-service,.client-name-link,.svc-name) {color:var(--ws-ink);font-weight:600}
#main-content>.view:not(#view-calendar) .status-chip {font-size:12px;padding:4px 9px;font-weight:600}
#main-content>.view:not(#view-calendar) :is(.report-section,.settings-section) {padding:24px;margin-top:22px}
#main-content>.view:not(#view-calendar) :is(.report-section,.settings-section) h3 {font-size:20px;font-weight:700;color:var(--ws-ink)}
#main-content>.view:not(#view-calendar) .card {padding:24px;position:relative;overflow:hidden}
#main-content>.view:not(#view-calendar) .card .value {font-size:34px;color:var(--ws-ink);font-weight:700;letter-spacing:-1px;font-variant-numeric:tabular-nums}
#main-content>.view:not(#view-calendar) .card .label {font-size:14px;color:var(--ws-muted)}
#main-content #dashboard-cards>.card:first-child {background:linear-gradient(120deg,#c7353218,transparent),var(--ws-panel);border-color:color-mix(in srgb,var(--accent) 30%,var(--ws-line-soft))}
#main-content #services-list.services-groups {background:none;border:0;box-shadow:none}
#main-content #services-list .service-group {background:var(--ws-panel);border:1px solid var(--ws-line-soft);border-radius:18px;box-shadow:var(--ws-shadow);margin-bottom:24px}
#main-content #services-list .service-group-header {background:linear-gradient(100deg,#c7353209,transparent),var(--ws-raised);padding:20px 22px;border-bottom:1px solid var(--ws-line-soft)}
#main-content #services-list .service-group-header h3 {font-size:21px;font-weight:700;color:var(--ws-ink)}
#main-content #services-list tbody td {height:62px}
#main-content #services-list .amount-sale {color:var(--ws-ink);font-weight:650}
.premium-person {display:flex;align-items:center;gap:12px;min-width:190px}
.premium-avatar {display:inline-flex;align-items:center;justify-content:center;flex:0 0 38px;width:38px;height:38px;border-radius:12px;background:linear-gradient(145deg,#c7353212,var(--ws-raised));border:1px solid var(--ws-line-soft);color:var(--ws-red);font:650 13px var(--font-heading);letter-spacing:.3px}
.premium-person .client-name-link {text-align:left;font-size:14px;line-height:1.5;padding:0}
.premium-sessions {display:grid;gap:8px;min-width:105px;font-variant-numeric:tabular-nums}
.premium-sessions strong {font:700 24px var(--font-heading);color:var(--ws-ink)}
.premium-sessions progress {appearance:none;display:block;width:105px;height:5px;border:0;border-radius:5px;overflow:hidden;background:var(--ws-line-soft)}
.premium-sessions progress::-webkit-progress-bar {background:var(--ws-line-soft)}
.premium-sessions progress::-webkit-progress-value {background:linear-gradient(90deg,#ac3532,#e57e70);border-radius:5px}
.premium-sessions progress::-moz-progress-bar {background:#c9574e;border-radius:5px}
.premium-list-heading {display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:26px 2px 14px}
.premium-list-heading h2 {display:flex;align-items:center;gap:10px;font-size:20px;margin:0;font-weight:700}
.premium-list-heading h2>span {font:650 13px var(--font);padding:3px 9px;background:var(--ws-raised);border:1px solid var(--ws-line-soft);border-radius:7px;color:var(--ws-muted)}
.premium-list-heading p {font-size:13px;color:var(--ws-muted);margin:0}
#main-content .clients-pagination {padding:18px 4px;color:var(--ws-muted);font-size:13px;gap:12px}
#main-content .client-section-nav {background:var(--ws-panel);border:1px solid var(--ws-line-soft);box-shadow:var(--ws-shadow);padding:5px;border-radius:13px;gap:4px;margin-bottom:26px}
#main-content .client-section-nav button {font-size:15px;font-weight:600;min-height:44px;padding:10px 20px;color:var(--ws-muted)}
#main-content .client-section-nav button[aria-pressed=true] {background:linear-gradient(110deg,#c735321c,#c7353209);box-shadow:inset 0 0 0 1px #c7353226;color:var(--ws-ink)}
#client-loyalty-workspace {max-width:none}
#main-content .loyalty-page-head {margin:0 0 22px;gap:20px}
#main-content .loyalty-page-head h2 {font-size:24px;letter-spacing:-.65px;margin:0 0 7px;color:var(--ws-ink)}
#main-content .loyalty-page-head p {font-size:15px}
#main-content .loyalty-tabs {background:transparent;border:0;border-radius:0;padding:0 0 14px;gap:6px;width:100%;border-bottom:1px solid var(--ws-line-soft);margin-bottom:24px}
#main-content .loyalty-tabs button {padding:9px 16px;font-size:14px;border-radius:9px;color:var(--ws-muted)}
#main-content .loyalty-tabs button[aria-pressed=true] {background:var(--ws-raised);box-shadow:inset 0 0 0 1px var(--ws-line);color:var(--ws-ink)}
#main-content .loyalty-category-grid {grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
#main-content .premium-category {display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:22px;position:relative;overflow:hidden;min-width:0;padding:26px;border-radius:20px;border:1px solid color-mix(in srgb,var(--category-color) 24%,var(--ws-line-soft));background:radial-gradient(ellipse at 100% 0%,color-mix(in srgb,var(--category-color) 16%,transparent),transparent 60%),var(--ws-panel);box-shadow:var(--ws-shadow);transition:border-color 180ms,box-shadow 180ms}
#main-content .premium-category::before {content:"";position:absolute;left:26px;right:26px;top:0;height:2px;background:linear-gradient(90deg,var(--category-color),transparent)}
#main-content .premium-category:hover {border-color:color-mix(in srgb,var(--category-color) 65%,var(--ws-line-soft));box-shadow:0 14px 36px #00000018}
.premium-category-top {display:flex;align-items:center;justify-content:space-between}
.premium-category-icon {width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--category-color) 13%,var(--ws-panel));border:1px solid color-mix(in srgb,var(--category-color) 34%,var(--ws-line-soft));border-radius:14px;color:color-mix(in srgb,var(--category-color) 65%,#fff)}
:root[data-theme="light"] .premium-category-icon {color:var(--category-color)}
.premium-category-icon .loyalty-icon {width:28px;height:28px;flex-basis:28px}
#main-content .premium-edit {width:38px;height:38px;min-height:38px;padding:9px;border:1px solid var(--ws-line-soft);border-radius:11px;background:var(--ws-panel)}
.premium-edit svg {width:18px;height:18px;display:block}
.premium-overline {font-size:10px;line-height:1.5;letter-spacing:1.5px;text-transform:uppercase;color:var(--ws-muted);font-weight:600;margin:0 0 7px}
#main-content .premium-category h3 {font:750 clamp(22px,2vw,28px)/1.25 var(--font-heading);letter-spacing:-.8px;margin:0 0 9px;overflow-wrap:anywhere;color:var(--ws-ink)}
.premium-category-description {font-size:14px;color:var(--ws-muted);line-height:1.65;margin:0;min-height:46px}
.premium-category-count {display:flex;align-items:center;justify-content:space-between;gap:14px;text-align:left;padding:18px 0;border:0;border-top:1px solid var(--ws-line-soft);border-bottom:1px solid var(--ws-line-soft);border-radius:0;background:transparent;color:var(--ws-ink);width:100%;margin-top:auto}
.premium-category-count>span:first-child {display:flex;gap:12px;align-items:baseline;flex-wrap:wrap}
.premium-category-count strong {font:650 38px/1 var(--font-heading);letter-spacing:-1px;font-variant-numeric:tabular-nums}
.premium-category-count span span {font-size:13px;color:var(--ws-muted);font-weight:400}
.premium-category-count>span:last-child {font-size:22px;color:var(--ws-muted)}
.premium-category-count:hover {background:var(--ws-hover);color:var(--ws-red)}
.premium-category-rules {font-size:13px;color:var(--ws-muted);line-height:1.6}
.premium-assignment {display:inline-flex;align-items:center;gap:7px;font-weight:500}
.premium-assignment::before {content:"";width:5px;height:5px;border-radius:50%;background:var(--ws-muted)}
.premium-assignment.is-auto::before {background:#65a78a}
.premium-category-rules details {margin-top:12px;border-top:1px solid var(--ws-line-soft);padding-top:12px}
.premium-category-rules summary {cursor:pointer;color:var(--ws-ink);font-weight:500}
.premium-category-rules ul {padding-left:18px;margin:10px 0}
.premium-category-rules p {margin:10px 0 0;font-size:12px}
#main-content .loyalty-help {border-left:2px solid var(--ws-line);padding:1px 0 1px 14px;max-width:860px;line-height:1.75;font-size:14px;margin-top:24px}
#main-content .loyalty-rules-surface {padding:26px}
#main-content .loyalty-explainer {background:var(--ws-raised);border:1px solid var(--ws-line-soft);color:var(--ws-muted)}
#main-content .loyalty-rule-row {border-color:var(--ws-line-soft)}
#main-content .loyalty-rule-row label {font-size:14px;color:var(--ws-muted)}
#main-content .loyalty-section-head h3 {font-size:20px;color:var(--ws-ink)}
#main-content .loyalty-program-switch {background:var(--ws-panel);border-color:var(--ws-line);color:var(--ws-ink)}
dialog.loyalty-dialog,dialog.loyalty-preview-dialog {background:var(--ws-panel);color:var(--ws-ink);border-color:var(--ws-line)}
dialog.loyalty-dialog .dialog-header,dialog.loyalty-preview-dialog .dialog-header {background:var(--ws-raised);border-color:var(--ws-line-soft)}
dialog.loyalty-dialog .dialog-footer,dialog.loyalty-preview-dialog .dialog-footer {background:var(--ws-raised);border-color:var(--ws-line-soft)}
dialog.loyalty-dialog label:not(.loyalty-icon-picker label) {font-size:14px;color:var(--ws-muted)}
dialog.loyalty-dialog input:not([type=radio],[type=checkbox],[type=color]) {background:var(--ws-input);color:var(--ws-ink);border-color:var(--ws-line)}
@media(min-width:1700px){#main-content .loyalty-category-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-width:1600px}}
@media(max-width:1100px){#main-content .loyalty-category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.premium-person{min-width:165px}#main-content>.view:not(#view-calendar) td{padding:14px}}
@media(max-width:700px){
  #main-content .loyalty-category-grid{grid-template-columns:1fr;gap:16px}
  #main-content .premium-category{padding:22px;gap:18px}
  #main-content .premium-category h3{font-size:26px}
  .premium-category-description{min-height:0}
  #main-content>.view:not(#view-calendar) .toolbar{padding:14px}
  #main-content>.view:not(#view-calendar) .page-heading{padding-bottom:18px;margin-bottom:20px}
  #main-content .client-section-nav{width:100%;gap:2px;flex-wrap:nowrap}
  #main-content .client-section-nav button{font-size:13px;padding:10px 8px;flex:1;min-width:0}
  #main-content .loyalty-page-head{gap:16px}
  .premium-list-heading{align-items:flex-start;flex-direction:column;gap:5px}
  #main-content>.view:not(#view-calendar) :is(.settings-section,.report-section){padding:18px}
}
@media(prefers-reduced-motion:reduce){#main-content .premium-category{transition:none}}
/* Keep category names readable and the client controls in a deliberate two-row layout. */
#clients-list td:nth-child(3) {min-width:170px}
#clients-list .loyalty-chip {overflow-wrap:normal;max-width:none}
#clients-list .loyalty-chip span {white-space:nowrap}
#client-base-panel>.toolbar {display:grid;grid-template-columns:minmax(200px,1fr) minmax(170px,.55fr) minmax(150px,.45fr) auto;gap:16px}
#client-base-panel>.toolbar>input {min-width:0;width:100%;align-self:end}
#client-base-panel>.toolbar>.toolbar-filter {display:grid;gap:7px;min-width:0;width:100%}
#client-base-panel>.toolbar>.toolbar-filter .bl-select {width:100%;min-width:0}
#client-base-panel>.toolbar>#new-client-btn {order:0;margin:0;align-self:end}
.premium-client-tools {grid-column:1/-1;display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-top:12px;border-top:1px solid var(--ws-line-soft)}
#main-content .premium-client-tools :is(button,.import-btn) {font-size:13px;padding:7px 12px;min-height:36px;margin:0}
@media(max-width:1199px){#client-base-panel>.toolbar{grid-template-columns:1fr 1fr}#client-base-panel>.toolbar>input{grid-column:1/-1}#client-base-panel>.toolbar>#new-client-btn{justify-self:start}}
@media(max-width:520px){#client-base-panel>.toolbar{grid-template-columns:1fr}#client-base-panel>.toolbar>#new-client-btn{justify-self:stretch}.premium-client-tools{gap:4px}}