/* Appointments — public book + owner diary (on-brand, high contrast) */

:root {
  --appt-gold: #d4a017;
  --appt-gold-hi: #f0c040;
  --appt-gold-deep: #a67c0a;
  --appt-teal: #3dd6c6;
  --appt-teal-hi: #6fe0d4;
  --appt-ink: #14110a;
  --appt-card: var(--card, #1c2722);
  --appt-line: var(--line, #3a4d43);
  --appt-text: var(--text, #f4f1ea);
  --appt-muted: var(--muted, #b7c0b8);
  --appt-soft: var(--bg-soft, #17201c);
}

.book-page .book-main {
  max-width: 920px;
  margin-inline: auto;
}

.book-topbar {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 0.75rem 1.25rem;
  max-width: 920px;
  margin-inline: auto;
}

.book-footer {
  text-align: center;
  color: var(--appt-muted);
  font-size: 0.9rem;
  padding: 1.5rem 1rem;
}

.book-footer-brand a {
  text-decoration: none;
  color: var(--appt-teal);
  font-weight: 700;
}

.book-profile {
  margin: 0 0 1.25rem;
  padding: 1.15rem 1.35rem;
  border-radius: 1rem;
  border: 1.5px solid color-mix(in srgb, var(--appt-gold) 45%, var(--appt-line));
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--appt-gold) 14%, transparent), transparent 55%),
    var(--appt-card);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
}

.book-profile h2 {
  margin: 0 0 0.25rem;
  font-size: 1.35rem;
  color: var(--appt-gold-hi);
}

.book-profile .book-profession {
  margin: 0 0 0.65rem;
  color: var(--appt-teal);
  font-weight: 700;
}

.book-profile .book-services,
.book-profile .book-address,
.book-profile .book-contacts {
  margin: 0.35rem 0;
  font-size: 0.95rem;
}

.book-profile .book-contacts a {
  direction: ltr;
  unicode-bidi: isolate;
  color: var(--appt-teal-hi, #6fe0d4);
  font-weight: 600;
}

.book-layout {
  display: grid;
  gap: 1.25rem;
}

.book-panel {
  padding: 1.25rem 1.35rem;
  border: 1.5px solid var(--appt-line);
  background: var(--appt-card);
  border-radius: var(--radius, 16px);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.3);
}

.book-biz {
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0 0 0.35rem;
}

.book-meta {
  margin: 0 0 1rem;
  color: var(--appt-muted);
  font-size: 0.95rem;
}

/* ---- 16-day geometric grid: 4×4 phone / 2×8 desktop ---- */
.book-day-row,
.book-day-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.55rem;
  margin: 0.75rem 0 1.1rem;
}

@media (min-width: 720px) {
  .book-day-row,
  .book-day-grid {
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 0.6rem;
  }
}

.book-day-btn {
  appearance: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.12rem;
  min-height: 2.85rem;
  padding: 0.28rem 0.2rem;
  margin: 0;
  border-radius: 12px;
  border: 2px solid color-mix(in srgb, var(--appt-teal) 70%, #1a2a24);
  background: linear-gradient(180deg, #2c3f36 0%, #1a2620 100%);
  color: #fff8e8;
  cursor: pointer;
  font: inherit;
  line-height: 1.15;
  text-align: center;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 4px 12px rgba(0,0,0,0.25);
  transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.book-day-btn:hover {
  border-color: var(--appt-teal);
  color: var(--appt-teal-hi, #6fe0d4);
  background: linear-gradient(180deg, #2a3c34 0%, #1a2621 100%);
}

.book-day-btn.is-active {
  background: linear-gradient(145deg, var(--appt-gold-hi) 0%, var(--appt-gold) 55%, var(--appt-gold-deep) 100%);
  color: var(--appt-ink);
  border-color: #ffe08a;
  font-weight: 800;
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--appt-gold) 70%, transparent),
    0 8px 20px rgba(212, 160, 23, 0.35);
}

.book-day-btn.is-active .book-day-wd,
.book-day-btn.is-active .book-day-mo {
  color: inherit;
  opacity: 0.85;
}

.book-day-btn:disabled,
.book-day-btn.is-disabled {
  opacity: 0.38;
  cursor: not-allowed;
  filter: grayscale(0.35);
  border-color: var(--appt-line);
  background: var(--appt-soft);
  color: var(--appt-muted);
  box-shadow: none;
}

.book-day-wd {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: var(--appt-teal-hi);
  text-transform: capitalize;
}

.book-day-num {
  font-size: 1.05rem;
  font-weight: 800;
  line-height: 1;
  color: #fffaf0;
}

.book-day-mo {
  font-size: 0.7rem;
  font-weight: 700;
  color: #d7c48a;
  text-transform: capitalize;
}

/* Time slots — same geometric language, denser */
.book-slots > p {
  grid-column: 1 / -1;
  margin: 0.25rem 0;
}

.book-slots {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.5rem;
  margin: 0.5rem 0 1.25rem;
  min-height: 2.5rem;
}

@media (min-width: 720px) {
  .book-slots {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
}

.book-slot-btn {
  appearance: none;
  margin: 0;
  min-height: 2.15rem;
  padding: 0.32rem 0.25rem;
  border-radius: 10px;
  border: 2px solid color-mix(in srgb, var(--appt-gold) 55%, #2a3a32);
  background: linear-gradient(180deg, #2a3831 0%, #17211c 100%);
  color: #fff8e8;
  cursor: pointer;
  font: inherit;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
  direction: ltr;
  unicode-bidi: isolate;
  box-shadow: 0 3px 10px rgba(0,0,0,0.22);
}

.book-slot-btn:hover {
  border-color: var(--appt-gold);
  color: var(--appt-gold-hi);
}

.book-slot-btn.is-active {
  background: linear-gradient(145deg, var(--appt-teal) 0%, #2bb8aa 100%);
  color: #062421;
  border-color: #9ff0e6;
  font-weight: 800;
  box-shadow: 0 6px 16px rgba(61, 214, 198, 0.32);
}

.book-slot-btn:disabled {
  opacity: 0.38;
  cursor: not-allowed;
  filter: grayscale(0.35);
}

.book-form {
  display: grid;
  gap: 0.75rem;
  margin-top: 0.5rem;
}

.book-form .auth-field {
  display: grid;
  gap: 0.35rem;
  font-weight: 600;
}

.book-form textarea,
.book-form input[type="text"],
.book-form input[type="email"],
.book-form input[type="tel"],
.book-form input[type="date"],
.book-form select {
  font: inherit;
  font-weight: 500;
  padding: 0.55rem 0.7rem;
  border-radius: 0.55rem;
  border: 1.5px solid var(--appt-line);
  background: #121916;
  color: var(--appt-text);
}

.book-form textarea:focus,
.book-form input:focus,
.book-form select:focus {
  outline: none;
  border-color: var(--appt-teal);
  box-shadow: 0 0 0 2px rgba(61, 214, 198, 0.25);
}

.book-form textarea {
  min-height: 4.5rem;
  resize: vertical;
}

.book-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: center;
  margin-top: 0.35rem;
}

.book-msg {
  margin: 0.75rem 0 0;
  font-size: 0.95rem;
  font-weight: 600;
}

.book-msg.is-error {
  color: #ff7a7a;
}

.book-msg.is-ok {
  color: #3dd68a;
}

.book-success {
  text-align: center;
  padding: 1.5rem 1rem;
}

.book-success h2 {
  color: var(--appt-gold-hi);
}

/* Account panel appointments block */
.appt-account {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1.5px solid color-mix(in srgb, var(--appt-gold) 30%, var(--appt-line));
}

.appt-account h3 {
  margin: 0 0 0.5rem;
  font-size: 1.05rem;
  color: var(--appt-gold-hi);
}

.appt-link-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin: 0.5rem 0 1rem;
}

.appt-link-row code {
  font-size: 0.85rem;
  word-break: break-all;
  direction: ltr;
  unicode-bidi: isolate;
  padding: 0.25rem 0.5rem;
  border-radius: 0.4rem;
  background: #121916;
  border: 1px solid var(--appt-line);
  color: var(--appt-teal);
}

.appt-weekly {
  display: grid;
  gap: 0.55rem;
  margin: 0.75rem 0;
}

.appt-weekly-row {
  display: grid;
  grid-template-columns: 6.5rem 1fr;
  gap: 0.5rem;
  align-items: start;
}

.appt-weekly-row span {
  font-weight: 700;
  color: var(--appt-teal);
}

.appt-weekly-row input,
.appt-onboarding input,
.appt-onboarding select,
.appt-onboarding textarea,
.appt-diary-head input[type="date"],
.appt-crm input {
  font: inherit;
  padding: 0.4rem 0.55rem;
  border-radius: 0.45rem;
  border: 1.5px solid var(--appt-line);
  background: #121916;
  color: var(--appt-text);
  direction: ltr;
  unicode-bidi: isolate;
}

.appt-onboarding {
  display: grid;
  gap: 0.75rem;
  margin: 0.75rem 0 1.25rem;
}

.appt-diary-head {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
  margin: 0.75rem 0;
  padding: 0.65rem 0.8rem;
  border-radius: 0.75rem;
  border: 1.5px solid var(--appt-line);
  background: var(--appt-soft);
}

.appt-status-pill {
  display: inline-block;
  font-size: 0.8rem;
  font-weight: 700;
  padding: 0.2rem 0.65rem;
  border-radius: 999px;
  border: 1.5px solid var(--appt-line);
  background: #121916;
}

.appt-status-pill.is-pending {
  border-color: var(--appt-gold);
  color: var(--appt-gold-hi);
  background: color-mix(in srgb, var(--appt-gold) 16%, #121916);
}

.appt-status-pill.is-booked {
  border-color: #2ecc71;
  color: #7dffb0;
  background: color-mix(in srgb, #2ecc71 16%, #121916);
}

.appt-status-pill.is-cancelled,
.appt-status-pill.is-expired {
  border-color: #c07070;
  color: #ffb0b0;
  background: color-mix(in srgb, #c07070 14%, #121916);
}

.appt-bookings {
  list-style: none;
  margin: 0.5rem 0 0;
  padding: 0;
  display: grid;
  gap: 0.65rem;
}

.appt-bookings li {
  border: 1.5px solid color-mix(in srgb, var(--appt-teal) 28%, var(--appt-line));
  border-radius: 0.75rem;
  padding: 0.75rem 0.9rem;
  background: linear-gradient(160deg, #203029 0%, var(--appt-card) 70%);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.22);
}

.appt-bookings li header {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.appt-bookings li header strong {
  color: var(--appt-gold-hi);
}

.appt-crm {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1.5px solid var(--appt-line);
}

.appt-crm-results {
  list-style: none;
  margin: 0.5rem 0 0;
  padding: 0;
  display: grid;
  gap: 0.45rem;
}

.appt-crm-results li {
  border: 1.5px solid var(--appt-line);
  border-radius: 0.55rem;
  padding: 0.55rem 0.7rem;
  cursor: pointer;
  background: var(--appt-soft);
}

.appt-crm-results li:hover {
  border-color: var(--appt-teal);
  background: #1e2c26;
}

/* Monthly Excel export + retention banner */
.appt-export {
  margin: 0.75rem 0 1.25rem;
  padding: 0.9rem 1.05rem;
  border: 1.5px solid color-mix(in srgb, var(--appt-gold) 55%, var(--appt-line));
  border-radius: 0.85rem;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--appt-gold) 18%, transparent), transparent 60%),
    var(--appt-soft);
}

.appt-export-banner {
  margin: 0 0 0.65rem;
  padding: 0.6rem 0.75rem;
  border-radius: 0.55rem;
  background: color-mix(in srgb, var(--appt-gold) 22%, #1a1608);
  border: 1.5px solid var(--appt-gold);
  color: var(--appt-gold-hi);
  font-weight: 700;
}

.appt-export-retention {
  font-size: 0.9rem;
  line-height: 1.45;
  margin: 0.35rem 0 0.75rem;
  color: var(--appt-muted);
}

.appt-export-actions {
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

@media (max-width: 640px) {
  .appt-weekly-row {
    grid-template-columns: 1fr;
  }

  .book-day-btn {
    min-height: 2.65rem;
  }

  .book-day-num {
    font-size: 0.98rem;
  }

  .book-slot-btn {
    min-height: 2rem;
    padding: 0.28rem 0.2rem;
    font-size: 0.88rem;
  }

  .book-day-row,
  .book-day-grid {
    gap: 0.4rem;
    margin: 0.45rem 0 0.75rem;
  }

  .book-slots {
    gap: 0.35rem;
    margin: 0.35rem 0 0.85rem;
  }

  .book-panel {
    padding: 0.85rem 0.95rem;
  }
}

/* Narrow phones: keep 4-col geometry, tighten */
@media (max-width: 380px) {
  .book-day-row,
  .book-day-grid,
  .book-slots {
    gap: 0.4rem;
  }

  .book-day-wd,
  .book-day-mo {
    font-size: 0.64rem;
  }
}


/* Email notification toggle */
.appt-notify-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
}
.appt-notify-toggle input[type="checkbox"] {
  width: 1.15rem;
  height: 1.15rem;
  accent-color: #1a7f4b;
  cursor: pointer;
}

/* ---- Year-capable month calendar (book + manage) ---- */
.book-calendar {
  margin: 0.75rem 0 1.1rem;
}

.book-cal-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 0.65rem;
}

.book-cal-title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  flex: 1 1 auto;
  min-width: 0;
}

.book-cal-title strong {
  font-size: 1.05rem;
}

.book-cal-jump {
  max-width: 100%;
  font: inherit;
  padding: 0.25rem 0.45rem;
  border-radius: 8px;
  border: 1px solid var(--appt-line, #3a4a42);
  background: var(--appt-soft, #1a2620);
  color: inherit;
}

.book-cal-weekdays {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 0.3rem;
  margin-bottom: 0.3rem;
  text-align: center;
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--appt-teal-hi, #6fe0d4);
  text-transform: capitalize;
}

.book-cal-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 0.35rem;
}

.book-cal-day {
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 2.6rem;
  margin: 0;
  padding: 0.35rem 0.15rem;
  border-radius: 10px;
  border: 1.5px solid color-mix(in srgb, var(--appt-teal, #2bbbad) 55%, #1a2a24);
  background: linear-gradient(180deg, #2c3f36 0%, #1a2620 100%);
  color: #fff8e8;
  cursor: pointer;
  font: inherit;
  font-weight: 700;
}

.book-cal-day:hover:not(:disabled) {
  border-color: var(--appt-teal, #2bbbad);
  color: var(--appt-teal-hi, #6fe0d4);
}

.book-cal-day.is-active {
  background: linear-gradient(145deg, var(--appt-gold-hi, #ffe08a) 0%, var(--appt-gold, #d4a017) 55%, var(--appt-gold-deep, #a67c00) 100%);
  color: var(--appt-ink, #1a1408);
  border-color: #ffe08a;
  font-weight: 800;
}

.book-cal-day.is-today:not(.is-active) {
  box-shadow: inset 0 0 0 1.5px var(--appt-teal-hi, #6fe0d4);
}

.book-cal-day.is-empty,
.book-cal-day.is-disabled,
.book-cal-day:disabled {
  opacity: 0.35;
  cursor: default;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.book-cal-day.is-empty {
  visibility: hidden;
}

.book-cal-num {
  font-size: 0.95rem;
  line-height: 1;
}

/* Manage page */
.manage-page .manage-main {
  max-width: min(1600px, 100%);
  margin-inline: auto;
}

.manage-links {
  margin-bottom: 1rem;
}

.manage-links-title {
  margin: 0 0 0.55rem;
  font-size: 1.05rem;
}

.manage-link-row,
.appt-isolated-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
  margin: 0.35rem 0 0.55rem;
}

.appt-manage-cta {
  font-weight: 800;
}

.appt-manage-hint {
  margin: 0 0 0.75rem;
  font-size: 0.9rem;
}

.manage-slug-line {
  margin: 0.25rem 0 0;
  word-break: break-all;
}

.manage-diary-block {
  margin-top: 1.25rem;
}

.manage-diary-block h2 {
  margin: 0 0 0.5rem;
  font-size: 1.15rem;
}

.appt-card {
  border: 1px solid var(--appt-line, #3a4a42);
  border-radius: 12px;
  padding: 0.75rem 0.9rem;
  margin: 0.55rem 0;
  background: var(--appt-soft, #1a2620);
}

.appt-card-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.35rem;
  margin-bottom: 0.35rem;
}

.appt-status {
  font-size: 0.85rem;
  font-weight: 700;
}

.appt-card.is-booked .appt-status { color: var(--appt-teal-hi, #6fe0d4); }
.appt-card.is-pending .appt-status { color: var(--appt-gold, #d4a017); }
.appt-card.is-cancelled .appt-status,
.appt-card.is-expired .appt-status { color: var(--appt-muted, #9aa89f); }

.appt-client { margin: 0.15rem 0; }
.appt-note { margin: 0.25rem 0; font-size: 0.92rem; }

@media (max-width: 520px) {
  .book-cal-day { min-height: 2.35rem; }
  .book-cal-num { font-size: 0.88rem; }
  .book-cal-nav { gap: 0.35rem; }
}


/* Manage calendar: full-width cells with counts + closed + day menu */
.manage-page .manage-main,
.manage-page .manage-panel,
.manage-page .book-calendar,
.manage-page .manage-calendar {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.manage-page .book-cal-grid,
.manage-page .manage-cal-grid {
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 0.45rem;
}

.manage-page .book-cal-day,
.manage-page .manage-cal-day {
  position: relative;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  min-height: 2.9rem;
  padding: 0.28rem 0.28rem 0.32rem;
  text-align: start;
  gap: 0.12rem;
  overflow: visible;
}

.manage-page .book-cal-num,
.manage-page .manage-cal-day .book-cal-num {
  font-size: 0.85rem;
  font-weight: 700;
  opacity: 0.9;
}

.manage-cal-meta {
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--appt-teal-hi, #6fe0d4);
  overflow-wrap: anywhere;
}

.manage-cal-day.is-free .manage-cal-meta {
  color: var(--appt-muted, #9aa89f);
  font-weight: 600;
}

.manage-cal-day.is-closed {
  background: linear-gradient(180deg, #3a2a2a 0%, #241818 100%);
  border-color: color-mix(in srgb, #c45c5c 55%, #3a2a2a);
}

.manage-cal-day.is-closed .manage-cal-meta {
  color: #ffb4b4;
}

.manage-day-menu {
  position: absolute;
  inset-inline-end: 0.15rem;
  top: 0.1rem;
}

.manage-day-menu-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 999px;
  border: 1px solid transparent;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
  opacity: 0.75;
}

.manage-day-menu-btn:hover,
.manage-day-menu.is-open .manage-day-menu-btn {
  opacity: 1;
  border-color: color-mix(in srgb, var(--appt-teal, #2bbbad) 50%, transparent);
  background: rgba(0,0,0,0.25);
}

.manage-day-menu-panel {
  display: none;
  position: absolute;
  inset-inline-end: 0;
  top: 1.45rem;
  z-index: 40;
  min-width: 10rem;
  padding: 0.35rem;
  border-radius: 10px;
  border: 1px solid var(--appt-line, #3a4a42);
  background: var(--appt-card, #1c2722);
  box-shadow: 0 10px 24px rgba(0,0,0,0.35);
}
.manage-day-menu.is-open {
  z-index: 45;
}
.manage-cal-day.is-open-menu,
.manage-page .manage-cal-day:has(.manage-day-menu.is-open) {
  z-index: 30;
  overflow: visible;
}

.manage-day-menu.is-open .manage-day-menu-panel {
  display: grid;
  gap: 0.2rem;
}

.manage-day-menu-panel button {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: start;
  padding: 0.4rem 0.5rem;
  border-radius: 8px;
  cursor: pointer;
}

.manage-day-menu-panel button:hover {
  background: color-mix(in srgb, var(--appt-teal, #2bbbad) 18%, transparent);
}

.manage-range-box {
  margin-top: 0.85rem;
  padding: 0.75rem 0.9rem;
  border-radius: 12px;
  border: 1px solid var(--appt-line, #3a4a42);
  background: var(--appt-soft, #1a2620);
}

.manage-range-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: end;
}

.manage-settings,
.manage-settings-form,
.appt-account,
.appt-onboarding {
  max-width: 100%;
  overflow-x: hidden;
}

.manage-settings-form textarea,
.manage-settings-form input,
.manage-settings-form select,
.appt-account textarea,
.appt-account input,
.appt-account select,
.appt-onboarding textarea,
.appt-onboarding input {
  max-width: 100%;
  box-sizing: border-box;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.manage-closed-banner {
  color: #ffb4b4;
  font-weight: 700;
}

@media (max-width: 720px) {
  .manage-page .book-cal-day,
  .manage-page .manage-cal-day {
    min-height: 2.55rem;
    padding: 0.22rem 0.18rem 0.28rem;
    gap: 0.08rem;
  }
  .manage-page .book-cal-num,
  .manage-page .manage-cal-day .book-cal-num {
    font-size: 0.78rem;
  }
  .manage-cal-meta { font-size: 0.62rem; line-height: 1.15; }
  .manage-page .book-cal-grid,
  .manage-page .manage-cal-grid {
    gap: 0.28rem;
  }
}


/* === UX5: public book font consistency === */
.book-page,
.book-page .book-main,
.book-page .book-panel,
.book-page .book-form,
.book-page .book-slots,
.book-page .book-cal-day,
.book-page .book-cal-num,
.book-page .book-slot-btn,
.book-page .auth-field,
.book-page .auth-field input,
.book-page .auth-field select,
.book-page .auth-field textarea,
.book-page .book-msg,
.book-page label,
.book-page legend,
.book-page button {
  font-family: "Segoe UI", Tahoma, Arial, "Noto Sans Arabic", "Segoe UI Historic", sans-serif;
}

.book-page .book-panel,
.book-page .book-form .auth-field,
.book-page .book-msg,
.book-page .book-meta {
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.45;
}

.book-page .book-form .auth-field,
.book-page .book-person-type legend {
  font-weight: 600;
}

.book-page .book-cal-num,
.book-page .book-slot-btn,
.book-page .book-cal-day {
  font-size: 0.95rem;
  font-weight: 700;
}

.book-page .book-form input,
.book-page .book-form select,
.book-page .book-form textarea {
  font-size: 1rem;
  font-weight: 400;
}

/* Closed / holiday on PUBLIC book calendar — strong red, not bookable */
.book-cal-day.is-closed,
.book-cal-day.is-closed.is-disabled,
.book-cal-day.is-closed:disabled {
  opacity: 1 !important;
  cursor: not-allowed !important;
  color: #ffe8e8 !important;
  background: linear-gradient(180deg, #8b2e2e 0%, #5c1a1a 100%) !important;
  border-color: #c45c5c !important;
  box-shadow: none !important;
  pointer-events: none;
}

.book-cal-day.is-closed .book-cal-num {
  color: #ffd0d0;
  font-weight: 800;
}

.book-cal-day.is-closed.is-active {
  /* closed day must never look selected/bookable */
  background: linear-gradient(180deg, #8b2e2e 0%, #5c1a1a 100%) !important;
  color: #ffe8e8 !important;
  border-color: #e07070 !important;
}

.book-person-type {
  border: 1.5px solid var(--appt-line, #3a4d43);
  border-radius: 0.65rem;
  padding: 0.65rem 0.8rem;
  margin: 0 0 0.85rem;
  display: grid;
  gap: 0.35rem;
}

.book-person-type legend {
  padding: 0 0.35rem;
  color: var(--appt-teal, #3dd6c6);
}

.book-radio {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-inline-end: 1rem;
  font-weight: 600;
  cursor: pointer;
}

/* Multi-range weekly hours editor */
.appt-weekly-day {
  display: grid;
  gap: 0.4rem;
  padding: 0.55rem 0.65rem;
  border: 1px solid var(--appt-line, #3a4d43);
  border-radius: 0.65rem;
  background: color-mix(in srgb, var(--appt-soft, #17201c) 80%, #000);
}

.appt-weekly-day-head {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
  justify-content: space-between;
}

.appt-weekly-day-label {
  font-weight: 700;
  color: var(--appt-teal, #3dd6c6);
}

.appt-weekly-ranges {
  display: grid;
  gap: 0.35rem;
}

.appt-weekly-range {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
}

.appt-weekly-range input[type="time"] {
  font: inherit;
  padding: 0.35rem 0.45rem;
  border-radius: 0.45rem;
  border: 1.5px solid var(--appt-line, #3a4d43);
  background: #121916;
  color: var(--appt-text, #f4f1ea);
  direction: ltr;
  unicode-bidi: isolate;
  min-width: 7.5rem;
}

.appt-weekly-range .appt-range-sep {
  opacity: 0.8;
  font-weight: 700;
}

.appt-weekly-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.appt-weekly-actions .btn,
.appt-weekly-range .btn {
  font-size: 0.85rem;
  padding: 0.25rem 0.55rem;
}

.appt-weekly-empty {
  font-size: 0.85rem;
  color: var(--appt-muted, #b7c0b8);
}


html[data-theme="light"] {
  --appt-card: var(--card);
  --appt-line: var(--line);
  --appt-text: var(--text);
  --appt-muted: var(--muted);
  --appt-soft: var(--bg-soft);
}
html[data-theme="light"] .appt-shell,
html[data-theme="light"] .appt-card,
html[data-theme="light"] .appt-day,
html[data-theme="light"] .appt-slot {
  background: var(--card);
  color: var(--text);
  border-color: var(--line);
}

/* fix-close-ban light contrast + image frames */
html[data-theme="light"],
html.ak-light {
  --appt-text: #14201c;
  --appt-muted: #3f4d46;
  --appt-line: #bdb6a8;
  --appt-card: #ffffff;
}
html[data-theme="light"] .appt-shell,
html[data-theme="light"] .appt-card,
html[data-theme="light"] .appt-day,
html[data-theme="light"] .appt-slot,
html.ak-light .appt-shell,
html.ak-light .appt-card,
html.ak-light .appt-day,
html.ak-light .appt-slot {
  background: #ffffff;
  color: #14201c;
  border-color: #bdb6a8;
}
html[data-theme="light"] .appt-shell .muted,
html[data-theme="light"] .appt-card .muted,
html.ak-light .appt-shell .muted,
html.ak-light .appt-card .muted {
  color: #3f4d46 !important;
}
html[data-theme="light"] .appt-card img,
html[data-theme="light"] .appt-shell img,
html.ak-light .appt-card img,
html.ak-light .appt-shell img {
  border: 1px solid #b0a898;
  box-shadow: 0 0 0 2px rgba(255,255,255,0.9), 0 4px 12px rgba(20,32,28,0.12);
  background: #fff;
  border-radius: 10px;
}


/* === fix-mobile-day-logo: compact empty states + book header + LIGHT surfaces === */
.book-site-header {
  max-width: 920px;
  margin-inline: auto;
  width: 100%;
}
.book-page .site-header.book-site-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.65rem 1.1rem;
  flex-wrap: wrap;
}
.book-page .site-header .logo {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  text-decoration: none;
  color: inherit;
}
.book-page .site-header .logo img {
  height: 2.35rem;
  width: auto;
  display: block;
}
.book-page .site-header .logo span {
  font-weight: 800;
  font-size: 1rem;
}

/* Empty diary / muted empty appointment boxes — compact */
.manage-page [data-appt-diary] > .muted,
.manage-page .appt-card.is-empty,
.book-page .book-slots > .muted,
.account-page .panel > .muted:only-child,
.account-page [data-appt-diary] > .muted,
.account-page .appt-empty,
.account-page .empty-appts {
  margin: 0.35rem 0;
  padding: 0.55rem 0.7rem;
  min-height: 0;
}

.manage-cal-day.is-free .manage-cal-meta {
  opacity: 0.85;
}

html[data-theme="light"] .book-day-btn,
html.ak-light .book-day-btn {
  background: linear-gradient(180deg, #ffffff 0%, #f3efe6 100%);
  color: #14201c;
  border-color: color-mix(in srgb, var(--appt-teal, #0b7a70) 55%, #bdb6a8);
  box-shadow: 0 2px 8px rgba(20, 32, 28, 0.08);
}
html[data-theme="light"] .book-day-btn:hover,
html.ak-light .book-day-btn:hover {
  background: #ffffff;
  color: #0b7a70;
  border-color: var(--appt-teal, #0b7a70);
}
html[data-theme="light"] .book-day-btn.is-active,
html.ak-light .book-day-btn.is-active {
  background: linear-gradient(145deg, #ffe08a 0%, #d4a017 55%, #a67c00 100%);
  color: #1a1408;
  border-color: #c9a227;
}
html[data-theme="light"] .book-day-wd,
html.ak-light .book-day-wd {
  color: #0b7a70;
}
html[data-theme="light"] .book-day-num,
html.ak-light .book-day-num {
  color: #14201c;
}
html[data-theme="light"] .book-day-mo,
html.ak-light .book-day-mo {
  color: #7a5a00;
}
html[data-theme="light"] .book-day-btn:disabled,
html[data-theme="light"] .book-day-btn.is-disabled,
html.ak-light .book-day-btn:disabled,
html.ak-light .book-day-btn.is-disabled {
  background: #ebe6dc;
  color: #6a7670;
  border-color: #cfc8ba;
}

html[data-theme="light"] .book-slot-btn,
html.ak-light .book-slot-btn {
  background: linear-gradient(180deg, #ffffff 0%, #f6f2ea 100%);
  color: #14201c;
  border-color: color-mix(in srgb, var(--appt-gold, #9a7209) 45%, #bdb6a8);
  box-shadow: 0 2px 6px rgba(20, 32, 28, 0.07);
}
html[data-theme="light"] .book-slot-btn:hover,
html.ak-light .book-slot-btn:hover {
  color: #7a5a00;
  border-color: #9a7209;
}
html[data-theme="light"] .book-slot-btn.is-active,
html.ak-light .book-slot-btn.is-active {
  background: linear-gradient(145deg, #3dd6c6 0%, #0b7a70 100%);
  color: #062421;
  border-color: #2bb8aa;
}

html[data-theme="light"] .book-cal-day,
html[data-theme="light"] .manage-cal-day,
html.ak-light .book-cal-day,
html.ak-light .manage-cal-day {
  background: linear-gradient(180deg, #ffffff 0%, #f3efe6 100%);
  color: #14201c;
  border-color: color-mix(in srgb, #0b7a70 40%, #bdb6a8);
}
html[data-theme="light"] .book-cal-day:hover:not(:disabled),
html.ak-light .book-cal-day:hover:not(:disabled) {
  border-color: #0b7a70;
  color: #0b7a70;
}
html[data-theme="light"] .book-cal-day.is-active,
html[data-theme="light"] .manage-cal-day.is-active,
html.ak-light .book-cal-day.is-active,
html.ak-light .manage-cal-day.is-active {
  background: linear-gradient(145deg, #ffe08a 0%, #d4a017 55%, #a67c00 100%);
  color: #1a1408;
  border-color: #c9a227;
}
html[data-theme="light"] .manage-cal-meta,
html.ak-light .manage-cal-meta {
  color: #0b7a70;
}
html[data-theme="light"] .manage-cal-day.is-free .manage-cal-meta,
html.ak-light .manage-cal-day.is-free .manage-cal-meta {
  color: #5a6660;
}
html[data-theme="light"] .manage-cal-day.is-closed,
html.ak-light .manage-cal-day.is-closed {
  background: linear-gradient(180deg, #f8e4e4 0%, #f0d0d0 100%);
  border-color: #c45c5c;
  color: #5c1a1a;
}
html[data-theme="light"] .manage-cal-day.is-closed .manage-cal-meta,
html.ak-light .manage-cal-day.is-closed .manage-cal-meta {
  color: #8b2e2e;
}
html[data-theme="light"] .book-cal-day.is-closed,
html[data-theme="light"] .book-cal-day.is-closed.is-disabled,
html[data-theme="light"] .book-cal-day.is-closed:disabled,
html.ak-light .book-cal-day.is-closed,
html.ak-light .book-cal-day.is-closed.is-disabled,
html.ak-light .book-cal-day.is-closed:disabled {
  color: #5c1a1a !important;
  background: linear-gradient(180deg, #f0c0c0 0%, #e09090 100%) !important;
  border-color: #c45c5c !important;
}

html[data-theme="light"] .book-panel,
html[data-theme="light"] .book-profile,
html[data-theme="light"] .appt-card,
html[data-theme="light"] .manage-range-box,
html[data-theme="light"] .manage-day-menu-panel,
html.ak-light .book-panel,
html.ak-light .book-profile,
html.ak-light .appt-card,
html.ak-light .manage-range-box,
html.ak-light .manage-day-menu-panel {
  background: #ffffff;
  color: #14201c;
  border-color: #bdb6a8;
  box-shadow: 0 6px 18px rgba(20, 32, 28, 0.08);
}
html[data-theme="light"] .book-cal-jump,
html.ak-light .book-cal-jump {
  background: #ffffff;
  color: #14201c;
  border-color: #bdb6a8;
}
html[data-theme="light"] .book-cal-weekdays,
html.ak-light .book-cal-weekdays {
  color: #0b7a70;
}
html[data-theme="light"] .book-footer,
html.ak-light .book-footer {
  color: #3f4d46;
}
html[data-theme="light"] .book-footer-brand a,
html.ak-light .book-footer-brand a {
  color: #0b7a70;
}
html[data-theme="light"] .book-profile h2,
html.ak-light .book-profile h2 {
  color: #7a5a00;
}


/* === fix-appt-final (2026-09-25): readable inputs day+night, reopen closed days, weekday-closed === */
/* Night (default): native pickers use dark scheme so icons/text stay visible */
.appt-weekly-range input[type="time"],
.appt-diary-head input[type="date"],
.manage-range-row input[type="date"],
.book-form input[type="date"] {
  color-scheme: dark;
  color: var(--appt-text, #f4f1ea);
  -webkit-text-fill-color: currentColor;
}
.appt-weekly-range input[type="time"]::-webkit-datetime-edit,
.book-form input[type="date"]::-webkit-datetime-edit,
.appt-diary-head input[type="date"]::-webkit-datetime-edit,
.manage-range-row input[type="date"]::-webkit-datetime-edit {
  color: inherit;
}

/* Day mode: light surfaces + dark text for every appointments field */
html[data-theme="light"] .appt-weekly-day,
html.ak-light .appt-weekly-day {
  background: #f7f4ee;
  border-color: #c9c1b2;
  color: #14201c;
}
html[data-theme="light"] .appt-weekly-day-label,
html.ak-light .appt-weekly-day-label { color: #0b6a61; }
html[data-theme="light"] .appt-weekly-empty,
html.ak-light .appt-weekly-empty { color: #8a2f2f; font-weight: 600; }
html[data-theme="light"] .appt-weekly-range .appt-range-sep,
html.ak-light .appt-weekly-range .appt-range-sep { color: #14201c; opacity: 1; }
html[data-theme="light"] .appt-weekly-range input[type="time"],
html.ak-light .appt-weekly-range input[type="time"],
html[data-theme="light"] .appt-diary-head input[type="date"],
html.ak-light .appt-diary-head input[type="date"],
html[data-theme="light"] .manage-range-row input[type="date"],
html.ak-light .manage-range-row input[type="date"],
html[data-theme="light"] .book-form input,
html.ak-light .book-form input,
html[data-theme="light"] .book-form select,
html.ak-light .book-form select,
html[data-theme="light"] .book-form textarea,
html.ak-light .book-form textarea,
html[data-theme="light"] .manage-settings-form input:not([type="checkbox"]),
html.ak-light .manage-settings-form input:not([type="checkbox"]),
html[data-theme="light"] .manage-settings-form select,
html.ak-light .manage-settings-form select,
html[data-theme="light"] .manage-settings-form textarea,
html.ak-light .manage-settings-form textarea,
html[data-theme="light"] .appt-account input:not([type="checkbox"]),
html.ak-light .appt-account input:not([type="checkbox"]),
html[data-theme="light"] .appt-account select,
html.ak-light .appt-account select,
html[data-theme="light"] .appt-account textarea,
html.ak-light .appt-account textarea {
  color-scheme: light;
  background: #ffffff !important;
  color: #14201c !important;
  -webkit-text-fill-color: #14201c;
  border-color: #8f887b !important;
}
html[data-theme="light"] .appt-weekly-range .btn,
html.ak-light .appt-weekly-range .btn,
html[data-theme="light"] .appt-weekly-actions .btn,
html.ak-light .appt-weekly-actions .btn {
  background: #ffffff;
  color: #14201c;
  border-color: #8f887b;
}

/* Manage calendar: closed days must stay clickable so ⋮ can reopen / edit */
.manage-cal-day.is-closed,
.manage-cal-day.is-closed.is-disabled {
  pointer-events: auto !important;
  cursor: pointer !important;
}
.manage-cal-day.is-closed .manage-day-menu-btn {
  color: #fff;
  opacity: 0.95;
}
.manage-cal-day.is-weekday-closed,
.book-cal-day.is-weekday-closed {
  background-image: repeating-linear-gradient(135deg, rgba(255,255,255,0.07) 0 6px, transparent 6px 12px),
    linear-gradient(180deg, #8b2e2e 0%, #5c1a1a 100%) !important;
}
.manage-day-menu-panel .manage-day-menu-note {
  display: block;
  padding: 0.35rem 0.5rem;
  font-size: 0.8rem;
  line-height: 1.3;
  opacity: 0.85;
  white-space: normal;
}
.manage-day-menu-panel { color: var(--appt-text, #f4f1ea); }
html[data-theme="light"] .manage-day-menu-panel,
html.ak-light .manage-day-menu-panel { color: #14201c; }

html[data-theme="light"] .book-cal-day.is-closed .book-cal-num,
html.ak-light .book-cal-day.is-closed .book-cal-num,
html[data-theme="light"] .manage-cal-day.is-closed .book-cal-num,
html.ak-light .manage-cal-day.is-closed .book-cal-num {
  color: #6e1515 !important;
  opacity: 1 !important;
}
html[data-theme="light"] .manage-cal-day.is-closed .manage-day-menu-btn,
html.ak-light .manage-cal-day.is-closed .manage-day-menu-btn { color: #6e1515; }

/* Weekly editor: grid row [from] – [to] [×] never overflows narrow screens */
.appt-weekly,
.appt-weekly-day,
.appt-weekly-ranges { min-width: 0; max-width: 100%; box-sizing: border-box; }
.appt-weekly-range {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.35rem;
  width: 100%;
  min-width: 0;
}
.appt-weekly-range input[type="time"] {
  width: 100%;
  min-width: 0 !important;
  max-width: 100%;
  box-sizing: border-box;
  padding-inline: 0.35rem;
}
.appt-weekly-range .btn { min-width: 2rem; padding-inline: 0.4rem; }
@media (max-width: 360px) {
  .appt-weekly-range input[type="time"] { font-size: 0.85rem; padding-inline: 0.2rem; }
}
/* Validation */
.appt-weekly-day.is-invalid { border-color: #d64545 !important; box-shadow: 0 0 0 1px #d64545; }
.appt-weekly-range input.is-invalid {
  border-color: #e05252 !important;
  box-shadow: 0 0 0 2px rgba(224, 82, 82, 0.35);
}
.appt-range-error {
  margin: 0.1rem 0 0.25rem;
  color: #ff9a9a;
  font-size: 0.85rem;
  font-weight: 700;
}
html[data-theme="light"] .appt-range-error,
html.ak-light .appt-range-error { color: #a31d1d; }
.appt-settings-status { font-weight: 600; }
.appt-settings-status.is-ok { color: var(--appt-teal, #3dd6c6); }
.appt-settings-status.is-warn { color: #e0b84d; }
.appt-settings-status.is-error { color: #ff9a9a; }
html[data-theme="light"] .appt-settings-status.is-ok, html.ak-light .appt-settings-status.is-ok { color: #0b6a61; }
html[data-theme="light"] .appt-settings-status.is-warn, html.ak-light .appt-settings-status.is-warn { color: #7a5a00; }
html[data-theme="light"] .appt-settings-status.is-error, html.ak-light .appt-settings-status.is-error { color: #a31d1d; }

/* === Manage: Day / Week / Month views === */
.manage-view-tabs {
  display: inline-flex;
  gap: 0.25rem;
  padding: 0.25rem;
  margin: 0.25rem 0 0.75rem;
  border-radius: 999px;
  border: 1px solid var(--appt-line, #3a4d43);
  background: color-mix(in srgb, var(--appt-soft, #17201c) 85%, #000);
}
.manage-view-tab {
  appearance: none;
  border: 0;
  border-radius: 999px;
  padding: 0.4rem 1.1rem;
  font: inherit;
  font-weight: 700;
  background: transparent;
  color: var(--appt-text, #f4f1ea);
  cursor: pointer;
}
.manage-view-tab.is-active { background: var(--appt-teal, #2bbbad); color: #06201c; }
.manage-view-nav { flex-wrap: wrap; }
.manage-view-nav .book-cal-title { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; min-width: 0; }
.manage-view-jump {
  font: inherit; font-size: 0.85rem; padding: 0.25rem 0.4rem; border-radius: 0.45rem;
  border: 1.5px solid var(--appt-line, #3a4d43); background: #121916; color: var(--appt-text, #f4f1ea);
  color-scheme: dark; max-width: 100%;
}
.manage-day-view { display: grid; gap: 0.65rem; margin-top: 0.6rem; }
.manage-day-head { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; justify-content: space-between; }
.manage-day-total { font-weight: 700; }
.manage-empty-day { padding: 1rem; text-align: center; border: 1px dashed var(--appt-line, #3a4d43); border-radius: 0.75rem; }
.manage-booking-card { padding: 0.8rem 0.95rem; }
.manage-booking-card.is-focused { box-shadow: 0 0 0 3px var(--appt-teal, #2bbbad); }
.manage-booking-dl { display: grid; gap: 0.25rem; margin: 0.35rem 0 0; }
.manage-booking-dl > div { display: grid; grid-template-columns: minmax(6.5rem, max-content) minmax(0, 1fr); gap: 0.5rem; }
.manage-booking-dl dt { font-weight: 700; opacity: 0.85; }
.manage-booking-dl dd { margin: 0; overflow-wrap: anywhere; }
.manage-booking-actions { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0.6rem 0 0; }
.manage-status {
  display: inline-block; padding: 0.1rem 0.55rem; border-radius: 999px; font-size: 0.78rem; font-weight: 700;
  border: 1px solid currentColor; white-space: nowrap;
}
.manage-status.is-pending { color: #f0c24b; }
.manage-status.is-booked { color: #4fd18b; }
.manage-status.is-cancelled, .manage-status.is-expired { color: #ff8f8f; }

.manage-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 0.45rem; margin-top: 0.6rem; }
.manage-week-day {
  min-width: 0; display: flex; flex-direction: column; border-radius: 0.7rem;
  border: 1px solid var(--appt-line, #3a4d43); background: var(--appt-card, #1c2722); overflow: hidden;
}
.manage-week-day.is-today { border-color: var(--appt-teal, #2bbbad); box-shadow: 0 0 0 1px var(--appt-teal, #2bbbad); }
.manage-week-day.is-closed { border-color: #c45c5c; }
.manage-week-head {
  appearance: none; border: 0; font: inherit; cursor: pointer; text-align: start;
  display: grid; gap: 0.1rem; padding: 0.45rem 0.55rem; color: inherit;
  background: color-mix(in srgb, var(--appt-teal, #2bbbad) 14%, transparent);
}
.manage-week-day.is-closed .manage-week-head { background: linear-gradient(180deg, #8b2e2e 0%, #5c1a1a 100%); color: #ffe8e8; }
.manage-week-wd { font-weight: 800; font-size: 0.9rem; }
.manage-week-date { font-size: 0.8rem; opacity: 0.9; }
.manage-week-closed { font-size: 0.75rem; font-weight: 800; }
.manage-week-list { display: grid; gap: 0.3rem; padding: 0.4rem; }
.manage-week-item {
  appearance: none; font: inherit; text-align: start; cursor: pointer; color: inherit;
  display: grid; gap: 0.15rem; padding: 0.35rem 0.45rem; border-radius: 0.5rem;
  border: 1px solid var(--appt-line, #3a4d43); background: rgba(255,255,255,0.03); min-width: 0;
}
.manage-week-item:hover { border-color: var(--appt-teal, #2bbbad); }
.manage-week-time { font-weight: 800; font-size: 0.85rem; }
.manage-week-name { font-size: 0.85rem; overflow-wrap: anywhere; }
.manage-week-item.is-cancelled .manage-week-name, .manage-week-item.is-expired .manage-week-name { text-decoration: line-through; opacity: 0.7; }
.manage-week-empty { margin: 0; font-size: 0.8rem; opacity: 0.7; }
@media (max-width: 760px) {
  .manage-week { grid-template-columns: 1fr; }
  .manage-week-head { grid-template-columns: auto auto 1fr; align-items: baseline; gap: 0.5rem; }
  .manage-week-closed { justify-self: end; }
  .manage-view-tabs { display: flex; width: 100%; }
  .manage-view-tab { flex: 1 1 0; padding-inline: 0.5rem; }
  .manage-booking-dl > div { grid-template-columns: 1fr; gap: 0; }
}

/* Day mode for views */
html[data-theme="light"] .manage-view-tabs, html.ak-light .manage-view-tabs { background: #efe9dd; border-color: #c9c1b2; }
html[data-theme="light"] .manage-view-tab, html.ak-light .manage-view-tab { color: #14201c; }
html[data-theme="light"] .manage-view-tab.is-active, html.ak-light .manage-view-tab.is-active { background: #0b6a61; color: #fff; }
html[data-theme="light"] .manage-view-jump, html.ak-light .manage-view-jump { background: #fff; color: #14201c; border-color: #8f887b; color-scheme: light; }
html[data-theme="light"] .manage-week-day, html.ak-light .manage-week-day { background: #fff; border-color: #c9c1b2; color: #14201c; }
html[data-theme="light"] .manage-week-day.is-today, html.ak-light .manage-week-day.is-today { border-color: #0b6a61; box-shadow: 0 0 0 1px #0b6a61; }
html[data-theme="light"] .manage-week-head, html.ak-light .manage-week-head { background: #e6f2ef; color: #14201c; }
html[data-theme="light"] .manage-week-day.is-closed .manage-week-head, html.ak-light .manage-week-day.is-closed .manage-week-head { background: #f3c9c9; color: #6e1515; }
html[data-theme="light"] .manage-week-item, html.ak-light .manage-week-item { background: #faf8f3; border-color: #c9c1b2; color: #14201c; }
html[data-theme="light"] .manage-status.is-pending, html.ak-light .manage-status.is-pending { color: #8a6100; }
html[data-theme="light"] .manage-status.is-booked, html.ak-light .manage-status.is-booked { color: #13733f; }
html[data-theme="light"] .manage-status.is-cancelled, html[data-theme="light"] .manage-status.is-expired,
html.ak-light .manage-status.is-cancelled, html.ak-light .manage-status.is-expired { color: #a31d1d; }
html[data-theme="light"] .manage-empty-day, html.ak-light .manage-empty-day { border-color: #b9b1a2; }
.manage-view-nav {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 0.4rem;
}
.manage-view-nav .book-cal-title { justify-content: center; text-align: center; }
.manage-view-nav .book-cal-title strong { width: 100%; }
.manage-view-nav .manage-view-jump { width: auto; margin-inline: auto; }
@media (max-width: 760px) {
  .manage-week-item { grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 0.5rem; }
}

/* Owner-only logo-removal line under the footer mark (manage page + owner view of the booking page) */
.book-footer-brand { margin: 0; }
.brand-owner-note { margin-top: 0.35rem; display: grid; gap: 0.15rem; justify-items: center; }
.brand-owner-note p { margin: 0; line-height: 1.5; }
.brand-owner-line { font-size: 0.78rem; font-weight: 400; color: var(--appt-muted); }
.brand-owner-line a { color: inherit; text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1px; }
.brand-owner-line a:hover, .brand-owner-line a:focus-visible { color: var(--appt-teal); }
.brand-owner-line a[aria-busy="true"] { opacity: 0.7; cursor: progress; }
.brand-owner-hint { font-size: 0.7rem; font-weight: 300; color: var(--appt-muted); opacity: 0.75; }
.brand-owner-msg { font-size: 0.78rem; color: var(--appt-teal); }
.brand-owner-err { font-size: 0.72rem; color: #e07a6e; }
html[data-theme="light"] .brand-owner-line, html.ak-light .brand-owner-line,
html[data-theme="light"] .brand-owner-hint, html.ak-light .brand-owner-hint { color: #4a5852; }
html[data-theme="light"] .brand-owner-msg, html.ak-light .brand-owner-msg { color: #0b7a70; }
html[data-theme="light"] .brand-owner-err, html.ak-light .brand-owner-err { color: #b3261e; }
.manage-quota-warn { margin-bottom: 1rem; }
.manage-quota-warn .subs-warn { margin: 0; }

/* Business photo / logo on the public booking page */
.book-profile-head { display: flex; align-items: center; gap: 1rem; margin: 0 0 0.75rem; }
.book-profile-id { min-width: 0; }
.book-profile-id h2 { overflow-wrap: anywhere; }
.book-profile-head .book-profession { margin: 0; }
.book-avatar {
  flex: 0 0 auto;
  width: 80px; height: 80px;
  border-radius: 18px;
  object-fit: cover;
  border: 1px solid color-mix(in srgb, var(--appt-gold) 40%, var(--appt-line));
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.28);
  background: var(--appt-card);
}
.book-avatar-initials {
  display: inline-flex; align-items: center; justify-content: center;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.75rem; font-weight: 700; letter-spacing: 0.04em;
  color: #f3e3b5;
  background: linear-gradient(145deg, #1d3d37, #10241f);
  user-select: none;
}
@media (max-width: 420px) {
  .book-profile-head { gap: 0.8rem; }
  .book-avatar { width: 64px; height: 64px; border-radius: 15px; }
  .book-avatar-initials { font-size: 1.4rem; }
}
html[data-theme="light"] .book-avatar, html.ak-light .book-avatar {
  border-color: #d8cfbd;
  box-shadow: 0 4px 12px rgba(20, 32, 28, 0.12);
}

/* Account page: booking page photo / logo */
.bizphoto h2 { margin: 0 0 0.75rem; font-size: 1.05rem; }
.bizphoto-row { display: flex; gap: 1rem; align-items: flex-start; }
.bizphoto-side { min-width: 0; display: grid; gap: 0.5rem; }
.bizphoto-hint { margin: 0; font-size: 0.85rem; color: var(--appt-muted, var(--muted)); line-height: 1.55; }
.bizphoto-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.bizphoto-pick { cursor: pointer; }
.bizphoto-pick:focus-within { outline: 2px solid var(--appt-teal); outline-offset: 2px; }
.bizphoto-view { font-size: 0.85rem; color: var(--appt-teal); }
.bizphoto-status { margin: 0; font-size: 0.85rem; color: var(--appt-teal); }
.bizphoto-status.is-error { color: #e07a6e; }
.bizphoto.is-busy .bizphoto-img { opacity: 0.55; }
html[data-theme="light"] .bizphoto-status.is-error, html.ak-light .bizphoto-status.is-error { color: #b3261e; }
html[data-theme="light"] .bizphoto-view, html.ak-light .bizphoto-view,
html[data-theme="light"] .bizphoto-status, html.ak-light .bizphoto-status { color: #0b7a70; }
@media (max-width: 420px) { .bizphoto-row { gap: 0.8rem; } }
/* v3: add-on cycle chooser under the footer mark (inline, no card) */
.brand-owner-choose { display: flex; flex-wrap: wrap; gap: 0.25rem 0.75rem; justify-content: center; align-items: center; font-size: 0.74rem; color: var(--appt-muted); margin-top: 0.2rem; }
.brand-owner-choose[hidden] { display: none; }
.brand-owner-choose label { display: inline-flex; gap: 0.3rem; align-items: center; cursor: pointer; white-space: nowrap; }
.brand-owner-choose label bdi { white-space: nowrap; }
.brand-owner-save { white-space: nowrap; }
.brand-owner-choose input[type="radio"] { margin: 0; accent-color: var(--appt-teal); }
.brand-owner-choose input[type="text"] { font: inherit; font-size: 0.74rem; padding: 0.15rem 0.4rem; width: 9.5rem; border-radius: 6px; border: 1px solid color-mix(in srgb, currentColor 35%, transparent); background: transparent; color: inherit; }
.brand-owner-choose a { color: inherit; text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1px; }
.brand-owner-choose a:hover, .brand-owner-choose a:focus-visible { color: var(--appt-teal); }
.brand-owner-choose a[aria-busy="true"] { opacity: 0.7; cursor: progress; }
.brand-owner-save { font-size: 0.66rem; font-weight: 600; padding: 0 0.35rem; border-radius: 999px; color: var(--appt-teal); border: 1px solid color-mix(in srgb, var(--appt-teal) 45%, transparent); }
.brand-owner-actions { white-space: nowrap; }
html[data-theme="light"] .brand-owner-choose, html.ak-light .brand-owner-choose { color: #4a5852; }
html[data-theme="light"] .brand-owner-save, html.ak-light .brand-owner-save { color: #0b7a70; border-color: #0b7a7066; }
/* v3: 500-plan quota notices (manage + account) */
.subs-quota-near { background: color-mix(in srgb, #e0a13c 14%, transparent); border-color: color-mix(in srgb, #e0a13c 50%, transparent); }
.subs-note { margin: 0; padding: 6px 12px; border-radius: 10px; border: 1px solid var(--line, #3334); font-size: 0.84rem; line-height: 1.5; }
.subs-quota-cta { margin: 0; }
.subs-quota-notice { display: grid; gap: 6px; margin-bottom: 12px; }
.subs-quota-notice:empty { display: none; }
.manage-quota-warn { display: grid; gap: 6px; }
.manage-quota-warn .subs-note, .manage-quota-warn .subs-quota-cta { margin: 0; }
/* v4: invoice history (account page) */
.subs-invoice-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.subs-invoice { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 14px; padding: 10px 12px; border: 1px solid var(--line, #3334); border-radius: 12px; }
.subs-invoice-main { min-width: 0; flex: 1 1 220px; }
.subs-invoice-title { font-size: 0.82rem; color: var(--muted, #7a847e); overflow-wrap: anywhere; }
.subs-invoice-side { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }

/* ---- v7: owner inbox (manage page) + in-page booking chat (manage + my-booking) ---- */
.manage-inbox-host:empty { display: none; }
.appt-inbox { margin: 0 0 0.9rem; }
.appt-inbox-bar { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.appt-inbox-tab {
  display: inline-flex; align-items: center; gap: 0.45rem; min-height: 2.5rem; padding: 0.35rem 0.8rem;
  border: 1px solid var(--appt-line); border-radius: 999px; background: var(--appt-card); color: var(--appt-text);
  font: inherit; font-size: 0.9rem; font-weight: 600; cursor: pointer;
}
.appt-inbox-tab:hover, .appt-inbox-tab:focus-visible { border-color: var(--appt-gold); outline: none; }
.appt-inbox-tab.is-open { border-color: var(--appt-gold); box-shadow: inset 0 0 0 1px var(--appt-gold); }
.appt-inbox-tab svg { flex: none; color: var(--appt-gold); }
.appt-badge {
  display: inline-grid; place-items: center; min-width: 1.4rem; height: 1.4rem; padding: 0 0.45rem; border-radius: 999px;
  background: var(--appt-soft); color: var(--appt-muted); font-size: 0.75rem; font-weight: 700; line-height: 1; white-space: nowrap;
}
.appt-badge.is-hot { background: #e5484d; color: #fff; }
.appt-inbox-panel {
  margin-top: 0.55rem; padding: 0.75rem; border: 1px solid var(--appt-line); border-radius: 14px; background: var(--appt-card);
  max-height: min(70vh, 560px); overflow: auto; overscroll-behavior: contain;
}
.appt-inbox-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.4rem; }
.appt-inbox-item {
  width: 100%; display: grid; gap: 0.15rem; text-align: start; padding: 0.55rem 0.7rem; border: 1px solid var(--appt-line);
  border-radius: 10px; background: var(--appt-soft); color: var(--appt-text); font: inherit; cursor: pointer;
}
.appt-inbox-item:hover, .appt-inbox-item:focus-visible { border-color: var(--appt-gold); outline: none; }
.appt-inbox-item.is-unread { border-inline-start: 3px solid #e5484d; }
.appt-inbox-when { font-size: 0.8rem; color: var(--appt-muted); }
.appt-inbox-who { font-size: 0.95rem; display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }
.appt-inbox-sub { font-size: 0.8rem; }
.appt-inbox-snippet { font-size: 0.85rem; color: var(--appt-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.appt-inbox-empty { margin: 0.2rem 0; }
.appt-inbox-note { margin: 0.6rem 0 0; font-size: 0.78rem; }
.appt-thread-head { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.6rem; }
.appt-thread-id { flex: 1 1 10rem; min-width: 0; display: grid; }
.appt-thread-id .muted { font-size: 0.8rem; }
.chat-scroll { max-height: 360px; overflow: auto; padding: 0.25rem 0.1rem; overscroll-behavior: contain; }
.chat-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.55rem; }
.chat-msg { display: grid; justify-items: start; max-width: 100%; }
.chat-msg.is-mine { justify-items: end; }
.chat-bubble {
  max-width: min(85%, 34rem); padding: 0.5rem 0.75rem; border-radius: 14px 14px 14px 4px;
  background: var(--appt-soft); border: 1px solid var(--appt-line); color: var(--appt-text);
}
.chat-msg.is-mine .chat-bubble { border-radius: 14px 14px 4px 14px; background: color-mix(in srgb, var(--appt-gold) 16%, var(--appt-card)); border-color: color-mix(in srgb, var(--appt-gold) 45%, var(--appt-line)); }
[dir="rtl"] .chat-bubble { border-radius: 14px 14px 4px 14px; }
[dir="rtl"] .chat-msg.is-mine .chat-bubble { border-radius: 14px 14px 14px 4px; }
.chat-msg.is-new .chat-bubble { box-shadow: 0 0 0 2px color-mix(in srgb, #e5484d 55%, transparent); }
.chat-body { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.5; font-size: 0.93rem; }
.chat-meta { margin: 0.2rem 0.2rem 0; font-size: 0.72rem; color: var(--appt-muted); display: flex; gap: 0.3rem; align-items: center; flex-wrap: wrap; }
.chat-read { color: var(--appt-teal); }
.chat-del { border: 0; background: none; color: var(--appt-muted); font: inherit; font-size: 0.72rem; text-decoration: underline; cursor: pointer; padding: 0 0.2rem; }
.chat-del:hover, .chat-del:focus-visible { color: #e5484d; }
.chat-empty { margin: 0.3rem 0; }
.chat-compose { margin-top: 0.7rem; display: grid; gap: 0.4rem; }
.chat-compose textarea {
  width: 100%; box-sizing: border-box; min-height: 3.2rem; resize: vertical; padding: 0.55rem 0.7rem; border-radius: 10px;
  border: 1px solid var(--appt-line); background: var(--appt-soft); color: var(--appt-text); font: inherit; line-height: 1.45;
}
.chat-compose textarea:focus-visible { outline: 2px solid var(--appt-gold); outline-offset: 1px; }
.chat-compose-row { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; }
.chat-count { font-size: 0.75rem; }
.chat-err { margin: 0; color: #e07a6e; font-size: 0.85rem; }
.chat-closed { margin: 0.6rem 0 0; font-size: 0.85rem; }
/* my-booking page */
.my-booking-main { max-width: 760px; margin-inline: auto; display: grid; gap: 1rem; }
.my-booking-title { font-size: 1.2rem; margin: 0 0 0.6rem; }
.my-booking-dl { display: grid; gap: 0.45rem; margin: 0; }
.my-booking-dl > div { display: grid; grid-template-columns: minmax(7rem, 30%) 1fr; gap: 0.5rem; }
.my-booking-dl dt { color: var(--appt-muted); font-size: 0.88rem; }
.my-booking-dl dd { margin: 0; font-weight: 600; }
.my-status { display: inline-block; padding: 0.1rem 0.55rem; border-radius: 999px; font-size: 0.82rem; border: 1px solid var(--appt-line); }
.my-status.is-booked { color: var(--appt-teal-hi); border-color: currentColor; }
.my-status.is-pending_confirm { color: var(--appt-gold); border-color: currentColor; }
.my-status.is-cancelled, .my-status.is-expired { color: var(--appt-muted); }
.my-booking-links { margin: 0.7rem 0 0; font-size: 0.9rem; }
.my-chat-title { font-size: 1.1rem; margin: 0 0 0.3rem; display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.my-chat-intro { margin: 0 0 0.6rem; font-size: 0.88rem; }
#my-root { display: grid; gap: 1rem; }
html[data-theme="light"] .chat-err, html.ak-light .chat-err { color: #b3261e; }
html[data-theme="light"] .chat-read, html.ak-light .chat-read { color: #0b7a70; }
html[data-theme="light"] .my-status.is-booked, html.ak-light .my-status.is-booked { color: #0b7a70; }
html[data-theme="light"] .my-status.is-pending_confirm, html.ak-light .my-status.is-pending_confirm,
html[data-theme="light"] .appt-inbox-tab svg, html.ak-light .appt-inbox-tab svg { color: #8a6400; }
@media (max-width: 480px) {
  .appt-inbox-tab { flex: 1 1 100%; justify-content: flex-start; }
  .appt-inbox-tab .appt-badge { margin-inline-start: auto; }
  .appt-inbox-panel { padding: 0.55rem; }
  .chat-bubble { max-width: 92%; }
  .my-booking-dl > div { grid-template-columns: 1fr; gap: 0.1rem; }
}

/* ---- v8: waiting screen + save actions ---- */
.book-wait-head { display: flex; align-items: center; gap: 0.7rem; }
.book-wait-head h2 { margin: 0; }
.book-spinner {
  flex: none; width: 1.4rem; height: 1.4rem; border-radius: 50%;
  border: 3px solid color-mix(in srgb, var(--appt-gold) 30%, transparent); border-top-color: var(--appt-gold);
  animation: book-spin 1s linear infinite;
}
@keyframes book-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .book-spinner { animation: none; } }
.book-wait-hint { font-size: 0.9rem; }
.book-confirmed-title { color: var(--appt-teal-hi); }
html[data-theme="light"] .book-confirmed-title, html.ak-light .book-confirmed-title { color: #0b7a70; }
.booking-save { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--appt-line); display: grid; gap: 0.7rem; }
.booking-save-title { margin: 0; font-size: 1.05rem; }
.booking-save-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.booking-save-status { margin: 0; font-size: 0.88rem; color: var(--appt-muted); }
.booking-save-status.is-saved { color: var(--appt-teal-hi); font-weight: 600; }
html[data-theme="light"] .booking-save-status.is-saved, html.ak-light .booking-save-status.is-saved { color: #0b7a70; }
.booking-save-hint { margin: 0; font-size: 0.85rem; }
.booking-save-link { display: flex; gap: 0.9rem; align-items: center; flex-wrap: wrap; }
.booking-save-link p { margin: 0 0 0.2rem; font-size: 0.85rem; }
.booking-save-qr { flex: none; width: 132px; height: 132px; border-radius: 10px; background: #fff; padding: 6px; box-shadow: 0 0 0 1px var(--appt-line); }
.booking-save-url { font-size: 0.85rem; overflow-wrap: anywhere; }
@media (max-width: 480px) {
  .booking-save-actions .btn { flex: 1 1 100%; justify-content: center; text-align: center; }
  .booking-save-link { justify-content: center; text-align: center; }
}
.booking-save-actions .btn { box-sizing: border-box; margin: 0; min-width: 0; max-width: 100%; }

/* v9 fix (owner feedback): compact list cards on the manage page, no hover grow, no horizontal overflow.
   The site-wide `button:hover { transform: scale(1.1) }` must not apply to list/card buttons. */
.appt-inbox-panel, .appt-inbox-list, .manage-week-list, .manage-day-list, .chat-scroll { overflow-x: hidden; max-width: 100%; box-sizing: border-box; }
.appt-inbox-list { gap: 0.3rem; }
.appt-inbox-list > li { min-width: 0; max-width: 100%; }
.appt-inbox-item {
  box-sizing: border-box; max-width: 100%; min-width: 0; gap: 0.05rem; padding: 0.3rem 0.55rem; border-radius: 8px;
  line-height: 1.3; transition: background-color 0.15s ease, border-color 0.15s ease;
}
.appt-inbox-item > * { min-width: 0; max-width: 100%; }
.appt-inbox-when { font-size: 11px; line-height: 1.25; }
.appt-inbox-who { font-size: 13px; line-height: 1.3; flex-wrap: nowrap; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.appt-inbox-who .appt-badge { flex: none; min-width: 1.15rem; height: 1.15rem; padding: 0 0.3rem; font-size: 10.5px; line-height: 1.15rem; }
.appt-inbox-sub, .appt-inbox-snippet { font-size: 12px; line-height: 1.3; display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
button.appt-inbox-item:hover, button.appt-inbox-item:focus-visible, button.appt-inbox-item:active,
button.manage-week-item:hover, button.manage-week-item:focus-visible, button.manage-week-item:active,
button.manage-week-head:hover, button.manage-view-tab:hover, button.appt-inbox-tab:hover, button.appt-inbox-tab:active,
.appt-inbox button:hover, .appt-thread button:hover, .chat-scroll button:hover, .manage-week button:hover {
  transform: none !important; z-index: auto;
}
.appt-inbox-item:hover, .appt-inbox-item:focus-visible { background: color-mix(in srgb, var(--appt-gold) 10%, var(--appt-soft)); }
.manage-week-item { box-sizing: border-box; max-width: 100%; min-width: 0; }
.appt-inbox-bar { align-items: center; }
.appt-inbox-archive-link {
  background: none; border: 0; padding: 0.25rem 0.35rem; font: inherit; font-size: 12.5px; color: var(--appt-muted);
  text-decoration: underline; text-underline-offset: 2px; cursor: pointer; margin-inline-start: auto;
}
.appt-inbox-archive-link.is-open, .appt-inbox-archive-link:hover { color: var(--appt-gold); }
.appt-inbox-clear { margin-top: 0.6rem; display: flex; justify-content: flex-end; }
.appt-inbox-msg { margin: 0.4rem 0 0; font-size: 12px; color: var(--appt-teal-hi, #2bbbad); }
@media (max-width: 480px) { .appt-inbox-archive-link { flex: 1 1 100%; text-align: end; } }
/* two lines per card: name + date on line 1, note/snippet (ellipsis) on line 2 */
.appt-inbox-item { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "who when" "sub sub"; column-gap: 0.5rem; row-gap: 0; align-items: baseline; }
.appt-inbox-item .appt-inbox-who { grid-area: who; }
.appt-inbox-item .appt-inbox-when { grid-area: when; white-space: nowrap; }
.appt-inbox-item .appt-inbox-sub, .appt-inbox-item .appt-inbox-snippet { grid-area: sub; }
.appt-inbox-item .appt-inbox-who { display: flex; align-items: center; gap: 0.35rem; overflow: hidden; min-width: 0; }
.appt-inbox-name { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

/* v10 QR card dialog (compact) */
.qr-card-dialog{border:1px solid rgba(212,175,55,.35);border-radius:14px;background:#141414;color:#eee;padding:0;max-width:min(560px,94vw);box-sizing:border-box}
.qr-card-dialog::backdrop{background:rgba(0,0,0,.6)}
.qr-card-inner{padding:14px 16px;box-sizing:border-box}
.qr-card-title{margin:0 0 10px;font-size:15px;line-height:1.3}
.qr-card-body{display:flex;gap:14px;align-items:flex-start}
.qr-card-preview{width:150px;height:auto;border-radius:6px;flex:0 0 auto;background:#111}
.qr-card-side{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1}
.qr-card-side .btn{text-align:center;transform:none !important}
.qr-card-hint{margin:0 0 4px;font-size:12px;line-height:1.4}
.qr-card-err{color:#f19c9c;font-size:12px;margin:0}
@media (max-width:480px){.qr-card-body{flex-direction:column;align-items:center}.qr-card-preview{width:130px}.qr-card-side{width:100%}}
.qr-inline{display:flex;gap:10px;align-items:center;margin-top:8px;padding:8px;border:1px solid var(--appt-line, rgba(212,175,55,.25));border-radius:10px;max-width:100%;box-sizing:border-box}
.qr-inline-thumb{padding:0;border:0;background:none;cursor:zoom-in;flex:0 0 auto;line-height:0;transform:none !important}
.qr-inline-thumb img{width:60px;height:100px;border-radius:5px;display:block;background:#111}
.qr-inline-side{display:flex;flex-direction:column;gap:5px;min-width:0}
.qr-inline-title{font-size:13px}
.qr-inline-links{display:flex;flex-wrap:wrap;gap:6px}
.qr-inline-links .btn{transform:none !important}
.qr-inline.is-error .qr-inline-thumb{display:none}
.manage-card-fields{display:grid;gap:6px;padding:8px 10px;border:1px dashed rgba(212,175,55,.35);border-radius:10px;margin:4px 0}
.manage-card-hint{margin:0;font-size:12px}
.qr-inline .qr-inline-links .btn, .qr-card-dialog .qr-card-side .btn{font-size:12.5px;padding:.32rem .75rem;min-height:0;line-height:1.3;width:auto}
.qr-card-dialog .qr-card-side .btn{width:100%}

/* v9 client register + retention banner (compact) */
.manage-register-host{display:grid;gap:8px;margin-bottom:10px}
.reg-banner{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:8px 12px;border:1px solid rgba(212,175,55,.55);border-radius:10px;background:rgba(212,175,55,.10);font-size:13px;line-height:1.4}
.reg-banner span{flex:1 1 260px;min-width:0}
.reg-banner .btn{transform:none !important;font-size:12.5px;padding:.3rem .75rem;min-height:0}
.reg-panel{padding:10px 12px !important;box-sizing:border-box;max-width:100%}
.reg-head{display:flex;gap:8px;align-items:baseline;margin-bottom:6px}
.reg-title{font-size:14px}
.reg-total{font-size:12px}
.reg-search{position:relative}
.reg-search input{width:100%;box-sizing:border-box;padding:.45rem .6rem;font-size:13.5px;border-radius:8px}
.reg-results{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 4px);margin:0;padding:4px;list-style:none;background:var(--appt-soft,#161616);border:1px solid var(--appt-line,rgba(255,255,255,.12));border-radius:10px;max-height:300px;overflow:auto;box-shadow:0 8px 24px rgba(0,0,0,.35)}
.reg-hit{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"no name" "no meta";column-gap:8px;width:100%;text-align:start;padding:.3rem .5rem;border:0;border-radius:7px;background:none;color:inherit;font:inherit;cursor:pointer;transform:none !important}
.reg-hit:hover,.reg-hit:focus-visible{background:color-mix(in srgb,var(--appt-gold,#c9a227) 12%,transparent);outline:none}
.reg-no{grid-area:no;font-weight:700;color:var(--appt-gold,#c9a227);font-size:12.5px;font-variant-numeric:tabular-nums;align-self:center}
.reg-name{grid-area:name;font-size:13px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.reg-meta{grid-area:meta;font-size:11.5px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.reg-none{padding:.4rem .5rem;font-size:12.5px}
.reg-card{margin-top:8px;padding:8px 10px;border:1px solid var(--appt-line,rgba(255,255,255,.12));border-radius:10px;font-size:13px}
.reg-card-head{display:flex;gap:8px;align-items:center}
.reg-card-head strong{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.reg-card-head .btn{transform:none !important;font-size:12px;padding:.25rem .6rem;min-height:0}
.reg-line{margin:4px 0;font-size:12.5px}
.reg-history{margin:4px 0 0;padding-inline-start:18px;font-size:12.5px;max-height:160px;overflow:auto}

.intake-editor, .intake-guest { display: grid; gap: 8px; }
.intake-template, .intake-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.intake-row input[data-intake-label], .intake-row input[data-intake-options] { flex: 1 1 180px; }
.intake-guest { margin: 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; }
.intake-guest em { color: var(--muted); font-style: normal; font-size: 0.85em; }

.profession-field { position: relative; }
.profession-field .country-list { position: absolute; z-index: 30; inset-inline: 0; top: calc(100% - 1.6rem); }
.profession-field .country-list em { color: var(--muted); font-style: normal; }