.btn--icon {
  min-width: 34px;
  padding: 5px 8px;
  font-size: 18px;
  line-height: 1;
}

.grid tr.is-editing td {
  background: #f4f7f1;
}

.plan-tools {
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 1fr));
  gap: 8px;
  margin-bottom: 14px;
}

.plan-area-select {
  display: grid;
  gap: 4px;
  padding: 7px 9px 9px;
  border: 2px solid var(--accent);
  border-radius: 9px;
  background: #eef4eb;
  color: var(--accent);
  font-weight: 800;
}

.plan-area-select span {
  font-size: 11px;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.plan-area-select select {
  width: 100%;
  border-color: var(--accent);
  background: #fff;
  font-weight: 800;
}

.plan-save-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.unsaved-indicator {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 5px 10px;
  border-radius: 99px;
  background: #fff1d6;
  color: #79540d;
  font-size: 12px;
  font-weight: 800;
}

.support-context {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  background: #fff1d6;
  border-bottom: 1px solid #dfc17a;
  color: #684807;
  font-size: 13px;
}

.context-switch__trigger--support {
  border-color: #b58118;
  background: #fff8e8;
  color: #684807;
}

.app-dialog-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  padding: 20px;
  background: #17201799;
  backdrop-filter: blur(3px);
}

.app-dialog {
  width: min(480px, 100%);
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
  box-shadow: 0 24px 70px #0005;
}

.app-dialog h2 {
  margin: 0 0 10px;
  font-size: 22px;
}

.app-dialog p {
  margin: 0 0 22px;
  color: var(--muted);
  line-height: 1.5;
}

.app-dialog__actions {
  display: flex;
  justify-content: flex-end;
  gap: 9px;
}

.plan-decor {
  cursor: move;
  pointer-events: auto;
  touch-action: none;
  z-index: 2;
  padding: 2px;
}

.plan-decor.is-selected {
  border: 2px solid #33532f;
  box-shadow: 0 0 0 3px #fff, 0 0 0 5px #33532f55;
}

.plan-decor__label {
  pointer-events: none;
}
.plan-decor--banner,
.plan-decor--bar { background:#3a6ea5; color:#fff; }
.plan-decor--pool { background:#4a8ecf; color:#fff; }
.plan-decor--loungers { background:#b8bcc4; color:#253226; }
.plan-decor--hedge { background:#4e7d3a; color:#fff; }
.plan-decor--tree { background:#5c8f46; color:#fff; border-radius:50%; }
.plan-decor--zone { background:#eef0e4; color:#253226; }
.editor-side input[type="color"] { width:48px; min-width:48px; height:40px; padding:3px; }

.plan-resize-handle {
  position: absolute;
  right: -1px;
  bottom: -1px;
  width: 14px;
  height: 14px;
  border: 1px solid #fff;
  border-radius: 3px 0 0;
  background: #33532f;
  cursor: se-resize;
  touch-action: none;
}

.plan-resize-handle::before {
  content: '';
  position: absolute;
  inset: 3px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
}

.setup-code--api strong {
  max-width: 100%;
  overflow-wrap: anywhere;
  font-size: clamp(15px, 2vw, 25px);
  letter-spacing: .03em;
}

.catalog-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1100;
  display: grid;
  place-items: center;
  padding: 16px;
  overflow: auto;
  background: rgb(24 31 24 / 58%);
  backdrop-filter: blur(3px);
}

.catalog-modal {
  display: flex;
  flex-direction: column;
  width: min(1140px, 100%);
  max-height: calc(100vh - 32px);
  overflow: hidden;
  background: #fff;
  border: 1px solid #d9dfd7;
  border-radius: 14px;
  box-shadow: 0 24px 70px rgb(12 25 12 / 28%);
}

.catalog-modal > header,
.catalog-modal > footer {
  padding: 17px 24px;
  border-bottom: 1px solid #dfe4dd;
}

.catalog-modal > header h2 { margin: 0; }
.catalog-modal__body { padding: 24px; overflow: auto; }
.catalog-modal > footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  border-top: 1px solid #dfe4dd;
  border-bottom: 0;
}

.catalog-form { display: grid; gap: 20px; }
.catalog-form textarea { width: 100%; min-height: 110px; box-sizing: border-box; resize: vertical; }
.catalog-form__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.catalog-form__row--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.catalog-field { display: grid; gap: 7px; min-width: 0; color: #344334; font-weight: 700; }
.catalog-field small { color: var(--muted); font-weight: 400; line-height: 1.35; }
.catalog-field input,
.catalog-field select { width: 100%; min-height: 48px; }
.color-field { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.color-field > input[type="color"] { flex: 0 0 68px; width: 68px; height: 48px; padding: 2px; }
.color-palette { display: flex; gap: 6px; flex-wrap: wrap; }
.color-palette button {
  width: 34px;
  height: 34px;
  padding: 0;
  border: 1px solid rgb(22 35 22 / 20%);
  border-radius: 7px;
  cursor: pointer;
}
.color-palette button.is-selected { outline: 3px solid var(--accent); outline-offset: 2px; }
.link-btn { border: 0; background: transparent; color: var(--accent); text-decoration: underline; cursor: pointer; }
.catalog-active { align-items: flex-start; padding: 4px 0; }
.catalog-active span { display: grid; gap: 4px; }
.catalog-active small { color: var(--muted); font-weight: 400; }
.catalog-delete { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding-top: 14px; border-top: 1px solid #e4e8e2; }
.catalog-delete small { color: var(--muted); }

.category-tree { display: grid; gap: 18px; }
.category-top { overflow: hidden; border: 1px solid #dce3d9; border-radius: 12px; }
.category-top__head {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 66px;
  padding: 10px 14px;
  background: #f5f7f3;
}
.category-top__head > i,
.category-name > i { width: 22px; height: 22px; flex: 0 0 22px; border: 1px solid rgb(0 0 0 / 12%); border-radius: 6px; }
.category-name { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; }

.ordermask-card .card__head > strong { font-size: 16px; }
.ordermask-toolbar { display: flex; align-items: end; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.ordermask-toolbar label { display: grid; gap: 5px; font-weight: 700; }
.ordermask-toolbar select { min-width: 240px; }
.ordermask-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 16px; align-items: start; }
.ordermask-canvas { --layout-rows: 10; display: grid; grid-template-columns: repeat(14,minmax(0,1fr)); grid-template-rows: repeat(var(--layout-rows),38px); gap: 3px; min-height: 410px; padding: 8px; border: 1px solid var(--line-strong); border-radius: 9px; background: linear-gradient(90deg,#75806f12 1px,transparent 1px),linear-gradient(#75806f12 1px,transparent 1px),#faf9f5; background-size: calc(100% / 14) 38px; overflow: auto; }
.ordermask-tile { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 3px; min-width: 0; padding: 10px; overflow: hidden; border: 2px solid transparent; border-radius: 8px; box-shadow: 0 2px 5px #0002; text-align: left; touch-action: none; }
.ordermask-tile strong { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.ordermask-tile span { font-weight: 750; }
.ordermask-tile em { font-size: 11px; font-style: normal; opacity: .8; }
.ordermask-tile.is-selected { outline: 3px solid #e4b548; outline-offset: 1px; }
.ordermask-tile.is-sold-out { filter: saturate(.25); opacity: .72; }
.ordermask-resize { position: absolute; right: 0; bottom: 0; width: 24px; height: 24px; cursor: nwse-resize; touch-action: none; }
.ordermask-resize::after { content: ''; position: absolute; right: 4px; bottom: 4px; width: 9px; height: 9px; border-right: 3px solid currentColor; border-bottom: 3px solid currentColor; opacity: .8; }
.ordermask-side { display: grid; gap: 10px; padding: 14px; border: 1px solid var(--line); border-radius: 9px; background: var(--panel-2); }
.ordermask-side small { color: var(--muted); }
.ordermask-pool { display: flex; flex-wrap: wrap; gap: 7px; min-height: 42px; }
.ordermask-pool button { padding: 8px 10px; border: 1px solid var(--line-strong); border-radius: 7px; background: var(--panel); font-weight: 700; }
.ordermask-selected { display: grid; gap: 8px; margin-top: 8px; padding-top: 12px; border-top: 1px solid var(--line); }
.ordermask-selected > span { color: var(--muted); font-size: 12px; }
.ordermask-empty { display: grid; justify-items: start; gap: 12px; padding: 30px; border: 1px dashed var(--line-strong); border-radius: 9px; }
.ordermask-clash { padding: 6px 9px; border-radius: 6px; background: #f8e4e1; color: var(--danger); font-weight: 750; }

.ordermask-editor-head { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.ordermask-settings { display: grid; grid-template-columns: 2fr .7fr .7fr 1fr 1.5fr; gap: 14px; align-items: end; }
.ordermask-settings label { display: grid; gap: 6px; font-weight: 700; }
.ordermask-settings input[readonly] { background: var(--panel-2); color: var(--muted); }
.ordermask-designer { display: grid; grid-template-columns: 285px minmax(0,1fr); gap: 16px; align-items: start; }
.ordermask-sources { display: grid; gap: 12px; position: sticky; top: 126px; }
.ordermask-sources section { overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: var(--panel); box-shadow: var(--shadow); }
.ordermask-sources h3 { margin: 0; padding: 12px 14px; border-bottom: 1px solid var(--line); font-size: 16px; }
.ordermask-sources input { width: calc(100% - 20px); margin: 10px; }
.ordermask-source-list { display: grid; max-height: 260px; overflow-y: auto; }
.ordermask-source-list--products { max-height: 430px; border-top: 1px solid var(--line); }
.ordermask-source-list button { min-height: 40px; padding: 8px 14px; border: 0; border-bottom: 1px solid var(--line); background: #fff; text-align: left; }
.ordermask-source-list button:hover,.ordermask-source-list button.is-active { background: #e6eee2; color: var(--accent); font-weight: 750; }
.ordermask-source-list button:disabled { opacity: .55; cursor: not-allowed; }
.ordermask-preview .card__body { overflow-x: auto; }
.ordermask-fixed-grid { --mask-columns: 7; --mask-rows: 6; display: grid; grid-template-columns: repeat(var(--mask-columns),minmax(0,1fr)); grid-template-rows: repeat(var(--mask-rows),minmax(0,1fr)); gap: 5px; width: 100%; min-width: calc(var(--mask-columns) * 79px); aspect-ratio: var(--mask-columns) / var(--mask-rows); box-sizing: border-box; padding: 8px; border: 1px solid var(--line-strong); border-radius: 8px; background: linear-gradient(90deg,#75806f12 1px,transparent 1px),linear-gradient(#75806f12 1px,transparent 1px),#faf9f5; background-size: calc(100% / var(--mask-columns)) calc(100% / var(--mask-rows)); }
.ordermask-fixed-tile { display: grid; place-items: center; min-width: 0; min-height: 0; aspect-ratio: 1 / 1; padding: 7px; border: 1px solid rgb(0 0 0 / 14%); border-radius: 6px; box-shadow: 0 2px 4px #0002; text-align: center; touch-action: manipulation; }
.ordermask-fixed-tile strong { max-width: 100%; overflow: hidden; font-size: 13px; line-height: 1.12; text-overflow: ellipsis; }
.ordermask-fixed-tile.is-selected { outline: 3px solid #e4b548; outline-offset: 1px; }
.ordermask-fixed-tile.is-sold-out { filter: grayscale(.45); opacity: .65; }
.ordermask-selection { display: flex; align-items: center; gap: 12px; margin-top: 12px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel-2); }
.ordermask-selection .btn { margin-left: auto; }
.reception-order-metrics { margin-bottom: 18px; }
.reception-orders { min-width: 1120px; }
.reception-orders td { vertical-align: top; }
.receipt-filters { display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:12px;margin-bottom:18px; }
.receipt-filters label { display:grid;gap:5px;font-weight:700;color:#465248; }
.receipt-list { display:grid;gap:10px; }
.receipt-card { border:1px solid #d9ded8;border-radius:10px;overflow:hidden;background:#fff; }
.receipt-card>summary { cursor:pointer;display:grid;grid-template-columns:minmax(220px,1fr) auto auto;align-items:center;gap:22px;padding:15px 18px;list-style:none; }
.receipt-card>summary::-webkit-details-marker { display:none; }
.receipt-card>summary span { display:grid;gap:3px; }
.receipt-card>summary small { color:#687169; }
.receipt-card .grid { margin:0;border-top:1px solid #e1e4df; }
@media(max-width:850px){.receipt-filters{grid-template-columns:1fr 1fr}.receipt-card>summary{grid-template-columns:1fr auto}.receipt-card>summary .badge{grid-column:1/-1;justify-self:start}}
.order-counts { display: grid; gap: 3px; min-width: 150px; }
.order-counts span { white-space: nowrap; }
.order-note { max-width: 320px; margin-bottom: 4px; line-height: 1.35; }
.muted { color: var(--muted); }
.badge--warn { background: #fff2cc; color: #765615; }
.category-children { width: 100%; min-width: 680px; }
.catalog-filters { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 18px; }
.catalog-filters input:not([type="checkbox"]),
.catalog-filters select { min-width: 190px; min-height: 44px; }
.catalog-filters input[type="search"] { flex: 1 1 240px; }
.grid td > small { display: block; margin-top: 4px; color: var(--muted); }
.btn--icon { min-width: 42px; font-size: 19px; }

@media (max-width: 800px) {
  .ordermask-settings { grid-template-columns: 1fr 1fr; }
  .ordermask-designer { grid-template-columns: 1fr; }
  .ordermask-sources { position: static; grid-template-columns: 1fr 1fr; }

  .ordermask-layout {
    grid-template-columns: 1fr;
  }

  .ordermask-side {
    grid-row: 1;
  }

  .ordermask-canvas {
    min-width: 760px;
  }

  .ordermask-card .card__body {
    overflow-x: auto;
  }

  .catalog-modal-backdrop { align-items: start; padding: 8px; }
  .catalog-modal { max-height: calc(100vh - 16px); border-radius: 10px; }
  .catalog-modal > header,
  .catalog-modal > footer,
  .catalog-modal__body { padding: 14px; }
  .catalog-form__row,
  .catalog-form__row--three { grid-template-columns: 1fr; }
  .category-top__head { align-items: flex-start; flex-wrap: wrap; }
  .catalog-filters > * { flex: 1 1 220px; }
}

@media (max-width: 1180px) {
  .main {
    width: calc(100% - 24px);
    margin-top: 18px;
  }

  .top,
  .nav {
    padding-inline: 12px;
  }

  .card__body {
    padding: 12px;
  }

  .add-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .add-row .btn {
    min-height: 44px;
  }

  .data-table-scroll {
    -webkit-overflow-scrolling: touch;
  }

  .grid {
    min-width: 760px;
  }

  .plan-editor {
    min-height: 0;
    width: 100%;
    aspect-ratio: 4 / 3;
  }
}

@media (max-width: 800px) {
  .plan-tools {
    grid-template-columns: 1fr 1fr;
  }

  .add-row {
    grid-template-columns: 1fr;
  }

  .editor-side {
    align-items: stretch;
  }

  .editor-side label {
    flex: 1 1 240px;
  }

  .editor-side input,
  .editor-side select {
    flex: 1;
  }
}

@media (pointer: coarse) {
  .plan-resize-handle {
    width: 24px;
    height: 24px;
  }

  .plan-resize-handle::before {
    inset: 6px;
  }
}

.smtp-card{max-width:900px}.smtp-card .card__head{display:flex;align-items:center;justify-content:space-between;gap:16px}.smtp-card .card__head p{margin:4px 0 0}.smtp-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:16px}.smtp-grid label{display:grid;gap:6px;font-weight:700}.smtp-grid input,.smtp-grid select{min-width:0;padding:11px 12px;border:1px solid #c9c9c3;border-radius:7px;background:#fff;font:inherit}.smtp-grid label:nth-of-type(4),.smtp-grid label:nth-of-type(5){grid-column:span 2}.smtp-actions{grid-column:1/-1;display:flex;gap:9px;margin-top:4px}.smtp-updated{margin:16px 0 0}@media(max-width:760px){.smtp-grid{grid-template-columns:1fr}.smtp-grid label:nth-of-type(4),.smtp-grid label:nth-of-type(5){grid-column:auto}.smtp-actions{grid-column:auto;flex-wrap:wrap}}
.role-layout{display:grid;gap:16px}.role-layout>.card{margin-bottom:0}.role-summary{display:grid;gap:6px}.role-summary span,.permission-option small{color:var(--muted)}.permission-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.permission-option{display:flex;align-items:flex-start;gap:12px;padding:14px;border:1px solid var(--line);border-radius:9px;background:var(--panel-2);cursor:pointer}.permission-option input{width:22px;height:22px;min-height:22px;margin:1px 0 0;accent-color:var(--accent)}.permission-option span{display:grid;gap:3px}.permission-option small{line-height:1.35}.permission-option--locked{cursor:not-allowed;opacity:.72}.role-actions{display:flex;align-items:center;gap:12px;margin-top:16px}.role-fixed-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.role-fixed-grid .card{margin:0}@media(max-width:760px){.permission-grid,.role-fixed-grid{grid-template-columns:1fr}}

.reception-question-editor{display:grid;gap:10px;margin:18px 0}.reception-question-row{display:grid;grid-template-columns:38px minmax(240px,1fr) auto;gap:10px;align-items:center}.reception-question-row input{width:100%;box-sizing:border-box;padding:11px 12px;border:1px solid #b7bdb5;border-radius:8px;font:inherit}.reception-question-number{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#315a35;color:#fff;font-weight:800}@media(max-width:700px){.reception-question-row{grid-template-columns:34px 1fr}.reception-question-row .btn{grid-column:2}}
.guest-qr-admin{display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px;align-items:center}.guest-qr-admin img{display:block;width:220px;max-width:100%;border:1px solid var(--line);border-radius:12px}.guest-qr-admin label{display:grid;gap:7px;font-weight:800}.guest-qr-admin input{width:100%;box-sizing:border-box;padding:11px 12px;border:1px solid #b7bdb5;border-radius:8px;background:#fff;font:inherit}.guest-qr-admin .btn{text-decoration:none}@media(max-width:700px){.guest-qr-admin{grid-template-columns:1fr}.guest-qr-admin>div:first-child{display:grid;place-items:center}}
