/* /Components/Contact/ContactForm.razor.rz.scp.css */
/* ::deep required (keep-rubric #1): neutralise BbSelectTrigger's base hover:bg-accent
   which would otherwise turn the trigger wine on hover — unreachable from the parent
   via Tailwind utilities alone because BlazorBlueprint renders the class on an inner element. */

[b-88r6jn6twu] .contact-cat-trigger {
    background-color: var(--background);
}

[b-88r6jn6twu] .contact-cat-trigger:hover {
    background-color: var(--background);
    border-color: var(--ring);
}
/* /Components/Email/EmailRouteView.razor.rz.scp.css */
/* Kept scoped per the keep-rubric:
   - #3 `.route-rail__gutter::before` connector with :first-child/:last-child
        trimming — a pseudo-element line whose top/bottom depends on structural
        position; Tailwind before: variants cannot express the first/last trim.
   - #3 ancestor-state descendant combinators: `.route-transit--X .route-rail__plug`,
        `… .route-rail__box--link`, `… .route-rail__link-label` recolour children off
        the transport-state modifier on the <li>. Tailwind cannot reach a child off an
        ancestor modifier class.
   - #3 `.email-route-map-empty__grid` radial-gradient dot field + radial mask.
   - The ≥1200px two-column grid split (minmax/clamp track sizing + stretch) — a
        container-driven structural layout kept verbatim.
   - The ≤640px phone pass tightens the rail gutter track + gap and re-centres the
        pseudo-element rail line on the narrower gutter; lives here because it must
        track the same `::before` rail and the gutter grid track. */

/* Two-column layout: timeline on the left, map (or empty placeholder) on the right.
   Split only kicks in at ≥1200px so the map's 320px floor doesn't crush the
   timeline. The map column is wrapped in `minmax(0, …)` so it can shrink rather
   than overflow when the card's actual width is tight (sidebar / zoom / mobile-
   landscape edge cases). */
.email-route-geo-layout[b-qcxu1y1cwf] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

/* Leaflet stacks its panes and controls (attribution included) up to z-index 1000.
   Without a stacking context here that layering escapes the map box and paints over
   page chrome — notably the fixed "share" FAB. `isolation` contains it to the map. */
.email-route-map-container[b-qcxu1y1cwf] {
    isolation: isolate;
}

@media (min-width: 1200px) {
    .email-route-geo-layout[b-qcxu1y1cwf] {
        grid-template-columns: minmax(0, 1fr) minmax(0, clamp(380px, 46%, 920px));
        /* stretch (the grid default) makes the map column exactly as tall as the
           timeline/path, and it tracks live as raw-header rows expand/collapse. */
        align-items: stretch;
    }
    /* Drop the container floor so the column matches the path height. The empty
       placeholder then tracks it exactly; a real map still honours the
       .email-route-map 320px floor so it stays usable on a very short path. */
    .email-route-map-container[b-qcxu1y1cwf] {
        min-height: 0;
    }
}

/* Faint dotted grid that suggests "this is where a map would render", without
   pretending to be one. Centered radial mask fades the dots away at the edges
   so they don't visibly tile against the container border. */
.email-route-map-empty__grid[b-qcxu1y1cwf] {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle, color-mix(in srgb, var(--muted-foreground) 18%, transparent) 1px, transparent 1.5px);
    background-size: 16px 16px;
    -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 50%, #000 0%, transparent 100%);
    mask-image: radial-gradient(ellipse 70% 60% at 50% 50%, #000 0%, transparent 100%);
    opacity: 0.55;
    z-index: 0;
    pointer-events: none;
}

/* One continuous rail line: each item (except the last) draws a segment from its
   marker centre down past the `gap` to the next marker. Markers carry a card-coloured
   ring so they punch through the line and read as sitting ON it. */
.route-rail__gutter[b-qcxu1y1cwf]::before {
    content: "";
    position: absolute;
    left: 12px;
    top: 0;
    bottom: -10px;                 /* bridge the 10px flex gap to the next marker */
    width: 2px;
    background: color-mix(in srgb, var(--muted-foreground) 24%, transparent);
}
.route-rail__item:first-child .route-rail__gutter[b-qcxu1y1cwf]::before { top: 50%; }
.route-rail__item:last-child .route-rail__gutter[b-qcxu1y1cwf]::before { bottom: 50%; }

/* Phone pass: the rail's 26px gutter track + 12px gap is generous on a narrow
   screen and pushes the station boxes too far right. Shrink the gutter track to
   22px and the gap to 10px (~15-18% tighter) and re-centre the rail line on the
   new track centre (was left:12px for a 26px column → 11px for a 22px column).
   Reduce only — the marker/plug/box structure is untouched. */
@media (max-width: 640px) {
    .route-rail__item[b-qcxu1y1cwf] {
        grid-template-columns: 22px 1fr;
        column-gap: 10px;
    }
    .route-rail__gutter[b-qcxu1y1cwf]::before {
        left: 11px;
    }
}

/* --- Link plug: a small lock on the connector, recoloured by transport state --- */
.route-transit--secure .route-rail__plug[b-qcxu1y1cwf] {
    background: color-mix(in srgb, var(--success) 18%, transparent);
    color: var(--success);
}
.route-transit--danger .route-rail__plug[b-qcxu1y1cwf] {
    background: color-mix(in srgb, var(--destructive) 18%, transparent);
    color: var(--destructive);
}
.route-transit--unknown .route-rail__plug[b-qcxu1y1cwf] {
    background: var(--muted);
    color: var(--muted-foreground);
}

/* Link box + label recoloured by transport state so it is unmistakably the
   connection, not a station. */
.route-transit--secure .route-rail__box--link[b-qcxu1y1cwf] {
    border-color: color-mix(in srgb, var(--success) 35%, transparent);
    background: color-mix(in srgb, var(--success) 9%, transparent);
}
.route-transit--danger .route-rail__box--link[b-qcxu1y1cwf] {
    border-color: color-mix(in srgb, var(--destructive) 35%, transparent);
    background: color-mix(in srgb, var(--destructive) 9%, transparent);
}
.route-transit--unknown .route-rail__box--link[b-qcxu1y1cwf] {
    border-color: var(--border);
    background: var(--muted);
}

.route-transit--secure .route-rail__link-label[b-qcxu1y1cwf] { color: var(--success); }
.route-transit--danger .route-rail__link-label[b-qcxu1y1cwf] { color: var(--destructive); }
.route-transit--unknown .route-rail__link-label[b-qcxu1y1cwf] { color: var(--muted-foreground); }
/* /Components/MailServer/AddressCard.razor.rz.scp.css */
/* ::deep into BbButton child for copy-success recolor. */

.address-card[b-4i5n6daf0d]  .address-card__copy {
    transition: background-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.address-card[b-4i5n6daf0d]  .address-card__copy--copied,
.address-card[b-4i5n6daf0d]  .address-card__copy--copied:hover {
    background-color: var(--success) !important;
    color: var(--success-foreground, #0e1a13) !important;
    border-color: transparent !important;
}
/* /Components/MailServer/SmtpTranscript.razor.rz.scp.css */
/* Kept scoped per the keep-rubric:
   - #2 @keyframes blink cursor + its reduced-motion rule.
   - #3 per-line-kind ancestor-state descendant combinators recoloring the child
        prefix/body spans (`.smtp-line--X .smtp-line__prefix`). Tailwind cannot
        target a child's colour off an ancestor modifier class. */

.smtp-transcript__cursor[b-lxsn7upvmy] {
    animation: smtp-cursor-blink-b-lxsn7upvmy 1.1s steps(2, end) infinite;
}

@keyframes smtp-cursor-blink-b-lxsn7upvmy {
    50% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .smtp-transcript__cursor[b-lxsn7upvmy] { animation: none; opacity: 1; }
}

.smtp-line--command .smtp-line__prefix[b-lxsn7upvmy] { color: #6bbf8a; }
.smtp-line--reply   .smtp-line__prefix[b-lxsn7upvmy] { color: #6cb6e0; }
.smtp-line--data    .smtp-line__prefix[b-lxsn7upvmy] { color: var(--terminal-text-dim); }
.smtp-line--data    .smtp-line__body[b-lxsn7upvmy]   { color: var(--terminal-text-data); }
.smtp-line--meta    .smtp-line__prefix[b-lxsn7upvmy] { color: #b45309; }
.smtp-line--meta    .smtp-line__body[b-lxsn7upvmy]   { color: #b45309; font-style: italic; }