/* Form building blocks used by the admin edit screens */
.bp-ui .bp-check-grid { display: grid; gap: var(--bp-s-2) var(--bp-s-4); grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.bp-ui .bp-relation { display: flex; flex-direction: column; gap: var(--bp-s-3); }
.bp-ui .bp-relation__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--bp-s-3); }
.bp-ui .bp-relation__bar .bp-input-wrap { min-width: 220px; }

.bp-ui .bp-imagefield { display: flex; align-items: center; gap: var(--bp-s-4); }
.bp-ui .bp-imagefield__preview { width: 84px; height: 84px; flex: 0 0 auto; border-radius: var(--bp-r-lg); border: 1px dashed var(--bp-c-border-strong); background: var(--bp-c-surface-2); display: grid; place-items: center; color: var(--bp-c-text-3); overflow: hidden; }
.bp-ui .bp-imagefield__preview img { width: 100%; height: 100%; object-fit: cover; }

.bp-ui .bp-hours { display: flex; flex-direction: column; gap: var(--bp-s-2); margin-block-start: var(--bp-s-3); }
.bp-ui .bp-hours__row { display: grid; grid-template-columns: minmax(150px, 220px) 1fr auto; align-items: center; gap: var(--bp-s-3); padding: var(--bp-s-2) var(--bp-s-3); border: 1px solid var(--bp-c-border); border-radius: var(--bp-r-md); background: var(--bp-c-surface); }
.bp-ui .bp-hours__times { display: flex; align-items: center; gap: var(--bp-s-2); }
.bp-ui .bp-hours__times .bp-input { max-width: 130px; }
@media (max-width: 640px) { .bp-ui .bp-hours__row { grid-template-columns: 1fr; } }

.bp-ui .bp-locagent { border: 1px solid var(--bp-c-border); border-radius: var(--bp-r-md); background: var(--bp-c-surface); }
.bp-ui .bp-locagent.is-selected { border-color: var(--bp-c-primary-border); }
.bp-ui .bp-locagent__head { padding: var(--bp-s-3) var(--bp-s-4); }
.bp-ui .bp-locagent__body { padding: 0 var(--bp-s-4) var(--bp-s-4); display: flex; flex-direction: column; gap: var(--bp-s-3); }

.bp-ui .bp-chips { display: flex; flex-wrap: wrap; gap: var(--bp-s-2); }
.bp-ui .bp-chip { display: inline-flex; align-items: center; gap: var(--bp-s-2); padding: var(--bp-s-1) var(--bp-s-3); border: 1px solid var(--bp-c-border); border-radius: var(--bp-r-full); background: var(--bp-c-surface); color: var(--bp-c-text); text-decoration: none; font-size: var(--bp-fs-sm); }
.bp-ui .bp-chip:hover { border-color: var(--bp-c-primary-border); background: var(--bp-c-primary-soft); }
.bp-ui .bp-chip svg { width: 14px; height: 14px; color: var(--bp-c-text-3); }
.bp-ui .bp-inline-icon { display: inline-flex; align-items: center; gap: var(--bp-s-1); color: var(--bp-c-text-2); }
.bp-ui .bp-inline-icon svg { width: 14px; height: 14px; }
.bp-ui .bp-mb-3 { margin-block-end: var(--bp-s-3); }
.bp-ui .bp-list__filters--compact { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }

/* Settings */
.bp-ui .bp-settings__tabs { position: sticky; inset-block-start: calc(var(--_adminbar, 0px) + 60px); z-index: 4; padding: 0 var(--bp-s-6); background: var(--bp-c-bg); border-block-end: 1px solid var(--bp-c-border); overflow-x: auto; }
.bp-ui .bp-settings__panel:focus { outline: none; }
@media (max-width: 1023px) { .bp-ui .bp-settings__tabs { padding: 0 var(--bp-s-3); } }
.bp-ui .bp-settings-preview { display: flex; align-items: center; min-height: var(--bp-control-h-md); padding: 0 var(--bp-s-3); border-radius: var(--bp-r-md); background: var(--bp-c-surface-2); font-weight: var(--bp-fw-semibold); font-variant-numeric: tabular-nums; }
.bp-ui .bp-colorfield { display: flex; align-items: center; gap: var(--bp-s-2); }
.bp-ui .bp-colorfield__swatch { width: 44px; height: var(--bp-control-h-md); padding: 2px; border: 1px solid var(--bp-c-border-strong); border-radius: var(--bp-r-md); background: var(--bp-c-surface); cursor: pointer; }
.bp-ui .bp-paymethods { display: grid; gap: var(--bp-s-2); grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.bp-ui .bp-paymethod { display: flex; align-items: center; gap: var(--bp-s-3); padding: var(--bp-s-3) var(--bp-s-4); border: 1px solid var(--bp-c-border); border-radius: var(--bp-r-md); background: var(--bp-c-surface); cursor: pointer; }
.bp-ui .bp-paymethod.is-on { border-color: var(--bp-c-primary-border); background: var(--bp-c-primary-soft); }
.bp-ui .bp-paymethod__icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: var(--bp-r-sm); background: var(--bp-c-surface-3); color: var(--bp-c-text-2); flex: 0 0 auto; }
.bp-ui .bp-paymethod__text { display: flex; flex-direction: column; min-width: 0; font-size: var(--bp-fs-sm); }
.bp-ui .bp-paymethod__text strong { font-size: var(--bp-fs-md); }
.bp-ui .bp-mt-4 { margin-block-start: var(--bp-s-4); }

.bp-ui .bp-code { font-family: var(--bp-font-mono); font-weight: var(--bp-fw-semibold); padding: 2px var(--bp-s-2); border-radius: var(--bp-r-xs); background: var(--bp-c-surface-3); }
.bp-ui .bp-week { display: flex; flex-direction: column; gap: var(--bp-s-2); }
.bp-ui .bp-week__day { border: 1px solid var(--bp-c-border); border-radius: var(--bp-r-md); background: var(--bp-c-surface); padding: var(--bp-s-3) var(--bp-s-4); }
.bp-ui .bp-week__head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--bp-s-2); }
.bp-ui .bp-week__body { display: flex; flex-direction: column; gap: var(--bp-s-2); margin-block-start: var(--bp-s-3); padding-inline-start: 52px; }
.bp-ui .bp-week__interval { display: flex; flex-direction: column; gap: var(--bp-s-2); }
.bp-ui .bp-week__interval.has-error .bp-input { border-color: var(--bp-c-danger); }
.bp-ui .bp-week__break { padding-inline-start: var(--bp-s-4); }
@media (max-width: 640px) { .bp-ui .bp-week__body { padding-inline-start: 0; } }
.bp-ui .bp-hours__times .bp-btn { white-space: nowrap; }
.bp-ui .bp-tools-grid { display: grid; gap: var(--bp-s-4); grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
.bp-ui .bp-tablepills { display: grid; gap: var(--bp-s-2); grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.bp-ui .bp-tablepills li { display: flex; align-items: center; gap: var(--bp-s-2); padding: var(--bp-s-2) var(--bp-s-3); border: 1px solid var(--bp-c-border); border-radius: var(--bp-r-md); }
.bp-ui .bp-tablepills li > span { flex: 1 1 auto; }
.bp-ui .bp-tablepills li.is-ok svg { color: var(--bp-c-success); }
.bp-ui .bp-tablepills li.is-bad svg { color: var(--bp-c-danger); }
.bp-ui .bp-runlog { display: flex; flex-direction: column; gap: var(--bp-s-2); }
.bp-ui .bp-runlog li { display: flex; align-items: center; gap: var(--bp-s-3); }
.bp-ui .bp-runlog li > span:nth-child(2) { flex: 1 1 auto; }
.bp-ui .bp-runlog li.is-ok svg { color: var(--bp-c-success); }
.bp-ui .bp-runlog li.is-bad svg { color: var(--bp-c-danger); }
.bp-ui .bp-codeblock { position: relative; }
.bp-ui .bp-codeblock pre { margin: 0; padding: var(--bp-s-4); padding-inline-end: 96px; border-radius: var(--bp-r-md); background: #0f172a; color: #e2e8f0; font-family: var(--bp-font-mono); font-size: var(--bp-fs-sm); overflow-x: auto; white-space: pre; }
.bp-ui .bp-codeblock .bp-btn { position: absolute; inset-block-start: var(--bp-s-2); inset-inline-end: var(--bp-s-2); }
.bp-ui .bp-steps { display: flex; flex-direction: column; gap: var(--bp-s-3); margin-block-start: var(--bp-s-2); }
.bp-ui .bp-steps li { display: flex; align-items: center; gap: var(--bp-s-3); }
.bp-ui .bp-steps__n { flex: 0 0 auto; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--bp-c-primary-soft); color: var(--bp-c-primary-text); font-weight: var(--bp-fw-semibold); }
.bp-ui .bp-steps__text { flex: 1 1 auto; display: flex; flex-direction: column; min-width: 0; }
.bp-ui .bp-bullets { display: flex; flex-direction: column; gap: var(--bp-s-3); }
.bp-ui .bp-bullets li { display: flex; gap: var(--bp-s-2); align-items: flex-start; }
.bp-ui .bp-bullets svg { flex: 0 0 auto; margin-block-start: 3px; color: var(--bp-c-success); }
.bp-ui .bp-varlist { display: flex; flex-direction: column; gap: var(--bp-s-2); }
.bp-ui .bp-varlist__item { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; padding: var(--bp-s-3); border: 1px solid var(--bp-c-border); border-radius: var(--bp-r-md); background: var(--bp-c-surface); color: inherit; font: inherit; text-align: start; cursor: pointer; }
.bp-ui .bp-varlist__item:hover { border-color: var(--bp-c-primary-border); background: var(--bp-c-primary-soft); }
.bp-ui .bp-varlist__item code { font-family: var(--bp-font-mono); font-size: var(--bp-fs-sm); }
.bp-ui .bp-designer { display: grid; gap: var(--bp-s-5); grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 1100px) { .bp-ui .bp-designer { grid-template-columns: minmax(0, 1fr) 340px; } .bp-ui .bp-designer__side { position: sticky; inset-block-start: calc(var(--_adminbar, 0px) + 76px); } }
.bp-ui .bp-designer__main { display: flex; flex-direction: column; gap: var(--bp-s-4); min-width: 0; }
.bp-ui .bp-designer__side { display: flex; flex-direction: column; gap: var(--bp-s-3); }
.bp-ui .bp-designer-preview { padding: var(--bp-s-4); border: 1px solid var(--bp-c-border); border-radius: var(--bp-r-xl); background: var(--bp-c-surface); box-shadow: var(--bp-sh-sm); }
.bp-ui .bp-designer-preview__bar { display: flex; align-items: baseline; justify-content: space-between; gap: var(--bp-s-3); margin-block-end: var(--bp-s-3); }
.bp-ui .bp-designer-preview__title { font-weight: var(--bp-fw-semibold); font-size: var(--bp-fs-lg); }
.bp-ui .bp-designer-preview .bp-bw-options { display: flex; flex-direction: column; gap: var(--bp-s-2); }
.bp-ui .bp-designer-preview .bp-slot { pointer-events: none; }
.bp-ui .bp-designer-import { align-self: flex-end; cursor: pointer; }
.bp-ui .bp-range { width: 100%; accent-color: var(--bp-c-primary); }
.bp-ui .bp-stepcfg { border: 1px solid var(--bp-c-border); border-radius: var(--bp-r-md); background: var(--bp-c-surface); }
.bp-ui .bp-stepcfg > summary { display: flex; align-items: center; justify-content: space-between; gap: var(--bp-s-3); padding: var(--bp-s-3) var(--bp-s-4); cursor: pointer; list-style: none; }
.bp-ui .bp-stepcfg > summary::-webkit-details-marker { display: none; }
.bp-ui .bp-stepcfg__name { font-weight: var(--bp-fw-semibold); }
.bp-ui .bp-stepcfg__body { padding: var(--bp-s-2) var(--bp-s-4) var(--bp-s-4); }
.bp-ui .bp-layoutlist { display: flex; flex-direction: column; gap: var(--bp-s-2); }
.bp-ui .bp-layoutlist li { display: flex; align-items: center; gap: var(--bp-s-3); flex-wrap: wrap; padding: var(--bp-s-2) var(--bp-s-3); border: 1px solid var(--bp-c-border); border-radius: var(--bp-r-md); background: var(--bp-c-surface); }
.bp-ui .bp-layoutlist__name { flex: 1 1 140px; }