/* AGateway's few global styles. Colors come from MudBlazor's --mud-palette-* variables (Theme/AGatewayTheme.cs),
   so light and dark both work without anything here naming a theme color. */

html, body {
    margin: 0;
    font-family: var(--mud-typography-default-family);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    background: var(--mud-palette-background);
}

.muted { color: var(--mud-palette-text-secondary); }
.fw-semibold { font-weight: 600; }
.text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }

/* ── Shell ── */
.app-brand {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-left: 4px;
    color: inherit;
    text-decoration: none;
}
.app-wordmark { font-weight: 600; font-size: 1.125rem; letter-spacing: -.01em; }

.page-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}
.page-header-title { font-weight: 600; }
.page-header-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* ── Dashboard ── */
.summary-tile { height: 100%; }

.schedule-slot { border-bottom: 1px solid var(--mud-palette-lines-default); }
.schedule-slot-row {
    display: grid;
    grid-template-columns: 5.5rem 4rem 5rem 1fr;
    gap: 4px 12px;
    align-items: center;
    width: 100%;
}
.schedule-time { font-weight: 600; white-space: nowrap; }
.schedule-name { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.schedule-comment { grid-column: 2 / -1; font-size: .8125rem; }
.schedule-comment:empty { display: none; }

@media (max-width: 600px) {
    .schedule-slot-row { grid-template-columns: 4.5rem 1fr; }
    .schedule-loc, .schedule-type { display: none; }
    .schedule-comment { grid-column: 2; }
}

/* ── Patient ── */
.facts {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 6px 16px;
    margin: 0;
}
.facts dt { color: var(--mud-palette-text-secondary); }
.facts dd { margin: 0; }

/* ── Messaging ── */
.inbox {
    display: grid;
    grid-template-columns: minmax(260px, 360px) 1fr;
    gap: 16px;
    align-items: start;
}
.inbox-list { max-height: calc(100vh - 220px); overflow-y: auto; }
.inbox-preview { font-size: .8125rem; }
.inbox-when { font-size: .75rem; white-space: nowrap; }

@media (max-width: 900px) {
    .inbox { grid-template-columns: 1fr; }
    .inbox-list { max-height: 40vh; }
}

.thread { display: flex; flex-direction: column; }
.thread-messages {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 55vh;
    overflow-y: auto;
    padding: 4px;
}
.bubble {
    max-width: 80%;
    padding: 8px 12px;
    border-radius: 12px;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}
.bubble-in {
    align-self: flex-start;
    background: var(--mud-palette-background-gray);
}
.bubble-out {
    align-self: flex-end;
    background: var(--mud-palette-primary);
    color: var(--mud-palette-primary-text);
}
.bubble-meta { font-size: .72rem; opacity: .75; margin-top: 2px; }

/* ── Blazor's unhandled-error bar ── */
#blazor-error-ui {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 2000;
    padding: 12px 16px;
    box-sizing: border-box;
    background: var(--mud-palette-error);
    color: var(--mud-palette-error-text);
}
#blazor-error-ui .reload { color: inherit; margin-left: 8px; }
#blazor-error-ui .dismiss {
    float: right;
    background: none;
    border: 0;
    color: inherit;
    cursor: pointer;
}

/* ── Schedule slot kinds (AGraph2 StaffSlotKind) ── */
.slot-open { background: color-mix(in srgb, var(--mud-palette-success) 6%, transparent); }
.slot-reserved { background: color-mix(in srgb, #8e44ad 14%, transparent); }
.slot-lunch, .slot-blocked { background: color-mix(in srgb, var(--mud-palette-error) 8%, transparent); }
.slot-booked { background: var(--mud-palette-surface); }