/* Gold Choice Booking — styles for the waitlist screens (owned by that part of the app). Old-phone rules as app.css: no grid gap, literal colours. */

/* ---------- the waitlist (/app/waitlist) ---------- */
.wl-list > li { padding: .8rem 0 .6rem; }
.wl-item > div { margin-bottom: .15rem; }
.wl-high { border-left: 4px solid #e0a526; padding-left: .7rem !important; margin-left: -.2rem; }
.wl-who b { font-size: 1.05rem; }
.wl-who a { color: inherit; text-decoration: none; }
.wl-who a:hover b, .wl-who a:focus b { text-decoration: underline; }
.wl-when { color: #6f6470; color: var(--muted); font-size: .92rem; }
.wl-note { font-size: .92rem; font-style: italic; }
.wl-btns { margin-top: .35rem; }
.wl-btns form { margin: .25rem; }

/* a time that just opened (from the bell) */
.wl-opened { border-left: 5px solid #b04a6f; border-left-color: var(--accent); }
.wl-opened h2 { margin-top: 0; }

/* days-that-work checkboxes: a row of small boxes that wraps on a phone */
.wl-days { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -.2rem; }
.wl-days .wl-day { -webkit-flex: 0 0 auto; flex: 0 0 auto; margin: .2rem; padding: .35rem .6rem .35rem .45rem; border: 1px solid #d9cfd5; border-radius: 10px; min-height: 40px; -webkit-align-items: center; align-items: center; }
.wl-days .wl-day input { margin: 0 .35rem 0 0; }

/* free times on "Find a time" */
.wl-times form { margin: .25rem; }
.wl-times .btn { min-width: 5.5rem; }
.wl-times .btn small { display: block; font-size: .75rem; line-height: 1.1; }

/* ---------- the bell (/app/notifications) ---------- */
.ntf-clear { color: #2f6b3a; color: var(--ok); margin: .2rem 0; }
.ntf-item .rowlink { -webkit-align-items: flex-start; align-items: flex-start; }
.ntf-dot { -webkit-flex: none; flex: none; width: 10px; height: 10px; border-radius: 50%; margin: .45rem .65rem 0 .1rem; background: #23507a; }
.ntf-red .ntf-dot { background: #a12c2c; }
.ntf-amber .ntf-dot { background: #d18a12; }
.ntf-info .ntf-dot { background: #23507a; }
.ntf-rows { list-style: none; margin: .1rem 0 0 1.45rem; padding: 0; font-size: .9rem; }
.ntf-rows li { padding: .2rem 0; }
.ntf-day { margin: 1rem 0 .2rem; font-size: .85rem; text-transform: uppercase; letter-spacing: .05em; color: #6f6470; color: var(--muted); }
.ntf-note .rowlink { -webkit-align-items: flex-start; align-items: flex-start; }
.ntf-note .tag { margin-right: .2rem; }
.ntf-unread .ntf-text { font-weight: 700; }
.ntf-unread .rowlink { position: relative; }
.ntf-unread .rowlink:before { content: ""; position: absolute; left: -.6rem; top: .55rem; width: 6px; height: 6px; border-radius: 50%; background: #b04a6f; background: var(--accent); }
.card .ntf-day:first-of-type { margin-top: .4rem; }