/* Owner dashboard — built for a phone first */
body.admin { background: #f6f0e8; font-size: 16px; }
.login { min-height: 100vh; display: grid; place-items: center; padding: 20px; }
.login-card { width: 100%; max-width: 380px; display: grid; gap: 14px; }

.a-top { position: sticky; top: 0; z-index: 20; background: var(--ink); color: var(--cream); }
.a-top-in { display: flex; align-items: center; justify-content: space-between; padding: 8px 16px; max-width: 1100px; margin: 0 auto; }
.a-brand { display: flex; align-items: center; gap: 8px; color: var(--cream); text-decoration: none; font-family: var(--f-display); font-size: 1.15rem; min-height: 44px; }
.a-brand img { background: var(--cream); border-radius: 50%; }
.a-logout { background: none; border: 1px solid rgba(251, 246, 240, .35); color: var(--cream); border-radius: 8px; padding: 0 12px; min-height: 40px; cursor: pointer; }
.a-tabs { display: flex; overflow-x: auto; max-width: 1100px; margin: 0 auto; padding: 0 8px; }
.a-tabs button { flex: 1 0 auto; background: none; border: 0; color: #d8c9b7; font-weight: 700; padding: 12px 14px; min-height: 48px; cursor: pointer; border-bottom: 3px solid transparent; white-space: nowrap; }
.a-tabs button[aria-selected="true"] { color: var(--white); border-bottom-color: var(--wheat); }
.a-badge { display: inline-grid; place-items: center; min-width: 20px; height: 20px; border-radius: 10px; background: var(--rose); color: #fff; font-size: .72rem; padding: 0 6px; margin-left: 4px; }
.a-badge[hidden] { display: none; }
.a-main { max-width: 1100px; margin: 0 auto; padding: 16px 16px 110px; }
.a-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
.a-head h2 { font-size: 1.6rem; margin-bottom: 2px; }
.a-head p { margin: 0; }

.a-toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 14px 0; }
.a-toolbar input[type=search] { flex: 1 1 220px; min-height: 44px; }
.a-seg { display: flex; border: 1.5px solid var(--line); border-radius: var(--radius-btn); overflow: hidden; background: var(--white); }
.a-seg button { border: 0; background: none; padding: 0 14px; min-height: 44px; font-weight: 700; cursor: pointer; }
.a-seg button + button { border-left: 1.5px solid var(--line); }
.a-seg button[aria-pressed="true"] { background: var(--ink); color: var(--cream); }

.bake { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px 16px; }
.bake h3 { font-size: 1.1rem; margin-bottom: 8px; }
.bake-days { display: grid; gap: 10px; }
@media (min-width: 700px) { .bake-days { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); } }
.bake-day { border-left: 3px solid var(--olive); padding-left: 10px; font-size: .95rem; }
.bake-day b { display: block; }

.o-list { display: grid; gap: 10px; }
.o-card { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; text-align: left; width: 100%; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px 16px; cursor: pointer; font: inherit; color: inherit; }
.o-card:hover { border-color: var(--ink); }
.o-card .o-num { font-weight: 800; }
.o-card .o-total { font-weight: 800; font-size: 1.1rem; text-align: right; }
.o-card .o-when { color: var(--ink-soft); font-size: .92rem; }
.o-card .o-chips { grid-column: 1 / -1; display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.o-card.is-new { border-left: 5px solid var(--rose); }
.chip { display: inline-block; padding: 3px 8px; border-radius: 6px; font-size: .74rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; background: var(--paper-deep); }
.chip.pay-Pending { background: #f5e2c8; color: #7a4b12; }
.chip.pay-Paid { background: #dfe6cf; color: #3d4a1f; }
.chip.pay-Refunded, .chip.pay-Cancelled, .chip.st-Cancelled { background: #eddcd8; color: #6e2a1e; }
.chip.st-New { background: #f3d9d4; color: #7b3326; }
.chip.st-Ready { background: #d8e4ee; color: #1f3d56; }
.chip.st-Completed { background: #e4e0da; color: #5a5048; }

.o-dialog { width: min(680px, 100%); max-width: 100%; max-height: 100%; height: 100%; margin: 0 0 0 auto; padding: 0; border: 0; background: var(--cream); color: var(--ink); }
.o-dialog::backdrop { background: rgba(35, 24, 17, .5); }
@media (min-width: 700px) { .o-dialog { height: auto; max-height: 92vh; margin: auto; border-radius: var(--radius); } }
.od-head { position: sticky; top: 0; background: var(--cream); border-bottom: 1px solid var(--line); padding: 12px 16px; display: flex; justify-content: space-between; align-items: center; gap: 10px; z-index: 2; }
.od-head h2 { font-size: 1.4rem; margin: 0; }
.od-close { width: 44px; height: 44px; border-radius: 10px; border: 1.5px solid var(--line); background: var(--white); font-size: 1.4rem; cursor: pointer; }
.od-body { padding: 16px; display: grid; gap: 14px; }
.od-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.od-actions .btn { min-height: 52px; font-size: .82rem; padding: 0 .6em; white-space: normal; text-align: center; }
.od-actions .btn.is-current { outline: 3px solid var(--wheat); }
.od-sec { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; }
.od-sec h3 { font-family: var(--f-body); font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; color: var(--olive); margin-bottom: 8px; font-weight: 800; }
.od-sec p { margin: 0 0 4px; }
.od-contact { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.od-history { list-style: none; padding: 0; margin: 0; font-size: .88rem; color: var(--ink-soft); }

.p-card { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; display: grid; gap: 12px; margin-bottom: 12px; }
.p-card.is-off { opacity: .8; border-style: dashed; }
.p-row { display: grid; grid-template-columns: 96px 1fr; gap: 12px; align-items: start; }
.p-thumb { width: 96px; height: 96px; border-radius: 8px; object-fit: cover; background: var(--paper); border: 1px solid var(--line); }
.p-imgbtns { display: grid; gap: 6px; margin-top: 6px; }
.p-imgbtns label, .p-imgbtns button { font-size: .8rem; text-align: center; }
.toggles { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.toggle { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-weight: 700; cursor: pointer; }
.toggle input { width: 22px; height: 22px; accent-color: var(--olive); }
.p-foot { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.money-input { position: relative; }
.money-input span { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--ink-soft); }
.money-input input { padding-left: 26px; }

.s-day { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; margin-bottom: 12px; }
.s-day h3 { font-size: 1.15rem; display: flex; justify-content: space-between; gap: 10px; align-items: center; margin-bottom: 8px; }
.s-row { display: grid; grid-template-columns: 1fr 88px auto; gap: 8px; align-items: center; padding: 8px 0; border-top: 1px solid var(--line); }
.s-row .booked { font-size: .85rem; color: var(--ink-soft); }
.s-row input[type=number], .s-row input[type=time] { min-height: 44px; padding: 8px; }
.s-row.is-full .booked { color: var(--danger); font-weight: 800; }
.s-row .x { width: 44px; height: 44px; border: 1.5px solid var(--line); border-radius: 10px; background: var(--cream); cursor: pointer; }
.s-past { opacity: .6; }

.a-savebar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 15; background: rgba(246, 240, 232, .97); border-top: 1px solid var(--line); padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); display: flex; justify-content: flex-end; align-items: center; gap: 12px; }
.a-savebar .btn { min-width: 170px; }
.set-grid { display: grid; gap: 14px; }
.set-grid .form-card + .form-card { margin-top: 0; }
.set-grid h3 { font-size: 1.15rem; }
.kv { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; font-size: .95rem; }
.kv dt { font-weight: 700; }
.kv dd { margin: 0; word-break: break-word; }
.ok { color: #3d4a1f; font-weight: 700; }
.warn { color: var(--danger); font-weight: 700; }