@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');

:root {
    --ink: #123f3c;
    --ink-deep: #0d3431;
    --primary: #237571;
    --primary-hover: #195f5b;
    --mint: #99ddd7;
    --mint-soft: #e9f6f4;
    --warm: #f5e9de;
    --warm-deep: #edddcf;
    --coral: #f87679;
    --text: #526f6b;
    --muted: #7a8f8c;
    --line: rgba(18, 63, 60, .11);
    --white: #fff;
    --danger: #b44343;
    --danger-soft: #fff0ef;
    --success: #25735f;
    --success-soft: #edf8f4;
    --shadow: 0 1.2rem 3.5rem rgba(76, 57, 43, .1);
    --radius: 1.4rem;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    overflow-x: hidden;
    color-scheme: light;
    scroll-behavior: smooth;
}

body {
    margin: 0;
    color: var(--text);
    background: var(--warm);
    font-family: 'Manrope', Arial, sans-serif;
    font-size: 15px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

button,
input,
select,
textarea {
    font: inherit;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
a {
    -webkit-tap-highlight-color: transparent;
}

:focus-visible {
    outline: 3px solid rgba(35, 117, 113, .28);
    outline-offset: 3px;
}

.site-header {
    position: relative;
    z-index: 10;
    display: flex;
    min-height: 78px;
    align-items: center;
    justify-content: space-between;
    padding: 0 clamp(1.25rem, 4vw, 4rem);
    border-bottom: 1px solid var(--line);
    background: rgba(245, 233, 222, .9);
    backdrop-filter: blur(12px);
}

.brand {
    position: relative;
    display: inline-flex;
    align-items: center;
    color: var(--primary);
}

.brand img {
    display: block;
    width: 132px;
    height: auto;
}

.brand-text {
    font-size: 1.38rem;
    font-weight: 800;
    letter-spacing: -.07em;
}

.brand-text i {
    color: var(--coral);
    font-style: normal;
}

.brand-dot {
    width: .48rem;
    height: .48rem;
    margin: .1rem 0 0 .24rem;
    border-radius: 50%;
    background: var(--coral);
}

.header-help,
.app-nav a,
.nav-logout {
    color: var(--ink);
    font-size: .73rem;
    font-weight: 700;
}

.header-help span {
    color: var(--primary);
}

.header-help:hover,
.app-nav a:hover,
.nav-logout:hover {
    color: var(--primary);
}

.app-nav {
    display: flex;
    align-items: center;
    gap: 1.25rem;
}

.app-nav form {
    margin: 0;
}

.nav-logout {
    padding: .62rem .85rem;
    border: 1px solid var(--line);
    border-radius: .7rem;
    background: rgba(255, 255, 255, .42);
    cursor: pointer;
}

.auth-shell {
    display: grid;
    min-height: calc(100vh - 126px);
    grid-template-columns: minmax(20rem, .9fr) minmax(33rem, 1.1fr);
}

.auth-story {
    position: relative;
    display: flex;
    overflow: hidden;
    min-height: 680px;
    flex-direction: column;
    justify-content: center;
    padding: clamp(3rem, 7vw, 7rem);
    color: var(--ink);
    background: var(--warm-deep);
}

.auth-story::after {
    position: absolute;
    right: -5rem;
    bottom: 5rem;
    width: 16rem;
    height: 16rem;
    border: 1px solid rgba(35, 117, 113, .13);
    border-radius: 50%;
    content: '';
}

.organic {
    position: absolute;
    pointer-events: none;
}

.organic-one {
    top: -8rem;
    left: -7rem;
    width: 21rem;
    height: 21rem;
    border-radius: 42% 58% 63% 37%;
    background: rgba(255, 255, 255, .3);
    transform: rotate(24deg);
}

.organic-two {
    right: 12%;
    bottom: 13%;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    background: var(--coral);
    box-shadow: 1.8rem -1.5rem 0 -.24rem var(--primary), -2.2rem 1.6rem 0 -.34rem var(--mint);
}

.auth-story-content {
    position: relative;
    z-index: 1;
    max-width: 34rem;
}

.eyebrow {
    display: block;
    margin-bottom: .75rem;
    color: var(--primary);
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .17em;
    text-transform: uppercase;
}

.auth-story h1 {
    margin: 0;
    color: var(--ink);
    font-size: clamp(2.7rem, 5vw, 5rem);
    font-weight: 700;
    letter-spacing: -.07em;
    line-height: .99;
}

.auth-story h1 em {
    color: var(--primary);
    font-style: normal;
}

.auth-story-content>p {
    max-width: 29rem;
    margin: 1.5rem 0 0;
    color: var(--text);
    font-size: .9rem;
}

.trust-list {
    display: grid;
    gap: .8rem;
    margin: 2rem 0 0;
    padding: 0;
    color: #355b58;
    font-size: .76rem;
    font-weight: 600;
    list-style: none;
}

.trust-list span {
    display: inline-grid;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: .5rem;
    place-items: center;
    border-radius: 50%;
    color: white;
    background: var(--primary);
    font-size: .65rem;
}

.privacy-note {
    position: absolute;
    z-index: 1;
    bottom: 2rem;
    left: clamp(3rem, 7vw, 7rem);
    color: var(--muted);
    font-size: .62rem;
}

.privacy-note span {
    margin-right: .4rem;
    color: var(--primary);
}

.auth-content {
    display: grid;
    place-items: center;
    padding: clamp(2rem, 5vw, 5rem);
    background: radial-gradient(circle at 88% 12%, rgba(255, 255, 255, .7), transparent 25%), var(--warm);
}

.auth-content-inner {
    width: min(100%, 36rem);
}

.auth-card {
    padding: clamp(1.6rem, 3.4vw, 2.7rem);
    border: 1px solid rgba(18, 63, 60, .08);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, .88);
    box-shadow: var(--shadow);
    backdrop-filter: blur(10px);
}

.auth-card-compact {
    max-width: 31rem;
    margin: auto;
}

.auth-heading {
    margin-bottom: 1.55rem;
}

.auth-heading h2 {
    margin: 0;
    color: var(--ink);
    font-size: clamp(1.8rem, 3vw, 2.35rem);
    letter-spacing: -.055em;
    line-height: 1.1;
}

.auth-heading p {
    margin: .55rem 0 0;
    color: var(--muted);
    font-size: .78rem;
}

.auth-form {
    display: grid;
    gap: 1rem;
}

.field {
    display: grid;
    gap: .38rem;
}

.field-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .8rem;
}

.field label,
.checkbox-field label {
    color: var(--ink);
    font-size: .7rem;
    font-weight: 700;
}

.label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.label-row a {
    color: var(--primary);
    font-size: .64rem;
    font-weight: 700;
}

.label-row a:hover {
    text-decoration: underline;
}

.field input {
    width: 100%;
    min-height: 46px;
    padding: .75rem .85rem;
    border: 1px solid #ded1c6;
    border-radius: .72rem;
    outline: 0;
    color: var(--ink);
    background: #fffaf6;
    transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.field input:hover {
    border-color: #c8b7a9;
}

.field input:focus {
    border-color: var(--primary);
    background: var(--white);
    box-shadow: 0 0 0 4px rgba(35, 117, 113, .09);
}

.field.has-error input {
    border-color: var(--danger);
    background: #fffafa;
}

.field-error {
    color: var(--danger);
    font-size: .62rem;
    font-weight: 600;
    line-height: 1.4;
}

.password-wrap {
    position: relative;
    display: block;
    width: 100%;
}

.password-wrap input {
    padding-right: 3rem;
}

.password-toggle {
    position: absolute;
    top: 50%;
    right: .6rem;
    display: grid;
    width: 2rem;
    height: 2rem;
    padding: 0;
    place-items: center;
    border: 0;
    border-radius: .5rem;
    color: var(--muted);
    background: transparent;
    cursor: pointer;
    transform: translateY(-50%);
}

.password-toggle:hover,
.password-toggle.is-visible {
    color: var(--primary);
    background: var(--mint-soft);
}

.password-eye,
.password-eye svg {
    display: block;
    width: 1rem;
    height: 1rem;
}

.password-eye svg {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.password-eye-closed,
.password-toggle.is-visible .password-eye-open {
    display: none;
}

.password-toggle.is-visible .password-eye-closed {
    display: block;
}

.strength {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .28rem;
    margin-top: .1rem;
}

.strength>span {
    height: 3px;
    border-radius: 2rem;
    background: #e3dbd4;
    transition: background .2s ease;
}

.strength small {
    grid-column: 1 / -1;
    color: var(--muted);
    font-size: .58rem;
}

.strength[data-score='1']>span:nth-child(1) {
    background: var(--coral);
}

.strength[data-score='2']>span:nth-child(-n+2) {
    background: #d0a43d;
}

.strength[data-score='3']>span {
    background: var(--primary);
}

.checkbox-field {
    display: flex;
    align-items: flex-start;
    gap: .65rem;
    padding-top: .15rem;
}

.checkbox-field input {
    width: 1rem;
    height: 1rem;
    margin: .18rem 0 0;
    accent-color: var(--primary);
}

.checkbox-field label {
    color: var(--text);
    font-size: .62rem;
    font-weight: 500;
    line-height: 1.55;
}

.checkbox-error {
    margin-top: -.65rem;
}

.button {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    padding: .72rem 1rem;
    border: 0;
    border-radius: .72rem;
    font-size: .7rem;
    font-weight: 800;
    cursor: pointer;
    transition: background .2s ease, transform .2s ease, box-shadow .2s ease;
}

.button:hover {
    transform: translateY(-2px);
}

.button-primary {
    color: white;
    background: var(--primary);
    box-shadow: 0 .55rem 1.2rem rgba(35, 117, 113, .16);
}

.button-primary:hover {
    background: var(--primary-hover);
    box-shadow: 0 .75rem 1.5rem rgba(35, 117, 113, .22);
}

.button-full {
    width: 100%;
    margin-top: .25rem;
}

.button-light {
    color: var(--ink);
    background: white;
}

.button:disabled {
    opacity: .82;
    cursor: default;
}

.button:disabled:hover {
    transform: none;
}

.auth-divider {
    display: flex;
    align-items: center;
    gap: .7rem;
    margin: 1.35rem 0 .9rem;
    color: var(--muted);
    font-size: .58rem;
    white-space: nowrap;
}

.auth-divider::before,
.auth-divider::after {
    width: 100%;
    height: 1px;
    background: #e4d7cc;
    content: '';
}

.signup-callout {
    position: relative;
    display: flex;
    overflow: hidden;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem;
    border-radius: .9rem;
    color: white;
    background: linear-gradient(135deg, var(--ink) 0%, var(--primary) 100%);
    box-shadow: 0 .75rem 1.8rem rgba(18, 63, 60, .16);
}

.signup-callout::after {
    position: absolute;
    right: -2.4rem;
    bottom: -3.8rem;
    width: 8rem;
    height: 8rem;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 50%;
    content: '';
}

.signup-callout>* {
    position: relative;
    z-index: 1;
}

.signup-callout div {
    display: grid;
}

.signup-callout strong {
    font-size: .72rem;
}

.signup-callout div span {
    color: rgba(255, 255, 255, .7);
    font-size: .58rem;
}

.signup-callout a {
    flex: 0 0 auto;
    padding: .58rem .72rem;
    border-radius: .6rem;
    color: var(--primary-hover);
    background: white;
    font-size: .62rem;
    font-weight: 800;
    transition: transform .2s ease, background .2s ease;
}

.signup-callout a:hover {
    background: var(--warm);
    transform: translateY(-2px);
}

.auth-switch {
    margin: 1.15rem 0 0;
    color: var(--muted);
    font-size: .65rem;
    text-align: center;
}

.auth-switch a {
    color: var(--primary);
    font-weight: 800;
}

.back-link {
    display: inline-flex;
    gap: .45rem;
    margin-bottom: 1.35rem;
    color: var(--primary);
    font-size: .63rem;
    font-weight: 700;
}

.auth-icon {
    display: grid;
    width: 2.8rem;
    height: 2.8rem;
    margin-bottom: 1.15rem;
    place-items: center;
    border-radius: .85rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-size: 1.1rem;
}

.security-note {
    display: flex;
    gap: .7rem;
    margin-top: 1.25rem;
    padding: .85rem;
    border: 1px solid rgba(35, 117, 113, .09);
    border-radius: .72rem;
    background: #f8ede4;
}

.security-note>span {
    color: var(--primary);
}

.security-note p {
    margin: 0;
    color: var(--muted);
    font-size: .58rem;
    line-height: 1.55;
}

.security-note strong {
    color: var(--ink);
}

.alert {
    display: flex;
    align-items: flex-start;
    gap: .65rem;
    margin: 0 0 1rem;
    padding: .75rem .85rem;
    border: 1px solid;
    border-radius: .72rem;
    font-size: .65rem;
    font-weight: 600;
}

.alert>span {
    display: grid;
    flex: 0 0 auto;
    width: 1.1rem;
    height: 1.1rem;
    place-items: center;
    border-radius: 50%;
    color: white;
    font-size: .55rem;
    font-weight: 800;
}

.alert-error {
    border-color: rgba(180, 67, 67, .18);
    color: #843b3b;
    background: var(--danger-soft);
}

.alert-error>span {
    background: var(--danger);
}

.alert-success {
    border-color: rgba(37, 115, 95, .18);
    color: var(--success);
    background: var(--success-soft);
}

.alert-success>span {
    background: var(--success);
}

.alert-info {
    border-color: rgba(35, 117, 113, .16);
    color: var(--primary);
    background: var(--mint-soft);
}

.alert-info>span {
    background: var(--primary);
}

.site-footer {
    display: flex;
    min-height: 48px;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0 clamp(1.25rem, 4vw, 4rem);
    border-top: 1px solid var(--line);
    color: var(--muted);
    background: var(--warm);
    font-size: .56rem;
}

/* Dashboard */
.app-body {
    min-height: 100vh;
    background: #faf8f5;
}

.app-body .site-header {
    position: sticky;
    top: 0;
    background: rgba(250, 248, 245, .9);
}

.dashboard-shell {
    width: min(calc(100% - 2rem), 74rem);
    min-height: calc(100vh - 126px);
    margin: 0 auto;
    padding: clamp(2.5rem, 6vw, 5.5rem) 0;
}

.dashboard-hero {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 2rem;
    margin-bottom: 2.25rem;
}

.dashboard-hero>div:first-child {
    max-width: 45rem;
}

.dashboard-hero h1 {
    margin: 0;
    color: var(--ink);
    font-size: clamp(2.5rem, 5vw, 4.6rem);
    letter-spacing: -.075em;
    line-height: 1;
}

.dashboard-hero h1 span {
    color: var(--coral);
}

.dashboard-hero p {
    max-width: 40rem;
    margin: 1rem 0 0;
    font-size: .8rem;
}

.dashboard-date {
    display: grid;
    min-width: 7rem;
    padding: .9rem 1.1rem;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: white;
    text-align: right;
}

.dashboard-date span {
    color: var(--muted);
    font-size: .55rem;
    font-weight: 700;
    text-transform: uppercase;
}

.dashboard-date strong {
    color: var(--ink);
    font-size: 1.35rem;
    letter-spacing: -.05em;
}

.dashboard-grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr 1fr;
    gap: 1rem;
}

.dashboard-card {
    display: flex;
    min-height: 19rem;
    flex-direction: column;
    justify-content: space-between;
    padding: 1.5rem;
    border: 1px solid var(--line);
    border-radius: 1.25rem;
    background: white;
    box-shadow: 0 .7rem 2.5rem rgba(18, 63, 60, .04);
}

.dashboard-card-primary {
    color: white;
    background: linear-gradient(145deg, var(--ink) 0%, var(--primary) 100%);
}

.card-icon {
    display: grid;
    width: 2.65rem;
    height: 2.65rem;
    place-items: center;
    border-radius: .8rem;
    color: var(--ink);
    background: white;
    font-size: 1.15rem;
}

.card-icon.soft {
    color: var(--primary);
    background: var(--mint-soft);
}

.card-icon.coral {
    color: #b14c50;
    background: #fff0ee;
}

.card-kicker {
    color: var(--primary);
    font-size: .57rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.dashboard-card-primary .card-kicker {
    color: var(--mint);
}

.dashboard-card h2 {
    margin: .5rem 0;
    color: var(--ink);
    font-size: 1.25rem;
    letter-spacing: -.045em;
    line-height: 1.2;
}

.dashboard-card-primary h2 {
    color: white;
}

.dashboard-card p {
    margin: 0;
    color: var(--muted);
    font-size: .68rem;
}

.dashboard-card-primary p {
    color: rgba(255, 255, 255, .7);
}

.card-status {
    align-self: flex-start;
    padding: .3rem .55rem;
    border-radius: 2rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-size: .55rem;
    font-weight: 800;
}

.dashboard-bottom {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 2rem;
    margin-top: 1rem;
    padding: 2rem;
    border-radius: 1.25rem;
    background: var(--warm);
}

.dashboard-bottom>div {
    max-width: 40rem;
}

.dashboard-bottom h2 {
    margin: 0;
    color: var(--ink);
    font-size: 1.5rem;
    letter-spacing: -.045em;
}

.dashboard-bottom p {
    margin: .55rem 0 0;
    font-size: .7rem;
}

.text-link {
    flex: 0 0 auto;
    color: var(--primary);
    font-size: .65rem;
    font-weight: 800;
}

.text-link:hover {
    text-decoration: underline;
}

.error-card {
    width: min(100%, 42rem);
    margin: clamp(1rem, 6vh, 4rem) auto;
    text-align: center;
}

.error-code {
    display: block;
    margin-bottom: .8rem;
    color: var(--coral);
    font-size: 3.5rem;
    font-weight: 800;
    letter-spacing: -.08em;
    line-height: 1;
}

.error-card .button {
    margin-top: .5rem;
}

.app-body .error-card {
    padding: clamp(1.5rem, 4vw, 2.4rem);
    border-color: rgba(18, 63, 60, .1);
    background: linear-gradient(145deg, rgba(255, 255, 255, .96), rgba(250, 245, 239, .94));
    box-shadow: 0 1rem 2.8rem rgba(76, 57, 43, .08);
}

.error-card .auth-heading {
    margin-bottom: 1rem;
}

.error-card .auth-heading h2 {
    margin-top: .2rem;
}

.error-card .auth-heading p {
    max-width: 30rem;
    margin-inline: auto;
}

html[data-theme="dark"] .error-card,
html[data-theme="dark"] .app-body .error-card {
    border-color: #31514b;
    color: #d8e8e5;
    background: linear-gradient(145deg, #142927, #0d201e);
    box-shadow: 0 1rem 2.8rem rgba(0, 0, 0, .28);
    backdrop-filter: none;
}

html[data-theme="dark"] .error-card .auth-heading h2 {
    color: #f3fbf9;
}

html[data-theme="dark"] .error-card .auth-heading p {
    color: #adc6c2;
}

html[data-theme="dark"] .error-card .eyebrow {
    color: #7ed3cc;
}

html[data-theme="dark"] .guest-body:has(.error-card) .auth-content {
    background: radial-gradient(circle at 88% 12%, rgba(35, 117, 113, .15), transparent 28%), #081713;
}

html[data-theme="dark"] .guest-body:has(.error-card) .auth-story {
    color: #d8e8e5;
    background: #102522;
}

html[data-theme="dark"] .guest-body:has(.error-card) .auth-story h1,
html[data-theme="dark"] .guest-body:has(.error-card) .trust-list li {
    color: #f3fbf9;
}

html[data-theme="dark"] .guest-body:has(.error-card) .auth-story p,
html[data-theme="dark"] .guest-body:has(.error-card) .privacy-note {
    color: #adc6c2;
}

html[data-theme="dark"] .site-header {
    border-color: #294741;
    background: rgba(16, 37, 34, .96);
}

html[data-theme="dark"] .site-header .header-help,
html[data-theme="dark"] .site-header .app-nav a {
    color: #d8e8e5;
}

html[data-theme="dark"] .site-header .header-help:hover,
html[data-theme="dark"] .site-header .app-nav a:hover {
    color: #8bd4ce;
}

html[data-theme="dark"] .site-header .nav-logout {
    border-color: #31514b;
    color: #e5f2ef;
    background: #142927;
}

html[data-theme="dark"] .site-header .nav-logout:hover {
    border-color: #4b7770;
    color: #fff;
    background: #1d403c;
}

@media (max-width: 620px) {
    .error-card {
        margin: .75rem auto;
    }
}

.debug-message {
    overflow: auto;
    max-height: 9rem;
    margin: 1rem 0;
    padding: .8rem;
    border-radius: .5rem;
    color: #843b3b;
    background: var(--danger-soft);
    font: .65rem/1.5 monospace;
    text-align: left;
    white-space: pre-wrap;
}

@media (max-width: 960px) {
    .auth-shell {
        grid-template-columns: 1fr;
    }

    .auth-story {
        min-height: 360px;
        padding: 4rem max(1.5rem, 8vw);
    }

    .auth-story h1 {
        font-size: clamp(2.5rem, 10vw, 4.2rem);
    }

    .auth-story-content>p {
        max-width: 35rem;
    }

    .privacy-note {
        display: none;
    }

    .auth-content {
        padding: 2.5rem 1rem;
    }

    .dashboard-grid {
        grid-template-columns: 1fr 1fr;
    }

    .dashboard-card-primary {
        grid-column: 1 / -1;
    }
}

@media (max-width: 620px) {
    .site-header {
        min-height: 66px;
        padding-inline: 1rem;
    }

    .header-help {
        font-size: 0;
    }

    .header-help span {
        font-size: .9rem;
    }

    .app-nav {
        gap: .55rem;
    }

    .app-nav>a {
        display: none;
    }

    .auth-shell {
        min-height: calc(100vh - 110px);
    }

    .auth-story {
        min-height: 280px;
        padding: 3rem 1.25rem;
    }

    .auth-story-content>p {
        font-size: .76rem;
    }

    .trust-list {
        display: none;
    }

    .auth-content {
        padding: 1rem;
    }

    .auth-card {
        padding: 1.25rem;
        border-radius: 1rem;
    }

    .field-grid {
        grid-template-columns: 1fr;
    }

    .signup-callout {
        align-items: stretch;
        flex-direction: column;
        text-align: center;
    }

    .signup-callout a {
        text-align: center;
    }

    .auth-divider {
        white-space: normal;
        text-align: center;
    }

    .site-footer {
        min-height: 44px;
        justify-content: center;
    }

    .site-footer span:last-child {
        display: none;
    }

    .dashboard-shell {
        width: min(calc(100% - 1.5rem), 74rem);
        padding: 2.5rem 0;
    }

    .dashboard-hero {
        align-items: flex-start;
        flex-direction: column;
    }

    .dashboard-date {
        display: none;
    }

    .dashboard-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-card-primary {
        grid-column: auto;
    }

    .dashboard-card {
        min-height: 17rem;
    }

    .dashboard-bottom {
        align-items: flex-start;
        flex-direction: column;
        padding: 1.4rem;
    }
}

@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}

/* Espace patient connecté */
.sr-only {
    position: absolute !important;
    overflow: hidden;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    margin: -1px;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.patient-app {
    display: flex;
    min-height: 100vh;
    background: #f7f9f8;
}

.patient-app-main {
    display: flex;
    min-width: 0;
    min-height: 100vh;
    flex: 1;
    flex-direction: column;
}

.app-sidebar {
    position: sticky;
    z-index: 30;
    top: 0;
    display: flex;
    width: 270px;
    height: 100vh;
    flex: 0 0 270px;
    flex-direction: column;
    padding: 1.55rem 1.1rem 1rem;
    border-right: 1px solid var(--line);
    background: #fff;
}

.sidebar-head {
    display: flex;
    min-height: 54px;
    align-items: flex-start;
    justify-content: space-between;
    padding: .15rem .65rem 0;
}

.sidebar-head .brand img {
    width: 116px;
}

.sidebar-close {
    display: none;
    width: 2rem;
    height: 2rem;
    border: 0;
    border-radius: .5rem;
    color: var(--ink);
    background: var(--mint-soft);
    cursor: pointer;
    font-size: 1.25rem;
}

.sidebar-nav {
    display: grid;
    gap: .28rem;
    margin-top: 1.5rem;
}

.sidebar-label {
    margin: 0 .8rem .45rem;
    color: #98aaa7;
    font-size: .56rem;
    font-weight: 800;
    letter-spacing: .15em;
    text-transform: uppercase;
}

.sidebar-nav>a,
.sidebar-support summary {
    display: flex;
    min-height: 43px;
    align-items: center;
    gap: .75rem;
    padding: .62rem .78rem;
    border-radius: .7rem;
    color: #536b68;
    font-size: .68rem;
    font-weight: 650;
    cursor: pointer;
    transition: color .18s ease, background .18s ease;
}

.sidebar-nav>a:hover,
.sidebar-support summary:hover {
    color: var(--ink);
    background: #f4f8f7;
}

.sidebar-nav>a.is-active,
.sidebar-support summary.is-active {
    color: var(--primary);
    background: var(--mint-soft);
    font-weight: 800;
}

.nav-icon {
    display: inline-grid;
    width: 1.25rem;
    height: 1.25rem;
    flex: 0 0 1.25rem;
    place-items: center;
    color: var(--primary);
    font-size: .9rem;
    font-weight: 700;
}

.nav-icon svg {
    width: 1rem;
    height: 1rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.sidebar-support summary {
    justify-content: space-between;
    list-style: none;
}

.sidebar-support summary::-webkit-details-marker {
    display: none;
}

.sidebar-support summary>span:first-child {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.support-chevron {
    transition: transform .2s ease;
}

.sidebar-support[open] .support-chevron {
    transform: rotate(180deg);
}

.support-links {
    display: grid;
    gap: .12rem;
    margin: .2rem 0 .35rem 2.78rem;
    padding-left: .7rem;
    border-left: 1px solid #dbe8e6;
}

.support-links a {
    padding: .36rem .2rem;
    color: #718582;
    font-size: .59rem;
    font-weight: 600;
}

.support-links a:hover,
.support-links a.is-active {
    color: var(--primary);
    font-weight: 800;
}

.sidebar-profile {
    display: grid;
    grid-template-columns: 2.35rem minmax(0, 1fr) 1.5rem;
    gap: .65rem;
    align-items: center;
    margin-top: auto;
    padding: .85rem .65rem;
    border: 1px solid var(--line);
    border-radius: .8rem;
    background: #fafcfb;
}

.profile-avatar {
    display: grid;
    width: 2.35rem;
    height: 2.35rem;
    place-items: center;
    border-radius: .68rem;
    color: white;
    background: var(--primary);
    font-size: .65rem;
    font-weight: 800;
}

.profile-meta {
    display: grid;
    min-width: 0;
}

.profile-meta strong {
    overflow: hidden;
    color: var(--ink);
    font-size: .62rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.profile-meta span {
    overflow: hidden;
    color: var(--muted);
    font-size: .48rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.profile-manage {
    color: var(--muted);
    font-size: .65rem;
    letter-spacing: .05em;
}

.sidebar-account-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .4rem;
    padding: .65rem .4rem 0;
}

.sidebar-account-actions:has(form:only-child) {
    justify-content: flex-end;
}

.sidebar-account-actions a,
.sidebar-account-actions button {
    padding: 0;
    border: 0;
    color: #718582;
    background: transparent;
    font-size: .51rem;
    font-weight: 700;
    cursor: pointer;
}

.sidebar-account-actions a:hover,
.sidebar-account-actions button:hover {
    color: var(--primary);
}

.sidebar-account-actions form {
    margin: 0;
}

.app-topbar {
    position: sticky;
    z-index: 20;
    top: 0;
    display: flex;
    min-height: 72px;
    align-items: center;
    justify-content: flex-start;
    gap: 1rem;
    padding: .7rem clamp(1.2rem, 4vw, 3.5rem);
    border-bottom: 1px solid var(--line);
    background: rgba(255, 255, 255, .9);
    backdrop-filter: blur(12px);
}

.app-topbar>div {
    display: grid;
}

.topbar-context {
    color: var(--muted);
    font-size: .5rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.app-topbar strong {
    color: var(--ink);
    font-size: .78rem;
}

.topbar-profile {
    color: var(--primary);
    font-size: .6rem;
    font-weight: 800;
}

.sidebar-open {
    display: none;
    border: 0;
    color: var(--ink);
    background: transparent;
    cursor: pointer;
    font-size: 1.1rem;
}

.sidebar-overlay {
    display: none;
}

.app-body .dashboard-shell {
    display: block;
    width: min(calc(100% - 3rem), 72rem);
    min-height: auto;
    flex: 1;
    margin: 0 auto;
    padding: clamp(2.5rem, 5vw, 4.4rem) 0;
}

.page-intro {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 2rem;
    margin-bottom: 2rem;
}

.page-intro>div:first-child {
    max-width: 45rem;
}

.page-intro h1 {
    margin: 0;
    color: var(--ink);
    font-size: clamp(2.2rem, 4.5vw, 3.8rem);
    letter-spacing: -.07em;
    line-height: 1;
}

.page-intro h1 span {
    color: var(--coral);
}

.page-intro p {
    max-width: 42rem;
    margin: .8rem 0 0;
    color: var(--muted);
    font-size: .72rem;
}

.page-intro-compact {
    align-items: flex-start;
}

.dashboard-date {
    background: #fff;
}

.dashboard-section {
    overflow: hidden;
    margin-top: 1rem;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 .6rem 2.3rem rgba(18, 63, 60, .035);
}

.section-heading {
    display: flex;
    min-height: 82px;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.3rem;
    border-bottom: 1px solid var(--line);
}

.section-heading>div {
    display: flex;
    align-items: center;
    gap: .8rem;
}

.section-count {
    display: grid;
    width: 2.35rem;
    height: 2.35rem;
    flex: 0 0 2.35rem;
    place-items: center;
    border-radius: .68rem;
    color: white;
    background: var(--primary);
    font-size: .7rem;
    font-weight: 800;
}

.section-count.soft {
    color: var(--primary);
    background: var(--mint-soft);
}

.section-heading h2 {
    margin: 0;
    color: var(--ink);
    font-size: .9rem;
    letter-spacing: -.025em;
}

.section-heading p {
    margin: .05rem 0 0;
    color: var(--muted);
    font-size: .53rem;
}

.section-heading>a {
    color: var(--primary);
    font-size: .56rem;
    font-weight: 800;
}

.section-heading>a:hover {
    text-decoration: underline;
}

.appointments-table-wrap {
    overflow-x: auto;
    width: 100%;
    max-width: 100%;
}

.appointments-table {
    width: 100%;
    min-width: 710px;
    border-collapse: collapse;
    color: #425f5c;
    font-size: .62rem;
}

.appointments-table th {
    padding: .7rem 1.3rem;
    color: #91a29f;
    background: #fbfcfc;
    font-size: .5rem;
    font-weight: 800;
    letter-spacing: .09em;
    text-align: left;
    text-transform: uppercase;
}

.appointments-table td {
    padding: .95rem 1.3rem;
    border-top: 1px solid rgba(18, 63, 60, .07);
    white-space: nowrap;
}

.appointments-table tbody tr:first-child td {
    border-top: 0;
}

.appointments-table tbody tr:hover {
    background: #fbfdfc;
}

.appointments-table td:first-child {
    display: grid;
}

.appointments-table td:first-child strong {
    color: var(--ink);
    font-size: .66rem;
}

.appointments-table td:first-child span {
    color: var(--muted);
    font-size: .53rem;
}

.video-label {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
}

.video-label i {
    color: var(--primary);
    font-size: .42rem;
}

.status-pill {
    display: inline-flex;
    padding: .28rem .52rem;
    border-radius: 2rem;
    color: #8d6a29;
    background: #fff7e7;
    font-size: .5rem;
    font-weight: 800;
}

.status-pill.is-confirmed {
    color: var(--success);
    background: var(--success-soft);
}

.row-action {
    border: 0;
    color: var(--muted);
    background: transparent;
    cursor: pointer;
    letter-spacing: .08em;
}

.practitioner-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .8rem;
    padding: 1.1rem;
}

.practitioner-grid.is-slider {
    grid-template-columns: none;
    grid-auto-columns: calc((100% - 1.6rem) / 3);
    grid-auto-flow: column;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-behavior: smooth;
    scroll-snap-type: inline mandatory;
    scrollbar-width: none;
}

.practitioner-grid.is-slider::-webkit-scrollbar {
    display: none;
}

.practitioner-grid.is-slider .practitioner-card {
    scroll-snap-align: start;
}

.practitioner-heading-actions,
.practitioner-slider-controls {
    display: flex;
    align-items: center;
    gap: .42rem;
}

.practitioner-heading-actions > a {
    display: inline-flex;
    align-items: center;
    gap: .42rem;
    min-height: 2.15rem;
    padding: .32rem .42rem .32rem .36rem;
    border: 1px solid var(--line);
    border-radius: .7rem;
    color: var(--ink);
    background: rgba(255, 255, 255, .58);
    box-shadow: 0 .25rem .8rem rgba(18, 63, 60, .035);
    font-size: .56rem;
    font-weight: 800;
    text-decoration: none;
    transition: border-color .18s ease, background .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.practitioner-heading-actions > a:hover {
    border-color: rgba(35, 117, 113, .28);
    color: var(--primary-hover);
    background: var(--mint-soft);
    box-shadow: 0 .38rem 1rem rgba(18, 63, 60, .08);
    transform: translateY(-1px);
}

.practitioners-all-icon {
    display: grid;
    width: 1.45rem;
    height: 1.45rem;
    flex: 0 0 1.45rem;
    place-items: center;
    border-radius: .48rem;
    color: var(--primary);
    background: var(--mint-soft);
}

.practitioners-all-icon svg {
    display: block;
    width: .86rem;
    height: .86rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.55;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.practitioners-all-link .practitioner-arrow {
    width: 1.35rem;
    height: 1.35rem;
    margin-left: .08rem;
    border-radius: 50%;
    color: #fff;
    background: var(--primary);
    transition: background .18s ease, transform .18s ease;
}

.practitioners-all-link:hover .practitioner-arrow {
    background: var(--primary-hover);
    transform: translateX(2px);
}

html[data-theme="dark"] .practitioners-all-link {
    background: #102522;
}

html[data-theme="dark"] .practitioners-all-link:hover {
    border-color: rgba(89, 173, 166, .42);
    background: #193632;
}

html[data-theme="dark"] .practitioners-all-icon {
    background: #1d403c;
}

.practitioner-slider-controls button {
    display: grid;
    width: 1.9rem;
    height: 1.9rem;
    padding: 0;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: .58rem;
    color: var(--primary);
    background: var(--surface);
    cursor: pointer;
    transition: border-color .18s ease, color .18s ease, background .18s ease, transform .18s ease;
}

.practitioner-slider-controls button:hover:not(:disabled) {
    border-color: var(--primary);
    color: #fff;
    background: var(--primary);
    transform: translateY(-1px);
}

.practitioner-slider-controls button:disabled {
    opacity: .35;
    cursor: default;
}

.practitioner-slider-controls svg {
    width: .78rem;
    height: .78rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

@media (max-width: 1280px) {
    .practitioner-grid.is-slider {
        grid-auto-columns: calc((100% - .8rem) / 2);
    }
}

@media (max-width: 780px) {
    .practitioner-grid.is-slider {
        grid-auto-columns: 100%;
    }

    .practitioner-heading-actions > a {
        padding: .3rem .36rem .3rem .32rem;
    }
}

@media (max-width: 560px) {
    .practitioners-section .section-heading {
        align-items: flex-start;
    }

    .practitioner-heading-actions {
        align-items: flex-end;
        flex-direction: column-reverse;
    }
}

.practitioner-card {
    display: grid;
    grid-template-columns: 2.75rem minmax(0, 1fr);
    gap: .72rem .75rem;
    align-items: center;
    padding: .9rem;
    border: 1px solid var(--line);
    border-radius: .8rem;
    background: #fcfdfd;
}

.practitioner-avatar {
    display: grid;
    width: 2.75rem;
    height: 2.75rem;
    place-items: center;
    border-radius: 50%;
    color: var(--primary);
    background: var(--mint-soft);
    font-size: .62rem;
    font-weight: 800;
}

.practitioner-card h3 {
    margin: 0;
    color: var(--ink);
    font-size: .68rem;
}

.practitioner-card p {
    margin: .05rem 0 .28rem;
    color: var(--muted);
    font-size: .5rem;
}

.practitioner-card div>span {
    color: var(--primary);
    font-size: .48rem;
    font-weight: 700;
}

.practitioner-card-copy {
    min-width: 0;
}

.practitioner-card-actions {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .42rem;
    padding-top: .62rem;
    border-top: 1px solid var(--line);
}

.practitioner-card-actions .button {
    min-width: 0;
    min-height: 2.2rem;
    padding: .48rem .55rem;
    font-size: .55rem;
    text-align: center;
}

.practitioner-card-actions .media-picto {
    width: .72rem;
    height: .72rem;
    flex: none;
}

.practitioner-card>a {
    display: grid;
    width: 1.5rem;
    height: 1.5rem;
    place-items: center;
    border-radius: 50%;
    color: var(--primary);
    background: var(--mint-soft);
    font-size: .65rem;
}

.coming-soon-card {
    display: grid;
    min-height: 18rem;
    place-items: center;
    align-content: center;
    padding: 2rem;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: #fff;
    text-align: center;
}

.coming-soon-card>span {
    display: grid;
    width: 3rem;
    height: 3rem;
    place-items: center;
    border-radius: .85rem;
    color: var(--primary);
    background: var(--mint-soft);
}

.coming-soon-card h2 {
    margin: 1rem 0 .3rem;
    color: var(--ink);
    font-size: 1.15rem;
}

.coming-soon-card p {
    max-width: 30rem;
    margin: 0;
    font-size: .65rem;
}

.patient-app-main .site-footer {
    min-height: 52px;
    background: #fff;
}

.site-footer nav {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.site-footer a {
    color: var(--primary);
    font-weight: 700;
}

.site-footer a:hover {
    text-decoration: underline;
}

@media (max-width: 1050px) {
    .app-sidebar {
        width: 240px;
        flex-basis: 240px;
    }

    .practitioner-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 780px) {
    .app-sidebar {
        position: fixed;
        left: 0;
        transform: translateX(-105%);
        transition: transform .25s ease;
        box-shadow: 1rem 0 3rem rgba(18, 63, 60, .12);
    }

    .sidebar-close,
    .sidebar-open {
        display: grid;
        place-items: center;
    }

    .app-body.sidebar-visible .app-sidebar {
        transform: translateX(0);
    }

    .sidebar-overlay {
        position: fixed;
        z-index: 25;
        inset: 0;
        width: 100%;
        height: 100%;
        border: 0;
        background: rgba(13, 52, 49, .24);
    }

    .app-body.sidebar-visible .sidebar-overlay {
        display: block;
    }

    .app-body .dashboard-shell {
        width: min(calc(100% - 2rem), 72rem);
        padding: 2rem 0;
    }

    .practitioner-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 580px) {
    .app-topbar {
        min-height: 64px;
        padding-inline: 1rem;
    }

    .topbar-profile {
        font-size: 0;
    }

    .topbar-profile span {
        font-size: .8rem;
    }

    .page-intro {
        align-items: flex-start;
        flex-direction: column;
        min-width: 0;
        margin-bottom: 1.4rem;
    }

    .page-intro>div:first-child {
        min-width: 0;
    }

    .page-intro p {
        overflow-wrap: anywhere;
    }

    .dashboard-section {
        min-width: 0;
        max-width: 100%;
    }

    .page-intro .dashboard-date {
        display: none;
    }

    .section-heading {
        align-items: flex-start;
        flex-direction: column;
        padding: 1rem;
    }

    .appointments-table th,
    .appointments-table td {
        padding-inline: 1rem;
    }

    .practitioner-grid {
        padding: .8rem;
    }

    .patient-app-main .site-footer {
        align-items: center;
        flex-direction: column;
        justify-content: center;
        padding: .65rem 1rem;
    }

    .patient-app-main .site-footer nav {
        gap: .7rem;
    }
}

/* Pages Support */
.support-intro {
    margin-bottom: 1.7rem;
}

.support-intro h1 {
    max-width: 48rem;
    font-size: clamp(2rem, 4vw, 3.3rem);
}

.support-card-icon svg,
.faq-search svg,
.partners-empty svg {
    width: 1.25rem;
    height: 1.25rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.contact-layout {
    display: grid;
    grid-template-columns: minmax(15rem, .68fr) minmax(25rem, 1.32fr);
    gap: 1rem;
    align-items: start;
}

.support-side-card,
.support-form-card {
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 .6rem 2.3rem rgba(18, 63, 60, .035);
}

.support-side-card {
    position: relative;
    overflow: hidden;
    padding: 1.55rem;
}

.support-side-card::after {
    position: absolute;
    right: -3rem;
    top: -3rem;
    width: 9rem;
    height: 9rem;
    border-radius: 50%;
    background: var(--mint-soft);
    content: '';
}

.support-card-icon {
    position: relative;
    z-index: 1;
    display: grid;
    width: 2.8rem;
    height: 2.8rem;
    place-items: center;
    border-radius: .8rem;
    color: var(--primary);
    background: var(--mint-soft);
}

.support-side-card h2 {
    position: relative;
    z-index: 1;
    margin: 1rem 0 .5rem;
    color: var(--ink);
    font-size: 1.1rem;
    letter-spacing: -.035em;
}

.support-side-card>p {
    position: relative;
    z-index: 1;
    margin: 0;
    color: var(--muted);
    font-size: .75rem;
}

.contact-details {
    display: grid;
    gap: .8rem;
    margin: 1.5rem 0;
}

.contact-details div {
    display: grid;
    gap: .08rem;
    padding-bottom: .75rem;
    border-bottom: 1px solid var(--line);
}

.contact-details dt {
    color: #91a29f;
    font-size: .58rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.contact-details dd {
    margin: 0;
    color: var(--ink);
    font-size: .74rem;
    font-weight: 700;
}

.contact-details a:hover {
    color: var(--primary);
}

.contact-emergency-note {
    padding: .9rem;
    border: 1px solid rgba(248, 118, 121, .18);
    border-radius: .75rem;
    background: #fff6f5;
}

.contact-emergency-note strong {
    color: #a54145;
    font-size: .76rem;
}

.contact-emergency-note p {
    margin: .2rem 0 .5rem;
    color: #786665;
    font-size: .67rem;
}

.contact-emergency-note a {
    color: #a54145;
    font-size: .66rem;
    font-weight: 800;
}

.support-form-card {
    padding: clamp(1.25rem, 3vw, 2rem);
}

.support-card-heading span {
    color: var(--primary);
    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.support-card-heading h2 {
    margin: .25rem 0;
    color: var(--ink);
    font-size: 1.35rem;
    letter-spacing: -.04em;
}

.support-card-heading p {
    margin: 0;
    color: var(--muted);
    font-size: .7rem;
}

.support-form {
    display: grid;
    gap: 1rem;
    margin-top: 1.35rem;
}

.support-form select,
.support-form textarea {
    width: 100%;
    padding: .75rem .85rem;
    border: 1px solid #d9dfdd;
    border-radius: .72rem;
    outline: 0;
    color: var(--ink);
    background: #fbfcfc;
    font-size: .76rem;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.support-form select {
    min-height: 46px;
}

.support-form textarea {
    min-height: 160px;
    resize: vertical;
    line-height: 1.6;
}

.support-form select:focus,
.support-form textarea:focus {
    border-color: var(--primary);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(35, 117, 113, .09);
}

.support-form .has-error select,
.support-form .has-error textarea {
    border-color: var(--danger);
}

.character-count {
    color: var(--muted);
    font-size: .6rem;
}

.form-privacy {
    display: flex;
    align-items: center;
    gap: .5rem;
    color: var(--muted);
    font-size: .66rem;
}

.form-privacy span {
    color: var(--primary);
}

.support-form .button {
    justify-self: start;
    min-width: 11rem;
}

.faq-search {
    display: flex;
    max-width: 45rem;
    min-height: 50px;
    align-items: center;
    gap: .7rem;
    margin-bottom: 1.5rem;
    padding: .55rem .65rem .55rem 1rem;
    border: 1px solid var(--line);
    border-radius: .85rem;
    color: var(--primary);
    background: #fff;
    box-shadow: 0 .5rem 2rem rgba(18, 63, 60, .035);
}

.faq-search input {
    min-width: 0;
    flex: 1;
    border: 0;
    outline: 0;
    color: var(--ink);
    background: transparent;
    font-size: .78rem;
}

.faq-search input::placeholder {
    color: #9aaba8;
}

.faq-search kbd {
    padding: .25rem .4rem;
    border: 1px solid var(--line);
    border-radius: .35rem;
    color: var(--muted);
    background: #f7f9f8;
    font: .5rem 'Manrope', sans-serif;
}

.faq-layout {
    display: grid;
    grid-template-columns: 13rem minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
}

.faq-nav {
    position: sticky;
    top: 92px;
    display: grid;
    gap: .2rem;
    padding: .8rem;
    border: 1px solid var(--line);
    border-radius: .85rem;
    background: #fff;
}

.faq-nav>span {
    margin: .25rem .55rem .45rem;
    color: #96a7a4;
    font-size: .58rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.faq-nav a {
    padding: .55rem;
    border-radius: .5rem;
    color: #647b78;
    font-size: .67rem;
    font-weight: 650;
}

.faq-nav a:hover {
    color: var(--primary);
    background: var(--mint-soft);
}

.faq-nav .faq-contact-link {
    display: flex;
    justify-content: space-between;
    margin-top: .6rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-weight: 800;
}

.faq-groups {
    display: grid;
    gap: 1rem;
}

.faq-group {
    scroll-margin-top: 140px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: #fff;
}

.faq-group>header {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: 1rem 1.2rem;
    border-bottom: 1px solid var(--line);
    background: #fbfcfc;
}

.faq-group>header span {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: .55rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-size: .55rem;
    font-weight: 800;
}

.faq-group h2 {
    margin: 0;
    color: var(--ink);
    font-size: .96rem;
}

.faq-item {
    border-bottom: 1px solid rgba(18, 63, 60, .07);
}

.faq-item:last-child {
    border-bottom: 0;
}

.faq-item summary {
    display: flex;
    min-height: 54px;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .8rem 1.2rem;
    color: var(--ink);
    cursor: pointer;
    font-size: .76rem;
    font-weight: 700;
    list-style: none;
}

.faq-item summary::-webkit-details-marker {
    display: none;
}

.faq-item summary i {
    position: relative;
    width: 1.3rem;
    height: 1.3rem;
    flex: 0 0 1.3rem;
    border-radius: 50%;
    background: var(--mint-soft);
}

.faq-item summary i::before,
.faq-item summary i::after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: .48rem;
    height: 1px;
    background: var(--primary);
    content: '';
    transform: translate(-50%, -50%);
}

.faq-item summary i::after {
    transform: translate(-50%, -50%) rotate(90deg);
    transition: transform .18s ease;
}

.faq-item[open] summary {
    color: var(--primary);
}

.faq-item[open] summary i::after {
    transform: translate(-50%, -50%) rotate(0deg);
}

.faq-item>div {
    padding: 0 3.2rem 1rem 1.2rem;
}

.faq-item p {
    margin: 0;
    color: var(--muted);
    font-size: .72rem;
    line-height: 1.7;
}

.faq-empty {
    padding: 2rem;
    border: 1px dashed var(--line);
    border-radius: 1rem;
    color: var(--muted);
    background: #fff;
    font-size: .74rem;
    text-align: center;
}

.emergency-alert {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.2rem;
    padding: 1.15rem 1.3rem;
    border: 1px solid rgba(180, 67, 67, .2);
    border-radius: .9rem;
    background: #fff5f4;
}

.emergency-alert-icon {
    display: grid;
    width: 2.3rem;
    height: 2.3rem;
    flex: 0 0 2.3rem;
    place-items: center;
    border-radius: .65rem;
    color: #fff;
    background: #ba4c50;
    font-size: .8rem;
    font-weight: 900;
}

.emergency-alert h2 {
    margin: 0;
    color: #903b3f;
    font-size: .8rem;
}

.emergency-alert p {
    margin: .25rem 0 0;
    color: #786665;
    font-size: .58rem;
    line-height: 1.65;
}

.emergency-alert a {
    color: #903b3f;
    font-weight: 800;
    text-decoration: underline;
}

.emergency-groups {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .9rem;
}

.emergency-group {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: #fff;
}

.emergency-group>header {
    padding: 1rem;
    border-bottom: 1px solid var(--line);
}

.emergency-group>header>div {
    display: flex;
    align-items: center;
    gap: .7rem;
}

.emergency-group-icon {
    display: grid;
    width: 2rem;
    height: 2rem;
    flex: 0 0 2rem;
    place-items: center;
    border-radius: .55rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-weight: 800;
}

.emergency-group.danger .emergency-group-icon {
    color: #a54145;
    background: #fff0ef;
}

.emergency-group.support .emergency-group-icon {
    color: #9a6b12;
    background: #fff6df;
}

.emergency-group h2 {
    margin: 0;
    color: var(--ink);
    font-size: .72rem;
}

.emergency-group header p {
    margin: .05rem 0 0;
    color: var(--muted);
    font-size: .48rem;
}

.emergency-items {
    display: grid;
}

.emergency-item {
    display: flex;
    min-height: 72px;
    align-items: center;
    justify-content: space-between;
    gap: .65rem;
    padding: .85rem 1rem;
    border-bottom: 1px solid rgba(18, 63, 60, .07);
}

.emergency-item:last-child {
    border-bottom: 0;
}

.emergency-item>div {
    display: grid;
}

.emergency-item strong {
    color: var(--ink);
    font-size: .62rem;
}

.emergency-item>div span {
    color: var(--muted);
    font-size: .48rem;
    line-height: 1.45;
}

.emergency-item a {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: .3rem;
    padding: .38rem .55rem;
    border-radius: .5rem;
    color: #fff;
    background: var(--primary);
    font-size: .52rem;
    font-weight: 800;
}

.emergency-group.danger .emergency-item a {
    background: #b44343;
}

.emergency-group.support .emergency-item a {
    background: #b9821d;
}

.resource-links {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: .8rem;
    align-items: stretch;
    margin-top: 1rem;
    padding: 1rem;
    border-radius: 1rem;
    background: var(--warm);
}

.resource-links>div {
    padding: .4rem;
}

.resource-links h2 {
    margin: 0;
    color: var(--ink);
    font-size: .9rem;
}

.resource-links>a {
    display: grid;
    align-content: center;
    padding: .8rem;
    border: 1px solid rgba(18, 63, 60, .08);
    border-radius: .7rem;
    background: rgba(255, 255, 255, .65);
}

.resource-links strong {
    color: var(--ink);
    font-size: .62rem;
}

.resource-links a span {
    color: var(--primary);
    font-size: .5rem;
}

.emergency-disclaimer {
    margin: .8rem 0 0;
    color: var(--muted);
    font-size: .5rem;
    text-align: center;
}

.partners-count {
    padding: .45rem .7rem;
    border-radius: 2rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-size: .64rem;
    font-weight: 800;
}

.partners-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.partner-card {
    display: grid;
    grid-template-columns: 5rem minmax(0, 1fr);
    gap: 1rem;
    padding: 1.3rem;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 .6rem 2.3rem rgba(18, 63, 60, .035);
}

.partner-logo {
    display: grid;
    width: 5rem;
    height: 5rem;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: .8rem;
    color: var(--primary);
    background: #fbfcfc;
    font-size: .9rem;
    font-weight: 800;
}

.partner-logo img {
    display: block;
    width: 88%;
    height: 88%;
    object-fit: contain;
}

.partner-content {
    min-width: 0;
}

.partner-label {
    color: var(--primary);
    font-size: .58rem;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.partner-content h2 {
    margin: .25rem 0 .45rem;
    color: var(--ink);
    font-size: .98rem;
    line-height: 1.25;
}

.partner-content p {
    margin: 0;
    color: var(--muted);
    font-size: .7rem;
    line-height: 1.65;
}

.partner-link {
    grid-column: 2;
    justify-self: start;
    color: var(--primary);
    font-size: .66rem;
    font-weight: 800;
}

.partner-link:hover {
    text-decoration: underline;
}

.partners-empty {
    display: grid;
    min-height: 18rem;
    place-items: center;
    align-content: center;
    padding: 2rem;
    border: 1px dashed var(--line);
    border-radius: 1rem;
    background: #fff;
    text-align: center;
}

.partners-empty>span {
    display: grid;
    width: 3rem;
    height: 3rem;
    place-items: center;
    border-radius: .8rem;
    color: var(--primary);
    background: var(--mint-soft);
}

.partners-empty h2 {
    margin: 1rem 0 .3rem;
    color: var(--ink);
    font-size: 1rem;
}

.partners-empty p {
    margin: 0;
    color: var(--muted);
    font-size: .72rem;
}

@media (max-width: 1050px) {
    .contact-layout {
        grid-template-columns: 1fr;
    }

    .support-side-card {
        display: grid;
        grid-template-columns: auto 1fr;
        gap: 0 1rem;
    }

    .support-side-card h2,
    .support-side-card>p {
        grid-column: 2;
    }

    .contact-details,
    .contact-emergency-note {
        grid-column: 1 / -1;
    }

    .emergency-groups {
        grid-template-columns: 1fr 1fr;
    }

    .emergency-group:last-child {
        grid-column: 1 / -1;
    }
}

@media (max-width: 720px) {
    .faq-layout {
        grid-template-columns: 1fr;
    }

    .faq-nav {
        position: static;
        display: flex;
        overflow-x: auto;
        padding: .55rem;
    }

    .faq-nav>span {
        display: none;
    }

    .faq-nav a {
        flex: 0 0 auto;
    }

    .faq-nav .faq-contact-link {
        margin: 0;
    }

    .emergency-groups,
    .resource-links,
    .partners-grid {
        grid-template-columns: 1fr;
    }

    .emergency-group:last-child {
        grid-column: auto;
    }

    .partner-card {
        grid-template-columns: 4rem minmax(0, 1fr);
    }

    .partner-logo {
        width: 4rem;
        height: 4rem;
    }

    .partner-link {
        grid-column: 1 / -1;
    }
}

@media (max-width: 480px) {
    .support-side-card {
        display: block;
    }

    .faq-search kbd {
        display: none;
    }

    .faq-item summary {
        padding-inline: 1rem;
    }

    .faq-item>div {
        padding-inline: 1rem;
    }

    .emergency-alert {
        align-items: flex-start;
        flex-direction: column;
    }

    .emergency-item {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Final connected-theme overrides */
.app-body .directory-filters h2,
.app-body .results-heading strong {
    font-size: .85rem;
}

.app-body .directory-filters header p,
.app-body .results-heading p {
    font-size: .62rem;
}

.app-body .filter-block>label,
.app-body .filter-block legend {
    font-size: .68rem;
}

.app-body .filter-block select,
.app-body .filter-search,
.app-body .filter-search input {
    font-size: .68rem;
}

.app-body .filter-pills span,
.app-body .filter-checks label {
    font-size: .62rem;
}

.app-body .psy-card-top h2 {
    font-size: .86rem;
}

.app-body .psy-card-top p {
    font-size: .64rem;
}

.app-body .experience-label,
.app-body .psy-tags span,
.app-body .psy-medias span {
    font-size: .58rem;
}

.app-body .psychologist-card footer span {
    font-size: .55rem;
}

.app-body .psychologist-card footer strong {
    font-size: .66rem;
}

.app-body .psychologist-card footer .button {
    font-size: .62rem;
}

.app-body .appointment-summary strong {
    font-size: .95rem;
}

.app-body .appointment-summary p,
.app-body .appointment-tabs button {
    font-size: .67rem;
}

.app-body .appointment-date strong {
    font-size: 1rem;
}

.app-body .appointment-date span {
    font-size: .5rem;
}

.app-body .appointment-practitioner h2 {
    font-size: .76rem;
}

.app-body .appointment-practitioner p,
.app-body .appointment-detail strong {
    font-size: .62rem;
}

.app-body .appointment-detail span,
.app-body .appointment-state {
    font-size: .54rem;
}

.app-body .conversation-sidebar h2,
.app-body .chat-header h2 {
    font-size: .82rem;
}

.app-body .conversation-copy strong {
    font-size: .72rem;
}

.app-body .conversation-copy time,
.app-body .conversation-copy small,
.app-body .chat-header p {
    font-size: .58rem;
}

.app-body .message p,
.app-body .message-composer textarea {
    font-size: .68rem;
}

.app-body .message time,
.app-body .chat-date,
.app-body .messages-notice {
    font-size: .52rem;
}

html[data-theme="dark"] .app-body .directory-filters,
html[data-theme="dark"] .app-body .psychologist-card,
html[data-theme="dark"] .app-body .appointments-page-card,
html[data-theme="dark"] .app-body .messages-shell,
html[data-theme="dark"] .app-body .profile-card,
html[data-theme="dark"] .app-body .profile-hero,
html[data-theme="dark"] .app-body .appointment-summary article,
html[data-theme="dark"] .app-body .appointment-session-card,
html[data-theme="dark"] .app-body .appointment-facts-card {
    background: #142927;
}

html[data-theme="dark"] .app-body .conversation-item,
html[data-theme="dark"] .app-body .filter-block select,
html[data-theme="dark"] .app-body .filter-search,
html[data-theme="dark"] .app-body .profile-fields input,
html[data-theme="dark"] .app-body .message-composer textarea {
    color: var(--ink);
    background: #102522;
}

html[data-theme="dark"] .app-body .chat-area {
    background: #142927;
}

/* Definitive overrides for the connected interface. */
.app-topbar {
    min-height: 60px;
    padding-block: .45rem;
}

.app-topbar .topbar-action {
    width: 38px;
    min-height: 38px;
    justify-content: center;
    padding: .45rem;
}

.app-topbar .topbar-action-label {
    display: none;
}

.sidebar-profile {
    grid-template-columns: 2.35rem minmax(0, 1fr) 2.1rem;
}

.sidebar-profile .profile-avatar {
    width: 2.35rem;
    height: 2.35rem;
    border-radius: .68rem;
    font-size: .65rem;
}

.sidebar-profile .more-button {
    width: 2rem;
    height: 2rem;
    min-width: 2rem;
}

.app-body .profile-card {
    padding: 1.3rem;
}

.app-body .profile-card h2 {
    font-size: .9rem;
}

.app-body .profile-card header p {
    font-size: .65rem;
}

.app-body .profile-card-icon {
    width: 2.4rem;
    height: 2.4rem;
}

.app-body .profile-fields label>span {
    font-size: .68rem;
}

.app-body .profile-fields input {
    min-height: 46px;
    font-size: .72rem;
}

.app-body .account-row span {
    font-size: .6rem;
}

.app-body .account-row strong,
.app-body .toggle-row strong {
    font-size: .7rem;
}

.app-body .account-row button {
    font-size: .65rem;
}

.app-body .toggle-row small {
    font-size: .6rem;
}

html[data-theme="dark"] {
    --ink: #f3fbfa;
    --ink-deep: #fff;
    --text: #d1e2df;
    --muted: #abc0bd;
    --line: rgba(232, 247, 244, .18);
}

html[data-theme="dark"] .top-directory-filters,
html[data-theme="dark"] .current-psy-card,
html[data-theme="dark"] .psy-preview-drawer,
html[data-theme="dark"] .profile-summary {
    background: #142927;
}

html[data-theme="dark"] .directory-main-search,
html[data-theme="dark"] .advanced-filter-grid select {
    color: var(--ink);
    background: #102522;
}

html[data-theme="dark"] .current-psy-meta>span,
html[data-theme="dark"] .drawer-stats>span,
html[data-theme="dark"] .drawer-tags span {
    background: #1d403c;
}

html[data-theme="dark"] .current-psy-photo em {
    color: #14302d;
    background: rgba(241, 250, 248, .92);
}

/* Select2, live directory and feedback tabs */
.current-psy-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.current-psy-photo {
    aspect-ratio: 4 / 5;
    height: auto;
}

.directory-results.is-loading {
    opacity: .5;
    pointer-events: none;
    transition: opacity .18s;
}

.live-filter-status {
    min-width: 7rem;
    color: var(--muted);
    font-size: .62rem;
    text-align: right;
}

.select2-container {
    max-width: 100%;
    font-family: inherit;
}

.select2-container .select2-selection--single {
    height: 42px;
    border: 1px solid var(--line);
    border-radius: .6rem;
    background: #fbfdfc;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    padding: 0 2.2rem 0 .7rem;
    color: var(--ink);
    font-size: .68rem;
    line-height: 40px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 40px;
    right: .35rem;
}

.select2-dropdown {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: .6rem;
    color: var(--ink);
    background: var(--white);
    box-shadow: 0 .8rem 2rem rgba(13, 52, 49, .13);
}

.select2-results__option {
    padding: .58rem .7rem;
    font-size: .68rem;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    color: #fff;
    background: var(--primary);
}

.select2-container--default .select2-results__option--selected {
    background: var(--mint-soft);
}

.select2-search--dropdown {
    padding: .55rem;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    min-height: 38px;
    padding: .45rem .6rem;
    border: 1px solid var(--line);
    border-radius: .5rem;
    color: var(--ink);
    background: var(--white);
    font: inherit;
    font-size: .68rem;
}

.psy-preview-drawer {
    grid-template-rows: auto auto 1fr auto;
}

.psy-drawer-tabs {
    display: flex;
    gap: 1rem;
    padding: 0 1.25rem;
    border-bottom: 1px solid var(--line);
}

.psy-drawer-tabs button {
    padding: .8rem .1rem .7rem;
    border: 0;
    border-bottom: 2px solid transparent;
    color: var(--muted);
    background: none;
    font-size: .7rem;
    font-weight: 800;
    cursor: pointer;
}

.psy-drawer-tabs button.is-active {
    border-color: var(--primary);
    color: var(--primary);
}

.psy-drawer-tabs span {
    font-size: .62rem;
}

.drawer-description {
    white-space: normal;
}

.drawer-description > :first-child,
.psy-profile-description > :first-child { margin-top:0; }
.drawer-description > :last-child,
.psy-profile-description > :last-child { margin-bottom:0; }
.drawer-description p,
.psy-profile-description p { margin:.45rem 0; }
.drawer-description ul,
.drawer-description ol,
.psy-profile-description ul,
.psy-profile-description ol { display:grid; gap:.28rem; margin:.55rem 0; padding-left:1.2rem; }
.drawer-description li,
.psy-profile-description li { padding-left:.12rem; }
.drawer-description a,
.psy-profile-description a { color:var(--primary); font-weight:700; text-decoration:underline; text-underline-offset:.14em; }

.drawer-feedbacks {
    display: grid;
    gap: .7rem;
}

.drawer-feedback {
    padding: .9rem;
    border: 1px solid var(--line);
    border-radius: .75rem;
    background: #fbfdfc;
}

.drawer-feedback header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .7rem;
}

.drawer-feedback strong {
    color: var(--success);
    font-size: .67rem;
}

.drawer-feedback.is-negative strong {
    color: var(--danger);
}

.drawer-feedback time {
    color: var(--muted);
    font-size: .58rem;
}

.drawer-feedback p {
    margin: .45rem 0 0;
    color: var(--text);
    font-size: .7rem;
    line-height: 1.7;
    white-space: pre-line;
}

.drawer-feedback-empty {
    margin: 0;
    padding: 2.5rem 1rem;
    color: var(--muted);
    font-size: .72rem;
    text-align: center;
}

.appointment-row {
    grid-template-columns: 3.3rem minmax(9rem, 1.5fr) 1fr auto auto auto;
}

.appointment-media-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .35rem .55rem;
    border-radius: .5rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-size: .58rem;
    font-weight: 800;
    white-space: nowrap;
}

.appointment-media-badge.media-phone {
    color: #93651a;
    background: #fff2d9;
}

.appointment-media-badge.media-chat {
    color: #76538b;
    background: #f2e8f8;
}

html[data-theme="dark"] .select2-container .select2-selection--single,
html[data-theme="dark"] .select2-dropdown,
html[data-theme="dark"] .select2-container--default .select2-search--dropdown .select2-search__field,
html[data-theme="dark"] .drawer-feedback {
    color: var(--ink);
    background: #102522;
}

html[data-theme="dark"] .select2-container--default .select2-results__option--selected {
    background: #1d403c;
}

html[data-theme="dark"] .appointment-media-badge.media-phone {
    color: #f0cc82;
    background: #3b301c;
}

html[data-theme="dark"] .appointment-media-badge.media-chat {
    color: #d6b7e8;
    background: #33273a;
}

@media (max-width:1050px) {
    .current-psy-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width:760px) {
    .appointment-row {
        grid-template-columns: 2.8rem minmax(0, 1fr) auto;
    }

    .appointment-media-badge {
        grid-column: 2;
        justify-self: start;
    }

    .appointment-state {
        grid-column: 2;
    }

    .appointment-row .more-button {
        grid-column: 3;
        grid-row: 1 / 4;
    }

    .live-filter-status {
        order: 4;
        width: 100%;
        min-width: 0;
        text-align: left;
    }
}

@media (max-width:560px) {
    .current-psy-grid {
        grid-template-columns: 1fr;
    }
}

/* Directory v5: search first, current-site cards, practitioner preview */
.top-directory-filters {
    margin-bottom: 1.4rem;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: var(--white);
    box-shadow: 0 .6rem 2rem rgba(18, 63, 60, .04);
}

.directory-search-row {
    display: flex;
    gap: .65rem;
    align-items: center;
    padding: .85rem;
}

.directory-main-search {
    display: flex;
    min-height: 46px;
    flex: 1;
    align-items: center;
    gap: .55rem;
    padding: 0 .85rem;
    border: 1px solid var(--line);
    border-radius: .7rem;
    color: var(--primary);
    background: #fbfdfc;
}

.directory-main-search input {
    width: 100%;
    border: 0;
    outline: 0;
    color: var(--ink);
    background: transparent;
    font-size: .78rem;
}

.clear-filters {
    color: var(--primary);
    font-size: .68rem;
    font-weight: 800;
}

.advanced-filters {
    border-top: 1px solid var(--line);
}

.advanced-filters>summary {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: .65rem;
    align-items: center;
    padding: .8rem 1rem;
    color: var(--ink);
    cursor: pointer;
    list-style: none;
}

.advanced-filters>summary::-webkit-details-marker {
    display: none;
}

.advanced-filters summary>span {
    display: flex;
    align-items: center;
    gap: .45rem;
    font-size: .72rem;
    font-weight: 800;
}

.advanced-filters summary svg {
    width: 1rem;
    height: 1rem;
    fill: none;
    stroke: var(--primary);
    stroke-width: 1.8;
    stroke-linecap: round;
}

.advanced-filters summary small {
    color: var(--muted);
    font-size: .64rem;
}

.advanced-filters summary>i {
    color: var(--primary);
    font-style: normal;
    transition: transform .2s;
}

.advanced-filters[open] summary>i {
    transform: rotate(180deg);
}

.advanced-filter-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .8rem;
    padding: 1rem;
    border-top: 1px solid var(--line);
}

.advanced-filter-grid>label {
    display: grid;
    gap: .35rem;
}

.advanced-filter-grid>label>span,
.advanced-filter-grid legend {
    color: var(--ink);
    font-size: .66rem;
    font-weight: 800;
}

.advanced-filter-grid select {
    width: 100%;
    min-height: 42px;
    padding: .55rem .65rem;
    border: 1px solid var(--line);
    border-radius: .6rem;
    color: var(--ink);
    background: #fbfdfc;
    font-size: .68rem;
}

.advanced-filter-grid fieldset {
    margin: 0;
    padding: 0;
    border: 0;
}

.filter-checks.horizontal {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    min-height: 42px;
    align-items: center;
}

.advanced-filters>footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1rem;
    padding: .8rem 1rem;
    border-top: 1px solid var(--line);
}

.advanced-filters>footer a {
    color: var(--muted);
    font-size: .67rem;
    font-weight: 700;
}

.advanced-filters>footer .button {
    min-height: 38px;
}

.directory-results-wide {
    width: 100%;
}

.current-psy-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.current-psy-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: var(--white);
    box-shadow: 0 .45rem 1.6rem rgba(18, 63, 60, .04);
    transition: transform .2s, box-shadow .2s;
}

.current-psy-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 .8rem 2rem rgba(18, 63, 60, .1);
}

.current-psy-preview {
    display: grid;
    width: 100%;
    padding: 0;
    border: 0;
    color: inherit;
    background: none;
    text-align: left;
    cursor: pointer;
}

.current-psy-photo {
    position: relative;
    display: grid;
    height: 13.5rem;
    place-items: center;
    overflow: hidden;
    color: var(--primary);
    background: linear-gradient(145deg, var(--mint-soft), #dbece9);
    font-size: 1.4rem;
}

.current-psy-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.current-psy-photo>b {
    font-size: 1.3rem;
}

.current-psy-badges {
    position: absolute;
    top: .7rem;
    left: .7rem;
    display: flex;
    flex-wrap: wrap;
    gap: .3rem;
}

.current-psy-badges em {
    padding: .3rem .55rem;
    border-radius: 2rem;
    color: var(--ink);
    background: rgba(255, 255, 255, .9);
    font-size: .56rem;
    font-style: normal;
    font-weight: 800;
}

.current-psy-badges .is-new,
.psy-new-badge {
    color: #fff;
    background: var(--coral, #ef7377);
}

.psy-new-badge {
    display: inline-flex;
    width: max-content;
    align-items: center;
    padding: .25rem .48rem;
    border-radius: 999px;
    font-size: .45rem;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.psy-new-badge[hidden] { display: none; }
.psy-profile-labels { display: flex; align-items: center; gap: .45rem; }
html[data-theme="dark"] .current-psy-badges .is-new,
html[data-theme="dark"] .psy-new-badge { color:#fff; background:var(--coral,#ef7377); }

.current-psy-body {
    display: grid;
    padding: 1rem;
}

.current-psy-body>strong {
    color: var(--ink);
    font-size: .85rem;
}

.current-psy-body>small {
    color: var(--muted);
    font-size: .62rem;
}

.current-psy-meta {
    display: flex;
    gap: .35rem;
    margin-top: .7rem;
}

.current-psy-meta>span {
    padding: .25rem .42rem;
    border-radius: .35rem;
    color: var(--text);
    background: var(--mint-soft);
    font-size: .55rem;
    font-weight: 700;
}

.current-psy-availability {
    display: grid;
    margin-top: .75rem;
    padding-top: .7rem;
    border-top: 1px solid var(--line);
}

.current-psy-availability small {
    color: var(--muted);
    font-size: .54rem;
}

.current-psy-availability b {
    color: var(--primary);
    font-size: .66rem;
}

.current-psy-availability.is-unavailable b,
.drawer-stats strong.is-unavailable,
.psy-profile-facts strong.is-unavailable {
    color: var(--muted);
    font-weight: 700;
}

.psy-preview-drawer {
    position: fixed;
    z-index: 82;
    top: 0;
    right: 0;
    display: grid;
    width: min(94vw, 43rem);
    height: 100vh;
    grid-template-rows: auto 1fr auto;
    border-left: 1px solid var(--line);
    background: var(--white);
    box-shadow: -1rem 0 3rem rgba(13, 52, 49, .18);
    visibility: hidden;
    transform: translateX(105%);
    transition: transform .25s ease, visibility .25s;
}

.psy-preview-drawer.is-open {
    visibility: visible;
    transform: translateX(0);
}

.psy-preview-drawer>header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.1rem 1.25rem;
    border-bottom: 1px solid var(--line);
}

.drawer-practitioner {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.drawer-avatar {
    display: grid;
    width: 3rem;
    height: 3rem;
    place-items: center;
    overflow: hidden;
    border-radius: .75rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-size: .8rem;
    font-weight: 800;
}

.drawer-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.drawer-practitioner h2 {
    margin: 0;
    color: var(--ink);
    font-size: .95rem;
}

.drawer-practitioner p {
    margin: .08rem 0 0;
    color: var(--muted);
    font-size: .65rem;
}

.psy-drawer-content {
    overflow-y: auto;
    padding: 1.25rem;
}

.drawer-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .65rem;
    margin-bottom: 1.2rem;
}

.drawer-stats>span {
    display: grid;
    padding: .8rem;
    border-radius: .7rem;
    background: var(--mint-soft);
}

.drawer-stats small {
    color: var(--muted);
    font-size: .58rem;
}

.drawer-stats strong {
    color: var(--ink);
    font-size: .7rem;
}

.psy-drawer-content section {
    padding: 1rem 0;
    border-top: 1px solid var(--line);
}

.psy-drawer-content h3 {
    margin: 0 0 .55rem;
    color: var(--ink);
    font-size: .78rem;
}

.psy-drawer-content p {
    margin: 0;
    color: var(--text);
    font-size: .72rem;
    line-height: 1.75;
}

.drawer-tags {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.drawer-tags span {
    padding: .36rem .55rem;
    border-radius: .45rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-size: .62rem;
    font-weight: 700;
}

.psy-preview-drawer>footer {
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--line);
}

.psy-preview-drawer>footer .button {
    width: 100%;
}

.psy-drawer-overlay {
    position: fixed;
    z-index: 81;
    inset: 0;
    display: none;
    border: 0;
    background: rgba(7, 28, 27, .46);
    backdrop-filter: blur(2px);
}

.psy-drawer-visible .psy-drawer-overlay {
    display: block;
}

/* Compact topbar, fixed account card and readable profile */
.app-topbar {
    min-height: 60px;
    padding-block: .45rem;
}

.topbar-action {
    width: 38px;
    min-height: 38px;
    justify-content: center;
    padding: .45rem;
}

.topbar-action-label {
    display: none;
}

.sidebar-profile {
    grid-template-columns: 2.35rem minmax(0, 1fr) 2.25rem;
}

.sidebar-profile .profile-avatar {
    width: 2.35rem;
    height: 2.35rem;
    border-radius: .68rem;
    font-size: .65rem;
}

.sidebar-profile .more-button {
    width: 2rem;
    height: 2rem;
    min-width: 2rem;
}

.profile-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
    padding: 1.2rem 1.35rem;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: var(--white);
}

.profile-summary>div>span {
    color: var(--primary);
    font-size: .68rem;
    font-weight: 800;
    text-transform: uppercase;
}

.profile-summary h2 {
    margin: .15rem 0;
    color: var(--ink);
    font-size: 1.25rem;
}

.profile-summary p {
    margin: 0;
    color: var(--muted);
    font-size: .78rem;
}

.profile-summary-status {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .42rem .65rem;
    border-radius: 2rem;
    color: var(--success);
    background: var(--success-soft);
    font-size: .67rem;
    font-weight: 800;
}

.profile-summary-status i {
    width: .45rem;
    height: .45rem;
    border-radius: 50%;
    background: #43ad81;
}

.profile-card {
    padding: 1.3rem;
}

.profile-card h2 {
    font-size: .9rem;
}

.profile-card header p {
    font-size: .65rem;
}

.profile-card-icon {
    width: 2.4rem;
    height: 2.4rem;
}

.profile-fields label>span {
    font-size: .68rem;
}

.profile-fields input {
    min-height: 46px;
    font-size: .72rem;
}

.account-row span {
    font-size: .6rem;
}

.account-row strong,
.toggle-row strong {
    font-size: .7rem;
}

.account-row button {
    font-size: .65rem;
}

.toggle-row small {
    margin-top: .1rem;
    font-size: .6rem;
    line-height: 1.45;
}

.appointment-date small {
    color: var(--muted);
    font-size: .48rem;
    font-weight: 800;
}

/* Stronger dark-mode contrast */
html[data-theme="dark"] {
    --ink: #f3fbfa;
    --ink-deep: #fff;
    --text: #d1e2df;
    --muted: #abc0bd;
    --line: rgba(232, 247, 244, .18);
}

html[data-theme="dark"] .directory-main-search,
html[data-theme="dark"] .advanced-filter-grid select {
    color: var(--ink);
    background: #102522;
}

html[data-theme="dark"] .top-directory-filters,
html[data-theme="dark"] .current-psy-card,
html[data-theme="dark"] .psy-preview-drawer,
html[data-theme="dark"] .profile-summary {
    background: #142927;
}

html[data-theme="dark"] .current-psy-meta>span,
html[data-theme="dark"] .drawer-stats>span,
html[data-theme="dark"] .drawer-tags span {
    background: #1d403c;
}

html[data-theme="dark"] .current-psy-photo em {
    color: #14302d;
    background: rgba(241, 250, 248, .92);
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
    color: #8fa7a4;
    opacity: 1;
}

@media (max-width:1150px) {
    .current-psy-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .advanced-filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width:1050px) {
    .advanced-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width:820px) {
    .current-psy-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .current-psy-photo {
        height: 15rem;
    }
}

@media (max-width:560px) {
    .directory-search-row {
        align-items: stretch;
        flex-wrap: wrap;
    }

    .directory-main-search {
        flex-basis: 100%;
    }

    .directory-search-row .button {
        flex: 1;
    }

    .advanced-filter-grid {
        grid-template-columns: 1fr;
    }

    .advanced-filters summary small {
        display: none;
    }

    .current-psy-grid {
        grid-template-columns: 1fr;
    }

    .current-psy-photo {
        height: 20rem;
    }

    .drawer-stats {
        grid-template-columns: 1fr;
    }

    .profile-summary {
        align-items: flex-start;
        flex-direction: column;
    }

    .profile-card {
        padding: 1rem;
    }
}

/* Readability, header tools and appointment detail */
.app-body {
    font-size: 16px;
}

.sidebar-nav>a,
.sidebar-support summary {
    font-size: .78rem;
}

.sidebar-label,
.support-links a {
    font-size: .66rem;
}

.profile-meta strong {
    font-size: .7rem;
}

.profile-meta span,
.sidebar-account-actions button {
    font-size: .58rem;
}

.topbar-title {
    display: grid;
}

.topbar-context {
    font-size: .58rem;
}

.app-topbar strong {
    font-size: .9rem;
}

.page-intro p {
    font-size: .88rem;
}

.eyebrow {
    font-size: .72rem;
}

.topbar-actions {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin-left: auto;
}

.topbar-action {
    position: relative;
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    gap: .42rem;
    padding: .5rem .72rem;
    border: 1px solid var(--line);
    border-radius: .72rem;
    color: var(--ink);
    background: var(--white);
    cursor: pointer;
    font-size: .67rem;
    font-weight: 750;
    transition: border-color .2s, color .2s, background .2s, transform .2s;
}

.topbar-action:hover {
    border-color: rgba(35, 117, 113, .35);
    color: var(--primary);
    background: var(--mint-soft);
    transform: translateY(-1px);
}

.topbar-action svg {
    width: 1rem;
    height: 1rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.action-dot {
    position: absolute;
    top: .36rem;
    left: 1.42rem;
    width: .42rem;
    height: .42rem;
    border: 2px solid var(--white);
    border-radius: 50%;
    background: var(--coral);
}

.theme-icon-dark {
    display: none;
}

html[data-theme="dark"] .theme-icon-light {
    display: none;
}

html[data-theme="dark"] .theme-icon-dark {
    display: block;
}

.shell-panel {
    position: fixed;
    z-index: 70;
    top: 0;
    right: 0;
    overflow-y: auto;
    width: min(92vw, 28rem);
    height: 100vh;
    border-left: 1px solid var(--line);
    background: var(--white);
    box-shadow: -1rem 0 3rem rgba(13, 52, 49, .16);
    visibility: hidden;
    transform: translateX(105%);
    transition: transform .25s ease, visibility .25s;
}

.shell-panel.is-open {
    visibility: visible;
    transform: translateX(0);
}

.shell-panel>header {
    position: sticky;
    z-index: 1;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem;
    border-bottom: 1px solid var(--line);
    background: var(--white);
}

.shell-panel>header>div {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.shell-panel header span:not(.panel-heading-icon) {
    color: var(--primary);
    font-size: .65rem;
    font-weight: 800;
    text-transform: uppercase;
}

.shell-panel h2 {
    margin: .05rem 0 0;
    color: var(--ink);
    font-size: 1.15rem;
}

.panel-heading-icon {
    display: grid;
    width: 2.6rem;
    height: 2.6rem;
    place-items: center;
    border-radius: .75rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-weight: 800;
}

.close-icon-button,
.more-button {
    display: inline-grid;
    width: 2.25rem;
    height: 2.25rem;
    flex: 0 0 2.25rem;
    padding: 0;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: .65rem;
    color: var(--muted);
    background: var(--white);
    cursor: pointer;
    transition: color .2s, background .2s, border-color .2s;
}

.close-icon-button:hover,
.more-button:hover {
    border-color: rgba(35, 117, 113, .3);
    color: var(--primary);
    background: var(--mint-soft);
}

.close-icon-button svg,
.more-button svg {
    width: 1.05rem;
    height: 1.05rem;
    fill: currentColor;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
}

.close-icon-button svg {
    fill: none;
}

.shell-panel-content {
    padding: 1.1rem;
}

.activity-timeline article {
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: .75rem;
    padding: .9rem 0;
    border-bottom: 1px solid var(--line);
}

.activity-marker {
    display:grid;
    width:1.7rem;
    height:1.7rem;
    margin-top:.05rem;
    place-items:center;
    border:1px solid rgba(35,117,113,.14);
    border-radius:.52rem;
    color:var(--primary);
    background:var(--mint-soft);
    font-size:.8rem;
    font-weight:850;
}
.activity-marker .media-picto { width:.82rem; height:.82rem; }
.activity-completed .activity-marker { color:#337b5e; border-color:rgba(51,123,94,.18); background:#e8f4ed; }
.activity-cancelled .activity-marker { color:#a44b4b; border-color:rgba(164,75,75,.18); background:#fbe9e7; }
.activity-created strong { color:var(--primary); }
.activity-completed strong { color:#337b5e; }
.activity-cancelled strong { color:#a44b4b; }

.activity-timeline strong {
    color: var(--ink);
    font-size: .82rem;
}

.activity-timeline p {
    margin: .12rem 0;
    color: var(--text);
    font-size: .72rem;
}

.activity-timeline time,
.update-list time {
    color: var(--muted);
    font-size: .65rem;
}

.activity-timeline a {
    color: var(--primary);
    font-size: 1rem;
}

.update-list {
    display: grid;
    gap: .8rem;
}

.update-list article {
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: .85rem;
    background: var(--mint-soft);
}

.update-list h3 {
    margin: .3rem 0;
    color: var(--ink);
    font-size: .9rem;
}

.update-list p {
    margin: 0;
    color: var(--text);
    font-size: .74rem;
    line-height: 1.7;
}

.panel-empty {
    padding: 3rem 1rem;
    color: var(--muted);
    text-align: center;
}

.shell-panel-overlay {
    position: fixed;
    z-index: 60;
    inset: 0;
    display: none;
    border: 0;
    background: rgba(7, 28, 27, .4);
    backdrop-filter: blur(2px);
}

.shell-panel-visible .shell-panel-overlay {
    display: block;
}

.filter-submit {
    padding: 1rem;
}

.filter-submit .button {
    width: 100%;
}

.directory-filters header a {
    color: var(--primary);
    font-size: .66rem;
    font-weight: 800;
}

.filter-pills-wrap {
    row-gap: .4rem;
}

.results-live {
    display: inline-flex;
    align-items: center;
    gap: .38rem;
    color: var(--muted);
    font-size: .68rem;
}

.results-live i {
    width: .48rem;
    height: .48rem;
    border-radius: 50%;
    background: #45ae82;
}

.psy-avatar {
    overflow: visible;
}

.psy-avatar img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    object-fit: cover;
}

.psy-avatar b {
    position: relative;
    z-index: -1;
}

.psy-badge {
    padding: .28rem .45rem;
    border-radius: 2rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-size: .58rem;
    font-weight: 800;
}

.psy-badge.holiday {
    color: #986c19;
    background: #fff3d7;
}

.directory-filters h2,
.results-heading strong {
    font-size: .85rem;
}

.directory-filters header p,
.results-heading p {
    font-size: .62rem;
}

.filter-block>label,
.filter-block legend {
    font-size: .68rem;
}

.filter-block select,
.filter-search,
.filter-search input {
    font-size: .68rem;
}

.filter-pills span,
.filter-checks label {
    font-size: .62rem;
}

.psy-card-top h2 {
    font-size: .86rem;
}

.psy-card-top p {
    font-size: .64rem;
}

.experience-label,
.psy-tags span,
.psy-medias span {
    font-size: .58rem;
}

.psychologist-card footer span {
    font-size: .55rem;
}

.psychologist-card footer strong {
    font-size: .66rem;
}

.psychologist-card footer .button {
    font-size: .62rem;
}

.appointment-summary strong {
    font-size: .95rem;
}

.appointment-summary p,
.appointment-tabs button {
    font-size: .67rem;
}

.appointment-date strong {
    font-size: 1rem;
}

.appointment-date span {
    font-size: .5rem;
}

.appointment-practitioner h2 {
    font-size: .76rem;
}

.appointment-practitioner p,
.appointment-detail strong {
    font-size: .62rem;
}

.appointment-detail span,
.appointment-state {
    font-size: .54rem;
}

.mini-avatar.photo,
.detail-avatar {
    overflow: hidden;
}

.mini-avatar img,
.detail-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.appointments-empty {
    padding: 3rem 1rem;
    text-align: center;
}

.appointments-empty h2 {
    color: var(--ink);
}

.detail-breadcrumb {
    display: flex;
    gap: .5rem;
    margin-bottom: 1.1rem;
    color: var(--muted);
    font-size: .75rem;
}

.detail-breadcrumb a {
    color: var(--primary);
    font-weight: 800;
}

.appointment-detail-hero {
    position: relative;
    display: flex;
    overflow: hidden;
    align-items: center;
    justify-content: space-between;
    min-height: 13rem;
    padding: 2rem;
    border-radius: 1.2rem;
    background: linear-gradient(135deg, var(--mint-soft), #d8eeeb);
}

.appointment-detail-hero.media-chat {
    background: linear-gradient(135deg, #f4eafa, #e9e3f3);
}

.appointment-detail-hero.media-phone {
    background: linear-gradient(135deg, #fff1e4, #f7e4d2);
}

.appointment-detail-hero h1 {
    margin: .8rem 0 .25rem;
    color: var(--ink);
    font-size: clamp(1.8rem, 4vw, 3rem);
    letter-spacing: -.055em;
}

.appointment-detail-hero p {
    margin: 0;
    color: var(--text);
    font-size: .9rem;
}

.media-hero-icon {
    display: grid;
    width: 7rem;
    height: 7rem;
    place-items: center;
    border: 1px solid rgba(35, 117, 113, .12);
    border-radius: 2rem;
    color: var(--primary);
    background: rgba(255, 255, 255, .55);
    font-size: 2.7rem;
    transform: rotate(5deg);
}

.appointment-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(17rem, .65fr);
    gap: 1rem;
    margin-top: 1rem;
}

.appointment-session-card,
.appointment-facts-card {
    padding: 1.3rem;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: var(--white);
}

.session-practitioner {
    display: flex;
    align-items: center;
    gap: .85rem;
    padding-bottom: 1.1rem;
    border-bottom: 1px solid var(--line);
}

.detail-avatar {
    display: grid;
    width: 3.4rem;
    height: 3.4rem;
    flex: 0 0 3.4rem;
    place-items: center;
    border-radius: .85rem;
}

.detail-avatar.initials {
    color: var(--primary);
    background: var(--mint-soft);
    font-weight: 800;
}

.session-practitioner span,
.session-practitioner p {
    color: var(--muted);
    font-size: .68rem;
}

.session-practitioner h2 {
    margin: .05rem 0;
    color: var(--ink);
    font-size: 1rem;
}

.session-practitioner p {
    margin: 0;
}

.session-instructions {
    display: flex;
    gap: .8rem;
    padding: 1.25rem 0;
}

.session-icon {
    display: grid;
    width: 2.8rem;
    height: 2.8rem;
    flex: 0 0 2.8rem;
    place-items: center;
    border-radius: .75rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-size: 1.1rem;
}

.session-instructions h2 {
    margin: 0;
    color: var(--ink);
    font-size: .95rem;
}

.session-instructions p {
    margin: .25rem 0 0;
    font-size: .75rem;
}

.session-checklist {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .6rem;
    margin-bottom: 1rem;
}

.session-checklist span {
    padding: .7rem;
    border-radius: .65rem;
    color: var(--text);
    background: var(--mint-soft);
    font-size: .65rem;
}

.session-checklist i {
    margin-right: .25rem;
    color: var(--primary);
    font-style: normal;
    font-weight: 900;
}

.phone-number-preview {
    display: flex;
    align-items: center;
    gap: .7rem;
    margin-bottom: 1rem;
    padding: .85rem;
    border-radius: .7rem;
    background: var(--mint-soft);
}

.phone-number-preview span {
    color: var(--muted);
    font-size: .62rem;
}

.phone-number-preview strong {
    color: var(--ink);
    font-size: .72rem;
}

.phone-number-preview a {
    margin-left: auto;
    color: var(--primary);
    font-size: .65rem;
    font-weight: 800;
}

.session-action {
    width: 100%;
}

.session-action:disabled {
    opacity: .55;
    cursor: not-allowed;
    transform: none;
}

.session-availability-note {
    margin: .55rem 0 0;
    color: var(--muted);
    font-size: .62rem;
    text-align: center;
}

.appointment-facts-card>h2 {
    margin: 0 0 .8rem;
    color: var(--ink);
    font-size: 1rem;
}

.appointment-facts-card dl {
    margin: 0;
}

.appointment-facts-card dl>div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .65rem 0;
    border-bottom: 1px solid var(--line);
}

.appointment-facts-card dt {
    color: var(--muted);
    font-size: .66rem;
}

.appointment-facts-card dd {
    margin: 0;
    color: var(--ink);
    font-size: .68rem;
    font-weight: 800;
    text-align: right;
}

.detail-help {
    margin-top: 1rem;
    padding: .9rem;
    border-radius: .75rem;
    background: var(--warm);
}

.detail-help strong {
    color: var(--ink);
    font-size: .76rem;
}

.detail-help p {
    margin: .2rem 0 .5rem;
    font-size: .65rem;
}

.detail-help a {
    color: var(--primary);
    font-size: .68rem;
    font-weight: 800;
}

.conversation-sidebar h2,
.chat-header h2 {
    font-size: .82rem;
}

.conversation-copy strong {
    font-size: .72rem;
}

.conversation-copy time,
.conversation-copy small,
.chat-header p {
    font-size: .58rem;
}

.message p,
.message-composer textarea {
    font-size: .68rem;
}

.message time,
.chat-date,
.messages-notice {
    font-size: .52rem;
}

/* Dark theme */
html[data-theme="dark"] {
    --ink: #e7f2f0;
    --ink-deep: #f4fbfa;
    --text: #b7cbc8;
    --muted: #8fa7a4;
    --line: rgba(219, 239, 236, .12);
    --white: #142927;
    --mint-soft: #1b3936;
    --warm: #221f1d;
    --warm-deep: #2b2521;
    --success-soft: #183c34;
    --danger-soft: #3c2425;
    color-scheme: dark;
}

html[data-theme="dark"] .patient-app,
html[data-theme="dark"] .app-body {
    background: #0f211f;
}

html[data-theme="dark"] .app-sidebar,
html[data-theme="dark"] .app-topbar,
html[data-theme="dark"] .dashboard-section,
html[data-theme="dark"] .directory-filters,
html[data-theme="dark"] .psychologist-card,
html[data-theme="dark"] .appointments-page-card,
html[data-theme="dark"] .messages-shell,
html[data-theme="dark"] .profile-card,
html[data-theme="dark"] .profile-hero,
html[data-theme="dark"] .appointment-summary article {
    background: #142927;
}

html[data-theme="dark"] .app-topbar {
    background: rgba(20, 41, 39, .92);
}

html[data-theme="dark"] .sidebar-profile,
html[data-theme="dark"] .conversation-item,
html[data-theme="dark"] .filter-block select,
html[data-theme="dark"] .filter-search,
html[data-theme="dark"] .profile-fields input,
html[data-theme="dark"] .message-composer textarea {
    color: var(--ink);
    background: #102522;
}

html[data-theme="dark"] .conversation-item:hover,
html[data-theme="dark"] .conversation-item.is-active {
    background: var(--mint-soft);
}

html[data-theme="dark"] .chat-messages {
    background: linear-gradient(rgba(15, 33, 31, .88), rgba(15, 33, 31, .88)), radial-gradient(circle at 10% 10%, var(--mint-soft), transparent 35%);
}

html[data-theme="dark"] .message.received {
    background: #1b3532;
}

html[data-theme="dark"] .site-footer {
    background: #121f1e;
}

html[data-theme="dark"] .detail-help {
    background: #2b2521;
}

@media (max-width: 900px) {
    .topbar-action-label {
        display: none;
    }

    .topbar-action {
        width: 42px;
        justify-content: center;
        padding: .5rem;
    }

    .appointment-detail-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .app-topbar {
        padding-inline: 1rem;
    }

    .topbar-actions {
        gap: .3rem;
    }

    .topbar-action {
        width: 38px;
        min-height: 38px;
    }

    .appointment-detail-hero {
        min-height: auto;
        padding: 1.4rem;
    }

    .media-hero-icon {
        width: 4rem;
        height: 4rem;
        border-radius: 1rem;
        font-size: 1.6rem;
    }

    .session-checklist {
        grid-template-columns: 1fr;
    }

    .appointment-detail-layout {
        min-width: 0;
    }

    .phone-number-preview {
        align-items: flex-start;
        flex-direction: column;
    }

    .phone-number-preview a {
        margin-left: 0;
    }
}

/* Patient directory */
.directory-layout {
    display: grid;
    grid-template-columns: 15rem minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.directory-filters,
.appointments-page-card,
.messages-shell,
.profile-card,
.profile-hero {
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 .6rem 2.2rem rgba(18, 63, 60, .035);
}

.directory-filters {
    position: sticky;
    top: 1rem;
    overflow: hidden;
}

.directory-filters>header,
.results-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .8rem;
}

.directory-filters>header {
    padding: 1rem;
    border-bottom: 1px solid var(--line);
}

.directory-filters>header>div {
    display: flex;
    align-items: center;
    gap: .6rem;
}

.directory-filters h2,
.results-heading strong {
    margin: 0;
    color: var(--ink);
    font-size: .72rem;
}

.directory-filters header p,
.results-heading p {
    margin: .05rem 0 0;
    color: var(--muted);
    font-size: .48rem;
}

.filter-icon {
    display: grid;
    width: 1.9rem;
    height: 1.9rem;
    place-items: center;
    border-radius: .55rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-weight: 800;
}

.directory-filters header button {
    padding: 0;
    border: 0;
    color: var(--primary);
    background: none;
    font-size: .5rem;
    font-weight: 800;
    cursor: pointer;
}

.filter-block {
    margin: 0;
    padding: .8rem 1rem;
    border: 0;
    border-bottom: 1px solid rgba(18, 63, 60, .07);
}

.filter-block>label,
.filter-block legend {
    display: block;
    margin-bottom: .42rem;
    padding: 0;
    color: var(--ink);
    font-size: .54rem;
    font-weight: 800;
}

.filter-block select,
.filter-search {
    width: 100%;
    min-height: 38px;
    border: 1px solid var(--line);
    border-radius: .58rem;
    color: var(--ink);
    background: #fbfdfc;
    font-size: .54rem;
}

.filter-block select {
    padding: .55rem;
}

.filter-search {
    display: flex;
    align-items: center;
    gap: .35rem;
    padding: 0 .55rem;
}

.filter-search input {
    min-width: 0;
    border: 0;
    outline: 0;
    color: var(--ink);
    background: transparent;
    font-size: .54rem;
}

.filter-pills {
    display: flex;
    flex-wrap: wrap;
    gap: .3rem;
}

.filter-pills input,
.filter-checks input {
    position: absolute;
    opacity: 0;
}

.filter-pills span {
    display: block;
    padding: .34rem .48rem;
    border: 1px solid var(--line);
    border-radius: 2rem;
    color: var(--muted);
    font-size: .48rem;
    cursor: pointer;
}

.filter-pills input:checked+span {
    border-color: var(--primary);
    color: var(--primary);
    background: var(--mint-soft);
    font-weight: 800;
}

.filter-checks {
    display: grid;
    gap: .35rem;
}

.filter-checks label {
    position: relative;
    display: flex;
    align-items: center;
    gap: .45rem;
    color: var(--text);
    font-size: .52rem;
    cursor: pointer;
}

.filter-checks span::before {
    display: inline-grid;
    width: .9rem;
    height: .9rem;
    margin-right: .4rem;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: .22rem;
    content: '';
    vertical-align: middle;
}

.filter-checks input:checked+span::before {
    border-color: var(--primary);
    color: white;
    background: var(--primary);
    content: '✓';
}

.results-heading {
    margin-bottom: .75rem;
}

.results-heading select {
    padding: .5rem .65rem;
    border: 1px solid var(--line);
    border-radius: .58rem;
    color: var(--text);
    background: #fff;
    font-size: .5rem;
}

.psychologist-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .8rem;
}

.psychologist-card {
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: #fff;
    transition: transform .2s ease, box-shadow .2s ease;
}

.psychologist-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 .8rem 2rem rgba(18, 63, 60, .07);
}

.psy-card-top {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: .7rem;
    align-items: center;
}

.psy-avatar {
    position: relative;
    display: grid;
    width: 2.8rem;
    height: 2.8rem;
    place-items: center;
    border-radius: .8rem;
    color: var(--ink);
    background: var(--mint-soft);
    font-size: .7rem;
    font-weight: 800;
}

.psy-avatar.warm,
.mini-avatar.warm {
    background: #f9eadc;
}

.psy-avatar.coral,
.mini-avatar.coral {
    background: #ffe7e5;
}

.psy-avatar.blue,
.mini-avatar.blue {
    background: #e4eff7;
}

.psy-avatar.lilac,
.mini-avatar.lilac {
    background: #eee8f7;
}

.psy-avatar.sand,
.mini-avatar.sand {
    background: #f4efe7;
}

.psy-avatar>span,
.mini-avatar>i {
    position: absolute;
    right: -.05rem;
    bottom: -.05rem;
    width: .62rem;
    height: .62rem;
    border: 2px solid white;
    border-radius: 50%;
    background: #4ab88b;
}

.psy-card-top h2 {
    margin: 0;
    color: var(--ink);
    font-size: .72rem;
}

.psy-card-top p {
    margin: .02rem 0;
    color: var(--muted);
    font-size: .48rem;
}

.experience-label {
    color: var(--primary);
    font-size: .45rem;
    font-weight: 700;
}

.favorite-button {
    width: 1.8rem;
    height: 1.8rem;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 50%;
    color: var(--primary);
    background: #fff;
    cursor: pointer;
}

.favorite-button.is-active {
    color: #fff;
    background: var(--coral);
}

.psy-tags {
    display: flex;
    flex-wrap: wrap;
    gap: .28rem;
    margin: .8rem 0;
}

.psy-tags span {
    padding: .25rem .4rem;
    border-radius: .32rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-size: .43rem;
    font-weight: 700;
}

.psy-medias {
    display: flex;
    gap: .4rem;
    padding: .65rem 0;
    border-top: 1px solid rgba(18, 63, 60, .07);
}

.psy-medias span {
    color: #b3bfbd;
    font-size: .46rem;
}

.psy-medias .available {
    color: var(--text);
    font-weight: 700;
}

.psychologist-card footer {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: .7rem;
    padding-top: .65rem;
    border-top: 1px solid rgba(18, 63, 60, .07);
}

.psychologist-card footer>div {
    display: grid;
}

.psychologist-card footer span {
    color: var(--muted);
    font-size: .42rem;
}

.psychologist-card footer strong {
    color: var(--ink);
    font-size: .53rem;
}

.psychologist-card footer .button {
    min-height: 35px;
    padding: .5rem .65rem;
    font-size: .5rem;
}

.directory-empty {
    padding: 4rem 1rem;
    border: 1px dashed var(--line);
    border-radius: 1rem;
    background: #fff;
    text-align: center;
}

.directory-empty>span {
    font-size: 1.5rem;
}

.directory-empty h2 {
    margin: .5rem 0 .2rem;
    color: var(--ink);
    font-size: .9rem;
}

.directory-empty p {
    margin: 0 0 1rem;
    font-size: .55rem;
}

/* Appointments */
.appointment-summary {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .8rem;
    margin-bottom: 1rem;
}

.appointment-summary article {
    display: flex;
    align-items: center;
    gap: .7rem;
    padding: .9rem 1rem;
    border: 1px solid var(--line);
    border-radius: .8rem;
    background: #fff;
}

.summary-icon {
    display: grid;
    width: 2.2rem;
    height: 2.2rem;
    place-items: center;
    border-radius: .6rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-size: .55rem;
    font-weight: 800;
}

.summary-icon.warm {
    background: #f9eadc;
}

.summary-icon.coral {
    color: #a54d50;
    background: #ffe7e5;
}

.appointment-summary strong {
    display: block;
    color: var(--ink);
    font-size: .75rem;
}

.appointment-summary p {
    margin: 0;
    color: var(--muted);
    font-size: .48rem;
}

.appointments-page-card {
    overflow: hidden;
}

.appointments-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .7rem 1rem 0;
    border-bottom: 1px solid var(--line);
}

.appointment-tabs {
    display: flex;
    gap: .2rem;
}

.appointment-tabs button {
    padding: .65rem .7rem;
    border: 0;
    border-bottom: 2px solid transparent;
    color: var(--muted);
    background: none;
    font-size: .53rem;
    font-weight: 700;
    cursor: pointer;
}

.appointment-tabs button.is-active {
    border-color: var(--primary);
    color: var(--primary);
}

.appointment-tabs span {
    margin-left: .25rem;
    padding: .1rem .32rem;
    border-radius: 2rem;
    background: var(--mint-soft);
    font-size: .42rem;
}

.toolbar-filter {
    padding: .45rem .6rem;
    border: 1px solid var(--line);
    border-radius: .5rem;
    color: var(--text);
    background: white;
    font-size: .48rem;
}

.appointment-row {
    display: grid;
    grid-template-columns: 3.3rem minmax(9rem, 1.5fr) 1fr 1fr auto auto;
    gap: .8rem;
    align-items: center;
    min-height: 78px;
    padding: .75rem 1rem;
    border-bottom: 1px solid rgba(18, 63, 60, .07);
}

.appointment-row:last-child {
    border-bottom: 0;
}

.appointment-date {
    display: grid;
    place-items: center;
    padding: .4rem;
    border-radius: .55rem;
    background: var(--mint-soft);
}

.appointment-date strong {
    color: var(--ink);
    font-size: .8rem;
    line-height: 1;
}

.appointment-date span {
    color: var(--primary);
    font-size: .38rem;
    font-weight: 800;
}

.appointment-practitioner {
    display: flex;
    align-items: center;
    gap: .55rem;
}

.mini-avatar {
    position: relative;
    display: grid;
    width: 2.2rem;
    height: 2.2rem;
    flex: 0 0 2.2rem;
    place-items: center;
    border-radius: .6rem;
    color: var(--ink);
    background: var(--mint-soft);
    font-size: .54rem;
    font-weight: 800;
}

.appointment-practitioner h2 {
    margin: 0;
    color: var(--ink);
    font-size: .6rem;
}

.appointment-practitioner p {
    margin: 0;
    color: var(--muted);
    font-size: .44rem;
}

.appointment-detail {
    display: grid;
}

.appointment-detail span {
    color: var(--muted);
    font-size: .4rem;
}

.appointment-detail strong {
    color: var(--ink);
    font-size: .5rem;
}

.appointment-state {
    padding: .28rem .45rem;
    border-radius: 2rem;
    color: var(--success);
    background: var(--success-soft);
    font-size: .42rem;
    font-weight: 800;
}

.appointment-state.past {
    color: var(--muted);
    background: #f1f3f2;
}

.appointment-state.cancelled {
    color: var(--danger);
    background: var(--danger-soft);
}

.appointment-more,
.chat-options {
    border: 0;
    color: var(--muted);
    background: none;
    cursor: pointer;
}

.appointment-help {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1rem;
    padding: .9rem 1rem;
    border-radius: .8rem;
    background: var(--mint-soft);
}

.appointment-help>div {
    display: flex;
    align-items: center;
    gap: .7rem;
}

.appointment-help>div>span {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: var(--primary);
    font-weight: 800;
}

.appointment-help h2 {
    margin: 0;
    color: var(--ink);
    font-size: .62rem;
}

.appointment-help p {
    margin: .1rem 0 0;
    font-size: .46rem;
}

.appointment-help button {
    border: 0;
    color: var(--primary);
    background: none;
    font-size: .5rem;
    font-weight: 800;
    cursor: pointer;
}

/* Messaging */
.messages-shell {
    display: grid;
    grid-template-columns: 18rem minmax(0, 1fr);
    overflow: hidden;
    min-height: 33rem;
}

.conversation-sidebar {
    border-right: 1px solid var(--line);
}

.conversation-sidebar>header {
    padding: 1rem;
    border-bottom: 1px solid var(--line);
}

.conversation-sidebar header>div {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.conversation-sidebar h2 {
    margin: 0;
    color: var(--ink);
    font-size: .72rem;
}

.conversation-sidebar header>div>span {
    padding: .12rem .4rem;
    border-radius: 2rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-size: .44rem;
    font-weight: 800;
}

.conversation-search {
    display: flex;
    align-items: center;
    gap: .35rem;
    margin-top: .7rem;
    padding: .5rem .6rem;
    border: 1px solid var(--line);
    border-radius: .55rem;
    background: #fafcfb;
}

.conversation-search input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    font-size: .5rem;
}

.conversation-item {
    position: relative;
    display: grid;
    width: 100%;
    grid-template-columns: auto minmax(0, 1fr);
    gap: .65rem;
    align-items: center;
    padding: .85rem 1rem;
    border: 0;
    border-bottom: 1px solid rgba(18, 63, 60, .06);
    color: inherit;
    background: white;
    text-align: left;
    cursor: pointer;
}

.conversation-item:hover,
.conversation-item.is-active {
    background: var(--mint-soft);
}

.conversation-copy {
    min-width: 0;
}

.conversation-copy>span {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .4rem;
}

.conversation-copy strong {
    overflow: hidden;
    color: var(--ink);
    font-size: .56rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.conversation-copy time,
.conversation-copy small {
    color: var(--muted);
    font-size: .42rem;
}

.conversation-copy small {
    display: block;
    overflow: hidden;
    margin-top: .12rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.unread-count {
    position: absolute;
    right: 1rem;
    bottom: .55rem;
    display: grid;
    width: .85rem;
    height: .85rem;
    place-items: center;
    border-radius: 50%;
    color: white;
    background: var(--primary);
    font-size: .38rem;
}

.conversation-empty {
    padding: 1rem;
    color: var(--muted);
    font-size: .5rem;
    text-align: center;
}

.chat-area,
.chat-panel {
    min-width: 0;
}

.chat-panel {
    display: grid;
    min-height: 33rem;
    grid-template-rows: auto 1fr auto;
}

.chat-header {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .75rem 1rem;
    border-bottom: 1px solid var(--line);
}

.chat-header h2 {
    margin: 0;
    color: var(--ink);
    font-size: .62rem;
}

.chat-header p {
    margin: 0;
    color: var(--muted);
    font-size: .43rem;
}

.chat-header p i {
    display: inline-block;
    width: .38rem;
    height: .38rem;
    margin-right: .2rem;
    border-radius: 50%;
    background: #4ab88b;
}

.chat-options {
    margin-left: auto;
}

.chat-back {
    display: none;
    border: 0;
    color: var(--primary);
    background: none;
}

.chat-messages {
    display: flex;
    overflow-y: auto;
    flex-direction: column;
    gap: .55rem;
    padding: 1.2rem;
    background: linear-gradient(rgba(255, 255, 255, .82), rgba(255, 255, 255, .82)), radial-gradient(circle at 10% 10%, var(--mint-soft), transparent 35%), var(--warm);
}

.chat-date {
    align-self: center;
    margin: 0;
    color: var(--muted);
    font-size: .42rem;
}

.message {
    max-width: min(75%, 25rem);
    padding: .65rem .75rem .4rem;
    border-radius: .75rem .75rem .75rem .18rem;
    background: white;
    box-shadow: 0 .2rem .7rem rgba(18, 63, 60, .05);
}

.message.sent {
    align-self: flex-end;
    border-radius: .75rem .75rem .18rem .75rem;
    color: #fff;
    background: var(--primary);
}

.message p {
    margin: 0;
    font-size: .52rem;
    line-height: 1.6;
}

.message time {
    display: block;
    margin-top: .2rem;
    color: var(--muted);
    font-size: .36rem;
    text-align: right;
}

.message.sent time {
    color: rgba(255, 255, 255, .7);
}

.message-composer {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: .5rem;
    align-items: end;
    padding: .75rem 1rem;
    border-top: 1px solid var(--line);
}

.message-composer textarea {
    min-height: 38px;
    max-height: 8rem;
    padding: .65rem .75rem;
    resize: none;
    border: 1px solid var(--line);
    border-radius: .65rem;
    outline: 0;
    color: var(--ink);
    background: #fbfdfc;
    font: inherit;
    font-size: .52rem;
}

.message-composer button {
    display: grid;
    width: 2rem;
    height: 2rem;
    padding: 0;
    place-items: center;
    border: 0;
    border-radius: .55rem;
    color: var(--primary);
    background: var(--mint-soft);
    cursor: pointer;
}

.message-composer .send-message {
    color: white;
    background: var(--primary);
}

.messages-notice {
    margin: .65rem 0 0;
    color: var(--muted);
    font-size: .45rem;
    text-align: center;
}

/* Profile */
.profile-hero {
    display: flex;
    align-items: center;
    gap: .9rem;
    margin-bottom: 1rem;
    padding: 1rem 1.2rem;
}

.profile-avatar {
    display: grid;
    width: 3.6rem;
    height: 3.6rem;
    place-items: center;
    border-radius: 1rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-size: 1rem;
    font-weight: 800;
}

.profile-hero h2 {
    margin: 0;
    color: var(--ink);
    font-size: .85rem;
}

.profile-hero p {
    margin: .04rem 0;
    color: var(--muted);
    font-size: .5rem;
}

.profile-hero span {
    color: var(--primary);
    font-size: .44rem;
    font-weight: 800;
}

.profile-hero .button {
    margin-left: auto;
}

.button-secondary {
    border: 1px solid var(--line);
    color: var(--primary);
    background: white;
}

.profile-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(17rem, .75fr);
    gap: 1rem;
    align-items: start;
}

.profile-aside {
    display: grid;
    gap: 1rem;
}

.profile-card {
    padding: 1.1rem;
}

.profile-card>header,
.profile-card>header>div {
    display: flex;
    align-items: center;
    gap: .65rem;
}

.profile-card>header {
    justify-content: space-between;
    padding-bottom: .9rem;
    border-bottom: 1px solid var(--line);
}

.profile-card-icon {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: .55rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-weight: 800;
}

.profile-card h2 {
    margin: 0;
    color: var(--ink);
    font-size: .65rem;
}

.profile-card header p {
    margin: 0;
    color: var(--muted);
    font-size: .43rem;
}

.profile-card header .button {
    min-height: 35px;
    padding: .5rem .7rem;
    font-size: .5rem;
}

.profile-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .8rem;
    padding-top: 1rem;
}

.profile-fields label {
    display: grid;
    gap: .3rem;
}

.profile-fields label>span {
    color: var(--ink);
    font-size: .5rem;
    font-weight: 800;
}

.profile-fields input {
    min-width: 0;
    min-height: 40px;
    padding: .6rem .7rem;
    border: 1px solid var(--line);
    border-radius: .58rem;
    color: var(--ink);
    background: #fbfdfc;
    font-size: .53rem;
}

.account-row,
.toggle-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .7rem;
    padding: .8rem 0;
    border-bottom: 1px solid rgba(18, 63, 60, .07);
}

.account-row:last-child,
.toggle-row:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.account-row>div {
    display: grid;
    min-width: 0;
}

.account-row.account-row-meta { align-items:start; }
.account-row.account-row-meta > div { flex:1; }

.account-row span {
    color: var(--muted);
    font-size: .42rem;
}

.account-row strong {
    overflow: hidden;
    color: var(--ink);
    font-size: .5rem;
    text-overflow: ellipsis;
}

.account-row button {
    border: 0;
    color: var(--primary);
    background: none;
    font-size: .46rem;
    font-weight: 800;
    cursor: pointer;
}

.toggle-row {
    cursor: pointer;
}

.toggle-row>span {
    display: grid;
}

.toggle-row strong {
    color: var(--ink);
    font-size: .5rem;
}

.toggle-row small {
    color: var(--muted);
    font-size: .4rem;
}

.toggle-row input {
    position: absolute;
    opacity: 0;
}

.toggle-row i {
    position: relative;
    width: 1.8rem;
    height: 1rem;
    flex: 0 0 1.8rem;
    border-radius: 1rem;
    background: #d9e1df;
    transition: background .2s ease;
}

.toggle-row i::after {
    position: absolute;
    top: .13rem;
    left: .14rem;
    width: .74rem;
    height: .74rem;
    border-radius: 50%;
    background: white;
    box-shadow: 0 .1rem .3rem rgba(0, 0, 0, .15);
    content: '';
    transition: transform .2s ease;
}

.toggle-row input:checked+i {
    background: var(--primary);
}

.toggle-row input:checked+i::after {
    transform: translateX(.78rem);
}

.visual-toast {
    position: fixed;
    z-index: 50;
    right: 1.2rem;
    bottom: 1.2rem;
    padding: .7rem 1rem;
    border-radius: .65rem;
    color: white;
    background: var(--ink);
    box-shadow: var(--shadow);
    font-size: .55rem;
}

@media (max-width: 1100px) {
    .psychologist-grid {
        grid-template-columns: 1fr;
    }

    .appointment-row {
        grid-template-columns: 3rem minmax(8rem, 1.4fr) 1fr auto auto;
    }

    .appointment-row .appointment-detail:nth-of-type(4) {
        display: none;
    }

    .profile-layout {
        grid-template-columns: 1fr;
    }

    .profile-aside {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 760px) {
    .directory-layout {
        grid-template-columns: 1fr;
    }

    .directory-filters {
        position: static;
    }

    .psychologist-grid {
        grid-template-columns: 1fr;
    }

    .appointment-summary {
        grid-template-columns: 1fr;
    }

    .appointment-row {
        grid-template-columns: 2.8rem minmax(0, 1fr) auto;
    }

    .appointment-row .appointment-detail {
        display: none;
    }

    .appointment-state {
        grid-column: 2;
        justify-self: start;
    }

    .appointment-more {
        grid-column: 3;
        grid-row: 1 / 3;
    }

    .appointments-toolbar {
        align-items: flex-end;
        overflow-x: auto;
    }

    .toolbar-filter {
        display: none;
    }

    .messages-shell {
        position: relative;
        display: block;
    }

    .conversation-sidebar {
        min-height: 33rem;
        border-right: 0;
    }

    .chat-area {
        position: absolute;
        inset: 0;
        visibility: hidden;
        background: white;
        transform: translateX(100%);
        transition: transform .22s ease, visibility .22s;
    }

    .messages-shell.chat-open .chat-area {
        visibility: visible;
        transform: translateX(0);
    }

    .chat-back {
        display: block;
    }

    .message {
        max-width: 88%;
    }

    .profile-aside {
        grid-template-columns: 1fr;
    }

    .profile-fields {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .results-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .results-heading select {
        width: 100%;
    }

    .psychologist-card footer {
        align-items: stretch;
        flex-direction: column;
    }

    .psychologist-card footer .button {
        width: 100%;
    }

    .appointment-tabs button {
        padding-inline: .4rem;
    }

    .appointment-help {
        align-items: flex-start;
        flex-direction: column;
    }

    .profile-hero {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .profile-hero .button {
        width: 100%;
        margin-left: 0;
    }

    .profile-card>header {
        align-items: flex-start;
    }

    .profile-form>header {
        flex-direction: column;
    }

    .profile-form>header .button {
        width: 100%;
    }
}

/* Keep these overrides last: later component rules intentionally use compact defaults. */
.app-body .directory-filters h2,
.app-body .results-heading strong {
    font-size: .85rem;
}

.app-body .directory-filters header p,
.app-body .results-heading p {
    font-size: .62rem;
}

.app-body .filter-block>label,
.app-body .filter-block legend {
    font-size: .68rem;
}

.app-body .filter-block select,
.app-body .filter-search,
.app-body .filter-search input {
    font-size: .68rem;
}

.app-body .filter-pills span,
.app-body .filter-checks label {
    font-size: .62rem;
}

.app-body .psy-card-top h2 {
    font-size: .86rem;
}

.app-body .psy-card-top p {
    font-size: .64rem;
}

.app-body .experience-label,
.app-body .psy-tags span,
.app-body .psy-medias span {
    font-size: .58rem;
}

.app-body .psychologist-card footer span {
    font-size: .55rem;
}

.app-body .psychologist-card footer strong {
    font-size: .66rem;
}

.app-body .psychologist-card footer .button {
    font-size: .62rem;
}

.app-body .appointment-summary strong {
    font-size: .95rem;
}

.app-body .appointment-summary p,
.app-body .appointment-tabs button {
    font-size: .67rem;
}

.app-body .appointment-date strong {
    font-size: 1rem;
}

.app-body .appointment-date span {
    font-size: .5rem;
}

.app-body .appointment-practitioner h2 {
    font-size: .76rem;
}

.app-body .appointment-practitioner p,
.app-body .appointment-detail strong {
    font-size: .62rem;
}

.app-body .appointment-detail span,
.app-body .appointment-state {
    font-size: .54rem;
}

.app-body .conversation-sidebar h2,
.app-body .chat-header h2 {
    font-size: .82rem;
}

.app-body .conversation-copy strong {
    font-size: .72rem;
}

.app-body .conversation-copy time,
.app-body .conversation-copy small,
.app-body .chat-header p {
    font-size: .58rem;
}

.app-body .message p,
.app-body .message-composer textarea {
    font-size: .68rem;
}

.app-body .message time,
.app-body .chat-date,
.app-body .messages-notice {
    font-size: .52rem;
}

html[data-theme="dark"] .app-body .directory-filters,
html[data-theme="dark"] .app-body .psychologist-card,
html[data-theme="dark"] .app-body .appointments-page-card,
html[data-theme="dark"] .app-body .messages-shell,
html[data-theme="dark"] .app-body .profile-card,
html[data-theme="dark"] .app-body .profile-hero,
html[data-theme="dark"] .app-body .appointment-summary article,
html[data-theme="dark"] .app-body .appointment-session-card,
html[data-theme="dark"] .app-body .appointment-facts-card {
    background: #142927;
}

html[data-theme="dark"] .app-body .conversation-item,
html[data-theme="dark"] .app-body .filter-block select,
html[data-theme="dark"] .app-body .filter-search,
html[data-theme="dark"] .app-body .profile-fields input,
html[data-theme="dark"] .app-body .message-composer textarea {
    color: var(--ink);
    background: #102522;
}

html[data-theme="dark"] .app-body .chat-area {
    background: #142927;
}

/* Final layout contract for live cards and appointment filters. */
.app-body .current-psy-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.app-body .current-psy-photo {
    aspect-ratio: 4 / 5;
    height: auto;
}

.app-body .appointment-row {
    grid-template-columns: 3.3rem minmax(9rem, 1.5fr) 1fr auto auto auto;
}

@media (max-width:1050px) {
    .app-body .current-psy-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width:760px) {
    .app-body .appointment-row {
        grid-template-columns: 2.8rem minmax(0, 1fr) auto;
    }

    .app-body .appointment-media-badge {
        grid-column: 2;
        justify-self: start;
    }

    .app-body .appointment-state {
        grid-column: 2;
    }

    .app-body .appointment-row .more-button {
        grid-column: 3;
        grid-row: 1 / 4;
    }
}

@media (max-width:560px) {
    .app-body .current-psy-grid {
        grid-template-columns: 1fr;
    }
}

/* Dynamic lists */
[hidden] {
    display: none !important;
}

.psy-infinite-loader {
    display: flex;
    min-height: 5rem;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    color: var(--muted);
}

.psy-infinite-loader span {
    width: 1rem;
    height: 1rem;
    border: 2px solid var(--line);
    border-top-color: var(--primary);
    border-radius: 50%;
    animation: psy-loader-spin .7s linear infinite;
}

.psy-infinite-loader p {
    margin: 0;
    font-size: .65rem;
}

@keyframes psy-loader-spin {
    to {
        transform: rotate(360deg);
    }
}

.phone-field .iti {
    width: 100%;
}

.phone-field .iti input {
    width: 100%;
}

.iti__dropdown-content {
    color: var(--ink);
    background: var(--white);
    border-color: var(--line);
}

.iti__search-input {
    color: var(--ink);
    background: var(--white);
    border-color: var(--line);
}

.practitioner-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dashboard-empty {
    display: grid;
    min-height: 13rem;
    place-items: center;
    align-content: center;
    gap: .35rem;
    padding: 2rem;
    text-align: center;
}

.dashboard-empty.compact {
    min-height: 10rem;
}

.dashboard-empty>span {
    color: var(--primary);
    font-size: 1.5rem;
}

.dashboard-empty h3 {
    margin: .2rem 0 0;
    color: var(--ink);
    font-size: .9rem;
}

.dashboard-empty p {
    margin: 0 0 .7rem;
    color: var(--muted);
    font-size: .66rem;
}

.needs-dashboard-card { display:flex; align-items:center; justify-content:space-between; gap:2rem; padding:1.5rem 1.75rem; margin:0 0 1.35rem; border:1px solid rgba(35,117,113,.2); border-radius:1rem; background:linear-gradient(120deg, rgba(224,246,241,.85), var(--white)); }
.needs-dashboard-card h2 { margin:.28rem 0; color:var(--ink); font-size:1.15rem; }
.needs-dashboard-card p { max-width:43rem; margin:0; color:var(--muted); font-size:.78rem; line-height:1.55; }
.needs-dashboard-card .button { flex:none; white-space:nowrap; }
.needs-page { max-width:70rem; margin:0 auto; }
.needs-intro { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:1.5rem; }
.needs-intro h1 { margin:.25rem 0 .45rem; color:var(--ink); font-size:clamp(1.5rem,3vw,2.05rem); }
.needs-intro p { max-width:42rem; margin:0; color:var(--muted); line-height:1.55; }
.needs-intro>a { color:var(--primary); font-size:.78rem; font-weight:700; white-space:nowrap; }
.needs-progress { display:grid; grid-template-columns:repeat(var(--needs-step-count, 5),1fr); gap:.4rem; padding:0; margin:0 0 1rem; list-style:none; }
.needs-progress li { position:relative; min-width:0; }
.needs-progress li:not(:last-child)::after { position:absolute; top:.9rem; left:calc(50% + 1.2rem); width:calc(100% - 1.5rem); height:2px; background:var(--line); content:""; }
.needs-progress button { display:grid; width:100%; justify-items:center; gap:.35rem; padding:0; border:0; background:none; color:var(--muted); cursor:pointer; font:inherit; font-size:.65rem; font-weight:700; text-align:center; }
.needs-progress b { z-index:1; display:grid; width:1.8rem; height:1.8rem; place-items:center; border:2px solid var(--line); border-radius:50%; background:var(--white); }
.needs-progress .is-current button,.needs-progress .is-done button { color:var(--primary); }
.needs-progress .is-current b { border-color:var(--primary); background:var(--primary); color:#fff; }
.needs-progress .is-done b { border-color:var(--primary); background:rgba(35,117,113,.13); }
.needs-progress .is-done:not(:last-child)::after { background:var(--primary); }
.needs-card { padding:clamp(1.25rem,4vw,3rem); border:1px solid var(--line); border-radius:1rem; background:var(--white); box-shadow:0 1rem 2.5rem rgba(24,55,52,.05); }
.needs-heading { max-width:44rem; margin:0 auto 2rem; text-align:center; }
.needs-heading>span { color:var(--primary); font-size:.7rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.needs-heading h2 { margin:.35rem 0 .2rem; color:var(--ink); font-size:1.35rem; }
.needs-heading p { margin:0; color:var(--muted); line-height:1.5; }
.needs-choice-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(10.5rem,1fr)); gap:.7rem; max-width:56rem; margin:auto; padding:0; border:0; }
.needs-choice-grid label,.needs-choice-row label,.needs-therapy-list label { cursor:pointer; }
.needs-choice-grid input,.needs-choice-row input,.needs-therapy-list input { position:absolute; opacity:0; pointer-events:none; }
.needs-choice-grid label>span,.needs-choice-row label>span { display:block; min-height:3.2rem; padding:.85rem 1rem; border:1px solid var(--line); border-radius:.65rem; background:var(--white); color:var(--ink); font-size:.78rem; font-weight:650; transition:.15s ease; }
.needs-choice-grid input:checked+span,.needs-choice-row input:checked+span { border-color:var(--primary); background:rgba(35,117,113,.1); color:var(--primary); box-shadow:inset 0 0 0 1px var(--primary); }
.needs-domains { grid-template-columns:repeat(auto-fit,minmax(12rem,1fr)); max-width:60rem; gap:.5rem; }
.needs-domains label>span { display:grid; grid-template-columns:1.8rem minmax(0,1fr) auto; align-items:center; min-height:3.8rem; gap:.65rem; padding:.6rem .75rem; border-radius:.7rem; font-weight:500; }
.needs-domains i { display:grid; width:1.8rem; height:1.8rem; place-items:center; border-radius:.5rem; background:rgba(35,117,113,.09); color:var(--primary); }
.needs-domains svg { width:1.1rem; height:1.1rem; }
.needs-domains b { font-size:.76rem; font-weight:700; line-height:1.25; }
.needs-domains em { display:grid; width:1.15rem; height:1.15rem; place-items:center; border:1px solid var(--line); border-radius:50%; color:transparent; font-size:.68rem; font-style:normal; }
.needs-domains input:checked+span i { background:rgba(35,117,113,.16); }
.needs-domains input:checked+span em { border-color:var(--primary); background:var(--primary); color:#fff; }
.needs-media { grid-template-columns:repeat(3,1fr); max-width:52rem; gap:.65rem; }
.needs-media label>span { display:flex; align-items:center; justify-content:center; gap:.55rem; min-height:2.7rem; padding:.65rem .8rem; text-align:left; }
.needs-media i { display:grid; width:1.55rem; height:1.55rem; flex:0 0 1.55rem; place-items:center; border-radius:.45rem; background:rgba(35,117,113,.09); color:var(--primary); }
.needs-media svg { width:.95rem; height:.95rem; }
.needs-media b { font-size:.75rem; }
.needs-field-groups { display:grid; gap:1.65rem; max-width:52rem; margin:auto; }
.needs-field-groups fieldset { padding:0; border:0; }
.needs-field-groups legend { margin-bottom:.7rem; color:var(--ink); font-size:.82rem; font-weight:750; }
.needs-consultation-options { max-width:52rem; padding:0; margin:0 auto 1.25rem; border:0; }
.needs-consultation-options:last-child { margin-bottom:0; }
.needs-consultation-options legend { margin-bottom:.7rem; color:var(--ink); font-size:.82rem; font-weight:750; }
.needs-choice-row { display:flex; flex-wrap:wrap; gap:.65rem; }
.needs-choice-row label { flex:1 1 9rem; }
.needs-choice-row label>span { min-height:2.7rem; text-align:center; }
.needs-choice-row.is-wrap label { flex:0 1 auto; }
.needs-choice-row.is-illustrated label>span { display:flex; align-items:center; justify-content:center; gap:.5rem; padding:.65rem .8rem; text-align:left; }
.needs-choice-row.is-illustrated i { display:grid; width:1.55rem; height:1.55rem; flex:0 0 1.55rem; place-items:center; border-radius:.45rem; background:rgba(35,117,113,.09); color:var(--primary); }
.needs-choice-row.is-illustrated svg { width:.95rem; height:.95rem; }
.needs-choice-row.is-illustrated b { font-size:.75rem; }
.needs-presentation { display:grid; min-height:20rem; place-items:center; }
.needs-presentation .needs-heading { margin:0; }
.needs-therapy-heading { margin-bottom:1.4rem; }
.needs-therapies-layout { display:grid; grid-template-columns:minmax(13rem,.75fr) minmax(0,1.25fr); gap:.85rem; max-width:59rem; margin:auto; }
.needs-therapy-list { display:grid; align-content:start; gap:.45rem; padding:.45rem; margin:0; border:1px solid var(--line); border-radius:.9rem; background:var(--surface); }
.needs-therapy-list label>span { display:flex; align-items:center; justify-content:space-between; gap:.6rem; min-height:3.1rem; padding:.8rem .9rem; border:1px solid transparent; border-radius:.65rem; color:var(--ink); transition:.15s ease; }
.needs-therapy-list label.is-selected>span { border-color:rgba(35,117,113,.38); background:rgba(35,117,113,.1); color:var(--primary); box-shadow:none; }
.needs-therapy-list b { font-size:.8rem; }
.needs-therapy-list i { font-size:1.2rem; font-style:normal; }
.needs-therapy-explanation { display:grid; min-height:18rem; align-content:center; padding:clamp(1.4rem,4vw,3rem); border:1px solid var(--line); border-radius:.9rem; background:linear-gradient(135deg,rgba(35,117,113,.065),transparent 65%); }
.needs-therapy-explanation h3 { margin:.45rem 0 1rem; color:var(--ink); font-size:1.3rem; }
.needs-therapy-explanation p { max-width:36rem; margin:0; color:var(--muted); font-size:.86rem; line-height:1.7; }
.needs-neutral-note { max-width:54rem; margin:1.4rem auto 0; color:var(--muted); font-size:.72rem; line-height:1.5; }
.needs-navigation { display:flex; justify-content:flex-end; gap:.7rem; margin-top:1rem; }
.needs-navigation [data-needs-previous]:not([hidden]) { margin-right:auto; }
html[data-theme="dark"] .needs-card,html[data-theme="dark"] .needs-choice-grid label>span,html[data-theme="dark"] .needs-choice-row label>span { background:#102522; }
html[data-theme="dark"] .needs-therapy-list { background:rgba(255,255,255,.035); }
html[data-theme="dark"] .needs-therapy-explanation { background:linear-gradient(135deg,rgba(41,148,139,.12),transparent 65%); }
html[data-theme="dark"] .needs-dashboard-card { background:linear-gradient(120deg,rgba(21,73,68,.62),#102522); }
@media (max-width:650px) { .needs-dashboard-card,.needs-intro { align-items:flex-start; flex-direction:column; } .needs-dashboard-card .button { width:100%; } .needs-progress button span { display:none; } .needs-progress { gap:0; } .needs-progress li:not(:last-child)::after { left:calc(50% + 1rem); width:calc(100% - 1.6rem); } .needs-media { grid-template-columns:1fr; } .needs-presentation { min-height:15rem; } .needs-therapies-layout { grid-template-columns:1fr; } .needs-therapy-list { grid-template-columns:1fr 1fr; } .needs-therapy-list label>span { border-right:0; } .needs-therapy-explanation { min-height:14rem; } .needs-navigation .button { min-width:7rem; } }

html[data-theme="dark"] .iti__dropdown-content,
html[data-theme="dark"] .iti__search-input {
    color: var(--ink);
    background: #102522;
}

.clear-filters {
    padding: .25rem;
    border: 0;
    background: none;
    cursor: pointer;
}

.drawer-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .65rem;
}

.app-body .appointments-empty h2 {
    margin: 0;
    font-size: .82rem;
}

.app-body .appointments-empty p {
    margin: .25rem 0 0;
    font-size: .62rem;
}

.psy-profile-hero {
    display: grid;
    overflow: hidden;
    grid-template-columns: minmax(15rem, .72fr) minmax(0, 1.28fr);
    border: 1px solid var(--line);
    border-radius: 1.2rem;
    background: var(--white);
    box-shadow: 0 .6rem 2.2rem rgba(18, 63, 60, .05);
}

.psy-profile-photo {
    display: grid;
    min-height: 27rem;
    place-items: center;
    overflow: hidden;
    color: var(--primary);
    background: linear-gradient(145deg, var(--mint-soft), #dbece9);
    font-size: 2rem;
    font-weight: 800;
}

.psy-profile-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.psy-profile-heading {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    padding: clamp(1.6rem, 4vw, 3rem);
}

.psy-profile-heading h1 {
    margin: .35rem 0 .15rem;
    color: var(--ink);
    font-size: clamp(2rem, 4vw, 3.3rem);
    letter-spacing: -.055em;
    line-height: 1;
}

.psy-profile-heading>p {
    margin: 0;
    color: var(--muted);
    font-size: .82rem;
}

.psy-profile-facts {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(3, 1fr);
    gap: .6rem;
    margin: 1.35rem 0 .8rem;
}

.psy-profile-facts>span {
    display: grid;
    padding: .75rem;
    border-radius: .7rem;
    background: var(--mint-soft);
}

.psy-profile-facts small {
    color: var(--muted);
    font-size: .57rem;
}

.psy-profile-facts strong {
    color: var(--ink);
    font-size: .7rem;
}

.psy-profile-medias {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    margin-bottom: 1.2rem;
}

.psy-profile-medias span,
.psy-profile-tags span {
    padding: .38rem .58rem;
    border-radius: .5rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-size: .64rem;
    font-weight: 750;
}

.psy-profile-notice {
    margin-top: 1rem;
    padding: .85rem 1rem;
    border-radius: .75rem;
    color: #805d21;
    background: #fff3d9;
    font-size: .7rem;
}

.psy-profile-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(18rem, .65fr);
    gap: 1rem;
    margin-top: 1rem;
    align-items: start;
}

.psy-profile-main,
.psy-profile-aside {
    display: grid;
    gap: 1rem;
}

.psy-profile-card {
    padding: 1.25rem;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: var(--white);
    box-shadow: 0 .5rem 1.8rem rgba(18, 63, 60, .035);
}

.psy-profile-card h2 {
    margin: 0 0 .8rem;
    color: var(--ink);
    font-size: .9rem;
}

.psy-profile-description {
    margin: 0;
    color: var(--text);
    font-size: .74rem;
    line-height: 1.8;
    white-space: normal;
}

.psy-profile-tags {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}

.psy-profile-schedule {
    display: grid;
}

.psy-profile-schedule>div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .65rem 0;
    border-bottom: 1px solid var(--line);
}

.psy-profile-schedule>div:last-child {
    border-bottom: 0;
}

.psy-profile-schedule strong {
    color: var(--ink);
    font-size: .68rem;
}

.psy-profile-schedule span {
    color: var(--muted);
    font-size: .64rem;
    text-align: right;
}

.psy-profile-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.psy-profile-section-heading span {
    padding: .15rem .42rem;
    border-radius: 2rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-size: .58rem;
    font-weight: 800;
}

.psy-profile-feedbacks {
    display: grid;
    gap: .65rem;
}

.psy-profile-feedbacks article {
    padding: .85rem;
    border: 1px solid var(--line);
    border-radius: .7rem;
    background: #fbfdfc;
}

.psy-profile-feedbacks header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

.psy-profile-feedbacks strong {
    color: var(--success);
    font-size: .66rem;
}

.psy-profile-feedbacks time,
.psy-profile-muted {
    color: var(--muted);
    font-size: .6rem;
}

.psy-profile-feedbacks p {
    margin: .4rem 0 0;
    color: var(--text);
    font-size: .68rem;
    line-height: 1.65;
}

.psy-profile-help {
    padding: 1rem;
    border-radius: .85rem;
    background: var(--warm);
}

.psy-profile-help strong {
    color: var(--ink);
    font-size: .75rem;
}

.psy-profile-help p {
    margin: .25rem 0 .55rem;
    font-size: .65rem;
}

.psy-profile-help a {
    color: var(--primary);
    font-size: .66rem;
    font-weight: 800;
}

html[data-theme="dark"] .psy-profile-hero,
html[data-theme="dark"] .psy-profile-card {
    background: #142927;
}

html[data-theme="dark"] .psy-profile-facts>span,
html[data-theme="dark"] .psy-profile-tags span,
html[data-theme="dark"] .psy-profile-medias span {
    background: #1d403c;
}

html[data-theme="dark"] .psy-profile-feedbacks article {
    background: #102522;
}

html[data-theme="dark"] .psy-profile-help {
    background: #2b2521;
}

@media (max-width:850px) {
    .psy-profile-hero {
        grid-template-columns: 1fr;
    }

    .psy-profile-photo {
        min-height: auto;
        aspect-ratio: 4 / 3;
    }

    .psy-profile-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width:560px) {
    .psy-profile-facts {
        grid-template-columns: 1fr;
    }

    .drawer-actions {
        grid-template-columns: 1fr;
    }
}

/* Media pictograms and roomier appointment spaces */
.media-picto {
    width: 1.05em;
    height: 1.05em;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    vertical-align: -.12em;
}

.appointment-media-badge,
.video-label,
.filter-checks span,
.psy-profile-medias span {
    display: inline-flex;
    align-items: center;
    gap: .32rem;
}

.appointment-detail-layout {
    grid-template-columns: minmax(0, 1.8fr) minmax(16rem, .55fr);
}

.appointment-session-card {
    min-height: 36rem;
}

.media-hero-icon .media-picto {
    width: 3.2rem;
    height: 3.2rem;
}

.session-icon .media-picto {
    width: 1.25rem;
    height: 1.25rem;
}

.appointment-workspace {
    display: grid;
    gap: 1rem;
    min-height: 19rem;
    margin: 0 0 1.2rem;
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: .9rem;
    background: #f8fbfa;
}

.workspace-preview {
    display: grid;
    min-height: 13rem;
    place-items: center;
    align-content: center;
    gap: .55rem;
    border-radius: .75rem;
    color: var(--muted);
    background: linear-gradient(145deg, #d9ebe8, #eef6f4);
    text-align: center;
}

.workspace-preview .media-picto {
    width: 3rem;
    height: 3rem;
    color: var(--primary);
}

.workspace-preview strong {
    color: var(--ink);
    font-size: .9rem;
}

.workspace-preview span {
    font-size: .68rem;
}

.workspace-chat {
    display: grid;
    min-height: 13rem;
    align-content: center;
    gap: .7rem;
    padding: 1.2rem;
    border-radius: .75rem;
    background: linear-gradient(145deg, #f4eafa, #f8f4fa);
}

.workspace-chat-date {
    color: var(--muted);
    font-size: .58rem;
    text-align: center;
}

.workspace-chat p {
    width: min(80%, 28rem);
    margin: 0;
    padding: .8rem;
    border-radius: .75rem .75rem .75rem .2rem;
    color: var(--text);
    background: var(--white);
    font-size: .7rem;
}

.workspace-chat>div {
    display: flex;
    justify-content: space-between;
    margin-top: auto;
    padding: .7rem .8rem;
    border: 1px solid var(--line);
    border-radius: .65rem;
    color: var(--muted);
    background: var(--white);
    font-size: .65rem;
}

.workspace-phone {
    display: flex;
    min-height: 13rem;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 1.4rem;
    border-radius: .75rem;
    background: linear-gradient(145deg, #fff0e2, #f9e7d8);
}

.workspace-phone>.media-picto {
    width: 3.5rem;
    height: 3.5rem;
    flex: 0 0 3.5rem;
    color: var(--primary);
}

.workspace-phone div {
    max-width: 28rem;
}

.workspace-phone small {
    color: var(--muted);
    font-size: .58rem;
}

.workspace-phone strong {
    display: block;
    margin: .2rem 0;
    color: var(--ink);
    font-size: .9rem;
}

.workspace-phone p {
    margin: 0;
    font-size: .68rem;
    line-height: 1.65;
}

html[data-theme="dark"] .appointment-workspace {
    background: #102522;
}

html[data-theme="dark"] .workspace-preview,
html[data-theme="dark"] .workspace-chat,
html[data-theme="dark"] .workspace-phone {
    background: #1b3532;
}

/* Shared appointment code dialog */
.page-intro-actions,
.dashboard-heading-actions {
    display: flex;
    align-items: center;
    gap: .65rem;
}

.group-appointment-dialog {
    width: min(calc(100% - 2rem), 31rem);
    padding: 0;
    border: 0;
    border-radius: 1rem;
    color: var(--text);
    background: transparent;
    box-shadow: 0 1.4rem 4rem rgba(7, 28, 27, .22);
}

.group-appointment-dialog::backdrop {
    background: rgba(7, 28, 27, .52);
    backdrop-filter: blur(3px);
}

.group-appointment-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: var(--white);
}

.group-appointment-card>header,
.group-appointment-card>header>div {
    display: flex;
    align-items: center;
    gap: .7rem;
}

.group-appointment-card>header {
    justify-content: space-between;
    padding: 1rem 1.1rem;
    border-bottom: 1px solid var(--line);
}

.group-dialog-icon {
    display: grid;
    width: 2.4rem;
    height: 2.4rem;
    place-items: center;
    border-radius: .65rem;
    color: var(--primary);
    background: var(--mint-soft);
}

.group-dialog-icon .media-picto {
    width: 1.2rem;
    height: 1.2rem;
}

.group-appointment-card h2 {
    margin: 0;
    color: var(--ink);
    font-size: .85rem;
}

.group-appointment-card header p {
    margin: .1rem 0 0;
    color: var(--muted);
    font-size: .58rem;
}

.group-appointment-body {
    padding: 1.15rem;
}

.group-appointment-body>p {
    margin: 0 0 1rem;
    font-size: .7rem;
    line-height: 1.6;
}

.group-appointment-body label {
    display: grid;
    gap: .35rem;
}

.group-appointment-body label span {
    color: var(--ink);
    font-size: .66rem;
    font-weight: 800;
}

.group-appointment-body input {
    min-height: 46px;
    padding: .7rem .8rem;
    border: 1px solid var(--line);
    border-radius: .65rem;
    color: var(--ink);
    background: #fbfdfc;
    font: inherit;
    font-size: .75rem;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.group-appointment-feedback {
    min-height: 1.1rem;
    margin-top: .65rem;
    color: var(--muted);
    font-size: .62rem;
}

.group-appointment-feedback:empty {
    display: none;
}

.group-appointment-feedback.is-error {
    color: var(--danger);
}

.group-appointment-feedback.is-success {
    color: var(--success);
}

.group-appointment-card>footer {
    display: flex;
    justify-content: flex-end;
    gap: .6rem;
    padding: .9rem 1.1rem;
    border-top: 1px solid var(--line);
}

html[data-theme="dark"] .group-appointment-card {
    background: #142927;
}

html[data-theme="dark"] .group-appointment-body input {
    background: #102522;
}

/* Booking flow */
.booking-header {
    margin-bottom: 1rem;
    padding: 1rem 1.2rem;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: var(--white);
}

.booking-practitioner {
    display: flex;
    align-items: center;
    gap: .85rem;
}

.booking-practitioner>img,
.booking-practitioner>span {
    width: 3.6rem;
    height: 3.6rem;
    flex: 0 0 3.6rem;
    border-radius: .85rem;
    object-fit: cover;
}

.booking-practitioner>span {
    display: grid;
    place-items: center;
    color: var(--primary);
    background: var(--mint-soft);
    font-weight: 800;
}

.booking-practitioner span,
.booking-practitioner p {
    color: var(--muted);
    font-size: .62rem;
}

.booking-practitioner h1 {
    margin: .05rem 0;
    color: var(--ink);
    font-size: 1.05rem;
}

.booking-practitioner p {
    margin: 0;
}

.booking-wizard {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 1.1rem;
    background: var(--white);
    box-shadow: 0 .7rem 2.5rem rgba(18, 63, 60, .05);
}

.booking-progress {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border-bottom: 1px solid var(--line);
    background: #fbfdfc;
}

.booking-progress button {
    position: relative;
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    padding: 1rem .6rem;
    border: 0;
    color: var(--muted);
    background: none;
    cursor: pointer;
}

.booking-progress button::after {
    position: absolute;
    right: -8%;
    width: 16%;
    height: 1px;
    background: var(--line);
    content: '';
}

.booking-progress button:last-child::after {
    display: none;
}

.booking-progress button>span {
    display: grid;
    width: 1.45rem;
    height: 1.45rem;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 50%;
    background: var(--white);
    font-size: .58rem;
}

.booking-progress strong {
    font-size: .64rem;
}

.booking-progress button.is-active {
    color: var(--primary);
}

.booking-progress button.is-active>span,
.booking-progress button.is-complete>span {
    border-color: var(--primary);
    color: #fff;
    background: var(--primary);
}

.booking-panel {
    min-height: 31rem;
    padding: clamp(1.2rem, 3vw, 2rem);
}

.booking-panel>header {
    margin-bottom: 1.4rem;
    text-align: center;
}

.booking-panel>header h2 {
    margin: 0;
    color: var(--ink);
    font-size: 1.25rem;
}

.booking-panel>header p {
    margin: .35rem 0 0;
    color: var(--muted);
    font-size: .7rem;
}

.booking-panel>h3 {
    margin: 1.2rem 0 .65rem;
    color: var(--ink);
    font-size: .8rem;
}

.booking-days {
    display: grid;
    max-height: 27rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    overflow-y: auto;
    padding-right: .3rem;
}

.booking-day {
    padding: .85rem;
    border: 1px solid var(--line);
    border-radius: .8rem;
}

.booking-day h3 {
    margin: 0 0 .65rem;
    color: var(--ink);
    font-size: .72rem;
}

.booking-day>div {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.booking-day label {
    position: relative;
    display: block;
}

.booking-day label input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: 0;
    overflow: hidden;
    clip-path: inset(50%);
    opacity: 0;
}

.booking-day label span {
    display: block;
    padding: .4rem .55rem;
    border: 1px solid var(--line);
    border-radius: .48rem;
    color: var(--primary);
    background: var(--white);
    font-size: .64rem;
    font-weight: 800;
    cursor: pointer;
}

.booking-day label input:checked+span {
    border-color: var(--primary);
    color: #fff;
    background: var(--primary);
}

.booking-choice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .7rem;
}

.booking-media-choices {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.booking-choice {
    position: relative;
    display: grid;
    min-height: 8rem;
    align-content: center;
    gap: .25rem;
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: .8rem;
    cursor: pointer;
}

.booking-choice input {
    position: absolute;
    opacity: 0;
}

.booking-choice:has(input:checked) {
    border-color: var(--primary);
    background: var(--mint-soft);
    box-shadow: inset 0 0 0 1px var(--primary);
}

.booking-choice.is-disabled {
    opacity: .42;
    cursor: not-allowed;
}

.booking-choice-icon {
    display: grid;
    width: 2.2rem;
    height: 2.2rem;
    place-items: center;
    margin-bottom: .35rem;
    border-radius: .6rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-size: .9rem;
}

.booking-choice-icon .media-picto {
    width: 1.15rem;
    height: 1.15rem;
}

.booking-choice strong {
    color: var(--ink);
    font-size: .76rem;
}

.booking-choice small {
    color: var(--muted);
    font-size: .59rem;
    line-height: 1.5;
}

.booking-recap {
    overflow: hidden;
    width: min(100%, 43rem);
    margin: 0 auto;
    border: 1px solid var(--line);
    border-radius: .85rem;
}

.booking-recap>div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .8rem 1rem;
    border-bottom: 1px solid var(--line);
}

.booking-recap>div:last-child {
    border-bottom: 0;
}

.booking-recap span {
    color: var(--muted);
    font-size: .66rem;
}

.booking-recap strong {
    color: var(--ink);
    font-size: .7rem;
    text-align: right;
}

.booking-recap-total {
    background: var(--mint-soft);
}

.booking-payment-card {
    display: grid;
    width: min(100%, 35rem);
    gap: .8rem;
    margin: 0 auto 1rem;
    padding: 1.2rem;
    border: 1px solid var(--line);
    border-radius: .9rem;
    background: #fbfdfc;
}

.payment-card-heading,
.booking-payment-card>div {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .7rem;
}

.payment-card-heading {
    display: flex !important;
    justify-content: space-between;
    color: var(--ink);
    font-size: .67rem;
    font-weight: 800;
}

.payment-card-heading span:last-child {
    color: var(--muted);
    font-size: .55rem;
}

.booking-payment-card label {
    display: grid;
    gap: .3rem;
}

.booking-payment-card label span {
    color: var(--ink);
    font-size: .6rem;
    font-weight: 750;
}

.booking-payment-card input {
    min-height: 43px;
    padding: .65rem .7rem;
    border: 1px solid var(--line);
    border-radius: .6rem;
    color: var(--ink);
    background: var(--white);
    font: inherit;
    font-size: .68rem;
}

.booking-consent {
    display: flex;
    width: min(100%, 35rem);
    gap: .55rem;
    margin: 1rem auto;
    color: var(--text);
    font-size: .64rem;
    line-height: 1.5;
}

.booking-payment-note {
    width: min(100%, 35rem);
    margin: 0 auto;
    padding: .7rem;
    border-radius: .6rem;
    color: var(--muted);
    background: var(--warm);
    font-size: .6rem;
    text-align: center;
}

.booking-validation {
    min-height: 1rem;
    padding: 0 2rem;
    color: var(--danger);
    font-size: .64rem;
    text-align: right;
}

.booking-controls {
    display: flex;
    justify-content: flex-end;
    gap: .65rem;
    padding: 1rem 1.4rem;
    border-top: 1px solid var(--line);
}

.booking-empty {
    display: grid;
    min-height: 20rem;
    place-items: center;
    align-content: center;
    text-align: center;
}

.booking-empty>span {
    color: var(--primary);
    font-size: 1.5rem;
}

.booking-empty h3 {
    margin: .5rem 0 .2rem;
    color: var(--ink);
    font-size: .9rem;
}

.booking-empty p {
    margin: 0;
    color: var(--muted);
    font-size: .65rem;
}

html[data-theme="dark"] .booking-header,
html[data-theme="dark"] .booking-wizard {
    background: #142927;
}

html[data-theme="dark"] .booking-progress,
html[data-theme="dark"] .booking-payment-card {
    background: #102522;
}

html[data-theme="dark"] .booking-day label span,
html[data-theme="dark"] .booking-payment-card input {
    background: #142927;
}

/* Profile feedback tab and infinite reviews */
.psy-profile-tabs {
    display: flex;
    gap: 1rem;
    margin-top: 1rem;
    padding: 0 1rem;
    border: 1px solid var(--line);
    border-radius: .8rem;
    background: var(--white);
}

.psy-profile-tabs button {
    padding: .8rem .15rem .7rem;
    border: 0;
    border-bottom: 2px solid transparent;
    color: var(--muted);
    background: none;
    font-size: .7rem;
    font-weight: 800;
    cursor: pointer;
}

.psy-profile-tabs button.is-active {
    border-color: var(--primary);
    color: var(--primary);
}

.psy-profile-tabs span {
    padding: .08rem .3rem;
    border-radius: 2rem;
    background: var(--mint-soft);
    font-size: .55rem;
}

.psy-profile-feedback-panel {
    max-height: 38rem;
    margin-top: 1rem;
    overflow-y: auto;
}

.psy-profile-section-heading>div>p {
    margin: -.45rem 0 .8rem;
    color: var(--muted);
    font-size: .62rem;
}

.feedback-infinite-sentinel {
    display: flex;
    min-height: 4rem;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    color: var(--muted);
}

.feedback-infinite-sentinel>span {
    width: .85rem;
    height: .85rem;
    border: 2px solid var(--line);
    border-top-color: var(--primary);
    border-radius: 50%;
    animation: psy-loader-spin .7s linear infinite;
}

.feedback-infinite-sentinel p {
    margin: 0;
    font-size: .6rem;
}

html[data-theme="dark"] .psy-profile-tabs {
    background: #142927;
}

@media (max-width:850px) {
    .appointment-detail-layout {
        grid-template-columns: 1fr;
    }

    .booking-days {
        grid-template-columns: 1fr;
    }

    .booking-media-choices {
        grid-template-columns: 1fr;
    }
}

@media (max-width:620px) {

    .page-intro-actions,
    .dashboard-heading-actions {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .booking-progress strong {
        display: none;
    }

    .booking-panel {
        min-height: 28rem;
    }

    .booking-choice-grid {
        grid-template-columns: 1fr;
    }

    .booking-controls {
        flex-wrap: wrap;
    }

    .booking-controls .button {
        flex: 1;
    }

    .appointment-workspace {
        min-height: 16rem;
    }

    .workspace-phone {
        align-items: flex-start;
        flex-direction: column;
    }

    .group-appointment-card>footer {
        flex-direction: column-reverse;
    }

    .group-appointment-card>footer .button {
        width: 100%;
    }
}

/* Rendez-vous, avis et facturation */
.app-body .current-psy-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dashboard-date {
    min-width: 10.5rem;
    padding: .72rem .9rem;
    text-align: left;
}

.dashboard-date span {
    font-size: .52rem;
    letter-spacing: .08em;
}

.dashboard-date strong {
    margin-top: .12rem;
    font-size: .72rem;
    letter-spacing: 0;
    text-transform: capitalize;
}

.group-appointment-dialog {
    width: min(calc(100% - 2rem), 35rem);
}

.group-appointment-body {
    display: grid;
    gap: .9rem;
}

.group-appointment-body>p {
    margin: 0;
    font-size: .72rem;
    line-height: 1.7;
}

.group-appointment-hint {
    display: grid;
    gap: .18rem;
    padding: .8rem .9rem;
    border-radius: .7rem;
    color: var(--text);
    background: var(--mint-soft);
}

.group-appointment-hint strong {
    color: var(--ink);
    font-size: .65rem;
}

.group-appointment-hint span {
    font-size: .61rem;
    line-height: 1.55;
}

.psy-preview-drawer {
    width: min(96vw, 47rem);
    grid-template-rows: auto auto minmax(0, 1fr) auto;
}

.psy-preview-drawer.is-feedback-mode .psy-drawer-content {
    padding: .85rem 1.25rem 1.25rem;
}

.drawer-feedbacks {
    min-height: 100%;
}

.drawer-feedbacks [data-feedback-list],
.psy-profile-feedbacks {
    display: grid;
    gap: .9rem;
}

.drawer-feedback {
    padding: 1.05rem 1.1rem;
    border-radius: .9rem;
}

.drawer-feedback header {
    padding-bottom: .65rem;
    border-bottom: 1px solid var(--line);
}

.drawer-feedback strong {
    font-size: .7rem;
}

.drawer-feedback time {
    font-size: .62rem;
}

.drawer-feedback p {
    margin: .7rem 0 0;
    font-size: .73rem;
    line-height: 1.75;
}

.appointment-preview-drawer {
    position: fixed;
    z-index: 86;
    top: 0;
    right: 0;
    display: grid;
    width: min(96vw, 38rem);
    height: 100vh;
    grid-template-rows: auto minmax(0, 1fr) auto;
    border-left: 1px solid var(--line);
    background: var(--white);
    box-shadow: -1rem 0 3rem rgba(13, 52, 49, .2);
    visibility: hidden;
    transform: translateX(105%);
    transition: transform .25s ease, visibility .25s;
}

.appointment-preview-drawer.is-open {
    visibility: visible;
    transform: translateX(0);
}

.appointment-preview-drawer>header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.1rem 1.25rem;
    border-bottom: 1px solid var(--line);
}

.appointment-preview-drawer>header>div {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.appointment-drawer-icon {
    display: grid;
    width: 2.7rem;
    height: 2.7rem;
    place-items: center;
    border-radius: .75rem;
    color: var(--primary);
    background: var(--mint-soft);
}

.appointment-drawer-icon .media-picto {
    width: 1.25rem;
    height: 1.25rem;
}

.appointment-preview-drawer header span {
    color: var(--muted);
    font-size: .58rem;
}

.appointment-preview-drawer header h2 {
    margin: .08rem 0 0;
    color: var(--ink);
    font-size: .9rem;
}

.appointment-drawer-content {
    overflow-y: auto;
    padding: 1.35rem;
}

.appointment-drawer-practitioner {
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: .9rem;
}

.appointment-drawer-practitioner h3 {
    margin: .1rem 0;
    color: var(--ink);
    font-size: .85rem;
}

.appointment-drawer-practitioner small,
.appointment-drawer-practitioner p {
    margin: 0;
    color: var(--muted);
    font-size: .6rem;
}

.appointment-drawer-facts {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .7rem;
    margin-top: 1rem;
}

.appointment-drawer-facts>span {
    display: grid;
    gap: .2rem;
    padding: .9rem;
    border-radius: .75rem;
    background: var(--mint-soft);
}

.appointment-drawer-facts small {
    color: var(--muted);
    font-size: .58rem;
}

.appointment-drawer-facts strong {
    color: var(--ink);
    font-size: .72rem;
}

.appointment-drawer-status {
    margin-top: 1rem;
    padding: 1rem;
    border-top: 1px solid var(--line);
}

.appointment-drawer-status>div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.appointment-drawer-status span {
    color: var(--muted);
    font-size: .62rem;
}

.appointment-drawer-status strong {
    padding: .32rem .55rem;
    border-radius: 2rem;
    color: var(--success);
    background: var(--success-soft);
    font-size: .61rem;
}

.appointment-drawer-status strong.is-cancelled {
    color: var(--danger);
    background: var(--danger-soft);
}

.appointment-drawer-status strong.is-past {
    color: var(--muted);
    background: #edf1f0;
}

.appointment-drawer-status p {
    margin: .9rem 0 0;
    color: var(--text);
    font-size: .68rem;
    line-height: 1.65;
}

.appointment-preview-drawer>footer {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--line);
}

.appointment-preview-drawer>footer .button {
    flex: 1;
    white-space: nowrap;
}

.appointment-preview-drawer>footer .button-primary {
    flex-basis: 100%;
}

.appointment-preview-drawer .invoice-download .media-picto,
.invoice-download .media-picto {
    width: .85rem;
    height: .85rem;
}

.appointment-drawer-overlay {
    position: fixed;
    z-index: 85;
    inset: 0;
    display: none;
    border: 0;
    background: rgba(7, 28, 27, .48);
    backdrop-filter: blur(2px);
}

.appointment-drawer-visible .appointment-drawer-overlay {
    display: block;
}

.drawer-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.booking-recap-detailed>div {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: .7rem;
}

.booking-recap-detailed>div>span:not(.booking-recap-picto) {
    display: grid;
    gap: .12rem;
}

.booking-recap-detailed small {
    color: var(--muted);
    font-size: .58rem;
}

.booking-recap-detailed em {
    color: var(--muted);
    font-size: .55rem;
    font-style: normal;
}

.booking-recap-picto {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: .55rem;
    color: var(--primary);
    background: var(--mint-soft);
}

.booking-recap-picto .media-picto {
    width: 1rem;
    height: 1rem;
}

.booking-recap-detailed button,
.booking-recap-detailed a {
    border: 0;
    color: var(--primary);
    background: none;
    font-size: .59rem;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}

.booking-recap-detailed .booking-recap-total {
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 1rem;
}

.booking-payment-information {
    width: min(100%, 43rem);
    margin: 1rem auto 0;
    padding: 1rem 1.1rem;
    border: 1px dashed var(--line);
    border-radius: .8rem;
    background: #fbfdfc;
}

.booking-payment-information h3 {
    margin: 0 0 .55rem;
    color: var(--ink);
    font-size: .75rem;
}

.booking-payment-information p {
    margin: .35rem 0;
    color: var(--text);
    font-size: .64rem;
    line-height: 1.65;
}

.booking-payment-information a {
    color: var(--primary);
    font-weight: 750;
}

.booking-info-dialog {
    width: min(calc(100% - 2rem), 39rem);
    padding: 0;
    border: 0;
    border-radius: 1rem;
    color: var(--text);
    background: transparent;
    box-shadow: 0 1.4rem 4rem rgba(7, 28, 27, .24);
}

.booking-info-dialog::backdrop {
    background: rgba(7, 28, 27, .56);
    backdrop-filter: blur(3px);
}

.booking-info-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: var(--white);
}

.booking-info-card>header {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: 1.1rem 1.2rem;
    border-bottom: 1px solid var(--line);
}

.booking-info-card>header>span {
    display: grid;
    width: 2.7rem;
    height: 2.7rem;
    flex: 0 0 2.7rem;
    place-items: center;
    border-radius: .7rem;
    color: var(--primary);
    background: var(--mint-soft);
}

.booking-info-card>header .media-picto {
    width: 1.25rem;
    height: 1.25rem;
}

.booking-info-card h2 {
    margin: 0;
    color: var(--ink);
    font-size: .88rem;
}

.booking-info-card header p {
    margin: .1rem 0 0;
    color: var(--muted);
    font-size: .6rem;
}

.booking-info-body {
    padding: 1.2rem;
}

.booking-info-body>p,
.booking-info-body li {
    color: var(--text);
    font-size: .68rem;
    line-height: 1.7;
}

.booking-info-body>p {
    margin: 0 0 .8rem;
}

.booking-info-body>p:last-child {
    margin-bottom: 0;
}

.booking-info-body ol {
    display: grid;
    gap: .45rem;
    margin: .8rem 0;
    padding-left: 1.2rem;
}

.booking-info-card>footer {
    display: flex;
    justify-content: flex-end;
    gap: .6rem;
    padding: .9rem 1.2rem;
    border-top: 1px solid var(--line);
}

.booking-phone-card label {
    display: grid;
    gap: .35rem;
    margin-top: 1rem;
}

.booking-phone-card label>span {
    color: var(--ink);
    font-size: .64rem;
    font-weight: 800;
}

.booking-phone-card input[type="tel"] {
    width: 100%;
    min-height: 46px;
    padding: .65rem .75rem;
    border: 1px solid var(--line);
    border-radius: .65rem;
    color: var(--ink);
    background: #fbfdfc;
    font: inherit;
    font-size: .72rem;
}

.booking-phone-card .iti {
    width: 100%;
}

.booking-phone-feedback {
    min-height: 1rem;
    margin-top: .45rem;
    color: var(--muted);
    font-size: .61rem;
}

.booking-phone-feedback.is-error {
    color: var(--danger);
}

.invoices-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: var(--white);
    box-shadow: 0 .5rem 2rem rgba(18, 63, 60, .04);
}

.invoices-card>header {
    padding: 1rem 1.2rem;
    border-bottom: 1px solid var(--line);
}

.invoices-card h2 {
    margin: 0;
    color: var(--ink);
    font-size: .85rem;
}

.invoices-card header p {
    margin: .14rem 0 0;
    color: var(--muted);
    font-size: .6rem;
}

.invoices-table-wrap {
    overflow-x: auto;
}

.invoices-table {
    width: 100%;
    border-collapse: collapse;
}

.invoices-table th,
.invoices-table td {
    padding: .85rem 1rem;
    border-bottom: 1px solid var(--line);
    color: var(--text);
    font-size: .66rem;
    text-align: left;
    white-space: nowrap;
}

.invoices-table th {
    color: var(--muted);
    font-size: .54rem;
    text-transform: uppercase;
}

.invoices-table td:last-child {
    text-align: right;
}

.invoices-table .button {
    display: inline-flex;
    gap: .4rem;
    min-height: 34px;
    padding: .45rem .65rem;
}

.invoice-type {
    display: inline-flex;
    padding: .28rem .48rem;
    border-radius: 2rem;
    color: var(--success);
    background: var(--success-soft);
    font-size: .58rem;
    font-weight: 800;
}

.invoice-type.is-credit {
    color: var(--danger);
    background: var(--danger-soft);
}

.invoices-empty {
    display: grid;
    min-height: 20rem;
    place-items: center;
    align-content: center;
    text-align: center;
}

.invoices-empty>.media-picto {
    width: 2rem;
    height: 2rem;
    color: var(--primary);
}

.invoices-empty h2 {
    margin: .7rem 0 .2rem;
}

.invoices-empty p {
    margin: 0;
    color: var(--muted);
    font-size: .66rem;
}

html[data-theme="dark"] .appointment-preview-drawer,
html[data-theme="dark"] .booking-info-card,
html[data-theme="dark"] .invoices-card {
    background: #142927;
}

html[data-theme="dark"] .booking-payment-information,
html[data-theme="dark"] .booking-phone-card input[type="tel"] {
    background: #102522;
}

html[data-theme="dark"] .appointment-drawer-status strong.is-past {
    background: #263936;
}

@media (max-width:1280px) {
    .app-body .current-psy-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width:900px) {
    .app-body .current-psy-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width:620px) {
    .app-body .current-psy-grid {
        grid-template-columns: 1fr;
    }

    .appointment-drawer-facts {
        grid-template-columns: 1fr;
    }

    .appointment-preview-drawer>footer,
    .booking-info-card>footer {
        flex-direction: column;
    }

    .appointment-preview-drawer>footer .button {
        width: 100%;
    }

    .booking-recap-detailed>div {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .booking-recap-detailed button,
    .booking-recap-detailed a {
        grid-column: 2;
        justify-self: start;
        padding: 0;
    }

    .invoices-table th:nth-child(2),
    .invoices-table td:nth-child(2),
    .invoices-table th:nth-child(4),
    .invoices-table td:nth-child(4) {
        display: none;
    }
}

/* Préférences de lecture et finitions */
html[data-font-size="small"] {
    font-size: 15px;
}

html[data-font-size="normal"] {
    font-size: 16px;
}

html[data-font-size="large"] {
    font-size: 17px;
}

.login-remember {
    display: flex;
    align-items: flex-start;
    gap: .65rem;
    margin-top: -.15rem;
    color: var(--text);
    cursor: pointer;
}

.login-remember input {
    width: 1rem;
    height: 1rem;
    flex: 0 0 1rem;
    margin: .2rem 0 0;
    accent-color: var(--primary);
}

.login-remember>span {
    display: grid;
    gap: .05rem;
}

.login-remember strong {
    color: var(--ink);
    font-size: .65rem;
}

.login-remember small {
    color: var(--muted);
    font-size: .56rem;
    line-height: 1.45;
}

.sidebar-account-actions {
    align-items: center;
}

.font-size-controls {
    display: flex;
    align-items: center;
    gap: .18rem;
    padding: .16rem;
    border: 1px solid var(--line);
    border-radius: .45rem;
    background: var(--mint-soft);
}

.sidebar-account-actions .font-size-controls button {
    display: grid;
    width: 1.45rem;
    height: 1.35rem;
    place-items: center;
    border-radius: .3rem;
    color: var(--primary);
    font-size: .48rem;
}

.sidebar-account-actions .font-size-controls button:hover {
    background: var(--white);
}

.sidebar-account-actions .font-size-controls button:disabled {
    color: var(--muted);
    opacity: .35;
    cursor: default;
}

.font-size-controls span {
    min-width: 2rem;
    color: var(--muted);
    font-size: .42rem;
    font-weight: 750;
    text-align: center;
}

.feedback-author {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: .55rem;
}

.feedback-author>span {
    display: grid;
    width: 2rem;
    height: 2rem;
    flex: 0 0 2rem;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: var(--primary);
    font-size: .64rem;
    font-weight: 800;
}

.feedback-author.is-anonymous>span {
    color: var(--primary);
    background: var(--mint-soft);
}

.feedback-author>div {
    display: grid;
    min-width: 0;
}

.feedback-author b {
    overflow: hidden;
    color: var(--ink);
    font-size: .68rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.feedback-author strong {
    font-size: .56rem;
    font-weight: 700;
}

.app-body .appointment-row {
    grid-template-columns: 3.3rem minmax(9rem, 1.5fr) .8fr auto auto auto auto;
}

.appointment-type-badge {
    display: inline-flex;
    justify-content: center;
    padding: .34rem .52rem;
    border: 1px solid var(--line);
    border-radius: .5rem;
    color: var(--text);
    background: var(--white);
    font-size: .55rem;
    font-weight: 800;
    white-space: nowrap;
}

.appointment-type-badge.is-multiple {
    border-color: rgba(35, 117, 113, .18);
    color: var(--primary);
    background: var(--mint-soft);
}

.booking-info-card>footer [data-booking-multiple-confirm] {
    min-width: 12rem;
}

.booking-info-card>footer [data-booking-multiple-countdown] {
    display: inline-block;
    min-width: 1.15rem;
    margin: 0 .12rem;
    text-align: center;
}

.booking-phone-card input[type="tel"] {
    height: 46px;
    min-height: 46px;
}

.booking-phone-card .iti__country-container,
.booking-phone-card .iti__selected-country {
    min-height: 46px;
}

.booking-phone-card .iti__selected-country {
    padding-inline: .65rem;
    font-size: .72rem;
}

.booking-phone-card .iti__selected-dial-code {
    margin-left: .38rem;
    font-size: .72rem;
    line-height: 1;
}

.booking-phone-card .iti__flag {
    transform: none;
}

html[data-theme="dark"] .font-size-controls {
    background: #1d403c;
}

html[data-theme="dark"] .sidebar-account-actions .font-size-controls button:hover,
html[data-theme="dark"] .appointment-type-badge {
    background: #102522;
}

@media (max-width:760px) {
    .app-body .appointment-row {
        grid-template-columns: 2.8rem minmax(0, 1fr) auto;
    }

    .app-body .appointment-type-badge {
        grid-column: 2;
        justify-self: start;
    }

    .app-body .appointment-row .more-button {
        grid-column: 3;
        grid-row: 1 / 5;
    }
}

/* Consultation Webcam et rythme typographique */
.appointment-detail-layout-compact {
    margin-top: 0;
}

.appointment-access-countdown {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 1rem;
    margin-top: 1rem;
    padding: clamp(1.15rem, 2.8vw, 2rem);
    border: 1px solid rgba(35, 117, 113, .16);
    border-radius: 1rem;
    background: linear-gradient(145deg, var(--mint-soft), var(--warm-white));
}

.appointment-access-icon {
    display: grid;
    width: 3rem;
    height: 3rem;
    place-items: center;
    border-radius: .85rem;
    color: var(--primary);
    background: var(--white);
    box-shadow: 0 .5rem 1.3rem rgba(18, 63, 60, .08);
}

.appointment-access-icon .media-picto {
    width: 1.4rem;
    height: 1.4rem;
}

.appointment-access-copy h2 {
    margin: .12rem 0 .35rem;
    color: var(--ink);
    font-size: clamp(1.05rem, 2vw, 1.35rem);
}

.appointment-access-copy p {
    margin: 0;
    color: var(--text);
    font-size: .76rem;
    line-height: 1.6;
}

.appointment-countdown {
    display: inline-grid;
    gap: .12rem;
    min-width: 10.5rem;
    margin-top: 1rem;
    padding: .7rem .9rem;
    border-radius: .75rem;
    color: var(--white);
    background: var(--primary);
}

.appointment-countdown small {
    font-size: .58rem;
    font-weight: 700;
    opacity: .78;
}

.appointment-countdown strong {
    font-size: 1.05rem;
    font-variant-numeric: tabular-nums;
    letter-spacing: .035em;
}

.appointment-access-copy .appointment-refresh-note {
    margin-top: .65rem;
    color: var(--muted);
    font-size: .62rem;
}

.appointment-table-actions {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
}

.appointment-row-actions {
    display: inline-flex;
    align-items: center;
    justify-self: end;
    gap: .35rem;
}

.appointment-direct-link {
    display: inline-flex;
    align-items: center;
    min-height: 2rem;
    padding: .35rem .65rem;
    border: 1px solid var(--line);
    border-radius: .55rem;
    color: var(--primary);
    background: var(--white);
    font-size: .55rem;
    font-weight: 800;
    text-decoration: none;
    transition: color .18s ease, background .18s ease, border-color .18s ease, transform .18s ease;
}

.appointment-direct-link:hover {
    border-color: var(--primary);
    color: var(--white);
    background: var(--primary);
    transform: translateY(-1px);
}

html[data-theme="dark"] .appointment-access-countdown {
    background: linear-gradient(145deg, #18332f, #172925);
}

html[data-theme="dark"] .appointment-access-icon,
html[data-theme="dark"] .appointment-direct-link {
    background: #102522;
}

html[data-theme="dark"] .appointment-direct-link:hover,
html[data-theme="dark"] .appointment-direct-link:focus-visible {
    color: #fff;
    background: var(--primary);
}

@media (max-width:620px) {
    .appointment-access-countdown {
        grid-template-columns: 1fr;
    }
}

@media (max-width:760px) {
    .app-body .appointment-row .appointment-row-actions {
        grid-column: 3;
        grid-row: 1 / 5;
        align-self: center;
        flex-direction: column-reverse;
    }

    .appointment-row-actions .appointment-direct-link {
        padding-inline: .48rem;
    }
}

.detail-breadcrumb {
    align-items: center;
    flex-wrap: wrap;
}

.detail-breadcrumb .appointment-state {
    margin-left: auto;
}

.session-practitioner h1 {
    margin: .05rem 0;
    color: var(--ink);
    font-size: 1rem;
}

.appointment-phone-number {
    display: inline-flex;
    width: max-content;
    margin: .35rem 0 .45rem;
    color: var(--primary);
    font-size: 1.15rem;
    font-weight: 800;
    letter-spacing: .02em;
}

.appointment-phone-missing {
    display: inline-flex;
    width: max-content;
    margin: .35rem 0 .45rem;
    color: var(--danger);
    font-size: .76rem;
    font-weight: 800;
}

.workspace-phone>.media-picto {
    width: 2rem;
    height: 2rem;
    flex: 0 0 2rem;
}

.phone-number-preview {
    justify-content: space-between;
    margin-bottom: 0;
}

.vonage-shell {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: .95rem;
    background: #0d201f;
}

.vonage-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .7rem;
    padding: .65rem .75rem;
    color: #fff;
    background: #102b29;
}

.vonage-toolbar>div {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.vonage-control {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    gap: .35rem;
    padding: .42rem .58rem;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: .55rem;
    color: rgba(255, 255, 255, .72);
    background: rgba(255, 255, 255, .06);
    font-size: .56rem;
    font-weight: 800;
    cursor: pointer;
}

.vonage-control:hover,
.vonage-control.is-active {
    border-color: rgba(153, 221, 215, .5);
    color: #fff;
    background: rgba(35, 117, 113, .72);
}

.vonage-control .media-picto {
    width: .9rem;
    height: .9rem;
}

.vonage-stage {
    position: relative;
    min-height: clamp(22rem, 48vw, 38rem);
    overflow: hidden;
    background: #091817;
}

.vonage-subscriber {
    position: absolute;
    inset: 0;
}

.vonage-publisher {
    position: absolute;
    z-index: 3;
    right: 1rem;
    bottom: 1rem;
    overflow: hidden;
    width: min(28%, 12rem);
    aspect-ratio: 4/3;
    border: 2px solid rgba(255, 255, 255, .82);
    border-radius: .8rem;
    background: #173330;
    box-shadow: 0 .6rem 1.8rem rgba(0, 0, 0, .28);
}

.vonage-subscriber .OT_root,
.vonage-publisher .OT_root,
.vonage-subscriber .OT_video-element,
.vonage-publisher .OT_video-element {
    width: 100% !important;
    height: 100% !important;
}

.vonage-waiting {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    align-content: center;
    color: #fff;
    text-align: center;
}

.vonage-waiting[hidden] {
    display: none;
}

.vonage-waiting>span {
    width: 2rem;
    height: 2rem;
    margin-bottom: .8rem;
    border: 3px solid rgba(255, 255, 255, .2);
    border-top-color: var(--mint);
    border-radius: 50%;
    animation: psy-loader-spin .8s linear infinite;
}

.vonage-waiting strong {
    font-size: .82rem;
}

.vonage-waiting small {
    margin-top: .2rem;
    color: rgba(255, 255, 255, .62);
    font-size: .58rem;
}

.vonage-stream-warning {
    position: absolute;
    z-index: 5;
    top: 1rem;
    left: 50%;
    display: grid;
    width: min(calc(100% - 2rem), 30rem);
    gap: .15rem;
    padding: .75rem .9rem;
    border: 1px solid rgba(255, 196, 99, .35);
    border-radius: .7rem;
    color: #ffe4b3;
    background: rgba(69, 49, 20, .92);
    box-shadow: 0 .5rem 1.4rem rgba(0, 0, 0, .2);
    transform: translateX(-50%);
}

.vonage-stream-warning[hidden] {
    display: none;
}

.vonage-stream-warning strong {
    font-size: .66rem;
}

.vonage-stream-warning span {
    font-size: .58rem;
    line-height: 1.5;
}

.vonage-media-status {
    position: absolute;
    z-index: 4;
    top: 1rem;
    left: 1rem;
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.vonage-media-status span {
    padding: .35rem .5rem;
    border-radius: 2rem;
    color: #fff;
    background: rgba(11, 28, 27, .78);
    font-size: .52rem;
    font-weight: 800;
    backdrop-filter: blur(4px);
}

.vonage-media-status span[hidden] {
    display: none;
}

.vonage-preflight {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: .6rem;
    align-items: center;
    padding: .75rem;
    color: #fff;
    background: #102b29;
}

.vonage-preflight>div {
    display: flex;
    align-items: center;
    gap: .48rem;
}

.vonage-preflight>div>span {
    display: grid;
    width: 1.55rem;
    height: 1.55rem;
    place-items: center;
    border-radius: 50%;
    color: #c6d5d3;
    background: rgba(255, 255, 255, .08);
    font-size: .6rem;
    font-weight: 900;
}

.vonage-preflight>div>span.is-ok {
    color: #fff;
    background: var(--success);
}

.vonage-preflight>div>span.is-error {
    color: #fff;
    background: var(--danger);
}

.vonage-preflight p {
    display: grid;
    margin: 0;
}

.vonage-preflight strong {
    font-size: .58rem;
}

.vonage-preflight small {
    color: rgba(255, 255, 255, .58);
    font-size: .5rem;
}

.vonage-preflight .button {
    min-height: 38px;
}

.vonage-configuration-note {
    margin: 0;
    padding: .55rem .75rem;
    color: rgba(255, 255, 255, .58);
    background: #0d201f;
    font-size: .55rem;
    text-align: center;
}

.vonage-configuration-note.is-error {
    color: #ffc0c0;
}

.vonage-settings-dialog {
    width: min(calc(100% - 2rem), 34rem);
    padding: 0;
    border: 0;
    border-radius: 1rem;
    color: var(--text);
    background: transparent;
    box-shadow: 0 1.2rem 4rem rgba(7, 28, 27, .25);
}

.vonage-settings-dialog::backdrop {
    background: rgba(7, 28, 27, .58);
    backdrop-filter: blur(3px);
}

.vonage-settings-dialog form {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: var(--white);
}

.vonage-settings-dialog header,
.vonage-settings-dialog header>div {
    display: flex;
    align-items: center;
    gap: .7rem;
}

.vonage-settings-dialog header {
    justify-content: space-between;
    padding: 1rem 1.1rem;
    border-bottom: 1px solid var(--line);
}

.vonage-settings-dialog header>div>span {
    display: grid;
    width: 2.4rem;
    height: 2.4rem;
    place-items: center;
    border-radius: .65rem;
    color: var(--primary);
    background: var(--mint-soft);
}

.vonage-settings-dialog h2 {
    margin: 0;
    color: var(--ink);
    font-size: .82rem;
}

.vonage-settings-dialog header p {
    margin: .08rem 0 0;
    color: var(--muted);
    font-size: .56rem;
}

.vonage-settings-dialog form>div {
    display: grid;
    gap: .8rem;
    padding: 1.1rem;
}

.vonage-settings-dialog label {
    display: grid;
    gap: .35rem;
}

.vonage-settings-dialog label span {
    color: var(--ink);
    font-size: .62rem;
    font-weight: 800;
}

.vonage-settings-dialog select {
    min-height: 44px;
    padding: .6rem .7rem;
    border: 1px solid var(--line);
    border-radius: .6rem;
    color: var(--ink);
    background: #fbfdfc;
    font: inherit;
    font-size: .66rem;
}

.vonage-settings-dialog footer {
    display: flex;
    justify-content: flex-end;
    gap: .55rem;
    padding: .85rem 1.1rem;
    border-top: 1px solid var(--line);
}

.group-appointment-steps {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 2.5rem minmax(0, 1fr);
    align-items: start;
    padding: .8rem;
    border: 1px solid var(--line);
    border-radius: .8rem;
    background: var(--surface);
}

.group-appointment-steps>span {
    display: flex;
    align-items: flex-start;
    gap: .55rem;
}

.group-appointment-steps b {
    display: grid;
    width: 1.65rem;
    height: 1.65rem;
    flex: 0 0 1.65rem;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: var(--primary);
    font-size: .58rem;
}

.group-appointment-steps>span>span {
    display: grid;
    gap: .12rem;
}

.group-appointment-steps strong {
    color: var(--ink);
    font-size: .61rem;
}

.group-appointment-steps small {
    color: var(--muted);
    font-size: .53rem;
    line-height: 1.45;
}

.group-appointment-steps>i {
    height: 1px;
    margin: .82rem .4rem 0;
    background: linear-gradient(90deg, var(--primary), rgba(35,117,113,.2));
}

.group-code-input {
    display: grid;
    min-height: 3.25rem;
    grid-template-columns: 2.65rem minmax(0,1fr);
    align-items: center;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: .78rem;
    background: var(--surface);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.45);
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.group-code-input:focus-within {
    border-color: var(--primary);
    background: var(--white);
    box-shadow: 0 0 0 .2rem rgba(35,117,113,.12);
}

.group-code-input>i {
    display: grid;
    width: 2rem;
    height: 2rem;
    margin-left: .42rem;
    place-items: center;
    border-radius: .58rem;
    color: var(--primary);
    background: var(--mint-soft);
}

.group-code-input>i>.media-picto {
    width: 1rem;
    height: 1rem;
}

.group-code-input input {
    width: 100%;
    min-width: 0;
    min-height: 3.1rem;
    padding: .72rem .85rem .7rem .35rem;
    border: 0;
    outline: 0;
    background: transparent;
    font-size: .72rem;
    font-weight: 750;
    letter-spacing: .12em;
}

.group-code-input input::placeholder {
    color: var(--muted);
    opacity: .72;
    font-weight: 650;
    letter-spacing: .08em;
}

.update-list {
    gap: .65rem;
}

.update-list article {
    padding: .82rem .9rem;
}

.update-list h3 {
    margin: .2rem 0 .3rem;
    font-size: .76rem;
}

.update-list p {
    font-size: .62rem;
    line-height: 1.58;
}

.update-list time {
    font-size: .54rem;
}

.section-heading h2 {
    font-size: .84rem;
}

.section-heading p {
    margin-top: .12rem;
    font-size: .51rem;
    line-height: 1.45;
}

.app-body .profile-card h2,
.profile-card h2 {
    font-size: .82rem;
}

.app-body .profile-card header p,
.profile-card header p {
    margin-top: .12rem;
    font-size: .58rem;
    line-height: 1.45;
}

.booking-panel>header {
    margin-bottom: 1.2rem;
}

.booking-panel>header h2 {
    font-size: 1.05rem;
}

.booking-panel>header p {
    margin-top: .28rem;
    font-size: .64rem;
    line-height: 1.5;
}

.invoices-card h2 {
    font-size: .8rem;
}

.invoices-card header p {
    margin-top: .18rem;
    font-size: .56rem;
}

html[data-theme="dark"] .vonage-settings-dialog form {
    background: #142927;
}

html[data-theme="dark"] .vonage-settings-dialog select,
html[data-theme="dark"] .group-code-input {
    background: #102522;
}

@media (max-width:760px) {
    .vonage-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .vonage-toolbar>div {
        justify-content: center;
    }

    .vonage-control span {
        display: none;
    }

    .vonage-preflight {
        grid-template-columns: 1fr 1fr;
    }

    .vonage-preflight .button {
        grid-column: 1 / -1;
    }

    .vonage-publisher {
        width: 35%;
    }

    .group-appointment-steps {
        grid-template-columns: 1fr;
        gap: .7rem;
    }

    .group-appointment-steps>i {
        display: none;
    }
}

/* Live messaging */
.messages-shell {
    height: min(44rem, calc(100vh - 12rem));
    min-height: 36rem;
    grid-template-columns: minmax(17rem, 21rem) minmax(0, 1fr);
}

.conversation-sidebar {
    display: flex;
    min-height: 0;
    overflow-y: auto;
    flex-direction: column;
    background: var(--white);
    scrollbar-width: thin;
}

.conversation-sidebar>header {
    position: sticky;
    z-index: 2;
    top: 0;
    background: var(--white);
}

.conversation-search svg {
    width: 1rem;
    height: 1rem;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
}

.conversation-search input {
    font-size: .68rem;
}

.conversation-list {
    flex: 0 0 auto;
}

.conversation-item {
    min-height: 4.6rem;
    padding: .78rem .9rem;
}

.conversation-item .mini-avatar img,
.chat-header .mini-avatar img {
    width: 100%;
    height: 100%;
    border-radius: inherit;
    object-fit: cover;
}

.conversation-copy strong {
    font-size: .74rem;
}

.conversation-copy time,
.conversation-copy small {
    font-size: .58rem;
}

.conversation-list-state {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    padding: 1rem;
    color: var(--muted);
    font-size: .6rem;
    text-align: center;
}

.conversation-list-state[hidden] {
    display: none;
}

.conversation-sentinel {
    height: 1px;
}

.message-loader {
    display: inline-block;
    width: .85rem;
    height: .85rem;
    flex: 0 0 auto;
    border: 2px solid var(--line);
    border-top-color: var(--primary);
    border-radius: 50%;
    animation: message-spin .7s linear infinite;
}

@keyframes message-spin {
    to {
        transform: rotate(360deg);
    }
}

.chat-area {
    min-height: 0;
    background: var(--white);
}

.chat-welcome {
    display: grid;
    height: 100%;
    padding: 2rem;
    place-content: center;
    justify-items: center;
    color: var(--muted);
    text-align: center;
}

.chat-welcome-icon {
    display: grid;
    width: 4rem;
    height: 4rem;
    margin-bottom: 1rem;
    place-items: center;
    border-radius: 1.2rem;
    color: var(--primary);
    background: var(--mint-soft);
}

.chat-welcome-icon svg {
    width: 2rem;
    height: 2rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.chat-welcome h2 {
    margin: 0;
    color: var(--ink);
    font-size: 1rem;
}

.chat-welcome p {
    margin: .35rem 0 0;
    font-size: .7rem;
}

.chat-panel {
    height: 100%;
    min-height: 0;
    grid-template-rows: auto minmax(0, 1fr) auto auto;
}

.chat-header {
    min-height: 4.6rem;
    padding: .7rem 1rem;
}

.chat-header h2 {
    font-size: .84rem;
}

.chat-header p {
    margin-top: .1rem;
    font-size: .58rem;
}

.chat-header p i {
    display: none;
}

.chat-identity {
    min-width: 0;
}

.chat-quick-actions {
    display: flex;
    gap: .45rem;
    margin-left: auto;
}

.chat-quick-link {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .45rem .6rem;
    border: 1px solid var(--line);
    border-radius: .55rem;
    color: var(--ink);
    background: var(--white);
    font-size: .6rem;
    font-weight: 700;
    text-decoration: none;
}

.chat-quick-link.primary {
    border-color: transparent;
    color: #fff;
    background: var(--primary);
}

.chat-quick-link:hover {
    border-color:rgba(35,117,113,.36);
    color:var(--primary);
    background:var(--mint-soft);
    box-shadow:0 .35rem 1rem rgba(18,63,60,.12);
    transform:translateY(-1px);
}

.chat-quick-link.primary:hover {
    border-color:transparent;
    color:#fff;
    background:var(--primary-hover);
}

.chat-quick-link .media-picto {
    width: .85rem;
    height: .85rem;
}

.chat-messages {
    min-height: 0;
    gap: .65rem;
    padding: 1.2rem 1.35rem;
    scroll-behavior: auto;
}

.chat-history-state {
    display: flex;
    align-self: center;
    align-items: center;
    gap: .4rem;
    padding: .35rem .6rem;
    color: var(--mued);
    font-size: .58rem;
}

.message {
    position: relative;
    max-width: min(76%, 30rem);
    padding: .65rem .8rem .42rem;
}

.message.received:not(.message-system) {
    margin-left: 2.15rem;
}

.message-avatar {
    position: absolute;
    left: -2.15rem;
    bottom: 0;
    display: grid;
    width: 1.72rem;
    height: 1.72rem;
    overflow: hidden;
    place-items: center;
    border: 2px solid var(--white);
    border-radius: 50%;
    color: var(--primary);
    background: var(--mint-soft);
    box-shadow: 0 .18rem .55rem rgba(18, 63, 60, .12);
    font-size: .5rem;
    font-weight: 800;
    visibility: hidden;
}

.message.received.message-group-end .message-avatar {
    visibility: visible;
}

.message-avatar img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

html[data-theme="dark"] .message-avatar {
    border-color: #102522;
    background: #1d403c;
}

.message p {
    overflow-wrap: anywhere;
    white-space: pre-wrap;
    font-size: .7rem;
    line-height: 1.55;
}

.message time {
    font-size: .5rem;
}

.message-special p {
    color: var(--muted);
    font-style: italic;
}

.chat-unavailable {
    display: flex;
    gap: .45rem;
    align-items: center;
    padding: .7rem 1rem;
    border-top: 1px solid var(--line);
    color: var(--muted);
    background: var(--warm);
    font-size: .62rem;
}

.chat-unavailable strong {
    color: var(--ink);
}

.message-composer {
    grid-template-columns: 1fr auto;
    align-items: center;
}

.message-composer textarea {
    min-height: 2.6rem;
    padding: .72rem .8rem;
    font-size: .7rem;
    line-height: 1.4;
}

.message-composer button {
    width: 2.6rem;
    height: 2.6rem;
}

.message-composer button svg {
    width: 1.1rem;
    height: 1.1rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.message-composer button:disabled {
    cursor: wait;
    opacity: .55;
}

.message-feedback {
    margin: 0;
    padding: 0 1rem .55rem;
    color: var(--muted);
    font-size: .58rem;
    text-align: right;
}

.message-feedback.is-error {
    color: var(--danger);
}

html[data-theme="dark"] .conversation-sidebar,
html[data-theme="dark"] .conversation-sidebar>header,
html[data-theme="dark"] .chat-area,
html[data-theme="dark"] .chat-quick-link {
    background: #142927;
}

html[data-theme="dark"] .chat-unavailable {
    background: #1b3532;
}

html[data-theme="dark"] .message-special p {
    color: var(--muted);
}

@media (max-width:900px) {
    .messages-shell {
        height: calc(100vh - 9rem);
        min-height: 34rem;
    }

    .conversation-sidebar,
    .chat-area {
        height: 100%;
    }

    .chat-quick-link span {
        display: none;
    }

    .chat-quick-link {
        width: 2.2rem;
        height: 2.2rem;
        padding: 0;
        justify-content: center;
    }
}

/* Expanded messaging workspace, attachments and voice notes */
.app-body .dashboard-shell:has(.messages-shell) {
    width: calc(100% - 1.5rem);
    max-width: none;
    padding: .75rem 0;
}

.messages-intro {
    display: none;
}

.messages-intro .eyebrow,
.messages-intro p {
    display: none;
}

.messages-intro h1 {
    font-size: clamp(1.35rem, 2vw, 1.8rem);
    letter-spacing: -.045em;
}

.messages-shell {
    position: relative;
    height: calc(100dvh - 7.5rem);
    min-height: 18rem;
}

.chat-quick-link[type="button"] {
    font-family: inherit;
    cursor: pointer;
}

.message.received {
    border: 1px solid rgba(18, 63, 60, .07);
}

.message.sent {
    box-shadow: 0 .3rem 1rem rgba(29, 111, 105, .16);
}

.message.message-special {
    width: min(78%, 25rem);
    padding: .5rem;
}

.message.message-special time {
    padding: 0 .25rem .05rem;
}

.message.message-deleted-document,
.message.sent.message-deleted-document {
    width: min(100%, 18rem);
    padding: .4rem;
    border: 1px dashed var(--line);
    color: var(--text);
    background: #fbfdfc;
    box-shadow: none;
}

.deleted-document-notice {
    display: flex;
    align-items: center;
    gap: .58rem;
    padding: .22rem .3rem;
}

.deleted-document-notice > span:first-child {
    display: grid;
    width: 2rem;
    height: 2rem;
    flex: 0 0 2rem;
    place-items: center;
    border-radius: .55rem;
    color: var(--muted);
    background: rgba(122, 143, 140, .12);
}

.deleted-document-notice svg {
    width: 1rem;
    height: 1rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.deleted-document-notice > span:last-child {
    display: grid;
    min-width: 0;
    gap: .06rem;
}

.deleted-document-notice strong {
    color: var(--ink);
    font-size: .61rem;
}

.deleted-document-notice small {
    color: var(--muted);
    font-size: .49rem;
    line-height: 1.35;
}

.chat-document-actions {
    display: flex;
    align-items: center;
    gap: .32rem;
}

.chat-document-actions > a,
.chat-document-actions > button {
    display: grid;
    width: 2rem;
    height: 2rem;
    padding: 0;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: .55rem;
    color: var(--primary);
    background: var(--mint-soft);
    cursor: pointer;
}

.chat-document-actions > button {
    color: var(--coral);
    background: rgba(248, 118, 121, .1);
}

.chat-document-actions > a:hover,
.chat-document-actions > button:hover {
    border-color: currentColor;
    transform: translateY(-1px);
}

.chat-document-actions svg {
    width: .9rem;
    height: .9rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.document-delete-note {
    display: block;
    margin-top: .45rem;
    color: var(--muted);
    font-size: .52rem;
    line-height: 1.45;
}

.document-delete-icon {
    color: var(--coral);
    background: rgba(248, 118, 121, .12);
}

.button-danger {
    border: 1px solid transparent;
    color: #fff;
    background: var(--coral);
}

.button-danger:hover {
    color: #fff;
    background: #df6568;
}

html[data-theme="dark"] .message.message-deleted-document {
    background: #142927;
}

html[data-theme="dark"] .chat-document-actions > a {
    background: #1d403c;
}

html[data-theme="dark"] .chat-document-actions > button {
    background: rgba(248, 118, 121, .14);
}

.message-document {
    display: grid;
    min-width: 14rem;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: .65rem;
    align-items: center;
    padding: .45rem;
    border-radius: .62rem;
    color: var(--ink);
    background: rgba(255, 255, 255, .88);
    text-decoration: none;
}

.message.sent .message-document {
    background: rgba(255, 255, 255, .94);
}

.message-document>span:nth-child(2) {
    min-width: 0;
}

.message-document strong,
.message-document small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.message-document strong {
    font-size: .66rem;
}

.message-document small {
    margin-top: .12rem;
    color: var(--muted);
    font-size: .5rem;
    font-weight: 650;
    text-transform: uppercase;
}

.document-type-icon {
    display: grid;
    width: 2.35rem;
    height: 2.35rem;
    flex: 0 0 auto;
    place-items: center;
    border-radius: .55rem;
    color: var(--primary);
    background: var(--mint-soft);
}

.document-type-icon.pdf {
    color: #b74e53;
    background: #fde9e9;
}

.document-type-icon.word {
    color: #3d6ca8;
    background: #e7f0fb;
}

.document-type-icon.image {
    color: #9a642a;
    background: #faedda;
}

.document-type-icon svg,
.document-download,
.chat-document-item>a svg {
    width: 1.15rem;
    height: 1.15rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.document-download {
    color: var(--primary);
}

.voice-player {
    --voice-progress: 0%;
    display: grid;
    min-width: 15rem;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: .65rem;
    align-items: center;
    padding: .32rem;
}

.voice-play {
    display: grid;
    width: 2.35rem;
    height: 2.35rem;
    place-items: center;
    border: 0;
    border-radius: 50%;
    color: #fff;
    background: var(--primary);
    cursor: pointer;
}

.message.sent .voice-play {
    color: var(--primary);
    background: #fff;
}

.voice-play span {
    font-size: .66rem;
    line-height: 1;
}

.voice-track {
    display: grid;
    min-width: 0;
    gap: .18rem;
}

.voice-track>span {
    color: var(--muted);
    font-size: .47rem;
}

.message.sent .voice-track>span {
    color: rgba(255, 255, 255, .72);
}

.voice-waveform {
    position: relative;
    display: flex;
    height: 1.35rem;
    align-items: center;
    gap: 2px;
    overflow: hidden;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
}

.voice-waveform::after {
    position: absolute;
    inset: 0 auto 0 0;
    width: var(--voice-progress);
    background: rgba(255, 255, 255, .2);
    content: "";
    pointer-events: none;
}

.voice-waveform i {
    width: 2px;
    min-height: 3px;
    border-radius: 2px;
    background: currentColor;
    opacity: .58;
}

.voice-speed {
    padding: .25rem .35rem;
    border: 1px solid currentColor;
    border-radius: 2rem;
    color: inherit;
    background: transparent;
    font-size: .5rem;
    font-weight: 800;
    cursor: pointer;
}

.chat-documents-overlay {
    position: absolute;
    z-index: 5;
    inset: 0;
    border: 0;
    background: rgba(11, 37, 35, .22);
    cursor: pointer;
}

.chat-documents {
    position: absolute;
    z-index: 6;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    width: min(25rem, 92%);
    overflow-y: auto;
    flex-direction: column;
    padding: 1rem;
    border-left: 1px solid var(--line);
    background: var(--white);
    box-shadow: -1rem 0 2.5rem rgba(18, 63, 60, .12);
    transform: translateX(105%);
    transition: transform .22s ease;
}

.chat-documents.is-open {
    transform: translateX(0);
}

.chat-documents>header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: .8rem;
    border-bottom: 1px solid var(--line);
}

.chat-documents h2 {
    margin: .12rem 0 0;
    color: var(--ink);
    font-size: .9rem;
}

.chat-documents .drawer-close {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 50%;
    color: var(--ink);
    background: var(--white);
    font-size: 1.1rem;
    cursor: pointer;
}

.chat-documents-intro {
    margin: .8rem 0;
    color: var(--muted);
    font-size: .62rem;
    line-height: 1.55;
}

.chat-documents-list {
    display: grid;
    gap: .55rem;
}

.chat-document-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: .65rem;
    align-items: center;
    padding: .65rem;
    border: 1px solid var(--line);
    border-radius: .72rem;
    background: #fbfdfc;
}

.chat-document-item>div {
    min-width: 0;
}

.chat-document-item strong,
.chat-document-item span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.chat-document-item strong {
    color: var(--ink);
    font-size: .65rem;
}

.chat-document-item span {
    margin-top: .15rem;
    color: var(--muted);
    font-size: .52rem;
}

.chat-document-item>a {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: .5rem;
    color: var(--primary);
    background: var(--mint-soft);
}

.chat-documents-state {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    padding: 1rem .4rem;
    color: var(--muted);
    font-size: .58rem;
    text-align: center;
}

.chat-documents-sentinel {
    height: 1px;
}

html[data-theme="dark"] .message-document,
html[data-theme="dark"] .chat-document-item {
    color: var(--ink);
    background: #102522;
}

html[data-theme="dark"] .chat-documents,
html[data-theme="dark"] .chat-documents .drawer-close {
    background: #142927;
}

html[data-theme="dark"] .message.received {
    border-color: var(--line);
}

@media (max-width:900px) {
    .app-body .dashboard-shell:has(.messages-shell) {
        width: calc(100% - 1rem);
        padding: .5rem 0;
    }

    .messages-shell {
        height: calc(100dvh - 9rem);
        min-height: 18rem;
    }

    .message.message-special {
        max-width: min(90%, 21rem);
    }
}

/* Compact cards, drawers and conversation content */
.section-heading {
    min-height: 68px;
    padding: .75rem 1rem;
}

.section-heading h2,
.profile-card h2,
.booking-panel>header h2,
.invoices-card h2 {
    margin: 0;
    line-height: 1.2;
}

.section-heading p,
.profile-card header p,
.booking-panel>header p,
.invoices-card header p {
    margin: .08rem 0 0;
    line-height: 1.35;
}

.booking-panel>header {
    margin-bottom: .85rem;
}

.message {
    width: fit-content;
    max-width: min(72%, 30rem);
    padding: .52rem .68rem .34rem;
}

.message p {
    line-height: 1.48;
}

.message.message-special {
    width: auto;
    max-width: min(72%, 21rem);
    padding: .38rem;
}

.message.message-special time {
    padding: 0 .2rem .03rem;
}

.message-document {
    width: min(18rem, 100%);
    min-width: 0;
    gap: .5rem;
    padding: .36rem;
}

.document-type-icon {
    width: 2rem;
    height: 2rem;
}

.voice-player {
    width: clamp(12rem, 20vw, 18rem);
    min-width: 0;
    gap: .45rem;
    padding: .22rem;
}

.voice-play {
    width: 2rem;
    height: 2rem;
}

.voice-waveform {
    height: 1.15rem;
}

.shell-panel>header {
    padding: 1rem;
}

.shell-panel h2 {
    font-size: .95rem;
}

.shell-panel header span:not(.panel-heading-icon) {
    font-size: .56rem;
}

.activity-timeline strong {
    font-size: .7rem;
}

.activity-timeline p {
    font-size: .62rem;
    line-height: 1.5;
}

.activity-timeline time,
.update-list time {
    font-size: .54rem;
}

.update-list h3 {
    margin: .2rem 0;
    font-size: .68rem;
}

.update-list p {
    font-size: .58rem;
    line-height: 1.5;
}

.drawer-practitioner h2 {
    font-size: .84rem;
}

.drawer-practitioner p {
    font-size: .58rem;
}

.drawer-stats small {
    font-size: .52rem;
}

.drawer-stats strong {
    font-size: .63rem;
}

.psy-drawer-content h3 {
    margin-bottom: .4rem;
    font-size: .7rem;
}

.psy-drawer-content p {
    font-size: .63rem;
    line-height: 1.6;
}

.drawer-tags span {
    font-size: .55rem;
}

.drawer-feedback {
    padding: .8rem .85rem;
}

.drawer-feedback header {
    padding-bottom: .45rem;
}

.drawer-feedback strong {
    font-size: .63rem;
}

.drawer-feedback time {
    font-size: .54rem;
}

.drawer-feedback p {
    margin: .5rem 0 0;
    font-size: .64rem;
    line-height: 1.6;
}

.appointment-preview-drawer header h2 {
    font-size: .82rem;
}

.appointment-drawer-practitioner h3 {
    font-size: .76rem;
}

.appointment-drawer-practitioner small,
.appointment-drawer-practitioner p {
    font-size: .55rem;
}

.appointment-drawer-facts small {
    font-size: .52rem;
}

.appointment-drawer-facts strong {
    font-size: .64rem;
}

.appointment-drawer-status span {
    font-size: .56rem;
}

.appointment-drawer-status p {
    font-size: .61rem;
    line-height: 1.5;
}

.chat-documents {
    padding: .85rem;
}

.chat-documents h2 {
    font-size: .78rem;
}

.chat-documents-intro {
    margin: .6rem 0;
    font-size: .56rem;
}

.chat-document-item {
    gap: .5rem;
    padding: .5rem;
}

.chat-document-item strong {
    font-size: .59rem;
}

.chat-document-item span {
    font-size: .48rem;
}

@media (max-width:900px) {
    .message {
        max-width: 88%;
    }

    .message.message-special {
        max-width: min(88%, 21rem);
    }
}

/* Interaction states, consistent heading rhythm and media-focused appointments */
.message.received .voice-waveform {
    color: var(--primary);
    background: rgba(35, 117, 113, .08);
}

.message.sent .voice-waveform {
    color: #fff;
    background: rgba(255, 255, 255, .14);
}

.voice-waveform {
    padding: .16rem .24rem;
    border-radius: .4rem;
}

.voice-waveform i {
    opacity: .88;
    box-shadow: 0 0 0 1px currentColor;
}

.message.received .voice-waveform::after {
    background: rgba(35, 117, 113, .16);
}

.message.sent .voice-waveform::after {
    background: rgba(255, 255, 255, .18);
}

.message.received .voice-speed {
    color: var(--primary);
}

.message.sent .voice-speed {
    color: #fff;
}

.voice-waveform:hover {
    box-shadow: none !important;
    transform: none !important;
    filter: brightness(1.08);
}

button,
.button,
[role="button"] {
    transition: color .18s ease, background-color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease, filter .18s ease;
}

button:not(:disabled):hover,
.button:not(:disabled):hover,
[role="button"]:hover {
    filter: saturate(1.06);
}

button:not(:disabled):not(.conversation-item):hover,
.button:not(:disabled):hover {
    box-shadow: 0 .35rem 1rem rgba(18, 63, 60, .13);
    transform: translateY(-1px);
}

.psy-drawer-tabs button:hover,
.psy-profile-tabs button:hover,
.appointments-tabs button:hover,
.booking-progress button:hover {
    color: var(--primary);
    background: var(--mint-soft);
    box-shadow: none;
    transform: none;
}

.page-intro p {
    margin-top: .35rem;
}

.section-heading h2+p,
.profile-card header h2+p,
.booking-panel>header h2+p,
.invoices-card header h2+p,
.support-card-heading h2+p,
.directory-filters header h2+p,
.results-heading strong+p,
.chat-header h2+p,
.drawer-practitioner h2+p,
.appointment-drawer-practitioner h3+p,
.group-appointment-card header h2+p,
.vonage-settings-dialog header h2+p,
.psy-profile-section-heading h2+p {
    margin-top: .1rem !important;
}

.auth-heading h2+p,
.page-intro h1+p,
.profile-summary h2+p,
.support-card>h2+p,
.emergency-group header h2+p,
.partner-content h2+p,
.session-instructions h2+p,
.psy-profile-heading h1+p,
.booking-practitioner h1+p,
.booking-info-card header h2+p,
.chat-welcome h2+p,
.dashboard-empty h3+p,
.invoices-empty h2+p,
.booking-empty h3+p {
    margin-top: .12rem !important;
}

.shell-panel h2 {
    margin-top: .08rem;
}

.support-card-heading h2 {
    margin-bottom: 0;
}

.psy-drawer-content h3 {
    margin-bottom: .3rem;
}

.appointment-drawer-practitioner h3 {
    margin-block: .06rem;
}

.appointment-drawer-status p {
    margin-top: .5rem;
}

.psy-profile-hero {
    grid-template-columns: minmax(11rem, 15rem) minmax(0, 1fr);
}

.psy-profile-photo {
    min-height: 16.5rem;
    max-height: 18rem;
}

.psy-profile-photo img {
    object-position: center top;
}

.psy-profile-heading {
    padding: clamp(1.25rem, 3vw, 2.1rem);
}

.psy-profile-heading h1 {
    font-size: clamp(1.75rem, 3vw, 2.65rem);
}

.appointment-detail-layout {
    grid-template-columns: minmax(0, 1fr) minmax(15rem, 18rem);
    align-items: start;
}

.appointment-session-card {
    min-height: 0;
    padding: 1rem;
}

.appointment-facts-card {
    position: sticky;
    top: 1rem;
}

.session-practitioner {
    padding-bottom: .8rem;
}

.session-instructions {
    align-items: center;
    padding: .85rem 0;
}

.session-instructions h2 {
    line-height: 1.2;
}

.session-instructions p {
    margin-top: .12rem;
}

.appointment-workspace {
    min-height: 25rem;
    margin-bottom: .8rem;
    padding: .75rem;
}

.workspace-chat {
    min-height: 23.5rem;
    align-content: stretch;
    grid-template-rows: auto 1fr auto;
    padding: 1rem;
}

.workspace-chat p {
    align-self: end;
    margin-bottom: .4rem;
}

.workspace-chat>div {
    min-height: 3rem;
    align-items: center;
}

.workspace-phone {
    min-height: 23.5rem;
}

.workspace-phone>.media-picto {
    width: 4.25rem;
    height: 4.25rem;
    padding: .9rem;
    border-radius: 50%;
    color: #fff;
    background: var(--primary);
}

.appointment-phone-number {
    font-size: 1.35rem;
}

.phone-number-preview {
    position: relative;
    margin: -4.4rem 1rem 0;
}

.vonage-stage {
    min-height: clamp(24rem, 48vw, 42rem);
}

.vonage-feedback,
.vonage-settings-feedback {
    margin: 0;
    padding: .62rem .75rem;
    color: #d9eeeb;
    background: #153532;
    font-size: .58rem;
    line-height: 1.45;
    text-align: center;
}

.vonage-feedback[hidden],
.vonage-settings-feedback[hidden] {
    display: none;
}

.vonage-feedback.is-error,
.vonage-settings-feedback.is-error {
    color: #8c342f;
    background: #fde8e5;
}

.vonage-feedback.is-success {
    color: #d7f5e8;
    background: #194c3e;
}

.vonage-settings-feedback {
    border-radius: .6rem;
    color: var(--text);
    background: var(--mint-soft);
    text-align: left;
}

@media (max-width:850px) {
    .psy-profile-hero {
        grid-template-columns: 1fr;
    }

    .psy-profile-photo {
        width: min(100%, 22rem);
        min-height: 0;
        max-height: none;
        aspect-ratio: 4/3;
    }

    .appointment-facts-card {
        position: static;
    }
}

@media (max-width:620px) {

    .appointment-workspace,
    .workspace-chat,
    .workspace-phone {
        min-height: 19rem;
    }

    .phone-number-preview {
        margin: -3.7rem .65rem 0;
    }
}

/* Immersive Webcam and chat appointment rooms */
.patient-app-main:has(.appointment-detail-layout.media-video)>.app-topbar,
.patient-app-main:has(.appointment-detail-layout.media-chat)>.app-topbar {
    display: none;
}

.app-body .dashboard-shell:has(.appointment-detail-layout.media-video),
.app-body .dashboard-shell:has(.appointment-detail-layout.media-chat) {
    width: calc(100% - 1.5rem);
    max-width: none;
    padding: .75rem 0 1rem;
}

.appointment-detail-layout.media-video,
.appointment-detail-layout.media-chat {
    display: block;
    margin-top: 0;
}

.appointment-session-card.media-video,
.appointment-session-card.media-chat {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.appointment-session-card.media-video>.session-practitioner,
.appointment-session-card.media-video>.session-instructions,
.appointment-session-card.media-chat>.session-practitioner,
.appointment-session-card.media-chat>.session-instructions {
    display: none;
}

.appointment-detail-layout.media-video .vonage-shell {
    border-radius: 1rem;
    box-shadow: 0 .8rem 2.4rem rgba(7, 28, 27, .14);
}

.appointment-detail-layout.media-video .vonage-stage {
    height: clamp(34rem, calc(100dvh - 9.5rem), 58rem);
    min-height: 0;
}

.appointment-detail-layout.media-chat .appointment-workspace {
    height: clamp(36rem, calc(100dvh - 6.5rem), 60rem);
    min-height: 0;
    margin: 0;
    padding: .8rem;
    grid-template-rows: minmax(0, 1fr) auto;
}

.appointment-detail-layout.media-chat .workspace-chat {
    min-height: 0;
}

.appointment-detail-layout.media-chat .session-checklist {
    margin: 0;
}

.appointment-detail-layout.media-video .appointment-facts-card,
.appointment-detail-layout.media-chat .appointment-facts-card {
    position: static;
    margin-top: 1rem;
}

.appointment-detail-layout.media-video .appointment-facts-card dl,
.appointment-detail-layout.media-chat .appointment-facts-card dl {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: .65rem;
}

.appointment-detail-layout.media-video .appointment-facts-card dl>div,
.appointment-detail-layout.media-chat .appointment-facts-card dl>div {
    display: grid;
    align-content: start;
    gap: .18rem;
    padding: .65rem;
    border: 0;
    border-radius: .65rem;
    background: var(--mint-soft);
}

.appointment-detail-layout.media-video .appointment-facts-card dd,
.appointment-detail-layout.media-chat .appointment-facts-card dd {
    text-align: left;
}

@media (max-width:900px) {

    .appointment-detail-layout.media-video .appointment-facts-card dl,
    .appointment-detail-layout.media-chat .appointment-facts-card dl {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width:620px) {

    .app-body .dashboard-shell:has(.appointment-detail-layout.media-video),
    .app-body .dashboard-shell:has(.appointment-detail-layout.media-chat) {
        width: calc(100% - .75rem);
        padding: .5rem 0;
    }

    .appointment-detail-layout.media-video .vonage-stage {
        height: calc(100dvh - 9rem);
        min-height: 28rem;
    }

    .appointment-detail-layout.media-chat .appointment-workspace {
        height: calc(100dvh - 6rem);
        min-height: 30rem;
    }

    .appointment-detail-layout.media-video .appointment-facts-card dl,
    .appointment-detail-layout.media-chat .appointment-facts-card dl {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Keep consultation and appointment information as two distinct columns */
.appointment-detail-layout.media-video,
.appointment-detail-layout.media-chat {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(14rem, 17rem);
    gap: 1rem;
}

.appointment-detail-layout.media-video .appointment-facts-card,
.appointment-detail-layout.media-chat .appointment-facts-card {
    position: sticky;
    top: 1rem;
    margin-top: 0;
}

.appointment-detail-layout.media-video .appointment-facts-card dl,
.appointment-detail-layout.media-chat .appointment-facts-card dl {
    display: block;
}

.appointment-detail-layout.media-video .appointment-facts-card dl>div,
.appointment-detail-layout.media-chat .appointment-facts-card dl>div {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .7rem;
    padding: .65rem 0;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
    background: transparent;
}

.appointment-detail-layout.media-video .appointment-facts-card dd,
.appointment-detail-layout.media-chat .appointment-facts-card dd {
    text-align: right;
}

@media (max-width:850px) {

    .appointment-detail-layout.media-video,
    .appointment-detail-layout.media-chat {
        grid-template-columns: 1fr;
    }

    .appointment-detail-layout.media-video .appointment-facts-card,
    .appointment-detail-layout.media-chat .appointment-facts-card {
        position: static;
    }
}

.appointment-facts-practitioner {
    display: flex;
    align-items: center;
    gap: .7rem;
    margin: -.15rem 0 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--line);
}

.appointment-facts-practitioner .detail-avatar {
    width: 2.8rem;
    height: 2.8rem;
    flex-basis: 2.8rem;
    overflow: hidden;
}

.appointment-facts-practitioner .detail-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.appointment-facts-practitioner>div {
    min-width: 0;
}

.appointment-facts-practitioner span:not(.detail-avatar) {
    color: var(--muted);
    font-size: .55rem;
}

.appointment-facts-practitioner h2 {
    overflow: hidden;
    margin: .08rem 0 0;
    color: var(--ink);
    font-size: .78rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.appointment-facts-practitioner h2 a {
    color: inherit;
}

/* System messages and document drawer alignment */
.message.message-system {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: .4rem;
    align-self: center;
    align-items: center;
    width: fit-content;
    max-width: min(88%, 24rem);
    padding: .3rem .42rem;
    border: 1px solid rgba(35, 117, 113, .13);
    border-radius: .58rem;
    color: var(--text);
    background: rgba(233, 245, 243, .72);
    box-shadow: none;
}

.message-system-content {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: .35rem;
    align-items: center;
}

.message-system-content>span {
    display: grid;
    width: 1.3rem;
    height: 1.3rem;
    place-items: center;
    border-radius: .38rem;
    color: var(--primary);
    background: rgba(255, 255, 255, .7);
}

.message-system-content svg {
    width: .68rem;
    height: .68rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.message.message-system p {
    color: var(--text);
    font-size: .54rem;
    font-style: normal;
    line-height: 1.35;
}

.message.message-system time {
    margin: 0;
    padding: 0;
    color: var(--muted);
    font-size: .43rem;
    white-space: nowrap;
}

.message.message-system-documents {
    width: auto;
    max-width: min(88%, 24rem);
}

.message.message-system-documents .message-system-content {
    align-items: center;
}

.message.message-system-documents p {
    font-weight: 650;
}

html[data-theme="dark"] .message.message-system {
    border-color: var(--line);
    background: #1b3532;
}

html[data-theme="dark"] .message-system-content>span {
    background: #102522;
}

.chat-document-item>.document-type-icon {
    display: grid;
    align-self: center;
    margin: 0;
    place-items: center;
    overflow: visible;
    line-height: 0;
    white-space: normal;
}

.chat-document-item>.document-type-icon svg {
    display: block;
}

/* Rich text in regular messages: safe lists, emphasis and clickable links */
.message-body {
    color: inherit;
    font-size: .7rem;
    line-height: 1.5;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

.message-body.has-html {
    white-space: normal;
}

.message-body p {
    margin: 0 0 .42rem;
    color: inherit;
    font: inherit;
}

.message-body p:last-child {
    margin-bottom: 0;
}

.message-body ul,
.message-body ol {
    margin: .25rem 0 .35rem;
    padding-left: 1.15rem;
}

.message-body li {
    margin: .12rem 0;
}

.message-body blockquote {
    margin: .35rem 0;
    padding-left: .65rem;
    border-left: 2px solid currentColor;
    opacity: .85;
}

.message-body a {
    color: var(--primary);
    font-weight: 750;
    text-decoration: underline;
    text-underline-offset: .14em;
}

.message.sent .message-body a {
    color: #fff;
}

/* Compact title/subtitle rhythm, including side drawers */
.shell-panel>header>div>div {
    display: grid;
    align-content: center;
    gap: 0;
}

.shell-panel header span:not(.panel-heading-icon) {
    line-height: 1.1;
}

.shell-panel h2 {
    margin: 0;
    line-height: 1.12;
}

.section-heading h2,
.profile-card header h2,
.booking-panel>header h2,
.invoices-card header h2,
.support-card-heading h2,
.directory-filters header h2,
.chat-header h2,
.drawer-practitioner h2,
.appointment-drawer-practitioner h3,
.group-appointment-card header h2,
.vonage-settings-dialog header h2,
.psy-profile-section-heading h2 {
    line-height: 1.18;
}

.section-heading h2+p,
.profile-card header h2+p,
.booking-panel>header h2+p,
.invoices-card header h2+p,
.support-card-heading h2+p,
.directory-filters header h2+p,
.chat-header h2+p,
.drawer-practitioner h2+p,
.appointment-drawer-practitioner h3+p,
.group-appointment-card header h2+p,
.vonage-settings-dialog header h2+p,
.psy-profile-section-heading h2+p {
    margin-top: .02rem !important;
    line-height: 1.25;
}

.activity-timeline article.activity-created .activity-marker {
    background: var(--primary);
}

.activity-timeline article.activity-cancelled .activity-marker {
    border-color: var(--danger-soft);
    background: var(--danger);
}

.activity-timeline article.activity-completed .activity-marker {
    border-color: var(--success-soft);
    background: var(--success);
}

.checkbox-field a {
    color: var(--primary);
    font-weight: 800;
}

/* Compact page headings and drawer empty states */
.app-body .dashboard-shell { padding-top:1.35rem; padding-bottom:2rem; }
.page-intro { align-items:center; gap:1rem; margin-bottom:1rem; }
.page-intro h1 { font-size:clamp(1.55rem,3vw,2.25rem); line-height:1.05; letter-spacing:-.045em; }
.page-intro .eyebrow { font-size:.58rem; line-height:1.15; }
.page-intro h1 + p { max-width:38rem; margin-top:.16rem!important; font-size:.7rem; line-height:1.4; }
.page-intro-actions { flex-wrap:wrap; justify-content:flex-end; }
.page-intro-actions .button { min-height:2.35rem; padding:.58rem .78rem; }
.panel-empty { padding:1.75rem .8rem; font-size:.62rem; line-height:1.45; }

/* Live psychologist typing information */
.conversation-copy small.conversation-typing,
.chat-identity p.is-typing { color:var(--primary); font-weight:800; }
.conversation-copy small.conversation-typing::after,
.chat-identity p.is-typing::after { display:inline-block; width:1em; overflow:hidden; vertical-align:bottom; animation:typing-dots 1.1s steps(4,end) infinite; content:'...'; }
@keyframes typing-dots { from { width:0; } to { width:1em; } }

/* Compact psychologist profile hero */
.psy-profile-hero { grid-template-columns:minmax(9.5rem,12.5rem) minmax(0,1fr); gap:1rem; padding:.85rem; border-radius:1rem; background:linear-gradient(120deg,var(--white) 58%,var(--mint-soft)); }
.psy-profile-photo { min-height:13rem; max-height:14.5rem; border-radius:.85rem; aspect-ratio:4/5; box-shadow:0 .45rem 1.4rem rgba(18,63,60,.1); }
.psy-profile-heading { padding:.45rem 1rem .45rem .15rem; }
.psy-profile-heading h1 { margin:.18rem 0 .05rem; font-size:clamp(1.55rem,2.7vw,2.25rem); }
.psy-profile-heading > p { font-size:.7rem; }
.psy-profile-facts { gap:.45rem; margin:.8rem 0 .6rem; }
.psy-profile-facts > span { padding:.55rem .65rem; border:1px solid var(--line); }
.psy-profile-medias { margin-bottom:.7rem; }
.psy-profile-heading > .button { min-height:2.4rem; padding:.6rem .85rem; }

/* Complete dark surfaces and readable navigation */
html[data-theme="dark"] { --primary:#469b94; --primary-hover:#59ada6; --ink:#f2faf9; --ink-deep:#fff; --text:#c6d9d6; --muted:#94aaa6; --line:rgba(226,244,241,.13); }
html[data-theme="dark"] .sidebar-nav > a,
html[data-theme="dark"] .sidebar-support summary,
html[data-theme="dark"] .support-links a { color:var(--text); }
html[data-theme="dark"] .sidebar-nav > a:hover,
html[data-theme="dark"] .sidebar-support summary:hover,
html[data-theme="dark"] .support-links a:hover { color:var(--ink); background:#1b3936; }
html[data-theme="dark"] .sidebar-nav > a.is-active,
html[data-theme="dark"] .sidebar-support summary.is-active,
html[data-theme="dark"] .support-links a.is-active { color:#a4e7e1; background:#21433f; }
html[data-theme="dark"] .sidebar-label { color:#9bb3af; }
html[data-theme="dark"] .app-sidebar,
html[data-theme="dark"] .app-topbar,
html[data-theme="dark"] .shell-panel,
html[data-theme="dark"] .shell-panel > header,
html[data-theme="dark"] .dashboard-section,
html[data-theme="dark"] .dashboard-date,
html[data-theme="dark"] .top-directory-filters,
html[data-theme="dark"] .current-psy-card,
html[data-theme="dark"] .appointments-page-card,
html[data-theme="dark"] .appointment-summary article,
html[data-theme="dark"] .messages-shell,
html[data-theme="dark"] .conversation-sidebar,
html[data-theme="dark"] .conversation-sidebar > header,
html[data-theme="dark"] .chat-area,
html[data-theme="dark"] .chat-documents,
html[data-theme="dark"] .profile-card,
html[data-theme="dark"] .profile-summary,
html[data-theme="dark"] .invoices-card,
html[data-theme="dark"] .booking-header,
html[data-theme="dark"] .booking-wizard,
html[data-theme="dark"] .booking-info-card,
html[data-theme="dark"] .psy-profile-card,
html[data-theme="dark"] .psy-profile-tabs,
html[data-theme="dark"] .psy-preview-drawer,
html[data-theme="dark"] .appointment-preview-drawer,
html[data-theme="dark"] .group-appointment-card,
html[data-theme="dark"] .vonage-settings-dialog { color:var(--text); background:#142927; }
html[data-theme="dark"] .psy-profile-hero { background:linear-gradient(120deg,#142927 58%,#1b3936); }
html[data-theme="dark"] .psy-profile-photo { background:linear-gradient(145deg,#1d403c,#102522); }
html[data-theme="dark"] .advanced-filters,
html[data-theme="dark"] .advanced-filters > summary,
html[data-theme="dark"] .appointments-toolbar,
html[data-theme="dark"] .booking-progress,
html[data-theme="dark"] .booking-payment-card,
html[data-theme="dark"] .message-composer,
html[data-theme="dark"] .chat-quick-link,
html[data-theme="dark"] .more-button,
html[data-theme="dark"] .close-icon-button,
html[data-theme="dark"] .button-secondary,
html[data-theme="dark"] .sidebar-profile { color:var(--ink); background:#102522; }
html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select,
html[data-theme="dark"] .directory-main-search,
html[data-theme="dark"] .select2-selection { color:var(--ink)!important; background:#102522!important; }
html[data-theme="dark"] .button-primary,
html[data-theme="dark"] .chat-quick-link.primary,
html[data-theme="dark"] .send-message { color:#fff; background:#2b7f7a; }
html[data-theme="dark"] .appointment-row:hover,
html[data-theme="dark"] .appointments-table tbody tr:hover { background:#19322f; }
html[data-theme="dark"] .conversation-search,
html[data-theme="dark"] .conversation-item,
html[data-theme="dark"] .chat-document-item,
html[data-theme="dark"] .drawer-feedback,
html[data-theme="dark"] .psy-profile-feedbacks article { color:var(--text); background:#102522; }
html[data-theme="dark"] .conversation-search input {
    color: var(--ink) !important;
    background: transparent !important;
}
html[data-theme="dark"] .summary-icon.warm { color:#f0cc82; background:#3b301c; }
html[data-theme="dark"] .summary-icon.coral { color:#ffaaa6; background:#432727; }

@media (max-width:700px) {
    .page-intro { align-items:flex-start; flex-direction:column; }
    .page-intro-actions { width:100%; justify-content:flex-start; }
    .psy-profile-hero { grid-template-columns:1fr; }
    .psy-profile-photo { width:8rem; min-height:8rem; max-height:8rem; margin:0 auto; aspect-ratio:1; }
    .psy-profile-heading { align-items:center; padding:.3rem .45rem .55rem; text-align:center; }
    .psy-profile-facts { width:100%; }
}

/* Messaging actions, professional registration and completed appointments */
.psy-profile-facts { grid-template-columns:repeat(4,minmax(0,1fr)); }
.psy-profile-actions { display:flex; flex-wrap:wrap; gap:.55rem; }
.psy-profile-actions .button { min-height:2.4rem; padding:.6rem .85rem; }
.drawer-registration { display:flex; align-items:center; gap:.65rem; margin:.55rem 0 1rem; padding:.68rem .75rem; border:1px solid var(--line); border-radius:.72rem; color:var(--muted); background:var(--surface); }
.drawer-registration > div { display:grid; min-width:0; gap:.08rem; }
.drawer-registration > div > span { font-size:.5rem; font-weight:750; text-transform:uppercase; letter-spacing:.08em; }
.drawer-registration strong { overflow:hidden; color:var(--ink); font-size:.64rem; font-weight:750; letter-spacing:.045em; text-overflow:ellipsis; }
.registration-icon { display:grid; width:2rem; height:2rem; flex:0 0 2rem; place-items:center; border-radius:.58rem; color:var(--primary); background:var(--mint-soft); }
.registration-icon .media-picto { width:1rem; height:1rem; }
.psy-profile-rpps small { display:flex; align-items:center; gap:.28rem; }
.psy-profile-rpps small .media-picto { width:.72rem; height:.72rem; color:var(--primary); }
.psy-profile-rpps strong { letter-spacing:.045em; }
.psy-preview-drawer .drawer-actions { grid-template-columns:1fr 1fr; }
.psy-preview-drawer .drawer-actions .button-primary { grid-column:1/-1; }

.appointment-drawer-summary { margin-bottom:.8rem; padding:.85rem; border:1px solid var(--line); border-radius:.8rem; background:var(--mint-soft); }
.appointment-drawer-summary { display:grid; justify-items:start; gap:.38rem; }
.appointment-drawer-summary p { margin:0; color:var(--text); font-size:.64rem; line-height:1.45; }
.appointment-drawer-status { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.8rem 0 0; }
.appointment-preview-drawer[data-state="past"] .appointment-drawer-summary { background:var(--surface-soft,#f3f6f5); }
.appointment-preview-drawer[data-state="cancelled"] .appointment-drawer-summary { background:var(--danger-soft); }

.appointment-completed-card { display:grid; width:min(100%,58rem); justify-items:center; gap:1.15rem; margin:clamp(1.25rem,4vh,3rem) auto 0; padding:clamp(1.5rem,3vw,2.4rem); border:1px solid var(--line); border-radius:1.2rem; background:var(--white); box-shadow:0 .8rem 2.6rem rgba(18,63,60,.08); text-align:center; }
.appointment-completed-icon { display:grid; width:3.6rem; height:3.6rem; place-items:center; border-radius:50%; color:var(--success); background:var(--success-soft); font-size:1.45rem; font-weight:900; }
.appointment-completed-copy h1 { margin:.2rem 0 .3rem; color:var(--ink); font-size:clamp(1.45rem,3vw,2.1rem); letter-spacing:-.04em; }
.appointment-completed-copy p { max-width:35rem; margin:0; color:var(--text); font-size:.74rem; line-height:1.55; }
.appointment-completed-practitioner { display:flex; align-items:center; gap:.7rem; padding:.65rem .85rem; border-radius:.8rem; background:var(--mint-soft); text-align:left; }
.appointment-completed-practitioner .detail-avatar { width:2.7rem; height:2.7rem; }
.appointment-completed-practitioner div { display:grid; gap:.05rem; }
.appointment-completed-practitioner small { color:var(--muted); font-size:.56rem; }
.appointment-completed-practitioner strong { color:var(--ink); font-size:.72rem; }
.appointment-completed-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:.6rem; }
.appointment-completed-details { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); width:100%; margin:0; padding:1rem; gap:.9rem; border:1px solid var(--line); border-radius:.9rem; background:var(--surface); text-align:left; }
.appointment-completed-details div { display:grid; gap:.12rem; }
.appointment-completed-details dt { color:var(--muted); font-size:.54rem; }
.appointment-completed-details dd { margin:0; color:var(--ink); font-size:.68rem; font-weight:700; }

.first-message-dialog { width:min(calc(100% - 2rem),34rem); padding:0; border:0; border-radius:1.1rem; color:var(--text); background:transparent; box-shadow:0 1.5rem 5rem rgba(10,42,40,.24); }
.first-message-dialog::backdrop { background:rgba(8,29,28,.55); backdrop-filter:blur(3px); }
.first-message-card { display:grid; gap:1rem; padding:1.25rem; background:var(--white); }
.first-message-card header { display:flex; align-items:center; gap:.75rem; }
.first-message-card header > div { display:grid; flex:1; gap:.08rem; }
.first-message-card h2 { margin:0; color:var(--ink); font-size:1rem; }
.first-message-card > p { margin:0; color:var(--muted); font-size:.66rem; line-height:1.55; }
.first-message-card label { display:grid; gap:.4rem; color:var(--ink); font-size:.62rem; font-weight:700; }
.first-message-card textarea { min-height:8.5rem; resize:vertical; padding:.8rem; border:1px solid var(--line); border-radius:.75rem; color:var(--text); background:var(--surface); font:inherit; font-weight:400; line-height:1.55; }
.first-message-card footer { display:flex; justify-content:flex-end; gap:.55rem; }
.modal-pictogram { display:grid; width:2.5rem; height:2.5rem; place-items:center; border-radius:.75rem; color:var(--primary); background:var(--mint-soft); }
.modal-pictogram svg { width:1.15rem; height:1.15rem; }

.message-composer { grid-template-columns:auto minmax(0,1fr) auto; align-items:center; padding:.65rem .8rem; }
.message-composer:has(.message-composer-tools[hidden]) { grid-template-columns:minmax(0,1fr) auto; }
.message-composer-tools { display:flex; align-items:center; gap:.25rem; }
.message-tool { display:grid; flex:0 0 auto; width:2.45rem!important; height:2.45rem!important; place-items:center; padding:0; border:0; border-radius:.7rem; color:var(--primary); background:transparent; cursor:pointer; transition:background .18s ease,color .18s ease,transform .18s ease; }
.message-tool:hover { color:var(--white); background:var(--primary); transform:translateY(-1px); }
.message-tool.is-recording { color:#fff; background:var(--danger); animation:voice-record-pulse 1.2s ease-in-out infinite; }
.message-tool input { position:absolute; width:1px; height:1px; overflow:hidden; opacity:0; }
.message-tool svg { width:1.05rem; height:1.05rem; }
.message-composer [hidden], .message-composer-tools [hidden] { display:none!important; }
.message-composer textarea { width:100%; box-sizing:border-box; }
.voice-recording-panel { display:grid; grid-template-columns:auto auto minmax(0,1fr) auto auto; align-items:center; gap:.55rem; margin:.45rem .8rem .7rem; padding:.55rem .65rem; border:1px solid var(--line); border-radius:.75rem; color:var(--text); background:var(--surface); }
.voice-recording-panel[hidden] { display:none!important; }
.voice-recording-panel [hidden] { display:none!important; }
.voice-recording-copy { display:grid; min-width:0; gap:.28rem; }
.voice-recording-copy strong { color:var(--ink); font-size:.62rem; }
.voice-recording-panel time { color:var(--muted); font-size:.58rem; }
.voice-preview-action { display:grid; width:2rem; height:2rem; place-items:center; padding:0; border:0; border-radius:.55rem; color:var(--primary); background:var(--mint-soft); cursor:pointer; }
.voice-preview-action.danger { color:var(--danger); background:var(--danger-soft); }
.voice-preview-action.send { color:#fff; background:var(--primary); }
.voice-preview-action svg { width:.9rem; height:.9rem; }
.voice-preview-waveform { display:flex; height:1rem; align-items:center; gap:2px; overflow:hidden; }
.voice-preview-waveform i { display:block; width:2px; min-height:2px; border-radius:2px; background:var(--primary); opacity:.72; }
@keyframes voice-record-pulse { 50% { box-shadow:0 0 0 .35rem rgba(201,78,83,.12); } }

.document-upload-dialog { width:min(calc(100% - 2rem),37rem); max-height:calc(100dvh - 2rem); padding:0; overflow:hidden; border:0; border-radius:1.1rem; color:var(--text); background:transparent; box-shadow:0 1.6rem 5rem rgba(8,35,33,.26); }
.document-upload-dialog::backdrop { background:rgba(8,29,28,.58); backdrop-filter:blur(3px); }
.document-upload-card { display:grid; max-height:calc(100dvh - 2rem); grid-template-rows:auto minmax(0,1fr) auto; background:var(--white); }
.document-upload-card > header { display:flex; align-items:center; gap:.75rem; padding:1rem 1.1rem; border-bottom:1px solid var(--line); }
.document-upload-card > header > div { display:grid; flex:1; gap:.06rem; }
.document-upload-card h2 { margin:0; color:var(--ink); font-size:1rem; }
.document-upload-card header p { margin:0; color:var(--muted); font-size:.58rem; }
.document-upload-heading-icon { display:grid; width:2.55rem; height:2.55rem; place-items:center; border-radius:.75rem; color:var(--primary); background:var(--mint-soft); }
.document-upload-heading-icon svg { width:1.1rem; height:1.1rem; }
.document-upload-body { display:grid; gap:.8rem; overflow-y:auto; padding:1rem 1.1rem; }
.document-dropzone { display:grid; min-height:10rem; width:100%; place-items:center; align-content:center; gap:.35rem; padding:1.2rem; border:1.5px dashed rgba(35,117,113,.42); border-radius:.9rem; color:var(--text); background:var(--mint-soft); cursor:pointer; transition:border-color .18s ease,background .18s ease,transform .18s ease; }
.document-dropzone:hover,.document-dropzone.is-dragging { border-color:var(--primary); background:rgba(35,117,113,.12); transform:translateY(-1px); }
.document-dropzone-icon { display:grid; width:3rem; height:3rem; margin-bottom:.25rem; place-items:center; border-radius:50%; color:#fff; background:var(--primary); box-shadow:0 .45rem 1rem rgba(35,117,113,.2); }
.document-dropzone-icon svg { width:1.25rem; height:1.25rem; }
.document-dropzone strong { color:var(--ink); font-size:.76rem; }
.document-dropzone small { color:var(--muted); font-size:.6rem; }
.document-upload-preview { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:.65rem; padding:.65rem; border:1px solid var(--line); border-radius:.75rem; background:var(--surface); }
.document-upload-preview[hidden] { display:none!important; }
.document-preview-icon { display:grid; width:2.5rem; height:2.5rem; place-items:center; border-radius:.6rem; color:var(--primary); background:var(--mint-soft); }
.document-preview-icon svg { width:1rem; height:1rem; }
.document-upload-preview div { display:grid; min-width:0; gap:.1rem; }
.document-upload-preview strong { overflow:hidden; color:var(--ink); font-size:.68rem; text-overflow:ellipsis; white-space:nowrap; }
.document-upload-preview small { color:var(--primary); font-size:.55rem; font-weight:700; }
.document-upload-preview > button { display:grid; width:1.9rem; height:1.9rem; place-items:center; border:0; border-radius:50%; color:var(--danger); background:var(--danger-soft); cursor:pointer; }
.document-upload-information { display:grid; gap:.55rem; padding:.75rem; border:1px solid var(--line); border-radius:.75rem; background:var(--surface); }
.document-upload-information > strong { color:var(--ink); font-size:.59rem; text-transform:uppercase; letter-spacing:.05em; }
.document-upload-information > div { display:flex; flex-wrap:wrap; gap:.38rem; }
.document-upload-information span { padding:.32rem .5rem; border:1px solid var(--line); border-radius:99px; color:var(--muted); background:var(--white); font-size:.53rem; font-weight:650; }
.document-upload-progress { height:.3rem; overflow:hidden; border-radius:99px; background:var(--line); }
.document-upload-progress[hidden] { display:none!important; }
.document-upload-progress span { display:block; width:0; height:100%; border-radius:inherit; background:var(--primary); transition:width .16s ease; }
.document-upload-card .message-feedback { padding:0; text-align:left; }
.document-upload-card > footer { display:flex; justify-content:flex-end; gap:.55rem; padding:.8rem 1.1rem; border-top:1px solid var(--line); }

html[data-theme="dark"] .drawer-registration,
html[data-theme="dark"] .appointment-drawer-summary,
html[data-theme="dark"] .appointment-completed-practitioner { background:#102522; }
html[data-theme="dark"] .appointment-completed-card { color:var(--text); background:#142927; }
html[data-theme="dark"] .appointment-completed-details,
html[data-theme="dark"] .first-message-card { background:#142927; }
html[data-theme="dark"] .voice-recording-panel { background:#102522; }
html[data-theme="dark"] .document-upload-card { background:#142927; }
html[data-theme="dark"] .document-upload-preview,
html[data-theme="dark"] .document-upload-information { background:#102522; }
html[data-theme="dark"] .document-upload-information span { color:var(--text); background:#142927; }

/* Messaging shortcuts and unread notifications */
.sidebar-nav > a { position:relative; }
.navigation-unread-badge,
.navigation-appointment-badge,
.topbar-unread-badge {
    display:grid;
    min-width:1.12rem;
    height:1.12rem;
    place-items:center;
    padding:0 .25rem;
    border:2px solid var(--white);
    border-radius:99px;
    color:#fff;
    background:var(--primary);
    font-size:.5rem;
    font-weight:850;
    line-height:1;
}
.navigation-unread-badge,
.navigation-appointment-badge { margin-left:auto; }
.topbar-unread-badge { position:absolute; top:-.35rem; right:-.35rem; }
.navigation-unread-badge[hidden],.topbar-unread-badge[hidden] { display:none!important; }
.message-shell-panel { display:grid; grid-template-rows:auto minmax(0,1fr) auto; }
.message-shell-panel .panel-heading-icon .media-picto { width:1rem; height:1rem; }
.message-panel-content { padding:.55rem!important; }
.message-panel-item {
    position:relative;
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:.65rem;
    padding:.7rem;
    border:1px solid transparent;
    border-radius:.75rem;
    color:var(--text);
    text-decoration:none;
    transition:color .18s ease,background .18s ease,border-color .18s ease,transform .18s ease;
}
.message-panel-item:hover { border-color:rgba(35,117,113,.18); color:var(--text); background:var(--mint-soft); transform:translateX(-2px); }
.message-panel-item.has-unread { background:rgba(35,117,113,.075); }
.message-panel-avatar { display:grid; width:2.3rem; height:2.3rem; overflow:hidden; place-items:center; border-radius:.7rem; color:var(--primary); background:var(--mint-soft); font-size:.66rem; font-weight:850; }
.message-panel-avatar img { width:100%; height:100%; object-fit:cover; }
.message-panel-copy { display:grid; min-width:0; gap:.15rem; }
.message-panel-copy > span { display:flex; min-width:0; align-items:center; justify-content:space-between; gap:.55rem; }
.message-panel-copy strong,.message-panel-copy small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.message-panel-copy strong { color:var(--ink); font-size:.66rem; }
.message-panel-copy time,.message-panel-copy small { color:var(--muted); font-size:.54rem; }
.message-panel-copy time { flex:none; }
.message-panel-unread { display:grid; min-width:1.08rem; height:1.08rem; place-items:center; padding:0 .22rem; border-radius:99px; color:#fff; background:var(--primary); font-size:.46rem; font-weight:850; }
.message-panel-footer { padding:.75rem 1rem 1rem; border-top:1px solid var(--line); }
.message-panel-footer .button { width:100%; }
html[data-theme="dark"] .navigation-unread-badge,
html[data-theme="dark"] .navigation-appointment-badge,
html[data-theme="dark"] .topbar-unread-badge { border-color:#102522; }
html[data-theme="dark"] .message-panel-item:hover,
html[data-theme="dark"] .message-panel-item.has-unread { color:var(--text); background:#193632; }
html[data-theme="dark"] .chat-quick-link:hover { color:#d7f6f2; background:#193632; }
html[data-theme="dark"] .chat-quick-link.primary:hover { color:#fff; background:#38928c; }

/* Accepted appointment modification */
.appointment-edit-open { width:100%; margin-top:.85rem; }
.appointment-edit-pending { display:flex; align-items:flex-start; gap:.6rem; margin-top:.85rem; padding:.75rem; border:1px solid rgba(214,151,50,.24); border-radius:.75rem; color:#765314; background:#fff7e8; }
.appointment-edit-pending .media-picto { flex:none; width:1rem; height:1rem; }
.appointment-edit-pending span { display:grid; gap:.12rem; }
.appointment-edit-pending strong { font-size:.65rem; }
.appointment-edit-pending small { font-size:.55rem; line-height:1.5; }
.appointment-drawer-pending { display:flex; align-items:center; justify-content:center; gap:.4rem; width:100%; padding:.62rem .7rem; border:1px solid rgba(214,151,50,.24); border-radius:.68rem; color:#765314; background:#fff7e8; font-size:.56rem; font-weight:750; }
.appointment-drawer-pending .media-picto { width:.85rem; height:.85rem; }
.appointment-edit-dialog { width:min(calc(100% - 2rem),39rem); max-height:calc(100dvh - 2rem); padding:0; overflow:hidden; border:0; border-radius:1rem; color:var(--text); background:transparent; box-shadow:0 1.6rem 5rem rgba(8,35,33,.28); }
.appointment-edit-dialog::backdrop { background:rgba(8,29,28,.58); backdrop-filter:blur(3px); }
.appointment-edit-card { display:grid; max-height:calc(100dvh - 2rem); grid-template-rows:auto minmax(0,1fr) auto; background:var(--white); }
.appointment-edit-card > header { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding:1rem 1.1rem; border-bottom:1px solid var(--line); }
.appointment-edit-card > header > div { display:flex; align-items:center; gap:.7rem; }
.appointment-edit-card header h2 { margin:.08rem 0 0; color:var(--ink); font-size:.9rem; }
.appointment-edit-card header p { margin:.15rem 0 0; color:var(--muted); font-size:.58rem; }
.appointment-edit-icon { display:grid; width:2.35rem; height:2.35rem; flex:none; place-items:center; border-radius:.7rem; color:var(--primary); background:var(--mint-soft); }
.appointment-edit-icon .media-picto { width:1.05rem; height:1.05rem; }
.appointment-edit-body { display:grid; gap:.9rem; overflow-y:auto; padding:1rem 1.1rem; }
.appointment-edit-current { display:grid; gap:.1rem; padding:.75rem; border:1px solid var(--line); border-radius:.75rem; background:var(--surface); }
.appointment-edit-current span,.appointment-edit-field > span,.appointment-edit-media legend { color:var(--muted); font-size:.55rem; font-weight:750; text-transform:uppercase; letter-spacing:.04em; }
.appointment-edit-current strong { color:var(--ink); font-size:.72rem; }
.appointment-edit-current small { color:var(--muted); font-size:.56rem; }
.appointment-edit-field { display:grid; gap:.38rem; }
.appointment-edit-field select { width:100%; min-height:2.65rem; padding:.6rem .7rem; border:1px solid var(--line); border-radius:.65rem; color:var(--ink); background:var(--white); }
.appointment-edit-field small { color:var(--muted); font-size:.53rem; }
.appointment-edit-media { margin:0; padding:0; border:0; }
.appointment-edit-media legend { margin-bottom:.45rem; }
.appointment-edit-media > div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.5rem; }
.appointment-edit-media label { cursor:pointer; }
.appointment-edit-media input { position:absolute; opacity:0; pointer-events:none; }
.appointment-edit-media label > span { display:flex; min-height:3rem; align-items:center; justify-content:center; gap:.4rem; padding:.55rem; border:1px solid var(--line); border-radius:.7rem; color:var(--ink); background:var(--white); transition:.18s ease; }
.appointment-edit-media label:hover > span { border-color:rgba(35,117,113,.38); color:var(--primary); background:var(--mint-soft); transform:translateY(-1px); }
.appointment-edit-media input:checked + span { border-color:var(--primary); color:var(--primary); background:var(--mint-soft); box-shadow:0 0 0 1px var(--primary); }
.appointment-edit-media label.is-disabled { opacity:.42; cursor:not-allowed; }
.appointment-edit-media label.is-disabled > span { transform:none; }
.appointment-edit-media .media-picto { width:.95rem; height:.95rem; }
.appointment-edit-media strong { font-size:.6rem; }
.appointment-edit-notice { padding:.7rem .75rem; border-radius:.7rem; color:#6e541e; background:#fff7e8; }
.appointment-edit-notice strong { font-size:.62rem; }
.appointment-edit-notice p { margin:.18rem 0 0; font-size:.55rem; line-height:1.5; }
.appointment-edit-feedback { min-height:0; margin:0; color:var(--muted); font-size:.58rem; }
.appointment-edit-feedback:empty { display:none; }
.appointment-edit-feedback.is-error { color:var(--danger); }
.appointment-edit-feedback.is-success { color:var(--primary); }
.appointment-edit-card > footer { display:flex; justify-content:flex-end; gap:.55rem; padding:.8rem 1.1rem; border-top:1px solid var(--line); }
.appointment-edit-submit { position:relative; min-width:10.8rem; overflow:hidden; isolation:isolate; }
.appointment-edit-submit .media-picto { transition:opacity .18s ease,transform .25s ease; }
.appointment-edit-submit::before {
    position:absolute;
    top:50%;
    left:1rem;
    width:1rem;
    height:1rem;
    margin-top:-.5rem;
    border:2px solid rgba(255,255,255,.38);
    border-top-color:#fff;
    border-radius:50%;
    content:"";
    opacity:0;
    transform:scale(.6);
}
.appointment-edit-submit.is-loading { cursor:wait; }
.appointment-edit-submit.is-loading::before { opacity:1; animation:appointment-edit-submit-spin .7s linear infinite; }
.appointment-edit-submit.is-loading .media-picto { opacity:0; transform:scale(.6); }
.appointment-edit-submit.is-success { color:#fff; background:var(--primary); animation:appointment-edit-submit-success .55s ease both; }
.appointment-edit-submit.is-success .media-picto { animation:appointment-edit-submit-check .45s ease both; }
.appointment-edit-card.is-submitted .appointment-edit-body { opacity:.72; transition:opacity .25s ease; }
@keyframes appointment-edit-submit-spin { to { transform:rotate(360deg); } }
@keyframes appointment-edit-submit-success { 45% { transform:scale(1.035); box-shadow:0 0 0 .4rem rgba(35,117,113,.13); } }
@keyframes appointment-edit-submit-check { 0% { transform:scale(.45) rotate(-18deg); } 70% { transform:scale(1.2) rotate(3deg); } 100% { transform:scale(1) rotate(0); } }
@media (prefers-reduced-motion:reduce) {
    .appointment-edit-submit,
    .appointment-edit-submit::before,
    .appointment-edit-submit .media-picto { animation:none!important; transition:none!important; }
}
html[data-theme="dark"] .appointment-edit-card,
html[data-theme="dark"] .appointment-edit-field select,
html[data-theme="dark"] .appointment-edit-media label > span { color:var(--ink); background:#102522; }
html[data-theme="dark"] .appointment-edit-current { background:#142927; }
html[data-theme="dark"] .appointment-edit-notice,
html[data-theme="dark"] .appointment-edit-pending { color:#f3d899; background:#382d18; border-color:#66522c; }
html[data-theme="dark"] .appointment-drawer-pending { color:#f3d899; background:#382d18; border-color:#66522c; }
@media (max-width:600px) {
    .appointment-edit-media > div { grid-template-columns:1fr; }
    .appointment-edit-card > footer { display:grid; grid-template-columns:1fr; }
}

/* Warm patient surfaces, consultation chat and document library */
.app-body { background:#f7f0e9; }
.patient-app-main,.dashboard-shell { background:linear-gradient(135deg,#faf6f1,#f3e8dd); }
.page-intro,
.dashboard-section,
.appointments-page-card,
.invoices-card,
.appointment-session-card,
.appointment-facts-card { border-color:rgba(116,87,65,.12); box-shadow:0 12px 34px rgba(82,61,45,.06); }
.page-intro { background:linear-gradient(120deg,#fffaf5,#f4e6d8); }
.appointment-chat { display:grid; min-height:31rem; grid-template-rows:auto minmax(18rem,1fr) auto auto; overflow:hidden; border:1px solid rgba(35,117,113,.16); border-radius:1rem; background:#fbf7f2; }
.appointment-chat > header { display:flex; align-items:center; justify-content:space-between; gap:.8rem; padding:.8rem .9rem; border-bottom:1px solid rgba(116,87,65,.1); background:#fffaf6; }
.appointment-chat > header > div { display:flex; align-items:center; gap:.65rem; min-width:0; }
.appointment-chat > header div div { display:grid; gap:.04rem; }
.appointment-chat > header strong { color:var(--ink); font-size:.72rem; }
.appointment-chat > header small { color:var(--muted); font-size:.52rem; }
.appointment-chat-avatar { display:grid; width:2.25rem; height:2.25rem; flex:none; place-items:center; overflow:hidden; border-radius:.65rem; color:#fff; background:var(--primary); font-size:.62rem; font-weight:800; }
.appointment-chat-avatar img { width:100%; height:100%; object-fit:cover; }
.appointment-chat-secure { padding:.28rem .5rem; border-radius:999px; color:var(--primary); background:var(--mint-soft); font-size:.46rem; font-weight:750; }
.appointment-chat-messages { display:flex; min-height:0; flex-direction:column; gap:.48rem; overflow-y:auto; padding:1rem; }
.appointment-chat-messages article { display:grid; width:fit-content; max-width:min(76%,36rem); gap:.18rem; padding:.58rem .72rem; border:1px solid rgba(116,87,65,.1); border-radius:.9rem .9rem .9rem .3rem; color:var(--text); background:#fff; box-shadow:0 5px 14px rgba(82,61,45,.05); font-size:.62rem; line-height:1.5; white-space:pre-wrap; }
.appointment-chat-messages article.is-me { align-self:flex-end; border-color:transparent; border-radius:.9rem .9rem .3rem .9rem; color:#fff; background:var(--primary); }
.appointment-chat-messages time { justify-self:end; font-size:.43rem; opacity:.68; }
.appointment-chat-empty { margin:auto; color:var(--muted); font-size:.6rem; }
.appointment-chat form { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.5rem; padding:.7rem; border-top:1px solid rgba(116,87,65,.1); background:#fffaf6; }
.appointment-chat textarea { box-sizing:border-box; height:2.65rem; min-height:2.65rem; max-height:7rem; resize:none; padding:.75rem .8rem .35rem; border:1px solid rgba(116,87,65,.16); border-radius:.75rem; outline:0; color:var(--ink); background:#fff; font:inherit; font-size:.62rem; line-height:1.35; }
.appointment-chat textarea:focus { border-color:rgba(35,117,113,.5); box-shadow:0 0 0 3px rgba(35,117,113,.09); }
.appointment-chat form button { display:inline-flex; min-width:5.7rem; height:2.65rem; align-items:center; justify-content:center; gap:.38rem; padding:0 .7rem; border:0; border-radius:.75rem; color:#fff; background:var(--primary); cursor:pointer; font:inherit; font-size:.58rem; font-weight:800; }
.appointment-chat form button:hover { background:var(--primary-hover); transform:translateY(-1px); }
.appointment-chat form button:disabled { cursor:wait; opacity:.72; transform:none; }
.appointment-chat-send-loader { display:none; width:.72rem; height:.72rem; border:2px solid rgba(255,255,255,.35); border-top-color:#fff; border-radius:50%; animation:vonage-loading .75s linear infinite; }
.appointment-chat form.is-sending .appointment-chat-send-loader { display:block; }
.appointment-chat form.is-sending [data-appointment-chat-send-label] { font-size:0; }
.appointment-chat form.is-sending [data-appointment-chat-send-label]::after { content:'Envoi…'; font-size:.58rem; }
.appointment-chat form .media-picto { width:1rem; height:1rem; }
.appointment-chat-closed { display:flex; align-items:center; justify-content:center; gap:.45rem; padding:.7rem; border-top:1px solid rgba(116,87,65,.1); color:var(--muted); background:#f1e6dc; font-size:.55rem; }
.appointment-chat-closed .media-picto { width:.82rem; height:.82rem; }
.appointment-chat-feedback { min-height:.1rem; margin:0; padding:0 .75rem .45rem; color:#a44b4b; background:#fffaf6; font-size:.5rem; }
.appointment-chat-feedback:empty { display:none; }
.phone-appointment-actions { display:flex; flex-wrap:wrap; gap:.5rem; padding:.7rem; border-top:1px solid rgba(116,87,65,.1); background:#fffaf6; }
.phone-appointment-actions .button { flex:1 1 11rem; }
.appointment-cancelled-card .appointment-completed-icon { color:#a44b4b; background:#fbe9e7; }
.invoices-card { overflow:hidden; background:#fffaf6; }
.invoices-table-wrap { padding:.75rem; }
.invoices-table { border-collapse:separate; border-spacing:0 .5rem; }
.invoices-table thead th { border:0; color:#826e5f; background:transparent; }
.invoices-table tbody tr { filter:drop-shadow(0 5px 12px rgba(82,61,45,.05)); }
.invoices-table tbody td { border-top:1px solid rgba(116,87,65,.1); border-bottom:1px solid rgba(116,87,65,.1); background:#fff; }
.invoices-table tbody td:first-child { border-left:1px solid rgba(116,87,65,.1); border-radius:.75rem 0 0 .75rem; }
.invoices-table tbody td:last-child { border-right:1px solid rgba(116,87,65,.1); border-radius:0 .75rem .75rem 0; }
.invoice-download { background:#f3e5d8; }
html[data-theme="dark"] .appointment-chat,
html[data-theme="dark"] .appointment-chat > header,
html[data-theme="dark"] .appointment-chat form,
html[data-theme="dark"] .appointment-chat-feedback,
html[data-theme="dark"] .phone-appointment-actions { background:#142927; border-color:#284640; }
html[data-theme="dark"] .appointment-chat-messages article.is-other { color:var(--text); background:#18312e; border-color:#284640; }
html[data-theme="dark"] .appointment-chat textarea { color:var(--ink); background:#102522; border-color:#31514b; }
html[data-theme="dark"] .appointment-chat-closed { color:var(--muted); background:#1d302d; border-color:#284640; }
html[data-theme="dark"] .patient-app-main,html[data-theme="dark"] .dashboard-shell { background:linear-gradient(135deg,#102522,#152e2a); }
@media(max-width:700px){.appointment-chat{min-height:27rem}.appointment-chat-messages article{max-width:88%}.phone-appointment-actions{display:grid}.phone-appointment-actions .button{width:100%}}

/* Webcam: automatic connection, explicit loading and modal device test */
.vonage-preflight { display:flex; justify-content:flex-end; min-height:0; padding:.55rem .75rem; }
.vonage-preflight > [hidden] { display:none !important; }
.vonage-shell.is-connected .vonage-preflight { display:none; }
.vonage-connection-state { display:flex; align-items:center; gap:.5rem; color:#d9eeeb; }
.vonage-connection-state > span { width:.9rem; height:.9rem; border:2px solid rgba(255,255,255,.3); border-top-color:#fff; border-radius:50%; background:transparent; animation:vonage-loading .8s linear infinite; }
.vonage-connection-state strong { font-size:.56rem; }
.vonage-local-loading { position:absolute; inset:0; z-index:3; display:grid; place-content:center; justify-items:center; gap:.65rem; color:#fff; background:linear-gradient(145deg,#24423e,#172d2a); text-align:center; }
.vonage-local-loading[hidden] { display:none; }
.vonage-local-loading span,.vonage-test-preview [data-vonage-test-placeholder] span { width:1.55rem; height:1.55rem; border:2px solid rgba(255,255,255,.35); border-top-color:#fff; border-radius:50%; animation:vonage-loading .8s linear infinite; }
.vonage-local-loading strong { font-size:.57rem; }
@keyframes vonage-loading { to { transform:rotate(360deg); } }
.vonage-control.is-disabled { color:#8a4a47; background:#f9e7e4; border-color:#efcbc5; }
.vonage-control.is-disabled .media-picto { position:relative; opacity:.75; }
.vonage-control.is-disabled:hover { color:#713b38; background:#f4d8d3; }
.vonage-test-dialog { width:min(34rem,calc(100vw - 2rem)); padding:0; border:0; border-radius:1rem; color:var(--text); background:#fffaf6; box-shadow:0 24px 70px rgba(33,48,45,.24); }
.vonage-test-dialog::backdrop { background:rgba(17,34,31,.6); backdrop-filter:blur(3px); }
.vonage-test-dialog form > header { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 1.1rem .75rem; border-bottom:1px solid rgba(116,87,65,.12); }
.vonage-test-dialog form > header > div { display:flex; align-items:center; gap:.7rem; }
.vonage-test-dialog form > header > div > span { display:grid; width:2rem; height:2rem; place-items:center; border-radius:.65rem; color:var(--primary); background:var(--mint-soft); }
.vonage-test-dialog h2,.vonage-test-dialog p { margin:0; }
.vonage-test-dialog h2 { font-size:.82rem; }
.vonage-test-dialog header p { margin-top:.08rem; color:var(--muted); font-size:.53rem; }
.vonage-test-body { display:grid; gap:.85rem; padding:1rem 1.1rem; }
.vonage-test-preview { position:relative; overflow:hidden; aspect-ratio:16/9; border-radius:.9rem; background:#1b302d; }
.vonage-test-preview video { width:100%; height:100%; object-fit:cover; transform:scaleX(-1); }
.vonage-test-preview [data-vonage-test-placeholder] { position:absolute; inset:0; display:grid; place-content:center; justify-items:center; gap:.55rem; color:#fff; background:#1b302d; }
.vonage-test-preview [data-vonage-test-placeholder][hidden] { display:none; }
.vonage-test-preview [data-vonage-test-placeholder] strong { font-size:.57rem; }
.vonage-test-results { display:grid; gap:.55rem; }
.vonage-test-results > p { color:var(--muted); font-size:.58rem; }
.vonage-test-results > div { display:flex; flex-wrap:wrap; gap:.45rem; }
.vonage-test-results span { display:flex; align-items:center; gap:.35rem; padding:.4rem .55rem; border-radius:999px; color:#8a4a47; background:#f9e7e4; font-size:.52rem; font-weight:750; }
.vonage-test-results span.is-ok { color:#216a55; background:#e3f2eb; }
.vonage-test-results .media-picto { width:.75rem; height:.75rem; }
.vonage-test-dialog footer { display:flex; justify-content:flex-end; padding:.75rem 1.1rem 1rem; }
html[data-theme="dark"] .vonage-test-dialog { color:var(--text); background:#17302c; }
html[data-theme="dark"] .vonage-test-dialog form > header { border-color:#31514b; }

/* Account security and registered push devices */
.profile-security-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(19rem,.85fr); align-items:start; gap:1rem; margin-top:1rem; }
.profile-security-grid .profile-card { padding:0; overflow:hidden; }
.profile-security-grid .profile-card > header { padding:1rem 1.05rem .8rem; border-bottom:1px solid rgba(116,87,65,.11); }
.profile-security-grid .profile-card-icon .media-picto { width:1rem; height:1rem; }
.security-status { padding:.3rem .5rem; border-radius:999px; color:#8a4a47; background:#f9e7e4; font-size:.48rem; font-weight:800; }
.security-status.is-enabled { color:#216a55; background:#e3f2eb; }
.two-factor-intro,.two-factor-enabled-copy { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 1.05rem; }
.two-factor-intro p,.two-factor-enabled-copy p { max-width:31rem; margin:0; color:var(--muted); font-size:.58rem; line-height:1.55; }
.two-factor-setup { display:grid; grid-template-columns:10rem 1fr; gap:1.15rem; padding:1rem 1.05rem; }
.two-factor-setup > img { width:10rem; padding:.45rem; border:1px solid rgba(35,117,113,.15); border-radius:.8rem; background:#fff; }
.two-factor-setup ol { margin:0 0 .65rem; padding-left:1rem; color:var(--muted); font-size:.55rem; line-height:1.6; }
.two-factor-setup code { display:block; margin-bottom:.7rem; padding:.45rem .55rem; overflow-wrap:anywhere; border-radius:.45rem; color:var(--primary); background:var(--mint-soft); font-size:.52rem; letter-spacing:.08em; }
.two-factor-setup form { display:flex; align-items:end; gap:.5rem; }
.two-factor-setup label { display:grid; flex:1; gap:.25rem; color:var(--muted); font-size:.5rem; font-weight:700; }
.two-factor-setup input,.two-factor-disable input { width:100%; min-height:2.45rem; padding:.55rem .65rem; border:1px solid rgba(116,87,65,.18); border-radius:.55rem; color:var(--ink); background:#fff; font:inherit; }
.recovery-codes { display:grid; gap:.8rem; padding:1rem 1.05rem; background:#fff8e7; }
.recovery-codes p { margin:.1rem 0 0; color:var(--muted); font-size:.54rem; }
.recovery-codes ul { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.35rem; margin:0; padding:0; list-style:none; }
.recovery-codes li { padding:.4rem .5rem; border:1px dashed rgba(116,87,65,.23); border-radius:.4rem; background:#fff; font-family:monospace; font-size:.55rem; text-align:center; letter-spacing:.06em; }
.profile-inline-error { margin:.8rem 1.05rem 0; padding:.55rem .65rem; border-radius:.55rem; color:#8a3c3c; background:#fbe8e6; font-size:.54rem; }
.two-factor-disable { margin:0 1.05rem 1rem; padding:.7rem; border:1px solid rgba(164,75,75,.17); border-radius:.65rem; }
.two-factor-disable summary { color:#8a4a47; cursor:pointer; font-size:.54rem; font-weight:750; }
.two-factor-disable form { display:grid; grid-template-columns:1fr 1fr auto; align-items:end; gap:.55rem; margin-top:.7rem; }
.two-factor-disable label { display:grid; gap:.25rem; color:var(--muted); font-size:.48rem; font-weight:700; }
.button-danger { color:#fff; background:#a44b4b; }
.button-danger:hover { background:#873c3c; }
.push-empty { display:flex; align-items:flex-start; gap:.65rem; padding:1rem 1.05rem; color:var(--muted); }
.push-empty > .media-picto { width:1.1rem; height:1.1rem; color:var(--primary); }
.push-empty strong { color:var(--ink); font-size:.58rem; }
.push-empty p { margin:.1rem 0 0; font-size:.53rem; line-height:1.5; }
.push-device-list { display:grid; }
.push-device { display:grid; gap:.75rem; padding:.9rem 1.05rem; border-bottom:1px solid rgba(116,87,65,.1); }
.push-device:last-child { border-bottom:0; }
.push-device-heading { display:flex; align-items:center; gap:.6rem; }
.push-device-heading > span { display:grid; width:2rem; height:2rem; place-items:center; border-radius:.55rem; color:var(--primary); background:var(--mint-soft); }
.push-device-heading .media-picto { width:.9rem; height:.9rem; }
.push-device-heading div { display:grid; gap:.05rem; }
.push-device-heading strong { font-size:.58rem; }
.push-device-heading small { color:var(--muted); font-size:.47rem; }
.push-device-settings { display:grid; gap:.25rem; }
.push-device-settings .toggle-row { padding:.45rem 0; }
.push-device-settings .button { justify-self:start; margin-top:.25rem; }
.push-revoke-form button { padding:0; border:0; color:#8a4a47; background:transparent; cursor:pointer; font:inherit; font-size:.48rem; text-decoration:underline; }
.push-disabled-label { color:var(--muted); font-size:.5rem; }
.two-factor-challenge .field-group input { text-align:center; letter-spacing:.18em; font-size:.9rem; font-weight:750; }
.two-factor-cancel { margin-top:.7rem; text-align:center; }
.auth-text-button { border:0; color:var(--muted); background:transparent; cursor:pointer; font:inherit; font-size:.55rem; }
html[data-theme="dark"] .profile-security-grid .profile-card,html[data-theme="dark"] .recovery-codes { background:#17302c; }
html[data-theme="dark"] .two-factor-setup input,html[data-theme="dark"] .two-factor-disable input,html[data-theme="dark"] .recovery-codes li { color:var(--text); background:#102522; border-color:#31514b; }
@media(max-width:980px){.profile-security-grid{grid-template-columns:1fr}.two-factor-disable form{grid-template-columns:1fr}.two-factor-setup{grid-template-columns:1fr}.two-factor-setup>img{justify-self:center}}

/* Cleaner page introductions: the warm palette belongs to the page, not to a horizontal banner. */
.page-intro { position:relative; padding:.15rem 0 .85rem; border:0; border-bottom:1px solid rgba(116,87,65,.13); background:transparent!important; box-shadow:none!important; }
.page-intro::after { content:""; position:absolute; bottom:-1px; left:0; width:3.25rem; height:2px; border-radius:2px; background:var(--primary); }
html[data-theme="dark"] .page-intro { border-bottom-color:#294741; }

/* Refined appointment preview drawer */
.appointment-preview-drawer > header { padding:.9rem 1.1rem; background:var(--surface); }
.appointment-drawer-content { padding:1rem 1.1rem; }
.appointment-drawer-practitioner { padding:.8rem; background:var(--white); }
.appointment-drawer-facts { gap:.5rem; margin-top:.65rem; }
.appointment-drawer-facts > span { padding:.7rem .75rem; border:1px solid rgba(35,117,113,.08); background:var(--surface); }
.appointment-drawer-status { margin-top:.65rem; padding:.75rem 0 0; }
.appointment-preview-drawer > footer { gap:.45rem; padding:.8rem 1.1rem; background:var(--surface); }
.appointment-preview-drawer > footer .appointment-drawer-invoice { flex-basis:100%; border-color:rgba(35,117,113,.22); color:var(--primary); background:var(--mint-soft); }
.appointment-preview-drawer > footer .appointment-drawer-invoice:hover { color:#fff; background:var(--primary); }
.appointment-facts-invoice { width:100%; margin-top:.7rem; }
.appointment-rebook { width:100%; margin-top:.7rem; }
html[data-theme="dark"] .appointment-preview-drawer > header,
html[data-theme="dark"] .appointment-preview-drawer > footer,
html[data-theme="dark"] .appointment-drawer-facts > span { background:#142927; border-color:#294741; }

/* 2FA presentation */
.profile-security-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.security-status { display:inline-flex; align-items:center; gap:.3rem; white-space:nowrap; }
.security-status i { width:.38rem; height:.38rem; border-radius:50%; background:currentColor; }
.two-factor-intro { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:.9rem; padding:1.1rem; }
.two-factor-shield { display:grid; width:3.25rem; height:3.25rem; flex:none; place-items:center; border-radius:1rem; color:var(--primary); background:linear-gradient(145deg,#e3f3ee,#f2e8de); box-shadow:inset 0 0 0 1px rgba(35,117,113,.09); }
.two-factor-shield .media-picto { width:1.35rem; height:1.35rem; }
.two-factor-intro-copy { display:grid; gap:.18rem; }
.two-factor-intro-copy > strong,.two-factor-enabled-copy > div > strong { color:var(--ink); font-size:.68rem; }
.two-factor-intro-copy > p,.two-factor-enabled-copy p { margin:0; color:var(--muted); font-size:.55rem; line-height:1.5; }
.two-factor-intro-copy ul { display:flex; flex-wrap:wrap; gap:.3rem .6rem; margin:.35rem 0 0; padding:0; list-style:none; }
.two-factor-intro-copy li { display:flex; align-items:center; gap:.22rem; color:var(--text); font-size:.48rem; }
.two-factor-intro-copy li .media-picto { width:.65rem; height:.65rem; color:var(--primary); }
.two-factor-setup { grid-template-columns:11rem minmax(0,1fr); align-items:center; padding:1.1rem; }
.two-factor-qr { display:grid; justify-items:center; gap:.4rem; padding:.6rem; border:1px solid rgba(35,117,113,.13); border-radius:.9rem; background:#fff; }
.two-factor-qr img { width:100%; }
.two-factor-qr span { color:var(--muted); font-size:.48rem; }
.two-factor-setup-content { display:grid; gap:.48rem; }
.two-factor-setup-content h3 { margin:0; color:var(--ink); font-size:.76rem; }
.setup-step { width:max-content; padding:.22rem .38rem; border-radius:999px; color:var(--primary); background:var(--mint-soft); font-size:.43rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.two-factor-setup-content ol { margin:0; }
.two-factor-expiry { margin:0; color:var(--muted); font-size:.49rem; line-height:1.45; }
.two-factor-setup-content details summary { color:var(--primary); cursor:pointer; font-size:.5rem; font-weight:750; }
.two-factor-setup-content details code { margin:.35rem 0 0; }
.two-factor-setup-content form { display:grid; grid-template-columns:minmax(0,1fr) auto; }
.two-factor-setup-content form label { min-width:0; }
.two-factor-setup-content input { text-align:center; letter-spacing:.14em; font-weight:800; }
.two-factor-enabled-copy { justify-content:flex-start; padding:1rem 1.05rem .7rem; }
.two-factor-enabled-copy > div { display:grid; gap:.15rem; }
.recovery-count { display:flex; width:max-content; align-items:center; gap:.3rem; margin-top:.35rem; padding:.28rem .45rem; border-radius:999px; color:var(--primary); background:var(--mint-soft); font-size:.48rem; font-weight:750; }
.recovery-count .media-picto { width:.7rem; height:.7rem; }
.two-factor-disable > p { margin:.45rem 0 0; color:var(--muted); font-size:.5rem; }
.security-success-heading { display:flex; align-items:center; gap:.55rem; }
.security-success-heading > .media-picto { width:1.35rem; height:1.35rem; color:var(--primary); }

/* Push devices */
.device-count { padding:.28rem .45rem; border-radius:999px; color:var(--primary); background:var(--mint-soft); font-size:.46rem; font-weight:800; white-space:nowrap; }
.push-device-list { gap:.65rem; padding:.8rem; }
.push-device { gap:.65rem; padding:.8rem; border:1px solid rgba(116,87,65,.12); border-radius:.85rem; background:var(--surface); }
.push-device-heading small { display:flex; flex-wrap:wrap; align-items:center; gap:.3rem; }
.push-device-heading small b { padding:.16rem .3rem; border-radius:999px; color:#216a55; background:#e3f2eb; font-size:.4rem; }
.push-device-settings { gap:.6rem; }
.device-name-field { display:grid; gap:.25rem; color:var(--muted); font-size:.48rem; font-weight:750; }
.device-name-field input { min-height:2.25rem; padding:.5rem .6rem; border:1px solid var(--line); border-radius:.55rem; color:var(--ink); background:var(--white); font:inherit; font-size:.56rem; }
.push-preferences { display:grid; grid-template-columns:1fr 1fr; gap:.45rem; }
.push-preferences .toggle-row { padding:.55rem .6rem; border:1px solid var(--line); border-radius:.65rem; background:var(--white); }
.push-revoke-form { margin-top:-.2rem; }
.inactive-devices { margin:.1rem .8rem .8rem; border:1px solid var(--line); border-radius:.75rem; overflow:hidden; isolation:isolate; }
.inactive-devices > summary { display:flex; align-items:center; justify-content:space-between; gap:.6rem; padding:.65rem .75rem; border-radius:.7rem; color:var(--ink); background:var(--surface); cursor:pointer; font-size:.54rem; font-weight:750; }
.inactive-devices[open] > summary { border-radius:.7rem .7rem 0 0; }
.inactive-devices > summary small { color:var(--muted); font-size:.46rem; font-weight:500; }
.inactive-devices > div { display:grid; overflow:hidden; border-radius:0 0 .7rem .7rem; }
.inactive-devices section { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:.55rem; padding:.6rem .75rem; border-top:1px solid var(--line); }
.inactive-devices section:last-child { border-radius:0 0 .7rem .7rem; }
.inactive-devices section > span { display:grid; width:1.75rem; height:1.75rem; place-items:center; border-radius:.5rem; color:var(--muted); background:var(--surface); }
.inactive-devices section .media-picto { width:.75rem; height:.75rem; }
.inactive-devices section > div { display:grid; gap:.05rem; }
.inactive-devices section strong { color:var(--ink); font-size:.54rem; }
.inactive-devices section small { color:var(--muted); font-size:.44rem; }
.inactive-devices section button { border:0; color:#8a4a47; background:transparent; cursor:pointer; font:inherit; font-size:.47rem; text-decoration:underline; }
.inactive-devices section form[data-push-action="forget"] { display:flex; align-items:center; justify-content:flex-end; }
.inactive-devices section form[data-push-action="forget"] button { display:inline-flex; min-height:1.75rem; align-items:center; justify-content:center; gap:.38rem; padding:.25rem .45rem; border-radius:999px; line-height:1.2; white-space:nowrap; }
.inactive-devices section form[data-push-action="forget"] button:hover,
.inactive-devices section form[data-push-action="forget"] button.is-submitting { background:var(--mint-soft); }
.inactive-devices section form[data-push-action="forget"] .button-submit-spinner { width:.7rem; height:.7rem; flex-basis:.7rem; }
html[data-theme="dark"] .two-factor-shield { background:linear-gradient(145deg,#1b3d37,#302c25); }
html[data-theme="dark"] .two-factor-qr { background:#fff; }
html[data-theme="dark"] .push-device,
html[data-theme="dark"] .push-preferences .toggle-row,
html[data-theme="dark"] .device-name-field input,
html[data-theme="dark"] .inactive-devices > summary,
html[data-theme="dark"] .inactive-devices section > span { color:var(--text); background:#102522; border-color:#31514b; }
html[data-theme="dark"] .inactive-devices section form[data-push-action="forget"] button:hover,
html[data-theme="dark"] .inactive-devices section form[data-push-action="forget"] button.is-submitting { background:#17352f; }
@media(max-width:1100px){.profile-security-grid{grid-template-columns:1fr}.two-factor-intro{grid-template-columns:auto minmax(0,1fr)}.two-factor-intro form{grid-column:1/-1}.two-factor-intro form .button{width:100%}}
@media(max-width:620px){.two-factor-setup{grid-template-columns:1fr}.two-factor-qr{width:11rem; justify-self:center}.two-factor-setup-content form,.push-preferences{grid-template-columns:1fr}.inactive-devices>summary{align-items:flex-start;flex-direction:column}}

/* Complete messaging drawer */
.message-shell-panel { width:min(100%,33rem); }
.message-panel-list-view { display:grid; min-height:0; grid-template-rows:auto minmax(0,1fr) auto auto auto; }
.message-panel-list-view[hidden],
.message-drawer-conversation[hidden],
.message-drawer-documents[hidden] { display:none!important; }
.message-drawer-conversation { display:grid; min-height:0; grid-template-rows:auto minmax(0,1fr) auto auto auto; }
.message-drawer-conversation-head,
.message-drawer-documents-head { display:flex; align-items:center; gap:.55rem; padding:.65rem .8rem; border-bottom:1px solid var(--line); background:var(--surface); }
.drawer-conversation-list-header { display:grid; gap:.58rem; padding:.72rem .8rem; border-bottom:1px solid var(--line); background:var(--surface); }
.drawer-conversation-list-header .conversation-heading h3 { margin:0; color:var(--ink); font-size:.76rem; }
.drawer-conversation-list-header .conversation-heading span { display:grid; min-width:1.35rem; height:1.35rem; place-items:center; padding:0 .35rem; border-radius:99px; color:var(--primary); background:var(--mint-soft); font-size:.5rem; font-weight:850; }
.drawer-conversation-list-header .conversation-filters { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.42rem; margin:0; }
.drawer-conversation-list-header .conversation-filters button { justify-content:center; }
.drawer-conversation-list-header .conversation-search { min-height:2.6rem; margin:0; }
.message-panel-content { overflow-y:auto; }
.message-panel-list-state { justify-content:center; padding:.45rem .8rem; border-top:1px solid var(--line); }
.message-drawer-conversation-head > span:not(.message-panel-avatar),
.message-drawer-documents-head > span { display:grid; min-width:0; gap:.05rem; }
.message-drawer-conversation-head strong,
.message-drawer-documents-head strong { overflow:hidden; color:var(--ink); font-size:.66rem; text-overflow:ellipsis; white-space:nowrap; }
.message-drawer-conversation-head small,
.message-drawer-documents-head small { overflow:hidden; color:var(--muted); font-size:.5rem; text-overflow:ellipsis; white-space:nowrap; }
.message-drawer-back,
.message-drawer-documents-button { display:inline-flex; min-height:2rem; align-items:center; justify-content:center; gap:.3rem; border:1px solid var(--line); border-radius:.58rem; color:var(--ink); background:var(--white); cursor:pointer; }
.message-drawer-back { width:2rem; flex:none; font-size:.8rem; }
.message-drawer-back svg,
.chat-back svg { display:block; width:1rem; height:1rem; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.message-drawer-documents-button { margin-left:auto; padding:.4rem .55rem; font-size:.54rem; font-weight:750; }
.message-drawer-documents-button .media-picto { width:.8rem; height:.8rem; }
.message-drawer-quick-actions { display:flex; margin-left:auto; gap:.28rem; }
.message-drawer-quick-actions > * { display:grid; width:2rem; height:2rem; padding:0; place-items:center; border:1px solid var(--line); border-radius:.58rem; color:var(--primary); background:var(--white); cursor:pointer; text-decoration:none; transition:.18s ease; }
.message-drawer-quick-actions > *:hover,.message-drawer-quick-actions > *.is-active { border-color:rgba(35,117,113,.38); color:#fff; background:var(--primary); transform:translateY(-1px); }
.message-drawer-quick-actions > *.is-primary { color:#fff; background:var(--primary); }
.message-drawer-quick-actions .media-picto { width:.82rem; height:.82rem; }
.message-drawer-back:hover,
.message-drawer-documents-button:hover { border-color:rgba(35,117,113,.35); color:var(--primary); background:var(--mint-soft); }
.message-drawer-messages { display:flex; min-height:0; flex-direction:column; gap:.48rem; overflow-y:auto; padding:.8rem; background:linear-gradient(180deg,var(--surface),var(--white)); }
.message-drawer-loading { margin:auto; padding:1rem; color:var(--muted); font-size:.58rem; line-height:1.5; text-align:center; }
.message-drawer-bubble { display:grid; width:fit-content; max-width:84%; gap:.18rem; padding:.52rem .65rem; border:1px solid var(--line); border-radius:.8rem .8rem .8rem .25rem; color:var(--text); background:var(--white); font-size:.59rem; line-height:1.48; box-shadow:0 .2rem .7rem rgba(18,63,60,.06); }
.message-drawer-bubble.is-me { align-self:flex-end; border-color:transparent; border-radius:.8rem .8rem .25rem .8rem; color:#fff; background:var(--primary); }
.message-drawer-bubble.is-system { align-self:center; width:fit-content; max-width:min(88%,21rem); gap:.1rem; padding:.34rem .46rem; border-color:rgba(35,117,113,.14); border-radius:.58rem; color:var(--muted); background:var(--surface); font-size:.52rem; line-height:1.35; text-align:left; box-shadow:none; }
.message-drawer-bubble.is-deleted-document,
.message-drawer-bubble.is-me.is-deleted-document { width:min(92%,18rem); padding:.4rem; border:1px dashed var(--line); color:var(--text); background:#fbfdfc; box-shadow:none; }
.message-drawer-bubble p { margin:0; }
.message-drawer-bubble ul,.message-drawer-bubble ol { margin:.25rem 0; padding-left:1.1rem; }
.message-drawer-bubble a { color:inherit; font-weight:750; text-decoration:underline; overflow-wrap:anywhere; }
.message-drawer-bubble time { justify-self:end; color:inherit; font-size:.45rem; opacity:.68; }
.message-drawer-bubble audio { width:min(16rem,100%); height:2.2rem; }
.message-drawer-bubble:has(.message-drawer-voice) { width:min(19rem,84%); padding:.52rem .68rem .34rem; }
.message-drawer-voice.voice-player { width:100%; min-width:0; }
.message-drawer-bubble.is-other .voice-waveform { color:var(--primary); background:rgba(35,117,113,.08); }
.message-drawer-bubble.is-other .voice-waveform::after { background:rgba(35,117,113,.16); }
.message-drawer-bubble.is-other .voice-speed { color:var(--primary); }
.message-drawer-bubble.is-me .voice-play { color:var(--primary); background:#fff; }
.message-drawer-bubble.is-me .voice-track>span { color:rgba(255,255,255,.72); }
.message-drawer-bubble.is-me .voice-waveform { color:#fff; background:rgba(255,255,255,.14); }
.message-drawer-bubble.is-me .voice-waveform::after { background:rgba(255,255,255,.18); }
.message-drawer-bubble.is-me .voice-speed { color:#fff; }
.message-drawer-document { display:flex; min-width:12rem; align-items:center; gap:.5rem; color:inherit; text-decoration:none!important; }
.message-drawer-document > span:first-child { font-size:1.1rem; }
.message-drawer-document > span:last-child { display:grid; min-width:0; }
.message-drawer-document strong { overflow:hidden; font-size:.57rem; text-overflow:ellipsis; white-space:nowrap; }
.message-drawer-document small { font-size:.46rem; opacity:.75; }
.message-drawer-composer { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:end; gap:.42rem; padding:.65rem .75rem; border-top:1px solid var(--line); background:var(--white); }
.message-drawer-composer > button,.message-drawer-tools button { display:grid; width:2.35rem; height:2.35rem; place-items:center; border:0; border-radius:.65rem; color:var(--primary); background:var(--mint-soft); cursor:pointer; }
.message-drawer-tools { display:flex; gap:.28rem; }
.message-drawer-tools button[hidden] { display:none!important; }
.message-drawer-composer > button[type="submit"] { color:#fff; background:var(--primary); }
.message-drawer-composer > button[type="submit"] svg { width:.95rem; height:.95rem; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.message-drawer-composer > button:hover,.message-drawer-tools button:hover { color:#fff; background:var(--primary-hover); }
.message-drawer-composer textarea { width:100%; min-height:2.35rem; max-height:6.5rem; resize:none; padding:.62rem .7rem; border:1px solid var(--line); border-radius:.7rem; outline:0; color:var(--ink); background:var(--surface); font:inherit; font-size:.58rem; }
.message-drawer-composer textarea:focus { border-color:rgba(35,117,113,.55); box-shadow:0 0 0 3px rgba(35,117,113,.1); }
.message-drawer-composer .media-picto { width:.92rem; height:.92rem; }
.message-drawer-unavailable { margin:.65rem .75rem 0; padding:.65rem; border-radius:.65rem; color:#8b3636; background:var(--danger-soft); font-size:.55rem; }
.message-drawer-feedback { min-height:.25rem; padding:0 .8rem; color:var(--danger); font-size:.52rem; }
.message-drawer-recording { display:grid; grid-template-columns:auto auto minmax(0,1fr) auto auto; align-items:center; gap:.55rem; padding:.65rem .75rem; border-top:1px solid var(--line); background:var(--white); }
.message-drawer-recording[hidden] { display:none!important; }
.message-drawer-recording button { display:grid; width:2rem; height:2rem; padding:0; place-items:center; border:1px solid var(--line); border-radius:.58rem; color:var(--coral); background:var(--surface); cursor:pointer; }
.message-drawer-recording button.is-send { color:#fff; border-color:var(--primary); background:var(--primary); }
.message-drawer-recording strong { color:var(--ink); font-size:.62rem; }
.message-drawer-recording time { color:var(--muted); font-size:.58rem; font-variant-numeric:tabular-nums; }
.recording-pulse { width:.55rem; height:.55rem; border-radius:50%; background:var(--coral); box-shadow:0 0 0 .2rem rgba(248,118,121,.14); animation:recording-pulse 1.2s ease infinite; }
@keyframes recording-pulse { 50% { opacity:.45; transform:scale(.82); } }
.message-drawer-full-link { display:flex; align-items:center; justify-content:space-between; padding:.55rem .8rem .7rem; color:var(--primary); font-size:.55rem; font-weight:750; text-decoration:none; }
.message-drawer-full-link:hover { color:var(--primary-hover); }
.message-drawer-documents { display:grid; min-height:0; grid-template-rows:auto minmax(0,1fr) auto; }
.message-drawer-documents-list { display:grid; align-content:start; gap:.45rem; overflow-y:auto; padding:.75rem; }
.message-drawer-documents-state { margin:0 .75rem .65rem; padding:.55rem .7rem; border:1px solid var(--line); border-radius:.62rem; color:var(--muted); background:var(--surface); font-size:.53rem; text-align:center; }
.message-drawer-documents-state[hidden] { display:none!important; }
.message-drawer-document-item { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:.55rem; padding:.65rem; border:1px solid var(--line); border-radius:.7rem; color:var(--text); background:var(--white); text-decoration:none; }
.message-drawer-document-item:hover { border-color:rgba(35,117,113,.35); color:var(--primary); background:var(--mint-soft); transform:translateY(-1px); }
.document-format-icon { --document-accent:#5c716e; --document-soft:#edf2f1; position:relative; display:grid; flex:0 0 2rem; width:2rem; height:2.25rem; grid-template-rows:minmax(0,1fr) auto; place-items:center; overflow:hidden; border-radius:.42rem; color:var(--document-accent); background:var(--document-soft); box-shadow:none; }
.document-format-icon.is-pdf { --document-accent:#c44747; --document-soft:#fbeaea; }
.document-format-icon.is-word { --document-accent:#326bab; --document-soft:#e8f1fb; }
.document-format-icon.is-image { --document-accent:#b47718; --document-soft:#fff2d9; }
.document-format-pictogram { position:static; align-self:center; width:1.12rem; height:1.12rem; margin:.12rem 0 0; fill:none; stroke:currentColor; stroke-width:1.55; stroke-linecap:round; stroke-linejoin:round; }
.document-format-icon small { position:relative; z-index:1; align-self:end; width:100%; margin:0; padding:.12rem .1rem; color:#fff; background:var(--document-accent); font-size:.32rem; font-weight:850; line-height:1; text-align:center; letter-spacing:.02em; }
.message-drawer-document > .document-format-icon { flex-basis:1.75rem; width:1.75rem; height:2rem; }
.message-drawer-document-item > .document-format-icon + span,
.message-drawer-document > .document-format-icon + span { min-width:0; }
.message-drawer-document-item > .document-format-icon + span { display:grid; gap:.1rem; }
.message-drawer-document-item > span:first-child { font-size:1.15rem; }
.message-drawer-document-item > span:last-child { display:grid; min-width:0; gap:.08rem; }
.message-drawer-document-item strong { overflow:hidden; color:var(--ink); font-size:.6rem; text-overflow:ellipsis; white-space:nowrap; }
.message-drawer-document-item small { color:var(--muted); font-size:.49rem; }
.message-drawer-document-item > .document-download { width:.85rem; height:.85rem; color:var(--primary); }
.message-drawer-document-actions { display:flex!important; min-width:auto!important; align-items:center; gap:.28rem!important; }
.message-drawer-document-actions > a,
.message-drawer-document-actions > button { display:grid; width:1.85rem; height:1.85rem; padding:0; place-items:center; border:1px solid var(--line); border-radius:.52rem; color:var(--primary); background:var(--mint-soft); cursor:pointer; }
.message-drawer-document-actions > button { color:var(--coral); background:rgba(248,118,121,.1); }
.message-drawer-document-actions > a:hover,
.message-drawer-document-actions > button:hover { border-color:currentColor; transform:translateY(-1px); }
.message-drawer-document-actions svg { width:.82rem; height:.82rem; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.message-drawer-document-item > .document-format-icon small,
.message-drawer-document > .document-format-icon small { color:#fff; font-size:.32rem; line-height:1; }
.message-drawer-document-item > .document-format-icon,
.message-drawer-document > .document-format-icon { color:var(--document-accent); background:var(--document-soft); box-shadow:none; }
.message-drawer-document-item > .document-format-icon small,
.message-drawer-document > .document-format-icon small { color:#fff; background:var(--document-accent); font-weight:900; }
.message-drawer-more { margin:.2rem .75rem .75rem; }
html[data-theme="dark"] .message-drawer-conversation-head,
html[data-theme="dark"] .message-drawer-documents-head,
html[data-theme="dark"] .message-drawer-composer,
html[data-theme="dark"] .message-drawer-recording,
html[data-theme="dark"] .message-drawer-document-item,
html[data-theme="dark"] .message-drawer-bubble { background:#102522; }
html[data-theme="dark"] .drawer-conversation-list-header { background:#102522; border-color:#31514b; }
html[data-theme="dark"] .message-drawer-quick-actions > * { color:var(--ink); background:#142927; }
html[data-theme="dark"] .message-drawer-quick-actions > *:hover,
html[data-theme="dark"] .message-drawer-quick-actions > *.is-active,
html[data-theme="dark"] .message-drawer-quick-actions > *.is-primary { color:#fff; background:#2b7f7a; }
html[data-theme="dark"] .message-drawer-messages { background:linear-gradient(180deg,#0d201e,#102522); }
html[data-theme="dark"] .message-drawer-bubble.is-me { color:#fff; background:#2b7f7a; }
html[data-theme="dark"] .message-drawer-bubble.is-system { color:var(--muted); background:#142927; }
html[data-theme="dark"] .message-drawer-bubble.is-deleted-document { color:var(--text); background:#142927; }
html[data-theme="dark"] .message-drawer-back,
html[data-theme="dark"] .message-drawer-documents-button { color:var(--ink); background:#142927; }
html[data-theme="dark"] .message-drawer-back:hover,
html[data-theme="dark"] .message-drawer-documents-button:hover,
html[data-theme="dark"] .message-drawer-document-item:hover { color:#d7f6f2; background:#193632; }
@media (max-width:520px) {
    .message-shell-panel { width:100%; }
    .message-drawer-documents-button span { display:none; }
    .message-drawer-quick-actions > * { width:1.85rem; height:1.85rem; }
}

/* Compact country chooser */
.iti__dropdown-content { font-size:.62rem; }
.iti__country-list { font-size:inherit; }
.iti__country { min-height:2.15rem; padding:.42rem .6rem; }
.iti__country-name,
.iti__dial-code { font-size:.62rem!important; line-height:1.25; }
.iti__dial-code { opacity:.72; }
.iti__search-input { min-height:2.35rem; padding:.52rem .65rem!important; font-size:.62rem!important; }
.iti__selected-dial-code { font-size:.66rem; }

/* Conversation filters and archive management */
.conversation-heading { display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
.conversation-filters { display:grid; grid-template-columns:1fr 1fr; gap:.4rem; margin-top:.55rem; }
.conversation-filters button {
    display:flex;
    min-height:2rem;
    align-items:center;
    justify-content:center;
    gap:.32rem;
    padding:.38rem .5rem;
    border:1px solid var(--line);
    border-radius:.58rem;
    color:var(--muted);
    background:var(--surface);
    font:inherit;
    font-size:.53rem;
    font-weight:750;
    cursor:pointer;
    transition:color .18s ease,background .18s ease,border-color .18s ease,transform .18s ease;
}
.conversation-filters button:hover { border-color:rgba(35,117,113,.35); color:var(--primary); background:var(--mint-soft); transform:translateY(-1px); }
.conversation-filters button.is-active { border-color:rgba(35,117,113,.35); color:var(--primary); background:var(--mint-soft); box-shadow:inset 0 0 0 1px rgba(35,117,113,.08); }
.conversation-filters svg { width:.75rem; height:.75rem; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.conversation-archive-dialog { width:min(calc(100% - 2rem),25rem); padding:0; border:0; border-radius:1rem; color:var(--text); background:transparent; box-shadow:0 1.5rem 4rem rgba(8,35,33,.28); }
.conversation-archive-dialog::backdrop { background:rgba(8,29,28,.55); backdrop-filter:blur(3px); }
.conversation-archive-card { display:grid; grid-template-columns:auto minmax(0,1fr); gap:.75rem; padding:1.05rem; border:1px solid var(--line); border-radius:1rem; background:var(--white); }
.conversation-archive-icon { display:grid; width:2.35rem; height:2.35rem; place-items:center; border-radius:.7rem; color:var(--primary); background:var(--mint-soft); }
.conversation-archive-icon svg { width:1.05rem; height:1.05rem; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.conversation-archive-card h2 { margin:.06rem 0 0; color:var(--ink); font-size:.82rem; }
.conversation-archive-card p { margin:.2rem 0 0; color:var(--muted); font-size:.58rem; line-height:1.5; }
.conversation-archive-card footer { display:flex; grid-column:1 / -1; justify-content:flex-end; gap:.5rem; padding-top:.25rem; }
html[data-theme="dark"] .conversation-filters button { color:var(--muted); background:#142927; }
html[data-theme="dark"] .conversation-filters button:hover,
html[data-theme="dark"] .conversation-filters button.is-active { color:#d7f6f2; background:#193632; }
html[data-theme="dark"] .conversation-archive-card { background:#142927; }

/* One document language in the full messenger and its header drawer */
.message-document > .document-format-icon,
.chat-document-item > .document-format-icon { display:grid; flex:0 0 2rem; width:2rem; height:2.25rem; grid-template-rows:minmax(0,1fr) auto; place-items:center; margin:0; overflow:hidden; color:var(--document-accent); background:var(--document-soft); font-size:inherit; line-height:1; white-space:normal; }
.message-document > .document-format-icon .document-format-pictogram,
.chat-document-item > .document-format-icon .document-format-pictogram { position:static; display:block; align-self:center; margin:.12rem 0 0; color:inherit; transform:none; }
.message-document > .document-format-icon small,
.chat-document-item > .document-format-icon small { position:relative; display:block; align-self:end; margin:0; padding:.12rem .1rem; color:#fff; background:var(--document-accent); font-size:.32rem; font-weight:900; line-height:1; }
html[data-theme="dark"] .document-dropzone { background:#102e2b; }
html[data-theme="dark"] .appointment-preview-drawer[data-state="cancelled"] .appointment-drawer-summary { background:#432727; }

@media (max-width:700px) {
    .psy-profile-facts { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .psy-profile-actions { justify-content:center; }
    .appointment-completed-actions { width:100%; }
    .appointment-completed-actions .button { width:100%; }
    .appointment-completed-details { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .first-message-card footer { display:grid; grid-template-columns:1fr; }
    .message-composer { grid-template-columns:auto minmax(0,1fr) auto; }
    .message-tool { width:2.2rem!important; height:2.2rem!important; }
    .voice-recording-panel { grid-template-columns:auto auto minmax(0,1fr) auto; }
    .voice-recording-panel .send { grid-column:1/-1; width:100%; }
    .document-upload-card > footer { display:grid; grid-template-columns:1fr; }
    .document-upload-card > footer .button { width:100%; }
}

/* Appointment recap and dashboard appointments */
.booking-recap-layout {
    display: grid;
    width: min(100%, 61rem);
    grid-template-columns: minmax(0, 1.55fr) minmax(15rem, .72fr);
    align-items: start;
    gap: 1rem;
    margin: 0 auto;
}

.booking-recap-layout .booking-recap {
    width: 100%;
    margin: 0;
    border-radius: 1rem;
    background: var(--white);
    box-shadow: 0 .7rem 2rem rgba(18, 63, 60, .055);
}

.booking-recap-practitioner {
    display: grid;
    grid-template-columns: 3rem minmax(0, 1fr) auto;
    align-items: center;
    gap: .75rem;
    padding: 1rem;
    border-bottom: 1px solid var(--line);
    background: linear-gradient(120deg, var(--mint-soft), var(--warm-white));
}

.booking-recap-practitioner > img,
.booking-recap-avatar {
    display: grid;
    width: 3rem;
    height: 3rem;
    place-items: center;
    border-radius: .8rem;
    color: #fff;
    background: var(--primary);
    object-fit: cover;
    font-size: .72rem;
    font-weight: 850;
}

.booking-recap-practitioner > div {
    display: grid;
    min-width: 0;
    gap: .05rem;
}

.booking-recap-practitioner small,
.booking-recap-practitioner span {
    color: var(--muted);
    font-size: .59rem;
}

.booking-recap-practitioner strong {
    overflow: hidden;
    color: var(--ink);
    font-size: .82rem;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.booking-recap-practitioner a {
    padding: .38rem .55rem;
    border: 1px solid var(--line);
    border-radius: .5rem;
    background: var(--white);
}

.booking-recap-grid,
.booking-recap-detailed > .booking-recap-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    padding: 0;
    border: 0;
}

.booking-recap-grid article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: .65rem;
    min-width: 0;
    padding: .9rem 1rem;
    border-bottom: 1px solid var(--line);
}

.booking-recap-grid article:nth-child(odd) {
    border-right: 1px solid var(--line);
}

.booking-recap-grid article:nth-last-child(-n+2) {
    border-bottom: 0;
}

.booking-recap-grid article > span:not(.booking-recap-picto) {
    display: grid;
    min-width: 0;
    gap: .1rem;
}

.booking-recap-grid article strong {
    overflow: hidden;
    font-size: .73rem;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.booking-recap-grid article button {
    padding: .3rem .42rem;
    border-radius: .42rem;
}

.booking-recap-grid article button:hover,
.booking-recap-practitioner a:hover {
    color: #fff;
    background: var(--primary);
}

.booking-recap-checkout {
    overflow: hidden;
    border: 1px solid rgba(35, 117, 113, .16);
    border-radius: 1rem;
    background: var(--white);
    box-shadow: 0 .7rem 2rem rgba(18, 63, 60, .055);
}

.booking-recap-secure {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .85rem 1rem;
    color: var(--primary);
    background: var(--mint-soft);
}

.booking-recap-secure > .media-picto {
    width: 1.15rem;
    height: 1.15rem;
}

.booking-recap-secure span {
    display: grid;
    gap: .05rem;
}

.booking-recap-secure strong {
    color: var(--ink);
    font-size: .64rem;
}

.booking-recap-secure small {
    color: var(--muted);
    font-size: .49rem;
}

.booking-recap-checkout .booking-recap-total {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: .8rem;
    padding: 1rem;
    border-bottom: 1px solid var(--line);
    background: transparent;
}

.booking-recap-checkout .booking-recap-total span {
    display: grid;
    gap: .08rem;
}

.booking-recap-checkout .booking-recap-total small,
.booking-recap-checkout .booking-recap-total em {
    color: var(--muted);
    font-size: .52rem;
    font-style: normal;
}

.booking-recap-checkout .booking-recap-total strong {
    color: var(--ink);
    font-size: 1.05rem;
}

.booking-recap-checkout .booking-payment-information {
    width: auto;
    margin: 0;
    padding: .9rem 1rem 1rem;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.booking-recap-checkout .booking-payment-information h3 {
    margin-bottom: .35rem;
    font-size: .64rem;
}

.booking-recap-checkout .booking-payment-information p {
    font-size: .6rem;
    line-height: 1.55;
}

.appointments-section .section-heading {
    background: linear-gradient(110deg, var(--warm-white), var(--white));
}

.dashboard-appointment-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: .65rem;
    padding: 1rem;
}

.dashboard-appointment-card {
    display: grid;
    position: relative;
    grid-template-columns: 4.25rem minmax(12rem, 1.2fr) minmax(15rem, 1fr) auto;
    align-items: center;
    gap: 1rem;
    min-width: 0;
    padding: .8rem .9rem;
    border: 1px solid rgba(116, 87, 65, .12);
    border-radius: 1rem;
    background: #fffdfb;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.dashboard-appointment-card.is-next {
    border-color: rgba(35, 117, 113, .22);
    background: linear-gradient(105deg, #fffaf5, #f4eee6);
    box-shadow: 0 .6rem 1.6rem rgba(82, 61, 45, .065);
}

.dashboard-appointment-card:hover {
    border-color: rgba(35, 117, 113, .28);
    box-shadow: 0 .75rem 1.8rem rgba(82, 61, 45, .08);
    transform: translateY(-2px);
}

.dashboard-appointment-date {
    display: grid;
    width: 4.25rem;
    min-height: 4.7rem;
    place-content: center;
    border-radius: .72rem;
    color: var(--primary);
    background: var(--mint-soft);
    text-align: center;
}

.dashboard-appointment-date strong {
    color: var(--ink);
    font-size: 1.35rem;
    line-height: 1;
}

.dashboard-appointment-date span,
.dashboard-appointment-date small {
    margin-top: .12rem;
    font-size: .48rem;
    font-weight: 850;
    letter-spacing: .055em;
}

.dashboard-appointment-main {
    display: flex;
    position: relative;
    min-width: 0;
    align-items: center;
    gap: .7rem;
    padding-top: 0;
}

.dashboard-appointment-card.is-next .dashboard-appointment-main {
    padding-top: .72rem;
}

.dashboard-next-label {
    position: absolute;
    top: -.1rem;
    left: 0;
    color: var(--primary);
    font-size: .46rem;
    font-weight: 850;
    letter-spacing: .075em;
    text-transform: uppercase;
}

.dashboard-appointment-main .status-pill {
    margin-left: auto;
}

.dashboard-appointment-practitioner {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: .55rem;
}

.dashboard-appointment-practitioner > span {
    display: grid;
    width: 2.35rem;
    height: 2.35rem;
    flex: none;
    place-items: center;
    overflow: hidden;
    border-radius: .58rem;
    color: #fff;
    background: var(--primary);
    font-size: .55rem;
    font-weight: 850;
}

.dashboard-appointment-practitioner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dashboard-appointment-practitioner div {
    display: grid;
    min-width: 0;
}

.dashboard-appointment-practitioner small {
    color: var(--muted);
    font-size: .54rem;
}

.dashboard-appointment-practitioner strong {
    overflow: hidden;
    color: var(--ink);
    font-size: .8rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-appointment-meta {
    display: flex;
    align-items: center;
    gap: 0;
}

.dashboard-appointment-meta > span {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: .55rem;
    padding: .15rem .9rem;
}

.dashboard-appointment-meta > span:first-child {
    padding-left: 0;
}

.dashboard-appointment-meta > span + span {
    border-left: 1px solid var(--line);
}

.dashboard-appointment-meta i {
    display: grid;
    width: 2rem;
    height: 2rem;
    flex: 0 0 2rem;
    place-items: center;
    border-radius: .58rem;
    color: var(--primary);
    background: var(--mint-soft);
    font-style: normal;
}

.dashboard-appointment-meta i .media-picto {
    width: .82rem;
    height: .82rem;
}

.dashboard-appointment-meta > span > span {
    display: grid;
    min-width: 0;
    gap: .06rem;
}

.dashboard-appointment-meta strong {
    color: var(--ink);
    font-size: .65rem;
    white-space: nowrap;
}

.dashboard-appointment-meta small {
    color: var(--muted);
    font-size: .47rem;
    font-weight: 700;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.dashboard-appointment-meta em {
    color: var(--muted);
    font-size: .53rem;
    font-style: normal;
    font-weight: 600;
}

.dashboard-appointment-actions {
    display: flex;
    align-items: center;
    gap: .35rem;
}

.dashboard-appointment-actions .button {
    min-height: 2.55rem;
    padding: .62rem .8rem;
    font-size: .62rem;
}

.dashboard-appointment-card .status-pill {
    font-size: .55rem;
}

.dashboard-appointment-actions .media-picto {
    width: .75rem;
    height: .75rem;
}

html[data-theme="dark"] .booking-recap-layout .booking-recap,
html[data-theme="dark"] .booking-recap-checkout,
html[data-theme="dark"] .dashboard-appointment-card {
    background: #102522;
}

html[data-theme="dark"] .booking-recap-practitioner,
html[data-theme="dark"] .appointments-section .section-heading {
    background: linear-gradient(120deg, #18332f, #142927);
}

html[data-theme="dark"] .dashboard-appointment-card.is-next {
    background: linear-gradient(105deg, #18332f, #142927);
}

@media (max-width:900px) {
    .booking-recap-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width:980px) {
    .dashboard-appointment-card {
        grid-template-columns: 3.6rem minmax(0, 1fr) auto;
    }

    .dashboard-appointment-date {
        width: 3.6rem;
    }

    .dashboard-appointment-meta {
        grid-column: 2;
    }

    .dashboard-appointment-actions {
        grid-column: 3;
        grid-row: 1 / 3;
    }
}

@media (max-width:680px) {
    .booking-recap-grid,
    .booking-recap-detailed > .booking-recap-grid {
        grid-template-columns: 1fr;
    }

    .booking-recap-grid article,
    .booking-recap-grid article:nth-child(odd),
    .booking-recap-grid article:nth-last-child(-n+2) {
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }

    .booking-recap-grid article:last-child {
        border-bottom: 0;
    }

    .dashboard-appointment-card {
        grid-template-columns: 3rem minmax(0, 1fr);
        align-items: start;
        gap: .7rem;
    }

    .dashboard-appointment-date {
        grid-row: 1 / 2;
        width: 3rem;
    }

    .dashboard-appointment-main,
    .dashboard-appointment-meta,
    .dashboard-appointment-actions {
        grid-column: 2;
    }

    .dashboard-appointment-actions {
        grid-row: auto;
        justify-content: flex-start;
    }

    .dashboard-appointment-main {
        align-items: flex-end;
        flex-wrap: wrap;
    }

    .dashboard-appointment-main .status-pill {
        margin-left: 0;
    }

    .dashboard-appointment-meta {
        align-items: flex-start;
        flex-direction: column;
        gap: .45rem;
    }

    .dashboard-appointment-meta > span {
        width: 100%;
        padding: 0;
    }

    .dashboard-appointment-meta > span + span {
        padding-top: .45rem;
        border-top: 1px solid var(--line);
        border-left: 0;
    }
}

/* Dashboard information, navigation tabs and primary drawer action */
.dashboard-page-intro { align-items:center; }
.dashboard-add-appointment .media-picto { width:.78rem; height:.78rem; }

.dashboard-announcements {
    display:grid;
    gap:.55rem;
    margin-top:.85rem;
}

.dashboard-announcement {
    display:flex;
    align-items:flex-start;
    gap:.75rem;
    padding:.82rem .95rem;
    border:1px solid rgba(35,117,113,.18);
    border-radius:.85rem;
    background:linear-gradient(105deg,#f4eee6,#fffaf5 68%);
    box-shadow:0 .4rem 1.4rem rgba(82,61,45,.045);
}

.dashboard-announcement-icon {
    display:grid;
    width:2.15rem;
    height:2.15rem;
    flex:0 0 2.15rem;
    place-items:center;
    border-radius:.62rem;
    color:#fff;
    background:var(--primary);
}

.dashboard-announcement-icon .media-picto { width:.9rem; height:.9rem; }
.dashboard-announcement > div { display:grid; min-width:0; gap:.13rem; }
.dashboard-announcement > div > span { color:var(--primary); font-size:.46rem; font-weight:850; letter-spacing:.075em; text-transform:uppercase; }
.dashboard-announcement p { margin:0; color:var(--ink); font-size:.64rem; line-height:1.55; overflow-wrap:anywhere; }

.dashboard-section { box-shadow:0 .7rem 2.2rem rgba(82,61,45,.055); }
.dashboard-section .section-heading > a {
    display:inline-flex;
    align-items:center;
    gap:.3rem;
    padding:.4rem .55rem;
    border-radius:.55rem;
    text-decoration:none;
}
.dashboard-section .section-heading > a:hover { color:var(--primary); background:var(--mint-soft); text-decoration:none; }
.practitioner-card { transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease; }
.practitioner-card:hover { border-color:rgba(35,117,113,.24); box-shadow:0 .55rem 1.4rem rgba(18,63,60,.07); transform:translateY(-2px); }
.practitioner-card > a { transition:color .18s ease,background .18s ease,transform .18s ease; }
.practitioner-card:hover > a { color:#fff; background:var(--primary); transform:translateX(2px); }

.psy-drawer-tabs button,
.psy-profile-tabs button,
.appointment-tabs button {
    position:relative;
    border:0;
}

.psy-drawer-tabs button::after,
.psy-profile-tabs button::after,
.appointment-tabs button::after {
    content:"";
    position:absolute;
    right:50%;
    bottom:0;
    left:50%;
    height:2px;
    border-radius:2px 2px 0 0;
    background:var(--primary);
    transition:left .18s ease,right .18s ease,opacity .18s ease;
    opacity:0;
}

.psy-drawer-tabs button:hover,
.psy-profile-tabs button:hover,
.appointment-tabs button:hover {
    color:var(--primary);
    background:transparent;
    box-shadow:none;
    filter:none;
    transform:none;
}

.psy-drawer-tabs button:hover::after,
.psy-profile-tabs button:hover::after,
.appointment-tabs button:hover::after { right:27%; left:27%; opacity:.45; }

.psy-drawer-tabs button.is-active::after,
.psy-profile-tabs button.is-active::after,
.appointment-tabs button.is-active::after { right:0; left:0; opacity:1; }

.appointment-drawer-access {
    order:-1;
    min-height:3rem;
    flex-basis:100%!important;
    justify-content:center;
    gap:.45rem;
    border-color:transparent;
    background:linear-gradient(135deg,var(--primary),#2f8a84);
    box-shadow:0 .55rem 1.35rem rgba(35,117,113,.2);
    font-size:.66rem!important;
}
.appointment-drawer-access .media-picto { width:.9rem; height:.9rem; }
.appointment-drawer-access:hover { border-color:transparent; background:linear-gradient(135deg,#1c6561,var(--primary)); box-shadow:0 .7rem 1.55rem rgba(35,117,113,.26)!important; }

html[data-theme="dark"] .dashboard-announcement { border-color:#31514b; background:linear-gradient(105deg,#302c25,#142927 70%); }
html[data-theme="dark"] .dashboard-announcement p { color:var(--text); }
html[data-theme="dark"] .practitioner-card:hover { border-color:#3b625b; background:#17322e; }

@media(max-width:700px) {
    .dashboard-page-intro { align-items:flex-start; }
    .dashboard-announcement { padding:.75rem; }
    .dashboard-section .section-heading > a { padding:.35rem; }
}

/* Appointment modification and cancellation */
.appointment-cancel-open,
.appointment-drawer-cancel {
    width:100%;
    justify-content:center;
    border:1px solid rgba(164,75,75,.2);
    color:#934441;
    background:#fff5f3;
}
.appointment-cancel-open { margin-top:.55rem; }
.appointment-cancel-open:hover,
.appointment-drawer-cancel:hover { border-color:rgba(164,75,75,.36); color:#fff; background:#a44b4b; }
.appointment-cancel-open .media-picto,
.appointment-drawer-cancel .media-picto { width:.8rem; height:.8rem; }

.appointment-cancel-dialog {
    width:min(calc(100% - 2rem),31rem);
    padding:0;
    border:0;
    border-radius:1.05rem;
    color:var(--text);
    background:transparent;
    box-shadow:0 1.5rem 4rem rgba(8,35,33,.28);
}
.appointment-cancel-dialog::backdrop { background:rgba(8,29,28,.57); backdrop-filter:blur(3px); }
.appointment-cancel-card { overflow:hidden; border:1px solid var(--line); border-radius:1.05rem; background:var(--white); }
.appointment-cancel-card > header { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:.7rem; padding:1rem 1.05rem; border-bottom:1px solid var(--line); }
.appointment-cancel-card > header > div { display:grid; gap:.08rem; }
.appointment-cancel-card h2 { margin:0; color:var(--ink); font-size:.88rem; }
.appointment-cancel-card header p { margin:0; color:var(--muted); font-size:.52rem; }
.appointment-cancel-icon { display:grid; width:2.45rem; height:2.45rem; place-items:center; border-radius:.72rem; color:#934441; background:#fbe8e6; }
.appointment-cancel-icon .media-picto { width:1.05rem; height:1.05rem; }
.appointment-cancel-body { display:grid; gap:.65rem; padding:1rem 1.05rem; }
.appointment-cancel-warning,
.appointment-cancel-refund,
.appointment-cancel-alternative { display:flex; align-items:flex-start; gap:.6rem; padding:.7rem .75rem; border-radius:.72rem; }
.appointment-cancel-warning { color:#805f24; background:#fff5dd; }
.appointment-cancel-refund { color:var(--primary); background:var(--mint-soft); }
.appointment-cancel-alternative { color:var(--text); background:var(--surface); }
.appointment-cancel-warning > .media-picto,
.appointment-cancel-refund > .media-picto,
.appointment-cancel-alternative > .media-picto { width:.95rem; height:.95rem; flex:0 0 .95rem; margin-top:.08rem; }
.appointment-cancel-warning p,
.appointment-cancel-refund p,
.appointment-cancel-alternative p { margin:0; font-size:.57rem; line-height:1.5; }
.appointment-cancel-alternative > div { display:grid; gap:.12rem; }
.appointment-cancel-alternative strong { color:var(--ink); font-size:.59rem; }
.appointment-cancel-feedback { min-height:.8rem; margin:0; font-size:.56rem; line-height:1.4; text-align:center; }
.appointment-cancel-feedback.is-error { color:var(--danger); }
.appointment-cancel-feedback.is-success { color:var(--success); }
.appointment-cancel-card > footer { display:flex; justify-content:flex-end; gap:.5rem; padding:.8rem 1.05rem; border-top:1px solid var(--line); background:var(--surface); }
.appointment-cancel-card > footer .button { min-width:8.5rem; }
.appointment-cancel-card > footer .button-danger:disabled { cursor:not-allowed; opacity:.58; transform:none; }

html[data-theme="dark"] .appointment-cancel-open,
html[data-theme="dark"] .appointment-drawer-cancel { color:#ffaaa6; background:#432727; border-color:#6d3d3b; }
html[data-theme="dark"] .appointment-cancel-card { background:#142927; }
html[data-theme="dark"] .appointment-cancel-card > footer,
html[data-theme="dark"] .appointment-cancel-alternative { background:#102522; }
html[data-theme="dark"] .appointment-cancel-warning { color:#f0cc82; background:#3b301c; }
html[data-theme="dark"] .appointment-cancel-refund { color:#9edbd5; background:#193632; }

@media(max-width:560px) {
    .appointment-cancel-card > footer { display:grid; grid-template-columns:1fr; }
    .appointment-cancel-card > footer .button { width:100%; }
}

/* Secure booking checkout */
.booking-payment-shell { display:grid; gap:.7rem; max-width:47rem; margin:0 auto .75rem; }
.payment-section-title { display:flex; align-items:end; justify-content:space-between; margin-bottom:.45rem; }
.payment-section-title span { color:var(--ink); font-size:.72rem; font-weight:800; }
.payment-section-title small { color:var(--muted); font-size:.5rem; }
.payment-saved-list,.payment-methods { display:grid; gap:.5rem; }
.payment-method { position:relative; display:grid; grid-template-columns:auto auto minmax(0,1fr) auto; align-items:center; gap:.65rem; min-height:3.8rem; padding:.65rem .75rem; border:1px solid var(--line); border-radius:.82rem; color:var(--text); background:var(--white); cursor:pointer; transition:border-color .2s,background .2s,box-shadow .2s,transform .2s; }
.payment-method:hover { border-color:rgba(35,117,113,.36); background:var(--mint-soft); transform:translateY(-1px); }
.payment-method.is-selected { border-color:var(--primary); background:#f1fbf9; box-shadow:0 0 0 2px rgba(35,117,113,.1); }
.payment-method > input { width:1rem; height:1rem; margin:0; accent-color:var(--primary); }
.payment-method > span:nth-of-type(2) { display:grid; gap:.08rem; }
.payment-method strong { color:var(--ink); font-size:.62rem; }
.payment-method small { color:var(--muted); font-size:.49rem; }
.payment-brand { display:grid; width:2.45rem; height:2.2rem; place-items:center; border-radius:.6rem; color:var(--primary); background:var(--mint-soft); }
.payment-brand .media-picto { width:1.15rem; height:1.15rem; }
.payment-brand-paypal { color:#003087; background:#edf3ff; font-size:1rem; font-weight:900; font-style:italic; }
.payment-brand-google i { color:#4285f4; font-size:1rem; font-weight:900; font-style:normal; }
.payment-brand-apple { color:#111; background:#f2f2f2; font-size:1.05rem; }
.payment-card-marks { display:flex; align-items:center; flex-shrink:0; gap:.32rem; margin-left:auto; }
.payment-card-marks .payment-mark,.saved-card-brand { display:grid; min-width:2.05rem; height:1.35rem; padding:0 .22rem; place-items:center; box-sizing:border-box; border:1px solid #d5dfdf; border-radius:.28rem; color:#163f57; background:#fff; font-size:.47rem; font-weight:900; font-style:normal; line-height:1; letter-spacing:-.02em; }
.payment-card-marks .payment-mark-cb { border:0; color:#fff; background:linear-gradient(135deg,#1a6fa5 0 56%,#168973 56% 100%); letter-spacing:-.06em; }
.payment-card-marks .payment-mark-visa { color:#143b8f; }
.payment-card-marks .payment-mark-amex { display:grid; grid-template-columns:1fr 1fr; min-width:2.25rem; padding:0 .18rem; border-color:#b8d5e8; color:#fff; background:#2776a7; font-size:.4rem; letter-spacing:-.05em; }
.payment-card-marks .payment-mark-amex span { display:block; color:inherit; font:inherit; line-height:1; }
.payment-card-marks .payment-mark-mastercard,.saved-card-brand.mastercard { position:relative; display:block; min-width:2.05rem; width:2.05rem; height:1.35rem; padding:0; border:1px solid #d5dfdf; border-radius:.28rem; background:#fff; }
.payment-card-marks .payment-mark-mastercard u,.saved-card-brand.mastercard i { position:absolute; top:50%; width:.86rem; height:.86rem; border-radius:50%; background:#eb001b; transform:translateY(-50%); }
.payment-card-marks .payment-mark-mastercard u:first-child,.saved-card-brand.mastercard i:first-child { left:.28rem; }.payment-card-marks .payment-mark-mastercard u:last-child,.saved-card-brand.mastercard i:last-child { right:.28rem; background:#f79e1b; opacity:.9; }
.payment-card-method-group { display:grid; gap:0; }
.payment-card-method-group .booking-payment-card { width:100%; max-width:none; margin:.45rem 0 0; }
.payment-card-method-group.is-open .payment-method { border-color:rgba(31,126,121,.4); box-shadow:0 8px 22px rgba(17,72,68,.07); }
.payment-method.is-selected { animation:payment-method-selected .24s ease-out; }
.booking-payment-card { opacity:0; transform:translateY(-.45rem) scale(.992); transform-origin:top center; transition:opacity .2s ease,transform .22s ease,border-color .2s ease; }
.booking-payment-card.is-visible { opacity:1; transform:none; }
.booking-payment-card label > span:first-child { font-size:.68rem; font-weight:750; }
.booking-payment-card label > small { margin-top:-.08rem; color:var(--muted); font-size:.56rem; }
.booking-payment-card .payment-card-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.72fr); gap:.7rem; }
.booking-payment-card .payment-input-wrap { display:block; position:relative; }
.booking-payment-card .payment-input-wrap input { width:100%; min-height:3rem; padding:.72rem 2.55rem .72rem 2.35rem; border:1px solid #cddbd8; border-radius:.72rem; color:var(--ink); background:var(--white); font-size:.76rem; font-weight:650; letter-spacing:.035em; outline:0; transition:border-color .18s ease,box-shadow .18s ease,background .18s ease; }
.booking-payment-card .payment-input-wrap input::placeholder { color:#91a29f; font-weight:500; letter-spacing:.02em; }
.booking-payment-card .payment-input-wrap:focus-within input { border-color:var(--primary); background:#fff; box-shadow:0 0 0 3px rgba(35,117,113,.12); }
.booking-payment-card .payment-input-wrap .media-picto { left:.82rem; width:1rem; height:1rem; pointer-events:none; }
.payment-detected-brand { position:absolute; top:50%; right:.65rem; display:grid; min-width:2rem; height:1.3rem; padding:0 .28rem; place-items:center; border-radius:.3rem; color:#fff!important; background:#237571; font-size:.45rem!important; font-weight:900!important; transform:translateY(-50%); }
.payment-detected-brand[data-brand="visa"] { color:#143b8f!important; background:#fff; border:1px solid #d5dfdf; }
.payment-detected-brand[data-brand="mastercard"] { background:#e95b36; }
.payment-detected-brand[data-brand="amex"] { background:#2776a7; }
@keyframes payment-method-selected { from { transform:scale(.992); } 60% { transform:scale(1.006); } to { transform:none; } }
.booking-availability { display:flex; align-items:center; justify-content:center; gap:.4rem; width:max-content; max-width:100%; margin:.55rem auto 0; padding:.4rem .68rem; border:1px solid rgba(31,126,121,.22); border-radius:999px; color:var(--primary); background:var(--mint-soft); font-size:.68rem; }
.booking-availability > span { width:.42rem; height:.42rem; flex:0 0 auto; border-radius:50%; background:currentColor; box-shadow:0 0 0 .18rem rgba(31,126,121,.1); }
.booking-availability strong { font-size:inherit; font-weight:650; }
.booking-availability.is-checking > span { animation:booking-availability-pulse 1s ease-in-out infinite; }
.booking-availability.is-unavailable { border-color:#efc4bf; color:#9c413b; background:#fff0ee; }
.booking-days label.is-unavailable { opacity:.42; cursor:not-allowed; text-decoration:line-through; }
@keyframes booking-availability-pulse { 50% { opacity:.35; transform:scale(.72); } }
html[data-theme="dark"] .booking-availability { border-color:#315b56; background:#173632; } html[data-theme="dark"] .booking-availability.is-unavailable { border-color:#754743; color:#ffaaa1; background:#3a2423; }
.payment-saved-card { grid-template-columns:auto auto minmax(0,1fr) auto; }
.payment-remove-card { display:grid; width:1.8rem; height:1.8rem; padding:0; place-items:center; border:1px solid transparent; border-radius:.5rem; color:#a44b4b; background:transparent; cursor:pointer; }
.payment-remove-card:hover { border-color:#efcfcb; background:#fff0ee; }
.payment-divider { display:flex; align-items:center; gap:.55rem; margin:.65rem 0; color:var(--muted); font-size:.48rem; }
.payment-divider::before,.payment-divider::after { content:""; height:1px; flex:1; background:var(--line); }
.booking-payment-card { display:grid; gap:.62rem; padding:.85rem; border:1px solid var(--line); border-radius:.9rem; background:#fffaf6; }
.booking-payment-card[hidden] { display:none; }
.payment-card-heading { display:flex; justify-content:space-between; gap:.8rem; }.payment-card-heading span:first-child { color:var(--ink); font-size:.67rem; font-weight:800; }.payment-card-heading span:last-child { color:var(--muted); font-size:.48rem; }
.payment-input-wrap { position:relative; }.payment-input-wrap .media-picto { position:absolute; left:.7rem; top:50%; width:.9rem; height:.9rem; color:var(--primary); transform:translateY(-50%); }.payment-input-wrap input { padding-left:2.15rem; }
.payment-save-card { display:flex!important; flex-direction:row!important; align-items:center; gap:.45rem; color:var(--text); font-size:.52rem; }.payment-save-card input { width:1rem; height:1rem; accent-color:var(--primary); }
.payment-security-note { display:flex; align-items:center; justify-content:center; gap:.5rem; padding:.58rem; color:var(--primary); }.payment-security-note .media-picto { width:.9rem; height:.9rem; }.payment-security-note span { display:grid; gap:.05rem; }.payment-security-note strong { font-size:.54rem; }.payment-security-note small { color:var(--muted); font-size:.45rem; }
.booking-payment-note.is-error { color:#a44b4b; background:#fff0ee; }
.payment-result-card { display:grid; justify-items:center; gap:.55rem; max-width:44rem; margin:4rem auto; padding:2.2rem; border:1px solid var(--line); border-radius:1.2rem; text-align:center; background:var(--white); box-shadow:var(--shadow); }.payment-result-icon { display:grid; width:3.5rem; height:3.5rem; place-items:center; border-radius:1rem; color:var(--primary); background:var(--mint-soft); }.payment-result-card.is-error .payment-result-icon { color:#a44b4b; background:#fbe9e7; font-size:1.5rem; }.payment-result-icon .media-picto { width:1.5rem; height:1.5rem; }.payment-result-card h1,.payment-result-card p { margin:0; }.payment-result-card h1 { font-size:1.35rem; }.payment-result-card p { max-width:32rem; color:var(--muted); font-size:.65rem; }.payment-result-card > div { display:flex; gap:.5rem; margin-top:.45rem; }
html[data-theme="dark"] .payment-method,html[data-theme="dark"] .booking-payment-card,html[data-theme="dark"] .payment-result-card { color:var(--text); background:#142927; border-color:#31504c; } html[data-theme="dark"] .payment-method.is-selected { background:#193632; } html[data-theme="dark"] .payment-method:hover { background:#1d3b37; } html[data-theme="dark"] .payment-brand-apple { color:#fff; background:#273a38; } html[data-theme="dark"] .booking-payment-card .payment-input-wrap input { color:var(--text); background:#102522; border-color:#3c5b57; } html[data-theme="dark"] .booking-payment-card .payment-input-wrap:focus-within input { background:#17322f; }
@media(max-width:620px){.payment-method{grid-template-columns:auto auto minmax(0,1fr)}.payment-card-method-group .payment-method{grid-template-columns:auto minmax(0,1fr)}.payment-card-marks{grid-column:2;justify-self:start;flex-wrap:wrap;margin:.15rem 0 0}.payment-card-heading{display:grid}.booking-payment-card .payment-card-row{grid-template-columns:1fr}.payment-result-card>div{display:grid;width:100%}}
@media(prefers-reduced-motion:reduce){.payment-method.is-selected{animation:none}.booking-payment-card{transition:none}}

/* Final dark-mode surface corrections */
.booking-panel[data-booking-panel="0"] { min-height:0; }

html[data-theme="dark"] .messages-shell .conversation-item {
    border-bottom-color:#284640;
    background:#102522;
    transition:background .18s ease,box-shadow .18s ease,color .18s ease;
}
html[data-theme="dark"] .messages-shell .conversation-item:hover {
    color:var(--text);
    background:#1b3b37;
    box-shadow:inset 3px 0 #3b9a93;
}
html[data-theme="dark"] .messages-shell .conversation-item.is-active {
    color:var(--text);
    background:#214640;
    box-shadow:inset 3px 0 #65b9b1;
}

html[data-theme="dark"] .message.sent .message-document,
html[data-theme="dark"] .message.received .message-document {
    border:1px solid #355650;
    color:var(--text);
    background:#17322f;
}
html[data-theme="dark"] .message.sent .message-document:hover,
html[data-theme="dark"] .message.received .message-document:hover {
    border-color:#47736c;
    background:#1d3d39;
}
html[data-theme="dark"] .message-document strong { color:var(--ink); }
html[data-theme="dark"] .message-document small { color:var(--muted); }
html[data-theme="dark"] .message-document .document-download { color:#8fd0ca; }

html[data-theme="dark"] .practitioners-section .practitioner-card {
    border-color:#2d4d48;
    color:var(--text);
    background:#102522;
}
html[data-theme="dark"] .practitioners-section .practitioner-card:hover {
    border-color:#47736c;
    background:#193632;
    box-shadow:0 .55rem 1.4rem rgba(0,0,0,.18);
}

html[data-theme="dark"] .invoices-table tbody td {
    border-top-color:#31514b;
    border-bottom-color:#31514b;
    color:var(--text);
    background:#102522;
}
html[data-theme="dark"] .invoices-table tbody td:first-child { border-left-color:#31514b; }
html[data-theme="dark"] .invoices-table tbody td:last-child { border-right-color:#31514b; }
html[data-theme="dark"] .invoices-table tbody tr:hover td { background:#193632; }
html[data-theme="dark"] .invoice-download {
    border-color:#3b625b;
    color:#a9ddd8;
    background:#193632;
}
html[data-theme="dark"] .invoice-download:hover { color:#fff; background:#2b7f7a; }

.activity-timeline .activity-marker,
.activity-timeline article.activity-created .activity-marker,
.activity-timeline article.activity-cancelled .activity-marker,
.activity-timeline article.activity-completed .activity-marker { color:#fff; }
.activity-timeline .activity-marker .media-picto { display:block; width:.88rem; height:.88rem; stroke:currentColor; }

/* Theme picker, compact activities and remaining themed surfaces */
.theme-picker { position:relative; }
.theme-icon-system,.theme-icon-light,.theme-icon-dark { display:none; }
html[data-theme-choice="system"] .theme-icon-system,
html[data-theme-choice="light"] .theme-icon-light,
html[data-theme-choice="dark"] .theme-icon-dark { display:block; }
html[data-theme-choice="system"] .theme-icon-light,
html[data-theme-choice="system"] .theme-icon-dark,
html[data-theme-choice="light"] .theme-icon-system,
html[data-theme-choice="light"] .theme-icon-dark,
html[data-theme-choice="dark"] .theme-icon-system,
html[data-theme-choice="dark"] .theme-icon-light { display:none; }
.theme-menu { position:absolute; z-index:90; top:calc(100% + .55rem); right:0; display:grid; width:14rem; gap:.18rem; padding:.5rem; border:1px solid var(--line); border-radius:.85rem; color:var(--text); background:var(--white); box-shadow:0 1rem 2.5rem rgba(18,63,60,.16); }
.theme-menu[hidden] { display:none; }
.theme-menu > span { padding:.25rem .45rem .38rem; color:var(--muted); font-size:.52rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.theme-menu button { display:grid; width:100%; grid-template-columns:2rem minmax(0,1fr) auto; gap:.55rem; align-items:center; padding:.5rem; border:0; border-radius:.62rem; color:var(--text); background:transparent; text-align:left; cursor:pointer; }
.theme-menu button:hover { color:var(--ink); background:var(--mint-soft); }
.theme-menu button > i { display:grid; width:2rem; height:2rem; place-items:center; border-radius:.52rem; color:var(--primary); background:var(--mint-soft); font-style:normal; }
.theme-menu button > i .media-picto { width:.9rem; height:.9rem; }
.theme-menu button > span { display:grid; gap:0; }
.theme-menu strong { color:var(--ink); font-size:.62rem; }
.theme-menu small { color:var(--muted); font-size:.48rem; }
.theme-menu b { visibility:hidden; color:var(--primary); font-size:.68rem; }
.theme-menu button.is-active { background:var(--mint-soft); }
.theme-menu button.is-active b { visibility:visible; }
html[data-theme="dark"] .theme-menu { background:#142927; box-shadow:0 1rem 2.5rem rgba(0,0,0,.3); }
html[data-theme="dark"] .theme-menu button:hover,
html[data-theme="dark"] .theme-menu button.is-active { background:#21433f; }

.top-directory-filters { position:relative; z-index:2; overflow:visible; }
.advanced-filters { border-radius:0 0 calc(1rem - 1px) calc(1rem - 1px); }
.advanced-filters[open] .advanced-filter-grid { border-bottom:1px solid var(--line); border-radius:0 0 calc(1rem - 1px) calc(1rem - 1px); background:inherit; }
html[data-theme="dark"] *,html[data-theme="dark"] *::before,html[data-theme="dark"] *::after { box-shadow:none!important; text-shadow:none!important; }
/* Echelle de lecture coherente : tableau de bord, factures et prise de rendez-vous. */
.booking-practitioner span,.booking-practitioner p { font-size:.72rem; }
.booking-progress strong { font-size:.72rem; }
.booking-panel>header p { font-size:.8rem; }
.booking-panel>h3 { font-size:.9rem; }
.booking-day h3 { font-size:.8rem; }
.booking-day label span { font-size:.72rem; }
.booking-choice strong { font-size:.84rem; }
.booking-choice small { font-size:.68rem; }
.booking-recap span { font-size:.74rem; }
.booking-recap strong { font-size:.78rem; }
.payment-card-heading { font-size:.76rem; }
.payment-card-heading span:last-child { font-size:.64rem; }
.booking-payment-card label span { font-size:.7rem; }
.booking-payment-card input { font-size:.76rem; }
.booking-consent,.booking-validation { font-size:.72rem; }
.booking-payment-note,.booking-empty p { font-size:.7rem; }
.invoices-card h2 { font-size:.96rem; }
.invoices-card header p,.invoices-empty p { font-size:.72rem; }
.invoices-table th { font-size:.62rem; }
.invoices-table td { font-size:.74rem; }
.invoice-type { font-size:.66rem; }
.dashboard-empty p { font-size:.74rem; }
.dashboard-appointment-date span,.dashboard-appointment-date small { font-size:.56rem; }
.dashboard-next-label { font-size:.54rem; }
.dashboard-appointment-practitioner small { font-size:.64rem; }
.dashboard-appointment-practitioner strong { font-size:.88rem; }
.dashboard-appointment-meta strong { font-size:.72rem; }
.dashboard-appointment-meta small { font-size:.54rem; }
.dashboard-appointment-meta em { font-size:.62rem; }
.dashboard-appointment-card .status-pill { font-size:.62rem; }
.dashboard-appointment-actions .button { font-size:.68rem; }
.practitioner-grid { gap:1rem; padding:1rem; }
.practitioner-card { grid-template-columns:5.25rem minmax(0,1fr); gap:.85rem 1rem; align-items:start; padding:1rem; border-radius:1rem; background:linear-gradient(135deg,#fffdfb,#f5faf8); }
.practitioner-avatar { position:relative; display:grid; grid-row:1 / span 2; width:5.25rem; height:5.25rem; overflow:hidden; place-items:center; border-radius:.9rem; color:#fff; background:linear-gradient(145deg,var(--primary),#174f4c); font-size:.9rem; font-weight:800; }
.practitioner-avatar img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
.practitioner-avatar::after { position:absolute; right:0; bottom:0; left:0; height:48%; background:linear-gradient(transparent,rgba(3,20,18,.78)); content:''; pointer-events:none; }
.practitioner-avatar b { position:relative; z-index:1; font:inherit; }
.practitioner-session-count { position:absolute; z-index:2; right:.35rem; bottom:.35rem; left:.35rem; overflow:hidden; color:#fff!important; font-size:.56rem!important; font-weight:800!important; line-height:1.25; text-align:center; text-overflow:ellipsis; text-shadow:0 1px 2px rgba(0,0,0,.35); white-space:nowrap; }
.practitioner-card-copy { display:grid; align-content:center; min-height:5.25rem; }
.practitioner-card-label { color:var(--primary)!important; font-size:.54rem!important; font-weight:850!important; letter-spacing:.08em; text-transform:uppercase; }
.practitioner-card h3 { margin:.14rem 0 .22rem; font-size:.88rem; line-height:1.25; }
.practitioner-card p { display:-webkit-box; overflow:hidden; margin:0; color:var(--muted); font-size:.68rem; line-height:1.45; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.practitioner-card-actions { grid-column:1 / -1; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.5rem; padding-top:.72rem; }
.practitioner-card-actions .button { min-height:2.3rem; padding:.5rem .6rem; font-size:.64rem; }
.practitioner-card-actions .media-picto { width:.8rem; height:.8rem; }
html[data-theme="dark"] .practitioner-card { background:linear-gradient(135deg,#102522,#0b1b18); }
/* Les fiches restent stables au survol : seules les actions changent d'etat. */
.practitioners-section .practitioner-card,
.practitioners-section .practitioner-card:hover { transform:none; box-shadow:none; }
@media (max-width:560px) { .practitioner-card { grid-template-columns:4.7rem minmax(0,1fr); } .practitioner-avatar { width:4.7rem; height:4.7rem; } .practitioner-card-copy { min-height:4.7rem; } }
.directory-needs-prompt { display:flex; align-items:center; justify-content:space-between; gap:1.25rem; margin:0 0 1.4rem; padding:1.1rem 1.25rem; border:1px dashed color-mix(in srgb,var(--primary) 38%,var(--line)); border-radius:1rem; background:linear-gradient(100deg,rgba(35,117,113,.065),transparent 62%); }
.directory-needs-prompt>div { display:flex; align-items:center; gap:.9rem; }
.directory-needs-prompt h2 { margin:0 0 .2rem; color:var(--ink); font-size:1rem; }
.directory-needs-prompt p { margin:0; color:var(--muted); font-size:.88rem; }
.directory-needs-prompt-icon { display:grid; flex:0 0 auto; place-items:center; width:2.4rem; height:2.4rem; border-radius:.75rem; color:var(--primary); background:rgba(35,117,113,.12); }
.directory-needs-prompt-icon svg { width:1.1rem; height:1.1rem; }
.advanced-filter-grid > :nth-child(1) { order:1; }
.advanced-filter-grid > :nth-child(5) { order:2; }
.advanced-filter-grid > :nth-child(8) { order:3; }
.advanced-filter-grid > :nth-child(6) { order:4; }
.advanced-filter-grid > :nth-child(7) { order:5; }
.advanced-filter-grid > :nth-child(4) { order:6; }
.advanced-filter-grid > :nth-child(3) { order:7; }
.advanced-filter-grid > :nth-child(2) { order:8; }
.domain-filter-control { display:grid; gap:.35rem; min-width:0; }
.domain-filter-control>span { color:var(--ink); font-size:.66rem; font-weight:800; }
.domain-filter-control details { position:relative; }
.domain-filter-control summary { display:flex; align-items:center; justify-content:space-between; min-height:42px; padding:.55rem .65rem; border:1px solid var(--line); border-radius:.6rem; color:var(--ink); background:#fbfdfc; cursor:pointer; list-style:none; }
.domain-filter-control summary::-webkit-details-marker { display:none; }
.domain-filter-control summary>span { display:block!important; min-width:0; overflow:hidden; color:inherit!important; font-size:.68rem!important; font-weight:400!important; text-overflow:ellipsis; white-space:nowrap; }
.domain-filter-control summary>i { display:grid; flex:0 0 auto; place-items:center; width:1.25rem; height:1.25rem; margin-left:.35rem; transition:transform .2s; }
.domain-filter-control details:not([open]) summary>i { transform:none!important; }
.domain-filter-control details[open] summary>i { transform:rotate(180deg)!important; }
.domain-filter-options { position:absolute; z-index:30; top:calc(100% + .35rem); left:0; right:0; display:grid; max-height:15rem; overflow:auto; padding:.35rem; border:1px solid var(--line); border-radius:.65rem; background:var(--white); box-shadow:0 .8rem 2rem rgba(13,52,49,.15); }
.domain-filter-options label { display:flex; align-items:center; gap:.5rem; min-height:2rem; padding:.35rem .45rem; border-radius:.4rem; color:var(--ink); cursor:pointer; font-size:.68rem; }
.domain-filter-options label:hover { background:var(--mint-soft); }
.domain-filter-options input { accent-color:var(--primary); }
html[data-theme="dark"] .domain-filter-control summary { border-color:#31514b; color:#eff9f6; background:#030c09; }
html[data-theme="dark"] .domain-filter-options { border-color:#31514b; background:#102522; box-shadow:0 .8rem 2rem rgba(0,0,0,.35); }
html[data-theme="dark"] .domain-filter-options label { color:#eff9f6; }
html[data-theme="dark"] .domain-filter-options label:hover { background:#1d403c; }
.advanced-filter-grid .select2-container--default .select2-selection--multiple { min-height:42px; border:1px solid var(--line); border-radius:.6rem; background:#fbfdfc; }
.advanced-filter-grid .select2-container--default .select2-selection--multiple .select2-selection__rendered { display:flex; flex-wrap:wrap; align-items:center; gap:.22rem; min-height:40px; margin:0; padding:.3rem .45rem; }
.advanced-filter-grid .select2-container--default .select2-selection--multiple .select2-selection__choice { display:inline-flex; align-items:center; margin:0; padding:.2rem .42rem; border:1px solid rgba(35,117,113,.2); border-radius:.38rem; color:#1c504c; background:var(--mint-soft); font-size:.64rem; line-height:1.2; }
.advanced-filter-grid .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { order:2; margin-left:.3rem; border:0; color:inherit; font-weight:800; }
.advanced-filter-grid .select2-container--default .select2-search--inline .select2-search__field { width:auto!important; min-height:1.35rem; margin:0; color:var(--ink); font:inherit; font-size:.68rem; }
html[data-theme="dark"] .advanced-filter-grid .select2-container--default .select2-selection--multiple { border-color:#31514b; background:#102522; }
html[data-theme="dark"] .advanced-filter-grid .select2-container--default .select2-selection--multiple .select2-selection__choice { border-color:#3e8179; color:#e1f5f0; background:#1d4b46; }
html[data-theme="dark"] .advanced-filter-grid .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color:#a9d8d0; }
html[data-theme="dark"] .advanced-filter-grid .select2-container--default .select2-search--inline .select2-search__field { color:#f3fbf8; }
@media (max-width:680px) { .directory-needs-prompt { align-items:flex-start; flex-direction:column; } .directory-needs-prompt .button { width:100%; } }
.advanced-filters:not([open]) > summary { border-radius:0 0 calc(1rem - 1px) calc(1rem - 1px); }
.support-links a { margin-left:-.35rem; padding:.42rem .55rem; border-radius:.5rem; }
html[data-theme="dark"] .support-links { border-left-color:#31514b; }

.activity-timeline { display:grid; align-content:start; gap:.45rem; padding:.75rem; }
.activity-guide { display:grid; grid-template-columns:1fr repeat(3,auto); gap:.35rem; align-items:center; margin-bottom:.15rem; padding:.62rem .68rem; border:1px solid var(--line); border-radius:.72rem; background:var(--surface,#f7f9f8); }
.activity-guide > div { display:grid; min-width:0; gap:.02rem; }
.activity-guide strong { color:var(--ink); font-size:.64rem; }
.activity-guide small { color:var(--muted); font-size:.48rem; }
.activity-guide > span { display:inline-flex; align-items:center; gap:.25rem; color:var(--muted); font-size:.46rem; font-weight:700; }
.activity-guide > span i { width:.42rem; height:.42rem; border-radius:50%; background:var(--primary); }
.activity-guide > span.is-completed i { background:var(--success); }
.activity-guide > span.is-cancelled i { background:var(--danger); }
.activity-timeline article { grid-template-columns:1.8rem minmax(0,1fr) 1.7rem; gap:.55rem; align-items:center; padding:.58rem .62rem; border:1px solid var(--line); border-left-width:3px; border-radius:.72rem; background:var(--white); }
.activity-timeline article:last-of-type { border-bottom:1px solid var(--line); }
.activity-timeline article.activity-created { border-left-color:var(--primary); }
.activity-timeline article.activity-completed { border-left-color:var(--success); }
.activity-timeline article.activity-cancelled { border-left-color:var(--danger); }
.activity-timeline .activity-marker { width:1.7rem; height:1.7rem; margin:0; border-radius:.5rem; }
.activity-timeline article > div { display:grid; min-width:0; grid-template-columns:minmax(0,1fr) auto; column-gap:.45rem; align-items:center; }
.activity-timeline article strong { overflow:hidden; font-size:.65rem; text-overflow:ellipsis; white-space:nowrap; }
.activity-timeline article p { overflow:hidden; grid-column:1; margin:.04rem 0 0; font-size:.53rem; text-overflow:ellipsis; white-space:nowrap; }
.activity-timeline article time { grid-column:2; grid-row:1 / span 2; font-size:.48rem; white-space:nowrap; }
.activity-timeline article > a { display:grid; width:1.7rem; height:1.7rem; place-items:center; border-radius:.5rem; font-size:.72rem; }
.activity-timeline article > a:hover { color:#fff; background:var(--primary); }
html[data-theme="dark"] .activity-guide,
html[data-theme="dark"] .activity-timeline article { background:#102522; }

html[data-theme="dark"] .support-side-card,
html[data-theme="dark"] .support-form-card,
html[data-theme="dark"] .faq-search,
html[data-theme="dark"] .faq-nav,
html[data-theme="dark"] .faq-group,
html[data-theme="dark"] .faq-empty,
html[data-theme="dark"] .emergency-group,
html[data-theme="dark"] .partner-card,
html[data-theme="dark"] .partners-empty { color:var(--text); background:#142927; border-color:#31514b; }
html[data-theme="dark"] .faq-group > header,
html[data-theme="dark"] .emergency-group > header { background:#102522; border-color:#31514b; }
html[data-theme="dark"] .faq-item,
html[data-theme="dark"] .emergency-item { border-color:#284640; }
html[data-theme="dark"] .faq-item summary:hover,
html[data-theme="dark"] .faq-nav a:hover { background:#1b3936; }
html[data-theme="dark"] .faq-search kbd { color:var(--muted); background:#102522; border-color:#31514b; }
html[data-theme="dark"] .support-side-card::after { background:#1b3936; }
html[data-theme="dark"] .contact-emergency-note,
html[data-theme="dark"] .emergency-alert { border-color:#6d3d3b; background:#3a2423; }
html[data-theme="dark"] .contact-emergency-note strong,
html[data-theme="dark"] .contact-emergency-note a,
html[data-theme="dark"] .emergency-alert h2,
html[data-theme="dark"] .emergency-alert a { color:#ffaaa6; }
html[data-theme="dark"] .contact-emergency-note p,
html[data-theme="dark"] .emergency-alert p { color:#e3c1bd; }
html[data-theme="dark"] .resource-links { background:#102522; }
html[data-theme="dark"] .resource-links > a { border-color:#31514b; background:#17322f; }
html[data-theme="dark"] .partner-logo { border-color:#3a5a55; color:#143f3c; background:#eaf2f1; }
html[data-theme="dark"] .support-form select:focus,
html[data-theme="dark"] .support-form textarea:focus { background:#17322f!important; }

@media(max-width:560px){.theme-menu{position:fixed;top:4.5rem;right:.75rem;left:.75rem;width:auto}.activity-guide{grid-template-columns:1fr}.activity-guide>div{margin-bottom:.2rem}.activity-timeline article>div{grid-template-columns:1fr}.activity-timeline article time{grid-column:1;grid-row:auto}.activity-guide>span{display:none}}

/* FAQ navigation, search and answer rhythm */
.faq-nav .faq-category-link { position:relative; transition:color .18s ease,background .18s ease,box-shadow .18s ease; }
.faq-nav .faq-category-link:hover { color:var(--primary); background:var(--mint-soft); }
.faq-nav .faq-category-link.is-active { color:var(--primary); background:var(--mint-soft); box-shadow:inset 3px 0 var(--primary); font-weight:800; }
.faq-nav .faq-contact-link { border:1px solid rgba(35,117,113,.18); background:transparent; }
.faq-nav .faq-contact-link:hover { color:#fff; border-color:var(--primary); background:var(--primary); }
.faq-item[open] > div { padding-top:.38rem; }
html[data-theme="dark"] .faq-search input { color:var(--ink)!important; background:transparent!important; caret-color:var(--primary); }
html[data-theme="dark"] .faq-search input::placeholder { color:#8fa9a5; opacity:1; }
html[data-theme="dark"] .faq-nav .faq-category-link:hover { color:var(--ink); background:#1b3936; }
html[data-theme="dark"] .faq-nav .faq-category-link.is-active { color:#a4e7e1; background:#21433f; box-shadow:inset 3px 0 #75cec7; }
html[data-theme="dark"] .faq-nav .faq-contact-link { color:#a4e7e1; border-color:#315b56; background:transparent; }
html[data-theme="dark"] .faq-nav .faq-contact-link:hover { color:#fff; border-color:#2b7f7a; background:#2b7f7a; }

/* Deeper dark palette */
html[data-theme="dark"] .app-body,
html[data-theme="dark"] .patient-app,
html[data-theme="dark"] .patient-app-main,
html[data-theme="dark"] .dashboard-shell { background:#071411; }
html[data-theme="dark"] .patient-app-main,
html[data-theme="dark"] .dashboard-shell { background:linear-gradient(135deg,#071411,#0b1c18); }
html[data-theme="dark"] .app-sidebar,
html[data-theme="dark"] .app-topbar,
html[data-theme="dark"] .shell-panel,
html[data-theme="dark"] .shell-panel > header,
html[data-theme="dark"] .dashboard-section,
html[data-theme="dark"] .dashboard-date,
html[data-theme="dark"] .top-directory-filters,
html[data-theme="dark"] .current-psy-card,
html[data-theme="dark"] .appointments-page-card,
html[data-theme="dark"] .messages-shell,
html[data-theme="dark"] .conversation-sidebar,
html[data-theme="dark"] .conversation-sidebar > header,
html[data-theme="dark"] .chat-area,
html[data-theme="dark"] .chat-documents,
html[data-theme="dark"] .profile-card,
html[data-theme="dark"] .profile-summary,
html[data-theme="dark"] .invoices-card,
html[data-theme="dark"] .booking-header,
html[data-theme="dark"] .booking-wizard,
html[data-theme="dark"] .booking-info-card,
html[data-theme="dark"] .psy-profile-card,
html[data-theme="dark"] .psy-profile-tabs,
html[data-theme="dark"] .psy-preview-drawer,
html[data-theme="dark"] .appointment-preview-drawer,
html[data-theme="dark"] .group-appointment-card,
html[data-theme="dark"] .support-side-card,
html[data-theme="dark"] .support-form-card,
html[data-theme="dark"] .faq-search,
html[data-theme="dark"] .faq-nav,
html[data-theme="dark"] .faq-group,
html[data-theme="dark"] .emergency-group,
html[data-theme="dark"] .partner-card { background:#0d1e1a; }
html[data-theme="dark"] .sidebar-profile,
html[data-theme="dark"] .advanced-filters,
html[data-theme="dark"] .advanced-filters > summary,
html[data-theme="dark"] .booking-progress,
html[data-theme="dark"] .booking-payment-card,
html[data-theme="dark"] .message-composer,
html[data-theme="dark"] .conversation-item,
html[data-theme="dark"] .chat-document-item,
html[data-theme="dark"] .practitioners-section .practitioner-card,
html[data-theme="dark"] .invoices-table tbody td,
html[data-theme="dark"] .activity-guide,
html[data-theme="dark"] .activity-timeline article,
html[data-theme="dark"] .faq-group > header,
html[data-theme="dark"] .emergency-group > header { background:#081713; }
html[data-theme="dark"] .app-topbar { background:rgba(9,23,19,.94); }
html[data-theme="dark"] .messages-shell .conversation-item:hover,
html[data-theme="dark"] .practitioners-section .practitioner-card:hover,
html[data-theme="dark"] .invoices-table tbody tr:hover td,
html[data-theme="dark"] .faq-item summary:hover,
html[data-theme="dark"] .faq-nav a:hover { background:#112b26; }
html[data-theme="dark"] .messages-shell .conversation-item.is-active,
html[data-theme="dark"] .faq-nav .faq-category-link.is-active,
html[data-theme="dark"] .support-links a.is-active { background:#17352f; }
html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select,
html[data-theme="dark"] .directory-main-search,
html[data-theme="dark"] .select2-selection,
html[data-theme="dark"] .booking-payment-card .payment-input-wrap input { background:#071512!important; }
html[data-theme="dark"] .faq-search input { background:transparent!important; }

/* Le nom d'un psychologue mène toujours à sa fiche, sans modifier l'action du conteneur. */
.psychologist-name-link {
    color: inherit;
    text-decoration: none;
    border-radius: .22rem;
    transition: color .18s ease, text-decoration-color .18s ease;
}

.psychologist-name-link:hover,
.psychologist-name-link:focus-visible {
    color: var(--primary);
    text-decoration: underline;
    text-decoration-thickness: .08em;
    text-underline-offset: .18em;
}

.current-psy-preview { cursor: pointer; }
.current-psy-preview:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; }
.current-psy-body > .psychologist-name-link {
    color: var(--ink);
    font-size: .85rem;
    font-weight: 800;
}
.dashboard-appointment-practitioner .psychologist-name-link {
    overflow: hidden;
    color: var(--ink);
    font-size: .8rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.message-panel-copy .psychologist-name-link,
.conversation-copy .psychologist-name-link {
    overflow: hidden;
    color: var(--ink);
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.message-panel-copy .psychologist-name-link { font-size: .66rem; }
.conversation-copy .psychologist-name-link { font-size: .56rem; }
.message-drawer-conversation-head .psychologist-name-link {
    overflow: hidden;
    color: var(--ink);
    font-size: .66rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.message-drawer-documents-head .psychologist-name-link {
    overflow: hidden;
    color: var(--muted);
    font-size: .5rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.message-panel-item[role="button"] { cursor: pointer; }
.message-panel-item[role="button"]:focus-visible,
.conversation-item[role="button"]:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; }

/* Deux actions équilibrées dans le drawer psychologue. */
.psy-preview-drawer .drawer-actions {
    grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
    gap: .65rem;
    padding: .85rem 1.1rem 1rem;
}
.psy-preview-drawer .drawer-actions .button {
    width: 100%;
    min-height: 2.75rem;
    padding: .68rem .75rem;
}
.psy-preview-drawer .drawer-actions .button-primary {
    grid-column: auto;
    box-shadow: 0 .5rem 1.15rem rgba(35,117,113,.16);
}
.psy-preview-drawer .drawer-actions .button-secondary {
    border-color: rgba(35,117,113,.2);
    color: var(--primary);
    background: var(--mint-soft);
}
.psy-preview-drawer .drawer-actions .button-secondary:hover {
    border-color: rgba(35,117,113,.36);
    background: var(--mint);
}

/* Messagerie tablette/mobile : navigation maître-détail fiable. */
@media (max-width: 980px) {
    .app-body .dashboard-shell:has(.messages-shell) {
        width: calc(100% - 1rem);
        min-height: 0;
        padding: .5rem 0;
    }
    .messages-shell {
        position: relative;
        display: block;
        height: calc(100dvh - 8rem);
        min-height: 32rem;
        overflow: hidden;
    }
    .conversation-sidebar,
    .chat-area {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        min-height: 0;
    }
    .conversation-sidebar {
        z-index: 1;
        border-right: 0;
        visibility: visible;
        transform: translateX(0);
        transition: transform .22s ease, visibility .22s ease;
    }
    .chat-area {
        z-index: 2;
        visibility: hidden;
        transform: translateX(100%);
        transition: transform .22s ease, visibility .22s ease;
    }
    .messages-shell.chat-open .conversation-sidebar {
        visibility: hidden;
        transform: translateX(-16%);
    }
    .messages-shell.chat-open .chat-area {
        visibility: visible;
        transform: translateX(0);
    }
    .chat-back {
        display: grid;
        width: 2.25rem;
        height: 2.25rem;
        flex: 0 0 2.25rem;
        place-items: center;
        border: 1px solid var(--line);
        border-radius: .6rem;
        color: var(--primary);
        background: var(--surface);
        font-size: 1rem;
        cursor: pointer;
    }
    .chat-back:hover { background: var(--mint-soft); }
    .chat-quick-link span { display: none; }
    .chat-quick-link {
        width: 2.25rem;
        height: 2.25rem;
        padding: 0;
        justify-content: center;
    }
}

@media (max-width: 620px) {
    .psy-preview-drawer .drawer-actions { grid-template-columns: 1fr; }
    .messages-shell {
        height: calc(100dvh - 5.75rem);
        min-height: 30rem;
        border-radius: .8rem;
    }
    .conversation-sidebar > header { padding: .8rem; }
    .chat-header {
        display: flex;
        min-height: 0;
        flex-wrap: wrap;
        gap: .45rem;
        padding: .55rem .65rem;
    }
    .chat-header .mini-avatar { width: 2.15rem; height: 2.15rem; flex: 0 0 2.15rem; }
    .chat-identity { flex: 1; }
    .chat-quick-actions {
        display: grid;
        width: 100%;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: .4rem;
        margin: .1rem 0 0;
    }
    .chat-quick-link { width: 100%; }
    .chat-messages { padding: .8rem; }
    .message { max-width: 88%; }
    .message-composer { padding: .55rem .65rem; }
}

@media (prefers-reduced-motion: reduce) {
    .conversation-sidebar,
    .chat-area { transition: none; }
}

/* Lisibilite generale, controles et navigation basse hauteur. */
html[data-font-size="small"] { font-size: 16px; }
html[data-font-size="normal"] { font-size: 17px; }
html[data-font-size="large"] { font-size: 18px; }

.app-sidebar {
    height: 100dvh;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-color: rgba(35, 117, 113, .35) transparent;
    scrollbar-width: thin;
}
.app-sidebar::-webkit-scrollbar { width: .35rem; }
.app-sidebar::-webkit-scrollbar-thumb {
    border-radius: 1rem;
    background: rgba(35, 117, 113, .3);
}

/* Appointment modification page, branded scrollbars and drawers */
body.psy-drawer-visible { overflow:hidden; overscroll-behavior:none; }
.psy-drawer-content { overscroll-behavior:contain; }

html,
body,
* { scrollbar-width:thin; scrollbar-color:rgba(35,117,113,.78) rgba(35,117,113,.08); }
html::-webkit-scrollbar,
body::-webkit-scrollbar,
*::-webkit-scrollbar { width:.58rem; height:.58rem; }
html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
*::-webkit-scrollbar-track { background:rgba(35,117,113,.08); border-radius:999px; }
html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
*::-webkit-scrollbar-thumb { min-height:2.5rem; border:2px solid transparent; border-radius:999px; background:rgba(35,117,113,.78); background-clip:padding-box; }
html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover,
*::-webkit-scrollbar-thumb:hover { background:var(--primary-hover); background-clip:padding-box; }
html[data-theme="dark"],
html[data-theme="dark"] body,
html[data-theme="dark"] * { scrollbar-color:#2f8b85 #0b1b19; }
html[data-theme="dark"]::-webkit-scrollbar-track,
html[data-theme="dark"] body::-webkit-scrollbar-track,
html[data-theme="dark"] *::-webkit-scrollbar-track { background:#0b1b19; }
html[data-theme="dark"]::-webkit-scrollbar-thumb,
html[data-theme="dark"] body::-webkit-scrollbar-thumb,
html[data-theme="dark"] *::-webkit-scrollbar-thumb { background:#2f8b85; background-clip:padding-box; }

.activity-cancelled strong { color:var(--coral); }
.activity-timeline article.activity-cancelled { border-left-color:var(--coral); }
.activity-timeline article.activity-cancelled .activity-marker { color:#fff; border-color:rgba(248,118,121,.24); background:var(--coral); }
.activity-guide > span.is-cancelled i { background:var(--coral); }

.drawer-registration small { display:block; max-width:25rem; margin-top:.18rem; color:var(--muted); font-size:.58rem; line-height:1.45; }
.drawer-registration small[hidden] { display:none; }
.psy-profile-rpps em { display:block; max-width:18rem; margin-top:.18rem; color:var(--muted); font-size:.52rem; font-style:normal; font-weight:500; line-height:1.4; }

/* Exercice à l'étranger : conserver l'information complète dans un encart clairement identifiable. */
.psy-profile-rpps.is-foreign { grid-column:1/-1; padding:.85rem .95rem; border:1px solid #e5c78f; border-radius:.75rem; background:#fff8e9; }
.psy-profile-rpps.is-foreign small { color:#795615; font-size:.62rem; font-weight:800; }
.psy-profile-rpps.is-foreign small .media-picto { color:#a57515; }
.psy-profile-rpps.is-foreign strong { display:block; margin-top:.14rem; color:#62480f; font-size:.92rem; letter-spacing:0; }
.psy-profile-rpps.is-foreign em { max-width:48rem; margin-top:.38rem; color:#705d32; font-size:.72rem; font-weight:600; line-height:1.55; }
.drawer-registration.is-foreign { align-items:flex-start; padding:.85rem .9rem; border-color:#e5c78f; background:#fff8e9; }
.drawer-registration.is-foreign > div > span { color:#795615; font-size:.58rem; }
.drawer-registration.is-foreign strong { overflow:visible; color:#62480f; font-size:.82rem; letter-spacing:0; text-overflow:clip; white-space:normal; }
.drawer-registration.is-foreign small { max-width:none; margin-top:.35rem; color:#705d32; font-size:.68rem; font-weight:600; line-height:1.55; }
html[data-theme="dark"] .psy-profile-rpps.is-foreign,
html[data-theme="dark"] .drawer-registration.is-foreign { border-color:#7c622d; background:#302916; }
html[data-theme="dark"] .psy-profile-rpps.is-foreign small,
html[data-theme="dark"] .drawer-registration.is-foreign > div > span { color:#f1ca72; }
html[data-theme="dark"] .psy-profile-rpps.is-foreign strong,
html[data-theme="dark"] .drawer-registration.is-foreign strong { color:#ffdda0; }
html[data-theme="dark"] .psy-profile-rpps.is-foreign em,
html[data-theme="dark"] .drawer-registration.is-foreign small { color:#ebd8a6; }

/* Parcours professionnel : même information que le site historique, dans une timeline compacte. */
.psy-timeline { display:grid; gap:.8rem; }
.psy-timeline article { display:grid; grid-template-columns:4.5rem 1rem minmax(0,1fr); gap:.6rem; align-items:start; }
.psy-timeline time { color:var(--primary); font-size:.68rem; font-weight:800; line-height:1.4; }
.psy-timeline article > span { display:grid; width:1rem; height:1rem; place-items:center; border-radius:50%; color:#fff; background:var(--primary); font-size:.38rem; line-height:1; }
.psy-timeline article > div { display:grid; gap:.1rem; min-width:0; padding-bottom:.75rem; border-bottom:1px solid var(--line); }
.psy-timeline article:last-child > div { padding-bottom:0; border-bottom:0; }
.psy-timeline strong { color:var(--ink); font-size:.74rem; line-height:1.35; }
.psy-timeline small { color:var(--muted); font-size:.64rem; line-height:1.45; }
.psy-preview-drawer > header { gap:.75rem; }
.drawer-booking-cta { display:inline-flex; min-height:2.3rem; align-items:center; justify-content:center; gap:.42rem; margin-left:auto; padding:.5rem .7rem; border-radius:.62rem; color:#fff; background:var(--primary); box-shadow:0 .3rem .8rem rgba(35,117,113,.18); font-size:.59rem; font-weight:800; text-decoration:none; white-space:nowrap; }
.drawer-booking-cta + .close-icon-button { flex:0 0 auto; margin-left:.1rem; }
.drawer-booking-cta:hover { color:#fff; background:var(--primary-hover); }
.drawer-booking-cta .media-picto { width:.82rem; height:.82rem; }
.drawer-timeline { gap:.65rem; }
.drawer-timeline article { grid-template-columns:3.7rem .9rem minmax(0,1fr); gap:.45rem; }
.drawer-timeline time { font-size:.58rem; }
.drawer-timeline article > span { width:.9rem; height:.9rem; font-size:.32rem; }
.drawer-timeline article > div { padding-bottom:.6rem; }
.drawer-timeline strong { font-size:.65rem; }
.drawer-timeline small { font-size:.56rem; }
html[data-theme="dark"] .psy-timeline article > div { border-color:#2a4943; }
@media (max-width:620px) {
    .drawer-booking-cta { min-height:2.1rem; padding:.42rem .55rem; font-size:.52rem; }
    .drawer-booking-cta .media-picto { display:none; }
}

.appointment-edit-page-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; margin:.8rem 0 1rem; padding-bottom:.85rem; border-bottom:1px solid var(--line); }
.appointment-edit-page-heading h1 { margin:.16rem 0 .12rem; color:var(--ink); font-size:clamp(1.45rem,3vw,2.25rem); line-height:1.05; }
.appointment-edit-page-heading p { margin:0; color:var(--muted); font-size:.7rem; }
.appointment-edit-page-layout { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(15rem,.7fr); gap:1rem; align-items:start; }
.appointment-edit-page-main { min-width:0; }
.appointment-edit-page-card { max-height:none; overflow:hidden; border:1px solid var(--line); border-radius:1rem; box-shadow:0 12px 34px rgba(82,61,45,.06); }
.appointment-edit-page-card .appointment-edit-body { overflow:visible; }
.appointment-edit-page-card > header h2 { font-size:1rem; }
.appointment-edit-page-card > header p { font-size:.64rem; }
.appointment-edit-page-card .appointment-edit-current strong { font-size:.78rem; }
.appointment-edit-page-card .appointment-edit-field > span,
.appointment-edit-page-card .appointment-edit-media legend { font-size:.6rem; }
.appointment-edit-page-card .appointment-edit-field small,
.appointment-edit-page-card .appointment-edit-notice p { font-size:.59rem; }
.appointment-edit-page-card > footer a { text-decoration:none; }
.appointment-edit-summary { display:grid; gap:.85rem; padding:1rem; border:1px solid var(--line); border-radius:1rem; background:var(--white); box-shadow:0 12px 34px rgba(82,61,45,.05); }
.appointment-edit-practitioner { display:flex; align-items:center; gap:.65rem; padding-bottom:.8rem; border-bottom:1px solid var(--line); }
.appointment-edit-practitioner > img,
.appointment-edit-practitioner > span { display:grid; width:2.6rem; height:2.6rem; flex:none; place-items:center; overflow:hidden; border-radius:.75rem; color:#fff; background:var(--primary); object-fit:cover; font-size:.65rem; font-weight:800; }
.appointment-edit-practitioner div { display:grid; gap:.08rem; min-width:0; }
.appointment-edit-practitioner small { color:var(--muted); font-size:.53rem; }
.appointment-edit-practitioner strong { overflow:hidden; color:var(--ink); font-size:.72rem; text-overflow:ellipsis; white-space:nowrap; }
.appointment-edit-summary dl { display:grid; gap:.55rem; margin:0; }
.appointment-edit-summary dl div { display:flex; align-items:center; justify-content:space-between; gap:.8rem; }
.appointment-edit-summary dt { color:var(--muted); font-size:.58rem; }
.appointment-edit-summary dd { margin:0; color:var(--ink); font-size:.62rem; font-weight:750; text-align:right; }
.appointment-edit-summary > p { display:flex; align-items:flex-start; gap:.45rem; margin:0; padding:.65rem; border-radius:.7rem; color:var(--primary); background:var(--mint-soft); font-size:.56rem; line-height:1.45; }
.appointment-edit-summary > p .media-picto { width:.85rem; height:.85rem; flex:none; }
.appointment-edit-state-card { display:grid; grid-template-columns:auto minmax(0,1fr); gap:.8rem; padding:1.15rem; border:1px solid var(--line); border-radius:1rem; background:var(--white); box-shadow:0 12px 34px rgba(82,61,45,.06); }
.appointment-edit-state-card h2 { margin:.15rem 0 .25rem; color:var(--ink); font-size:1rem; }
.appointment-edit-state-card p { margin:0; color:var(--text); font-size:.64rem; line-height:1.55; }
.appointment-edit-state-card small { display:block; margin-top:.35rem; color:var(--muted); font-size:.55rem; }
.appointment-edit-state-card .button { grid-column:2; justify-self:start; text-decoration:none; }
.appointment-edit-state-icon { display:grid; width:2.5rem; height:2.5rem; place-items:center; border-radius:.75rem; color:var(--primary); background:var(--mint-soft); }
.appointment-edit-state-icon .media-picto { width:1.05rem; height:1.05rem; }
html[data-theme="dark"] .appointment-edit-summary,
html[data-theme="dark"] .appointment-edit-state-card,
html[data-theme="dark"] .appointment-edit-page-card { background:#102522; }
@media (max-width:850px) {
    .appointment-edit-page-layout { grid-template-columns:1fr; }
    .appointment-edit-summary { grid-row:1; }
}
@media (max-width:600px) {
    .appointment-edit-page-heading { margin-top:.55rem; }
    .appointment-edit-page-card > header,
    .appointment-edit-page-card .appointment-edit-body,
    .appointment-edit-page-card > footer { padding-inline:.85rem; }
}
.sidebar-head { flex: 0 0 auto; }
.sidebar-nav { flex: 0 0 auto; }
.sidebar-profile { flex: 0 0 auto; }
.sidebar-account-actions { flex: 0 0 auto; padding-bottom: .25rem; }

.support-chevron {
    display: grid;
    width: 1.35rem;
    height: 1.35rem;
    flex: 0 0 1.35rem;
    place-items: center;
    border-radius: .4rem;
    pointer-events: none;
    transform: rotate(0);
    transform-origin: center;
}
.support-chevron svg {
    display: block;
    width: .8rem;
    height: .8rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.sidebar-support[open] .support-chevron { transform: rotate(180deg); }
.sidebar-support summary:hover .support-chevron,
.sidebar-support summary.is-active .support-chevron { background: rgba(35, 117, 113, .1); }

/* Les choix courts gardent la meme hauteur et un centrage optique constant. */
.filter-pills label { display: inline-flex; align-items: stretch; }
.filter-pills span {
    display: inline-flex;
    min-height: 2rem;
    align-items: center;
    justify-content: center;
    padding-block: .38rem;
    line-height: 1.15;
}

/* Checkboxes dessinees de facon identique dans tous les navigateurs. */
.checkbox-field input[type="checkbox"],
.login-remember input[type="checkbox"],
.payment-save-card input[type="checkbox"] {
    width: 1.05rem;
    height: 1.05rem;
    flex: 0 0 1.05rem;
    padding: 0;
    border: 1px solid rgba(35, 117, 113, .35);
    border-radius: .28rem;
    appearance: none;
    background-color: var(--white);
    background-position: center;
    background-repeat: no-repeat;
    background-size: .7rem .7rem;
    cursor: pointer;
}
.checkbox-field input[type="checkbox"]:checked,
.login-remember input[type="checkbox"]:checked,
.payment-save-card input[type="checkbox"]:checked {
    border-color: var(--primary);
    background-color: var(--primary);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m3.5 8.2 2.8 2.8 6.2-6.2' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.checkbox-field input[type="checkbox"]:focus-visible,
.login-remember input[type="checkbox"]:focus-visible,
.payment-save-card input[type="checkbox"]:focus-visible {
    outline: 3px solid rgba(35, 117, 113, .22);
    outline-offset: 2px;
}
.filter-checks input:checked + span::before {
    color: transparent;
    background-color: var(--primary);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m3.5 8.2 2.8 2.8 6.2-6.2' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: .65rem .65rem;
    content: '';
}

/* Relever les micro-textes visibles sans regrossir les titres. */
.profile-meta span,
.sidebar-account-actions a,
.sidebar-account-actions button,
.topbar-context,
.activity-guide small,
.activity-guide > span,
.activity-timeline article time,
.conversation-copy time,
.conversation-copy small,
.message time,
.chat-date,
.messages-notice { font-size: max(.55rem, 10px); }
.activity-timeline article p { font-size: max(.58rem, 10.5px); }
.activity-timeline .psychologist-name-link {
    font-size: inherit;
    font-weight: 650;
}
.panel-empty,
.page-intro h1 + p,
.support-links a,
.drawer-description,
.chat-documents-intro { font-size: max(.65rem, 11.5px); }

/* Mode sombre plus profond, avec une hierarchie nette entre fond et cartes. */
html[data-theme="dark"] .app-body,
html[data-theme="dark"] .patient-app,
html[data-theme="dark"] .patient-app-main,
html[data-theme="dark"] .dashboard-shell { background: #030a08; }
html[data-theme="dark"] .patient-app-main,
html[data-theme="dark"] .dashboard-shell { background: linear-gradient(135deg, #030a08, #06110e); }
html[data-theme="dark"] .app-sidebar,
html[data-theme="dark"] .app-topbar,
html[data-theme="dark"] .shell-panel,
html[data-theme="dark"] .shell-panel > header,
html[data-theme="dark"] .dashboard-section,
html[data-theme="dark"] .dashboard-date,
html[data-theme="dark"] .top-directory-filters,
html[data-theme="dark"] .current-psy-card,
html[data-theme="dark"] .appointments-page-card,
html[data-theme="dark"] .messages-shell,
html[data-theme="dark"] .conversation-sidebar,
html[data-theme="dark"] .conversation-sidebar > header,
html[data-theme="dark"] .chat-area,
html[data-theme="dark"] .chat-documents,
html[data-theme="dark"] .profile-card,
html[data-theme="dark"] .profile-summary,
html[data-theme="dark"] .invoices-card,
html[data-theme="dark"] .booking-header,
html[data-theme="dark"] .booking-wizard,
html[data-theme="dark"] .booking-info-card,
html[data-theme="dark"] .psy-profile-card,
html[data-theme="dark"] .psy-profile-tabs,
html[data-theme="dark"] .psy-preview-drawer,
html[data-theme="dark"] .appointment-preview-drawer,
html[data-theme="dark"] .group-appointment-card,
html[data-theme="dark"] .support-side-card,
html[data-theme="dark"] .support-form-card,
html[data-theme="dark"] .faq-search,
html[data-theme="dark"] .faq-nav,
html[data-theme="dark"] .faq-group,
html[data-theme="dark"] .emergency-group,
html[data-theme="dark"] .partner-card { background: #081511; }
html[data-theme="dark"] .sidebar-profile,
html[data-theme="dark"] .advanced-filters,
html[data-theme="dark"] .advanced-filters > summary,
html[data-theme="dark"] .booking-progress,
html[data-theme="dark"] .booking-payment-card,
html[data-theme="dark"] .message-composer,
html[data-theme="dark"] .conversation-item,
html[data-theme="dark"] .chat-document-item,
html[data-theme="dark"] .practitioners-section .practitioner-card,
html[data-theme="dark"] .invoices-table tbody td,
html[data-theme="dark"] .activity-guide,
html[data-theme="dark"] .activity-timeline article,
html[data-theme="dark"] .faq-group > header,
html[data-theme="dark"] .emergency-group > header { background: #050f0c; }
html[data-theme="dark"] .app-topbar { background: rgba(5, 14, 11, .96); }
html[data-theme="dark"] .messages-shell .conversation-item:hover,
html[data-theme="dark"] .practitioners-section .practitioner-card:hover,
html[data-theme="dark"] .invoices-table tbody tr:hover td,
html[data-theme="dark"] .faq-item summary:hover,
html[data-theme="dark"] .faq-nav a:hover { background: #0c231d; }
html[data-theme="dark"] .messages-shell .conversation-item.is-active,
html[data-theme="dark"] .faq-nav .faq-category-link.is-active,
html[data-theme="dark"] .support-links a.is-active { background: #123028; }
html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select,
html[data-theme="dark"] .directory-main-search,
html[data-theme="dark"] .select2-selection,
html[data-theme="dark"] .booking-payment-card .payment-input-wrap input { background-color: #030c09 !important; }
html[data-theme="dark"] .checkbox-field input[type="checkbox"],
html[data-theme="dark"] .login-remember input[type="checkbox"],
html[data-theme="dark"] .payment-save-card input[type="checkbox"] { border-color: #31544b; }
html[data-theme="dark"] .checkbox-field input[type="checkbox"]:checked,
html[data-theme="dark"] .login-remember input[type="checkbox"]:checked,
html[data-theme="dark"] .payment-save-card input[type="checkbox"]:checked { border-color: #41978f; background-color: #287d76 !important; }

/* Chevron commun au menu Support et aux filtres avances. */
.advanced-filters summary > .filter-chevron {
    display: grid;
    width: 1.35rem;
    height: 1.35rem;
    flex: 0 0 1.35rem;
    place-items: center;
    border-radius: .4rem;
    pointer-events: none;
    transform: rotate(0);
    transform-origin: center;
    transition: transform .2s ease, background .18s ease;
}
.advanced-filters summary > .filter-chevron svg {
    display: block;
    width: .8rem;
    height: .8rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.advanced-filters[open] summary > .filter-chevron { transform: rotate(180deg); }
.advanced-filters summary:hover > .filter-chevron { background: rgba(35, 117, 113, .1); }

/* Medias sans pictogramme : coche et libelle parfaitement centres. */
.advanced-filter-grid fieldset > .filter-pills,
.advanced-filter-grid fieldset > .filter-checks {
    margin-top: .35rem;
}
.advanced-filter-grid fieldset > .filter-pills {
    min-height: 42px;
    align-items: center;
}
.filter-checks.horizontal label > span {
    display: inline-flex;
    min-height: 2rem;
    align-items: center;
    line-height: 1.2;
}
.filter-checks.horizontal label > span::before {
    flex: 0 0 .95rem;
    width: .95rem;
    height: .95rem;
    margin-right: .42rem;
    background-position: center;
}

/* Texte du profil psychologue lisible dans le drawer et sur la fiche. */
.psy-drawer-content p,
.psy-drawer-content .drawer-description {
    font-size: .75rem;
    line-height: 1.7;
}
.psy-drawer-content h3 { font-size: .78rem; }
.drawer-feedback p,
.psy-profile-feedbacks p { font-size: .72rem; line-height: 1.7; }
.psy-profile-description { font-size: .78rem; line-height: 1.75; }

/* Le header reste disponible sur toutes les pages de rendez-vous. */
.patient-app-main:has(.appointment-detail-layout.media-video) > .app-topbar,
.patient-app-main:has(.appointment-detail-layout.media-chat) > .app-topbar {
    display: flex;
}
.appointment-detail-layout.media-video .appointment-facts-card,
.appointment-detail-layout.media-chat .appointment-facts-card { top: 4.75rem; }

/* Actions du drawer rendez-vous : une grille stable sans superposition. */
.appointment-preview-drawer > footer {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: .55rem;
}
.appointment-preview-drawer > footer > * { min-width: 0; }
.appointment-preview-drawer > footer .button {
    width: 100%;
    min-height: 2.7rem;
    margin: 0;
    justify-content: center;
    padding: .62rem .7rem;
    white-space: normal;
    line-height: 1.25;
    text-align: center;
}
.appointment-preview-drawer > footer [hidden] { display: none !important; }
.appointment-preview-drawer > footer .appointment-drawer-access {
    order: -2;
    grid-column: 1 / -1;
}
.appointment-preview-drawer > footer .appointment-drawer-modify,
.appointment-preview-drawer > footer .appointment-drawer-pending,
.appointment-preview-drawer > footer .appointment-drawer-invoice,
.appointment-preview-drawer > footer .appointment-drawer-cancel {
    grid-column: 1 / -1;
}
.appointment-preview-drawer > footer .appointment-drawer-modify {
    border-color: rgba(35, 117, 113, .28);
    color: var(--primary);
    background: var(--mint-soft);
    font-weight: 800;
}
.appointment-preview-drawer > footer .appointment-drawer-modify:hover {
    color: #fff;
    background: var(--primary);
}
.appointment-edit-date-required {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    margin: 0;
    padding: .65rem .7rem;
    border: 1px solid rgba(196, 132, 30, .24);
    border-radius: .65rem;
    color: #795719;
    background: #fff7e8;
    font-size: .64rem;
    line-height: 1.45;
}
.appointment-edit-date-required .media-picto { width: .9rem; height: .9rem; flex: 0 0 .9rem; margin-top: .08rem; }
html[data-theme="dark"] .appointment-edit-date-required { border-color:#604b25; color:#e9ca89; background:#241d10; }

/* Modification de rendez-vous : même lecture du planning que la prise de rendez-vous. */
.appointment-edit-slots { display:grid; gap:.65rem; min-width:0; margin:0; padding:0; border:0; }
.appointment-edit-slots > legend { margin-bottom:.05rem; color:var(--muted); font-size:.6rem; font-weight:750; text-transform:uppercase; letter-spacing:.04em; }
.appointment-edit-days {
    max-height:24rem;
    grid-auto-rows:max-content;
    align-content:start;
    align-items:start;
}
.appointment-edit-days .booking-day {
    height:max-content;
    align-self:start;
    background:var(--surface);
}
.appointment-edit-days .booking-day > div { align-content:flex-start; }
.appointment-edit-keep-date { position:relative; cursor:pointer; }
.appointment-edit-keep-date > input { position:absolute; opacity:0; pointer-events:none; }
.appointment-edit-keep-date > span { display:flex; align-items:center; gap:.65rem; padding:.7rem .8rem; border:1px solid var(--line); border-radius:.75rem; color:var(--ink); background:var(--surface); transition:border-color .18s ease,background .18s ease,transform .18s ease; }
.appointment-edit-keep-date > span > .media-picto { width:1rem; height:1rem; flex:none; color:var(--primary); }
.appointment-edit-keep-date > span > span { display:grid; gap:.08rem; }
.appointment-edit-keep-date small { color:var(--muted); font-size:.52rem; }
.appointment-edit-keep-date strong { font-size:.65rem; }
.appointment-edit-keep-date:hover > span { border-color:rgba(35,117,113,.42); background:var(--mint-soft); transform:translateY(-1px); }
.appointment-edit-keep-date > input:checked + span { border-color:var(--primary); background:var(--mint-soft); box-shadow:0 0 0 1px var(--primary); }
.appointment-edit-slots-help { color:var(--muted); font-size:.55rem; line-height:1.5; }
.appointment-edit-empty { padding:1.25rem; border:1px dashed var(--line); border-radius:.8rem; background:var(--surface); }
.appointment-edit-empty h3 { margin:.35rem 0 .15rem; color:var(--ink); font-size:.72rem; }
.appointment-edit-empty p { font-size:.58rem; }
html[data-theme="dark"] .appointment-edit-days .booking-day,
html[data-theme="dark"] .appointment-edit-keep-date > span,
html[data-theme="dark"] .appointment-edit-empty { background:#081511; }
html[data-theme="dark"] .appointment-edit-keep-date:hover > span,
html[data-theme="dark"] .appointment-edit-keep-date > input:checked + span { background:#123028; }

/* État vide de l’annuaire en mode sombre. */
html[data-theme="dark"] .directory-empty { border-color:#24453e; color:var(--text); background:#081511; }
html[data-theme="dark"] .directory-empty > span { color:#58aaa3; }
html[data-theme="dark"] .directory-empty h2 { color:var(--ink); }
html[data-theme="dark"] .directory-empty p { color:var(--muted); }

@media(max-width:700px) {
    .appointment-edit-days { grid-template-columns:1fr; max-height:22rem; }
}

/* Rendez-vous : statuts lisibles, actions hiérarchisées et dashboard compact. */
.appointment-summary .summary-icon .media-picto { width:1rem; height:1rem; }
.appointment-summary .summary-icon.warm { color:#99651c; }
.appointment-summary .summary-icon.coral { color:var(--coral); background:rgba(248,118,121,.14); }
.appointment-tabs button { display:inline-flex; align-items:center; gap:.32rem; }
.appointment-tabs button > i { display:grid; width:1.05rem; height:1.05rem; place-items:center; border-radius:.32rem; color:currentColor; background:var(--surface); font-style:normal; }
.appointment-tabs button > i .media-picto { width:.68rem; height:.68rem; }
.appointment-tabs button > span { margin-left:.05rem; }
.appointment-tabs button.is-active > i { background:var(--mint-soft); }
html[data-theme="dark"] .appointment-tabs button > i { background:#102522; }
html[data-theme="dark"] .appointment-tabs button.is-active > i { background:#193632; }

.appointment-preview-drawer > footer { display:grid; grid-template-columns:1fr; gap:.5rem; }
.appointment-preview-drawer > footer .appointment-drawer-access { order:0; grid-column:auto; min-height:2.85rem; }
.appointment-drawer-action-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.45rem; min-width:0; }
.appointment-drawer-action-grid > .button { min-height:2.45rem; padding:.55rem .62rem; font-size:.58rem; }
.appointment-drawer-action-grid > .button .media-picto { width:.78rem; height:.78rem; flex:none; }
.appointment-preview-drawer > footer .appointment-drawer-action-grid > .appointment-drawer-modify,
.appointment-preview-drawer > footer .appointment-drawer-action-grid > .appointment-drawer-invoice,
.appointment-preview-drawer > footer .appointment-drawer-action-grid > .appointment-drawer-cancel,
.appointment-preview-drawer > footer .appointment-drawer-action-grid > .appointment-drawer-pending { grid-column:auto; }
.appointment-drawer-action-grid > .appointment-drawer-pending { min-height:2.45rem; }
.appointment-drawer-action-grid > .appointment-drawer-cancel { border-color:rgba(248,118,121,.25); color:#9d4a4e; background:rgba(248,118,121,.1); }
.appointment-drawer-action-grid > .appointment-drawer-cancel:hover { border-color:var(--coral); background:var(--coral); }
html[data-theme="dark"] .appointment-drawer-action-grid > .appointment-drawer-cancel { color:#ffaaa6; background:#432727; border-color:#6d3d3b; }

.dashboard-appointment-grid.is-multiple { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.65rem; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-card { grid-template-columns:3.2rem minmax(0,1fr) auto; grid-template-rows:auto auto; align-items:center; gap:.55rem .7rem; padding:.65rem .7rem; border-radius:.85rem; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-date { grid-row:1 / 3; align-self:stretch; width:3.2rem; min-height:3.7rem; border-radius:.65rem; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-date strong { font-size:1.08rem; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-main { grid-column:2; min-width:0; gap:.45rem; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-card.is-next .dashboard-appointment-main { padding-top:.58rem; }
.dashboard-appointment-grid.is-multiple .dashboard-next-label { font-size:.42rem; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-practitioner { gap:.45rem; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-practitioner > span { width:2rem; height:2rem; border-radius:.5rem; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-practitioner small { font-size:.48rem; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-practitioner strong { font-size:.7rem; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-main .status-pill { flex:none; font-size:.48rem; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-meta { grid-column:2 / 4; min-width:0; padding-top:.5rem; border-top:1px solid var(--line); }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-meta > span { flex:1; gap:.4rem; padding:0 .55rem; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-meta > span:first-child { padding-left:0; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-meta i { width:1.65rem; height:1.65rem; flex-basis:1.65rem; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-meta i .media-picto { width:.7rem; height:.7rem; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-meta strong { font-size:.58rem; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-meta small { font-size:.42rem; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-meta em { font-size:.47rem; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-actions { grid-column:3; grid-row:1; }
.dashboard-appointment-grid.is-multiple .dashboard-appointment-actions .button { min-height:2.15rem; padding:.5rem .6rem; font-size:.55rem; }

@media(max-width:1120px) {
    .dashboard-appointment-grid.is-multiple { grid-template-columns:1fr; }
}
@media(max-width:560px) {
    .appointment-drawer-action-grid { grid-template-columns:1fr; }
    .appointment-drawer-action-grid > .appointment-drawer-pending { grid-column:auto; }
    .dashboard-appointment-grid.is-multiple .dashboard-appointment-card { grid-template-columns:3rem minmax(0,1fr); align-items:start; }
    .dashboard-appointment-grid.is-multiple .dashboard-appointment-date { grid-row:1 / 4; width:3rem; min-height:3.45rem; }
    .dashboard-appointment-grid.is-multiple .dashboard-appointment-main,
    .dashboard-appointment-grid.is-multiple .dashboard-appointment-meta,
    .dashboard-appointment-grid.is-multiple .dashboard-appointment-actions { grid-column:2; }
    .dashboard-appointment-grid.is-multiple .dashboard-appointment-actions { grid-row:auto; }
    .dashboard-appointment-grid.is-multiple .dashboard-appointment-main { align-items:flex-start; }
    .dashboard-appointment-grid.is-multiple .dashboard-appointment-meta { flex-direction:column; align-items:stretch; }
    .dashboard-appointment-grid.is-multiple .dashboard-appointment-meta > span { width:100%; padding:0; }
    .dashboard-appointment-grid.is-multiple .dashboard-appointment-meta > span + span { padding-top:.4rem; border-top:1px solid var(--line); border-left:0; }
}

/* Footer compact du drawer rendez-vous : deux rangées au maximum. */
.appointment-preview-drawer > footer {
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:.4rem;
    padding:.65rem .8rem;
}
.appointment-preview-drawer > footer .appointment-drawer-access {
    grid-column:span 2;
    min-height:2.35rem;
    padding:.5rem .65rem;
    font-size:.58rem!important;
}
.appointment-drawer-action-grid { display:contents; }
.appointment-preview-drawer > footer .appointment-drawer-action-grid > .button,
.appointment-preview-drawer > footer .appointment-drawer-action-grid > .appointment-drawer-pending {
    grid-column:auto;
    min-height:2.35rem;
    padding:.48rem .5rem;
    font-size:.52rem;
    white-space:nowrap;
}
.appointment-drawer-action-grid > .appointment-drawer-modify { order:1; }
.appointment-preview-drawer > footer .appointment-drawer-access { order:0; }
.appointment-drawer-action-grid > .appointment-drawer-message { order:2; }
.appointment-drawer-action-grid > .appointment-drawer-pending { order:1; }
.appointment-drawer-action-grid > .appointment-drawer-invoice { order:3; }
.appointment-drawer-action-grid > .appointment-drawer-cancel { order:4; }
.appointment-drawer-action-grid > .button .media-picto,
.appointment-preview-drawer > footer .appointment-drawer-access .media-picto,
.appointment-drawer-action-grid > .appointment-drawer-pending .media-picto {
    width:.72rem;
    height:.72rem;
}
@media(max-width:390px) {
    .appointment-preview-drawer > footer { gap:.3rem; padding:.55rem .6rem; }
    .appointment-drawer-action-grid > .button,
    .appointment-drawer-action-grid > .appointment-drawer-pending { padding-inline:.35rem; font-size:.48rem; }
}

/* Disposition finale : une ligne principale et une seule ligne d’actions. */
.appointment-preview-drawer > footer { grid-template-columns:1fr; }
.appointment-preview-drawer > footer .appointment-drawer-access {
    width:100%;
    grid-column:auto;
}
.appointment-preview-drawer > footer .appointment-drawer-action-grid {
    display:flex;
    min-width:0;
    gap:.4rem;
}
.appointment-preview-drawer > footer .appointment-drawer-action-grid > .button,
.appointment-preview-drawer > footer .appointment-drawer-action-grid > .appointment-drawer-pending {
    width:auto;
    min-width:0;
    flex:1 1 0;
    grid-column:auto;
    overflow:hidden;
    text-overflow:ellipsis;
}
@media(max-width:420px) {
    .appointment-preview-drawer > footer .appointment-drawer-action-grid { gap:.25rem; }
    .appointment-preview-drawer > footer .appointment-drawer-action-grid > .button,
    .appointment-preview-drawer > footer .appointment-drawer-action-grid > .appointment-drawer-pending { min-height:2.2rem; padding-inline:.3rem; font-size:.46rem; }
    .appointment-preview-drawer > footer .appointment-drawer-action-grid > .button .media-picto,
    .appointment-preview-drawer > footer .appointment-drawer-action-grid > .appointment-drawer-pending .media-picto { display:none; }
}

/* Tableau de bord : le prochain rendez-vous reste informatif sans dominer la page. */
.appointments-section .section-heading { min-height:3.45rem; padding:.55rem .8rem; }
.appointments-section .section-heading > div { gap:.6rem; }
.appointments-section .section-count { width:2rem; height:2rem; flex-basis:2rem; border-radius:.58rem; font-size:.62rem; }
.appointments-section .section-heading h2 { font-size:.78rem; }
.appointments-section .section-heading p { font-size:.48rem; }
.appointments-section .dashboard-appointment-grid { gap:.5rem; padding:.6rem; }
.appointments-section .dashboard-appointment-card {
    grid-template-columns:3.35rem minmax(10rem,1.2fr) minmax(12rem,1fr) auto;
    gap:.7rem;
    padding:.55rem .65rem;
    border-radius:.8rem;
}
.appointments-section .dashboard-appointment-date { width:3.35rem; min-height:3.65rem; border-radius:.62rem; }
.appointments-section .dashboard-appointment-date strong { font-size:1.08rem; }
.appointments-section .dashboard-appointment-card.is-next .dashboard-appointment-main { padding-top:.48rem; }
.appointments-section .dashboard-next-label { font-size:.4rem; }
.appointments-section .dashboard-appointment-practitioner { gap:.42rem; }
.appointments-section .dashboard-appointment-practitioner > span { width:2rem; height:2rem; border-radius:.5rem; }
.appointments-section .dashboard-appointment-practitioner small { font-size:.47rem; }
.appointments-section .dashboard-appointment-practitioner strong,
.appointments-section .dashboard-appointment-practitioner .psychologist-name-link { font-size:.7rem; }
.appointments-section .dashboard-appointment-meta > span { gap:.4rem; padding-inline:.6rem; }
.appointments-section .dashboard-appointment-meta i { width:1.7rem; height:1.7rem; flex-basis:1.7rem; border-radius:.48rem; }
.appointments-section .dashboard-appointment-meta i .media-picto { width:.7rem; height:.7rem; }
.appointments-section .dashboard-appointment-meta strong { font-size:.58rem; }
.appointments-section .dashboard-appointment-meta small { font-size:.4rem; }
.appointments-section .dashboard-appointment-meta em { font-size:.46rem; }
.appointments-section .dashboard-appointment-actions .button { min-height:2.2rem; padding:.5rem .62rem; font-size:.55rem; }
.appointments-section .dashboard-appointment-actions .more-button { width:2.2rem; height:2.2rem; flex-basis:2.2rem; }
.appointments-section .dashboard-appointment-card .status-pill { font-size:.48rem; }

/* Annuaire : choix grille/liste mémorisé côté navigateur. */
.directory-results .results-heading { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.directory-view-switch { display:inline-flex; flex:none; gap:.18rem; padding:.2rem; border:1px solid var(--line); border-radius:.65rem; background:var(--surface); }
.directory-view-switch button { display:grid; width:2rem; height:2rem; padding:0; place-items:center; border:0; border-radius:.48rem; color:var(--muted); background:transparent; cursor:pointer; transition:color .18s ease,background .18s ease,box-shadow .18s ease; }
.directory-view-switch button:hover { color:var(--primary); background:var(--mint-soft); }
.directory-view-switch button.is-active { color:#fff; background:var(--primary); box-shadow:0 .3rem .8rem rgba(35,117,113,.18); }
.directory-view-switch svg { width:.92rem; height:.92rem; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }

.directory-results[data-view="list"] .current-psy-grid { grid-template-columns:1fr; gap:.65rem; }
.directory-results[data-view="list"] .current-psy-card { border-radius:.85rem; }
.directory-results[data-view="list"] .current-psy-card:hover { transform:translateY(-1px); }
.directory-results[data-view="list"] .current-psy-preview { grid-template-columns:7.25rem minmax(0,1fr); min-height:8.5rem; }
.directory-results[data-view="list"] .current-psy-photo { width:7.25rem; height:100%; min-height:8.5rem; aspect-ratio:auto; }
.directory-results[data-view="list"] .current-psy-body { grid-template-columns:minmax(0,1fr) minmax(10rem,.55fr); grid-template-rows:auto auto auto; align-content:center; column-gap:1rem; padding:.8rem 1rem; }
.directory-results[data-view="list"] .current-psy-body > .psychologist-name-link,
.directory-results[data-view="list"] .current-psy-body > small,
.directory-results[data-view="list"] .current-psy-meta { grid-column:1; }
.directory-results[data-view="list"] .current-psy-meta { margin-top:.5rem; }
.directory-results[data-view="list"] .current-psy-availability { grid-column:2; grid-row:1 / 4; align-content:center; margin:0; padding:0 0 0 1rem; border-top:0; border-left:1px solid var(--line); }
.directory-results[data-view="list"] .current-psy-availability small { font-size:.52rem; }
.directory-results[data-view="list"] .current-psy-availability b { margin-top:.12rem; font-size:.66rem; }
html[data-theme="dark"] .directory-view-switch { background:#081713; }
html[data-theme="dark"] .directory-view-switch button:hover { background:#17352f; }

@media(max-width:760px) {
    .appointments-section .dashboard-appointment-card { grid-template-columns:3rem minmax(0,1fr) auto; }
    .appointments-section .dashboard-appointment-date { width:3rem; }
    .directory-results[data-view="list"] .current-psy-preview { grid-template-columns:5rem minmax(0,1fr); min-height:6.5rem; }
    .directory-results[data-view="list"] .current-psy-photo { width:5rem; min-height:6.5rem; }
    .directory-results[data-view="list"] .current-psy-body { grid-template-columns:1fr; padding:.65rem .75rem; }
    .directory-results[data-view="list"] .current-psy-availability { grid-column:1; grid-row:auto; margin-top:.5rem; padding:.45rem 0 0; border-top:1px solid var(--line); border-left:0; }
}
@media(max-width:480px) {
    .directory-results .results-heading { align-items:flex-start; }
    .directory-view-switch button { width:1.85rem; height:1.85rem; }
    .directory-results[data-view="list"] .current-psy-preview { grid-template-columns:4.25rem minmax(0,1fr); min-height:5.8rem; }
    .directory-results[data-view="list"] .current-psy-photo { width:4.25rem; min-height:5.8rem; }
    .directory-results[data-view="list"] .current-psy-meta { display:none; }
}

/* Vue liste enrichie des psychologues. */
.current-psy-list-info,
.current-psy-list-actions { display:none; }
.directory-results[data-view="list"] .current-psy-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; }
.directory-results[data-view="list"] .current-psy-preview { grid-template-columns:7.5rem minmax(0,1fr); min-height:12rem; }
.directory-results[data-view="list"] .current-psy-photo { width:7.5rem; height:100%; min-height:12rem; }
.directory-results[data-view="list"] .current-psy-body { display:grid; grid-template-columns:1fr; grid-template-rows:auto auto auto auto auto 1fr; align-content:start; gap:.06rem; min-width:0; padding:.8rem; }
.directory-results[data-view="list"] .current-psy-body > .psychologist-name-link,
.directory-results[data-view="list"] .current-psy-body > small,
.directory-results[data-view="list"] .current-psy-meta,
.directory-results[data-view="list"] .current-psy-availability { grid-column:1; grid-row:auto; }
.directory-results[data-view="list"] .current-psy-body > .psychologist-name-link { font-size:.78rem; }
.directory-results[data-view="list"] .current-psy-body > small { font-size:.54rem; }
.directory-results[data-view="list"] .current-psy-meta { margin-top:.38rem; }
.directory-results[data-view="list"] .current-psy-meta > span { font-size:.48rem; }
.directory-results[data-view="list"] .current-psy-list-info { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.35rem; margin-top:.55rem; padding-top:.55rem; border-top:1px solid var(--line); }
.directory-results[data-view="list"] .current-psy-list-info > span { display:grid; min-width:0; gap:.1rem; padding:.42rem .48rem; border-radius:.52rem; background:var(--surface); }
.directory-results[data-view="list"] .current-psy-list-info small { color:var(--muted); font-size:.4rem; font-weight:750; letter-spacing:.035em; text-transform:uppercase; }
.directory-results[data-view="list"] .current-psy-list-info strong { overflow:hidden; color:var(--ink); font-size:.49rem; line-height:1.3; text-overflow:ellipsis; white-space:nowrap; }
.directory-results[data-view="list"] .current-psy-availability { display:flex; width:max-content; max-width:100%; align-items:center; justify-content:flex-start; gap:.48rem; margin-top:.5rem; padding:.34rem .38rem .34rem .52rem; border:1px solid rgba(35,117,113,.12); border-left:3px solid var(--primary); border-radius:.52rem; background:var(--mint-soft); }
.directory-results[data-view="list"] .current-psy-availability small { flex:none; font-size:.43rem; font-weight:750; letter-spacing:.025em; text-transform:uppercase; }
.directory-results[data-view="list"] .current-psy-availability b { overflow:hidden; margin:0; padding:.22rem .38rem; border-radius:.38rem; color:var(--primary); background:rgba(255,255,255,.62); font-size:.53rem; text-align:left; text-overflow:ellipsis; white-space:nowrap; }
.directory-results[data-view="list"] .current-psy-list-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.35rem; align-self:end; margin-top:.55rem; }
.directory-results[data-view="list"] .current-psy-list-actions .button { min-width:0; min-height:2.05rem; justify-content:center; gap:.28rem; padding:.42rem .38rem; font-size:.48rem; text-decoration:none; }
.directory-results[data-view="list"] .current-psy-list-actions .media-picto { width:.66rem; height:.66rem; flex:none; }
html[data-theme="dark"] .directory-results[data-view="list"] .current-psy-list-info > span { background:#081713; }
html[data-theme="dark"] .directory-results[data-view="list"] .current-psy-availability { background:#17352f; }
html[data-theme="dark"] .directory-results[data-view="list"] .current-psy-availability b { background:#0d211c; }

@media(max-width:1250px) {
    .directory-results[data-view="list"] .current-psy-grid { grid-template-columns:1fr; }
    .directory-results[data-view="list"] .current-psy-preview { min-height:10rem; }
    .directory-results[data-view="list"] .current-psy-photo { min-height:10rem; }
}
@media(max-width:620px) {
    .directory-results[data-view="list"] .current-psy-preview { grid-template-columns:5.25rem minmax(0,1fr); min-height:10rem; }
    .directory-results[data-view="list"] .current-psy-photo { width:5.25rem; min-height:10rem; }
    .directory-results[data-view="list"] .current-psy-list-info { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .directory-results[data-view="list"] .current-psy-list-actions { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:410px) {
    .directory-results[data-view="list"] .current-psy-preview { grid-template-columns:4.4rem minmax(0,1fr); }
    .directory-results[data-view="list"] .current-psy-photo { width:4.4rem; }
    .directory-results[data-view="list"] .current-psy-list-info { grid-template-columns:1fr; }
    .directory-results[data-view="list"] .current-psy-list-info > span:nth-child(2) { display:none; }
    .directory-results[data-view="list"] .current-psy-availability { width:100%; align-items:flex-start; flex-direction:column; gap:.12rem; }
    .directory-results[data-view="list"] .current-psy-availability b { max-width:100%; text-align:left; }
}

/* Vue liste plus dense : informations et actions disposées horizontalement. */
.directory-results[data-view="list"] .current-psy-preview { min-height:9rem; }
.directory-results[data-view="list"] .current-psy-photo { min-height:9rem; }
.directory-results[data-view="list"] .current-psy-body {
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-rows:auto auto auto 1fr;
    align-content:stretch;
    gap:.05rem .65rem;
    padding:.65rem .7rem;
}
.directory-results[data-view="list"] .current-psy-body > .psychologist-name-link { grid-column:1; grid-row:1; align-self:end; }
.directory-results[data-view="list"] .current-psy-body > small { grid-column:1; grid-row:2; }
.directory-results[data-view="list"] .current-psy-meta { grid-column:2; grid-row:1 / 3; align-self:center; justify-content:flex-end; margin:0; }
.directory-results[data-view="list"] .current-psy-list-info { grid-column:1 / -1; grid-row:3; gap:.3rem; margin-top:.42rem; padding-top:.42rem; }
.directory-results[data-view="list"] .current-psy-list-info > span { padding:.32rem .4rem; }
.directory-results[data-view="list"] .current-psy-availability { grid-column:1; grid-row:4; align-self:end; margin-top:.42rem; }
.directory-results[data-view="list"] .current-psy-list-actions { grid-column:2; grid-row:4; align-self:end; min-width:14.5rem; margin-top:.42rem; }
.directory-results[data-view="list"] .current-psy-list-actions .button { min-height:1.9rem; padding-block:.35rem; }

@media(max-width:720px) {
    .directory-results[data-view="list"] .current-psy-preview { min-height:8rem; }
    .directory-results[data-view="list"] .current-psy-photo { min-height:8rem; }
    .directory-results[data-view="list"] .current-psy-body { grid-template-columns:1fr; grid-template-rows:auto; }
    .directory-results[data-view="list"] .current-psy-body > .psychologist-name-link,
    .directory-results[data-view="list"] .current-psy-body > small,
    .directory-results[data-view="list"] .current-psy-meta,
    .directory-results[data-view="list"] .current-psy-list-info,
    .directory-results[data-view="list"] .current-psy-availability,
    .directory-results[data-view="list"] .current-psy-list-actions { grid-column:1; grid-row:auto; }
    .directory-results[data-view="list"] .current-psy-meta { justify-content:flex-start; margin-top:.3rem; }
    .directory-results[data-view="list"] .current-psy-list-actions { width:100%; min-width:0; }
}

/* Suppression des espaces extensibles dans les cartes en liste. */
.directory-results[data-view="list"] .current-psy-preview { min-height:8.25rem; }
.directory-results[data-view="list"] .current-psy-photo { min-height:8.25rem; }
.directory-results[data-view="list"] .current-psy-body {
    grid-template-rows:auto auto auto auto;
    align-content:start;
}
.directory-results[data-view="list"] .current-psy-list-info { grid-template-columns:repeat(2,minmax(0,1fr)); }
.directory-results[data-view="list"] .current-psy-availability,
.directory-results[data-view="list"] .current-psy-list-actions { align-self:start; }
.directory-results[data-view="list"] .current-psy-list-actions { min-width:10.5rem; grid-template-columns:repeat(2,minmax(0,1fr)); }

/* Les portraits de la vue liste occupent exactement la hauteur uniforme des cartes. */
.directory-results[data-view="list"] .current-psy-preview {
    height:9rem;
    min-height:9rem;
    max-height:9rem;
}
.directory-results[data-view="list"] .current-psy-photo {
    width:7.5rem;
    height:100%;
    min-height:100%;
    max-height:100%;
    aspect-ratio:auto;
    align-self:stretch;
}
.directory-results[data-view="list"] .current-psy-photo img {
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
}

@media(max-width:720px) {
    .directory-results[data-view="list"] .current-psy-preview {
        height:auto;
        min-height:8rem;
        max-height:none;
    }
    .directory-results[data-view="list"] .current-psy-photo {
        width:5.25rem;
        height:auto;
        min-height:100%;
        max-height:none;
    }
}

@media(max-width:410px) {
    .directory-results[data-view="list"] .current-psy-photo { width:4.4rem; }
}

/* Recherches : pictogrammes centres et dimensionnes de facon identique. */
.faq-search > span,
.directory-main-search > span {
    display:grid;
    width:1.2rem;
    height:1.2rem;
    flex:0 0 1.2rem;
    place-items:center;
    line-height:1;
}
.faq-search > span svg,
.directory-main-search > span svg {
    display:block;
    width:.9rem;
    height:.9rem;
    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}
.faq-search input,
.directory-main-search input { min-height:1.6rem; line-height:1.4; }

/* La reponse ouverte conserve le meme espace au-dessus et au-dessous. */
.faq-item[open] > div { padding:.75rem 3.2rem .75rem 1.2rem; }

/* En-tete compact de la proposition de modification. */
.appointment-edit-page-card > header { padding-block:.78rem; }
.appointment-edit-page-card > header > div > div {
    display:grid;
    gap:.08rem;
    align-content:center;
}
.appointment-edit-page-card > header .eyebrow,
.appointment-edit-page-card > header h2,
.appointment-edit-page-card > header p { margin:0; line-height:1.25; }
.appointment-edit-page-card > header h2 { margin-top:.04rem; }

/* Prochains rendez-vous : informations principales plus faciles a parcourir. */
.appointments-section .dashboard-appointment-meta { gap:.38rem; }
.appointments-section .dashboard-appointment-meta > span {
    min-height:2.55rem;
    flex:1 1 0;
    gap:.46rem;
    padding:.38rem .5rem;
    border:1px solid var(--line);
    border-radius:.62rem;
    background:var(--surface);
}
.appointments-section .dashboard-appointment-meta > span:first-child { padding-left:.5rem; }
.appointments-section .dashboard-appointment-meta > span + span { border-left:1px solid var(--line); }
.appointments-section .dashboard-appointment-meta > span > span {
    grid-template-columns:auto auto;
    align-items:baseline;
    justify-content:start;
    gap:.05rem .28rem;
}
.appointments-section .dashboard-appointment-meta small {
    grid-column:1 / -1;
    color:var(--primary);
    font-size:.43rem;
}
.appointments-section .dashboard-appointment-meta strong { font-size:.64rem; }
.appointments-section .dashboard-appointment-meta em {
    padding:.08rem .25rem;
    border-radius:.3rem;
    color:var(--muted);
    background:var(--white);
    font-size:.47rem;
    white-space:nowrap;
}
.appointments-section .dashboard-appointment-grid.is-multiple .dashboard-appointment-meta {
    padding-top:0;
    border-top:0;
}
.appointments-section .dashboard-appointment-grid.is-multiple .dashboard-appointment-meta > span { padding:.35rem .44rem; }
html[data-theme="dark"] .appointments-section .dashboard-appointment-meta > span { background:#102522; border-color:#294741; }
html[data-theme="dark"] .appointments-section .dashboard-appointment-meta em { background:#081713; }

@media(max-width:680px) {
    .appointments-section .dashboard-appointment-meta > span + span {
        padding-top:.38rem;
        border-top:1px solid var(--line);
        border-left:1px solid var(--line);
    }
}

/* Planning indisponible : état explicite, compact et lisible dans les deux thèmes. */
.booking-unavailable-card {
    display:grid;
    width:min(100%,48rem);
    grid-template-columns:auto minmax(0,1fr);
    gap:1rem 1.15rem;
    margin:1.2rem auto;
    padding:1.25rem;
    border:1px solid var(--line);
    border-radius:1.1rem;
    color:var(--text);
    background:linear-gradient(135deg,var(--white),var(--warm-white));
    box-shadow:0 1rem 2.8rem rgba(18,63,60,.08);
}
.booking-unavailable-practitioner { grid-column:1/-1; display:flex; align-items:center; gap:.65rem; padding-bottom:.85rem; border-bottom:1px solid var(--line); }
.booking-unavailable-practitioner > span { display:grid; width:2.65rem; height:2.65rem; place-items:center; overflow:hidden; border-radius:.72rem; color:#fff; background:var(--primary); font-size:.62rem; font-weight:800; }
.booking-unavailable-practitioner img { width:100%; height:100%; object-fit:cover; }
.booking-unavailable-practitioner div { display:grid; gap:.05rem; }
.booking-unavailable-practitioner small { color:var(--muted); font-size:.52rem; }
.booking-unavailable-practitioner strong { color:var(--ink); font-size:.72rem; }
.booking-unavailable-practitioner em { margin-left:auto; padding:.28rem .48rem; border-radius:999px; color:var(--primary); background:var(--mint-soft); font-size:.5rem; font-style:normal; font-weight:800; }
.booking-unavailable-icon { display:grid; width:3.25rem; height:3.25rem; place-items:center; border-radius:.9rem; color:var(--primary); background:var(--mint-soft); }
.booking-unavailable-icon .media-picto { width:1.35rem; height:1.35rem; }
.booking-unavailable-icon > svg { width:1.4rem; height:1.4rem; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.booking-unavailable-copy h1 { max-width:35rem; margin:.18rem 0 .35rem; color:var(--ink); font-size:clamp(1.15rem,2.5vw,1.65rem); line-height:1.2; }
.booking-unavailable-copy p { max-width:35rem; margin:0; color:var(--muted); font-size:.67rem; line-height:1.6; }
.booking-unavailable-actions { grid-column:2; display:flex; flex-wrap:wrap; gap:.5rem; }
.booking-unavailable-actions .button { text-decoration:none; }
html[data-theme="dark"] .booking-unavailable-card { border-color:#31514b; color:#d8e8e5; background:linear-gradient(135deg,#142927,#0d201e); box-shadow:0 1rem 2.8rem rgba(0,0,0,.28); }
html[data-theme="dark"] .booking-unavailable-practitioner { border-color:#31514b; }
html[data-theme="dark"] .booking-unavailable-practitioner strong,
html[data-theme="dark"] .booking-unavailable-copy h1 { color:#f3fbf9; }
html[data-theme="dark"] .booking-unavailable-practitioner small,
html[data-theme="dark"] .booking-unavailable-copy p { color:#adc6c2; }
html[data-theme="dark"] .booking-unavailable-practitioner em { color:#a8e2dc; background:#1d403c; }
html[data-theme="dark"] .booking-unavailable-icon { color:#8bd4ce; background:#1d403c; }
html[data-theme="dark"] .booking-unavailable-actions .button-secondary { border-color:#3a5c56; color:#e5f2ef; background:#102522; }

/* Responsive : conserver les statuts et les actions des rendez-vous sur une ligne. */
@media(max-width:760px) {
    .app-sidebar .sidebar-head .brand img { width:102px; }
    .appointment-summary { grid-template-columns:repeat(3,minmax(0,1fr)); gap:.38rem; }
    .appointment-summary article { justify-content:center; gap:.4rem; min-width:0; padding:.55rem .42rem; }
    .appointment-summary .summary-icon { width:1.75rem; height:1.75rem; flex:0 0 1.75rem; }
    .appointment-summary strong { font-size:.68rem; }
    .appointment-summary p { font-size:.42rem; }
    .appointment-tabs { width:100%; }
    .appointment-tabs button { min-width:0; flex:1 1 0; justify-content:center; padding:.58rem .25rem; white-space:nowrap; }
    .app-body .appointment-row .appointment-row-actions { align-self:center; flex-direction:row; gap:.28rem; }
    .appointment-row-actions .appointment-direct-link { min-height:2.15rem; padding:.4rem .55rem; }
    .appointments-intro .page-intro-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.45rem; }
    .appointments-intro .page-intro-actions .button { width:100%; min-width:0; padding-inline:.45rem; text-align:center; }
}

@media(max-width:520px) {
    .booking-unavailable-card { grid-template-columns:1fr; gap:.75rem; padding:1rem; }
    .booking-unavailable-icon { width:2.75rem; height:2.75rem; }
    .booking-unavailable-actions { grid-column:1; display:grid; grid-template-columns:1fr; }
    .booking-unavailable-actions .button { width:100%; }
    .appointment-summary article { flex-direction:column; gap:.2rem; text-align:center; }
    .appointment-tabs button { gap:.18rem; font-size:.48rem; }
    .appointment-tabs button > i { width:.9rem; height:.9rem; }
    .appointment-tabs button > span { padding-inline:.24rem; }
}

/* Fleches optiquement centrees dans le bloc des psychologues. */
.practitioner-card > a svg,
.practitioner-arrow svg {
    display: block;
    width: .8rem;
    height: .8rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.practitioner-card > a {
    display: grid;
    align-items: center;
    justify-items: center;
    line-height: 1;
}
.practitioner-arrow {
    display: inline-grid;
    width: 1rem;
    height: 1rem;
    margin-left: .12rem;
    place-items: center;
    vertical-align: middle;
}

@media (max-width: 560px) {
    .appointment-preview-drawer > footer { grid-template-columns: 1fr; }
    .appointment-preview-drawer > footer > * { grid-column: 1 !important; }
}

/* Acces rapide au dernier psychologue */
.sidebar-nav > .sidebar-booking-shortcut {
    display:grid;
    grid-template-columns:2.15rem minmax(0,1fr) .8rem;
    min-height:0;
    margin:.08rem .35rem .3rem;
    padding:.58rem;
    gap:.58rem;
    border:1px solid rgba(35,117,113,.18);
    border-radius:.8rem;
    color:var(--ink);
    background:linear-gradient(135deg,#f5fbfa,#edf7f5);
}
.sidebar-booking-shortcut:hover { border-color:rgba(35,117,113,.38); background:var(--mint-soft)!important; transform:translateY(-1px); }
.sidebar-booking-avatar { display:grid; width:2.15rem; height:2.15rem; place-items:center; overflow:hidden; border-radius:.65rem; color:var(--primary); background:#dcefed; font-size:.68rem; font-weight:800; }
.sidebar-booking-avatar img { width:100%; height:100%; object-fit:cover; }
.sidebar-booking-shortcut > span:nth-child(2) { display:grid; min-width:0; line-height:1.25; }
.sidebar-booking-shortcut small { color:var(--primary); font-size:.43rem; font-style:normal; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.sidebar-booking-shortcut strong { overflow:hidden; font-size:.57rem; text-overflow:ellipsis; white-space:nowrap; }
.sidebar-booking-shortcut em { overflow:hidden; color:var(--muted); font-size:.45rem; font-style:normal; text-overflow:ellipsis; white-space:nowrap; }
.sidebar-booking-shortcut > svg { width:.8rem; fill:none; stroke:currentColor; stroke-width:2; }
html[data-theme="dark"] .sidebar-nav > .sidebar-booking-shortcut { color:var(--ink); border-color:#31514b; background:#102522; }
html[data-theme="dark"] .sidebar-booking-shortcut:hover { background:#17352f!important; }

/* Historique des consultations */
.appointment-history-link .media-picto,.history-download-main .media-picto,.history-header-download .media-picto { width:.9rem; height:.9rem; }
.history-filter-card,.history-card { overflow:hidden; border:1px solid var(--line); border-radius:1.15rem; background:var(--white); box-shadow:0 1rem 2.8rem rgba(76,57,43,.07); }
.history-filter-card { margin-bottom:1rem; }
.history-filter-card > header,.history-card > header { display:flex; align-items:center; justify-content:space-between; gap:.7rem; padding:.85rem 1rem; border-bottom:1px solid var(--line); }
.history-filter-card > header { justify-content:flex-start; }
.history-filter-card > header > span { display:grid; width:2.15rem; height:2.15rem; flex:none; place-items:center; border-radius:.65rem; color:var(--primary); background:var(--mint-soft); }
.history-filter-card > header .media-picto { width:1rem; height:1rem; }
.history-filter-card h2,.history-card h2 { margin:0; color:var(--ink); font-size:.78rem; }
.history-filter-card header p,.history-card header p { margin:.08rem 0 0; color:var(--muted); font-size:.5rem; }
.history-filter-form { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)) auto; gap:.7rem; align-items:end; padding:1rem; }
.history-filter-form label { display:grid; gap:.32rem; min-width:0; }
.history-filter-form label > span { color:var(--ink); font-size:.5rem; font-weight:800; }
.history-filter-form input,.history-filter-form select { width:100%; min-height:2.65rem; border:1px solid var(--line); border-radius:.72rem; color:var(--ink); background:#fbfdfd; }
.history-filter-actions { display:flex; gap:.45rem; }
.history-filter-actions .button { min-height:2.65rem; padding-inline:.8rem; }
.history-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.8rem; margin-bottom:1rem; }
.history-summary article { display:flex; align-items:center; gap:.7rem; padding:.8rem .9rem; border:1px solid var(--line); border-radius:.95rem; background:rgba(255,255,255,.72); }
.history-summary article > span { display:grid; width:2.15rem; height:2.15rem; flex:none; place-items:center; border-radius:.65rem; color:var(--primary); background:var(--mint-soft); }
.history-summary .media-picto { width:1rem; height:1rem; }
.history-summary small { display:block; color:var(--muted); font-size:.46rem; font-weight:700; }
.history-summary strong { display:block; color:var(--ink); font-size:.7rem; }
.history-header-download { display:inline-flex; align-items:center; gap:.35rem; padding:.4rem .6rem; border-radius:.55rem; color:var(--primary); background:var(--mint-soft); font-size:.52rem; font-weight:800; }
.history-table-wrap { overflow-x:auto; }
.history-table { width:100%; border-collapse:collapse; }
.history-table th { padding:.55rem .8rem; color:var(--muted); background:#fafcfb; font-size:.45rem; letter-spacing:.06em; text-align:left; text-transform:uppercase; }
.history-table td { padding:.72rem .8rem; border-top:1px solid var(--line); color:var(--text); font-size:.55rem; vertical-align:middle; }
.history-table td:first-child strong,.history-table td:first-child small { display:block; }
.history-table td:first-child small { color:var(--muted); }
.history-media { display:inline-flex; align-items:center; gap:.35rem; color:var(--ink); font-weight:750; }
.history-media .media-picto { width:.9rem; height:.9rem; color:var(--primary); }
.history-row-action { display:grid; width:2rem; height:2rem; place-items:center; border:1px solid var(--line); border-radius:.6rem; color:var(--primary); transition:.18s ease; }
.history-row-action:hover { color:#fff; border-color:var(--primary); background:var(--primary); transform:translateX(2px); }
.history-row-action svg { width:.85rem; fill:none; stroke:currentColor; stroke-width:2; }
.history-empty { display:grid; justify-items:center; padding:2.4rem 1rem; text-align:center; }
.history-empty > .media-picto { width:1.5rem; height:1.5rem; color:var(--primary); }
.history-empty h2 { margin:.6rem 0 .15rem; }
.history-empty p { margin:0 0 .8rem; font-size:.58rem; }
html[data-theme="dark"] .history-filter-card,html[data-theme="dark"] .history-card { background:#0d1e1a; border-color:#284640; }
html[data-theme="dark"] .history-summary article { background:#0d1e1a; border-color:#284640; }
html[data-theme="dark"] .history-table th { background:#081713; }
html[data-theme="dark"] .history-table td { border-color:#284640; }

/* Navigation et suppression du compte */
.profile-section-nav { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.65rem; margin:0 0 1rem; }
.profile-section-nav a { display:grid; grid-template-columns:2rem minmax(0,1fr); grid-template-rows:auto auto; column-gap:.6rem; align-items:center; min-width:0; padding:.65rem .75rem; border:1px solid var(--line); border-radius:.85rem; background:rgba(255,255,255,.68); transition:.18s ease; }
.profile-section-nav a:hover { border-color:rgba(35,117,113,.35); background:var(--mint-soft); transform:translateY(-2px); }
.profile-section-nav a > span { display:grid; grid-row:1/3; width:2rem; height:2rem; place-items:center; border-radius:.58rem; color:var(--primary); background:var(--mint-soft); }
.profile-section-nav .media-picto { width:.9rem; height:.9rem; }
.profile-section-nav strong { color:var(--ink); font-size:.55rem; }
.profile-section-nav small { overflow:hidden; color:var(--muted); font-size:.43rem; text-overflow:ellipsis; white-space:nowrap; }
.account-deletion-card { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:1rem; border-color:rgba(248,118,121,.23); background:linear-gradient(135deg,#fff,#fff7f5); }
.account-deletion-copy { display:flex; gap:.8rem; max-width:52rem; }
.account-deletion-icon { display:grid; width:2.4rem; height:2.4rem; flex:none; place-items:center; border-radius:.75rem; color:#a44b4b; background:#fff0ef; }
.account-deletion-icon svg { width:1.05rem; fill:none; stroke:currentColor; stroke-width:1.8; }
.account-deletion-card h2 { margin:.08rem 0 .22rem; font-size:.78rem; }
.account-deletion-card p,.account-deletion-card li { font-size:.52rem; }
.account-deletion-card p { margin:0; }
.account-deletion-card ul { display:grid; gap:.16rem; margin:.55rem 0 0; padding-left:1rem; }
.account-deletion-dialog { width:min(38rem,calc(100% - 1.5rem)); padding:0; border:0; border-radius:1.1rem; color:var(--text); background:transparent; }
.account-deletion-dialog::backdrop { background:rgba(8,29,28,.62); backdrop-filter:blur(4px); }
.account-deletion-dialog-card { overflow:hidden; border:1px solid var(--line); border-radius:1.1rem; background:var(--white); box-shadow:var(--shadow); }
.account-deletion-dialog-card > header { position:relative; display:grid; grid-template-columns:2.4rem minmax(0,1fr) 2rem; gap:.7rem; padding:1rem; border-bottom:1px solid var(--line); }
.account-deletion-dialog-card h2 { margin:.08rem 0 .2rem; color:var(--ink); font-size:.8rem; }
.account-deletion-dialog-card header p { margin:0; font-size:.52rem; }
.account-deletion-dialog-body { display:grid; gap:.8rem; padding:1rem; }
.account-deletion-dialog-body > label:not(.account-deletion-check) { display:grid; gap:.3rem; color:var(--ink); font-size:.52rem; font-weight:800; }
.account-deletion-dialog-body textarea,.account-deletion-dialog-body input[type="password"] { width:100%; border:1px solid var(--line); border-radius:.7rem; background:#fbfdfd; }
.account-deletion-check { display:flex; align-items:flex-start; gap:.55rem; padding:.7rem; border-radius:.7rem; color:var(--text); background:#fff7f5; font-size:.5rem; }
.account-deletion-check input { width:1rem; height:1rem; flex:none; margin:.12rem 0 0; accent-color:var(--coral); }
.account-deletion-dialog-card > footer { display:flex; justify-content:flex-end; gap:.55rem; padding:.8rem 1rem; border-top:1px solid var(--line); }
html[data-theme="dark"] .profile-section-nav a,html[data-theme="dark"] .account-deletion-card,html[data-theme="dark"] .account-deletion-dialog-card { background:#0d1e1a; border-color:#284640; }
html[data-theme="dark"] .account-deletion-check { background:#281c1b; }

@media(max-width:1100px){
    .history-filter-form { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .history-filter-actions { grid-column:1/-1; }
    .profile-section-nav { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .appointments-intro .page-intro-actions { flex-wrap:wrap; }
}
@media(max-width:650px){
    .history-filter-form,.history-summary,.profile-section-nav { grid-template-columns:1fr; }
    .history-filter-actions { display:grid; }
    .history-intro .history-download-main { width:100%; }
    .account-deletion-card { align-items:stretch; flex-direction:column; }
    .account-deletion-card > .button { width:100%; }
    .account-deletion-dialog-card > footer { display:grid; grid-template-columns:1fr; }
}

/* Profil : vrais onglets compacts */
.profile-section-nav {
    display:flex;
    gap:.35rem;
    padding:.35rem;
    overflow-x:auto;
    border:1px solid var(--line);
    border-radius:1rem;
    background:rgba(255,255,255,.72);
    scrollbar-width:none;
}
.profile-section-nav::-webkit-scrollbar { display:none; }
.profile-section-nav button {
    display:grid;
    grid-template-columns:1.9rem max-content;
    grid-template-rows:auto auto;
    min-width:max-content;
    flex:1 0 auto;
    column-gap:.55rem;
    align-items:center;
    padding:.58rem .78rem;
    border:0;
    border-radius:.72rem;
    color:var(--text);
    background:transparent;
    cursor:pointer;
    text-align:left;
    transition:color .18s ease,background .18s ease,box-shadow .18s ease,transform .18s ease;
}
.profile-section-nav button:hover { color:var(--ink); background:var(--mint-soft); transform:translateY(-1px); }
.profile-section-nav button.is-active { color:#fff; background:var(--primary); box-shadow:0 .45rem 1.2rem rgba(35,117,113,.2); }
.profile-section-nav button > span { display:grid; grid-row:1/3; width:1.9rem; height:1.9rem; place-items:center; border-radius:.55rem; color:var(--primary); background:var(--mint-soft); }
.profile-section-nav button.is-active > span { color:#fff; background:rgba(255,255,255,.16); }
.profile-section-nav button strong { color:inherit; font-size:.57rem; }
.profile-section-nav button small { color:var(--muted); font-size:.43rem; }
.profile-section-nav button.is-active small { color:rgba(255,255,255,.76); }
[data-profile-security-grid] > .profile-card { grid-column:1/-1; }
html[data-theme="dark"] .profile-section-nav { border-color:#284640; background:#0d1e1a; }
html[data-theme="dark"] .profile-section-nav button:hover { background:#17352f; }

/* Historique : champs, psychologues et ouverture du drawer */
.history-filter-form input[type="date"] {
    padding:.64rem .75rem;
    color:var(--ink);
    font-size:.62rem;
    font-weight:700;
    line-height:1;
    letter-spacing:0;
}
.history-filter-form input[type="date"]::-webkit-datetime-edit { padding:0; }
.history-filter-form input[type="date"]::-webkit-datetime-edit-fields-wrapper { display:flex; align-items:center; }
.history-filter-form input[type="date"]::-webkit-calendar-picker-indicator { width:1rem; height:1rem; margin:0; padding:.15rem; cursor:pointer; opacity:.72; }
.history-psychologist { display:flex; align-items:center; gap:.55rem; min-width:10rem; }
.history-psychologist-avatar { display:grid; width:2rem; height:2rem; flex:0 0 2rem; place-items:center; overflow:hidden; border-radius:.58rem; color:var(--primary); background:var(--mint-soft); font-size:.55rem; font-weight:800; }
.history-psychologist-avatar img { width:100%; height:100%; object-fit:cover; }
.history-psychologist > span:last-child { display:grid; line-height:1.25; }
.history-psychologist .psychologist-name-link,.history-psychologist strong { color:var(--ink); font-size:.58rem; font-weight:800; }
.history-psychologist .psychologist-name-link:hover { color:var(--primary); text-decoration:underline; text-underline-offset:.15rem; }
.history-psychologist small { margin-top:.12rem; color:var(--muted); font-size:.43rem; }
.history-table th:last-child,.history-table td:last-child { width:3.8rem; text-align:center; }
.history-row-action {
    display:inline-grid;
    width:2.15rem;
    height:2.15rem;
    margin:0 auto;
    padding:0;
    place-items:center;
    vertical-align:middle;
    appearance:none;
    cursor:pointer;
}
.history-row-action svg { display:block; width:.82rem; height:.82rem; margin:0; }
html[data-theme="dark"] .history-filter-form input[type="date"] { color-scheme:dark; color:var(--ink); }
html[data-theme="dark"] .history-psychologist-avatar { background:#17352f; }

@media(max-width:650px){
    .profile-section-nav { grid-template-columns:none; }
    .profile-section-nav button { flex:0 0 auto; }
}

/* Profil : paramètres du compte et hiérarchie renforcée des actions sensibles. */
.account-settings-dialog {
    width:min(39rem,calc(100% - 1.5rem));
    padding:0;
    border:0;
    border-radius:1.15rem;
    color:var(--text);
    background:transparent;
}
.account-settings-dialog::backdrop { background:rgba(8,29,28,.62); backdrop-filter:blur(4px); }
.account-settings-dialog-card { overflow:hidden; border:1px solid var(--line); border-radius:1.15rem; background:var(--white); box-shadow:0 1.5rem 4rem rgba(13,46,43,.24); }
.account-settings-dialog-card > header { position:relative; display:grid; grid-template-columns:2.5rem minmax(0,1fr) 2rem; gap:.75rem; padding:1.05rem 1.1rem; border-bottom:1px solid var(--line); background:linear-gradient(135deg,var(--mint-soft),rgba(255,255,255,.82)); }
.account-settings-icon { display:grid; width:2.5rem; height:2.5rem; place-items:center; border-radius:.75rem; color:var(--primary); background:#fff; box-shadow:inset 0 0 0 1px rgba(35,117,113,.12); font-size:.82rem; font-weight:850; }
.account-settings-icon .media-picto { width:1.05rem; height:1.05rem; }
.account-settings-dialog-card h2 { margin:.08rem 0 .18rem; color:var(--ink); font-size:.84rem; }
.account-settings-dialog-card header p { max-width:30rem; margin:0; color:var(--muted); font-size:.52rem; line-height:1.5; }
.account-settings-dialog-body { display:grid; gap:.8rem; padding:1.05rem 1.1rem; }
.account-settings-dialog-body label { display:grid; gap:.3rem; min-width:0; color:var(--ink); font-size:.52rem; font-weight:800; }
.account-settings-dialog-body input { width:100%; min-height:2.7rem; padding:.65rem .75rem; border:1px solid var(--line); border-radius:.72rem; outline:0; color:var(--ink); background:#fbfdfd; font:inherit; font-size:.62rem; }
.account-settings-dialog-body input:focus { border-color:rgba(35,117,113,.55); box-shadow:0 0 0 3px rgba(35,117,113,.1); }
.account-password-grid { display:grid; grid-template-columns:1fr 1fr; align-items:start; gap:.7rem; }
.account-settings-hint { display:flex; align-items:center; gap:.4rem; margin:0; padding:.55rem .65rem; border-radius:.65rem; color:var(--muted); background:var(--surface); font-size:.49rem; line-height:1.45; }
.account-settings-hint .media-picto { width:.75rem; height:.75rem; flex:none; color:var(--primary); }
.account-settings-error { display:flex; align-items:flex-start; gap:.45rem; margin:0; padding:.65rem .7rem; border:1px solid rgba(164,75,75,.16); border-radius:.68rem; color:#873c3c; background:#fff1ef; font-size:.52rem; font-weight:700; }
.account-settings-error > span { display:grid; width:1.05rem; height:1.05rem; flex:none; place-items:center; border-radius:50%; color:#fff; background:#a44b4b; font-size:.46rem; }
.account-settings-dialog-card > footer { display:flex; justify-content:flex-end; gap:.55rem; padding:.8rem 1.1rem; border-top:1px solid var(--line); background:var(--surface); }

.two-factor-card { border-color:rgba(35,117,113,.2); box-shadow:0 1rem 2.8rem rgba(35,117,113,.08); }
.profile-security-grid .two-factor-card > .two-factor-heading { padding:1.05rem 1.1rem; background:linear-gradient(135deg,#edf8f5,#fffaf5); }
.two-factor-heading > div:first-child { align-items:center; }
.two-factor-heading .profile-card-icon { width:2.65rem; height:2.65rem; border-radius:.82rem; color:#fff; background:linear-gradient(145deg,var(--primary),#39958d); box-shadow:0 .5rem 1.1rem rgba(35,117,113,.22); }
.security-eyebrow { display:block; margin-bottom:.08rem; color:var(--primary); font-size:.42rem; font-weight:850; letter-spacing:.09em; text-transform:uppercase; }
.two-factor-status { display:grid; justify-items:end; gap:.2rem; text-align:right; }
.two-factor-status small { color:var(--muted); font-size:.43rem; }
.security-status { display:inline-flex; align-items:center; gap:.32rem; }
.security-status i { width:.42rem; height:.42rem; border-radius:50%; background:currentColor; box-shadow:0 0 0 .18rem rgba(164,75,75,.1); }
.security-status.is-enabled i { box-shadow:0 0 0 .18rem rgba(33,106,85,.1); }
.two-factor-card .two-factor-intro,.two-factor-card .two-factor-enabled-copy { background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(237,248,245,.56)); }

.account-deletion-dialog { width:min(43rem,calc(100% - 1.5rem)); }
.account-deletion-dialog-card { position:relative; box-shadow:0 1.6rem 4.5rem rgba(42,22,20,.28); }
.account-deletion-dialog-card::before { position:absolute; inset:0 0 auto; z-index:2; height:.22rem; content:""; background:linear-gradient(90deg,#a44b4b,var(--coral)); }
.account-deletion-dialog-card > header { padding:1.15rem 1.15rem 1rem; background:linear-gradient(135deg,#fff7f5,#fff); }
.account-deletion-dialog-body { gap:.9rem; padding:1rem 1.15rem 1.1rem; }
.account-deletion-process { display:flex; align-items:center; gap:.45rem; padding:.75rem; border:1px solid rgba(35,117,113,.12); border-radius:.8rem; background:var(--surface); }
.account-deletion-process > span { display:flex; align-items:center; gap:.45rem; min-width:0; flex:1; }
.account-deletion-process b { display:grid; width:1.45rem; height:1.45rem; flex:none; place-items:center; border-radius:50%; color:#fff; background:var(--primary); font-size:.48rem; }
.account-deletion-process span span { display:grid; min-width:0; gap:.06rem; }
.account-deletion-process strong { color:var(--ink); font-size:.49rem; }
.account-deletion-process small { color:var(--muted); font-size:.42rem; line-height:1.35; }
.account-deletion-process > i { width:1rem; height:1px; flex:none; background:var(--line); }
.account-deletion-warning { display:flex; align-items:flex-start; gap:.55rem; padding:.7rem .75rem; border:1px solid rgba(164,75,75,.16); border-radius:.75rem; background:#fff3f1; }
.account-deletion-warning > span { display:grid; width:1.2rem; height:1.2rem; flex:none; place-items:center; border-radius:50%; color:#fff; background:#a44b4b; font-size:.5rem; font-weight:850; }
.account-deletion-warning p { margin:0; color:var(--text); font-size:.5rem; line-height:1.5; }
.account-deletion-warning strong { color:#873c3c; }
.account-deletion-check { position:relative; display:grid; grid-template-columns:1.55rem minmax(0,1fr); align-items:center; gap:.65rem; padding:.75rem; border:1px solid rgba(164,75,75,.16); border-radius:.78rem; color:var(--text); background:#fffaf9; cursor:pointer; transition:border-color .18s ease,background .18s ease,box-shadow .18s ease; }
.account-deletion-check:hover { border-color:rgba(164,75,75,.34); background:#fff5f3; }
.account-deletion-check input { position:absolute; width:1px; height:1px; overflow:hidden; opacity:0; pointer-events:none; }
.account-deletion-check-control { display:grid; width:1.55rem; height:1.55rem; place-items:center; border:2px solid rgba(164,75,75,.35); border-radius:.48rem; color:transparent; background:#fff; transition:.18s ease; }
.account-deletion-check-control svg { width:.9rem; fill:none; stroke:currentColor; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; transform:scale(.65); transition:transform .18s ease; }
.account-deletion-check input:checked + .account-deletion-check-control { color:#fff; border-color:#a44b4b; background:#a44b4b; box-shadow:0 .35rem .8rem rgba(164,75,75,.2); }
.account-deletion-check input:checked + .account-deletion-check-control svg { transform:scale(1); }
.account-deletion-check:has(input:checked) { border-color:rgba(164,75,75,.32); background:#fff4f2; }
.account-deletion-check:has(input:focus-visible) { outline:3px solid rgba(164,75,75,.16); outline-offset:2px; }
.account-deletion-check-copy { display:grid; gap:.08rem; }
.account-deletion-check-copy strong { color:var(--ink); font-size:.53rem; }
.account-deletion-check-copy small { color:var(--muted); font-size:.46rem; line-height:1.45; }
.account-deletion-fields { display:grid; grid-template-columns:1.15fr .85fr; gap:.75rem; }
.account-deletion-fields label { display:grid; align-content:start; gap:.3rem; color:var(--ink); font-size:.52rem; font-weight:800; }
.account-deletion-fields label > span small { color:var(--muted); font-weight:600; }
.account-deletion-fields label > small { color:var(--muted); font-size:.43rem; font-weight:500; }
.account-deletion-dialog-body textarea,.account-deletion-dialog-body input[type="password"] { min-height:2.65rem; padding:.65rem .72rem; outline:0; color:var(--ink); font:inherit; font-size:.58rem; }
.account-deletion-dialog-body textarea:focus,.account-deletion-dialog-body input[type="password"]:focus { border-color:rgba(164,75,75,.42); box-shadow:0 0 0 3px rgba(164,75,75,.08); }
.account-deletion-dialog-card > footer { padding:.85rem 1.15rem; background:var(--surface); }
.account-deletion-dialog-card > footer .button-danger:disabled { cursor:not-allowed; opacity:.42; transform:none; }

.appointment-date { min-height:3.65rem; box-sizing:border-box; grid-template-rows:1fr auto .7rem; align-content:center; }
.appointment-date small { min-height:.7rem; line-height:.7rem; }

html[data-theme="dark"] .account-settings-dialog-card,
html[data-theme="dark"] .account-settings-dialog-card > header,
html[data-theme="dark"] .two-factor-card .two-factor-heading,
html[data-theme="dark"] .two-factor-card .two-factor-intro,
html[data-theme="dark"] .two-factor-card .two-factor-enabled-copy,
html[data-theme="dark"] .account-deletion-dialog-card > header { background:#17302c; border-color:#31514b; }
html[data-theme="dark"] .account-settings-icon,
html[data-theme="dark"] .account-settings-dialog-body input { color:var(--ink); background:#102522; border-color:#31514b; }
html[data-theme="dark"] .account-settings-hint,
html[data-theme="dark"] .account-settings-dialog-card > footer,
html[data-theme="dark"] .account-deletion-process,
html[data-theme="dark"] .account-deletion-dialog-card > footer { background:#102522; border-color:#31514b; }
html[data-theme="dark"] .account-settings-error,
html[data-theme="dark"] .account-deletion-warning { color:#f0c3bd; background:#2d1c1b; border-color:#613b38; }
html[data-theme="dark"] .account-deletion-warning strong { color:#f0c3bd; }
html[data-theme="dark"] .account-deletion-check { background:#251b1a; border-color:#613b38; }
html[data-theme="dark"] .account-deletion-check:hover,html[data-theme="dark"] .account-deletion-check:has(input:checked) { background:#30201e; }
html[data-theme="dark"] .account-deletion-check-control { background:#102522; }

@media(max-width:680px){
    .account-password-grid,.account-deletion-fields { grid-template-columns:1fr; }
    .account-settings-dialog-card > footer { display:grid; grid-template-columns:1fr; }
    .two-factor-heading { align-items:flex-start!important; }
    .two-factor-status { justify-items:start; text-align:left; }
    .account-deletion-process { align-items:stretch; flex-direction:column; }
    .account-deletion-process > i { width:1px; height:.65rem; margin-left:.72rem; }
}

/* Notifications de retour et sélecteur téléphonique harmonisés avec le thème. */
.alert[data-app-toast] {
    position:fixed;
    z-index:1500;
    top:1rem;
    right:1rem;
    width:min(26rem,calc(100vw - 2rem));
    min-height:3.4rem;
    align-items:center;
    margin:0;
    padding:.72rem .78rem;
    border-radius:.85rem;
    background:var(--white);
    box-shadow:0 1rem 2.8rem rgba(13,46,43,.2);
    opacity:0;
    transform:translateY(-.7rem) scale(.98);
    transition:opacity .2s ease,transform .2s ease;
}
.alert[data-app-toast].is-visible { opacity:1; transform:translateY(0) scale(1); }
.alert[data-app-toast].is-leaving { opacity:0; transform:translateX(1rem) scale(.98); }
.alert[data-app-toast] p { min-width:0; flex:1; margin:0; line-height:1.45; }
.alert[data-app-toast] > button { display:grid; width:1.7rem; height:1.7rem; flex:none; padding:0; place-items:center; border:0; border-radius:.5rem; color:var(--muted); background:transparent; cursor:pointer; font:inherit; font-size:.9rem; transition:.18s ease; }
.alert[data-app-toast] > button:hover { color:var(--ink); background:var(--surface); }
.alert[data-app-toast].alert-success { border-color:rgba(37,115,95,.22); }
.alert[data-app-toast].alert-error { border-color:rgba(180,67,67,.22); }
.alert[data-app-toast].alert-info { border-color:rgba(35,117,113,.22); }
html[data-theme="dark"] .alert[data-app-toast] { color:var(--text); background:#17302c; border-color:#31514b; box-shadow:0 1rem 3rem rgba(0,0,0,.34); }

.iti__dropdown-content { overflow:hidden; border:1px solid var(--line)!important; border-radius:.72rem!important; background:var(--white)!important; box-shadow:0 .8rem 2rem rgba(13,46,43,.16)!important; }
.iti__search-input-wrapper { min-height:2.7rem; background:var(--white); border-bottom-color:var(--line)!important; }
.iti__search-input { min-height:2.7rem; padding:.56rem 2.3rem .56rem 2.35rem!important; color:var(--ink)!important; background:transparent!important; font-size:.62rem!important; }
.iti__search-input::placeholder { color:var(--muted); opacity:1; }
.iti__search-icon { left:.72rem!important; color:var(--muted); }
.iti__search-icon-svg { width:.9rem; height:.9rem; stroke:currentColor!important; }
.iti__search-clear { right:.45rem!important; }
.iti__country-list { color:var(--text); background:var(--white); }
.iti__country { background:transparent; }
.iti__country.iti__highlight { background:var(--mint-soft); }
.iti__country-name { color:var(--ink); }
.iti__dial-code { color:var(--muted); }
html[data-theme="dark"] {
    --iti-country-selector-bg:#102522;
    --iti-border-color:#31514b;
    --iti-hover-color:rgba(83,155,144,.16);
    --iti-icon-color:#9bb2ad;
}
html[data-theme="dark"] .iti__dropdown-content,
html[data-theme="dark"] .iti__search-input-wrapper,
html[data-theme="dark"] .iti__country-list { color:var(--text)!important; background:#102522!important; border-color:#31514b!important; }
html[data-theme="dark"] .iti__search-input { color:var(--ink)!important; background:#102522!important; }
html[data-theme="dark"] .iti__country.iti__highlight { background:#1b3b36!important; }
html[data-theme="dark"] .iti__country-name { color:#e8f2ef; }
html[data-theme="dark"] .iti__dial-code { color:#9bb2ad; }

@media(max-width:600px){
    .alert[data-app-toast] { top:.65rem; right:.65rem; width:calc(100vw - 1.3rem); }
}

/* Retour immédiat lors des envois de formulaires classiques. */
button.is-submitting,
.button.is-submitting {
    pointer-events:none;
    cursor:wait;
    opacity:.88;
}
.button-submit-spinner {
    display:inline-block;
    width:.82rem;
    height:.82rem;
    flex:0 0 .82rem;
    border:2px solid currentColor;
    border-right-color:transparent;
    border-radius:50%;
    animation:button-submit-loading .65s linear infinite;
}
.button-primary .button-submit-spinner,
.button-danger .button-submit-spinner { border-right-color:transparent; }
@keyframes button-submit-loading { to { transform:rotate(360deg); } }
@media(prefers-reduced-motion:reduce){
    .button-submit-spinner { animation-duration:1.4s; }
}

/* En-têtes de cartes et modales : titre + sous-titre uniquement. */
.account-settings-dialog-card > header,
.account-deletion-dialog-card > header { align-items:center; padding-block:.82rem; }
.account-settings-dialog-card > header > div,
.account-deletion-dialog-card > header > div,
.document-upload-card > header > div > div,
.appointment-cancel-card > header > div { display:grid; align-content:center; gap:.08rem; }
.account-settings-dialog-card h2,
.account-deletion-dialog-card h2 { margin:0; line-height:1.2; }
.account-settings-dialog-card header p,
.account-deletion-dialog-card header p { margin:.08rem 0 0; line-height:1.35; }

/* Parcours invité et double authentification. */
.two-factor-auth-card .auth-icon .media-picto { width:1.2rem; height:1.2rem; }
.two-factor-challenge .field-group { display:grid; gap:.38rem; color:var(--ink); font-size:.7rem; font-weight:700; }
.two-factor-challenge .field-group input {
    width:100%; min-height:3.2rem; padding:.72rem .85rem; border:1px solid #ded1c6; border-radius:.72rem;
    outline:0; color:var(--ink); background:#fffaf6; transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
.two-factor-challenge .field-group input:focus { border-color:var(--primary); background:var(--white); box-shadow:0 0 0 4px rgba(35,117,113,.09); }
.form-alert { display:flex; align-items:center; gap:.45rem; margin:0; padding:.7rem .75rem; border:1px solid rgba(180,67,67,.18); border-radius:.72rem; color:#843b3b; background:var(--danger-soft); font-size:.62rem; font-weight:700; }
.form-alert > span { display:grid; width:1.1rem; height:1.1rem; flex:none; place-items:center; border-radius:50%; color:#fff; background:var(--danger); font-size:.52rem; }
.two-factor-auth-help { display:flex; align-items:center; justify-content:center; gap:.4rem; margin:.9rem 0 0; color:var(--muted); font-size:.56rem; }
.two-factor-auth-help .media-picto { width:.8rem; height:.8rem; color:var(--primary); }
.activation-help { margin:1rem 0 0; color:var(--muted); font-size:.6rem; text-align:center; }
.activation-card-error .auth-icon { color:var(--danger); background:var(--danger-soft); }

html[data-theme="dark"] { color-scheme:dark; }
html[data-theme="dark"] .guest-body { color:#b8cfca; background:#030a08; }
html[data-theme="dark"] .guest-body .auth-story { color:#d8e8e5; background:linear-gradient(145deg,#102522,#0a1b18); }
html[data-theme="dark"] .guest-body .auth-story h1,
html[data-theme="dark"] .guest-body .trust-list li { color:#f3fbf9; }
html[data-theme="dark"] .guest-body .auth-story-content > p,
html[data-theme="dark"] .guest-body .privacy-note { color:#adc6c2; }
html[data-theme="dark"] .guest-body .organic-one { background:rgba(75,151,140,.08); }
html[data-theme="dark"] .guest-body .auth-content { background:radial-gradient(circle at 88% 12%,rgba(35,117,113,.15),transparent 28%),linear-gradient(145deg,#030a08,#07130f); }
html[data-theme="dark"] .guest-body .auth-card { color:#b8cfca; border-color:#27463f; background:rgba(8,21,17,.96); box-shadow:0 1.2rem 3.5rem rgba(0,0,0,.34); backdrop-filter:none; }
html[data-theme="dark"] .guest-body .auth-heading h2,
html[data-theme="dark"] .guest-body .field label,
html[data-theme="dark"] .guest-body .field-group,
html[data-theme="dark"] .guest-body .login-remember strong,
html[data-theme="dark"] .guest-body .security-note strong { color:#edf8f5; }
html[data-theme="dark"] .guest-body .auth-heading p,
html[data-theme="dark"] .guest-body .login-remember small,
html[data-theme="dark"] .guest-body .auth-switch,
html[data-theme="dark"] .guest-body .two-factor-auth-help,
html[data-theme="dark"] .guest-body .activation-help { color:#9bb2ad; }
html[data-theme="dark"] .guest-body .field input,
html[data-theme="dark"] .guest-body .two-factor-challenge .field-group input { color:#edf8f5; border-color:#31514b; background:#030c09!important; }
html[data-theme="dark"] .guest-body .field input:hover,
html[data-theme="dark"] .guest-body .two-factor-challenge .field-group input:hover { border-color:#4b7770; }
html[data-theme="dark"] .guest-body .field input:focus,
html[data-theme="dark"] .guest-body .two-factor-challenge .field-group input:focus { border-color:#5eb6ad; background:#081713!important; box-shadow:0 0 0 4px rgba(83,155,144,.16); }
html[data-theme="dark"] .guest-body input::placeholder { color:#718c87; opacity:1; }
html[data-theme="dark"] .guest-body .auth-divider::before,
html[data-theme="dark"] .guest-body .auth-divider::after { background:#294741; }
html[data-theme="dark"] .guest-body .security-note { border-color:#294741; background:#102522; }
html[data-theme="dark"] .guest-body .form-alert,
html[data-theme="dark"] .guest-body .alert-error { color:#f0c3bd; border-color:#613b38; background:#2d1c1b; }
html[data-theme="dark"] .guest-body .alert-success { color:#a9ded0; border-color:#315f53; background:#102b24; }
html[data-theme="dark"] .guest-body .strength > span { background:#294741; }
html[data-theme="dark"] .guest-body .strength[data-score='1'] > span:nth-child(1),
html[data-theme="dark"] .strength[data-score='1'] > span:nth-child(1) { background:var(--coral); }
html[data-theme="dark"] .guest-body .strength[data-score='2'] > span:nth-child(-n+2),
html[data-theme="dark"] .strength[data-score='2'] > span:nth-child(-n+2) { background:#d0a43d; }
html[data-theme="dark"] .guest-body .strength[data-score='3'] > span,
html[data-theme="dark"] .strength[data-score='3'] > span { background:#46aaa2; }

.account-password-strength { display:grid; margin-top:.45rem; }
.account-password-strength small { font-size:.58rem; font-weight:500; }
html[data-theme="dark"] .guest-body .signup-callout { background:linear-gradient(135deg,#12302b,#1d615b); }
html[data-theme="dark"] .guest-body .site-footer { color:#9bb2ad; border-color:#294741; background:#07130f; }

/* Profil : typographie plus confortable sur tous les onglets. */
.profile-section-nav button strong { font-size:.76rem; }
.profile-section-nav button small { font-size:.58rem; }
.profile-card h2,
.account-deletion-card h2 { font-size:.96rem; }
.profile-card header p { font-size:.68rem; }
.profile-fields label > span,
.account-settings-dialog-body label,
.account-deletion-dialog-body > label:not(.account-deletion-check) { font-size:.66rem; }
.profile-fields input,
.account-settings-dialog-body input { font-size:.72rem; }
.account-row span { font-size:.6rem; }
.account-row strong { font-size:.7rem; }
.account-row button { font-size:.64rem; }
.two-factor-status small { font-size:.58rem; }
.security-status { font-size:.64rem; }
.two-factor-intro-copy > strong,
.two-factor-enabled-copy > div > strong { font-size:.84rem; }
.two-factor-intro-copy > p,
.two-factor-enabled-copy p,
.two-factor-setup-content ol { font-size:.68rem; }
.two-factor-intro-copy li,
.two-factor-expiry,
.two-factor-setup-content details summary,
.two-factor-disable > p { font-size:.62rem; }
.two-factor-setup-content h3 { font-size:.92rem; }
.two-factor-setup label,
.two-factor-disable label,
.two-factor-disable summary { font-size:.66rem; }
.two-factor-setup input,
.two-factor-disable input { font-size:.72rem; }
.account-deletion-card p,
.account-deletion-card li { font-size:.68rem; line-height:1.55; }
.account-deletion-check-copy strong { font-size:.68rem; }
.account-deletion-check-copy small,
.account-deletion-fields label > small { font-size:.58rem; }

/* Contact : Select2 aligné avec les autres champs du formulaire. */
.support-form .select2-container .select2-selection--single { min-height:46px; border-radius:.72rem; }
.support-form .select2-container .select2-selection--single .select2-selection__rendered { padding-left:.85rem; color:var(--ink); line-height:44px; }
.support-form .select2-container .select2-selection--single .select2-selection__placeholder { color:#849592; }
.support-form .select2-container .select2-selection--single .select2-selection__arrow { height:44px; }
.support-form textarea { font:inherit; }

/* Tableau de bord : respiration constante autour des psychologues consultés. */
.practitioners-section .practitioner-grid {
    width:calc(100% - 2.5rem);
    margin:1.1rem 1.25rem 1.25rem;
    padding:0;
}

/* Taille cohérente pour tous les champs de saisie de l'espace patient. */
.app-body input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]),
.app-body textarea,
.app-body select,
.app-body .select2-container--default .select2-selection--single .select2-selection__rendered,
.app-body .select2-container--default .select2-results__option {
    font-family:inherit;
    font-size:.72rem!important;
}
.app-body input::placeholder,
.app-body textarea::placeholder { font-size:inherit; }
.push-save-feedback { min-height:.9rem; margin:0; color:var(--muted); font-size:.58rem; }
.push-save-feedback.is-success { color:var(--primary); }
.push-save-feedback.is-error { color:var(--danger); }

/* Le bouton d’œil reste lisible dans les champs de paiement. */
.payment-input-wrap .password-wrap { width:100%; }
.payment-input-wrap .password-toggle { right:.45rem; z-index:2; }

/* Finitions du tableau de bord et du paiement. */
.practitioners-section .practitioner-card { cursor:pointer; }
.practitioners-section .practitioner-card:hover { border-top-color:transparent; }
.practitioners-section .practitioner-card:focus-visible { outline:3px solid rgba(35,117,113,.25); outline-offset:3px; }
.practitioners-section .practitioner-card-actions { cursor:default; }
.chat-header .mini-avatar { width:2.55rem; height:2.55rem; min-width:2.55rem; min-height:2.55rem; flex:0 0 2.55rem; overflow:hidden; }
.chat-header .mini-avatar img { display:block; width:100%; height:100%; object-fit:cover; }
.booking-payment-card .payment-input-cvc > .media-picto { position:absolute!important; z-index:3; display:block!important; left:.82rem!important; top:50%!important; width:1rem!important; height:1rem!important; color:var(--primary)!important; transform:translateY(-50%)!important; pointer-events:none; }
.booking-payment-card .payment-input-cvc .password-wrap { display:block; width:100%; }
.booking-payment-card .payment-input-cvc input { padding-left:2.35rem!important; }
.booking-consent { display:flex; align-items:flex-start; gap:.62rem; margin:1rem auto .72rem; max-width:37rem; padding:.72rem .82rem; border:1px solid var(--line); border-radius:.72rem; background:var(--white); cursor:pointer; }
.booking-consent input[type="checkbox"] { width:1.05rem; height:1.05rem; flex:0 0 1.05rem; margin:.03rem 0 0; padding:0; appearance:none; border:1px solid rgba(35,117,113,.35); border-radius:.28rem; background:var(--white) center/.7rem .7rem no-repeat; }
.booking-consent input[type="checkbox"]:checked { border-color:var(--primary); background-color:var(--primary); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m3.5 8.2 2.8 2.8 6.2-6.2' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.booking-consent input[type="checkbox"]:focus-visible { outline:3px solid rgba(35,117,113,.22); outline-offset:2px; }
.booking-consent span { color:var(--ink); font-size:.62rem; font-weight:650; line-height:1.45; }
.booking-payment-card .payment-save-card { display:flex!important; align-items:center!important; grid-template-columns:none!important; min-height:2.65rem; padding:.45rem 0!important; }
.booking-payment-card .payment-save-card input[type="checkbox"] { width:1.05rem!important; min-width:1.05rem!important; height:1.05rem!important; min-height:1.05rem!important; margin:0!important; padding:0!important; appearance:none!important; border:1px solid rgba(35,117,113,.35)!important; border-radius:.28rem!important; background:var(--white) center/.7rem .7rem no-repeat!important; }
.booking-payment-card .payment-save-card input[type="checkbox"]:checked { border-color:var(--primary)!important; background-color:var(--primary)!important; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m3.5 8.2 2.8 2.8 6.2-6.2' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important; }
.payment-security-note strong { display:flex; align-items:center; gap:.3rem; }
.mangopay-logo { display:block; width:auto; max-width:5rem; height:.9rem; object-fit:contain; }
.payment-card-marks .payment-mark-amex { display:flex; justify-content:center; gap:0; letter-spacing:-.08em; }
html[data-theme="dark"] .booking-consent { border-color:#31504c; background:#142927; }
html[data-theme="dark"] .booking-consent span { color:#f0faf7; }
html[data-theme="dark"] .booking-consent input[type="checkbox"] { border-color:#79bdb4; background-color:#071512; }
html[data-theme="dark"] .booking-consent input[type="checkbox"]:checked { border-color:#66d6c6!important; background-color:#237571!important; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m3.5 8.2 2.8 2.8 6.2-6.2' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important; box-shadow:0 0 0 3px rgba(102,214,198,.18); }
.booking-payment-note:empty { display:none; }

/* Historique : typographie plus confortable à la lecture. */
.history-intro h1 { font-size:1.6rem; }
.history-intro p { font-size:.8rem; }
.history-filter-card h2,.history-card h2 { font-size:1rem; }
.history-filter-card header p,.history-card header p { font-size:.68rem; }
.history-filter-form label > span { font-size:.66rem; }
.history-filter-form input,.history-filter-form select { font-size:.8rem!important; }
.history-filter-form.is-loading { opacity:.62; pointer-events:none; transition:opacity .15s ease; }
.iti__country-list { z-index:10020!important; }
.drawer-schedule { display:grid; gap:.35rem; }
.drawer-schedule > div { display:flex; justify-content:space-between; gap:.75rem; padding:.42rem .48rem; border-radius:.5rem; background:var(--mint-soft); font-size:.57rem; }
.drawer-schedule strong { color:var(--ink); }.drawer-schedule span { color:var(--text); text-align:right; }
.payment-security-note .mangopay-logo { padding:.12rem .3rem; border-radius:.28rem; background:#fff; }
html[data-theme="dark"] .payment-security-note .mangopay-logo { background:#fff; filter:none; }
/* Urgences : lecture renforcée. */
.emergency-alert h2,.emergency-group h2 { font-size:1rem; }.emergency-alert p { font-size:.76rem; }.emergency-group header p,.emergency-item>div span { font-size:.64rem; }.emergency-item strong,.resource-links strong { font-size:.78rem; }.emergency-item a { font-size:.68rem; }.resource-links a span,.emergency-disclaimer { font-size:.64rem; }

/* Urgences : des cartes et en-têtes parfaitement alignés, même avec un descriptif plus long. */
@media (min-width:721px) {
    .emergency-group { display:flex; min-height:100%; flex-direction:column; }
    .emergency-group > header { display:flex; min-height:6.2rem; align-items:center; }
    .emergency-group > header > div > div { min-width:0; }
    .emergency-group header p { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
    .emergency-items { flex:1; grid-template-rows:repeat(3,minmax(4.5rem,1fr)); }
}

/* Le menu pays appartient à la modal (top layer) mais ne doit pas être rogné par sa carte. */
.booking-info-dialog[data-booking-phone-dialog],
.booking-info-dialog[data-booking-phone-dialog] .booking-phone-card { overflow:visible; }
.booking-info-dialog[data-booking-phone-dialog] .iti__dropdown-content { z-index:1; }

/* Profil psychologue : l'onglet courant doit être immédiatement identifiable. */
.psy-profile-tabs button.is-active { color:#fff; border-bottom-color:transparent; border-radius:.55rem .55rem 0 0; background:var(--primary); box-shadow:0 .35rem .85rem rgba(35,117,113,.2); }
.psy-profile-tabs button.is-active::after { display:none; }
html[data-theme="dark"] .psy-profile-tabs button.is-active { color:#fff; background:#2b7f7a; box-shadow:0 .35rem .85rem rgba(0,0,0,.24); }

/* Annuaire : la vue liste privilégie une lecture confortable. */
.directory-results[data-view="list"] .current-psy-body > .psychologist-name-link { font-size:.92rem; }
.directory-results[data-view="list"] .current-psy-body > small { font-size:.64rem; }
.directory-results[data-view="list"] .current-psy-meta > span { font-size:.58rem; }
.directory-results[data-view="list"] .current-psy-list-info small { font-size:.5rem; }
.directory-results[data-view="list"] .current-psy-list-info strong { font-size:.61rem; }
.directory-results[data-view="list"] .current-psy-availability small { font-size:.5rem; }
.directory-results[data-view="list"] .current-psy-availability b { font-size:.64rem; }
.directory-results[data-view="list"] .current-psy-list-actions .button { font-size:.58rem; }

/* Les drawers ne modifient pas la géométrie de l'application : la sidebar reste sticky. */
body.shell-panel-visible,
body.appointment-drawer-visible,
body.psy-drawer-visible { overflow:visible; }

/* Vue liste : les médias et langues sont volontairement omis pour des cartes plus courtes. */
.directory-results[data-view="list"] .current-psy-preview,
.directory-results[data-view="list"] .current-psy-photo { height:7.25rem; min-height:7.25rem; }
.directory-results[data-view="list"] .current-psy-body { grid-template-rows:auto auto 1fr; }
.directory-results[data-view="list"] .current-psy-body > .psychologist-name-link { overflow:hidden; min-width:0; text-overflow:ellipsis; white-space:nowrap; }
.directory-results[data-view="list"] .current-psy-availability { grid-row:3; }
.directory-results[data-view="list"] .current-psy-availability,
.directory-results[data-view="list"] .current-psy-list-actions { align-self:center; }
.directory-results[data-view="list"] .current-psy-list-actions { grid-row:3; justify-self:end; }

/* La vue liste garde la thérapie sur une ligne et réserve une ligne distincte aux actions. */
.directory-results[data-view="list"] .current-psy-body { grid-template-rows:auto auto 1fr; }
.directory-results[data-view="list"] .current-psy-body > small { display:block; grid-column:1; grid-row:2; overflow:hidden; min-width:0; text-overflow:ellipsis; white-space:nowrap; }
.directory-results[data-view="list"] .current-psy-availability { grid-row:3; min-width:0; gap:0; }
.directory-results[data-view="list"] .current-psy-availability small { display:none; }
.directory-results[data-view="list"] .current-psy-availability b { max-width:none; padding:.26rem .42rem; font-size:.62rem; }
.directory-results[data-view="list"] .current-psy-list-actions { grid-row:3; min-width:9rem; }
@media (min-width:721px) {
    .directory-results[data-view="list"] .current-psy-meta { grid-column:2; grid-row:1; align-self:center; justify-content:flex-end; margin:0; }
}
@media (max-width:720px) {
    .directory-results[data-view="list"] .current-psy-meta { grid-column:1; grid-row:auto; justify-content:flex-start; margin-top:.3rem; }
    .directory-results[data-view="list"] .current-psy-body > small { grid-row:auto; }
    .directory-results[data-view="list"] .current-psy-availability,
    .directory-results[data-view="list"] .current-psy-list-actions { grid-row:auto; }
}

/* Rendez-vous Webcam : salle complète sans scroll superflu et vignette v5. */
.appointment-detail-layout.media-video .vonage-stage {
    height:clamp(20rem, calc(100dvh - 17.5rem), 44rem);
    min-height:0;
}
.appointment-detail-layout.media-chat .appointment-chat {
    height:clamp(31rem, calc(100dvh - 10rem), 58rem);
    min-height:0;
    grid-template-rows:auto minmax(0,1fr) auto auto;
}
.appointment-detail-layout.media-video .vonage-publisher {
    right:.85rem;
    bottom:.85rem;
    width:min(20%, 9.5rem);
    min-width:6.8rem;
    border:1px solid rgba(102,214,198,.88);
    border-radius:.8rem;
    background:linear-gradient(145deg,#237571,#123f3b);
    box-shadow:0 .55rem 1.5rem rgba(9,35,32,.42),0 0 0 .2rem rgba(35,117,113,.16);
}
.appointment-detail-layout.media-video .vonage-publisher::after {
    content:'Vous';
    position:absolute;
    z-index:4;
    right:.38rem;
    bottom:.38rem;
    padding:.18rem .38rem;
    border:1px solid rgba(255,255,255,.24);
    border-radius:.35rem;
    color:#fff;
    background:rgba(10,42,39,.72);
    font-size:.48rem;
    font-weight:800;
    letter-spacing:.02em;
}
.appointment-detail-layout.media-video .vonage-publisher .OT_video-element { border-radius:.7rem; }
html[data-theme="dark"] .appointment-detail-layout.media-video .vonage-publisher { border-color:#78d4c5; background:linear-gradient(145deg,#1a5d57,#0c2724); }
@media (max-width:620px) {
    .appointment-detail-layout.media-video .vonage-stage { height:calc(100dvh - 14rem); min-height:19rem; }
    .appointment-detail-layout.media-video .vonage-publisher { right:.6rem; bottom:.6rem; width:27%; min-width:6.2rem; }
    .appointment-detail-layout.media-chat .appointment-chat { height:auto; min-height:27rem; }
}
.history-summary small { font-size:.62rem; }
.history-summary strong { font-size:.9rem; }
.history-table th { font-size:.58rem; }
.history-table td { font-size:.72rem; }
.history-table td:first-child small,.history-psychologist small { font-size:.62rem; }
.history-media { font-size:.68rem; }
.history-empty p { font-size:.7rem; }
.maintenance-card { display:grid; gap:1.35rem; text-align:left; }
.maintenance-card .auth-heading { margin:0; }
.maintenance-card .auth-heading p { margin-top:.85rem; font-size:.9rem; line-height:1.7; }
.maintenance-icon { display:grid; place-items:center; width:3.5rem; height:3.5rem; border-radius:1.15rem; color:var(--primary); background:rgba(35,117,113,.1); }
.maintenance-icon svg { width:1.8rem; height:1.8rem; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.maintenance-status { display:flex; align-items:center; gap:.8rem; padding:1rem; border:1px solid rgba(35,117,113,.14); border-radius:1rem; background:rgba(232,242,239,.72); }
.maintenance-status > span { flex:0 0 auto; width:.65rem; height:.65rem; border-radius:50%; background:#f87679; box-shadow:0 0 0 .3rem rgba(248,118,121,.13); }
.maintenance-status div { display:grid; gap:.2rem; }
.maintenance-status strong { color:var(--ink); font-size:.82rem; }
.maintenance-status small { color:var(--muted); font-size:.72rem; line-height:1.5; }
html[data-theme="dark"] .maintenance-status { border-color:#27463f; background:#102b24; }

/* Responsive final : navigation, drawers et listes métier. */
body.shell-panel-visible,
body.appointment-drawer-visible,
body.psy-drawer-visible { overflow:visible; overscroll-behavior:none; }
.shell-panel > header > div > div { min-width:0; }
.shell-panel > header h2 { margin:0; font-size:.88rem; line-height:1.15; }
.shell-panel > header p {
    margin:.12rem 0 0;
    color:var(--muted);
    font-size:.58rem;
    font-weight:500;
    line-height:1.35;
    text-transform:none;
}

/* La FAQ reprend le système d’onglets horizontal et scrollable du profil. */
.faq-layout { grid-template-columns:1fr; gap:1rem; }
.faq-nav {
    position:sticky;
    z-index:4;
    top:calc(72px + .5rem);
    display:flex;
    gap:.35rem;
    overflow-x:auto;
    padding:.35rem;
    border-radius:1rem;
    background:rgba(255,255,255,.92);
    scrollbar-width:none;
    backdrop-filter:blur(10px);
}
.faq-nav::-webkit-scrollbar { display:none; }
.faq-nav > span { display:none; }
.faq-nav a,
.faq-nav .faq-contact-link {
    min-height:2.65rem;
    flex:0 0 auto;
    align-items:center;
    margin:0;
    padding:.65rem .8rem;
    border:0;
    border-radius:.72rem;
    font-size:.66rem;
    white-space:nowrap;
}
.faq-nav .faq-category-link.is-active {
    color:#fff;
    background:var(--primary);
    box-shadow:0 .4rem 1rem rgba(35,117,113,.18);
}
.faq-nav .faq-contact-link { gap:.6rem; margin-left:auto; border:1px solid rgba(35,117,113,.18); }
html[data-theme="dark"] .faq-nav { background:rgba(7,19,15,.94); }
html[data-theme="dark"] .faq-nav .faq-category-link.is-active { color:#fff; background:#2b7f7a; box-shadow:0 .4rem 1rem rgba(0,0,0,.2); }

@media (max-width:780px) {
    /* Le menu occupe toute la largeur afin de ne tronquer aucun libellé. */
    .app-sidebar {
        width:100dvw;
        max-width:none;
        flex-basis:100dvw;
        padding:1rem max(1rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left));
    }
    .sidebar-head { align-items:center; padding-inline:.45rem; }
    .sidebar-nav > a,
    .sidebar-support summary { min-height:3rem; font-size:.76rem; }
    .support-links { margin-left:2.55rem; }
    .support-links a { padding:.5rem .35rem; font-size:.68rem; }
    .profile-meta strong,
    .profile-meta span,
    .sidebar-booking-shortcut strong,
    .sidebar-booking-shortcut em { overflow:visible; text-overflow:clip; white-space:normal; }
    .sidebar-profile { grid-template-columns:2.45rem minmax(0,1fr) 2rem; }

    /* Tous les panneaux latéraux deviennent de vrais écrans mobiles. */
    .shell-panel,
    .message-shell-panel,
    .appointment-preview-drawer,
    .psy-preview-drawer,
    .chat-documents {
        width:100dvw;
        max-width:none;
        height:100dvh;
        border-left:0;
        border-radius:0;
    }
    .shell-panel > header,
    .appointment-preview-drawer > header,
    .psy-preview-drawer > header { padding:.75rem max(.8rem,env(safe-area-inset-right)) .75rem max(.8rem,env(safe-area-inset-left)); }
    .shell-panel .panel-heading-icon { width:2.25rem; height:2.25rem; border-radius:.65rem; }
    .shell-panel > header h2 { font-size:.8rem; }
    .shell-panel > header p { font-size:.55rem; }
    .shell-panel-content { padding:.8rem; }
    .activity-timeline article { gap:.6rem; padding:.7rem .1rem; }
    .update-list article { padding:.75rem 0; }
    .appointment-drawer-content,
    .psy-drawer-content { padding:.85rem; }

    /* CTA de la page Rendez-vous : action principale puis actions secondaires. */
    .appointments-intro .page-intro-actions {
        display:grid;
        width:100%;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:.45rem;
    }
    .appointments-intro .page-intro-actions .button { min-height:2.65rem; padding:.55rem .6rem; font-size:.6rem; line-height:1.25; }
    .appointments-intro .page-intro-actions .button-primary { grid-column:1 / -1; grid-row:1; }
    .appointment-summary { grid-template-columns:repeat(3,minmax(0,1fr)); }

    /* Une carte lisible remplace la ligne de tableau comprimée. */
    .app-body .appointment-row {
        grid-template-columns:3.15rem minmax(0,1fr) auto;
        grid-template-rows:auto auto auto auto;
        align-items:center;
        gap:.42rem .65rem;
        padding:.75rem;
        border:1px solid var(--line);
        border-radius:.85rem;
    }
    .appointment-list { display:grid; gap:.65rem; padding:.7rem; }
    .appointment-date { grid-column:1; grid-row:1 / 4; align-self:stretch; min-height:4.8rem; }
    .appointment-practitioner { grid-column:2 / 4; grid-row:1; min-width:0; }
    .app-body .appointment-row .appointment-detail { display:none; }
    .app-body .appointment-row .appointment-media-badge { grid-column:2; grid-row:2; justify-self:start; }
    .app-body .appointment-row .appointment-type-badge { grid-column:2; grid-row:3; justify-self:start; }
    .app-body .appointment-row .appointment-state { grid-column:3; grid-row:2; justify-self:end; }
    .app-body .appointment-row .appointment-row-actions {
        display:flex;
        width:100%;
        grid-column:1 / -1;
        grid-row:4;
        align-self:center;
        flex-direction:row;
        justify-self:stretch;
        gap:.4rem;
        padding-top:.18rem;
    }
    .appointment-row-actions .appointment-direct-link {
        min-height:2.35rem;
        flex:1;
        justify-content:center;
        border-color:var(--primary);
        color:#fff;
        background:var(--primary);
        font-size:.6rem;
    }
    .appointment-row-actions .more-button { width:2.35rem; height:2.35rem; flex:0 0 2.35rem; }

    /* Rendez-vous du tableau de bord : informations côte à côte et CTA stable. */
    .appointments-section .dashboard-appointment-grid,
    .appointments-section .dashboard-appointment-grid.is-multiple { grid-template-columns:1fr; padding:.55rem; }
    .appointments-section .dashboard-appointment-card,
    .appointments-section .dashboard-appointment-grid.is-multiple .dashboard-appointment-card {
        grid-template-columns:3rem minmax(0,1fr);
        grid-template-rows:auto auto auto;
        align-items:center;
        gap:.5rem .65rem;
        padding:.65rem;
    }
    .appointments-section .dashboard-appointment-date,
    .appointments-section .dashboard-appointment-grid.is-multiple .dashboard-appointment-date {
        grid-column:1;
        grid-row:1 / 3;
        width:3rem;
        min-height:4rem;
        align-self:stretch;
    }
    .appointments-section .dashboard-appointment-main,
    .appointments-section .dashboard-appointment-grid.is-multiple .dashboard-appointment-main { grid-column:2; grid-row:1; align-items:center; }
    .appointments-section .dashboard-appointment-meta,
    .appointments-section .dashboard-appointment-grid.is-multiple .dashboard-appointment-meta {
        display:grid;
        grid-column:2;
        grid-row:2;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:.35rem;
        padding:0;
        border:0;
    }
    .appointments-section .dashboard-appointment-meta > span,
    .appointments-section .dashboard-appointment-grid.is-multiple .dashboard-appointment-meta > span { width:auto; min-height:2.35rem; padding:.3rem .4rem; border:1px solid var(--line); }
    .appointments-section .dashboard-appointment-meta > span + span,
    .appointments-section .dashboard-appointment-grid.is-multiple .dashboard-appointment-meta > span + span { padding-top:.3rem; border:1px solid var(--line); }
    .appointments-section .dashboard-appointment-actions,
    .appointments-section .dashboard-appointment-grid.is-multiple .dashboard-appointment-actions {
        display:flex;
        grid-column:1 / -1;
        grid-row:3;
        justify-content:stretch;
    }
    .appointments-section .dashboard-appointment-actions .button { flex:1; justify-content:center; }

    /* La liste de conversations utilise moins de hauteur et reste centrée. */
    .conversation-list { display:grid; align-content:start; }
    .conversation-item {
        min-height:0;
        grid-template-columns:2.45rem minmax(0,1fr);
        gap:.6rem;
        align-items:center;
        padding:.65rem .75rem;
    }
    .conversation-item .mini-avatar { width:2.45rem; height:2.45rem; align-self:center; }
    .conversation-copy { display:grid; align-content:center; gap:.15rem; }
    .conversation-copy > span { min-height:1rem; }
    .conversation-copy strong { font-size:.68rem; }
    .conversation-copy time,
    .conversation-copy small { font-size:.54rem; line-height:1.35; }

    /* Les factures deviennent des cartes, sans défilement horizontal. */
    .invoices-table-wrap { overflow:visible; padding:.65rem; }
    .invoices-table,
    .invoices-table tbody { display:block; width:100%; }
    .invoices-table thead { display:none; }
    .invoices-table tbody { display:grid; gap:.65rem; }
    .invoices-table tbody tr {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        overflow:hidden;
        border:1px solid var(--line);
        border-radius:.85rem;
        background:var(--white);
        filter:none;
    }
    .invoices-table tbody td,
    .invoices-table tbody td:nth-child(2),
    .invoices-table tbody td:nth-child(4),
    .invoices-table tbody td:first-child,
    .invoices-table tbody td:last-child {
        display:grid;
        min-width:0;
        gap:.18rem;
        padding:.62rem .7rem;
        border:0;
        border-bottom:1px solid var(--line);
        border-radius:0;
        background:transparent;
        white-space:normal;
        text-align:left;
    }
    .invoices-table tbody td::before {
        content:attr(data-label);
        color:var(--muted);
        font-size:.47rem;
        font-weight:800;
        letter-spacing:.04em;
        text-transform:uppercase;
    }
    .invoices-table tbody td:nth-child(4),
    .invoices-table tbody td:last-child { grid-column:1 / -1; }
    .invoices-table tbody td:nth-last-child(-n+2) { border-bottom:0; }
    .invoices-table .invoice-download { width:100%; justify-content:center; }
    html[data-theme="dark"] .invoices-table tbody tr { background:#102522; }

    .faq-nav { top:calc(64px + .35rem); }
    .faq-nav a,
    .faq-nav .faq-contact-link { min-height:2.45rem; padding:.58rem .7rem; font-size:.62rem; }
}

@media (max-width:480px) {
    .appointments-intro .page-intro-actions { grid-template-columns:1fr; }
    .appointments-intro .page-intro-actions .button-primary { grid-column:1; }
    .appointment-summary article { flex-direction:row; text-align:left; }
    .appointment-summary .summary-icon { display:none; }
    .appointment-tabs button > i { display:none; }
    .appointment-tabs button { font-size:.52rem; }
    .appointments-section .dashboard-appointment-main .status-pill { margin-left:0; }
    .appointments-section .dashboard-appointment-practitioner > span { display:none; }
    .appointments-section .dashboard-appointment-meta i { display:none; }
    .invoices-table tbody tr { grid-template-columns:1fr; }
    .invoices-table tbody td,
    .invoices-table tbody td:nth-child(4),
    .invoices-table tbody td:last-child { grid-column:1; }
    .invoices-table tbody td:nth-last-child(2) { border-bottom:1px solid var(--line); }
}

/* Alignement final des onglets et des listes de conversations. */
.profile-section-nav button {
    min-height:3.15rem;
    grid-template-rows:min-content min-content;
    align-content:center;
    row-gap:.08rem;
}
.profile-section-nav button strong,
.profile-section-nav button small { display:block; margin:0; line-height:1.15; }
.faq-nav a,
.faq-nav .faq-contact-link {
    display:flex;
    align-items:center;
    justify-content:center;
    line-height:1.15;
}
.psy-drawer-tabs button,
.appointment-tabs button { align-items:center; justify-content:center; line-height:1.15; }

.conversation-item .mini-avatar,
.message-panel-avatar {
    display:grid;
    width:2.45rem;
    height:2.45rem;
    min-width:2.45rem;
    min-height:2.45rem;
    flex:0 0 2.45rem;
    place-items:center;
    overflow:hidden;
    border-radius:.7rem;
}
.conversation-item .mini-avatar img,
.message-panel-avatar img {
    display:block;
    width:100%;
    height:100%;
    min-width:100%;
    min-height:100%;
    object-fit:cover;
    object-position:center;
}
.conversation-copy,
.message-panel-copy {
    display:grid;
    min-height:2.45rem;
    align-content:center;
    gap:.14rem;
}
.conversation-copy > span,
.message-panel-copy > span { min-height:1rem; align-items:center; line-height:1.2; }
.conversation-copy [data-conversation-name],
.conversation-copy [data-conversation-preview],
.message-panel-copy strong,
.message-panel-copy small { line-height:1.3; }

@media (max-width:780px) {
    .activity-timeline article {
        gap:.65rem;
        padding:.72rem .75rem;
    }
}

/* Messagerie : liste de conversations dense, régulière et plus facile à parcourir. */
.messages-shell .conversation-sidebar { background:var(--surface); }
.messages-shell .conversation-sidebar > header { border-bottom:1px solid var(--line); background:var(--white); }
.messages-shell .conversation-list {
    display:grid;
    align-content:start;
    gap:.32rem;
    padding:.42rem;
}
.messages-shell .conversation-item {
    position:relative;
    min-height:4.15rem;
    grid-template-columns:2.55rem minmax(0,1fr) auto;
    gap:.65rem;
    align-items:center;
    padding:.62rem .68rem;
    border:1px solid transparent;
    border-radius:.78rem;
    background:var(--white);
    box-shadow:0 .16rem .55rem rgba(18,63,60,.035);
    transition:border-color .18s ease,background .18s ease,box-shadow .18s ease,transform .18s ease;
}
.messages-shell .conversation-item::before {
    content:"";
    position:absolute;
    top:.7rem;
    bottom:.7rem;
    left:0;
    width:3px;
    border-radius:0 3px 3px 0;
    background:transparent;
}
.messages-shell .conversation-item:hover {
    border-color:rgba(35,117,113,.18);
    background:var(--mint-soft);
    box-shadow:0 .28rem .8rem rgba(18,63,60,.065);
    transform:translateY(-1px);
}
.messages-shell .conversation-item.is-active {
    border-color:rgba(35,117,113,.24);
    background:var(--mint-soft);
    box-shadow:0 .32rem .9rem rgba(35,117,113,.08);
}
.messages-shell .conversation-item.is-active::before { background:var(--primary); }
.messages-shell .conversation-item.has-unread {
    border-color:rgba(35,117,113,.18);
    background:rgba(35,117,113,.075);
}
.messages-shell .conversation-item.has-unread::before { background:var(--primary); }
.messages-shell .conversation-item .mini-avatar {
    width:2.55rem;
    height:2.55rem;
    min-width:2.55rem;
    min-height:2.55rem;
    border:1px solid rgba(35,117,113,.1);
    border-radius:.72rem;
    background:var(--mint-soft);
}
.messages-shell .conversation-copy { min-height:2.55rem; align-content:center; gap:.2rem; }
.messages-shell .conversation-copy > span { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.55rem; }
.messages-shell .conversation-copy [data-conversation-name] { display:block; min-width:0; overflow:hidden; }
.messages-shell .conversation-copy [data-conversation-name] > * {
    display:block;
    overflow:hidden;
    color:var(--ink);
    font-size:.69rem;
    font-weight:800;
    line-height:1.25;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.messages-shell .conversation-copy time { align-self:center; color:var(--muted); font-size:.5rem; white-space:nowrap; }
.messages-shell .conversation-copy [data-conversation-preview] {
    display:block;
    min-width:0;
    overflow:hidden;
    margin:0;
    color:var(--muted);
    font-size:.55rem;
    line-height:1.35;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.messages-shell .unread-count {
    position:static;
    min-width:1.15rem;
    width:auto;
    height:1.15rem;
    align-self:center;
    padding:0 .28rem;
    border-radius:99px;
    font-size:.45rem;
    font-weight:850;
}

/* Même présentation compacte dans le drawer du header. */
.message-panel-content { display:grid; align-content:start; gap:.3rem; padding:.45rem!important; }
.message-panel-item {
    min-height:3.9rem;
    grid-template-columns:2.45rem minmax(0,1fr) auto;
    gap:.62rem;
    padding:.58rem .62rem;
    border-color:transparent;
    background:var(--white);
}
.message-panel-item .message-panel-avatar { width:2.45rem; height:2.45rem; }
.message-panel-copy { min-height:2.45rem; align-content:center; gap:.18rem; }
.message-panel-copy > span { line-height:1.25; }
.message-panel-copy strong,
.message-panel-copy .psychologist-name-link { color:var(--ink); font-size:.66rem; font-weight:800; }
.message-panel-copy small { margin:0; font-size:.53rem; line-height:1.35; }
.message-panel-unread { align-self:center; }

html[data-theme="dark"] .messages-shell .conversation-sidebar { background:#081713; }
html[data-theme="dark"] .messages-shell .conversation-sidebar > header,
html[data-theme="dark"] .messages-shell .conversation-item,
html[data-theme="dark"] .message-panel-item { background:#102522; }
html[data-theme="dark"] .messages-shell .conversation-item:hover,
html[data-theme="dark"] .messages-shell .conversation-item.is-active,
html[data-theme="dark"] .messages-shell .conversation-item.has-unread,
html[data-theme="dark"] .message-panel-item:hover,
html[data-theme="dark"] .message-panel-item.has-unread { border-color:#31514b; background:#193632; }

@media (max-width:780px) {
    .messages-shell .conversation-list { gap:.25rem; padding:.35rem; }
    .messages-shell .conversation-item {
        min-height:3.85rem;
        grid-template-columns:2.4rem minmax(0,1fr) auto;
        gap:.58rem;
        padding:.55rem .6rem;
        border-radius:.7rem;
        box-shadow:none;
    }
    .messages-shell .conversation-item .mini-avatar {
        width:2.4rem;
        height:2.4rem;
        min-width:2.4rem;
        min-height:2.4rem;
    }
    .messages-shell .conversation-copy { min-height:2.4rem; }
    .messages-shell .conversation-copy [data-conversation-name] > * { font-size:.65rem; }
    .messages-shell .conversation-copy [data-conversation-preview] { font-size:.52rem; }
}

@media (max-width:390px) {
    .messages-shell .conversation-copy > span { gap:.35rem; }
    .messages-shell .conversation-copy time { font-size:.46rem; }
    .messages-shell .unread-count { min-width:1.05rem; height:1.05rem; font-size:.41rem; }
}
/* Cloudflare Turnstile */
.turnstile-field { display:grid; gap:.45rem; justify-items:center; width:100%; overflow:hidden; }
.turnstile-field .field-error { justify-self:start; }
.turnstile-field.has-error { padding:.65rem; border:1px solid color-mix(in srgb, var(--danger) 55%, transparent); border-radius:.75rem; background:color-mix(in srgb, var(--danger) 7%, transparent); }
@media (max-width:380px) { .turnstile-field { transform-origin:center top; } .turnstile-field .cf-turnstile { transform:scale(.88); margin-bottom:-4px; } }
.web-push-control { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin:.8rem; padding:.85rem 1rem; border:1px solid var(--line); border-radius:.8rem; background:var(--surface); }
.web-push-control div { display:grid; gap:.15rem; }
.web-push-control strong { color:var(--ink); font-size:.62rem; }
.web-push-control p { margin:0; color:var(--muted); font-size:.54rem; }
@media (max-width:620px) { .web-push-control { align-items:stretch; flex-direction:column; } .web-push-control .button { width:100%; } }

/* Profil / notifications : hiérarchie plus simple et typographie lisible. */
.push-devices-card > header { padding:1rem 1.1rem; }
.push-devices-card > header p { margin-top:.12rem; }
.web-push-control { margin:0; padding:1rem 1.1rem; border:0; border-bottom:1px solid var(--line); border-radius:0; background:transparent; }
.web-push-control strong { font-size:.76rem; }
.web-push-control p { font-size:.64rem; line-height:1.45; }
.web-push-control .button { min-height:2.35rem; font-size:.62rem; }
.push-empty { align-items:center; padding:1.1rem; }
.push-empty strong { font-size:.72rem; }
.push-empty p { font-size:.62rem; }
.push-device-list { gap:0; padding:0; }
.push-device { gap:.8rem; padding:1rem 1.1rem; border:0; border-bottom:1px solid var(--line); border-radius:0; background:transparent; }
.push-device:last-child { border-bottom:0; }
.push-device-heading > span { width:2.2rem; height:2.2rem; }
.push-device-heading strong { font-size:.72rem; }
.push-device-heading small { font-size:.58rem; line-height:1.4; }
.push-device-heading small b { font-size:.5rem; }
.device-name-field { font-size:.62rem; }
.device-name-field input { min-height:2.55rem; font-size:.68rem; }
.push-preferences { gap:.55rem; }
.push-preferences .toggle-row { padding:.7rem .75rem; border:0; background:var(--surface); }
.push-preferences .toggle-row strong { font-size:.66rem; }
.push-preferences .toggle-row small { font-size:.56rem; line-height:1.4; }
.push-device-settings > .button { min-height:2.35rem; font-size:.6rem; }
.push-save-feedback { font-size:.6rem; }
.push-revoke-form { display:flex; align-items:center; margin:0; padding-top:.15rem; }
.push-revoke-form button { display:inline-flex; min-height:1.9rem; align-items:center; justify-content:center; gap:.4rem; padding:.3rem .5rem; border-radius:999px; font-size:.58rem; line-height:1.2; text-decoration:none; }
.push-revoke-form button:hover,
.push-revoke-form button.is-submitting { background:var(--mint-soft); }
.push-revoke-form .button-submit-spinner { width:.72rem; height:.72rem; flex-basis:.72rem; }
.inactive-devices { margin:0 1.1rem 1.1rem; }
.inactive-devices > summary { padding:.8rem .85rem; font-size:.66rem; }
.inactive-devices > summary small { font-size:.56rem; }
.inactive-devices section { padding:.75rem .85rem; }
.inactive-devices section strong { font-size:.64rem; }
.inactive-devices section small { font-size:.54rem; }
.inactive-devices section form[data-push-action="forget"] button { font-size:.57rem; }
html[data-theme="dark"] .push-preferences .toggle-row { background:#102522; }
html[data-theme="dark"] .push-revoke-form button:hover,
html[data-theme="dark"] .push-revoke-form button.is-submitting { background:#17352f; }
@media (max-width:620px) {
    .push-devices-card > header,
    .web-push-control,
    .push-device { padding-inline:.85rem; }
    .inactive-devices { margin-inline:.85rem; }
    .push-revoke-form button { width:100%; }
}

/* Gestion unifiée des appareils push. */
.push-device-heading small b.is-inactive { color:var(--muted); background:var(--surface); }
.push-delete-form { display:flex; align-items:center; justify-content:flex-end; margin-top:-.15rem; }
.push-delete-form button { display:inline-flex; min-height:2rem; align-items:center; justify-content:center; gap:.4rem; padding:.35rem .65rem; border:0; border-radius:999px; color:#8a4a47; background:transparent; cursor:pointer; font:inherit; font-size:.6rem; font-weight:750; line-height:1.2; }
.push-delete-form button:hover,
.push-delete-form button.is-submitting { background:color-mix(in srgb, var(--coral) 12%, transparent); }
.push-delete-form .button-submit-spinner { width:.72rem; height:.72rem; flex-basis:.72rem; }
.push-empty-simple { justify-content:center; text-align:center; }
@media (min-width:900px) {
    .push-device-settings { grid-template-columns:minmax(12rem,.8fr) minmax(18rem,1.35fr) auto; align-items:end; }
    .push-device-settings > .button { align-self:end; margin:0; white-space:nowrap; }
    .push-device-settings > .push-save-feedback { grid-column:1/-1; }
}
html[data-theme="dark"] .push-device-heading small b.is-inactive { color:#9bb2ad; background:#17302c; }
html[data-theme="dark"] .push-delete-form button:hover,
html[data-theme="dark"] .push-delete-form button.is-submitting { background:rgba(248,118,121,.12); }
@media (max-width:620px) { .push-delete-form button { width:100%; } }