html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

a, .btn-link {
    color: #006bb7;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

:root { --health-primary:#176b63; --health-primary-dark:#0e514b; --health-primary-soft:#e1f0ed; --health-bg:#f4f7f6; --health-ink:#17302d; --health-muted:#687b78; --health-danger:#a23a40; }
body { background:var(--health-bg); color:var(--health-ink); }
.health-page { max-width:760px; margin:0 auto; padding:1.25rem 1rem 5rem; }
.health-header { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1.2rem; }
.health-header h1 { font-size:clamp(1.6rem,6vw,2.3rem); margin:.2rem 0 0; font-weight:750; }
.health-header-actions { display:flex; align-items:center; gap:.55rem; }.report-link,.back-link { display:inline-flex; align-items:center; justify-content:center; min-height:38px; border:1px solid #b9d3cf; border-radius:999px; padding:.45rem .7rem; background:#fff; color:var(--health-primary); text-decoration:none; font-weight:750; font-size:.84rem; white-space:nowrap; }.report-link:hover,.back-link:hover { background:var(--health-primary-soft); color:var(--health-primary-dark); }.report-link:focus-visible,.back-link:focus-visible { outline:3px solid #64a89f; outline-offset:2px; }
.eyebrow { color:var(--health-primary); font-size:.8rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.date-chip { background:#e0eeeb; color:var(--health-primary); border-radius:999px; padding:.55rem .8rem; font-weight:700; white-space:nowrap; }
.today-progress { background:linear-gradient(135deg,var(--health-primary),#23877d); color:white; border-radius:20px; padding:1rem 1.1rem; margin-bottom:1rem; box-shadow:0 10px 25px #176b6330; }.today-progress>div:first-child { display:flex;align-items:baseline;gap:.5rem; }.today-progress strong { font-size:1.25rem; }.today-progress span { font-size:.78rem; }.period-dots { display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;margin-top:.75rem; }.period-dots span { opacity:.65;text-align:center;border:1px solid #ffffff50;border-radius:999px;padding:.25rem; }.period-dots span.done { opacity:1;background:var(--period-color,#fff);color:#fff;border-color:#ffffffb0;font-weight:800;text-shadow:0 1px 2px #0004; }
.health-card { background:#fff; border:1px solid #dde7e5; border-radius:20px; padding:1.1rem; margin-bottom:1rem; box-shadow:0 5px 22px rgba(27,74,69,.05); }
.health-card h2,.recent-section h2 { font-size:1.05rem; font-weight:750; margin:0 0 1rem; }
.period-card>label,.field label { display:block; font-size:.82rem; color:var(--health-muted); font-weight:700; margin-bottom:.4rem; }
.range-hint { float:right; color:#849591; font-size:.72rem; font-weight:600; }
.period-selector { display:grid; grid-template-columns:repeat(4,1fr); gap:.55rem; }
.period-action { position:relative; min-width:0; }.period-action .period-button { width:100%; min-height:65px; }.period-add { position:absolute; right:-5px; top:-7px; width:29px; height:29px; border-radius:50%; border:2px solid #fff; display:grid; place-items:center; padding:0; color:#fff; background:var(--health-primary); font-size:1.25rem; line-height:1; font-weight:800; box-shadow:0 2px 8px #0003; }.period-add:hover { background:var(--health-primary-dark); }.period-add:focus-visible { outline:3px solid #64a89f; outline-offset:2px; }.period-add:disabled { opacity:.65; }
.period-button { border:1px solid #d6e2df; background:#f8faf9; border-radius:13px; padding:.8rem .25rem; color:var(--health-ink); }
.period-button span { display:block; font-weight:700; margin-top:.2rem; }
.period-button.wellbeing-1,.period-dots .wellbeing-1,.recent-row.wellbeing-1 { --period-color:#c83f4a; }.period-button.wellbeing-2,.period-dots .wellbeing-2,.recent-row.wellbeing-2 { --period-color:#df7138; }.period-button.wellbeing-3,.period-dots .wellbeing-3,.recent-row.wellbeing-3 { --period-color:#d9ab24; }.period-button.wellbeing-4,.period-dots .wellbeing-4,.recent-row.wellbeing-4 { --period-color:#72a943; }.period-button.wellbeing-5,.period-dots .wellbeing-5,.recent-row.wellbeing-5 { --period-color:#23845c; }
.period-button[class*="wellbeing-"] { background:color-mix(in srgb,var(--period-color) 14%,white); border-color:color-mix(in srgb,var(--period-color) 42%,white); color:#24342f; }.period-button[class*="wellbeing-"]::first-line { color:inherit; }.period-button.selected { background:var(--period-color,var(--health-primary)); color:#fff; border-color:#fff; outline:3px solid var(--period-color,var(--health-primary)); outline-offset:2px; box-shadow:0 0 0 5px #fff; }
.period-button:disabled { cursor:wait; opacity:.7; }.loaded-entry-note { margin:.75rem 0 0; padding:.65rem .75rem; border-radius:10px; background:var(--health-primary-soft); color:var(--health-primary-dark); font-size:.8rem; }
.new-entry-note { background:#fff8de; color:#705b14; }.entry-times { display:flex; flex-wrap:wrap; gap:.45rem; margin-top:.9rem; padding-top:.8rem; border-top:1px solid #e3ebe9; }.entry-time { min-width:58px; min-height:38px; border:1px solid #cadbd7; border-radius:999px; background:#fff; color:var(--health-ink); font-weight:750; }.entry-time.active { background:var(--health-primary); border-color:var(--health-primary); color:#fff; }.entry-time:focus-visible { outline:3px solid #64a89f; outline-offset:2px; }.measurement-time { margin-top:1rem; }.measurement-time input { max-width:180px; }.measurement-time small { position:static; display:block; margin-top:.35rem; }.measurement-time .validation-message { max-width:440px; }
.measurement-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem .75rem; }
.field { position:relative; }
.field input,.field textarea { width:100%; border:1px solid #cfddda; border-radius:12px; padding:.78rem; font-size:1.05rem; background:#fbfcfc; }
.field input:focus,.field textarea:focus { border-color:var(--health-primary); box-shadow:0 0 0 3px #176b6320; outline:0; }
.field small { position:absolute; right:.7rem; bottom:.85rem; color:var(--health-muted); pointer-events:none; }
.pulse-input-shell { display:grid; grid-template-columns:1.7rem minmax(3.2rem,1fr); align-items:center; gap:.35rem; }
.pulse-field input { min-width:0; padding:.78rem .35rem; text-align:center; font-weight:700; }
.pulse-heart { position:static; justify-self:center; color:#a9b7b4; font-size:1.5rem; line-height:1; pointer-events:none; transform-origin:center; }
.pulse-heart.has-pulse { color:#c83f4a; filter:drop-shadow(0 0 1px #c83f4a55); }
.field .validation-message { display:block; color:var(--health-danger); font-size:.75rem; line-height:1.25; margin-top:.3rem; }.field input.invalid { border-color:var(--health-danger); background:#fff8f8; }.validation-summary { color:var(--health-danger); background:#fff2f2; border:1px solid #efc9cc; border-radius:12px; padding:.75rem 1rem; margin-bottom:1rem; }.validation-summary:empty { display:none; }
.field.wide { grid-column:1/-1; }
.pressure-row { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:.5rem; }
.pressure-row span { font-size:1.5rem; color:var(--health-muted); }
.check-field { grid-column:1/-1; display:flex; gap:.55rem; align-items:center; font-weight:650; }
.check-field input { width:1.2rem; height:1.2rem; accent-color:var(--health-primary); }
.wellbeing { width:100%; height:28px; margin:.15rem 0; appearance:none; background:transparent; cursor:pointer; }.wellbeing::-webkit-slider-runnable-track { height:10px; border-radius:999px; background:linear-gradient(90deg,#c83f4a 0%,#df7138 25%,#e2c438 50%,#79ad45 75%,#23845c 100%); }.wellbeing::-moz-range-track { height:10px; border-radius:999px; background:linear-gradient(90deg,#c83f4a 0%,#df7138 25%,#e2c438 50%,#79ad45 75%,#23845c 100%); }.wellbeing::-webkit-slider-thumb { appearance:none; width:25px; height:25px; margin-top:-7.5px; border-radius:50%; background:var(--wellbeing-color); border:4px solid #fff; box-shadow:0 1px 7px #0005; }.wellbeing::-moz-range-thumb { width:18px; height:18px; border-radius:50%; background:var(--wellbeing-color); border:4px solid #fff; box-shadow:0 1px 7px #0005; }.wellbeing:focus-visible { outline:3px solid #5b9c94; outline-offset:3px; border-radius:8px; }
.wellbeing-labels { display:flex; justify-content:space-between; align-items:center; color:var(--health-muted); font-size:.8rem; margin-bottom:1rem; }
.wellbeing-labels strong { color:var(--wellbeing-color); font-size:.86rem; }
.notes textarea { min-height:85px; }
.save-button,.filter-button { width:100%; border:0; border-radius:15px; background:var(--health-primary); color:#fff; font-size:1.05rem; font-weight:750; padding:1rem; box-shadow:0 6px 18px #176b6340; }
.save-button:hover,.filter-button:hover { background:var(--health-primary-dark); }.save-button:focus-visible,.filter-button:focus-visible,.period-button:focus-visible { outline:3px solid #64a89f; outline-offset:2px; }
.save-button:disabled { opacity:.6; }
.recent-section { margin-top:2rem; }
.section-title { display:flex; justify-content:space-between; align-items:center; }
.section-title a { color:var(--health-primary); text-decoration:none; font-weight:700; }
.recent-row { background:#fff; border-bottom:1px solid #e2e9e7; padding:.85rem 1rem; display:flex; justify-content:space-between; }
.recent-row[class*="wellbeing-"] { background:color-mix(in srgb,var(--period-color) 12%,white); border-bottom-color:color-mix(in srgb,var(--period-color) 24%,#dce7e4); }
.recent-row:first-of-type { border-radius:15px 15px 0 0; }.recent-row:last-child { border-radius:0 0 15px 15px; border:0; }
.recent-row div { display:flex; flex-direction:column; }.recent-row span { color:var(--health-muted); font-size:.82rem; }.reading { text-align:right; }
.empty-state { color:var(--health-muted); background:#fff; padding:1.2rem; border-radius:15px; }
.filters { display:grid; grid-template-columns:1fr 1fr auto; align-items:end; gap:.7rem; }.filters .filter-button { width:auto; padding:.8rem 1.1rem; }
.history-item { display:grid; grid-template-columns:1.5fr repeat(5,1fr); gap:.8rem; align-items:center; }.history-date,.metric { display:flex; flex-direction:column; }.history-date span,.metric span { color:var(--health-muted); font-size:.75rem; }.history-notes { grid-column:1/-1; margin:0; background:#f5f8f7; padding:.7rem; border-radius:10px; }
.report-filters { display:grid; grid-template-columns:1fr 1fr auto; align-items:end; gap:.7rem; }.report-filters .filter-button { width:auto; padding:.8rem 1.1rem; }.report-status { color:var(--health-danger); margin:.8rem .15rem; }.report-viewer-host { min-height:68dvh; overflow:hidden; border:1px solid #dde7e5; border-radius:20px; background:#fff; box-shadow:0 5px 22px rgba(27,74,69,.05); }
@media (max-width:700px) { .history-item { grid-template-columns:repeat(2,1fr); }.history-date { grid-column:1/-1; }.filters { grid-template-columns:1fr 1fr; }.filters .filter-button { grid-column:1/-1; width:100%; } }
@media (max-width:700px) { .report-filters { grid-template-columns:1fr 1fr; }.report-filters .filter-button { grid-column:1/-1; width:100%; }.report-viewer-host { min-height:72dvh; border-radius:16px; } }
@media (max-width:480px) { .health-page { padding:.9rem .65rem 5rem; }.health-card { border-radius:16px; padding:.9rem; }.measurement-grid { gap:.85rem .55rem; }.health-header { align-items:flex-start; }.date-chip { font-size:.78rem; }.health-header-actions { flex-direction:column; align-items:stretch; gap:.35rem; }.report-link { min-height:32px; }.report-viewer-host { min-height:76dvh; } }
@media (max-width:420px) { .period-selector { grid-template-columns:repeat(2,1fr); gap:.7rem; }.period-action .period-button { min-height:58px; } }
.login-page { min-height:calc(100dvh - 68px); display:grid; place-items:center; padding:2rem 1rem 4rem; background:radial-gradient(circle at 50% 0,#dcefeb 0,transparent 42%); }
.login-card { width:min(100%,430px); background:#fff; border:1px solid #dce7e4; border-radius:28px; padding:clamp(1.4rem,5vw,2.4rem); box-shadow:0 20px 60px rgba(17,69,63,.12); }.login-symbol { width:58px;height:58px;display:grid;place-items:center;border-radius:18px;background:var(--health-primary);color:#fff;font-size:1.6rem;margin-bottom:1.25rem; }.login-card h1 { margin:.3rem 0 .5rem;font-size:2rem; }.login-intro,.privacy-note { color:var(--health-muted); }.login-form { margin-top:1.5rem;display:grid;gap:1rem; }.login-form .field input { min-height:52px; }.remember { display:flex;align-items:center;gap:.6rem;color:var(--health-muted); }.remember input { width:1.2rem;height:1.2rem;accent-color:var(--health-primary); }.privacy-note { text-align:center;font-size:.75rem;margin:1.25rem 0 0; }.text-danger { color:var(--health-danger)!important;font-size:.8rem; }
