/* The Order Board (Phase 2, step 3). The order cards' styles are in order-list.css. */

.board__intro,
.board__off { margin: 0 0 var(--space-3); }
.board__off { padding: var(--space-3); background: var(--info-bg); border-radius: var(--radius-sm); }
.board__off a { padding-block: .6rem; } /* a bigger tap area */

/* Holiday break (seller tools, T1) */
.board__break { margin: 0 0 var(--space-4); padding: var(--space-3); background: var(--surface-sunk); border-radius: var(--radius); }
.page__body .board__break-title { margin: 0 0 var(--space-1); font-size: var(--fs-lg); }
.board__break-now { margin: 0 0 var(--space-3); }
.board__break-buttons { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.board__break-form { margin-top: var(--space-3); }

.board__tools { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); margin-bottom: var(--space-3); }
.board__checked { color: var(--text-muted); font-size: var(--fs-sm); }

.board__part { margin-top: var(--space-5); padding-top: var(--space-4); border-top: 2px dashed var(--card-border); }
.page__body .board__part h2 { margin-top: 0; }
.board__empty { margin: 0; color: var(--text-muted); }

/* page.css indents lists on text pages; the cards don't need it. */
.page__body .order-list,
.page__body .order-list__items { padding-left: 0; }
.page__body .order-list li + li { margin-top: 0; }

.board__details { display: grid; gap: var(--space-1); margin-bottom: var(--space-2); }
.board__phone { display: flex; flex-wrap: wrap; gap: 0 var(--space-4); }
.board__phone a { display: inline-flex; align-items: center; gap: .3rem; padding-block: .6rem; font-weight: 800; } /* a bigger tap area */
.board__phone svg { width: 1.1em; height: 1.1em; flex: none; }
