/*
    Style hosta — wyłącznie to, czego wspólna warstwa UI nie może znać: awaryjny pasek
    Blazora wstrzykiwany przez framework do dokumentu. Reszta wyglądu mieszka
    w _content/Montero.Ui.Wspolne (motyw.css + montero.css), więc kolorów tu nie ma.
*/

#blazor-error-ui {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    padding: var(--montero-odstep-3) var(--montero-odstep-4);
    background: var(--montero-tlo-bledu);
    color: var(--montero-blad);
    box-shadow: var(--montero-cien);
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    float: right;
    margin-left: var(--montero-odstep-3);
}

/*
    Nakładka skanera kodów. DOM buduje js/skaner.js — wspólna warstwa UI nie ma wiedzieć
    o istnieniu <video>. Kolorów tu nie ma: wszystko idzie zmiennymi z motyw.css, więc
    zmiana marki nie wymaga ruszania tego pliku.
*/

.m-skaner {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--montero-granat);
}

.m-skaner-podglad {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Celownik: kwadrat na środku, żeby było wiadomo, gdzie trzymać naklejkę. */
.m-skaner-ramka {
    position: relative;
    width: min(70vw, 70vh);
    aspect-ratio: 1;
    border: 2px solid var(--montero-akcent);
    border-radius: var(--montero-promien);
    box-shadow: 0 0 0 100vmax var(--montero-zaslona);
}

.m-skaner-podpis {
    position: relative;
    margin: var(--montero-odstep-4) var(--montero-odstep-4) 0;
    text-align: center;
    color: var(--montero-tekst-na-akcencie);
}

.m-skaner-anuluj {
    position: relative;
    margin-top: var(--montero-odstep-4);
    padding: var(--montero-odstep-3) var(--montero-odstep-5);
    border: 0;
    border-radius: var(--montero-promien);
    background: var(--montero-akcent);
    color: var(--montero-tekst-na-akcencie);
    font: inherit;
    cursor: pointer;
}