:root {
  font-family: system-ui, sans-serif;
  color: #242b26;
  background: #f3f4ef
}

* {
  box-sizing: border-box
}

body {
  margin: 0
}

header {
  background: #253c32;
  color: #fff;
  padding: 20px 5%;
  display: flex;
  justify-content: space-between;
  align-items: center
}

a {
  color: #315f49
}

header a {
  color: #fff;
  text-decoration: none
}

.brand {
  font-size: 19px;
  font-weight: 650
}

main {
  max-width: 1100px;
  margin: 30px auto;
  padding: 0 22px
}

.narrow {
  max-width: 440px;
  margin: 70px auto
}

.panel {
  background: white;
  border: 1px solid #e0e5dd;
  padding: 28px;
  margin-bottom: 24px;
  border-radius: 8px
}

.eyebrow {
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: 11px;
  color: #6b7b67
}

h1 {
  font-size: 30px;
  margin: 10px 0 24px
}

h2 {
  font-size: 22px;
  margin-top: 0
}

p {
  line-height: 1.65
}

label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 16px
}

input,
select,
textarea {
  width: 100%;
  display: block;
  margin-top: 7px;
  padding: 11px;
  border: 1px solid #bac6b9;
  border-radius: 4px;
  background: white;
  font: inherit
}

textarea {
  resize: vertical
}

.columns {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 18px
}

.check {
  display: flex;
  gap: 10px;
  align-items: center
}

.check input {
  width: auto;
  margin: 0
}

button {
  background: #315b43;
  color: #fff;
  border: 0;
  border-radius: 4px;
  padding: 11px 18px;
  font-size: 14px;
  cursor: pointer;
  margin-right: 8px
}

button.secondary {
  background: #e8ede5;
  color: #263b2f
}

button:disabled {
  opacity: .55;
  cursor: wait
}

:focus-visible {
  outline: 3px solid #a78348;
  outline-offset: 3px
}

.hint {
  color: #667164;
  font-size: 12px
}

.page-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px
}

.workspace-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 24px;
  padding-bottom: 12px;
  border-bottom: 1px solid #d6dfd1;
}

.workspace-tabs button {
  margin: 0;
  background: #e8ede5;
  color: #263b2f;
}

.workspace-tabs button[aria-selected="true"] {
  background: #315b43;
  color: white;
}

.service-item {
  display: flex;
  gap: 16px;
  align-items: center;
  padding: 16px 0;
  border-top: 1px solid #e3e8e0
}

.service-item>div {
  flex: 1
}

.service-item p {
  margin: 5px 0;
  color: #667164;
  font-size: 13px
}

.badge {
  font-size: 11px;
  background: #e5eee2;
  color: #31523e;
  padding: 4px 8px;
  border-radius: 20px
}

.inquiry-item {
  padding: 18px 0;
  border-top: 1px solid #e3e8e0
}

.inquiry-item h3 {
  margin: 0 0 8px
}

.inquiry-item p {
  font-size: 14px;
  margin: 6px 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere
}

.inquiry-item select {
  max-width: 180px
}

.error {
  color: #a72929
}

.success {
  color: #315b43
}

[hidden] {
  display: none !important
}

.admin-message-box {
  position: fixed;
  right: max(24px, env(safe-area-inset-right));
  bottom: max(24px, env(safe-area-inset-bottom));
  z-index: 1000;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  width: min(420px, calc(100vw - 32px));
  max-height: 45vh;
  padding: 18px;
  border: 1px solid #c9dbca;
  border-left: 4px solid #315b43;
  border-radius: 8px;
  background: #f4faf3;
  color: #263b2f;
  box-shadow: 0 8px 32px rgb(22 35 25 / .18);
}

.admin-message-error {
  border-color: #e5c6c2;
  border-left-color: #a72929;
  background: #fff5f4;
  color: #742626;
}

.admin-message-icon {
  flex: none;
  font-size: 21px;
  font-weight: 700;
  line-height: 1.2;
}

.admin-message-content {
  flex: 1;
  min-width: 0;
  max-height: calc(45vh - 36px);
  overflow: auto;
  overflow-wrap: anywhere;
}

.admin-message-content h2 {
  margin: 0 0 6px;
  font-size: 14px;
}

.admin-message-content p {
  margin: 0;
  font-size: 13px;
  white-space: pre-wrap;
}

.admin-message-close {
  flex: none;
  margin: -6px -6px 0 0;
  padding: 4px;
  min-width: 32px;
  min-height: 32px;
  background: transparent;
  color: inherit;
  font-size: 24px;
  line-height: 1;
}

.admin-message-close:hover { background: rgb(0 0 0 / .06); }

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

@media(max-width:600px) {
  .admin-message-box {
    right: max(16px, env(safe-area-inset-right));
    bottom: max(16px, env(safe-area-inset-bottom));
  }
}

@media(max-width:600px) {
  .panel {
    padding: 20px
  }

  .page-heading {
    display: block
  }

  .service-item {
    flex-wrap: wrap
  }

  h1 {
    font-size: 26px
  }
}


#content-fields {
  border: 0;
  padding: 0;
  margin: 0;
  min-width: 0
}

#content-fields label .hint {
  display: block;
  margin-top: 5px;
  font-weight: 400
}

.content-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 5px;
}

.content-actions button {
  margin: 0
}

.content-preview {
  border-top: 1px solid #e3e8e0;
  margin-top: 26px;
  padding-top: 20px
}

.content-preview label {
  max-width: 440px
}

.content-preview h3 {
  font-size: 17px
}

#content-state {
  white-space: pre-line
}

.image-editor {
  margin: 18px 0 24px;
  padding: 18px;
  border: 1px solid #dce3d8;
  border-radius: 5px
}

.image-editor img {
  display: block;
  object-fit: cover;
  max-width: 100%;
  margin-bottom: 15px
}

.image-editor input[type=file] {
  max-width: 460px
}

.image-editor p {
  margin-top: 0
}

#menu-fields {
  border: 0;
  padding: 0;
  margin: 0;
  min-width: 0
}

#menu-admin-panel h3 {
  margin-top: 30px
}

.inquiry-item li {
  font-size: 13px;
  line-height: 1.8
}

.service-item>div {
  min-width: 0;
  overflow-wrap: anywhere
}

.menu-variation-row {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin: 12px 0
}

.menu-variation-row>label:first-child {
  flex: 1;
  min-width: 140px
}

.menu-variation-row label {
  margin: 0
}

.menu-variation-row button {
  margin-top: 20px
}

#menu-variation-editor {
  margin: 18px 0;
  padding: 18px;
  border: 1px solid #dce3d8
}

#shop-logo-controls #shop-logo-preview { object-fit: contain; }

.catalog-group-columns {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
  gap: 24px;
}
.catalog-group-row {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 8px;
  margin-bottom: 16px;
}
.catalog-group-row label { flex: 1 1 180px; margin: 0; }
.catalog-group-row button { margin: 0 0 4px; }
.catalog-group-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  width: 120px;
  flex: none;
}
.catalog-group-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 9px 0;
}
.catalog-group-actions svg { width: 20px; height: 20px; pointer-events: none; }
.catalog-group-actions .catalog-group-delete { background: #fde2e2; color: #a72929; }
.catalog-group-actions .catalog-group-delete:hover { background: #f8cccc; }

.new-item{
  background: #fefffc;
  padding: 5px;
  border: 1px solid black
}

.menu-preselection {
  flex: none;
  margin: 0;
  align-self: flex-start;
  padding-top: 3px;
  white-space: nowrap;
}

.menu-preselection input {
  width: 18px;
  height: 18px;
  accent-color: #315b43;
}

.menu-item-number {
  min-width: 3ch;
  font-variant-numeric: tabular-nums;
  color: #667164;
}

/* Booking workspace */
.booking-dashboard { padding: 30px; }
.dashboard-heading,.request-heading { display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }
.dashboard-heading h2 { margin-bottom:8px; }
.dashboard-heading p { margin:6px 0; }
.booking-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin:24px 0; }
.booking-metrics>div { padding:18px 22px; background:#f4f6f1; border:1px solid #e0e6dc; border-radius:8px; display:flex; gap:12px; align-items:baseline; }
.booking-metrics strong { font-size:28px; color:#315b43; }
.booking-metrics span { color:#667164; font-size:13px; }
.dashboard-views { display:flex; gap:8px; flex-wrap:wrap; padding-bottom:22px; border-bottom:1px solid #e3e8e0; margin-bottom:22px; }
.dashboard-views button { margin:0; }
.dashboard-views button[aria-pressed=false] { background:#e8ede5; color:#263b2f; }
.dashboard-views button[aria-pressed=true] { background:#315b43; color:white; }
.booking-filters { display:grid; grid-template-columns:2fr 1fr 1fr; gap:16px; }
.request-card { border:1px solid #e0e6dc; border-radius:8px; padding:22px; margin-bottom:16px; background:white; }
.request-heading { justify-content:flex-start; }
.request-heading h3 { flex:1; font-size:17px; overflow-wrap:anywhere; }
.booking-source,.request-status { display:inline-block; padding:4px 9px; border-radius:20px; font-size:11px; white-space:nowrap; }
.booking-source { background:#edf0eb; color:#53604f; }
.status-open { background:#fff1d9; color:#805b15; }
.status-invoiced { background:#e6edf7; color:#335b86; }
.status-paid { background:#deeedf; color:#315b43; }
.status-confirmed { background:#deeedf; color:#315b43; }
.request-controls { display:grid; grid-template-columns:1.3fr 1fr 1fr auto; gap:14px; align-items:end; margin-top:18px; }
.request-controls label { margin:0; min-width:0; }
.request-controls button { margin:0; min-height:42px; }
.request-controls select { max-width:none; }
.request-message:empty { display:none; }
.booking-notes { background:#f7f7f3; padding:12px; border-radius:4px; }
.booking-empty { padding:20px; text-align:center; color:#667164; }
.calendar-toolbar { display:flex; align-items:center; gap:12px; margin-bottom:14px; flex-wrap:wrap; }
.calendar-toolbar h3 { flex:1; margin:0; font-size:23px; text-transform:capitalize; }
.calendar-toolbar button { margin:0; }
.calendar-weekdays,.calendar-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:6px; }
.calendar-weekdays { margin-bottom:8px; text-align:center; font-size:12px; font-weight:600; color:#667164; }
.calendar-day { min-width:0; min-height:92px; padding:12px 8px; margin:0; color:#263b2f; background:#f6f8f3; border:1px solid #e0e6dc; border-radius:6px; text-align:left; display:flex; flex-direction:column; gap:10px; }
.calendar-day:hover { border-color:#315b43; }
.calendar-day.closed-day { background:#eaece8; color:#777e73; }
.calendar-day.outside-month { opacity:.55; }
.calendar-day.selected-day { border:2px solid #315b43; background:#e5eee2; }
.calendar-day[aria-current=date] .calendar-day-number { font-weight:800; text-decoration:underline; text-underline-offset:4px; }
.calendar-event-count { font-size:11px; color:#315b43; font-weight:650; }
.calendar-agenda { margin-top:24px; padding:22px; background:#f6f8f3; border-radius:8px; }
.calendar-agenda h3 { margin:0 0 18px; font-size:17px; }
.agenda-event { background:white; border-left:3px solid #315b43; border-radius:4px; padding:16px; margin-bottom:12px; }
.agenda-event h4 { margin:8px 0; overflow-wrap:anywhere; }
.agenda-event p { margin:5px 0; }
.agenda-event button { display:block; margin-top:12px; }
.availability-panel { margin-top:28px; border-top:1px solid #e3e8e0; padding-top:20px; }
.availability-panel summary { cursor:pointer; font-weight:650; }
.availability-panel fieldset,#manual-event-fields { border:0; margin:0; padding:0; min-width:0; }
.availability-day { display:grid; grid-template-columns:130px 1fr; gap:18px; padding:18px 0; border-top:1px solid #e3e8e0; }
.availability-slot { display:flex; align-items:end; gap:12px; flex-wrap:wrap; margin-bottom:12px; }
.availability-slot label { margin:0; flex:1; min-width:100px; }
.availability-slot button { margin:0; }
#manual-event-dialog { border:1px solid #d8e0d3; border-radius:12px; padding:28px; width:min(700px,calc(100% - 28px)); max-height:90vh; overflow:auto; color:#242b26; }
#manual-event-dialog::backdrop { background:rgb(22 35 25 / .55); }
@media(max-width:700px) { .booking-dashboard{padding:20px}.booking-metrics{gap:8px}.booking-metrics>div{padding:12px;flex-direction:column;gap:2px}.booking-filters{grid-template-columns:1fr}.request-controls{grid-template-columns:1fr 1fr}.request-card{padding:16px}.availability-day{grid-template-columns:1fr;gap:0}.calendar-day{min-height:65px;padding:8px 4px}.calendar-grid{gap:3px}.calendar-event-count{font-size:9px}.calendar-toolbar h3{font-size:18px}.calendar-agenda{padding:16px}#manual-event-dialog{padding:20px} }
.calendar-event-preview { display:block; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:10px; }
.agenda-open { border-left-color:#b38326; background:#fff8e9; }
.calendar-event-preview.status-open { background:#fff1d9; color:#805b15; }
.request-status { white-space:normal; overflow-wrap:anywhere; }
.inquiry-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:18px; }
.inquiry-actions button { margin:0; }
button.danger { background:#a72929; color:white; }
.admin-build-info { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 24px; padding: 24px; color: #667164; font-size: 12px; }
.admin-build-info span { overflow-wrap: anywhere; }
.email-test,.email-history { margin-top:24px; border-top:1px solid #e3e8e0; padding-top:18px; }
.administration-tabs button { font-size:13px; }
.email-templates { margin:24px 0; }
.email-templates details { padding:16px 0; border-top:1px solid #e3e8e0; }
.email-templates summary { cursor:pointer; font-weight:600; margin-bottom:14px; }
.placeholder-help dl { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2fr); gap:8px 16px; font-size:13px; }
.placeholder-help dd { margin:0; }
#email-settings-fields,#inquiry-email-fields { border:0; margin:0; padding:0; min-width:0; }
#inquiry-email-dialog { border:1px solid #d8e0d3; border-radius:12px; padding:28px; width:min(700px,calc(100% - 28px)); max-height:90vh; overflow:auto; color:#242b26; }
#inquiry-email-dialog::backdrop { background:rgb(22 35 25 / .55); }
#inquiry-email-history { max-height:220px; overflow:auto; overflow-wrap:anywhere; font-size:13px; }
@media(max-width:700px) { .booking-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } #inquiry-email-dialog { padding:20px; } }
@media(max-width:700px) { .calendar-event-preview { display:none; } }
[data-document-actions] { display: flex; gap: .5rem; flex-wrap: wrap; }
.stylesheet-editor { font-family: ui-monospace, monospace; tab-size: 2; }
.document-dialog { width: min(1100px, calc(100% - 28px)); max-width: calc(100% - 28px); max-height: 90vh; overflow: auto; border: 1px solid #d8e0d3; border-radius: 12px; padding: 28px; color: #242b26; }
.document-dialog::backdrop { background: rgb(22 35 25 / .55); }
#inquiry-document-fields, #tenant-settings-fields { border: 0; min-width: 0; margin: 0; padding: 0; }
#tenant-documents-enabled { appearance: none; position: relative; width: 42px; height: 24px; padding: 0; border: 0; border-radius: 20px; background: #8b9690; cursor: pointer; flex-shrink: 0; }
#tenant-documents-enabled::before { content: ''; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: white; }
#tenant-documents-enabled:checked { background: #315c45; }
#tenant-documents-enabled:checked::before { transform: translateX(18px); }
#tenant-documents-enabled:focus-visible { outline: 3px solid #86b69a; outline-offset: 3px; }
.document-position { display: grid; grid-template-columns: repeat(auto-fit,minmax(130px,1fr)); gap: .75rem; margin: 1rem 0; padding: 1rem; border: 1px solid #dce4df; border-radius: .5rem; }
.document-position label:first-of-type { grid-column: 1 / -1; }
#document-history { display: flex; flex-wrap: wrap; gap: .5rem; }
@media(max-width:700px) { .document-dialog { padding: 20px; } .document-dialog .columns { grid-template-columns: 1fr; } }
#inquiry-edit-dialog { width: min(1000px, calc(100% - 28px)); max-width: calc(100% - 28px); max-height: 90vh; overflow: auto; border: 1px solid #d8e0d3; border-radius: 12px; padding: 28px; color: #242b26; }
#inquiry-edit-dialog::backdrop { background: rgb(22 35 25 / .55); }
#inquiry-edit-fields, #tenant-logo-controls { border: 0; min-width: 0; margin: 0; padding: 0; }
.inquiry-address p { white-space: pre-line; }
.inquiry-edit-line { display: grid; grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: .75rem; margin: 1rem 0; padding: 1rem; border: 1px solid #dce4df; border-radius: .5rem; }
#tenant-logo-preview { object-fit: contain; }
@media(max-width:700px) { #inquiry-edit-dialog { padding: 20px; } #inquiry-edit-dialog .columns { grid-template-columns: 1fr; } }