/* Compact history in the existing Live Endpoint Checks panel. */
.uptime-history { margin-top: 20px; padding-top: 12px; border-top: 1px solid #343747; min-width: 0; }
.history-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.uptime-history h2 { font-size: 15px; margin: 0; letter-spacing: -.015em; }
.history-service-label { min-width: 0; max-width: 155px; }
.history-service-label select { width: 100%; min-height: 32px; padding: 5px 25px 5px 9px; background: #171b25; border: 1px solid #3a4053; border-radius: 6px; color: #e1e5f1; font: inherit; font-size: 11px; }
.history-summary { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 10px 0 9px; }
.history-summary p { display: flex; align-items: baseline; flex-wrap: wrap; gap: 5px; margin: 0; }
.history-summary strong { color: #edf0fc; font-size: 18px; font-weight: 600; letter-spacing: -.025em; font-variant-numeric: tabular-nums; }
.history-summary p + p strong { font-size: 12px; font-weight: 500; }
.history-summary span { font-size: 10px; color: #a8adbf; }
.history-days { display: grid; grid-template-columns: repeat(90, minmax(0, 1fr)); gap: 2px; padding-block: 4px; }
.history-day { --day-color: #465065; appearance: none; display: block; position: relative; min-width: 0; height: 25px; padding: 0; border: 1px solid #5b627260; border-radius: 2px; background: #242a36; cursor: pointer; color: #f1f6fc; scroll-margin-block: 90px; transition: transform .16s ease, box-shadow .16s ease; }
.history-day[data-state='online'] { --day-color: #59c7a0; }
.history-day[data-state='degraded'] { --day-color: #e7b55c; }
.history-day[data-state='offline'] { --day-color: #ef818c; }
.history-day[data-state='maintenance'] { --day-color: #9f9aec; }
.history-day:not([data-state='unknown']) { background: var(--day-color); border-color: transparent; }
.history-day.has-gaps:not([data-state='unknown']) { background: repeating-linear-gradient(135deg, #11152066 0 3px, transparent 3px 7px), var(--day-color); }
.history-day[data-state='unknown'] { border-style: dashed; }
.history-day:hover { transform: translateY(-2px); box-shadow: 0 4px 9px #0004; z-index: 1; }
.history-day:focus-visible, .history-day[aria-pressed='true'] { outline: 1px solid #e1e4fd; outline-offset: 2px; z-index: 2; }
.history-day-number { display: none; }
.history-axis { display: flex; justify-content: space-between; gap: 12px; font-size: 10px; color: #a8adbf; margin: 5px 0 10px; }
.history-details { border-block: 1px solid #303545; }
.history-details summary { cursor: pointer; font-size: 11px; color: #d1d7e6; padding: 10px 0; line-height: 1.6; min-height: 38px; }
.history-details summary:focus-visible { outline: 2px solid #aaaefa; outline-offset: 2px; }
.history-date-label { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 11px; color: #bdc3d3; margin: 4px 0 10px; }
.history-date-label input { color-scheme: dark; background: #171b25; border: 1px solid #3a4053; border-radius: 5px; color: #e1e5f1; padding: 7px 9px; font: inherit; min-height: 38px; min-width: 0; }
.history-day-detail { display: flex; flex-wrap: wrap; align-items: center; gap: 5px 12px; font-size: 11px; color: #afb6ca; }
.history-day-detail p { margin: 0; }
.history-detail-date { font-weight: 600; color: #f0f1fa; }
.history-detail-state { color: #c4c9de; }
.history-detail-counts { flex-basis: 100%; font-size: 11px; line-height: 1.7; }
#history-recorder { color: #afb6ca; font-size: 11px; line-height: 1.7; margin: 10px 0; }
.history-legend { display: flex; flex-wrap: wrap; gap: 6px 12px; margin-top: 8px; color: #bdc3d3; font-size: 10px; }
.history-legend span { display: inline-flex; gap: 5px; align-items: center; }
.history-legend span::before { content: ''; display: block; width: 6px; height: 6px; border-radius: 2px; background: #465065; }
.history-legend .key-online::before { background: #59c7a0; }
.history-legend .key-degraded::before { background: #e7b55c; }
.history-legend .key-offline::before { background: #ef818c; }
.history-legend .key-maintenance::before { background: #9f9aec; }
.history-method { font-size: 11px; line-height: 1.8; color: #a1a8ba; margin: 10px 0 12px; }
.history-note { font-size: 10px; line-height: 1.7; color: #a1a8ba; margin: 6px 0 0; }
.history-error { font-size: 11px; color: #f4be85; line-height: 1.7; margin-top: 12px; }
.history-error[hidden] { display: none; }
@media (max-width: 600px) {
    .history-days { grid-template-columns: repeat(30, minmax(0, 1fr)); gap: 3px; }
    .history-day { height: 13px; }
    .history-summary { gap: 8px; }
    .history-summary p + p { justify-content: flex-end; }
    .history-summary strong { font-size: 17px; }
    .history-service-label { max-width: 140px; }
}
@media (prefers-reduced-motion: reduce) {
    .history-day { transition: none !important; }
    .history-day:hover { transform: none; }
}
