/* ==========================================================================
   AMYMO — estilos da aplicação (mobile-first, sem framework)
   1. Tokens   2. Base   3. Estrutura e navegação   4. Componentes
   5. Formulários   6. Diálogos e avisos   7. Telas   8. Preferências do sistema
   Regras de hover ficam em @media (hover: hover): nenhuma ação depende de hover.
   ========================================================================== */

/* 1. Tokens ---------------------------------------------------------------- */
:root {
    --color-primary: #17245f;
    --color-primary-strong: #0f1846;
    --color-primary-soft: #eef0f8;
    --color-accent: #16b8a6;
    --color-accent-strong: #0d8f82;
    --color-accent-text: #0a766c;
    --color-accent-soft: #e6f7f4;
    --color-accent-border: #b8e4dd;
    --color-bg: #f5f7fa;
    --color-surface: #ffffff;
    --color-surface-muted: #eef2f6;
    --color-border: #e2e7ee;
    --color-border-strong: #c9d1dc;
    --color-text: #1c274c;
    --color-text-secondary: #5b6579;
    --color-text-muted: #737c90;
    --color-success: #157347;
    --color-success-soft: #e7f5ed;
    --color-success-border: #c4e6d2;
    --color-warning: #8a5300;
    --color-warning-soft: #fff4e0;
    --color-warning-border: #f1dbb2;
    --color-danger: #b8323f;
    --color-danger-strong: #9a2733;
    --color-danger-soft: #fdeef0;
    --color-danger-border: #f3c9ce;
    --color-overlay: rgba(15, 24, 70, .45);
    --focus-ring: 0 0 0 3px rgba(22, 184, 166, .4);

    --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --text-xs: .75rem;
    --text-sm: .875rem;
    --text-base: .9375rem;
    --text-md: 1rem;
    --text-lg: 1.125rem;
    --text-xl: 1.375rem;
    --text-2xl: 1.75rem;

    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --space-10: 40px;

    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 22px;
    --radius-pill: 999px;

    --shadow-sm: 0 1px 2px rgba(23, 36, 95, .05);
    --shadow-md: 0 6px 20px rgba(23, 36, 95, .08);
    --shadow-lg: 0 18px 44px rgba(23, 36, 95, .18);

    --touch: 44px;
    --control: 48px;
    --topbar: 56px;
    --bottom-nav: 64px;
    --sidebar: 248px;
    --content: 1120px;
    --content-medio: 920px;
    --content-estreito: 720px;
    --gutter: 16px;

    --safe-top: env(safe-area-inset-top, 0px);
    --safe-right: env(safe-area-inset-right, 0px);
    --safe-bottom: env(safe-area-inset-bottom, 0px);
    --safe-left: env(safe-area-inset-left, 0px);

    --ease: cubic-bezier(.2, .7, .2, 1);
    --fast: 140ms;
    --medium: 220ms;
}

/* 2. Base ------------------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; }

html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    scroll-padding-top: calc(var(--topbar) + var(--safe-top) + var(--space-3));
}

html:has(dialog[open]) { overflow: hidden; }

body {
    min-width: 320px;
    margin: 0;
    background: var(--color-bg);
    color: var(--color-text);
    font: 400 var(--text-md)/1.5 var(--font);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 {
    margin: 0;
    color: var(--color-primary);
    font-weight: 700;
    letter-spacing: -.015em;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

h2 { font-size: var(--text-lg); }
h3, h4 { font-size: var(--text-md); }

p, dl, dd, figure, blockquote { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
img, svg { display: block; max-width: 100%; }
strong { font-weight: 650; }

a {
    color: var(--color-accent-text);
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
}

p a, .hint a, .alert a, .day-detail__empty a {
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}

button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }
fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
legend { padding: 0; }
address { font-style: normal; }
summary { cursor: pointer; -webkit-tap-highlight-color: transparent; }
summary::-webkit-details-marker { display: none; }

[hidden] { display: none !important; }

:focus-visible {
    outline: 3px solid rgba(22, 184, 166, .6);
    outline-offset: 2px;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.skip-link {
    position: fixed;
    z-index: 100;
    top: -80px;
    left: var(--space-3);
    padding: var(--space-3) var(--space-4);
    border-radius: var(--radius-md);
    background: var(--color-primary);
    color: #fff;
    font-weight: 600;
}

.skip-link:focus { top: calc(var(--safe-top) + var(--space-2)); }

/* Ícones: largura fixa evita deslocamento enquanto a fonte carrega. */
.material-symbols-rounded {
    display: inline-block;
    flex: none;
    width: 1em;
    overflow: hidden;
    font-family: "Material Symbols Rounded";
    font-size: 22px;
    font-style: normal;
    font-weight: normal;
    font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    font-feature-settings: "liga";
    -webkit-font-smoothing: antialiased;
    user-select: none;
}

.eyebrow {
    display: block;
    color: var(--color-accent-text);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: .08em;
    line-height: 1.4;
    text-transform: uppercase;
}

.hint { color: var(--color-text-secondary); font-size: var(--text-sm); line-height: 1.45; }
.field-error { color: var(--color-danger); font-size: var(--text-sm); font-weight: 550; line-height: 1.4; }
.field-error:empty { display: none; }
.page-lead { max-width: 68ch; color: var(--color-text-secondary); }
.preserve-lines, .booking-preserve { white-space: pre-wrap; overflow-wrap: anywhere; }
.decision-note { color: var(--color-danger); font-size: var(--text-sm); }
.stack { display: grid; gap: var(--space-4); min-width: 0; }

/* 3. Estrutura e navegação ---------------------------------------------------- */
.app-body { min-height: 100dvh; }
.app-sidebar { display: none; }

.app-frame {
    display: flex;
    min-width: 0;
    min-height: 100dvh;
    flex-direction: column;
}

.app-topbar {
    position: sticky;
    z-index: 20;
    top: 0;
    display: flex;
    min-height: calc(var(--topbar) + var(--safe-top));
    padding: var(--safe-top) max(var(--space-3), var(--safe-right)) 0 max(var(--gutter), var(--safe-left));
    gap: var(--space-2);
    align-items: center;
    border-bottom: 1px solid var(--color-border);
    background: rgba(255, 255, 255, .94);
    -webkit-backdrop-filter: saturate(160%) blur(10px);
    backdrop-filter: saturate(160%) blur(10px);
}

.app-topbar__back { margin-left: calc(var(--space-2) * -1); }

.app-topbar__title {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    font-size: var(--text-lg);
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-content {
    display: flex;
    width: 100%;
    max-width: calc(var(--content) + 2 * var(--gutter));
    margin: 0 auto;
    padding: var(--space-5) max(var(--gutter), var(--safe-right)) calc(var(--bottom-nav) + var(--safe-bottom) + var(--space-8)) max(var(--gutter), var(--safe-left));
    flex: 1;
    flex-direction: column;
    gap: var(--space-6);
}

.app-content:focus { outline: none; }
.app-content--medio { max-width: calc(var(--content-medio) + 2 * var(--gutter)); }
.app-content--estreito { max-width: calc(var(--content-estreito) + 2 * var(--gutter)); }

.brand { display: inline-flex; flex: none; align-items: center; }
.brand img { width: 132px; height: auto; }

/* Barra inferior (mobile) */
.bottom-navigation {
    position: fixed;
    z-index: 30;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    padding: 0 max(var(--space-1), var(--safe-right)) var(--safe-bottom) max(var(--space-1), var(--safe-left));
    border-top: 1px solid var(--color-border);
    background: rgba(255, 255, 255, .97);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

.bottom-navigation > a,
.bottom-navigation > button {
    display: flex;
    min-width: 0;
    height: var(--bottom-nav);
    padding: 0 2px;
    flex: 1 1 0;
    flex-direction: column;
    gap: 2px;
    align-items: center;
    justify-content: center;
    border: 0;
    background: none;
    color: var(--color-text-secondary);
    font-size: .6875rem;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
}

.bottom-navigation .material-symbols-rounded {
    width: 56px;
    height: 30px;
    border-radius: var(--radius-pill);
    font-size: 24px;
    line-height: 30px;
    text-align: center;
    transition: background-color var(--fast);
}

.bottom-navigation [aria-current="page"] { color: var(--color-primary); }

.bottom-navigation [aria-current="page"] .material-symbols-rounded {
    background: var(--color-accent-soft);
    color: var(--color-accent-text);
    font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24;
}

.bottom-navigation > :active .material-symbols-rounded { background: var(--color-surface-muted); }

/* Lista de destinos (barra lateral e menu) */
.nav-list, .nav-group ul { display: grid; gap: 2px; }
.nav-group { margin-top: var(--space-4); }

.nav-group__label {
    display: block;
    padding: 0 var(--space-3) var(--space-2);
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
    font-weight: 650;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.nav-link {
    display: flex;
    min-height: var(--control);
    padding: 0 var(--space-3);
    gap: var(--space-3);
    align-items: center;
    border-radius: var(--radius-md);
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    font-weight: 600;
    transition: background-color var(--fast), color var(--fast);
}

.nav-link .material-symbols-rounded { color: var(--color-text-muted); }
.nav-link:active { background: var(--color-surface-muted); }

.nav-link[aria-current="page"] {
    background: var(--color-primary-soft);
    color: var(--color-primary);
}

.nav-link[aria-current="page"] .material-symbols-rounded {
    color: var(--color-accent-text);
    font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24;
}

/* Menu lateral (mobile) */
.drawer {
    inset: 0 auto 0 0;
    width: min(86vw, 340px);
    max-width: none;
    height: 100%;
    max-height: none;
    margin: 0;
    padding: calc(var(--safe-top) + var(--space-2)) var(--space-3) calc(var(--safe-bottom) + var(--space-6)) max(var(--space-3), var(--safe-left));
    overflow-y: auto;
    border: 0;
    background: var(--color-surface);
    color: var(--color-text);
    box-shadow: var(--shadow-lg);
    overscroll-behavior: contain;
    transform: translateX(-100%);
    transition: transform var(--medium) var(--ease), overlay var(--medium) allow-discrete, display var(--medium) allow-discrete;
}

.drawer[open] { transform: none; }

.drawer::backdrop {
    background: var(--color-overlay);
    opacity: 0;
    transition: opacity var(--medium), overlay var(--medium) allow-discrete, display var(--medium) allow-discrete;
}

.drawer[open]::backdrop { opacity: 1; }

@starting-style {
    .drawer[open] { transform: translateX(-100%); }
    .drawer[open]::backdrop { opacity: 0; }
}

.drawer__header {
    display: flex;
    min-height: var(--topbar);
    padding-left: var(--space-3);
    align-items: center;
    justify-content: space-between;
}

/* Menu da conta (topo) */
.account-menu { position: relative; flex: none; }

.account-menu__trigger {
    display: flex;
    min-height: var(--touch);
    padding: 4px;
    gap: var(--space-2);
    align-items: center;
    border-radius: var(--radius-pill);
    list-style: none;
}

.account-menu__trigger:active { background: var(--color-surface-muted); }
.account-menu__name, .account-menu__chevron { display: none; }
.account-menu[open] .account-menu__chevron { transform: rotate(180deg); }

.account-menu__panel {
    position: absolute;
    z-index: 40;
    top: calc(100% + var(--space-2));
    right: 0;
    display: grid;
    width: min(340px, calc(100vw - 2 * var(--space-3)));
    max-height: calc(100dvh - var(--topbar) - var(--safe-top) - var(--space-6));
    padding: var(--space-4);
    overflow-y: auto;
    gap: var(--space-4);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    box-shadow: var(--shadow-lg);
}

.account-menu__identity {
    display: flex;
    min-width: 0;
    gap: var(--space-3);
    align-items: center;
}

.account-menu__identity > div { display: grid; min-width: 0; }
.account-menu__identity strong, .account-menu__email { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-menu__identity strong { color: var(--color-primary); }
.account-menu__email { color: var(--color-text-secondary); font-size: var(--text-sm); }

.account-menu__details {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-2);
}

.account-menu__details > div {
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-md);
    background: var(--color-bg);
}

.account-menu__details > div:last-child { grid-column: 1 / -1; }
.account-menu__details dt { color: var(--color-text-secondary); font-size: var(--text-xs); }
.account-menu__details dd { overflow: hidden; font-size: var(--text-sm); font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.account-menu__actions { display: grid; gap: var(--space-2); }

/* Seções e cabeçalhos */
.section { display: grid; min-width: 0; gap: var(--space-3); }

.section-header {
    display: flex;
    min-width: 0;
    gap: var(--space-3);
    align-items: center;
    justify-content: space-between;
}

.section-header > div { min-width: 0; }
.section-header p { margin-top: 2px; color: var(--color-text-secondary); font-size: var(--text-sm); }
.section-header > .btn--text { flex: none; margin-right: calc(var(--space-3) * -1); }

.page-intro {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.page-intro > .btn { width: 100%; }

.greeting h2, .welcome h2 { font-size: var(--text-2xl); }
.greeting p { margin-top: var(--space-1); color: var(--color-text-secondary); }

.welcome {
    position: relative;
    display: grid;
    padding: var(--space-6);
    overflow: hidden;
    gap: var(--space-2);
    border-radius: var(--radius-xl);
    background: var(--color-primary);
    color: #fff;
}

.welcome::after {
    position: absolute;
    top: -90px;
    right: -70px;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background: rgba(22, 184, 166, .16);
    content: "";
}

.welcome > * { position: relative; z-index: 1; }
.welcome .eyebrow { color: #7fe3d7; }
.welcome h2 { color: #fff; }
.welcome p { max-width: 54ch; color: rgba(255, 255, 255, .82); }

/* 4. Componentes ------------------------------------------------------------- */
.btn {
    display: inline-flex;
    min-height: var(--control);
    padding: 10px 20px;
    gap: var(--space-2);
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: var(--radius-md);
    background: var(--color-primary);
    color: #fff;
    font-size: var(--text-base);
    font-weight: 600;
    line-height: 1.25;
    text-align: center;
    text-decoration: none;
    transition: background-color var(--fast), border-color var(--fast), color var(--fast), transform var(--fast);
    user-select: none;
}

.btn .material-symbols-rounded { font-size: 20px; }
.btn:active { transform: scale(.98); }
.btn--block { width: 100%; }

.btn--secondary {
    border-color: var(--color-border-strong);
    background: var(--color-surface);
    color: var(--color-primary);
}

.btn--text,
.btn--text-danger,
.btn--text-positive {
    padding-inline: var(--space-3);
    background: transparent;
    color: var(--color-accent-text);
}

.btn--text-danger { color: var(--color-danger); }
.btn--text-positive { color: var(--color-success); }
.btn--danger { background: var(--color-danger); }
.btn--danger-outline { color: var(--color-danger); }

.btn:disabled {
    border-color: transparent;
    background: var(--color-surface-muted);
    color: var(--color-text-muted);
    cursor: not-allowed;
    transform: none;
}

.btn--text:disabled, .btn--text-danger:disabled, .btn--text-positive:disabled { background: transparent; }

/* Envio em andamento: o botão mantém a cor e ganha um indicador. */
.btn[aria-busy="true"] {
    border-color: transparent;
    background: var(--color-primary);
    color: #fff;
    cursor: progress;
    opacity: .88;
}

.btn--secondary[aria-busy="true"], .btn--text[aria-busy="true"], .btn--text-danger[aria-busy="true"], .btn--text-positive[aria-busy="true"] {
    background: transparent;
    color: var(--color-text-secondary);
}

.btn--danger[aria-busy="true"] { background: var(--color-danger); }

.btn[aria-busy="true"]::after {
    width: 1em;
    height: 1em;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: girar .7s linear infinite;
    content: "";
}

@keyframes girar { to { transform: rotate(360deg); } }

.icon-button {
    display: inline-grid;
    width: var(--touch);
    height: var(--touch);
    padding: 0;
    flex: none;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--color-text-secondary);
    transition: background-color var(--fast), color var(--fast);
}

.icon-button:active { background: var(--color-surface-muted); }
.icon-button:disabled { cursor: not-allowed; opacity: .45; }
.icon-button--danger { color: var(--color-danger); }
.icon-button--positive { color: var(--color-success); }

.text-link {
    display: inline-flex;
    min-height: var(--touch);
    gap: 6px;
    align-items: center;
    font-size: var(--text-sm);
    font-weight: 600;
}

.icon-tile {
    display: inline-grid;
    width: 44px;
    height: 44px;
    flex: none;
    place-items: center;
    border-radius: var(--radius-md);
    background: var(--color-accent-soft);
    color: var(--color-accent-text);
    font-size: 24px;
}

.icon-tile--lg { width: 56px; height: 56px; border-radius: var(--radius-lg); font-size: 28px; }

.avatar {
    display: inline-grid;
    width: 40px;
    height: 40px;
    flex: none;
    overflow: hidden;
    place-items: center;
    border-radius: 50%;
    background: var(--color-accent-soft);
    color: var(--color-accent-text);
    font-size: var(--text-sm);
    font-weight: 700;
}

.avatar img { width: 100%; height: 100%; object-fit: cover; }
.avatar > .material-symbols-rounded { font-size: 24px; }
.avatar--sm { width: 34px; height: 34px; font-size: .8125rem; }
.avatar--md { width: 48px; height: 48px; }
.avatar--lg { width: 52px; height: 52px; font-size: var(--text-lg); }
.avatar--xl { width: 76px; height: 76px; font-size: var(--text-2xl); }
.avatar--xl > .material-symbols-rounded { font-size: 38px; }
.avatar--square { border-radius: var(--radius-md); }

.chip-list { display: flex; flex-wrap: wrap; gap: 6px; }

.chip {
    display: inline-flex;
    min-height: 28px;
    padding: 4px 10px;
    align-items: center;
    border-radius: var(--radius-pill);
    background: var(--color-primary-soft);
    color: var(--color-primary);
    font-size: var(--text-xs);
    font-weight: 600;
    line-height: 1.2;
}

.chip--accent { background: var(--color-accent-soft); color: var(--color-accent-text); }

.status-badge {
    display: inline-flex;
    min-height: 26px;
    padding: 3px 10px;
    gap: 6px;
    align-items: center;
    justify-self: start;
    border-radius: var(--radius-pill);
    background: var(--color-primary-soft);
    color: var(--color-primary);
    font-size: var(--text-xs);
    font-weight: 650;
    line-height: 1.2;
    white-space: nowrap;
}

.status-badge > [aria-hidden="true"]:first-child {
    width: 6px;
    height: 6px;
    flex: none;
    border-radius: 50%;
    background: currentColor;
}

.status-badge--active { background: var(--color-success-soft); color: var(--color-success); }
.status-badge--warning { background: var(--color-warning-soft); color: var(--color-warning); }
.status-badge--danger { background: var(--color-danger-soft); color: var(--color-danger); }
.status-badge--inactive { background: var(--color-surface-muted); color: var(--color-text-secondary); }
.status-badge--accent { background: var(--color-accent-soft); color: var(--color-accent-text); }

/* Superfícies */
.card {
    display: grid;
    min-width: 0;
    padding: var(--space-4);
    gap: var(--space-3);
    align-content: start;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
}

.card.section { gap: var(--space-4); }
.card__title { font-size: var(--text-lg); }

.card__actions {
    display: flex;
    margin: 0 calc(var(--space-3) * -1) calc(var(--space-2) * -1);
    flex-wrap: wrap;
    gap: 0 var(--space-1);
    align-items: center;
}

.card-grid { display: grid; min-width: 0; gap: var(--space-3); }

/* Linha de lista: mídia, texto e ação final */
.list { display: grid; min-width: 0; gap: var(--space-2); }

.list-item {
    display: flex;
    min-width: 0;
    min-height: 64px;
    padding: var(--space-3) var(--space-4);
    gap: var(--space-3);
    align-items: center;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    color: var(--color-text);
}

.list-item--link { transition: background-color var(--fast), border-color var(--fast); }
.list-item--link:active { background: var(--color-surface-muted); }
.list-item.is-inactive { background: var(--color-surface-muted); }

.list-item__body {
    display: grid;
    min-width: 0;
    flex: 1;
    gap: 2px;
}

.list-item__body > strong { color: var(--color-primary); overflow-wrap: anywhere; }
.list-item__body > span:not(.status-badge) { color: var(--color-text-secondary); overflow-wrap: anywhere; }
.list-item__body > small { color: var(--color-text-secondary); font-size: var(--text-sm); overflow-wrap: anywhere; }
.list-item__body > .status-badge { margin-top: var(--space-1); }
.list-item__body > .list-item__note { color: var(--color-warning); font-weight: 600; }
.list-item__chevron { color: var(--color-text-muted); }

/* Lista agrupada em um único cartão, com divisórias */
.list--grouped {
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
}

.list--grouped > .list-item { border: 0; border-radius: 0; }
.list--grouped > .list-item + .list-item { border-top: 1px solid var(--color-border); }

/* Identidade: avatar, nome e ação */
.entity {
    display: flex;
    min-width: 0;
    gap: var(--space-3);
    align-items: center;
}

.entity__body { display: grid; min-width: 0; flex: 1; gap: 2px; }
.entity__body > strong { color: var(--color-primary); overflow-wrap: anywhere; }
.entity__body > small { color: var(--color-text-secondary); font-size: var(--text-sm); overflow-wrap: anywhere; }

.profile-hero {
    display: flex;
    min-width: 0;
    gap: var(--space-4);
    align-items: center;
}

.profile-hero__copy { display: grid; min-width: 0; gap: var(--space-1); }
.profile-hero__copy h2 { font-size: var(--text-xl); }
.profile-hero__copy p { color: var(--color-text-secondary); overflow-wrap: anywhere; }

/* Estados vazios */
.empty-state {
    display: flex;
    padding: var(--space-8) var(--space-5);
    flex-direction: column;
    gap: var(--space-2);
    align-items: center;
    border: 1px dashed var(--color-border-strong);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    text-align: center;
}

.empty-state__icon {
    display: grid;
    width: 56px;
    height: 56px;
    margin-bottom: var(--space-1);
    place-items: center;
    border-radius: 50%;
    background: var(--color-accent-soft);
    color: var(--color-accent-text);
    font-size: 28px;
}

.empty-state h2, .empty-state h3 { font-size: var(--text-lg); }
.empty-state p { max-width: 36ch; color: var(--color-text-secondary); font-size: var(--text-sm); }
.empty-state .btn { margin-top: var(--space-2); }

.empty-inline {
    display: grid;
    padding: var(--space-4);
    gap: var(--space-1);
    justify-items: center;
    border-radius: var(--radius-md);
    background: var(--color-surface-muted);
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    text-align: center;
}

/* Alertas */
.flash { display: grid; gap: var(--space-2); }
.flash:not(:has(> :not([hidden]))) { display: none; }

.alert {
    display: flex;
    padding: var(--space-3) var(--space-4);
    gap: var(--space-3);
    align-items: flex-start;
    border: 1px solid var(--color-accent-border);
    border-radius: var(--radius-md);
    background: var(--color-accent-soft);
    color: var(--color-primary);
    font-size: var(--text-sm);
    line-height: 1.45;
}

.alert > .material-symbols-rounded { margin-top: -1px; font-size: 20px; }
.alert > div, .alert > span:last-child { min-width: 0; flex: 1; }
.alert ul { padding-left: 1.1em; list-style: disc; }
.alert--success { border-color: var(--color-success-border); background: var(--color-success-soft); color: #10583a; }
.alert--error { border-color: var(--color-danger-border); background: var(--color-danger-soft); color: #8f2531; }
.alert--warning { border-color: var(--color-warning-border); background: var(--color-warning-soft); color: #6d4100; }
.alert--info { border-color: var(--color-accent-border); background: var(--color-accent-soft); color: var(--color-primary); }

/* Recolhíveis (details/summary) */
.disclosure {
    min-width: 0;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
}

.disclosure > summary {
    display: flex;
    min-height: var(--control);
    padding: var(--space-3) var(--space-4);
    gap: var(--space-2);
    align-items: center;
    color: var(--color-primary);
    font-weight: 600;
    list-style: none;
}

.disclosure__chevron { margin-left: auto; color: var(--color-text-muted); transition: transform var(--fast); }
.disclosure[open] > summary .disclosure__chevron { transform: rotate(180deg); }
.disclosure[open] > summary { border-bottom: 1px solid var(--color-border); }
.disclosure__body { padding: var(--space-4); }
.disclosure--add { border-style: dashed; border-color: var(--color-border-strong); }
.disclosure--add > summary { color: var(--color-accent-text); }
.disclosure--danger > summary { color: var(--color-danger); }
.disclosure--danger[open] { border-color: var(--color-danger-border); }

/* Paginação */
.pagination {
    display: flex;
    gap: var(--space-3);
    align-items: center;
    justify-content: center;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
}

/* 5. Formulários ------------------------------------------------------------- */
.form { display: grid; min-width: 0; gap: var(--space-5); }
.form-grid { display: grid; min-width: 0; gap: var(--space-4); }
.field { display: grid; min-width: 0; gap: 6px; align-content: start; }

.field > label, .field-label, .field__label-row > label {
    color: var(--color-text);
    font-size: var(--text-sm);
    font-weight: 600;
}

.field__label-row {
    display: flex;
    gap: var(--space-3);
    align-items: center;
    justify-content: space-between;
}

.field__label-row .text-link { min-height: 32px; margin: -6px 0; }
.label-optional { color: var(--color-text-secondary); font-weight: 400; }

input:not([type="checkbox"], [type="radio"], [type="file"], [type="hidden"], [type="submit"], [type="button"]),
select,
textarea {
    width: 100%;
    min-width: 0;
    min-height: var(--control);
    margin: 0;
    padding: 11px 14px;
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-text);
    font-size: 16px;
    line-height: 1.4;
    -webkit-appearance: none;
    appearance: none;
    transition: border-color var(--fast), box-shadow var(--fast);
}

input::placeholder, textarea::placeholder { color: var(--color-text-muted); opacity: 1; }
textarea { min-height: 112px; resize: vertical; }

select {
    padding-right: 42px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24'%3E%3Cpath fill='%235b6579' d='M12 15.4 6.6 10l1.4-1.4 4 4 4-4 1.4 1.4z'/%3E%3C/svg%3E");
    background-position: right 12px center;
    background-repeat: no-repeat;
}

input[type="date"], input[type="time"] { display: flex; align-items: center; color-scheme: light; }
input::-webkit-date-and-time-value { text-align: left; }

input:not([type="checkbox"], [type="radio"], [type="file"]):focus,
select:focus,
textarea:focus {
    border-color: var(--color-accent-strong);
    outline: none;
    box-shadow: var(--focus-ring);
}

input:disabled, select:disabled, textarea:disabled {
    background-color: var(--color-surface-muted);
    color: var(--color-text-secondary);
    cursor: not-allowed;
}

.has-error input, .has-error select, .has-error textarea, input[aria-invalid="true"] { border-color: var(--color-danger); }

input[type="checkbox"], input[type="radio"] {
    width: 20px;
    height: 20px;
    margin: 0;
    flex: none;
    accent-color: var(--color-accent-strong);
    cursor: pointer;
}

input[type="file"] {
    width: 100%;
    min-width: 0;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
}

input[type="file"]::file-selector-button {
    min-height: 40px;
    margin-right: var(--space-3);
    padding: 8px 16px;
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-primary);
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

.input-wrap { position: relative; min-width: 0; }

.input-wrap > .material-symbols-rounded:first-child {
    position: absolute;
    top: 50%;
    left: 14px;
    color: var(--color-text-muted);
    font-size: 20px;
    pointer-events: none;
    transform: translateY(-50%);
}

.input-wrap--icon > input { padding-left: 44px; }
.input-wrap:has(.password-toggle) > input { padding-right: 52px; }

.password-toggle {
    position: absolute;
    top: 50%;
    right: 2px;
    transform: translateY(-50%);
}

.form-actions {
    display: flex;
    flex-direction: column-reverse;
    gap: var(--space-2);
}

.form-actions > .btn { width: 100%; }

/* Opções em cartão (radio ou checkbox) */
.choice-list { display: grid; min-width: 0; gap: var(--space-2); }

.choice {
    display: flex;
    min-width: 0;
    min-height: 56px;
    padding: var(--space-3) var(--space-4);
    gap: var(--space-3);
    align-items: flex-start;
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    cursor: pointer;
    transition: border-color var(--fast), background-color var(--fast);
}

.choice > input { margin-top: 1px; }
.choice__body { display: grid; min-width: 0; gap: 2px; }
.choice__body strong { color: var(--color-text); font-weight: 600; }
.choice__body small { color: var(--color-text-secondary); font-size: var(--text-sm); overflow-wrap: anywhere; }
.choice:has(input:checked) { border-color: var(--color-accent-strong); background: var(--color-accent-soft); }
.choice:has(input:focus-visible) { box-shadow: var(--focus-ring); }
.choice.is-disabled, .choice:has(input:disabled) { cursor: not-allowed; opacity: .55; }

/* Lista de checkboxes simples */
.check-list { display: grid; padding: 0 var(--space-4); }

.check {
    display: flex;
    min-height: var(--control);
    padding: var(--space-2) 0;
    gap: var(--space-3);
    align-items: center;
    font-size: var(--text-base);
    cursor: pointer;
}

.check-list > .check + .check { border-top: 1px solid var(--color-border); }

/* Interruptor */
input.switch {
    position: relative;
    width: 46px;
    height: 28px;
    flex: none;
    border-radius: var(--radius-pill);
    background: var(--color-border-strong);
    -webkit-appearance: none;
    appearance: none;
    transition: background-color var(--fast);
}

input.switch::before {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(15, 24, 70, .3);
    content: "";
    transition: transform var(--fast) var(--ease);
}

input.switch:checked { background: var(--color-accent-strong); }
input.switch:checked::before { transform: translateX(18px); }
input.switch:disabled { cursor: not-allowed; opacity: .5; }

/* Mesmo visual para botões que funcionam como interruptor */
.switch-button {
    position: relative;
    width: 46px;
    height: 28px;
    padding: 0;
    flex: none;
    border: 0;
    border-radius: var(--radius-pill);
    background: var(--color-border-strong);
    transition: background-color var(--fast);
}

.switch-button::before {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(15, 24, 70, .3);
    content: "";
    transition: transform var(--fast) var(--ease);
}

.switch-button[aria-checked="true"] { background: var(--color-accent-strong); }
.switch-button[aria-checked="true"]::before { transform: translateX(18px); }
.switch-button:disabled { cursor: not-allowed; opacity: .5; }

.toggle-row {
    display: flex;
    min-width: 0;
    min-height: 64px;
    padding: var(--space-3) var(--space-4);
    gap: var(--space-4);
    align-items: center;
    justify-content: space-between;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    cursor: pointer;
}

label.toggle-row:has(.switch:checked), .toggle-row.is-on { border-color: var(--color-accent-border); background: var(--color-accent-soft); }
.toggle-row__copy { display: grid; min-width: 0; gap: 2px; }
.toggle-row__copy strong { color: var(--color-primary); font-weight: 600; }
.toggle-row__copy small { color: var(--color-text-secondary); font-size: var(--text-sm); }

/* Campo de busca com ícone */
.search-field { position: relative; min-width: 0; }

.search-field > .material-symbols-rounded {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 14px;
    color: var(--color-text-muted);
    font-size: 20px;
    pointer-events: none;
    transform: translateY(-50%);
}

.search-field > input { padding-right: 48px; padding-left: 44px; }
.search-field > .icon-button { position: absolute; top: 50%; right: 2px; transform: translateY(-50%); }

/* Formulário em linha (desktop) e empilhado (mobile) */
.inline-form { display: grid; min-width: 0; gap: var(--space-3); }

/* Barra de ação fixa em formulários longos */
.sticky-actions {
    position: sticky;
    z-index: 5;
    bottom: calc(var(--bottom-nav) + var(--safe-bottom) + var(--space-2));
    padding: var(--space-3);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .96);
    box-shadow: var(--shadow-md);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

/* 6. Diálogos e avisos -------------------------------------------------------- */
.dialog {
    width: calc(100% - 2 * var(--space-4));
    max-width: 440px;
    padding: var(--space-6);
    border: 0;
    border-radius: var(--radius-xl);
    background: var(--color-surface);
    color: var(--color-text);
    box-shadow: var(--shadow-lg);
    opacity: 0;
    transform: translateY(16px);
    transition: opacity var(--medium), transform var(--medium) var(--ease), overlay var(--medium) allow-discrete, display var(--medium) allow-discrete;
}

.dialog[open] { opacity: 1; transform: none; }

.dialog::backdrop {
    background: var(--color-overlay);
    opacity: 0;
    transition: opacity var(--medium), overlay var(--medium) allow-discrete, display var(--medium) allow-discrete;
}

.dialog[open]::backdrop { opacity: 1; }

@starting-style {
    .dialog[open] { opacity: 0; transform: translateY(16px); }
    .dialog[open]::backdrop { opacity: 0; }
}

/* No celular a confirmação abre como painel inferior, perto do polegar. */
@media (max-width: 599px) {
    .dialog {
        width: 100%;
        max-width: none;
        margin: auto 0 0;
        padding-bottom: calc(var(--space-6) + var(--safe-bottom));
        border-radius: var(--radius-xl) var(--radius-xl) 0 0;
        transform: translateY(100%);
    }

    .dialog[open] { transform: none; }

    @starting-style {
        .dialog[open] { transform: translateY(100%); }
    }
}

.dialog__header { display: flex; margin-bottom: var(--space-3); gap: var(--space-3); align-items: center; }
.dialog__header h2 { font-size: var(--text-lg); }

.dialog__icon {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: var(--radius-md);
    background: var(--color-warning-soft);
    color: var(--color-warning);
    font-size: 24px;
}

.dialog.is-danger .dialog__icon { background: var(--color-danger-soft); color: var(--color-danger); }
.dialog__text { color: var(--color-text-secondary); }

.dialog__note {
    display: flex;
    margin-top: var(--space-3);
    padding: var(--space-3);
    gap: var(--space-2);
    border-radius: var(--radius-md);
    background: var(--color-bg);
    font-size: var(--text-sm);
}

.dialog__note .material-symbols-rounded { color: var(--color-accent-text); font-size: 20px; }

.dialog__actions {
    display: flex;
    margin-top: var(--space-6);
    flex-direction: column-reverse;
    gap: var(--space-2);
}

.dialog__actions .btn { width: 100%; }

.toast-region {
    position: fixed;
    z-index: 60;
    right: max(var(--space-4), var(--safe-right));
    bottom: calc(var(--bottom-nav) + var(--safe-bottom) + var(--space-3));
    left: max(var(--space-4), var(--safe-left));
    display: grid;
    gap: var(--space-2);
    justify-items: center;
    pointer-events: none;
}

.toast {
    display: flex;
    width: 100%;
    max-width: 440px;
    padding: var(--space-3) var(--space-4);
    gap: var(--space-3);
    align-items: center;
    border-radius: var(--radius-md);
    background: var(--color-primary);
    color: #fff;
    box-shadow: var(--shadow-lg);
    font-size: var(--text-sm);
    animation: aviso-entra var(--medium) var(--ease);
}

.toast .material-symbols-rounded { color: #7fe3d7; font-size: 20px; }
.toast.is-leaving { animation: aviso-sai 200ms ease forwards; }

@keyframes aviso-entra { from { opacity: 0; transform: translateY(10px); } }
@keyframes aviso-sai { to { opacity: 0; transform: translateY(10px); } }

/* 7. Telas -------------------------------------------------------------------- */

/* Acesso: login, cadastro e recuperação */
.auth-body { background: var(--color-surface); }

.auth {
    display: grid;
    min-height: 100dvh;
}

.auth__panel {
    display: flex;
    min-width: 0;
    padding: max(var(--space-8), var(--safe-top)) max(var(--space-5), var(--safe-right)) max(var(--space-8), var(--safe-bottom)) max(var(--space-5), var(--safe-left));
    align-items: center;
    justify-content: center;
}

.auth__content {
    display: grid;
    width: 100%;
    max-width: 400px;
    gap: var(--space-5);
}

.auth__content--wide { max-width: 560px; }
.auth__brand { justify-self: start; margin-bottom: var(--space-4); }
.auth__brand img { width: 150px; }
.auth__heading { display: grid; gap: var(--space-2); }
.auth__heading h1 { font-size: var(--text-2xl); }
.auth__heading p { color: var(--color-text-secondary); }
.auth__footer { color: var(--color-text-secondary); font-size: var(--text-sm); text-align: center; }
.auth__footer a { display: inline-flex; min-height: var(--touch); align-items: center; font-weight: 650; }
.auth__privacy { color: var(--color-text-secondary); font-size: var(--text-xs); text-align: center; }

.auth__welcome {
    position: relative;
    display: none;
    padding: var(--space-10) 64px;
    overflow: hidden;
    align-items: flex-end;
    background: var(--color-primary);
    color: #fff;
}

.auth__welcome::before {
    position: absolute;
    top: -140px;
    right: -100px;
    width: 380px;
    height: 380px;
    border-radius: 50%;
    background: rgba(22, 184, 166, .14);
    content: "";
}

.auth__welcome-content { position: relative; display: grid; max-width: 500px; gap: var(--space-4); }

.auth__welcome-icon {
    display: grid;
    width: 60px;
    height: 60px;
    margin-bottom: var(--space-4);
    place-items: center;
    border-radius: var(--radius-xl);
    background: var(--color-accent);
    color: var(--color-primary);
    font-size: 32px;
    font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24;
}

.auth__welcome .eyebrow { color: #7fe3d7; }
.auth__welcome h2 { color: #fff; font-size: clamp(2rem, 3.4vw, 3rem); }
.auth__welcome p:last-child { color: rgba(255, 255, 255, .78); font-size: var(--text-md); }

/* Busca do cliente */
.search-card__form { display: grid; gap: var(--space-4); }

.search-card__location {
    display: flex;
    flex-wrap: wrap;
    gap: 0 var(--space-3);
    align-items: center;
}

.search-card__location .btn--text { margin-left: calc(var(--space-3) * -1); }
.search-card__location [aria-busy="true"] .material-symbols-rounded { animation: pulsar 1s ease-in-out infinite alternate; }
.search-card__attribution { color: var(--color-text-secondary); font-size: var(--text-xs); }

@keyframes pulsar { to { opacity: .3; } }

.result-card { gap: var(--space-3); }
.result-card__title { font-size: var(--text-md); }

.result-card__location {
    display: flex;
    gap: 6px;
    align-items: flex-start;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
}

.result-card__location .material-symbols-rounded { font-size: 18px; }

.result-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-3);
    align-items: center;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
}

.result-card__meta > strong { margin-left: auto; color: var(--color-primary); font-size: var(--text-md); }
.result-card > .btn:last-child { margin-top: var(--space-1); }

.favorite-toggle { color: var(--color-text-muted); }
.favorite-toggle[aria-pressed="true"] { color: var(--color-danger); }
.favorite-toggle[aria-pressed="true"] .material-symbols-rounded { font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24; }

.entity-card > .btn { margin-top: var(--space-1); }

/* Conta e endereços do cliente */
.photo-form { display: grid; gap: var(--space-3); }
.address-card__header { display: flex; gap: var(--space-2); align-items: center; justify-content: space-between; }
.address-card__header h2 { font-size: var(--text-md); }

/* Agendamento */
.booking-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-2);
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
    font-weight: 600;
    text-align: center;
}

.booking-steps li { display: grid; gap: 6px; justify-items: center; }

.booking-steps li > span {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border-radius: 50%;
    background: var(--color-surface-muted);
    font-size: var(--text-xs);
}

.booking-steps .is-current { color: var(--color-primary); }
.booking-steps .is-current > span { background: var(--color-primary); color: #fff; }
.booking-steps .is-done > span { background: var(--color-accent-soft); color: var(--color-accent-text); }

.booking-trail { display: flex; flex-wrap: wrap; gap: var(--space-2); }

.booking-trail__item {
    display: grid;
    min-width: 0;
    padding: var(--space-2) var(--space-3);
    flex: 1 1 140px;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0 var(--space-2);
    align-items: center;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-text);
}

.booking-trail__item > span:first-child { grid-column: 1 / -1; color: var(--color-text-secondary); font-size: var(--text-xs); }
.booking-trail__item strong { font-size: var(--text-sm); overflow-wrap: anywhere; }
.booking-trail__item .material-symbols-rounded { color: var(--color-accent-text); font-size: 18px; }
.booking-trail__item:active { background: var(--color-surface-muted); }

.choice-grid { display: grid; min-width: 0; gap: var(--space-2); }

.booking-choice {
    display: flex;
    min-width: 0;
    min-height: 72px;
    padding: var(--space-3) var(--space-4);
    gap: var(--space-3);
    align-items: center;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    color: var(--color-text);
    transition: border-color var(--fast), background-color var(--fast);
}

.booking-choice:active, .booking-service:active { background: var(--color-accent-soft); }
.booking-choice strong { overflow-wrap: anywhere; }
.booking-choice__copy { display: grid; min-width: 0; gap: 2px; }
.booking-choice__copy small { color: var(--color-text-secondary); font-size: var(--text-sm); }
.booking-choice__next { margin-left: auto; color: var(--color-text-muted); }

.choice-grid--areas { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.choice-grid--areas .booking-choice {
    min-height: 112px;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
}

.choice-grid--areas .booking-choice__next { display: none; }

.booking-service {
    display: grid;
    min-width: 0;
    padding: var(--space-4);
    gap: var(--space-2);
    justify-items: start;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    color: var(--color-text);
    box-shadow: var(--shadow-sm);
}

.booking-service > small { color: var(--color-text-secondary); font-size: var(--text-sm); }

.booking-service__meta {
    display: flex;
    width: 100%;
    padding-top: var(--space-1);
    justify-content: space-between;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
}

.booking-service__meta strong { color: var(--color-primary); font-size: var(--text-md); }

.booking-service__cta {
    display: flex;
    width: 100%;
    padding-top: var(--space-3);
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid var(--color-border);
    color: var(--color-accent-text);
    font-size: var(--text-sm);
    font-weight: 650;
}

.agenda-layout { display: grid; min-width: 0; gap: var(--space-4); }

.calendar { padding: var(--space-3); gap: var(--space-2); }

.calendar__toolbar {
    display: flex;
    gap: var(--space-2);
    align-items: center;
    justify-content: space-between;
}

.calendar__toolbar h2, .calendar__toolbar h3 { flex: 1; font-size: var(--text-md); text-align: center; }

.calendar__weekdays, .calendar__grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 4px;
}

.calendar__weekdays span {
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
    font-weight: 600;
    text-align: center;
}

.calendar-day {
    position: relative;
    display: flex;
    min-height: 44px;
    aspect-ratio: 1;
    flex-direction: column;
    gap: 3px;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    color: var(--color-text);
    font-size: var(--text-sm);
    font-weight: 600;
}

a.calendar-day:active { background: var(--color-surface-muted); }
.calendar-day.is-outside { color: var(--color-text-muted); opacity: .55; }
.calendar-day.is-working { background: var(--color-accent-soft); color: var(--color-primary); }
.calendar-day.is-today { box-shadow: inset 0 0 0 2px var(--color-accent-strong); }
.calendar-day.is-selected { background: var(--color-primary); color: #fff; }
.booking-day-unavailable { color: var(--color-text-muted); font-weight: 500; }
.calendar-day__marks { display: flex; height: 6px; gap: 3px; }
.calendar-day__mark, .calendar-day__dot { display: block; width: 6px; height: 6px; border-radius: 50%; }
.calendar-day__dot { background: var(--color-accent-strong); }
.calendar-day__mark--blocked { background: var(--color-danger); }
.calendar-day__mark--holiday { background: var(--color-warning); }
.calendar-day.is-selected .calendar-day__mark, .calendar-day.is-selected .calendar-day__dot { background: #fff; }

.calendar__legend {
    display: flex;
    padding-top: var(--space-2);
    flex-wrap: wrap;
    gap: var(--space-1) var(--space-4);
    border-top: 1px solid var(--color-border);
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
}

.calendar__legend li { display: inline-flex; gap: 6px; align-items: center; }

.calendar-legend__working {
    width: 12px;
    height: 12px;
    border: 1px solid var(--color-accent-strong);
    border-radius: 4px;
    background: var(--color-accent-soft);
}

.day-detail { gap: var(--space-4); }
.day-detail__header { display: flex; gap: var(--space-2); align-items: flex-start; justify-content: space-between; }
.day-detail__header h2, .day-detail__header h3 { margin-top: 2px; font-size: var(--text-lg); }
.day-detail__header .btn--text { margin-right: calc(var(--space-3) * -1); }
.day-detail__block { display: grid; gap: var(--space-2); }

.day-detail__label {
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.day-detail__empty { color: var(--color-text-secondary); font-size: var(--text-sm); }

.day-item {
    display: grid;
    min-width: 0;
    padding: var(--space-3);
    gap: 2px;
    justify-items: start;
    border: 1px solid var(--color-border);
    border-left-width: 4px;
    border-radius: var(--radius-md);
    background: var(--color-surface);
}

.day-item--booking { border-left-color: var(--color-accent-strong); }
.day-item--block { border-left-color: var(--color-danger); background: var(--color-danger-soft); }
.day-item > strong { color: var(--color-primary); }
.day-item__title { font-weight: 600; }
.day-item > small { color: var(--color-text-secondary); font-size: var(--text-sm); overflow-wrap: anywhere; }
.day-item > .chip, .day-item > .status-badge { margin-top: var(--space-1); }
.day-item__actions { display: flex; width: 100%; margin: var(--space-1) 0 calc(var(--space-2) * -1) calc(var(--space-3) * -1); gap: var(--space-1); }

.booking-slots {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(84px, 1fr));
    gap: var(--space-2);
}

.booking-slot {
    display: grid;
    min-height: 60px;
    padding: var(--space-2) var(--space-1);
    gap: 2px;
    place-content: center;
    justify-items: center;
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-primary);
    transition: border-color var(--fast), background-color var(--fast);
}

.booking-slot strong { font-size: var(--text-md); }
.booking-slot small { color: var(--color-text-secondary); font-size: var(--text-xs); }
.booking-slot:active { border-color: var(--color-accent-strong); background: var(--color-accent-soft); }

.booking-confirm { gap: var(--space-5); }

.booking-summary {
    display: flex;
    padding-bottom: var(--space-4);
    gap: var(--space-4);
    align-items: center;
    border-bottom: 1px solid var(--color-border);
}

.booking-summary > div { display: grid; min-width: 0; gap: 2px; }
.booking-summary h2 { font-size: var(--text-lg); }
.booking-summary p { color: var(--color-text-secondary); }

.booking-facts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-4) var(--space-3);
}

.booking-facts dt { color: var(--color-text-secondary); font-size: var(--text-sm); }
.booking-facts dd { color: var(--color-primary); font-weight: 650; }

.booking-location {
    display: grid;
    min-width: 0;
    padding: var(--space-4);
    gap: var(--space-2);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-bg);
}

.booking-location h3, .booking-location legend {
    display: flex;
    gap: var(--space-2);
    align-items: center;
    color: var(--color-primary);
    font-size: var(--text-md);
    font-weight: 650;
}

fieldset.booking-location > legend { float: left; width: 100%; margin-bottom: var(--space-1); }
fieldset.booking-location > legend + * { clear: both; }
.booking-location p, .booking-location small { color: var(--color-text-secondary); }
.booking-location .form-grid { margin-top: var(--space-2); }
.booking-directions { margin-top: var(--space-2); }

.booking-directions > summary {
    display: flex;
    min-height: var(--control);
    padding: var(--space-3) var(--space-4);
    gap: var(--space-2);
    align-items: center;
    border-radius: var(--radius-md);
    background: var(--color-accent-soft);
    color: var(--color-accent-text);
    font-weight: 650;
    list-style: none;
}

.booking-directions__chevron { margin-left: auto; transition: transform var(--fast); }
.booking-directions[open] .booking-directions__chevron { transform: rotate(180deg); }
.booking-directions > .hint { margin: var(--space-3) 0 var(--space-2); }
.booking-directions__apps { display: grid; gap: var(--space-2); }

.booking-directions__apps a {
    display: flex;
    min-height: var(--control);
    padding: var(--space-3) var(--space-4);
    gap: var(--space-3);
    align-items: center;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-primary);
    font-weight: 550;
}

.booking-directions__apps a > span:first-child { color: var(--color-accent-text); }
.booking-directions__apps a > span:last-child { margin-left: auto; color: var(--color-text-muted); font-size: 18px; }
.booking-directions__apps a:active { background: var(--color-surface-muted); }

.booking-confirm-action { display: grid; gap: var(--space-2); text-align: center; }

.booking-reservation { padding-left: var(--space-3); }

.booking-date {
    display: grid;
    width: 60px;
    padding: var(--space-2) 0;
    flex: none;
    justify-items: center;
    border-radius: var(--radius-md);
    background: var(--color-accent-soft);
    color: var(--color-accent-text);
    line-height: 1.2;
}

.booking-date strong { font-size: var(--text-xl); }
.booking-date span { font-size: var(--text-xs); }

/* Agenda do profissional */
.week-editor { display: grid; gap: var(--space-2); }

.week-day {
    min-width: 0;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
}

.week-day__header {
    display: flex;
    min-height: 64px;
    padding: var(--space-3) var(--space-4);
    gap: var(--space-3);
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

.week-day__title { display: grid; min-width: 0; }
.week-day__title strong { color: var(--color-primary); }
.week-day__title small { color: var(--color-text-secondary); font-size: var(--text-sm); overflow-wrap: anywhere; }
.week-day:not(.is-open) .week-day__title strong { color: var(--color-text-secondary); }

.week-day__periods {
    display: grid;
    padding: 0 var(--space-4) var(--space-3);
    gap: var(--space-3);
}

.holiday-rule .week-day__periods { padding: 0; }

.period-row {
    display: grid;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) var(--touch);
    gap: var(--space-2);
    align-items: end;
}

.period-row__field { display: grid; min-width: 0; gap: 4px; }
.period-row__field > span { color: var(--color-text-secondary); font-size: var(--text-xs); font-weight: 600; }
.period-row input[type="time"] { padding-inline: 10px; }
.period-add { justify-self: start; margin-left: calc(var(--space-3) * -1); }

/* Perfil profissional */
.profile-workspace { display: grid; min-width: 0; gap: var(--space-5); }
.profile-state { display: grid; gap: var(--space-2); color: var(--color-text-secondary); }
.profile-state:not(:has(p)) { display: none; }
.profile-edit-form { display: grid; min-width: 0; gap: var(--space-5); }
.profile-workspace .card > fieldset { display: grid; min-width: 0; gap: var(--space-4); }
.profile-save-notice strong { display: block; margin-bottom: 2px; }
.profile-save-notice p + p { margin-top: var(--space-1); }
.subsection { display: grid; min-width: 0; padding-top: var(--space-4); gap: var(--space-3); border-top: 1px solid var(--color-border); }
.subsection h3 { font-size: var(--text-md); }
.specialty-groups { display: grid; gap: var(--space-2); }

.profile-item {
    display: flex;
    min-width: 0;
    padding: var(--space-3) var(--space-2) var(--space-3) var(--space-4);
    gap: var(--space-2);
    align-items: flex-start;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
}

.profile-item.is-inactive { background: var(--color-surface-muted); }
.profile-item__copy { display: grid; min-width: 0; flex: 1; gap: 2px; justify-items: start; }
.profile-item__copy > strong { color: var(--color-primary); overflow-wrap: anywhere; }
.profile-item__copy > small { color: var(--color-text-secondary); font-size: var(--text-sm); overflow-wrap: anywhere; }

.profile-item__status {
    margin-top: var(--space-1);
    padding: 2px 8px;
    border-radius: var(--radius-pill);
    background: var(--color-accent-soft);
    color: var(--color-accent-text);
    font-size: var(--text-xs);
    font-weight: 650;
}

.profile-item.is-inactive .profile-item__status { background: var(--color-border); color: var(--color-text-secondary); }
.profile-item__actions { display: flex; flex: none; }
.registro-verificacao { display: grid; margin-top: var(--space-1); gap: var(--space-1); justify-items: start; }

.profile-save-bar {
    position: sticky;
    z-index: 5;
    bottom: calc(var(--bottom-nav) + var(--safe-bottom) + var(--space-2));
    display: grid;
    padding: var(--space-3);
    gap: var(--space-2);
    border: 1px solid var(--color-accent-border);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .97);
    box-shadow: var(--shadow-md);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

.profile-save-bar .btn { width: 100%; }
.profile-save-bar .has-unsaved-changes { color: var(--color-danger); font-weight: 600; }
.profile-review [data-submit-review] { display: grid; gap: var(--space-2); justify-items: stretch; }

/* Serviços do profissional */
.service-card.is-inactive { background: var(--color-surface-muted); }
.service-card__header { display: flex; gap: var(--space-2); align-items: flex-start; justify-content: space-between; }
.service-card__header h2 { font-size: var(--text-md); }
.service-card__description { color: var(--color-text-secondary); font-size: var(--text-sm); overflow-wrap: anywhere; }

.service-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-4);
    align-items: center;
}

.service-card__fact { display: inline-flex; gap: 4px; align-items: center; color: var(--color-text-secondary); font-size: var(--text-sm); }
.service-card__fact .material-symbols-rounded { color: var(--color-accent-text); font-size: 18px; }
.service-card__price { margin-left: auto; color: var(--color-primary); }

.service-card__place {
    display: flex;
    gap: 6px;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
}

.service-card__place .material-symbols-rounded { font-size: 18px; }

/* Catálogo */
.catalog-list { display: grid; min-width: 0; gap: var(--space-3); }

.catalog-area-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
}

.catalog-area-card__summary {
    display: grid;
    min-height: 72px;
    padding: var(--space-3) var(--space-4);
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: var(--space-1) var(--space-3);
    align-items: center;
    list-style: none;
}

.catalog-area-card__summary .icon-tile { grid-row: span 2; }
.catalog-area-card__summary .status-badge { grid-column: 2; }
.catalog-area-card__summary .disclosure__chevron { grid-column: 3; grid-row: 1 / span 2; }
.catalog-area-card[open] > summary .disclosure__chevron, .catalog-specialty[open] > summary .disclosure__chevron { transform: rotate(180deg); }
.catalog-area-card__identity { display: grid; min-width: 0; }
.catalog-area-card__identity strong { color: var(--color-primary); overflow-wrap: anywhere; }
.catalog-area-card__identity small { color: var(--color-text-secondary); font-size: var(--text-sm); }

.catalog-area-card__body, .catalog-specialty__body {
    display: grid;
    padding: var(--space-4);
    gap: var(--space-3);
    border-top: 1px solid var(--color-border);
}

.catalog-order { display: flex; gap: 6px; align-items: center; color: var(--color-text-secondary); font-size: var(--text-sm); }
.catalog-order .material-symbols-rounded { font-size: 18px; }

.catalog-subheading {
    display: flex;
    padding-top: var(--space-2);
    gap: var(--space-3);
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid var(--color-border);
}

.catalog-subheading .btn--text { margin-right: calc(var(--space-3) * -1); }
.catalog-specialty-list { display: grid; gap: var(--space-2); }

.catalog-specialty {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-bg);
}

.catalog-specialty__summary {
    display: grid;
    min-height: 64px;
    padding: var(--space-3) var(--space-4);
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: var(--space-2);
    align-items: center;
    list-style: none;
}

.catalog-specialty__copy { display: grid; min-width: 0; }
.catalog-specialty__copy strong { color: var(--color-primary); overflow-wrap: anywhere; }
.catalog-specialty__copy small { color: var(--color-text-secondary); font-size: var(--text-sm); }
.catalog-specialty__body { background: var(--color-surface); }

.catalog-service {
    display: flex;
    min-width: 0;
    padding: var(--space-3) var(--space-2) var(--space-3) var(--space-4);
    gap: var(--space-2);
    align-items: center;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.catalog-service__copy { display: grid; min-width: 0; flex: 1; gap: 2px; justify-items: start; }
.catalog-service__copy strong { color: var(--color-primary); }
.catalog-service__actions { display: flex; flex: none; }

/* Aprovações e análise */
.approval-summary { display: flex; gap: var(--space-4); align-items: center; }
.approval-summary > div { display: grid; }
.approval-summary strong { color: var(--color-primary); font-size: var(--text-2xl); line-height: 1.1; }
.approval-summary span { color: var(--color-text-secondary); }

.review-block { display: grid; min-width: 0; gap: var(--space-2); }
.review-block + .review-block { padding-top: var(--space-4); border-top: 1px solid var(--color-border); }
.review-block h3 { color: var(--color-text-secondary); font-size: var(--text-sm); font-weight: 650; }
.review-list { display: grid; gap: var(--space-2); }

.review-list > li {
    display: flex;
    min-width: 0;
    padding: var(--space-3) var(--space-4);
    flex-wrap: wrap;
    gap: var(--space-1) var(--space-3);
    align-items: center;
    justify-content: space-between;
    border-radius: var(--radius-md);
    background: var(--color-bg);
}

.review-list small { color: var(--color-text-secondary); font-size: var(--text-sm); }
.review-address-list { display: grid; gap: var(--space-2); }

.review-address {
    display: grid;
    min-width: 0;
    padding: var(--space-3) var(--space-4);
    gap: var(--space-2);
    border-radius: var(--radius-md);
    background: var(--color-bg);
    overflow-wrap: anywhere;
}

.review-address > strong { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
.review-address address { display: grid; gap: 2px; color: var(--color-text-secondary); font-size: var(--text-sm); }
.review-address.is-inactive { opacity: .7; }

.registro-review__card {
    display: grid;
    min-width: 0;
    padding: var(--space-4);
    gap: var(--space-3);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    overflow-wrap: anywhere;
}

.registro-review__header { display: grid; gap: 2px; }
.registro-consulta { justify-self: start; }
.registro-review__actions { display: grid; gap: var(--space-3); }
.decision-panel { gap: var(--space-4); }

/* Clínicas */
.clinic-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); }

.clinic-photo {
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
}

.clinic-photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }

.clinic-photo__bar {
    display: flex;
    padding: 0 0 0 var(--space-3);
    align-items: center;
    justify-content: space-between;
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
}

/* Usuários */
.list-toolbar { display: grid; gap: var(--space-2); }
.user-card { gap: var(--space-3); }

.user-card__phone {
    display: flex;
    gap: 6px;
    align-items: center;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
}

.user-card__phone .material-symbols-rounded { font-size: 18px; }

/* Larguras maiores ------------------------------------------------------------ */
@media (min-width: 600px) {
    :root { --gutter: 24px; }

    .card { padding: var(--space-5); }
    .form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4) var(--space-5); }
    .form-grid__full { grid-column: 1 / -1; }
    .choice-list--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }

    .page-intro { flex-direction: row; align-items: center; justify-content: space-between; gap: var(--space-5); }
    .page-intro > .btn { width: auto; flex: none; }

    .form-actions { flex-direction: row; justify-content: flex-end; }
    .form-actions > .btn { width: auto; }

    .dialog__actions { flex-direction: row; justify-content: flex-end; }
    .dialog__actions .btn { width: auto; }

    .search-card__form { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto; align-items: end; }
    .photo-form { grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
    .inline-form { grid-template-columns: minmax(0, 1fr) auto auto; align-items: end; }
    .inline-form__small { width: 110px; }
    .list-toolbar { grid-template-columns: minmax(0, 420px) auto; align-items: center; justify-content: space-between; }

    .choice-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
    .choice-grid--areas { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .booking-steps { display: flex; justify-content: flex-start; gap: var(--space-6); font-size: var(--text-sm); }
    .booking-steps li { display: flex; gap: var(--space-2); }
    .booking-facts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .booking-confirm-action { grid-template-columns: minmax(0, 1fr) auto; align-items: center; text-align: left; }
    .booking-confirm-action .btn { width: auto; }
    .booking-directions__apps { grid-template-columns: repeat(3, minmax(0, 1fr)); }

    .clinic-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .review-address-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .registro-review__actions { grid-template-columns: auto minmax(0, 1fr); align-items: start; }
    .profile-save-bar { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
    .profile-save-bar .btn { width: auto; }
    .profile-review [data-submit-review] { justify-items: start; }
    .sticky-actions { display: flex; justify-content: flex-end; }
    .sticky-actions .btn { width: auto; }
    .period-row { grid-template-columns: 180px 180px var(--touch); justify-content: start; }
    .welcome { padding: var(--space-8); }
    .avatar--xl { width: 88px; height: 88px; }
}

/* Calendário ao lado do detalhe do dia: evita células gigantes no tablet. */
@media (min-width: 760px) {
    .agenda-layout { grid-template-columns: minmax(0, 400px) minmax(0, 1fr); align-items: start; }
}

@media (min-width: 1024px) {
    :root { --topbar: 64px; --gutter: 32px; }

    .app-sidebar {
        position: fixed;
        z-index: 25;
        top: 0;
        bottom: 0;
        left: 0;
        display: flex;
        width: var(--sidebar);
        padding: var(--space-5) var(--space-3);
        overflow-y: auto;
        flex-direction: column;
        gap: var(--space-6);
        border-right: 1px solid var(--color-border);
        background: var(--color-surface);
    }

    .app-sidebar__brand { margin: var(--space-1) var(--space-3) 0; }
    .app-sidebar__brand img { width: 140px; }
    .app-frame { margin-left: var(--sidebar); }
    .bottom-navigation, .drawer { display: none; }
    .app-topbar { padding: 0 var(--gutter); }
    .app-topbar__title { font-size: var(--text-xl); }
    .account-menu__trigger { padding-right: var(--space-3); }
    .account-menu__name { display: block; max-width: 160px; overflow: hidden; color: var(--color-text-secondary); font-size: var(--text-sm); font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
    .account-menu__chevron { display: inline-block; color: var(--color-text-muted); font-size: 20px; transition: transform var(--fast); }
    .app-content { padding: var(--space-8) var(--gutter) var(--space-10); gap: var(--space-8); }
    .sticky-actions, .profile-save-bar { bottom: var(--space-4); }
    .toast-region { right: var(--space-8); bottom: var(--space-8); left: auto; width: 400px; justify-items: end; }

    .auth { grid-template-columns: minmax(460px, 46%) minmax(0, 1fr); }
    .auth__panel { padding: var(--space-10) 56px; }
    .auth__welcome { display: flex; }

    .calendar { padding: var(--space-4); }
    .card-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .greeting h2, .welcome h2 { font-size: 2rem; }
}

@media (max-width: 359px) {
    :root { --gutter: 12px; }
    .bottom-navigation > a, .bottom-navigation > button { font-size: .625rem; }
    .bottom-navigation .material-symbols-rounded { width: 48px; }
}

/* 8. Preferências do sistema ---------------------------------------------------- */
@media (hover: hover) and (pointer: fine) {
    .btn:not(:disabled):hover { background: var(--color-primary-strong); }
    .btn--secondary:not(:disabled):hover { border-color: var(--color-primary); background: var(--color-primary-soft); }
    .btn--text:not(:disabled):hover { background: var(--color-accent-soft); }
    .btn--text-danger:not(:disabled):hover { background: var(--color-danger-soft); }
    .btn--text-positive:not(:disabled):hover { background: var(--color-success-soft); }
    .btn--danger:not(:disabled):hover { background: var(--color-danger-strong); }
    .icon-button:not(:disabled):hover, .account-menu__trigger:hover { background: var(--color-surface-muted); }
    .nav-link:hover { background: var(--color-surface-muted); color: var(--color-primary); }
    .nav-link[aria-current="page"]:hover { background: var(--color-primary-soft); }
    .list-item--link:hover, .booking-choice:hover, .booking-service:hover, .booking-trail__item:hover { border-color: var(--color-accent-strong); }
    .booking-slot:hover { border-color: var(--color-accent-strong); background: var(--color-accent-soft); }
    a.calendar-day:not(.is-selected):hover { box-shadow: inset 0 0 0 2px var(--color-border-strong); }
    .booking-directions__apps a:hover { border-color: var(--color-accent-strong); }
    .choice:hover, .toggle-row:hover { border-color: var(--color-accent-strong); }
    .disclosure > summary:hover { background: var(--color-bg); }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}