/* ============================================
   Booking Pool Consent Prompt (2026-08-28 privacy review)
   ============================================
   The one active disclosure in the consent model: you have been added to a
   booking pool, so people OUTSIDE your group can now book your time.

   Presented as a bottom-anchored card, NOT a centred modal with a backdrop.
   It is a disclosure the member should see and answer, not an error that must
   block the app — and it is emphatically not a toast (it persists until
   answered, and it carries actions).
   ============================================ */

.pool-consent-prompt {
    position: fixed;
    left: 50%;
    bottom: 20px;
    transform: translateX(-50%);
    /* Above board chrome, below any true modal so a real dialog still wins. */
    z-index: 900;
    width: min(420px, calc(100vw - 32px));
    animation: pool-consent-in 0.22s ease-out;
}

@keyframes pool-consent-in {
    from { opacity: 0; transform: translateX(-50%) translateY(8px); }
    to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    .pool-consent-prompt { animation: none; }
}

.pool-consent-prompt__card {
    background: var(--surface-primary, #ffffff);
    border: 1px solid var(--border-subtle, rgba(100, 116, 139, 0.25));
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.18);
    padding: 16px 18px;
}

.pool-consent-prompt__title {
    margin: 0 0 6px;
    font-size: 15px;
    font-weight: 700;
    color: var(--text-primary, #0f172a);
    line-height: 1.3;
}

.pool-consent-prompt__body {
    margin: 0 0 14px;
    font-size: 13px;
    line-height: 1.45;
    color: var(--text-secondary, #475569);
}

.pool-consent-prompt__actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.pool-consent-prompt__btn {
    appearance: none;
    border: 1px solid var(--border-subtle, rgba(100, 116, 139, 0.3));
    background: var(--surface-primary, #ffffff);
    color: var(--text-primary, #0f172a);
    border-radius: 999px;
    padding: 7px 14px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

/* "That's fine" leads, because staying is the common and expected outcome —
   this is a disclosure, not an accusation that something is wrong. The exit
   sits beside it as a plain button: available without being alarming. */
.pool-consent-prompt__btn--primary {
    background: var(--accent-teal, #14b8a6);
    border-color: var(--accent-teal, #14b8a6);
    color: #ffffff;
}

.pool-consent-prompt__btn:focus-visible {
    outline: 2px solid var(--accent-teal, #14b8a6);
    outline-offset: 2px;
}

.pool-consent-prompt__btn:disabled {
    opacity: 0.55;
    cursor: default;
}

/* Shown only when the removal call FAILED — the member asked to be taken off
   and is still on. Red is correct here: this one really is a fault. */
.pool-consent-prompt__status {
    margin: 10px 0 0;
    font-size: 12px;
    line-height: 1.4;
    color: var(--status-busy, #dc2626);
}

body.dark-mode .pool-consent-prompt__card {
    background: var(--surface-secondary, #1e293b);
    border-color: rgba(255, 255, 255, 0.1);
}
body.dark-mode .pool-consent-prompt__title { color: var(--text-primary, #e2e8f0); }
body.dark-mode .pool-consent-prompt__body { color: var(--text-secondary, #94a3b8); }
body.dark-mode .pool-consent-prompt__btn {
    background: var(--surface-tertiary, #334155);
    color: var(--text-primary, #e2e8f0);
}
body.dark-mode .pool-consent-prompt__btn--primary {
    background: var(--accent-teal, #14b8a6);
    color: #06201d;
}

@media (max-width: 640px) {
    .pool-consent-prompt {
        bottom: 12px;
        width: calc(100vw - 24px);
    }
    .pool-consent-prompt__btn { flex: 1 1 auto; text-align: center; }
}

/* THE EXIT IS NEVER THE BIGGER TARGET (owner 2026-10-07: "make the leave
   ... equal or smaller than the accept ... so users don't quickly press the
   most prominent option"). Each button took its text's width, so the long
   "Remove me from this link" was the widest thing on the card. Both now
   share the row equally (and the label is "Remove me": the title already
   names the link), so "That's fine" stays the one that stands out. */
.pool-consent-prompt__actions .pool-consent-prompt__btn {
    flex: 1 1 0;
    min-width: 0;
    text-align: center;
}