/* ── Header menu ─────────────────────────────────────── */
.menu-list { display: grid; margin: 8px 0 16px; }
.menu-list a, .menu-row a { display: flex; align-items: center; justify-content: space-between; min-height: 52px; padding: 0 4px; border-bottom: 1px solid var(--line); color: var(--text); font: 600 1.05rem var(--h); }
.menu-list a svg { width: 18px; height: 18px; color: var(--muted); }
.menu-list a[aria-current="page"] { color: var(--link); }

/* ── Logged in: sit below the WordPress admin bar ────── */
body.admin-bar { --wpbar: 32px; }
@media (max-width: 782px) { body.admin-bar { --wpbar: 46px; } }
body.admin-bar .topbar { top: var(--wpbar); }
body.admin-bar .sheet { top: var(--wpbar); }
body.admin-bar .profile-grid aside { top: calc(84px + var(--wpbar)); }
/* Under 600px the admin bar scrolls away with the page, so the header goes back to the top. */
@media (max-width: 600px) { body.admin-bar .topbar { top: 0; } }

/* ── Footer ──────────────────────────────────────────── */
.site-footer { background: var(--surface); padding-block: 32px 28px; }
.site-footer .wrap { gap: 14px; }
.site-footer .brand { font-size: 1.05rem; color: var(--text); justify-self: start; }
.footer-tag { color: var(--muted); max-width: 40ch; }
.site-footer nav { display: flex; flex-wrap: wrap; gap: 4px 18px; }
.footer-links a { color: var(--text); font-weight: 500; min-height: 36px; display: inline-flex; align-items: center; }
.footer-contact { display: flex; flex-wrap: wrap; gap: 4px 18px; }
.footer-legal { font-size: .85rem; }
.site-footer a:hover { color: var(--link); }

/* Empty states: keep icons small (the big search icon on /find/ was unsized). */
.empty > svg { width: 48px; height: 48px; color: var(--muted); }
.empty .search-form { width: 100%; }

/* Category chips with an icon, and the Online filter in the search card */
.chip svg { width: 16px; height: 16px; flex: none; }
.find-online { grid-column: 1 / -1; }
.badge.info svg { color: var(--link); }

/* Customer dashboard (/account/ for people who book) */
.tdtn-hello { background: var(--tint); border-radius: var(--r); padding: 18px; gap: 8px !important; }
.tdtn-btn { display: inline-flex; align-items: center; min-height: var(--tap); padding: 0 20px; border-radius: 12px; background: var(--indigo); color: #fff; font: 700 1rem var(--h); }
.tdtn-row { display: grid; gap: 2px; color: var(--text); }
.tdtn-row span { color: var(--muted); font-size: .88rem; }
.tdtn-row:hover { border-left-color: var(--orange); }
.tdtn-links { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.tdtn-become { border-top: 1px solid var(--line); padding-top: 20px; }

/* Work photos: profile gallery and the edit grid in /account/ */
.work-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
@media (min-width: 700px) { .work-grid { grid-template-columns: repeat(3, 1fr); } }
.work-grid img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 12px; }
.tdtn-work-edit { border: 1px solid var(--line); border-radius: 14px; padding: 12px; margin: 0; display: grid; gap: 10px; }
.tdtn-work-edit legend { font-weight: 600; padding: 0 6px; }
.tdtn-work-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.tdtn-work-item { display: grid; gap: 4px; font-weight: 400; font-size: .85rem; color: var(--muted); }
.tdtn-work-item img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 10px; }

/* Profile photo edit */
.tdtn-photo-edit { display: flex; align-items: center; gap: 12px; }
.tdtn-photo-edit img { width: 72px; height: 72px; object-fit: cover; border-radius: 14px; }
