/* ============================================================================
   Saut de Chat — atmosphere layer (ported from globals.css)
   The MudTheme carries the base palette; this carries what a palette cannot:
   the wine ambient wash, status colours, no-photo grounds, and DM Mono.

   Mode is driven by the .sdc-dark class that MainLayout toggles on .sdc-surface,
   so these custom properties stay in lock-step with the MudThemeProvider toggle.
   ========================================================================== */

.sdc-surface {
    /* Third text tier — eyebrows, codes, captions */
    --faint: #857B60;

    /* Status colours — pills & status-tile bars only (spec §17.3) */
    --status-store: #B98922;        /* In Store  — gold/amber */
    --status-stage: #3E7940;        /* On Stage  — green */
    --status-care: #B05227;         /* In Care   — terracotta */
    --status-unassigned: #857A66;   /* Unassigned — muted grey */

    /* Burgundy — a whisper in Archive */
    --wine: #681228;
    --wine-glow: rgba(103, 18, 39, 0.15);
    --wine-veil: rgba(103, 18, 39, 0.05);

    /* No-photo placeholder grounds */
    --photo-from: #EAD3C3;
    --photo-to: #F8F1E3;
    --watermark: rgba(156, 114, 24, 0.12);
}

.sdc-surface.sdc-dark {
    --faint: #6F6758;

    --status-store: #DEBC3F;
    --status-stage: #6DB069;
    --status-care: #CE6A3B;
    --status-unassigned: #8C8473;

    /* Burgundy — strong in Stage */
    --wine: #681228;
    --wine-glow: rgba(140, 32, 58, 0.30);
    --wine-veil: rgba(103, 18, 39, 0.18);

    --photo-from: #49131F;
    --photo-to: #140B0F;
    --watermark: rgba(216, 180, 60, 0.10);
}

/* Wine ambient wash for the portal content shell — atmosphere only.
   Sits over the MudTheme background. */
.wardrobe-wash {
    background:
        radial-gradient(135% 62% at 72% -8%, var(--wine-glow), transparent 58%),
        var(--mud-palette-background);
}

/* Detail sheet: top bloom over a flat veil over the card surface, so the
   burgundy survives once a real R2 photo fills the hero. */
.detail-veil {
    background:
        radial-gradient(110% 48% at 72% 2%, var(--wine-glow), transparent 62%),
        linear-gradient(var(--wine-veil), var(--wine-veil)),
        var(--mud-palette-surface);
}

/* No-photo placeholder ground — thumbnails, rail photos, detail hero. */
.photo-ground {
    background: linear-gradient(160deg, var(--photo-from), var(--photo-to));
}

/* DM Mono for IDs (CST-0042), sizes, dates, badges — MudTheme Typography has
   no mono slot, so apply this class where monospaced data is shown. */
.font-mono {
    font-family: "DM Mono", ui-monospace, "Cascadia Mono", monospace;
}

/* iOS safe-area padding for the mobile bottom nav. */
.pb-safe {
    padding-bottom: env(safe-area-inset-bottom);
}
.mud-typography-h1 { font-size: clamp(2rem, 7vw, 3.75rem); line-height: 1.1; }
.mud-typography-h2 { font-size: clamp(1.9rem, 6vw, 3rem); line-height: 1.1; }
.mud-typography-h3 { font-size: clamp(1.6rem, 5.5vw, 2.5rem); line-height: 1.15; }
.mud-typography-h4 { font-size: clamp(1.4rem, 4.5vw, 2rem); line-height: 1.2; }

/* stop long unbroken words (slugs, emails, big wordmarks) from overflowing */
.mud-typography-h1, .mud-typography-h2, .mud-typography-h3, .mud-typography-h4 {
    overflow-wrap: anywhere;
}

.sdc-logo-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    padding: 7px;
    border: 1.5px solid var(--mud-palette-primary);  /* gold hairline, tracks the theme */
    border-radius: 0.85rem;
    background: var(--wine);                          /* solid wine roundel, as in the mockup */
    box-sizing: border-box;
    flex: none;
}

.sdc-logo-badge img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;     /* whole logo fits, no crop */
}