html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

h1:focus {
    outline: none;
}

/* Fjarskiptastofa brand: navy ink (#17283F) as the primary action colour, red (#E42127) as the
   accent. Overrides the Radzen Standard theme's default blue primary. */
:root {
    --rz-primary: #17283f;
    --rz-primary-dark: #0f1c2e;
    --rz-primary-darker: #0a141f;
    --rz-primary-light: #24405f;
    --rz-primary-lighter: #eaedf1;
}

/* Red brand accent line under the app header, and vertically centre the header content.
   RadzenHeader (.rz-header) is a min-height block that does not centre its child, so the
   logo/title (and user/logout) would otherwise sit at the top with the slack pooling below
   — most visible on the bidder/login header, which has no sidebar toggle to fill the height. */
.rz-header {
    border-bottom: 3px solid #e42127;
    display: flex;
    align-items: center;
}

/* Test installation (Ui:TestSystem): pale-yellow page and header so it is never mistaken for the
   live system (review P1 "TST vs PRD"). Cards and grids stay white for readability. */
.pfs-env-test,
.pfs-env-test .rz-body,
.pfs-env-test .rz-header {
    background: #fff6cc !important;
}

a, .btn-link {
    color: #17283f;
}

.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;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

#blazor-error-ui {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.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."
    }

.loading-progress {
    position: absolute;
    display: block;
    width: 8rem;
    height: 8rem;
    inset: 20vh 0 auto 0;
    margin: 0 auto 0 auto;
}

    .loading-progress circle {
        fill: none;
        stroke: #e0e0e0;
        stroke-width: 0.6rem;
        transform-origin: 50% 50%;
        transform: rotate(-90deg);
    }

        .loading-progress circle:last-child {
            stroke: #1b6ec2;
            stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
            transition: stroke-dasharray 0.05s ease-in-out;
        }

.loading-progress-text {
    position: absolute;
    text-align: center;
    font-weight: bold;
    inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
}

    .loading-progress-text:after {
        content: var(--blazor-load-percentage-text, "Loading");
    }

code {
    color: #c02d76;
}

.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;
}

/* Admin auction monitor — one event line: <time> <tag> <text> (<user>) */
.pfs-monitor-line {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    padding: 0.15rem 0;
    border-bottom: 1px solid var(--rz-base-200, #f0f0f0);
}

.pfs-monitor-line:last-child {
    border-bottom: none;
}

/* Bidder-question lines link through to the Fyrirspurnir tab so the admin can reply. */
.pfs-monitor-clickable {
    cursor: pointer;
    border-radius: 4px;
}

.pfs-monitor-clickable:hover {
    background: var(--rz-base-200, #f0f0f0);
}

.pfs-monitor-time {
    font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color, #666);
    white-space: nowrap;
}

.pfs-monitor-text {
    flex: 1;
    min-width: 0;
}

.pfs-monitor-user {
    color: var(--rz-text-secondary-color, #666);
    font-size: 0.85rem;
    white-space: nowrap;
}

/* Active round: subtle highlight + "awaiting more events" pulse cue. */
.pfs-monitor-active {
    border-left: 3px solid var(--rz-success, #4caf50);
}

.pfs-monitor-awaiting {
    color: var(--rz-text-secondary-color, #666);
    font-style: italic;
    border-bottom: none;
    /* Center the hourglass with the text beside it (override the line's baseline). */
    align-items: center;
    /* A little breathing room above so the "round in progress" cue stands out. */
    margin-top: 0.75rem;
}

.pfs-monitor-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--rz-success, #4caf50);
    animation: pfs-pulse 1.3s ease-in-out infinite;
}

@keyframes pfs-pulse {
    0%, 100% { opacity: 0.25; transform: scale(0.85); }
    50%      { opacity: 1;    transform: scale(1.15); }
}

/* Ongoing-round hourglass — flips periodically to read as "running". */
.pfs-hourglass {
    color: var(--rz-info, #2196f3);
    font-size: 1.1rem;
    line-height: 1;
    transform-origin: center;
    animation: pfs-hourglass 2s ease-in-out infinite;
}

@keyframes pfs-hourglass {
    0%, 70%   { transform: rotate(0deg); }
    85%, 100% { transform: rotate(180deg); }
}

/* Per-entry status dot (green ongoing / gray closed / red invalid / blue pending). */
.pfs-status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    flex: 0 0 auto;
}

/* #9 — single-auction progression: Hófst → Umferð n → … → Lokið */
.pfs-stepper {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding: 0.5rem 0.25rem;
}

.pfs-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
    min-width: 60px;
}

.pfs-step-dot {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: var(--rz-base-300, #cfcfcf);
    border: 2px solid var(--rz-base-300, #cfcfcf);
}

.pfs-step-lbl {
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color, #666);
    white-space: nowrap;
}

.pfs-step-line {
    flex: 1;
    min-width: 24px;
    height: 2px;
    background: var(--rz-base-300, #e0e0e0);
}

.pfs-step-done .pfs-step-dot { background: var(--rz-success, #4caf50); border-color: var(--rz-success, #4caf50); }
.pfs-step-ongoing .pfs-step-dot { background: var(--rz-success, #4caf50); border-color: var(--rz-success, #4caf50); animation: pfs-pulse 1.3s ease-in-out infinite; }
.pfs-step-ongoing .pfs-step-lbl { color: var(--rz-success, #4caf50); font-weight: 600; }
.pfs-step-pending .pfs-step-dot { background: transparent; }
.pfs-step-invalid .pfs-step-dot { background: var(--rz-danger, #f44336); border-color: var(--rz-danger, #f44336); }
.pfs-step-closed .pfs-step-dot { background: var(--rz-text-disabled-color, #9e9e9e); border-color: var(--rz-text-disabled-color, #9e9e9e); }

/* ============================================================================
   Phase 5 — responsive bidder experience (AMZ-8573). Approach A: CSS only.
   Breakpoints: phone < 768px, tablet 768–991px, desktop >= 992px.
   Radzen display utilities: sm = 768px, md = 1024px — the 768px table/card
   switch therefore uses the *sm* variants.
   ============================================================================ */

/* Sidebar: docked only on desktop (>= 992px). Below that it collapses, and when
   opened via the hamburger it floats over the content as an overlay instead of
   pushing it. Radzen leaves the responsive sidebar with neither expanded nor
   collapsed class until the user toggles, so :not(.rz-sidebar-expanded) covers
   both the default and the collapsed state. */
@media (max-width: 991.98px) {
    .rz-sidebar.rz-sidebar-responsive:not(.rz-sidebar-expanded) {
        width: 0;
        opacity: 0;
        overflow: hidden;
    }

    .rz-sidebar.rz-sidebar-expanded {
        position: fixed;
        top: var(--rz-header-min-height, 3.125rem);
        bottom: 0;
        left: 0;
        z-index: 3;
        width: var(--rz-sidebar-width, 250px);
        opacity: 1;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
    }
}

/* Phone-only shell tuning. */
@media (max-width: 767.98px) {
    /* Tighter page padding than the desktop rz-p-4, and never scroll sideways. */
    .pfs-body-pad {
        padding: 0.75rem !important;
        overflow-x: hidden;
    }

    /* Round header: stack vertically instead of one wrapped horizontal row.
       RadzenStack sets flex-direction/align/gap inline, so override with !important. */
    .pfs-round-header {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 0.5rem !important;
    }
    .pfs-round-remaining {
        margin-left: 0 !important;
    }

    /* Smaller tender title so long names don't overflow on a phone. */
    .pfs-tender-title {
        font-size: 1.25rem !important;
    }

    /* Comfortable ~44px tap targets on the bid input and the Senda button. */
    .pfs-bid-row .rz-numeric input,
    .pfs-bid-row .rz-button {
        min-height: 44px;
    }
}

/* Hide the signed-in display name on the narrowest screens (logout stays). */
@media (max-width: 479.98px) {
    .pfs-user-name {
        display: none;
    }
}

/* ============================================================================
   Phase 6 — admin↔bidder Q&A (AMZ-8573): thread list + chat bubbles.
   ============================================================================ */

/* Left-pane thread row (bidder name + unread badge + last-message preview). */
.pfs-qa-thread {
    padding: 0.6rem 0.75rem;
    border: 1px solid var(--rz-base-200, #e0e0e0);
    border-radius: 0.5rem;
    cursor: pointer;
    margin-bottom: 0.5rem;
}

.pfs-qa-thread:hover {
    border-color: var(--rz-primary, #17283f);
}

.pfs-qa-thread-selected {
    border-color: var(--rz-primary, #17283f);
    background: var(--rz-primary-lighter, #eaedf1);
}

.pfs-qa-preview {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Right-pane chat: scrollable column of bubbles, admin right / bidder left. */
.pfs-chat-thread {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 420px;
    overflow-y: auto;
    padding: 0.25rem 0.25rem 0.5rem 0.25rem;
}

.pfs-chat-bubble {
    max-width: 75%;
    padding: 0.5rem 0.75rem;
    border-radius: 0.75rem;
    background: var(--rz-base-200, #f0f0f0);
    word-break: break-word;
}

.pfs-chat-bubble-admin {
    align-self: flex-end;
    background: var(--rz-primary-lighter, #eaedf1);
    border-bottom-right-radius: 0.15rem;
}

.pfs-chat-bubble-bidder {
    align-self: flex-start;
    border-bottom-left-radius: 0.15rem;
}

.pfs-chat-meta {
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color, #666);
    margin-bottom: 0.15rem;
}

/* Key/value table in the signed-bid dialog. */
.pfs-kv { border-collapse: collapse; width: 100%; }
.pfs-kv th { text-align: left; font-weight: 600; padding: 0.2rem 1rem 0.2rem 0; white-space: nowrap; width: 1%; color: var(--rz-text-secondary-color); }
.pfs-kv td { padding: 0.2rem 0; }

/* Bidder between-rounds results (terms 5.3.2). */
.pfs-between-table { border-collapse: collapse; width: 100%; font-size: 0.9rem; }
.pfs-between-table th { text-align: left; font-weight: 600; color: var(--rz-text-secondary-color); border-bottom: 1px solid var(--rz-base-300); padding: 0.3rem 0.5rem 0.3rem 0; }
.pfs-between-table td { border-bottom: 1px solid var(--rz-base-200); padding: 0.3rem 0.5rem 0.3rem 0; }
.pfs-between-table .num { text-align: right; white-space: nowrap; }
.pfs-next-message { font-size: 0.85em; color: var(--rz-info-darker, #0b5394); margin-top: 0.15rem; }

/* Clickable text without navigation (e.g. round message opens a dialog). */
.pfs-link { color: var(--rz-primary); cursor: pointer; text-decoration: underline; text-decoration-style: dotted; }