@import '_content/Blazored.Toast/Blazored.Toast.bundle.scp.css';

/* _content/ArasWeb/Pages/Assistant/Assistant.razor.rz.scp.css */
/* Aras Asistent — prati dizajn aplikacije: bijele kartice sa sjenom,
   plava var(--ar-primary), tekst #14425a, Ubuntu fontovi (vidi CLAUDE.md UI guide). */

#assistant-root[b-wf2n6fbew7] {
    --a-text: #14425a;
    --a-muted: #6c757d;
    --a-accent: var(--ar-primary);
    --a-accent-dark: #025aa5;
    --a-success: #5cb85c;
    --a-danger: #d9534f;
    --a-light: #e4eef2;
    --a-border: #d8e2e8;
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    color: var(--a-text);
    font-family: 'Ubuntu-Light', sans-serif;
    font-size: 15px;
}

/* Header kartica */
.assistant-header[b-wf2n6fbew7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: white;
    padding: 1em;
    border-radius: 1em;
    margin-bottom: 0;
}

.assistant-header label[b-wf2n6fbew7] {
    font-family: 'Ubuntu-Medium', sans-serif;
    font-size: 17px;
    margin: 0;
}

.assistant-day[b-wf2n6fbew7] {
    color: var(--a-muted);
    font-size: 12.5px;
    margin: 0;
    text-transform: capitalize;
}

.icon-btn[b-wf2n6fbew7] {
    background: var(--a-light);
    border: 1px solid var(--a-border);
    color: var(--a-accent);
    border-radius: .6em;
    padding: 8px 13px;
    cursor: pointer;
    font-size: 15px;
}
.icon-btn.off[b-wf2n6fbew7] { color: var(--a-muted); }

/* Baner za dozvolu mikrofona */
.mic-banner[b-wf2n6fbew7] {
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 1em;
    padding: 10px 16px;
    margin-top: .8em;
    font-size: 13.5px;
}
.mic-banner.info[b-wf2n6fbew7] { background: #e2f0fb; color: var(--a-accent-dark); }
.mic-banner.warn[b-wf2n6fbew7] { background: #fbe9e8; color: #a94442; }

/* Tok razgovora */
.assistant-main[b-wf2n6fbew7] {
    flex: 1;
    overflow-y: auto;
    padding: 1.2em .2em;
    min-width: 0;
}

.assistant-hint[b-wf2n6fbew7] { color: var(--a-muted); font-size: 13px; margin-bottom: 10px; }

.assistant-chips[b-wf2n6fbew7] { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 1.5em; }

.chip[b-wf2n6fbew7] {
    background: white;
    border: 1px solid var(--a-border);
    color: var(--a-text);
    border-radius: 1em;
    padding: 10px 14px;
    cursor: pointer;
    font-size: 13.5px;
    box-shadow: 0 .1rem .3rem rgba(20, 66, 90, .08);
}
.chip:hover[b-wf2n6fbew7] { border-color: var(--a-accent); color: var(--a-accent); }

.msg[b-wf2n6fbew7] { display: flex; margin-bottom: 12px; }
.msg.user[b-wf2n6fbew7] { justify-content: flex-end; }

.bubble[b-wf2n6fbew7] {
    max-width: 78%;
    padding: 11px 15px;
    border-radius: 1em;
    white-space: pre-wrap;
}
.msg.user .bubble[b-wf2n6fbew7] {
    background: var(--a-accent);
    color: white;
    font-family: 'Ubuntu-Medium', sans-serif;
    border-bottom-right-radius: 4px;
}
.msg.assistant .bubble[b-wf2n6fbew7] {
    background: white;
    box-shadow: 0 .125rem .35rem rgba(20, 66, 90, .1);
    border-bottom-left-radius: 4px;
}

.voice-tag[b-wf2n6fbew7] { font-size: 11.5px; opacity: .8; margin-bottom: 3px; }
.tools-tag[b-wf2n6fbew7] { font-size: 11.5px; color: var(--a-accent); margin-top: 7px; }

.assistant-status[b-wf2n6fbew7] { color: var(--a-muted); font-size: 13px; padding: 4px 2px; }
.assistant-status .dots[b-wf2n6fbew7]::after { content: ""; animation: assistant-dots-b-wf2n6fbew7 1.2s steps(4) infinite; }
@keyframes assistant-dots-b-wf2n6fbew7 { 0% { content: "" } 25% { content: "." } 50% { content: ".." } 75% { content: "..." } }

/* Kartice s podacima */
.tool-card[b-wf2n6fbew7] {
    background: white;
    border-radius: 1em;
    box-shadow: 0 .125rem .35rem rgba(20, 66, 90, .1);
    padding: 1em 1.2em;
    margin: 4px 0 14px;
    max-width: 92%;
}

.tool-card-header[b-wf2n6fbew7] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}
.tool-card-title[b-wf2n6fbew7] { font-family: 'Ubuntu-Medium', sans-serif; font-size: 14px; }
.tool-card-meta[b-wf2n6fbew7] { color: var(--a-muted); font-size: 12px; }

/* Faze narudžbe */
.stage-track[b-wf2n6fbew7] { display: flex; gap: 4px; margin: 8px 0 12px; }
.stage[b-wf2n6fbew7] { flex: 1; text-align: center; }
.stage-dot[b-wf2n6fbew7] {
    width: 10px; height: 10px;
    border-radius: 50%;
    background: var(--a-border);
    margin: 0 auto 4px;
}
.stage.done .stage-dot[b-wf2n6fbew7] { background: var(--a-success); }
.stage.current .stage-dot[b-wf2n6fbew7] { background: var(--a-accent); box-shadow: 0 0 0 4px rgba(2, 117, 216, .18); }
.stage-name[b-wf2n6fbew7] { font-size: 10px; color: var(--a-muted); }
.stage.current .stage-name[b-wf2n6fbew7] { color: var(--a-accent); font-family: 'Ubuntu-Medium', sans-serif; }
.stage.done .stage-name[b-wf2n6fbew7] { color: var(--a-success); }

.article-row[b-wf2n6fbew7] {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding: 6px 0 2px;
    border-top: 1px solid var(--a-light);
    font-size: 13px;
    flex-wrap: wrap;
}
.article-name[b-wf2n6fbew7] { font-family: 'Ubuntu-Medium', sans-serif; }
.article-status[b-wf2n6fbew7] { color: var(--a-muted); font-size: 12px; }

.step-row[b-wf2n6fbew7] {
    display: grid;
    grid-template-columns: minmax(90px, 1fr) 2fr auto minmax(80px, 1fr);
    gap: 8px;
    align-items: center;
    font-size: 12px;
    padding: 3px 0;
}
.step-name[b-wf2n6fbew7] { color: var(--a-muted); }
.step-bar[b-wf2n6fbew7] { height: 6px; background: var(--a-light); border-radius: 3px; overflow: hidden; }
.step-fill[b-wf2n6fbew7] { height: 100%; background: linear-gradient(90deg, var(--a-accent), var(--a-success)); }
.step-count[b-wf2n6fbew7] { font-variant-numeric: tabular-nums; }
.step-meta[b-wf2n6fbew7] { color: var(--a-muted); text-align: right; }

/* KPI mreža */
.kpi-grid[b-wf2n6fbew7] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
    gap: 8px;
    margin-bottom: 10px;
}
.kpi-box[b-wf2n6fbew7] {
    background: var(--a-light);
    border-radius: .8em;
    padding: 8px 12px;
}
.kpi-value[b-wf2n6fbew7] {
    font-size: 20px;
    font-family: 'Ubuntu-Medium', sans-serif;
    font-variant-numeric: tabular-nums;
    color: var(--a-success);
}
.kpi-value.warn[b-wf2n6fbew7] { color: var(--a-danger); }
.kpi-label[b-wf2n6fbew7] { font-size: 11px; color: var(--a-muted); }

.pipeline-row[b-wf2n6fbew7] { display: flex; gap: 8px; flex-wrap: wrap; }
.pipeline-box[b-wf2n6fbew7] {
    display: flex;
    flex-direction: column;
    background: var(--a-light);
    border-radius: .8em;
    padding: 6px 12px;
    font-size: 12px;
}
.pipeline-label[b-wf2n6fbew7] { color: var(--a-muted); font-size: 11px; }

/* Aktivnosti */
.activity-row[b-wf2n6fbew7] { display: flex; gap: 10px; padding: 4px 0; font-size: 13px; border-top: 1px solid var(--a-light); }
.activity-row:first-of-type[b-wf2n6fbew7] { border-top: none; }
.activity-time[b-wf2n6fbew7] { color: var(--a-muted); font-variant-numeric: tabular-nums; flex-shrink: 0; }

/* Tabele */
.tool-table[b-wf2n6fbew7] { width: 100%; border-collapse: collapse; font-size: 13px; }
.tool-table th[b-wf2n6fbew7] {
    text-align: left;
    color: var(--a-muted);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .06em;
    padding: 4px 8px 6px 0;
    border-bottom: 1px solid var(--a-border);
}
.tool-table td[b-wf2n6fbew7] { padding: 6px 8px 6px 0; border-bottom: 1px solid var(--a-light); }
.tool-table tr:last-child td[b-wf2n6fbew7] { border-bottom: none; }

/* Unos */
.assistant-footer[b-wf2n6fbew7] {
    background: white;
    border-radius: 1em;
    box-shadow: 0 .125rem .35rem rgba(20, 66, 90, .1);
    padding: 12px 16px 10px;
    margin-bottom: 0;
}

.assistant-bar[b-wf2n6fbew7] { display: flex; gap: 10px; align-items: center; }

.assistant-input[b-wf2n6fbew7] {
    flex: 1;
    background: var(--a-light);
    border: 1px solid var(--a-border);
    color: var(--a-text);
    border-radius: 1em;
    padding: 12px 16px;
    font-size: 15px;
    outline: none;
    min-width: 0;
    font-family: 'Ubuntu-Light', sans-serif;
}
.assistant-input:focus[b-wf2n6fbew7] { border-color: var(--a-accent); }

.round-btn[b-wf2n6fbew7] {
    width: 46px; height: 46px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    font-size: 17px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: transform .15s ease;
}
.round-btn.send[b-wf2n6fbew7] { background: var(--a-light); border: 1px solid var(--a-border); color: var(--a-accent); }
.round-btn.mic[b-wf2n6fbew7] { background: var(--a-accent); color: white; }
.round-btn.mic:hover[b-wf2n6fbew7] { background: var(--a-accent-dark); }
.round-btn.mic.rec[b-wf2n6fbew7] { background: var(--a-danger); animation: assistant-pulse-b-wf2n6fbew7 1.1s infinite; }

/* Wake word pogodak: mikrofon se uveća i zatrese */
.round-btn.mic.wake-hit[b-wf2n6fbew7] { animation: assistant-wake-hit-b-wf2n6fbew7 .9s ease; }
@keyframes assistant-wake-hit-b-wf2n6fbew7 {
    0% { transform: scale(1) rotate(0); }
    15% { transform: scale(1.45) rotate(-14deg); }
    30% { transform: scale(1.45) rotate(12deg); }
    45% { transform: scale(1.4) rotate(-9deg); }
    60% { transform: scale(1.4) rotate(7deg); }
    75% { transform: scale(1.35) rotate(-4deg); }
    100% { transform: scale(1) rotate(0); }
}

@keyframes assistant-pulse-b-wf2n6fbew7 { 50% { box-shadow: 0 0 0 10px rgba(217, 83, 79, .18); } }

.assistant-foot-hint[b-wf2n6fbew7] {
    margin-top: 8px;
    color: var(--a-muted);
    font-size: 12px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.listen-dot[b-wf2n6fbew7] {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--a-success);
    display: inline-block;
    animation: assistant-listen-b-wf2n6fbew7 1.6s ease-in-out infinite;
}
@keyframes assistant-listen-b-wf2n6fbew7 { 50% { opacity: .35; transform: scale(.8); } }
/* _content/ArasWeb/Pages/Bom/BomEditModal.razor.rz.scp.css */
.bom-modal[b-qobe9a149d] {
    gap: var(--space-md);
    padding: var(--space-md) var(--space-lg);
    color: var(--color-text-dark);
}

.bom-meta[b-qobe9a149d] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-md);
    font-family: var(--font-light);
    font-size: 0.9em;
}

.meta-item[b-qobe9a149d] {
    color: #6c757d;
}

    .meta-item i[b-qobe9a149d] {
        margin-right: 0.3em;
    }

.newer-banner[b-qobe9a149d] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);
    padding: 0.75em 1em;
    border-radius: 0.5em;
    border-left: 4px solid var(--color-primary);
    background: var(--color-bg-surface);
    font-family: var(--font-light);
    font-size: 0.9em;
}

    .newer-banner strong[b-qobe9a149d] {
        font-family: var(--font-medium);
        font-weight: normal;
    }

    .newer-banner .btn[b-qobe9a149d] {
        white-space: nowrap;
    }

.newer-note[b-qobe9a149d] {
    display: block;
    color: #6c757d;
    margin-top: 0.2em;
}

/* Na dnu i zalijepljena: dugmad su dolje, pa se greška mora vidjeti i kad je sadržaj skrolan. */
.form-error[b-qobe9a149d] {
    position: sticky;
    bottom: 0;
    z-index: 2;
    width: 100%;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
    padding: 0.6em 1em;
    border-radius: 0.5em;
    background: #fdecec;
    color: #a3322f;
    font-family: var(--font-light);
    font-size: 0.9em;
}

    .form-error i[b-qobe9a149d] {
        margin-right: 0.4em;
    }

/* ---------- Sekcije ---------- */

.bom-section[b-qobe9a149d] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    padding: var(--space-md);
    border-radius: 0.75em;
    background: var(--color-bg-card);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}

.section-title[b-qobe9a149d] {
    font-family: var(--font-medium) !important;
    font-size: 1em !important;
    color: var(--color-text-dark);
    margin-bottom: 0;
}

.form-grid[b-qobe9a149d] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-sm) var(--space-md);
}

.field[b-qobe9a149d] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.field-wide[b-qobe9a149d] {
    grid-column: span 2;
}

.field-full[b-qobe9a149d] {
    grid-column: 1 / -1;
}

.readonly-value[b-qobe9a149d] {
    padding: 0.375rem 0;
    font-family: var(--font-medium);
}

.hint[b-qobe9a149d] {
    margin: 0;
    color: #6c757d;
    font-family: var(--font-light);
    font-size: 0.9em;
}

/* ---------- Tabele ---------- */

/* Isti razlog kao na stranici: tabela ne smije raširiti modal, skrola u svom okviru. */
.lines-wrapper[b-qobe9a149d] {
    width: 0;
    min-width: 100%;
    overflow-x: auto;
}

.lines-table[b-qobe9a149d],
.orders-table[b-qobe9a149d] {
    margin-bottom: 0;
    font-family: var(--font-light);
    font-size: 0.85em;
    color: var(--color-text-dark);
}

    .lines-table thead th[b-qobe9a149d],
    .orders-table thead th[b-qobe9a149d] {
        background: var(--color-bg-surface);
        font-family: var(--font-medium);
        font-weight: normal;
        white-space: nowrap;
    }

    .lines-table td[b-qobe9a149d],
    .orders-table td[b-qobe9a149d] {
        vertical-align: middle;
    }

.col-quantity[b-qobe9a149d] {
    width: 11em;
}

.col-action[b-qobe9a149d] {
    width: 3em;
    text-align: center;
}

.col-number[b-qobe9a149d] {
    text-align: right;
    white-space: nowrap;
}

.code-cell[b-qobe9a149d] {
    color: #6c757d;
    white-space: nowrap;
}

    .code-cell .missing[b-qobe9a149d] {
        color: var(--color-danger);
    }

.icon-btn[b-qobe9a149d] {
    border: none;
    background: transparent;
    color: var(--color-danger);
    padding: 0.2em 0.4em;
}

.link-button[b-qobe9a149d] {
    align-self: flex-start;
    border: none;
    background: transparent;
    color: var(--color-link);
    font-family: var(--font-light);
    font-size: 0.9em;
    padding: 0;
}

    .link-button i[b-qobe9a149d] {
        margin-right: 0.3em;
    }

    .link-button:hover[b-qobe9a149d] {
        text-decoration: underline;
    }

.row-source td[b-qobe9a149d] {
    background: #f4f8fa;
}

.row-newer td[b-qobe9a149d] {
    background: #eaf3fd;
}

.row-tag[b-qobe9a149d] {
    display: inline-block;
    margin-left: 0.4em;
    padding: 0 0.5em;
    border-radius: 1em;
    font-size: 0.85em;
    white-space: nowrap;
}

.tag-source[b-qobe9a149d] {
    background: var(--color-bg-surface);
    color: var(--color-text-dark);
}

.tag-newer[b-qobe9a149d] {
    background: var(--color-primary);
    color: white;
}

/* ---------- Dugmad ---------- */

.delete-btn[b-qobe9a149d] {
    margin-left: 0 !important;
    margin-right: auto;
}

/* Sporedna radnja — bijelo, da ne liči na „Sačuvaj”. */
.buttons .print-btn[b-qobe9a149d] {
    background: white;
    color: var(--color-text-dark);
    border: 1px solid var(--color-border);
}

.remove-drawing[b-qobe9a149d] {
    width: 100%;
    text-align: center;
    font-family: var(--font-medium);
}

/* Ispod 992px Bootstrap suzi modal-xl na 500px, pa četiri kolone ne stanu. */
@media (max-width: 991.98px) {
    .form-grid[b-qobe9a149d] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .newer-banner[b-qobe9a149d] {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (max-width: 575.98px) {
    .bom-modal[b-qobe9a149d] {
        padding: var(--space-sm);
    }

    .form-grid[b-qobe9a149d] {
        grid-template-columns: minmax(0, 1fr);
    }

    .field-wide[b-qobe9a149d] {
        grid-column: auto;
    }
}
/* _content/ArasWeb/Pages/Bom/BomStatusPill.razor.rz.scp.css */
.status-pill[b-k141cn6031] {
    display: inline-block;
    padding: 0.1em 0.6em;
    border-radius: 1em;
    font-size: 0.9em;
    border: 1px solid transparent;
}

.status-draft[b-k141cn6031] {
    background: #fff4e5;
    border-color: #f0c78a;
    color: #8a5a00;
}

.status-ready[b-k141cn6031] {
    background: #e9f7ee;
    border-color: #9fd8b1;
    color: #1e7a3c;
}

.status-exported[b-k141cn6031] {
    background: var(--color-bg-surface);
    border-color: #b9ccd5;
    color: var(--color-text-dark);
}

.status-changed[b-k141cn6031] {
    background: #fdecec;
    border-color: #efb1af;
    color: #a3322f;
}
/* _content/ArasWeb/Pages/Bom/Sastavnice.razor.rz.scp.css */
#boms[b-fbkro1gmpl] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#boms-container[b-fbkro1gmpl] {
    display: flex;
    flex-direction: column;
    /* Bez razmicanja po visini: s malo redova filteri i tabela ostaju jedni uz druge. */
    justify-content: flex-start;
    gap: var(--space-md);
    width: 100%;
    border-radius: 0.5em;
    background: var(--color-bg-card);
    padding: 1em;
}

/* ---------- Datum presjeka ---------- */

#cutoff-bar[b-fbkro1gmpl] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-sm);
    padding: 0.6em 0.9em;
    border-radius: 0.5em;
    background: var(--color-bg-surface);
    color: var(--color-text-dark);
    font-family: var(--font-light);
    font-size: 0.9em;
}

    #cutoff-bar strong[b-fbkro1gmpl] {
        font-family: var(--font-medium);
        font-weight: normal;
    }

.cutoff-input[b-fbkro1gmpl] {
    width: 11em;
    padding: 0.25em 0.5em;
}

.cutoff-hint[b-fbkro1gmpl] {
    flex-basis: 100%;
    color: #6c757d;
    font-size: 0.9em;
}

.link-button[b-fbkro1gmpl] {
    border: none;
    background: transparent;
    color: var(--color-link);
    font-family: var(--font-light);
    padding: 0;
}

    .link-button:hover[b-fbkro1gmpl] {
        text-decoration: underline;
    }

/* ---------- Statusi ---------- */

#status-tabs[b-fbkro1gmpl] {
    display: flex;
    gap: var(--space-xs);
    flex-wrap: wrap;
}

.status-tab[b-fbkro1gmpl] {
    border: 1px solid var(--color-border);
    background: var(--color-bg-card);
    color: var(--color-text-muted);
    font-family: var(--font-light);
    font-size: 0.85em;
    padding: 0.4em 0.9em;
    border-radius: 2em;
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    white-space: nowrap;
}

    .status-tab:hover[b-fbkro1gmpl] {
        border-color: var(--color-primary);
        color: var(--color-primary);
    }

    .status-tab.active[b-fbkro1gmpl] {
        background: var(--color-primary);
        border-color: var(--color-primary-border);
        color: white;
        font-family: var(--font-medium);
    }

.status-tab-count[b-fbkro1gmpl] {
    background: rgba(0, 0, 0, 0.08);
    border-radius: 1em;
    padding: 0 0.5em;
    font-size: 0.9em;
}

.status-tab.active .status-tab-count[b-fbkro1gmpl] {
    background: rgba(255, 255, 255, 0.25);
}

/* ---------- Filteri ---------- */

#bom-filters[b-fbkro1gmpl] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: var(--space-md);
    font-family: var(--font-light);
    font-size: 0.9em;
}

.filter-box[b-fbkro1gmpl] {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    flex: 0 1 14em;
    min-width: 11em;
}

.filter-search[b-fbkro1gmpl] {
    flex: 1 1 18em;
}

.filter-date[b-fbkro1gmpl] {
    flex: 0 1 12em;
    min-width: 11em;
}

.filter-box label[b-fbkro1gmpl] {
    color: var(--color-text-dark);
}

    .filter-box label i[b-fbkro1gmpl] {
        color: var(--color-icon-accent);
        margin-right: 0.3em;
    }

/* ---------- Tabela ---------- */

/* width 0 + min-width 100%: omotač popuni red, ali širinu tabele ne prenosi roditeljima —
   inače se kroz flex lanac raširi cijela stranica umjesto da tabela skrola u svom okviru. */
.table-wrapper[b-fbkro1gmpl] {
    flex: 1 1 auto;
    min-height: 0;
    align-self: stretch;
    width: 0;
    min-width: 100%;
    overflow-x: auto;
    border: 1px solid var(--color-border);
    border-radius: 0.5em;
}

.bom-table[b-fbkro1gmpl] {
    margin-bottom: 0;
    font-family: var(--font-light);
    font-size: 0.85em;
    color: var(--color-text-dark);
}

    .bom-table thead th[b-fbkro1gmpl] {
        background: var(--color-bg-surface);
        font-family: var(--font-medium);
        font-weight: normal;
        border-bottom: 1px solid var(--color-border);
        white-space: nowrap;
        vertical-align: middle;
    }

    .bom-table td[b-fbkro1gmpl] {
        vertical-align: middle;
    }

    .bom-table tbody tr.clickable[b-fbkro1gmpl] {
        cursor: pointer;
    }

        .bom-table tbody tr.clickable:hover td[b-fbkro1gmpl] {
            background: #f4f8fa;
        }

    .bom-table th.sortable[b-fbkro1gmpl] {
        cursor: pointer;
        user-select: none;
    }

        .bom-table th.sortable:hover[b-fbkro1gmpl] {
            color: var(--color-primary-hover);
        }

    .bom-table th i[b-fbkro1gmpl] {
        margin-left: 0.25em;
        font-size: 0.85em;
    }

    .bom-table th .sort-idle[b-fbkro1gmpl] {
        opacity: 0.35;
    }

.col-number[b-fbkro1gmpl] {
    text-align: right;
    white-space: nowrap;
}

.col-date[b-fbkro1gmpl],
.col-order[b-fbkro1gmpl] {
    white-space: nowrap;
}

.order-date[b-fbkro1gmpl] {
    display: block;
    color: #6c757d;
    font-size: 0.9em;
}

.col-drawing .drawing[b-fbkro1gmpl] {
    display: block;
    font-family: var(--font-medium);
    white-space: nowrap;
}

.kind-tag[b-fbkro1gmpl] {
    display: inline-block;
    margin-top: 0.2em;
    padding: 0 0.5em;
    border-radius: 1em;
    background: var(--color-bg-surface);
    color: #6c757d;
    font-size: 0.85em;
    white-space: nowrap;
}

.material-code[b-fbkro1gmpl] {
    display: block;
    color: #6c757d;
    font-size: 0.9em;
}

    .material-code.missing[b-fbkro1gmpl] {
        color: var(--color-danger);
    }

.scrap-suspicious[b-fbkro1gmpl] {
    color: var(--color-danger);
    font-family: var(--font-medium);
}

.col-status[b-fbkro1gmpl] {
    white-space: nowrap;
}

.newer-badge[b-fbkro1gmpl] {
    display: block;
    margin-top: 0.2em;
    color: var(--color-link);
    font-size: 0.85em;
}

.locked-icon[b-fbkro1gmpl] {
    margin-left: 0.35em;
    color: #6c757d;
    font-size: 0.85em;
}

/* ---------- Izvoz ---------- */

#export-buttons[b-fbkro1gmpl] {
    display: flex;
    gap: var(--space-sm);
}

.export-btn[b-fbkro1gmpl] {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    padding: 0.375rem 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: 0.375rem;
    background: white;
    color: var(--color-text-dark);
    font-family: var(--font-medium);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}

    .export-btn img[b-fbkro1gmpl] {
        width: 1.3em;
        height: 1.3em;
    }

    .export-btn i[b-fbkro1gmpl] {
        font-size: 1.2em;
        color: var(--color-icon-accent);
    }

    .export-btn:disabled[b-fbkro1gmpl] {
        opacity: 0.5;
    }

@media (max-width: 768px) {
    #boms-container[b-fbkro1gmpl] {
        padding: 0.75em;
    }

    .filter-box[b-fbkro1gmpl],
    .filter-search[b-fbkro1gmpl] {
        flex: 1 1 100%;
    }
}
/* _content/ArasWeb/Pages/Control/ControlWorkOrderPreview.razor.rz.scp.css */
#work-order-wrapper[b-epjjtg2k34] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: scroll;
}

#work-order[b-epjjtg2k34] {
    background: white;
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    padding: 2em;
    border-radius: 1em;
}

#work-order_header[b-epjjtg2k34] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: start;
    border-bottom: 0.1em solid lightgray;
    margin-bottom: 1em;
}

    #work-order_header #left[b-epjjtg2k34] {
        width: 75%;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    #work-order_header #title-and-logo[b-epjjtg2k34] {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

        #work-order_header #title-and-logo label[b-epjjtg2k34] {
            font-family: var(--font-bold);
            font-size: 1.5em;
            color: var(--color-text-dark);
            margin-bottom: 1em;
        }

    #work-order_header #left #order-general-info[b-epjjtg2k34] {
        width: 100%;
        display: flex;
        flex-direction: column;
        border: 0.01em solid gray;
        border-radius: 0.5em;
        margin-bottom: 1em;
    }

    #work-order_header #left .info[b-epjjtg2k34] {
        width: 100%;
        flex-direction: column;
        display: flex;
    }

    #work-order_header #left .info[b-epjjtg2k34] {
        width: 20%;
        border-right: 0.01em solid lightgray;
        border-bottom: 0.01em solid lightgray;
        padding: 0.3em;
        height: 100%;
    }

    /* Broj narudžbe i broj crteža su kratki, a vrsta kupca zna biti duga (MAS-42). */
    #work-order_header #left .first-col[b-epjjtg2k34],
    #work-order_header #left .middle-col[b-epjjtg2k34] {
        width: 40%;
    }

    #work-order_header #left #note .info[b-epjjtg2k34] {
        width: 100% !important;
        background: #f1f1f1;
        border-bottom-left-radius: 0.5em;
        border-bottom-right-radius: 0.5em;
    }

        #work-order_header #left #note .info span[b-epjjtg2k34] {
            color: var(--color-danger);
            font-family: var(--font-bold);
        }

    #work-order_header #left .info label[b-epjjtg2k34],
    #work-order #body .group .info label[b-epjjtg2k34] {
        font-family: var(--font-light);
        font-size: 0.95em;
    }

    #work-order #body .group .info span[b-epjjtg2k34] {
        word-break: break-all;
    }

    /* Naziv se prelama na razmaku, a riječ siječe samo ako sama ne stane. */
    #work-order_header #left .info span[b-epjjtg2k34] {
        overflow-wrap: break-word;
    }

    #work-order_header #left .group[b-epjjtg2k34] {
        display: flex;
        width: 100%;
        justify-content: space-between;
        align-items: center;
        font-size: 1.05em;
    }

    #work-order_header #right[b-epjjtg2k34] {
        display: flex;
        flex-direction: column;
        align-items: end;
        justify-content: start;
        width: 25%;
    }

        #work-order_header #right #qr-img[b-epjjtg2k34] {
            width: 12em;
        }

        #work-order_header #right #logo[b-epjjtg2k34] {
            width: 11em;
        }

#work-order #body[b-epjjtg2k34] {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

    #work-order #body .body-col[b-epjjtg2k34] {
        width: 49%;
        display: flex;
        height: auto;
        flex-direction: column;
    }

    #work-order #body .group[b-epjjtg2k34] {
        border-radius: 0.5em;
        border: 0.01em solid gray;
    }

        #work-order #body .group .info[b-epjjtg2k34] {
            width: 100%;
            display: flex;
            justify-content: space-between;
            border-bottom: 0.01em solid lightgrey;
        }

            #work-order #body .group .info label[b-epjjtg2k34],
            #work-order #body .group .info span[b-epjjtg2k34] {
                width: 50%;
                padding: 0.3em 0.5em;
            }

            #work-order #body .group .info span[b-epjjtg2k34] {
                text-align: right;
                align-items: center;
                border-left: 0.01em solid lightgray;
            }

        #work-order #body .group #rezanje span[b-epjjtg2k34] {
            border-left: 0 !important;
        }

.has-surface-treatment label[b-epjjtg2k34], .has-surface-treatment span[b-epjjtg2k34] {
    font-family: var(--font-bold) !important;
    font-size: 1.2em !important;
}

.tbl-box[b-epjjtg2k34] {
    width: 100%;
    display: flex;
    flex-direction: column;
    background: #f1f1f1;
    border-radius: .5em;
    padding: 0.5em;
    margin-top: 0.8em;
    page-break-inside: avoid;
    border: 0.1em solid gray;
}

.tbl-name[b-epjjtg2k34] {
    margin: 0.5em 0;
    font-size: 0.9em;
    font-family: var(--font-bold);
}

.tbl-box .tbl-box-list[b-epjjtg2k34] {
    display: flex;
    flex-direction: column;
    width: 100%;
    font-size: 0.9em;
    border: 0.05em solid lightgrey;
    border-radius: .3em;
    background: white;
}

.tbl-box-list-header[b-epjjtg2k34],
.tbl-box-list-item[b-epjjtg2k34] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    border-bottom: 0.05em solid lightgrey;
}

    .tbl-box-list-header label[b-epjjtg2k34] {
        font-family: var(--font-medium);
    }

    .tbl-box-list-item label[b-epjjtg2k34] {
        font-family: var(--font-light);
    }

    .tbl-box-list-header label[b-epjjtg2k34],
    .tbl-box-list-item label[b-epjjtg2k34] {
        width: 30%;
        word-break: break-all;
        padding: 0.5em 0.8em;
        border-right: 0.1em solid lightgray;
    }

.ostale-obrade label[b-epjjtg2k34] {
    width: 50%;
}

.dorezivanje-table .tbl-box-list-item label[b-epjjtg2k34] {
    width: 100%;
}

.ensats-table .tbl-box-list-item label[b-epjjtg2k34] {
    width: 80%;
}

.ensats-table .tbl-box-list-item .label-bolded[b-epjjtg2k34] {
    width: 20%;
    font-family: var(--font-bold);
}

.img-container[b-epjjtg2k34] {
    display: flex;
    width: 100%;
    flex-direction: column;
    margin-bottom: .8em;
    border: 0.1em solid gray;
    border-radius: 0.5em;
}

    .img-container img[b-epjjtg2k34] {
        width: 100%;
        border-radius: 0.5em;
    }


    .img-container label[b-epjjtg2k34] {
        background: #f1f1f1;
        width: 100%;
        padding: 0.3em 0.5em;
        border-top-right-radius: .5em;
        border-top-left-radius: .5em;
        font-size: 0.9em;
        font-family: var(--font-bold);
        margin-bottom: 0.5em;
    }

    .img-container p[b-epjjtg2k34] {
        color: gray;
        width: 100%;
        text-align: center;
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 90%;
    }


#alati-img[b-epjjtg2k34] {
    height: 100%;
    min-height: 30em;
}

    #alati-img img[b-epjjtg2k34] {
        height: 100%;
    }

#footer[b-epjjtg2k34] {
    width: 100%;
    display: flex;
    border-top: 0.01em solid lightgray;
    margin-top: .8em;
    padding-top: .5em;
    justify-content: end;
}

    #footer .info[b-epjjtg2k34] {
        width: auto;
        display: flex;
        flex-direction: column;
        margin-right: 2em;
    }

        #footer .info label[b-epjjtg2k34] {
            font-family: var(--font-light);
            font-size: 0.9em;
        }

#work-order-buttons[b-epjjtg2k34] {
    width: 100%;
    display: flex;
    justify-content: end;
    padding: 1em;
}

    #work-order-buttons button[b-epjjtg2k34] {
        margin-left: 1em;
    }

        #work-order-buttons button i[b-epjjtg2k34] {
            margin-right: 0.5em;
        }

#generate-pdf[b-epjjtg2k34],
#preview-pdf[b-epjjtg2k34] {
    background: lightgrey;
    border: 0.05em solid grey;
    color: black;
}

    #generate-pdf img[b-epjjtg2k34],
    #preview-pdf img[b-epjjtg2k34] {
        width: 1.5em;
        height: 1.5em;
        margin-right: 0.5em;
    }

#generate-excel[b-epjjtg2k34] {
    background: white;
    color: #3d783d;
    font-family: var(--font-medium);
    border: 0.1em solid #5cb85c;
}

    #generate-excel img[b-epjjtg2k34] {
        width: 1.5em;
        height: 1.5em;
        margin-right: 0.5em;
    }

#edit-btn[b-epjjtg2k34] {
    margin-right: auto;
}

/*
    MODAL ZA IZMJENU STATUSA
*/
#change-order-article-status[b-epjjtg2k34] {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

    #change-order-article-status #note[b-epjjtg2k34] {
        width: 70%;
    }

    #change-order-article-status p[b-epjjtg2k34] {
        font-size: 1.5em;
        font-family: var(--font-medium);
        margin-bottom: 2em;
        color: var(--ar-primary);
        width: 80%;
        text-align: center;
    }

    #change-order-article-status span[b-epjjtg2k34] {
        font-size: 0.8em;
        font-family: var(--font-italic);
    }

    #change-order-article-status label[b-epjjtg2k34] {
        margin-bottom: 0.5em;
    }
/* _content/ArasWeb/Pages/Control/EksternaKalibracija.razor.rz.scp.css */
#eksterna-kalibracija-page[b-dqzemkemts] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#content-container[b-dqzemkemts] {
    width: 100%;
    height: 92%;
    overflow-y: auto;
    background: white;
    border-radius: 1em;
    padding: 1em;
}

.actions-cell[b-dqzemkemts] {
    vertical-align: middle;
}

.actions[b-dqzemkemts] {
    display: flex;
    align-items: center;
    gap: 1em;
}

.actions i[b-dqzemkemts] {
    cursor: pointer;
    color: var(--color-primary);
    display: inline-flex;
    align-items: center;
}

.actions i:hover[b-dqzemkemts] {
    opacity: 0.7;
}

tr.calibration-warning[b-dqzemkemts] {
    background: var(--calibration-warning-bg);
}

tr.calibration-expired[b-dqzemkemts] {
    background: var(--calibration-expired-bg);
}

.modal-input-box[b-dqzemkemts] {
    margin-bottom: 0.5em;
}

.certificate-download-btn[b-dqzemkemts] {
    flex-shrink: 0;
    font-size: 0.75em;
    padding: 0.2em 0.5em;
}
/* _content/ArasWeb/Pages/Control/InspekcijaPrvogKomada.razor.rz.scp.css */
#first-article[b-yztmvgd73l] {
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

#first-article-container[b-yztmvgd73l] {
    width: 100%;
    height: auto;
    min-height: 90%;
    background: var(--color-bg-card);
    border-radius: 1em;
    padding: 1em;
}

.header-row h3[b-yztmvgd73l] {
    font-family: var(--font-medium);
    color: var(--color-text-dark);
    font-size: 1.15em;
    margin: 0;
}

.description[b-yztmvgd73l] {
    font-family: var(--font-light);
    color: var(--color-text-muted);
    font-size: 0.88em;
    margin: 0.4em 0 var(--space-md) 0;
    max-width: 60em;
}

#first-article-list[b-yztmvgd73l] {
    width: 100%;
}

/* Širine kolona; struktura liste dolazi iz site.css. */
.work-order[b-yztmvgd73l] {
    width: 11%;
    font-family: var(--font-medium);
}

.order-no[b-yztmvgd73l], .drawing[b-yztmvgd73l] {
    width: 15%;
    word-break: break-all;
}

.buyer[b-yztmvgd73l] {
    width: 17%;
    word-break: break-word;
}

.qty[b-yztmvgd73l] {
    width: 9%;
    text-align: center;
}

.state[b-yztmvgd73l] {
    width: 20%;
    display: flex;
    flex-direction: column;
    gap: 0.2em;
}

.due-date-box[b-yztmvgd73l] {
    width: 13%;
}

.state-badge[b-yztmvgd73l] {
    display: inline-block;
    width: fit-content;
    padding: 0.15em 0.6em;
    border-radius: 1em;
    font-family: var(--font-medium);
    font-size: 0.82em;
    white-space: nowrap;
}

.state-detail[b-yztmvgd73l] {
    font-family: var(--font-light);
    color: var(--color-text-muted);
    font-size: 0.8em;
}

.state-progress[b-yztmvgd73l] {
    background: var(--color-bg-surface);
    color: var(--color-text-dark);
}

.state-waiting[b-yztmvgd73l] {
    background: #fff3cd;
    color: #664d03;
}

.state-problem[b-yztmvgd73l] {
    background: #f8d7da;
    color: #842029;
}

.state-done[b-yztmvgd73l] {
    background: #d1e7dd;
    color: #0f5132;
}

.state-locked[b-yztmvgd73l] {
    background: var(--color-bg-header);
    color: var(--color-text-dark);
}

#first-article-record[b-yztmvgd73l] {
    display: flex;
    flex-direction: column;
    /* custom-modal-body poravnava na početak, pa bi se redovi skupili na širinu sadržaja. */
    align-items: stretch;
    gap: var(--space-md);
    padding: var(--space-md) var(--space-lg);
}

    #first-article-record fieldset[b-yztmvgd73l] {
        display: flex;
        flex-direction: column;
        gap: var(--space-md);
        border: 0;
        margin: 0;
        padding: 0;
        min-width: 0;
    }

.record-summary[b-yztmvgd73l] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-md);
    background: var(--color-bg-main);
    border-radius: var(--space-sm);
    padding: var(--space-md);
}

    .record-summary label[b-yztmvgd73l] {
        display: block;
        font-family: var(--font-medium);
        color: var(--color-text-dark);
        word-break: break-word;
    }

    .record-summary span[b-yztmvgd73l],
    .record-signatures span[b-yztmvgd73l] {
        font-family: var(--font-light);
        color: var(--color-text-muted);
        font-size: 0.82em;
    }

.record-parts[b-yztmvgd73l] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-md);
}

.record-part[b-yztmvgd73l] {
    display: flex;
    flex-direction: column;
    gap: 0.25em;
    border: 1px solid var(--color-border);
    border-radius: var(--space-sm);
    padding: 0.7em var(--space-md);
    color: var(--color-text-dark);
}

    .record-part.locked[b-yztmvgd73l] {
        background: var(--color-bg-main);
        border-style: dashed;
    }

    .record-part strong[b-yztmvgd73l] {
        font-family: var(--font-medium);
    }

    .record-part span[b-yztmvgd73l] {
        font-family: var(--font-light);
        font-size: 0.9em;
    }

    .record-part .state-badge[b-yztmvgd73l] {
        font-family: var(--font-medium);
        font-size: 0.82em;
    }

.record-alert[b-yztmvgd73l] {
    margin: 0;
    font-size: 0.9em;
}

.record-grid[b-yztmvgd73l] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-md);
}

.record-field label[b-yztmvgd73l] {
    display: block;
    font-family: var(--font-light);
    color: var(--color-text-muted);
    font-size: 0.88em;
    margin-bottom: 0.25em;
}

.record-field textarea.form-control[b-yztmvgd73l] {
    resize: none;
    overflow-y: auto;
}

.yes-no[b-yztmvgd73l] {
    display: flex;
    gap: var(--space-sm);
}

    .yes-no .btn[b-yztmvgd73l] {
        min-width: 5em;
    }

.record-signatures[b-yztmvgd73l] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-md);
    border-top: 1px solid var(--color-border);
    padding-top: var(--space-md);
}

    .record-signatures label[b-yztmvgd73l] {
        display: block;
        font-family: var(--font-medium);
        color: var(--color-text-dark);
        font-size: 0.92em;
    }

.record-actions[b-yztmvgd73l] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
}

.record-confirm[b-yztmvgd73l] {
    background: var(--color-bg-surface);
    border-radius: var(--space-sm);
    padding: 0.7em var(--space-md);
    font-family: var(--font-medium);
    color: var(--color-text-dark);
}

/* Na telefonu sedam kolona ne stane: red postaje kartica u dvije kolone. */
@media (max-width: 768px) {
    #first-article-list .list-header[b-yztmvgd73l] {
        display: none !important;
    }

    #first-article-list .list-item[b-yztmvgd73l] {
        flex-direction: column;
        align-items: stretch;
        gap: var(--space-sm);
    }

        #first-article-list .list-item > span[b-yztmvgd73l] {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 0.4em var(--space-md);
            width: 100%;
        }

        #first-article-list .list-item label[b-yztmvgd73l] {
            width: auto;
            text-align: left;
        }

        #first-article-list .list-item button[b-yztmvgd73l] {
            width: 100%;
        }
}

@media (max-width: 768px) {
    .record-summary[b-yztmvgd73l],
    .record-parts[b-yztmvgd73l],
    .record-grid[b-yztmvgd73l],
    .record-signatures[b-yztmvgd73l] {
        grid-template-columns: 1fr;
    }

    #first-article-record[b-yztmvgd73l] {
        padding: var(--space-md);
    }
}
/* _content/ArasWeb/Pages/Control/InternaKalibracija.razor.rz.scp.css */
#interna-kalibracija-page[b-xau2dpsj7v] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#content-container[b-xau2dpsj7v] {
    width: 100%;
    height: 92%;
    overflow-y: auto;
    background: white;
    border-radius: 1em;
    padding: 1em;
}

.actions-cell[b-xau2dpsj7v] {
    vertical-align: middle;
}

.actions[b-xau2dpsj7v] {
    display: flex;
    align-items: center;
    gap: 1em;
}

.actions i[b-xau2dpsj7v] {
    cursor: pointer;
    color: var(--color-primary);
    display: inline-flex;
    align-items: center;
}

.actions i:hover[b-xau2dpsj7v] {
    opacity: 0.7;
}

tr.calibration-warning[b-xau2dpsj7v] {
    background: var(--calibration-warning-bg);
}

tr.calibration-expired[b-xau2dpsj7v] {
    background: var(--calibration-expired-bg);
}

.modal-input-box[b-xau2dpsj7v] {
    margin-bottom: 0.5em;
}

.decimal-separator-warning[b-xau2dpsj7v] {
    display: flex;
    align-items: center;
    gap: 0.6em;
    margin-bottom: 1em;
    font-family: 'Ubuntu-Medium';
    font-size: 0.95em;
    border-left: 0.3em solid #ffc107;
}

.decimal-separator-warning i[b-xau2dpsj7v] {
    font-size: 1.3em;
    color: #b8860b;
}

.protocol-hint[b-xau2dpsj7v] {
    margin: 0;
    font-size: 0.8em;
    color: #6c757d;
}

.protocol-download-btn[b-xau2dpsj7v] {
    font-size: 0.75em;
    padding: 0.2em 0.5em;
}
/* _content/ArasWeb/Pages/Control/ToleranceOblika.razor.rz.scp.css */
#gdt-page[b-bgq596sq14] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#content-container[b-bgq596sq14] {
    width: 100%;
    flex: 1;
    display: flex;
    flex-direction: column;
    background: white;
    border-radius: 1em;
    padding: 1em;
    min-height: 0;
}

.page-hint[b-bgq596sq14] {
    color: #6c757d;
    font-size: 0.85em;
    margin-bottom: 0.75em;
}

.list-wrapper[b-bgq596sq14] {
    flex: 1;
    overflow: auto;
    min-height: 0;
}

.item-details[b-bgq596sq14] {
    width: 90%;
}

.list .item-details label[b-bgq596sq14] {
    font-size: 0.9em;
    text-align: left;
}

.symbol-cell[b-bgq596sq14] {
    font-size: 1.6em;
    color: #14425a;
}

.list-item.inactive[b-bgq596sq14] {
    opacity: 0.55;
}

.show-inactive[b-bgq596sq14] {
    display: flex;
    align-items: center;
    gap: 0.4em;
    white-space: nowrap;
    color: #14425a;
}

.symbol-group[b-bgq596sq14] {
    color: var(--ar-text-muted);
    font-size: var(--ar-fs-sm);
    margin: var(--ar-space-2) 0 var(--ar-space-1);
}

.symbol-picker[b-bgq596sq14] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--ar-space-2);
    margin-bottom: var(--ar-space-1);
}

.symbol-option[b-bgq596sq14] {
    display: flex;
    align-items: center;
    gap: var(--ar-space-2);
    min-height: 2.5rem;
    padding: var(--ar-space-1) var(--ar-space-3);
    border: 1px solid var(--ar-border-strong);
    border-radius: var(--ar-radius-sm);
    background: var(--ar-bg-surface);
    color: var(--ar-text);
    font-size: var(--ar-fs-md);
    font-weight: var(--ar-fw-regular);
}

    .symbol-option:hover[b-bgq596sq14] {
        border-color: var(--ar-navy-400);
        background: var(--ar-bg-hover);
    }

    .symbol-option .gdt-symbol[b-bgq596sq14] {
        font-size: 1.3em;
        min-width: 1.2em;
        text-align: center;
    }

.symbol-option.selected[b-bgq596sq14] {
    border-color: var(--ar-primary);
    background: var(--ar-primary-soft);
    box-shadow: 0 0 0 1px var(--ar-primary);
}

.active-toggle[b-bgq596sq14] {
    display: flex;
    align-items: center;
    gap: 0.5em;
}

.symbol-hint[b-bgq596sq14] {
    color: var(--ar-text-muted);
    font-size: var(--ar-fs-sm);
    margin-bottom: var(--ar-space-2);
}
/* _content/ArasWeb/Pages/Cooperants/Cooperants.razor.rz.scp.css */
#tab-container[b-iu9qompwmt] {
    width: 100%;
    height: 92%;
    display: flex;
    flex-direction: column;
    background: white;
    border-radius: 1em;
    padding: 1em;
}

.list-wrapper[b-iu9qompwmt] {
    height: 95%;
}

.item-details[b-iu9qompwmt] {
    width: 90%;
}

.list .item-details label[b-iu9qompwmt] {
    font-size: 0.9em;
    text-align: left;
}

.item-details .contact[b-iu9qompwmt] {
    width: 50%;
}

.item-details .contact span[b-iu9qompwmt] {
    justify-content: start;
}

.optional-param[b-iu9qompwmt] {
    font-size: 0.8em;
    font-family: var(--font-italic);
    margin-left: 0.5em;
}

[b-iu9qompwmt] .validation-errors {
    width: 100%;
    background: rgba(220, 76, 100, 0.1);
    padding: 1em;
    border-radius: .8em;
    border: 0.01em solid #DC4C64;
    list-style-type: none;
}

[b-iu9qompwmt] .validation-message{
    font-family: var(--font-regular);
    font-size: 0.9em;
}

.supply-types[b-iu9qompwmt] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4em 1.4em;
    padding: 0.4em 0.2em;
}

.supply-type[b-iu9qompwmt] {
    display: flex;
    align-items: center;
    gap: 0.4em;
    cursor: pointer;
    margin: 0;
}

.supply-type input[b-iu9qompwmt] {
    width: 1.1em;
    height: 1.1em;
    cursor: pointer;
    margin: 0;
}

/* Celija u listi je <label> kao i ostale kolone, pa mora sama slagati oznake u red. */
.list .item-details .supply-types-cell[b-iu9qompwmt] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3em;
}

.supply-type-badge[b-iu9qompwmt] {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    height: 1.625rem;
    background: var(--ar-navy-100);
    color: var(--ar-text);
    border-radius: var(--ar-radius-pill);
    padding: 0 .75rem;
    font-size: var(--ar-fs-sm);
    white-space: nowrap;
}

/* InputText renders a child component, so its input carries no scope attribute - without
   ::deep the rule is silently dropped, same as with .validation-message below. */
[b-iu9qompwmt] .supply-note {
    margin-top: 0.4em;
}

.supply-note-text[b-iu9qompwmt] {
    font-family: var(--font-italic);
    opacity: 0.75;
}
/* _content/ArasWeb/Pages/Dashboard/DashboardOverview.razor.rz.scp.css */
.overview[b-pijn4a9a2h] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    --due-warning: #d97706;
}

/* ── Section Card ── */
.section-card[b-pijn4a9a2h] {
    background: var(--color-bg-card);
    border-radius: 1em;
    overflow: hidden;
}

.section-header[b-pijn4a9a2h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    font-family: var(--font-medium);
    font-size: 13px;
    color: var(--color-text-dark);
    border-bottom: 1px solid var(--color-border-light);
}

.section-header i[b-pijn4a9a2h] { margin-right: 6px; color: var(--color-icon-accent); }
.section-badge[b-pijn4a9a2h] { font-size: 11px; font-family: var(--font-regular); color: var(--color-text-muted); }
.section-body[b-pijn4a9a2h] { padding: 12px 16px; }
.chart-body[b-pijn4a9a2h] { padding: 8px 12px; }

/* ── Two Column ── */
.two-col[b-pijn4a9a2h] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    align-items: stretch;
}

.two-col > .section-card[b-pijn4a9a2h] {
    display: flex;
    flex-direction: column;
}

.two-col > .section-card > .section-body[b-pijn4a9a2h] {
    flex: 1;
    overflow-y: auto;
    max-height: 380px;
}

/* ── Totals Grid: 5 per row ── */
.totals-grid[b-pijn4a9a2h] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 10px;
    padding: 16px;
}

.total-card[b-pijn4a9a2h] {
    text-align: center;
    padding: 14px 6px;
    border-radius: 0.5em;
    background: var(--color-bg-main);
}

.total-icon[b-pijn4a9a2h] {
    width: 36px;
    height: 36px;
    border-radius: 0.5em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    margin-bottom: 8px;
    background: color-mix(in srgb, var(--tc) 12%, transparent);
    color: var(--tc);
}

.total-number[b-pijn4a9a2h] {
    font-family: var(--font-bold);
    font-size: 22px;
    color: var(--color-text-dark);
    line-height: 1.1;
}

.total-label[b-pijn4a9a2h] {
    font-size: 10px;
    color: var(--color-text-muted);
    margin-top: 3px;
}

/* ── Kalibracije: isti jezik boja kao total-icon (--tc) ── */
.calibration-due[b-pijn4a9a2h] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 12px 16px;
}

.calibration-due-item[b-pijn4a9a2h] {
    flex: 1 1 280px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px 12px;
    border-radius: 0.5em;
    background: var(--color-bg-main);
    color: var(--color-text-dark);
    text-decoration: none;
}

.calibration-due-item:hover[b-pijn4a9a2h] {
    color: var(--color-text-dark);
    opacity: 0.85;
}

.calibration-due-name[b-pijn4a9a2h] {
    font-family: var(--font-medium);
    font-size: 13px;
    margin-right: auto;
}

.due-pill[b-pijn4a9a2h] {
    font-family: var(--font-medium);
    font-size: 12px;
    padding: 2px 10px;
    border-radius: 2em;
    background: color-mix(in srgb, var(--tc) 14%, transparent);
    color: var(--tc);
    white-space: nowrap;
}

.due-ok[b-pijn4a9a2h] {
    font-size: 12px;
    color: var(--color-text-muted);
}

.due-arrow[b-pijn4a9a2h] {
    font-size: 11px;
    color: var(--color-text-muted);
}

/* ── Gauge Strip ── */
.gauge-strip[b-pijn4a9a2h] {
    display: flex;
    justify-content: center;
    gap: 20px;
    padding: 20px 16px;
}

.gauge-card[b-pijn4a9a2h] {
    text-align: center;
    flex: 1;
    max-width: 150px;
}

.gauge-ring-wrap[b-pijn4a9a2h] {
    position: relative;
    width: 90px;
    height: 90px;
    margin: 0 auto 6px;
}

.gauge-svg[b-pijn4a9a2h] { width: 100%; height: 100%; }

.gauge-center[b-pijn4a9a2h] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gauge-pct[b-pijn4a9a2h] {
    font-family: var(--font-bold);
    font-size: 16px;
    color: var(--color-text-dark);
}

.gauge-label[b-pijn4a9a2h] {
    font-family: var(--font-medium);
    font-size: 10px;
    color: var(--color-text-dark);
    margin-bottom: 3px;
}

.gauge-amounts[b-pijn4a9a2h] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    font-size: 10px;
    color: var(--color-text-muted);
}

.gauge-amounts small[b-pijn4a9a2h] { font-size: 9px; margin-left: 2px; }

/* ── Revenue Table ── */
.revenue-table[b-pijn4a9a2h] {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}

.revenue-table th[b-pijn4a9a2h] {
    text-align: left;
    padding: 7px 10px;
    font-family: var(--font-medium);
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    color: var(--color-text-muted);
    border-bottom: 2px solid var(--color-border-light);
}

.revenue-table td[b-pijn4a9a2h] {
    padding: 8px 10px;
    border-bottom: 1px solid var(--color-border-light);
    color: var(--color-text-dark);
}

.revenue-table tr:last-child td[b-pijn4a9a2h] { border-bottom: none; }

.rv-name[b-pijn4a9a2h] { font-family: var(--font-medium); }

.rv-progress[b-pijn4a9a2h] { display: flex; align-items: center; gap: 6px; }

.rv-pct-bar[b-pijn4a9a2h] {
    flex: 1;
    height: 6px;
    background: var(--color-bg-surface);
    border-radius: 3px;
    overflow: hidden;
    min-width: 50px;
}

.rv-pct-fill[b-pijn4a9a2h] {
    height: 100%;
    border-radius: 3px;
    transition: width 0.3s ease;
}

.rv-pct-text[b-pijn4a9a2h] { font-family: var(--font-medium); font-size: 11px; min-width: 32px; text-align: right; }
.rv-sub[b-pijn4a9a2h] { font-size: 9px; color: var(--color-text-muted); }

/* ── Empty State (inline) ── */
.empty-state[b-pijn4a9a2h] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 32px 16px;
    color: var(--color-text-muted);
    font-size: 13px;
}

.empty-state i[b-pijn4a9a2h] { font-size: 24px; opacity: 0.4; }

/* ── Empty State (full page / API error / no data) ── */
.empty-state-full[b-pijn4a9a2h] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 48px 24px;
    color: var(--color-text-muted);
}

.empty-state-full > i[b-pijn4a9a2h] {
    font-size: 40px;
    opacity: 0.3;
    margin-bottom: 16px;
}

.empty-state-full h4[b-pijn4a9a2h] {
    font-family: var(--font-medium);
    font-size: 18px;
    color: var(--color-text-dark);
    margin: 0 0 8px;
}

.empty-state-full p[b-pijn4a9a2h] {
    font-size: 13px;
    max-width: 420px;
    line-height: 1.5;
    margin: 0 0 20px;
}

.empty-state-full .btn[b-pijn4a9a2h] {
    font-family: var(--font-medium);
}

.empty-steps[b-pijn4a9a2h] {
    display: flex;
    gap: 16px;
    margin-top: 8px;
}

.empty-step[b-pijn4a9a2h] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--color-text-dark);
    padding: 8px 14px;
    background: var(--color-bg-main);
    border-radius: 0.4em;
}

.step-num[b-pijn4a9a2h] {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--color-primary);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-medium);
    font-size: 11px;
    flex-shrink: 0;
}

/* ── Responsive ── */
@media (max-width: 1200px) {
    .totals-grid[b-pijn4a9a2h] { grid-template-columns: repeat(3, 1fr); }
    .two-col[b-pijn4a9a2h] { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
    .totals-grid[b-pijn4a9a2h] { grid-template-columns: repeat(2, 1fr); }
    .gauge-strip[b-pijn4a9a2h] { flex-wrap: wrap; }
    /* Kiosk na telefonu nema smisla */
    .kiosk-btn[title^="Kiosk mod"][b-pijn4a9a2h] { display: none; }
}

.table-scroll[b-pijn4a9a2h] {
    overflow-x: auto;
}

.table-scroll th[b-pijn4a9a2h],
.table-scroll td[b-pijn4a9a2h] {
    white-space: nowrap;
}

/* ── Toolbar: izgled prati modul Održavanje (pill tabovi, blage ivice) ── */
.ov-toolbar[b-pijn4a9a2h] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 16px 18px;
    background: var(--color-bg-card);
    border-radius: 1em;
}

.ov-toolbar-top[b-pijn4a9a2h] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}

.ov-heading[b-pijn4a9a2h] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.ov-toolbar-title[b-pijn4a9a2h] {
    font-family: var(--font-medium);
    font-size: 20px;
    line-height: 1.2;
    color: var(--color-text-dark);
}

.ov-subtitle[b-pijn4a9a2h] {
    font-size: 13px;
    color: var(--color-text-muted);
}

.ov-toolbar-actions[b-pijn4a9a2h] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.kiosk-btn[b-pijn4a9a2h] {
    width: 34px;
    height: 34px;
    border: 1px solid var(--color-bg-surface);
    border-radius: 50%;
    background: var(--color-bg-card);
    color: var(--color-icon-accent);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    transition: background 0.15s, color 0.15s;
}

.kiosk-btn:hover[b-pijn4a9a2h] {
    background: var(--color-bg-surface);
    color: var(--color-text-dark);
}

.kiosk-btn:disabled[b-pijn4a9a2h] {
    opacity: 0.35;
    cursor: default;
    background: transparent;
}

.ov-filters[b-pijn4a9a2h] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    padding-top: 14px;
    border-top: 1px solid var(--color-bg-surface);
}

.sub-tabs[b-pijn4a9a2h] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.sub-tab[b-pijn4a9a2h] {
    border: 1px solid var(--color-bg-surface);
    background: var(--color-bg-card);
    color: var(--color-text-muted);
    border-radius: 2em;
    padding: 0.4em 1.1em;
    font-size: 13px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.sub-tab:hover[b-pijn4a9a2h] {
    color: var(--color-text-dark);
}

.sub-tab.active[b-pijn4a9a2h] {
    background: var(--color-bg-surface);
    color: var(--color-text-dark);
    font-family: var(--font-medium);
}

.ov-filters-right[b-pijn4a9a2h] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.period-nav[b-pijn4a9a2h] {
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 2px;
    border: 1px solid var(--color-bg-surface);
    border-radius: 2em;
}

.period-nav .kiosk-btn[b-pijn4a9a2h] {
    width: 30px;
    height: 30px;
    border: none;
    background: transparent;
}

.period-nav .kiosk-btn:hover:not(:disabled)[b-pijn4a9a2h] {
    background: var(--color-bg-surface);
}

.period-label[b-pijn4a9a2h] {
    min-width: 130px;
    text-align: center;
    font-family: var(--font-medium);
    font-size: 13px;
    color: var(--color-text-dark);
}

.buyer-filter[b-pijn4a9a2h] {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 36px;
    padding-left: 14px;
    border: 1px solid var(--color-bg-surface);
    border-radius: 2em;
    background: var(--color-bg-card);
}

.buyer-filter i[b-pijn4a9a2h] {
    color: var(--color-icon-accent);
    font-size: 13px;
}

.buyer-select[b-pijn4a9a2h] {
    width: auto;
    max-width: 220px;
    height: 100%;
    padding: 0 32px 0 0;
    border: none;
    border-radius: 2em;
    background-color: transparent;
    color: var(--color-text-dark);
    font-size: 13px;
    box-shadow: none;
    cursor: pointer;
}

.buyer-select:focus[b-pijn4a9a2h] {
    box-shadow: none;
}

.dark-mode .buyer-select option[b-pijn4a9a2h] {
    background: var(--color-bg-card);
    color: var(--color-text-dark);
}

/* ── Dark Mode ── */
.dark-mode[b-pijn4a9a2h] {
    --color-bg-main: #0f172a;
    --color-bg-card: #1e293b;
    --color-bg-surface: #334155;
    --color-text-dark: #f1f5f9;
    --color-text-muted: #94a3b8;
    --color-text-light: #cbd5e1;
    --color-border: #475569;
    --color-border-light: #334155;
    --color-primary: #60a5fa;
    --color-success: #4ade80;
    --color-danger: #f87171;
    --due-warning: #fbbf24;
}

.dark-mode .section-card[b-pijn4a9a2h],
.dark-mode .ov-toolbar[b-pijn4a9a2h] {
    background: var(--color-bg-card);
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}

.dark-mode .section-header[b-pijn4a9a2h] {
    border-color: var(--color-border);
    color: var(--color-text-dark);
}

.dark-mode .total-card[b-pijn4a9a2h] {
    background: var(--color-bg-surface);
}

.dark-mode .total-number[b-pijn4a9a2h] {
    color: var(--color-text-dark);
}

.dark-mode .total-label[b-pijn4a9a2h] {
    color: var(--color-text-muted);
}

.dark-mode .kiosk-btn[b-pijn4a9a2h] {
    color: #94a3b8;
}

.dark-mode .kiosk-btn:hover:not(:disabled)[b-pijn4a9a2h] {
    color: #f1f5f9;
}

.dark-mode .gauge-label[b-pijn4a9a2h],
.dark-mode .gauge-amounts[b-pijn4a9a2h] {
    color: var(--color-text-muted);
}

.dark-mode .gauge-pct[b-pijn4a9a2h] {
    color: var(--color-text-dark);
}

.dark-mode .buyer-table th[b-pijn4a9a2h] {
    background: var(--color-bg-surface);
    color: var(--color-text-muted);
    border-color: var(--color-border);
}

.dark-mode .buyer-table td[b-pijn4a9a2h] {
    border-color: var(--color-border);
    color: var(--color-text-dark);
}

.dark-mode .empty-state[b-pijn4a9a2h] {
    color: var(--color-text-muted);
}

.dark-mode .empty-state-full[b-pijn4a9a2h] {
    color: var(--color-text-muted);
}

.dark-mode .empty-state-full h4[b-pijn4a9a2h] {
    color: var(--color-text-dark);
}

/* Text overrides for dark mode */
.dark-mode .ov-toolbar-title[b-pijn4a9a2h] {
    color: #f1f5f9;
}

.dark-mode .section-badge[b-pijn4a9a2h] {
    color: #64748b;
}

.dark-mode .section-header i[b-pijn4a9a2h] {
    color: #60a5fa;
}

.dark-mode .total-icon[b-pijn4a9a2h] {
    opacity: 0.9;
}

.dark-mode .gauge-card[b-pijn4a9a2h] {
    background: transparent;
    border-color: transparent;
}

.dark-mode .gauge-center[b-pijn4a9a2h] {
    color: #f1f5f9;
}

.dark-mode .gauge-amounts small[b-pijn4a9a2h] {
    color: #64748b;
}

.dark-mode .buyer-table tr:hover td[b-pijn4a9a2h] {
    background: var(--color-bg-surface);
}

.dark-mode .empty-steps[b-pijn4a9a2h] {
    color: #94a3b8;
}

.dark-mode .step-num[b-pijn4a9a2h] {
    background: #334155;
    color: #60a5fa;
}

/* ApexCharts dark mode — force light text on all SVG elements */
.dark-mode[b-pijn4a9a2h]  .apexcharts-text,
.dark-mode[b-pijn4a9a2h]  .apexcharts-xaxis-label,
.dark-mode[b-pijn4a9a2h]  .apexcharts-yaxis-label,
.dark-mode[b-pijn4a9a2h]  .apexcharts-datalabel,
.dark-mode[b-pijn4a9a2h]  .apexcharts-datalabel-label,
.dark-mode[b-pijn4a9a2h]  .apexcharts-datalabel-value,
.dark-mode[b-pijn4a9a2h]  .apexcharts-legend-text,
.dark-mode[b-pijn4a9a2h]  .apexcharts-tooltip-text,
.dark-mode[b-pijn4a9a2h]  .apexcharts-title-text {
    fill: #e2e8f0 !important;
    color: #e2e8f0 !important;
}

.dark-mode[b-pijn4a9a2h]  .apexcharts-gridline,
.dark-mode[b-pijn4a9a2h]  .apexcharts-grid-borders line {
    stroke: #334155 !important;
}

.dark-mode[b-pijn4a9a2h]  .apexcharts-xaxis line,
.dark-mode[b-pijn4a9a2h]  .apexcharts-yaxis line {
    stroke: #475569 !important;
}

.dark-mode[b-pijn4a9a2h]  .apexcharts-tooltip {
    background: #1e293b !important;
    border-color: #475569 !important;
    color: #e2e8f0 !important;
}

.dark-mode[b-pijn4a9a2h]  .apexcharts-tooltip-title {
    background: #334155 !important;
    border-color: #475569 !important;
    color: #e2e8f0 !important;
}

.dark-mode[b-pijn4a9a2h]  .apexcharts-tooltip-series-group {
    color: #e2e8f0 !important;
}

.dark-mode[b-pijn4a9a2h]  .apexcharts-legend-marker {
    border-color: transparent !important;
}

/* Gauge section */
.dark-mode .gauge-label[b-pijn4a9a2h] {
    color: #cbd5e1;
}

.dark-mode .gauge-amounts span[b-pijn4a9a2h] {
    color: #cbd5e1;
}

.dark-mode .gauge-amounts small[b-pijn4a9a2h] {
    color: #64748b;
}

.dark-mode .gauge-svg circle:first-child[b-pijn4a9a2h] {
    stroke: #334155;
}

/* Revenue table */
.dark-mode .revenue-table th[b-pijn4a9a2h] {
    color: #94a3b8;
    border-color: #475569;
    background: transparent;
}

.dark-mode .revenue-table td[b-pijn4a9a2h] {
    color: #f1f5f9;
    border-color: #334155;
}

.dark-mode .rv-name[b-pijn4a9a2h] {
    color: #f1f5f9;
}

.dark-mode .rv-pct-bar[b-pijn4a9a2h] {
    background: #334155;
}

.dark-mode .rv-pct-text[b-pijn4a9a2h] {
    color: #cbd5e1;
}

.dark-mode .rv-sub[b-pijn4a9a2h] {
    color: #64748b;
}

.dark-mode .revenue-table tr:hover td[b-pijn4a9a2h] {
    background: #334155;
}

/* Totals — card bg in dark should be distinguishable */
.dark-mode .total-card[b-pijn4a9a2h] {
    background: #1e293b;
    border: 1px solid #334155;
}

.dark-mode .totals-grid[b-pijn4a9a2h] {
    background: #0f172a;
}

/* Kalibracije u tamnom modu kao kutije ukupnih pokazatelja odmah ispod. */
.dark-mode .calibration-due[b-pijn4a9a2h] {
    background: var(--color-bg-main);
}

.dark-mode .calibration-due-item[b-pijn4a9a2h] {
    background: var(--color-bg-card);
    border: 1px solid var(--color-border-light);
}

/* Empty steps */
.dark-mode .empty-step[b-pijn4a9a2h] {
    background: #334155;
    color: #cbd5e1;
}

/* Section body / chart area */
.dark-mode .section-body[b-pijn4a9a2h] {
    color: #cbd5e1;
}

.dark-mode .chart-body[b-pijn4a9a2h] {
    color: #cbd5e1;
}

/* Buyer table specific */
.dark-mode .buyer-table th[b-pijn4a9a2h] {
    color: #94a3b8;
    background: #1e293b;
    border-color: #334155;
}

.dark-mode .buyer-table td[b-pijn4a9a2h] {
    color: #cbd5e1;
    border-color: #334155;
}

.dark-mode .buyer-table .rv-name[b-pijn4a9a2h] {
    color: #f1f5f9;
}

/* Pravila za traku stoje iza osnovnih, inače ih osnovna pregaze. */
@media (max-width: 768px) {
    .ov-filters[b-pijn4a9a2h] { flex-direction: column; align-items: stretch; }
    .ov-filters-right[b-pijn4a9a2h] { justify-content: space-between; }
    .period-nav[b-pijn4a9a2h], .buyer-filter[b-pijn4a9a2h] { flex: 1 1 100%; }
    .period-nav[b-pijn4a9a2h] { justify-content: space-between; }
    .buyer-select[b-pijn4a9a2h] { max-width: none; flex: 1; }
}
/* _content/ArasWeb/Pages/Dashboard/OrderTracker.razor.rz.scp.css */
/* ═══════════════════════════════════════
   Order Tracker — Process Timeline
   ═══════════════════════════════════════ */

/* ── Split Layout ── */
.tracker-layout[b-w3f60udrjc] {
    margin-top: 0.5em;
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.tracker-main[b-w3f60udrjc] {
    flex: 7;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* ── Activity Panel ── */
.tracker-panel[b-w3f60udrjc] {
    flex: 3;
    min-width: 280px;
    max-width: 400px;
    background: var(--color-bg-card);
    border-radius: 0.5em;
    position: sticky;
    top: 0;
    max-height: 100vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.tp-header[b-w3f60udrjc] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--color-border-light);
    flex-shrink: 0;
}

.tp-header > i[b-w3f60udrjc] {
    color: var(--color-primary);
    font-size: 14px;
}

.tp-title[b-w3f60udrjc] {
    font-family: var(--font-medium);
    font-size: 14px;
    color: var(--color-text-dark);
    flex: 1;
}

.tp-count[b-w3f60udrjc] {
    font-size: 10px;
    padding: 2px 8px;
    background: var(--color-bg-surface);
    border-radius: 2em;
    color: var(--color-text-muted);
    font-family: var(--font-medium);
}

.tp-feed[b-w3f60udrjc] {
    flex: 1;
    overflow-y: auto;
}

.tp-empty[b-w3f60udrjc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 32px 16px;
    color: var(--color-text-muted);
    font-size: 12px;
}

.tp-empty i[b-w3f60udrjc] {
    font-size: 20px;
    opacity: 0.4;
}

/* ── Feed Items ── */
.feed-item[b-w3f60udrjc] {
    display: flex;
    gap: 10px;
    padding: 8px 16px;
    border-bottom: 1px solid var(--color-border-light);
    transition: background 0.15s;
}

.feed-item:last-child[b-w3f60udrjc] {
    border-bottom: none;
}

.feed-item:hover[b-w3f60udrjc] {
    background: var(--color-bg-surface);
}

.fi-icon[b-w3f60udrjc] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    flex-shrink: 0;
    margin-top: 2px;
}

.fi-op-start[b-w3f60udrjc] { background: rgba(14,165,233,0.1); color: #0ea5e9; }
.fi-op-done[b-w3f60udrjc] { background: rgba(38,176,80,0.1); color: #26b050; }
.fi-defect[b-w3f60udrjc] { background: rgba(217,83,79,0.1); color: #d9534f; }
.fi-order-done[b-w3f60udrjc] { background: rgba(38,176,80,0.1); color: #26b050; }
.fi-order-new[b-w3f60udrjc] { background: rgba(100,116,139,0.1); color: #64748b; }
.fi-tech[b-w3f60udrjc] { background: rgba(40,138,237,0.1); color: var(--ar-primary); }
.fi-tech-done[b-w3f60udrjc] { background: rgba(40,138,237,0.15); color: var(--ar-primary); }
.fi-default[b-w3f60udrjc] { background: var(--color-bg-surface); color: var(--color-text-muted); }

.fi-body[b-w3f60udrjc] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.fi-desc[b-w3f60udrjc] {
    font-size: 11px;
    color: var(--color-text-muted);
    line-height: 1.5;
    display: block;
    font-family: var(--font-regular);
}

[b-w3f60udrjc] .fi-desc b {
    color: var(--color-text-dark);
    font-family: var(--font-medium);
    font-weight: normal;
}

.fi-time[b-w3f60udrjc] {
    font-size: 10px;
    color: var(--color-text-muted);
    font-variant-numeric: tabular-nums;
}

/* Panel scrollbar */
.tp-feed[b-w3f60udrjc]::-webkit-scrollbar { width: 3px; }
.tp-feed[b-w3f60udrjc]::-webkit-scrollbar-track { background: transparent; }
.tp-feed[b-w3f60udrjc]::-webkit-scrollbar-thumb { background: var(--color-border); border-radius: 3px; }

/* ── Filteri — isti obrazac kao Pregled narudžbi (OrdersTemplate) ── */
.tracker-filters[b-w3f60udrjc] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0.6em;
    padding: 0.7em 1em;
    background: white;
    border-radius: 0.5em;
    font-family: var(--font-light);
    font-size: 0.9em;
}

/* Kompaktno i u jednom redu, kao na prvobitnom dizajnu ekrana: polja dijele širinu,
   sortiranje dobija više jer mu je tekst najduži. */
.filter-box[b-w3f60udrjc] {
    flex: 1 1 8em;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

/* Osnovne širine po sadržaju: tekst sortiranja ~16em, labela datuma ~11.5em */
.filter-box.filter-sort[b-w3f60udrjc] {
    flex: 1 1 16em;
}

/* Labela datuma je najduža; radije novi red nego odsječen tekst */
.filter-box.filter-date[b-w3f60udrjc] {
    flex: 1 1 11.5em;
    min-width: 11.5em;
}

    .filter-box label[b-w3f60udrjc] {
        margin-bottom: 0.3em;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .filter-box[b-w3f60udrjc]  select,
    .filter-box[b-w3f60udrjc]  input[type="date"] {
        width: 100%;
        min-width: 0;
        height: 2.3em;
        padding: 0.2em 0.6em;
        font-size: 0.95em;
    }

    .filter-box img[b-w3f60udrjc] {
        width: 1em;
        height: 1em;
        margin: 0 0.5em;
    }

/* Zaglavlje: "Uživo" i dugmad uz pretragu */
.kiosk-btn.shadow[b-w3f60udrjc] {
    width: 2.4em;
    height: 2.4em;
    background: var(--color-bg-card);
    font-size: 1em;
}

.th-live[b-w3f60udrjc] {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.8em;
    white-space: nowrap;
    color: var(--color-text-muted);
}

.live-dot[b-w3f60udrjc] {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--color-success);
    animation: pulse-b-w3f60udrjc 2s infinite;
}

@keyframes pulse-b-w3f60udrjc {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
}

/* ── Stage Legend ── */
.stage-legend[b-w3f60udrjc] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 16px;
    background: var(--color-bg-card);
    border-radius: 0.5em;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

.sl-stage[b-w3f60udrjc] {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    font-family: var(--font-medium);
    padding: 3px 10px;
    border-radius: 2em;
}

.sl-dot[b-w3f60udrjc] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.sl-ponuda .sl-dot[b-w3f60udrjc] { background: #64748b; }
.sl-narudzba .sl-dot[b-w3f60udrjc] { background: #0ea5e9; }
.sl-tech .sl-dot[b-w3f60udrjc] { background: var(--color-primary); }
.sl-prod .sl-dot[b-w3f60udrjc] { background: #e67e22; }
.sl-ctrl .sl-dot[b-w3f60udrjc] { background: #7c3aed; }
.sl-done .sl-dot[b-w3f60udrjc] { background: var(--color-success); }

.sl-ponuda[b-w3f60udrjc] { color: #64748b; background: rgba(100,116,139,0.08); }
.sl-narudzba[b-w3f60udrjc] { color: #0ea5e9; background: rgba(14,165,233,0.08); }
.sl-tech[b-w3f60udrjc] { color: var(--color-primary); background: rgba(40,138,237,0.08); }
.sl-prod[b-w3f60udrjc] { color: #e67e22; background: rgba(230,126,34,0.08); }
.sl-ctrl[b-w3f60udrjc] { color: #7c3aed; background: rgba(124,58,237,0.08); }
.sl-done[b-w3f60udrjc] { color: var(--color-success); background: rgba(38,176,80,0.08); }

.sl-arrow[b-w3f60udrjc] {
    color: var(--color-border);
    font-size: 8px;
}

/* ── Order List ── */
.order-list[b-w3f60udrjc] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* ── Order Card ── */
.order-card[b-w3f60udrjc] {
    background: var(--color-bg-card);
    border-radius: 0.5em;
    overflow: hidden;
    border-left: 4px solid var(--color-primary);
    transition: border-color 0.2s;
}

.order-card.order-completed[b-w3f60udrjc] {
    border-left-color: var(--color-success);
    opacity: 0.8;
}

.oc-header[b-w3f60udrjc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    cursor: pointer;
    transition: background 0.15s;
}

.oc-header:hover[b-w3f60udrjc] {
    background: var(--color-bg-surface);
}

.oc-info[b-w3f60udrjc] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.oc-number[b-w3f60udrjc] {
    font-family: var(--font-bold);
    font-size: 14px;
    color: var(--color-text-dark);
}

.oc-buyer[b-w3f60udrjc] {
    font-size: 13px;
    color: var(--color-text-dark);
    font-family: var(--font-medium);
}

.oc-offer[b-w3f60udrjc] {
    font-size: 11px;
    color: var(--color-text-muted);
    padding: 2px 8px;
    background: rgba(100,116,139,0.08);
    border-radius: 2em;
}

.oc-offer i[b-w3f60udrjc] {
    margin-right: 3px;
    font-size: 9px;
}

.oc-meta[b-w3f60udrjc] {
    display: flex;
    align-items: center;
    gap: 14px;
}

.oc-price[b-w3f60udrjc] {
    font-size: 12px;
    font-family: var(--font-bold);
    color: var(--color-text-dark);
    padding: 2px 10px;
    background: rgba(38,176,80,0.08);
    border-radius: 2em;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.oc-price i[b-w3f60udrjc] {
    font-size: 10px;
    margin-right: 2px;
    color: var(--color-success);
}

.oc-articles[b-w3f60udrjc] {
    font-size: 11px;
    color: var(--color-text-muted);
    padding: 2px 8px;
    background: var(--color-bg-surface);
    border-radius: 2em;
}

.oc-deadline[b-w3f60udrjc] {
    font-size: 12px;
    font-family: var(--font-medium);
    display: flex;
    align-items: center;
    gap: 4px;
}

.oc-deadline i[b-w3f60udrjc] { font-size: 11px; }

.oc-deadline.ontrack[b-w3f60udrjc] { color: var(--color-text-muted); }
.oc-deadline.atrisk[b-w3f60udrjc] { color: #e67e22; }
.oc-deadline.overdue[b-w3f60udrjc] { color: var(--color-danger); }
.oc-deadline.done[b-w3f60udrjc] { color: var(--color-success); }

.oc-late[b-w3f60udrjc] {
    font-size: 10px;
    padding: 1px 6px;
    background: rgba(217,83,79,0.1);
    border-radius: 2em;
    color: var(--color-danger);
    font-family: var(--font-medium);
}

.oc-expand[b-w3f60udrjc] {
    color: var(--color-text-muted);
    font-size: 11px;
    margin-left: 4px;
    transition: transform 0.2s;
}

/* ── Timeline ── */
.timeline[b-w3f60udrjc] {
    display: flex;
    align-items: flex-start;
    padding: 6px 24px 14px;
    gap: 0;
}

.tl-node[b-w3f60udrjc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
    min-width: 80px;
}

.tl-icon-wrap[b-w3f60udrjc] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tl-icon[b-w3f60udrjc] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    border: 2px solid;
    transition: all 0.3s;
    position: relative;
    z-index: 1;
}

/* Pending state */
.ts-pending .tl-icon[b-w3f60udrjc] {
    background: var(--color-bg-surface);
    border-color: var(--color-border);
    color: var(--color-border);
}

/* Active state */
.ts-active .tl-icon[b-w3f60udrjc] {
    border-width: 3px;
    box-shadow: 0 0 0 4px;
}

.tl-ponuda.ts-active .tl-icon[b-w3f60udrjc] {
    background: rgba(100,116,139,0.1);
    border-color: #64748b;
    color: #64748b;
    box-shadow: 0 0 0 4px rgba(100,116,139,0.15);
}

.tl-narudzba.ts-active .tl-icon[b-w3f60udrjc] {
    background: rgba(14,165,233,0.1);
    border-color: #0ea5e9;
    color: #0ea5e9;
    box-shadow: 0 0 0 4px rgba(14,165,233,0.15);
}

.tl-tech.ts-active .tl-icon[b-w3f60udrjc] {
    background: rgba(40,138,237,0.1);
    border-color: var(--color-primary);
    color: var(--color-primary);
    box-shadow: 0 0 0 4px rgba(40,138,237,0.15);
}

.tl-prod.ts-active .tl-icon[b-w3f60udrjc] {
    background: rgba(230,126,34,0.1);
    border-color: #e67e22;
    color: #e67e22;
    box-shadow: 0 0 0 4px rgba(230,126,34,0.15);
}

.tl-ctrl.ts-active .tl-icon[b-w3f60udrjc] {
    background: rgba(124,58,237,0.1);
    border-color: #7c3aed;
    color: #7c3aed;
    box-shadow: 0 0 0 4px rgba(124,58,237,0.15);
}

.tl-done.ts-active .tl-icon[b-w3f60udrjc] {
    background: rgba(38,176,80,0.1);
    border-color: var(--color-success);
    color: var(--color-success);
    box-shadow: 0 0 0 4px rgba(38,176,80,0.15);
}

/* Completed state */
.ts-completed .tl-icon[b-w3f60udrjc] {
    color: white;
    border-color: transparent;
}

.tl-ponuda.ts-completed .tl-icon[b-w3f60udrjc] { background: #64748b; }
.tl-narudzba.ts-completed .tl-icon[b-w3f60udrjc] { background: #0ea5e9; }
.tl-tech.ts-completed .tl-icon[b-w3f60udrjc] { background: var(--color-primary); }
.tl-prod.ts-completed .tl-icon[b-w3f60udrjc] { background: #e67e22; }
.tl-ctrl.ts-completed .tl-icon[b-w3f60udrjc] { background: #7c3aed; }
.tl-done.ts-completed .tl-icon[b-w3f60udrjc] { background: var(--color-success); }

/* Pulse animation for active */
.tl-pulse[b-w3f60udrjc] {
    position: absolute;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    animation: tl-pulse-anim-b-w3f60udrjc 2s ease-out infinite;
    z-index: 0;
}

.tl-tech .tl-pulse[b-w3f60udrjc] { background: var(--color-primary); }
.tl-prod .tl-pulse[b-w3f60udrjc] { background: #e67e22; }
.tl-ctrl .tl-pulse[b-w3f60udrjc] { background: #7c3aed; }
.tl-narudzba .tl-pulse[b-w3f60udrjc] { background: #0ea5e9; }
.tl-ponuda .tl-pulse[b-w3f60udrjc] { background: #64748b; }
.tl-done .tl-pulse[b-w3f60udrjc] { background: var(--color-success); }

@keyframes tl-pulse-anim-b-w3f60udrjc {
    0% { transform: scale(1); opacity: 0.4; }
    100% { transform: scale(1.8); opacity: 0; }
}

.tl-label[b-w3f60udrjc] {
    font-size: 10px;
    font-family: var(--font-medium);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    color: var(--color-text-muted);
}

.ts-active .tl-label[b-w3f60udrjc] {
    color: var(--color-text-dark);
    font-family: var(--font-bold);
}

.tl-time[b-w3f60udrjc] {
    font-size: 9px;
    color: var(--color-text-muted);
    font-variant-numeric: tabular-nums;
}

/* ── Progress Ring ── */
.tl-progress[b-w3f60udrjc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    margin-top: 2px;
}

.tl-progress-ring[b-w3f60udrjc] {
    position: relative;
    width: 34px;
    height: 34px;
}

.tl-progress-ring svg[b-w3f60udrjc] {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.ring-bg[b-w3f60udrjc] {
    fill: none;
    stroke: var(--color-border-light);
    stroke-width: 3;
}

.ring-fill[b-w3f60udrjc] {
    fill: none;
    stroke-width: 3;
    stroke-linecap: round;
    transition: stroke-dasharray 0.5s ease;
}

.ts-completed .ring-fill[b-w3f60udrjc],
.ts-active .ring-fill[b-w3f60udrjc] {
    /* colored by stage below */
}

.tl-tech .ring-fill[b-w3f60udrjc] { stroke: var(--color-primary); }
.tl-prod .ring-fill[b-w3f60udrjc] { stroke: #e67e22; }
.tl-ctrl .ring-fill[b-w3f60udrjc] { stroke: #7c3aed; }
.tl-done .ring-fill[b-w3f60udrjc] { stroke: var(--color-success); }

.ts-pending .tl-progress-ring .ring-fill[b-w3f60udrjc],
.tl-tech.ts-pending .ring-fill[b-w3f60udrjc],
.tl-prod.ts-pending .ring-fill[b-w3f60udrjc],
.tl-ctrl.ts-pending .ring-fill[b-w3f60udrjc],
.tl-done.ts-pending .ring-fill[b-w3f60udrjc] { stroke: var(--color-border); }

.ring-text[b-w3f60udrjc] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 8px;
    font-family: var(--font-bold);
    color: var(--color-text-dark);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.tl-in-stage[b-w3f60udrjc] {
    font-size: 8px;
    color: var(--color-text-muted);
    font-family: var(--font-medium);
    white-space: nowrap;
}

/* Connector line */
.tl-connector[b-w3f60udrjc] {
    flex: 1;
    height: 3px;
    border-radius: 2px;
    margin-top: 18px;
    min-width: 20px;
    transition: background 0.3s;
}

.conn-done[b-w3f60udrjc] {
    background: linear-gradient(90deg, var(--color-success), var(--color-success));
}

.conn-active[b-w3f60udrjc] {
    background: linear-gradient(90deg, var(--color-success) 40%, var(--color-border) 100%);
    position: relative;
    overflow: hidden;
}

.conn-active[b-w3f60udrjc]::after {
    content: '';
    position: absolute;
    top: 0;
    left: -30%;
    width: 30%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.6), transparent);
    animation: connector-shimmer-b-w3f60udrjc 2s infinite;
}

@keyframes connector-shimmer-b-w3f60udrjc {
    0% { left: -30%; }
    100% { left: 130%; }
}

.conn-pending[b-w3f60udrjc] {
    background: var(--color-border-light);
}

/* ── Expanded Articles ── */
.oc-articles-detail[b-w3f60udrjc] {
    padding: 0 16px 14px;
    border-top: 1px solid var(--color-border-light);
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding-top: 12px;
}

.art-row[b-w3f60udrjc] {
    border-radius: 0.4em;
    border-left: 3px solid;
    background: var(--color-bg-main);
    overflow: hidden;
}

.art-header[b-w3f60udrjc] {
    padding: 10px 12px;
}

.art-stage-3[b-w3f60udrjc] { border-left-color: var(--color-primary); }
.art-stage-4[b-w3f60udrjc] { border-left-color: #e67e22; }
.art-stage-5[b-w3f60udrjc] { border-left-color: #7c3aed; }
.art-stage-6[b-w3f60udrjc] { border-left-color: var(--color-success); }

.art-top[b-w3f60udrjc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
}

.art-name[b-w3f60udrjc] {
    font-family: var(--font-medium);
    font-size: 12px;
    color: var(--color-text-dark);
}

.art-qty[b-w3f60udrjc] {
    font-size: 10px;
    color: var(--color-text-muted);
    font-variant-numeric: tabular-nums;
}

.art-bottom[b-w3f60udrjc] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.art-phase[b-w3f60udrjc] {
    font-size: 10px;
    font-family: var(--font-medium);
}

.art-stage-3 .art-phase[b-w3f60udrjc] { color: var(--color-primary); }
.art-stage-4 .art-phase[b-w3f60udrjc] { color: #e67e22; }
.art-stage-5 .art-phase[b-w3f60udrjc] { color: #7c3aed; }
.art-stage-6 .art-phase[b-w3f60udrjc] { color: var(--color-success); }

.art-status[b-w3f60udrjc] {
    font-size: 10px;
    padding: 1px 8px;
    border-radius: 2em;
}

.art-pending .art-status[b-w3f60udrjc] {
    background: var(--color-bg-surface);
    color: var(--color-text-muted);
}

.art-in_progress .art-status[b-w3f60udrjc] {
    background: rgba(245,158,11,0.1);
    color: #d97706;
}

.art-completed .art-status[b-w3f60udrjc] {
    background: rgba(38,176,80,0.1);
    color: var(--color-success);
}

.art-supplier[b-w3f60udrjc] {
    font-size: 10px;
    color: var(--color-text-muted);
}

.art-supplier i[b-w3f60udrjc] {
    margin-right: 3px;
    font-size: 9px;
}

.art-empty[b-w3f60udrjc] {
    padding: 16px;
    text-align: center;
    font-size: 12px;
    color: var(--color-success);
    font-family: var(--font-medium);
}

.art-empty i[b-w3f60udrjc] {
    margin-right: 4px;
}

/* ── Production Steps ── */
.art-steps[b-w3f60udrjc] {
    display: flex;
    gap: 6px;
    padding: 0 12px 10px;
    overflow-x: auto;
}

.step[b-w3f60udrjc] {
    flex: 1;
    min-width: 120px;
    max-width: 200px;
    padding: 8px 10px;
    border-radius: 0.4em;
    background: var(--color-bg-card);
    border: 1px solid var(--color-border-light);
    transition: border-color 0.2s;
}

.step-active[b-w3f60udrjc] {
    border-color: #e67e22;
    background: rgba(230,126,34,0.03);
}

.step-done[b-w3f60udrjc] {
    border-color: var(--color-success);
    background: rgba(38,176,80,0.03);
}

.step-top[b-w3f60udrjc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 5px;
}

.step-name[b-w3f60udrjc] {
    font-size: 11px;
    font-family: var(--font-medium);
    color: var(--color-text-dark);
}

.step-items[b-w3f60udrjc] {
    font-size: 10px;
    font-family: var(--font-bold);
    font-variant-numeric: tabular-nums;
}

.step-pending .step-items[b-w3f60udrjc] { color: var(--color-text-muted); }
.step-active .step-items[b-w3f60udrjc] { color: #e67e22; }
.step-done .step-items[b-w3f60udrjc] { color: var(--color-success); }

.step-bar[b-w3f60udrjc] {
    height: 4px;
    background: var(--color-border-light);
    border-radius: 2px;
    overflow: hidden;
}

.step-fill[b-w3f60udrjc] {
    height: 100%;
    border-radius: 2px;
    transition: width 0.4s ease;
}

.step-pending .step-fill[b-w3f60udrjc] { background: var(--color-border); }
.step-active .step-fill[b-w3f60udrjc] { background: #e67e22; }
.step-done .step-fill[b-w3f60udrjc] { background: var(--color-success); }

.step-meta[b-w3f60udrjc] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
}

.step-worker[b-w3f60udrjc],
.step-machine[b-w3f60udrjc] {
    font-size: 9px;
    color: var(--color-text-muted);
}

.step-worker i[b-w3f60udrjc],
.step-machine i[b-w3f60udrjc] {
    margin-right: 2px;
    font-size: 8px;
}

.step-active .step-worker[b-w3f60udrjc] { color: #e67e22; }

/* scrollbar for steps */
.art-steps[b-w3f60udrjc]::-webkit-scrollbar {
    height: 3px;
}
.art-steps[b-w3f60udrjc]::-webkit-scrollbar-track {
    background: transparent;
}
.art-steps[b-w3f60udrjc]::-webkit-scrollbar-thumb {
    background: var(--color-border);
    border-radius: 3px;
}

/* ── Empty State ── */
.empty-state[b-w3f60udrjc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 48px 16px;
    color: var(--color-text-muted);
    font-size: 13px;
    text-align: center;
    background: var(--color-bg-card);
    border-radius: 0.5em;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

.empty-state i[b-w3f60udrjc] {
    font-size: 24px;
    opacity: 0.4;
}

/* ── Responsive ── */
/* Šest filtera stane u jedan red tek od ~1600 px; uže se slažu tri po tri umjesto
   neujednačenog prelamanja. Telefon ispod ima svoja dva po dva. */
@media (max-width: 1600px) {
    .tracker-filters[b-w3f60udrjc] { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .filter-box.filter-date[b-w3f60udrjc] { min-width: 0; }
}

@media (max-width: 1200px) {
    /* U koloni se glavni dio mora rastegnuti na širinu ekrana. Sa flex-start se širio prema
       sadržaju, pa je otvorena narudžba razvlačila i odsijecala cijelu stranicu. */
    .tracker-layout[b-w3f60udrjc] { flex-direction: column; align-items: stretch; }
    .tracker-panel[b-w3f60udrjc] { position: static; max-height: 400px; max-width: 100%; min-width: 0; }
    .stage-legend[b-w3f60udrjc] { flex-wrap: wrap; }
    .sl-arrow[b-w3f60udrjc] { display: none; }
    .timeline[b-w3f60udrjc] { flex-wrap: wrap; gap: 4px; justify-content: center; }
    .tl-connector[b-w3f60udrjc] { display: none; }
    .tl-node[b-w3f60udrjc] { min-width: 60px; }
}

@media (max-width: 768px) {
    /* Zaglavlje se lomi u dva reda: naslov gore, pretraga i dugmad ispod preko cijele širine.
       "Uživo" ostaje samo tačka, a kiosk na telefonu nema smisla. */
    .tracker-page[b-w3f60udrjc]  .page-info { flex-wrap: wrap; }
    .tracker-page[b-w3f60udrjc]  .page-info-right { width: 100%; margin-left: 0; }
    .tracker-page[b-w3f60udrjc]  .page-info-right .search { flex: 1; min-width: 0; }
    .th-live[b-w3f60udrjc] { font-size: 0; }
    .kiosk-btn[title^="Kiosk mod"][b-w3f60udrjc] { display: none; }

    /* Filteri dva po dva preko cijele širine; sortiranje i faza u svom redu */
    .tracker-filters[b-w3f60udrjc] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .filter-box.filter-wide[b-w3f60udrjc] { grid-column: 1 / -1; }
    .filter-box.filter-date[b-w3f60udrjc] { min-width: 0; }

    /* Boje faza se vide na samim čvorovima, legenda samo troši visinu */
    .stage-legend[b-w3f60udrjc] { display: none; }

    /* Strelica ide u ugao da ne padne u svoj red kad je cijena duža */
    .oc-header[b-w3f60udrjc] { position: relative; flex-direction: column; align-items: stretch; gap: 8px; padding: 12px 36px 12px 12px; }
    .oc-info[b-w3f60udrjc] { flex-wrap: wrap; gap: 4px 10px; }
    .oc-meta[b-w3f60udrjc] { flex-wrap: wrap; gap: 6px; }
    .oc-articles[b-w3f60udrjc],
    .oc-deadline[b-w3f60udrjc] { white-space: nowrap; }
    .oc-expand[b-w3f60udrjc] { position: absolute; top: 16px; right: 14px; }

    /* Šest faza u dva reda po tri, poravnate u mrežu umjesto razlomljenog flex reda */
    .timeline[b-w3f60udrjc] { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 4px; padding: 8px 8px 14px; }
    .tl-node[b-w3f60udrjc] { min-width: 0; }
    .tl-label[b-w3f60udrjc] { letter-spacing: 0; }

    .oc-articles-detail[b-w3f60udrjc] { padding: 12px 10px; }
    .art-steps[b-w3f60udrjc] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow-x: visible; }
    .step[b-w3f60udrjc] { min-width: 0; max-width: none; }

    .tracker-panel[b-w3f60udrjc] { max-height: 300px; }
}

/* ── Kiosk Mode ── */
.tracker-layout.kiosk[b-w3f60udrjc] {
    min-height: calc(100vh - 24px);
}

.tracker-layout.kiosk .tracker-panel[b-w3f60udrjc] {
    max-height: calc(100vh - 24px);
}

/* Kiosk: lista je traka iza prozora do dna ekrana i stalno, polako ide gore. Pomjera je
   order-tracker-kiosk.js (transform). Lista je position: relative, da offsetTop kartica bude
   mjeren od nje. Padding čuva sjenku i sjaj kartica od odsijecanja. */
.kiosk-viewport[b-w3f60udrjc] {
    overflow: hidden;
    padding: 4px 6px 0;
    margin: -4px -6px 0;
}

/* Narudžba s novom aktivnošću skoči na vrh trake i kratko zasvijetli. */
.kiosk-viewport .order-card.kiosk-focus[b-w3f60udrjc] {
    animation: kiosk-focus-glow-b-w3f60udrjc 1.6s ease-in-out 3;
}

@keyframes kiosk-focus-glow-b-w3f60udrjc {
    0%, 100% { box-shadow: 0 0 0 0 rgba(2, 117, 216, 0); }
    50% { box-shadow: 0 0 0 4px rgba(2, 117, 216, 0.55); }
}

.kiosk-viewport .order-list[b-w3f60udrjc] {
    position: relative;
    will-change: transform;
}

/* ── Header Actions ── */
.th-actions[b-w3f60udrjc] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.kiosk-btn[b-w3f60udrjc] {
    width: 28px;
    height: 28px;
    border: 1px solid var(--color-border-light);
    border-radius: 0.4em;
    background: transparent;
    color: var(--color-text-muted);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    transition: all 0.15s;
}

.kiosk-btn:hover[b-w3f60udrjc] {
    background: var(--color-bg-surface);
    color: var(--color-text-dark);
}

.show-more[b-w3f60udrjc] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1em;
    padding: 1em 0 0.5em;
    color: var(--color-text-muted);
    font-size: 13px;
}

.show-more-btn[b-w3f60udrjc] {
    border: 1px solid var(--color-border-light);
    border-radius: 0.4em;
    background: var(--color-bg-card);
    color: var(--color-primary);
    font-family: var(--font-medium);
    padding: 0.35em 1em;
    cursor: pointer;
    transition: all 0.15s;
}

.show-more-btn:hover[b-w3f60udrjc] {
    background: var(--color-bg-surface);
}

/* ── Dark Mode ── */
.dark-mode[b-w3f60udrjc] {
    --color-bg-main: #0f172a;
    --color-bg-card: #1e293b;
    --color-bg-surface: #334155;
    --color-text-dark: #f1f5f9;
    --color-text-muted: #94a3b8;
    --color-text-light: #cbd5e1;
    --color-border: #475569;
    --color-border-light: #334155;
    --color-icon-accent: #60a5fa;
    --color-primary: #60a5fa;
    --color-success: #4ade80;
    --color-danger: #f87171;
}

.dark-mode .kiosk-btn[b-w3f60udrjc] {
    border-color: #475569;
    color: #94a3b8;
}

.dark-mode .kiosk-btn:hover[b-w3f60udrjc] {
    background: #334155;
    color: #f1f5f9;
}

.dark-mode .tracker-filters[b-w3f60udrjc],
.dark-mode .stage-legend[b-w3f60udrjc],
.dark-mode .order-card[b-w3f60udrjc],
.dark-mode .tracker-panel[b-w3f60udrjc],
.dark-mode .empty-state[b-w3f60udrjc] {
    background: var(--color-bg-card);
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}

.dark-mode .oc-header:hover[b-w3f60udrjc] {
    background: var(--color-bg-surface);
}

.dark-mode .feed-item:hover[b-w3f60udrjc] {
    background: var(--color-bg-surface);
}

.dark-mode .art-row[b-w3f60udrjc] {
    background: var(--color-bg-surface);
}

.dark-mode .step[b-w3f60udrjc] {
    background: var(--color-bg-card);
    border-color: var(--color-border);
}

.dark-mode .step-active[b-w3f60udrjc] {
    border-color: #e67e22;
    background: rgba(230,126,34,0.08);
}

.dark-mode .step-done[b-w3f60udrjc] {
    border-color: var(--color-success);
    background: rgba(74,222,128,0.08);
}

.dark-mode .search[b-w3f60udrjc],
.dark-mode .search input[b-w3f60udrjc],
.dark-mode .filter-box[b-w3f60udrjc]  select,
.dark-mode .filter-box[b-w3f60udrjc]  input[type="date"] {
    background: var(--color-bg-surface);
    border-color: var(--color-border);
    color: var(--color-text-dark);
}

.dark-mode .oc-articles[b-w3f60udrjc],
.dark-mode .oc-offer[b-w3f60udrjc],
.dark-mode .tp-count[b-w3f60udrjc] {
    background: var(--color-bg-surface);
    color: var(--color-text-muted);
}

.dark-mode .ring-bg[b-w3f60udrjc] {
    stroke: var(--color-border);
}

.dark-mode .ring-text[b-w3f60udrjc] {
    color: var(--color-text-dark);
}

/* Text overrides for dark mode */
/* Ikone filtera i pretrage su tamni PNG-ovi dijeljeni s ostatkom aplikacije */
.dark-mode .filter-box img[b-w3f60udrjc],
.dark-mode .search img[b-w3f60udrjc] {
    filter: invert(1);
}

.dark-mode[b-w3f60udrjc]  .page-info h4,
.dark-mode .tp-title[b-w3f60udrjc],
.dark-mode .ov-toolbar-title[b-w3f60udrjc] {
    color: #f1f5f9;
}

.dark-mode .th-live[b-w3f60udrjc],
.dark-mode .filter-box label[b-w3f60udrjc],
.dark-mode .sl-arrow[b-w3f60udrjc] {
    color: #94a3b8;
}

.dark-mode .oc-number[b-w3f60udrjc] {
    color: #f1f5f9;
}

.dark-mode .oc-buyer[b-w3f60udrjc] {
    color: #cbd5e1;
}

.dark-mode .oc-price[b-w3f60udrjc] {
    color: #f1f5f9;
    background: rgba(74,222,128,0.1);
}

.dark-mode .oc-price i[b-w3f60udrjc] {
    color: #4ade80;
}

.dark-mode .oc-deadline[b-w3f60udrjc] {
    color: #94a3b8;
}

.dark-mode .oc-deadline.overdue[b-w3f60udrjc] {
    color: #f87171;
}

.dark-mode .oc-deadline.atrisk[b-w3f60udrjc] {
    color: #fbbf24;
}

.dark-mode .oc-late[b-w3f60udrjc] {
    background: rgba(248,113,113,0.15);
    color: #f87171;
}

.dark-mode .oc-expand[b-w3f60udrjc] {
    color: #64748b;
}

.dark-mode .tl-label[b-w3f60udrjc] {
    color: #94a3b8;
}

.dark-mode .ts-active .tl-label[b-w3f60udrjc] {
    color: #f1f5f9;
}

.dark-mode .tl-time[b-w3f60udrjc] {
    color: #64748b;
}

.dark-mode .tl-in-stage[b-w3f60udrjc] {
    color: #94a3b8;
}

.dark-mode .art-name[b-w3f60udrjc] {
    color: #f1f5f9;
}

.dark-mode .art-qty[b-w3f60udrjc] {
    color: #94a3b8;
}

.dark-mode .art-supplier[b-w3f60udrjc] {
    color: #64748b;
}

.dark-mode .step-name[b-w3f60udrjc] {
    color: #f1f5f9;
}

.dark-mode .step-items[b-w3f60udrjc] {
    color: #94a3b8;
}

.dark-mode .step-active .step-items[b-w3f60udrjc] {
    color: #e67e22;
}

.dark-mode .step-done .step-items[b-w3f60udrjc] {
    color: #4ade80;
}

.dark-mode .step-worker[b-w3f60udrjc],
.dark-mode .step-machine[b-w3f60udrjc] {
    color: #64748b;
}

.dark-mode .step-active .step-worker[b-w3f60udrjc] {
    color: #e67e22;
}

.dark-mode .step-bar[b-w3f60udrjc] {
    background: #334155;
}

.dark-mode .fi-desc[b-w3f60udrjc] {
    color: #94a3b8;
}

.dark-mode[b-w3f60udrjc]  .fi-desc b {
    color: #f1f5f9;
}

.dark-mode .fi-time[b-w3f60udrjc],
.dark-mode .fi-user[b-w3f60udrjc] {
    color: #64748b;
}

.dark-mode .feed-item[b-w3f60udrjc] {
    border-color: #334155;
}

.dark-mode .tp-header[b-w3f60udrjc] {
    border-color: #334155;
}

.dark-mode .oc-articles-detail[b-w3f60udrjc] {
    border-color: #334155;
}

.dark-mode .art-empty[b-w3f60udrjc] {
    color: #4ade80;
}

.dark-mode .empty-state span[b-w3f60udrjc] {
    color: #94a3b8;
}

/* Kiosk rola kad je Dashboard ugašen: nema kud preusmjeriti, pa samo poruka. */
.tracker-disabled[b-w3f60udrjc] {
    margin: 2em;
    color: #6c757d;
    font-family: 'Ubuntu-Light';
    font-size: 1.2em;
}
/* _content/ArasWeb/Pages/Defects/AddDefect.razor.rz.scp.css */
#add-defect-container[b-kfdnv18ha5] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: center;
    overflow-y: scroll;
}

#add-defect[b-kfdnv18ha5]{
    width: min(54rem, 95%);
    height: 90%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.add-defect-form[b-kfdnv18ha5]{
    width: 100%;
    background: white;
    padding: 0.5em 1.5em;
    border-radius: 1em;
    margin-bottom: 1em;
}

.btn-danger[b-kfdnv18ha5] {
    margin-left: auto;
}

.modal-input-box[b-kfdnv18ha5]{
    margin-bottom: 0.5em;
    position: relative;
}

.modal-input-box label[b-kfdnv18ha5] {
    margin-bottom: 0.3em;
    font-family: var(--font-light);
    font-size: 0.9em;
}

#defect-list-header[b-kfdnv18ha5] {
    background: rgba(217, 83, 79, 0.2);
}

    #defect-list-header span label[b-kfdnv18ha5],
    #defects-list span label[b-kfdnv18ha5] {
        width: 15%;
    }

    #defect-list-header .full-text[b-kfdnv18ha5],
    #defects-list .full-text[b-kfdnv18ha5] {
        word-break: break-all;
        width: 20%;
    }

    #defect-list-header .quantity[b-kfdnv18ha5],
    #defects-list .quantity[b-kfdnv18ha5] {
        width: 7%;
        text-align: center;
    }

#defects-list span[b-kfdnv18ha5] {
    display: inline-flex;
    align-items: center;
}

#defects-list img[b-kfdnv18ha5] {
    width: 1.5em;
    height: 1.5em;
    margin-right: 0.5em;
}

.made-by-worker[b-kfdnv18ha5] {
    color: var(--color-danger);
    font-family: var(--font-medium);
}

#report-btn[b-kfdnv18ha5] {
    margin-bottom: 1em;
    margin-left: auto;
    margin-right: 1em;
}

.fa-person-circle-exclamation[b-kfdnv18ha5] {
    margin-right: 0.5em;
}


#search-component[b-kfdnv18ha5] {
    position: absolute;
    width: 40em;
    height: 20em;
    top: 100%;
    right: 0;
    border-radius: 1em;
    border: 0.1em solid gray;
    padding: 1em;
    background: white;
    z-index: 10000;
}

#close-btn[b-kfdnv18ha5] {
    width: 100%;
    display: flex;
    justify-content: end;
}

#search-list-wrapper[b-kfdnv18ha5] {
    width: 100%;
    height: 90%;
    overflow-y: scroll;
}

.search-list[b-kfdnv18ha5] {
    width: 100%;
    height: auto;
}

    .search-list h6[b-kfdnv18ha5] {
        font-family: var(--font-medium);
        background: var(--color-bg-header);
        padding: 0.5em;
        border-radius: .5em;
        margin: 0.5em 0;
    }

.search-item[b-kfdnv18ha5] {
    width: 98%;
    position: relative;
    display: flex;
    justify-content: start;
    margin: 0.3em;
    border-bottom: 0.01em solid lightgray;
    padding: 0.3em;
}

.search-item-field[b-kfdnv18ha5] {
    width: auto;
    margin-right: 0.8em;
    display: flex;
    flex-direction: column;
    width: 50%;
}

    .search-item-field label[b-kfdnv18ha5] {
        font-family: var(--font-medium);
        word-break: break-all;
    }

    .search-item-field span[b-kfdnv18ha5] {
        font-family: var(--font-light);
        font-size: 0.8em;
    }

#search-placeholder[b-kfdnv18ha5] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    opacity: 0.8;
}

    #search-placeholder i[b-kfdnv18ha5] {
        font-size: 6em;
        opacity: 0.7;
        margin-bottom: 0.1em;
    }

    #search-placeholder p[b-kfdnv18ha5] {
        color: gray;
    }

.btn-item[b-kfdnv18ha5] {
    display: flex;
    justify-content: end;
    align-items: center;
    margin-left: auto;
}

    .btn-item button[b-kfdnv18ha5] {
        padding: 0.2em 0.8em;
        border-radius: 0.5em;
    }

.optional[b-kfdnv18ha5] {
    font-size: 0.9em;
    font-family: var(--font-italic);
}
/* Izbor operacije na kojoj je komad puknuo — bez nje nema "prethodnih operacija" za obracun. */
.scrap-operations[b-kfdnv18ha5] {
    display: flex;
    flex-direction: column;
    gap: 0.3em;
    max-height: 14em;
    overflow-y: auto;
    border: 1px solid #ced4da;
    border-radius: 0.5em;
    padding: 0.6em;
    background: white;
}

.scrap-operation[b-kfdnv18ha5] {
    display: flex;
    align-items: center;
    gap: 0.6em;
    cursor: pointer;
    margin: 0;
}

    .scrap-operation input[b-kfdnv18ha5] {
        cursor: pointer;
    }

    /* Gdje su komadi sada - tu se najčešće i škartira, pa oko to traži prvo. */
    .scrap-operation .op-active[b-kfdnv18ha5] {
        font-size: 0.75em;
        color: var(--ar-primary);
        background: #e4eef2;
        border-radius: 0.6em;
        padding: 0.05em 0.6em;
    }

.list-placeholder[b-kfdnv18ha5] {
    color: gray;
    font-family: var(--font-italic);
    margin: 0;
}

/* Razlaganje iznosa — klijent trazi da se vidi odakle broj, ne samo koliki je. */
.scrap-breakdown[b-kfdnv18ha5] {
    list-style: none;
    margin: 0.6em 0 0 0;
    padding: 0;
    font-size: 0.85em;
}

    .scrap-breakdown li[b-kfdnv18ha5] {
        display: flex;
        justify-content: space-between;
        gap: 1em;
        padding: 0.2em 0;
        color: #6c757d;
    }

    .scrap-breakdown li.total[b-kfdnv18ha5] {
        border-top: 1px solid #e4eef2;
        margin-top: 0.3em;
        padding-top: 0.4em;
        color: #14425a;
        font-family: var(--font-bold);
    }

.scrap-note[b-kfdnv18ha5] {
    font-size: 0.8em;
    font-family: var(--font-italic);
    color: #6c757d;
    margin: 0.4em 0 0 0;
}

/* Iznos kojem nesto fali — nula bez objasnjenja je gora od greske. */
.scrap-warning[b-kfdnv18ha5] {
    font-size: 0.8em;
    font-family: var(--font-italic);
    color: #dc3545;
    margin: 0.4em 0 0 0;
}

/* Naslov mjesta iznad njegovog razlaganja, kad su komadi na vise mjesta. */
.scrap-breakdown li.place[b-kfdnv18ha5] {
    color: #14425a;
    font-family: var(--font-medium);
}


/* ---- Raspored forme: dijelovi s naslovom, polja u dvije kolone, napomene uz naslov ---- */
.scrap-section[b-kfdnv18ha5] {
    padding: 1em 0;
    border-bottom: 1px solid #e4eef2;
}

    .scrap-section:last-child[b-kfdnv18ha5] {
        border-bottom: none;
    }

.section-title[b-kfdnv18ha5] {
    color: #14425a;
    font-family: var(--font-medium);
    font-size: 1em;
    margin: 0 0 0.6em 0;
}

.section-hint[b-kfdnv18ha5] {
    font-size: 0.8em;
    font-family: var(--font-italic);
    color: #6c757d;
    margin: -0.3em 0 0.6em 0;
}

.field-grid[b-kfdnv18ha5] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 1em;
}

    .field-grid .span-2[b-kfdnv18ha5] {
        grid-column: 1 / -1;
    }

@media (max-width: 700px) {
    .field-grid[b-kfdnv18ha5] {
        grid-template-columns: 1fr;
    }
}

/* Izabrana operacija se vidi i kad se lista pomjeri. */
.scrap-operation[b-kfdnv18ha5] {
    padding: 0.25em 0.4em;
    border-radius: 0.4em;
}

    .scrap-operation.selected[b-kfdnv18ha5] {
        background: #e4eef2;
        color: #14425a;
    }

    .scrap-operation .op-number[b-kfdnv18ha5] {
        color: #6c757d;
        min-width: 1.6em;
        text-align: right;
    }

    .scrap-operation .op-name[b-kfdnv18ha5] {
        flex: 1;
    }

/* Napomene i upozorenja u jednom obliku, umjesto teksta razbacanog po formi. */
.callout[b-kfdnv18ha5] {
    font-size: 0.85em;
    border-radius: 0.5em;
    padding: 0.6em 0.8em;
    margin: 0.6em 0 0 0;
    border-left: 0.25em solid;
}

    .callout p[b-kfdnv18ha5] {
        margin: 0 0 0.4em 0;
    }

.callout-info[b-kfdnv18ha5] {
    background: #e4eef2;
    border-color: var(--ar-primary);
    color: #14425a;
    margin: 0 0 0.6em 0;
}

.callout-warning[b-kfdnv18ha5] {
    background: #fff8e6;
    border-color: #f0ad4e;
    color: #6b4e16;
}

.callout-danger[b-kfdnv18ha5] {
    background: #fdecea;
    border-color: #dc3545;
    color: #8a1c24;
}

.confirm-option[b-kfdnv18ha5] {
    display: flex;
    align-items: flex-start;
    gap: 0.5em;
    cursor: pointer;
    margin: 0;
    font-family: var(--font-medium);
}

    .confirm-option input[b-kfdnv18ha5] {
        margin-top: 0.2em;
    }

/* Gdje su komadi sada: tabela, jedan red po mjestu. */
.pieces-table[b-kfdnv18ha5] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9em;
}

    .pieces-table th[b-kfdnv18ha5] {
        font-family: var(--font-medium);
        font-size: 0.8em;
        color: #6c757d;
        text-transform: uppercase;
        border-bottom: 1px solid #ced4da;
        padding: 0.3em 0.4em;
    }

    .pieces-table td[b-kfdnv18ha5] {
        padding: 0.4em;
        border-bottom: 1px solid #e4eef2;
        color: #14425a;
        vertical-align: middle;
    }

    .pieces-table tfoot td[b-kfdnv18ha5] {
        border-bottom: none;
        color: #6c757d;
    }

    .pieces-table .num[b-kfdnv18ha5] {
        text-align: right;
        white-space: nowrap;
    }

    .pieces-table .pieces-input[b-kfdnv18ha5] {
        width: 5em;
        margin-left: auto;
        text-align: right;
    }

    .pieces-table tr.too-many .pieces-input[b-kfdnv18ha5] {
        border-color: #dc3545;
    }

    .pieces-table .cell-error[b-kfdnv18ha5] {
        display: block;
        font-size: 0.75em;
        color: #dc3545;
    }

/* Ponovna izrada uz prijavu: istaknuta, jer pomjera komad na početak rute čim se prijava spremi. */
.remake-option[b-kfdnv18ha5] {
    display: flex;
    align-items: flex-start;
    gap: 0.6em;
    cursor: pointer;
    margin: 0.4em 0 0 0;
}

    .remake-option input[b-kfdnv18ha5] {
        margin-top: 0.25em;
    }

    .remake-option small[b-kfdnv18ha5] {
        display: block;
        color: #6c757d;
    }

/* Cijena uz dugme: ukupan iznos krupno, razlaganje na zahtjev. */
.price-line[b-kfdnv18ha5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1em;
}

.price-label[b-kfdnv18ha5] {
    display: block;
    font-size: 0.8em;
    color: #6c757d;
}

.price-value[b-kfdnv18ha5] {
    font-size: 1.4em;
    font-family: var(--font-medium);
    color: var(--color-danger);
}

.breakdown-toggle[b-kfdnv18ha5] {
    font-size: 0.85em;
    padding: 0;
}

.breakdowns[b-kfdnv18ha5] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(16em, 1fr));
    gap: 0 1.5em;
}

/* Napomena i "Promijeni raspodjelu" u istom redu. */
.section-hint-row[b-kfdnv18ha5] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1em;
}

    .section-hint-row .section-hint[b-kfdnv18ha5] {
        margin-bottom: 0.4em;
    }

.change-pieces[b-kfdnv18ha5] {
    font-size: 0.85em;
    padding: 0;
    white-space: nowrap;
}
/* _content/ArasWeb/Pages/Defects/AddDefectInAdvance.razor.rz.scp.css */
#add-defect-container[b-blkboy57h2] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: center;
    overflow-y: scroll;
}

#add-defect[b-blkboy57h2] {
    width: 50%;
    height: 90%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.add-defect-form[b-blkboy57h2] {
    width: 100%;
    background: white;
    padding: 1em;
    border-radius: 1em;
    margin-bottom: 1em;
}

.btn-danger[b-blkboy57h2] {
    margin-left: auto;
}

.modal-input-box[b-blkboy57h2] {
    margin-bottom: 0.5em;
    position: relative;
}

    .modal-input-box label[b-blkboy57h2] {
        margin-bottom: 0.3em;
        font-family: 'Ubuntu-Light';
        font-size: 0.9em;
    }

#defect-list-header[b-blkboy57h2] {
    background: rgba(217, 83, 79, 0.2);
}

    #defect-list-header span label[b-blkboy57h2],
    #defects-list span label[b-blkboy57h2] {
        width: 15%;
    }

    #defect-list-header .full-text[b-blkboy57h2],
    #defects-list .full-text[b-blkboy57h2] {
        word-break: break-all;
        width: 20%;
    }

    #defect-list-header .quantity[b-blkboy57h2],
    #defects-list .quantity[b-blkboy57h2] {
        width: 7%;
        text-align: center;
    }

#defects-list span[b-blkboy57h2] {
    display: inline-flex;
    align-items: center;
}

#defects-list img[b-blkboy57h2] {
    width: 1.5em;
    height: 1.5em;
    margin-right: 0.5em;
}

.made-by-worker[b-blkboy57h2] {
    color: #d9534f;
    font-family: 'Ubuntu-Medium';
}

#report-btn[b-blkboy57h2] {
    margin-bottom: 1em;
    margin-left: auto;
    margin-right: 1em;
}

.fa-person-circle-exclamation[b-blkboy57h2] {
    margin-right: 0.5em;
}

.search-component[b-blkboy57h2] {
    width: 100%;
    position: relative;
}

#price label[b-blkboy57h2] {
    font-family: 'Ubuntu-Medium';
}

#price span[b-blkboy57h2] {
    color: #dc3545;
    font-family: 'Ubuntu-Medium';
    background: #e9ecef;
}

#search-component[b-blkboy57h2] {
    position: absolute;
    width: 40em;
    height: 20em;
    top: 100%;
    right: 0;
    border-radius: 1em;
    border: 0.1em solid gray;
    padding: 1em;
    background: white;
    z-index: 10000;
}

#close-btn[b-blkboy57h2] {
    width: 100%;
    display: flex;
    justify-content: end;
}

#search-list-wrapper[b-blkboy57h2] {
    width: 100%;
    height: 90%;
    overflow-y: scroll;
}

.search-list[b-blkboy57h2] {
    width: 100%;
    height: auto;
}

    .search-list h6[b-blkboy57h2] {
        font-family: 'Ubuntu-Medium';
        background: #ececec;
        padding: 0.5em;
        border-radius: .5em;
        margin: 0.5em 0;
    }

.search-item[b-blkboy57h2] {
    width: 98%;
    position: relative;
    display: flex;
    justify-content: start;
    margin: 0.3em;
    border-bottom: 0.01em solid lightgray;
    padding: 0.3em;
}

.search-item-field[b-blkboy57h2] {
    width: auto;
    margin-right: 0.8em;
    display: flex;
    flex-direction: column;
    width: 50%;
}

    .search-item-field label[b-blkboy57h2] {
        font-family: 'Ubuntu-Medium';
        word-break: break-all;
    }

    .search-item-field span[b-blkboy57h2] {
        font-family: 'Ubuntu-Light';
        font-size: 0.8em;
    }

#search-placeholder[b-blkboy57h2] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    opacity: 0.8;
}

    #search-placeholder i[b-blkboy57h2] {
        font-size: 6em;
        opacity: 0.7;
        margin-bottom: 0.1em;
    }

    #search-placeholder p[b-blkboy57h2] {
        color: gray;
    }

.btn-item[b-blkboy57h2] {
    display: flex;
    justify-content: end;
    align-items: center;
    margin-left: auto;
}

    .btn-item button[b-blkboy57h2] {
        padding: 0.2em 0.8em;
        border-radius: 0.5em;
    }

.optional[b-blkboy57h2] {
    font-size: 0.9em;
    font-family: 'Ubuntu-Italic';
}
/* _content/ArasWeb/Pages/Defects/DefectDetails.razor.rz.scp.css */
#add-defect-container[b-0dejboo0pj] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: center;
    overflow-y: scroll;
}

#add-defect[b-0dejboo0pj] {
    width: 50%;
    height: 90%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.add-defect-form[b-0dejboo0pj] {
    width: 100%;
    background: white;
    padding: 1em;
    border-radius: 1em;
    margin-bottom: 1em;
}

.btn-danger[b-0dejboo0pj] {
    margin-left: auto;
}

.modal-input-box[b-0dejboo0pj] {
    margin-bottom: 0.5em;
    position: relative;
}

    .modal-input-box label[b-0dejboo0pj] {
        margin-bottom: 0.3em;
        font-family: 'Ubuntu-Light';
        font-size: 0.9em;
    }

#defect-list-header[b-0dejboo0pj] {
    background: rgba(217, 83, 79, 0.2);
}

    #defect-list-header span label[b-0dejboo0pj],
    #defects-list span label[b-0dejboo0pj] {
        width: 15%;
    }

    #defect-list-header .full-text[b-0dejboo0pj],
    #defects-list .full-text[b-0dejboo0pj] {
        word-break: break-all;
        width: 20%;
    }

    #defect-list-header .quantity[b-0dejboo0pj],
    #defects-list .quantity[b-0dejboo0pj] {
        width: 7%;
        text-align: center;
    }

#defects-list span[b-0dejboo0pj] {
    display: inline-flex;
    align-items: center;
}

#defects-list img[b-0dejboo0pj] {
    width: 1.5em;
    height: 1.5em;
    margin-right: 0.5em;
}

.made-by-worker[b-0dejboo0pj] {
    color: #d9534f;
    font-family: 'Ubuntu-Medium';
}

#report-btn[b-0dejboo0pj] {
    margin-bottom: 1em;
    margin-left: auto;
    margin-right: 1em;
}

.fa-person-circle-exclamation[b-0dejboo0pj] {
    margin-right: 0.5em;
}

#price label[b-0dejboo0pj] {
    font-family: 'Ubuntu-Medium';
}

#price span[b-0dejboo0pj] {
    color: #dc3545;
    font-family: 'Ubuntu-Medium';
    background: #e9ecef;
}

#search-component[b-0dejboo0pj] {
    position: absolute;
    width: 40em;
    height: 20em;
    top: 100%;
    right: 0;
    border-radius: 1em;
    border: 0.1em solid gray;
    padding: 1em;
    background: white;
    z-index: 10000;
}

#close-btn[b-0dejboo0pj] {
    width: 100%;
    display: flex;
    justify-content: end;
}

#search-list-wrapper[b-0dejboo0pj] {
    width: 100%;
    height: 90%;
    overflow-y: scroll;
}

.search-list[b-0dejboo0pj] {
    width: 100%;
    height: auto;
}

    .search-list h6[b-0dejboo0pj] {
        font-family: 'Ubuntu-Medium';
        background: #ececec;
        padding: 0.5em;
        border-radius: .5em;
        margin: 0.5em 0;
    }

.search-item[b-0dejboo0pj] {
    width: 98%;
    position: relative;
    display: flex;
    justify-content: start;
    margin: 0.3em;
    border-bottom: 0.01em solid lightgray;
    padding: 0.3em;
}

.search-item-field[b-0dejboo0pj] {
    width: auto;
    margin-right: 0.8em;
    display: flex;
    flex-direction: column;
    width: 50%;
}

    .search-item-field label[b-0dejboo0pj] {
        font-family: 'Ubuntu-Medium';
        word-break: break-all;
    }

    .search-item-field span[b-0dejboo0pj] {
        font-family: 'Ubuntu-Light';
        font-size: 0.8em;
    }

#search-placeholder[b-0dejboo0pj] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    opacity: 0.8;
}

    #search-placeholder i[b-0dejboo0pj] {
        font-size: 6em;
        opacity: 0.7;
        margin-bottom: 0.1em;
    }

    #search-placeholder p[b-0dejboo0pj] {
        color: gray;
    }

.btn-item[b-0dejboo0pj] {
    display: flex;
    justify-content: end;
    align-items: center;
    margin-left: auto;
}

    .btn-item button[b-0dejboo0pj] {
        padding: 0.2em 0.8em;
        border-radius: 0.5em;
    }

.optional[b-0dejboo0pj] {
    font-size: 0.9em;
    font-family: 'Ubuntu-Italic';
}


#buttons[b-0dejboo0pj]{
    width: 100%;
    display: flex;
    justify-content: space-between;
}

#buttons button[b-0dejboo0pj] {
    margin: 0.5em 0;
}

/* Spremanje ostaje desno i kad dugmeta za brisanje nema (Alatničar). */
#buttons .btn-primary[b-0dejboo0pj] {
    margin-left: auto;
}
/* Isti izbor operacije i razlaganje kao na prijavi skarta. */
.scrap-operations[b-0dejboo0pj] {
    display: flex;
    flex-direction: column;
    gap: 0.3em;
    max-height: 14em;
    overflow-y: auto;
    border: 1px solid #ced4da;
    border-radius: 0.5em;
    padding: 0.6em;
    background: white;
}

.scrap-operation[b-0dejboo0pj] {
    display: flex;
    align-items: center;
    gap: 0.6em;
    cursor: pointer;
    margin: 0;
}

    .scrap-operation input[b-0dejboo0pj] {
        cursor: pointer;
    }

    /* Gdje su komadi sada - tu se najčešće i škartira, pa oko to traži prvo. */
    .scrap-operation .op-active[b-0dejboo0pj] {
        font-size: 0.75em;
        color: var(--ar-primary);
        background: #e4eef2;
        border-radius: 0.6em;
        padding: 0.05em 0.6em;
    }

.list-placeholder[b-0dejboo0pj] {
    color: gray;
    font-family: var(--font-italic);
    margin: 0;
}

.scrap-breakdown[b-0dejboo0pj] {
    list-style: none;
    margin: 0.6em 0 0 0;
    padding: 0;
    font-size: 0.85em;
}

    .scrap-breakdown li[b-0dejboo0pj] {
        display: flex;
        justify-content: space-between;
        gap: 1em;
        padding: 0.2em 0;
        color: #6c757d;
    }

    /* #price span boji svaki span u kutiji kao iznos — razlaganje mora ostati obican tekst. */
    #price .scrap-breakdown span[b-0dejboo0pj] {
        background: transparent;
        color: inherit;
        font-family: var(--font-regular);
    }

    .scrap-breakdown li.total[b-0dejboo0pj] {
        border-top: 1px solid #e4eef2;
        margin-top: 0.3em;
        padding-top: 0.4em;
        color: #14425a;
        font-family: var(--font-bold);
    }

.scrap-note[b-0dejboo0pj] {
    font-size: 0.8em;
    font-family: var(--font-italic);
    color: #6c757d;
    margin: 0.4em 0 0 0;
}

/* Isto kao na prijavi: komad za skidanje nije pronađen. */
.scrap-warning[b-0dejboo0pj] {
    font-size: 0.8em;
    font-family: var(--font-italic);
    color: #dc3545;
    margin: 0.4em 0 0 0;
}

/* Ponovna izrada — stoji uz dugmad, odvojeno od forme jer nije polje nego radnja. */
#remake-box[b-0dejboo0pj] {
    width: 100%;
    max-width: 40rem;
    margin: 0 auto 1em auto;
    background: white;
    border-radius: 1em;
    padding: 1em;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1em;
    /* Na uzim ekranima dugme padne ispod teksta umjesto da ga stisne u usku kolonu. */
    flex-wrap: wrap;
}

/* Tekst uzima preostali prostor; bez ovoga ga dugme sa nowrap stisne u usku kolonu. */
.remake-state[b-0dejboo0pj] {
    flex: 1 1 14em;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.3em;
}

.remake-label[b-0dejboo0pj] {
    font-family: var(--font-medium);
    color: #14425a;
}

.remake-hint[b-0dejboo0pj] {
    font-size: 0.8em;
    font-family: var(--font-italic);
    color: #6c757d;
}

#remake-box .badge[b-0dejboo0pj] {
    width: fit-content;
}

#remake-box .btn[b-0dejboo0pj] {
    white-space: nowrap;
}

/* Filed with the report and not editable here: read as a value, not as an input. */
.filed-value[b-0dejboo0pj] {
    background: #e9ecef;
    color: #14425a;
}
/* _content/ArasWeb/Pages/Defects/Defects.razor.rz.scp.css */
#defects-container[b-2fx23tnvky] {
    width: 100%;
    height: 100%;
}

#defects-list-container[b-2fx23tnvky] {
    width: 100%;
}

#defects[b-2fx23tnvky] {
    width: 100%;
    background: white;
    border-radius: 0.5em;
    display: flex;
    flex-direction: column;
}

#defect-list-header[b-2fx23tnvky] {
    background: rgba(217, 83, 79, 0.2);
}

    #defect-list-header span label[b-2fx23tnvky],
    #defects-list span label[b-2fx23tnvky] {
        width: 15%;
    }

    #defect-list-header .full-text[b-2fx23tnvky],
    #defects-list .full-text[b-2fx23tnvky] {
        word-break: break-all;
        width: 25%;
    }

    #defect-list-header .quantity[b-2fx23tnvky],
    #defects-list .quantity[b-2fx23tnvky] {
        width: 7%;
        text-align: center;
    }

#defects-list span[b-2fx23tnvky] {
    display: inline-flex;
    align-items: center;
}

#defects-list img[b-2fx23tnvky] {
    width: 1.5em;
    height: 1.5em;
    margin-right: 0.5em;
}

.made-by-worker[b-2fx23tnvky] {
    color: #d9534f;
    font-family: 'Ubuntu-Medium';
}

#report-btn[b-2fx23tnvky] {
}

.fa-person-circle-exclamation[b-2fx23tnvky]{
    margin-right: 0.5em;
}

.search-component[b-2fx23tnvky]{
    width: 100%;
    position: relative;
}

#price label[b-2fx23tnvky] {
    font-family: 'Ubuntu-Medium';
}

#price span[b-2fx23tnvky] {
    color: #dc3545;
    font-family: 'Ubuntu-Medium';
    background: #e9ecef;
}
/* _content/ArasWeb/Pages/Defects/DefectsInAdvance.razor.rz.scp.css */
#defects-container[b-izmwhcp7kb] {
    width: 100%;
    height: 100%;
}

#defects-list-container[b-izmwhcp7kb] {
    width: 100%;
}

#defects[b-izmwhcp7kb] {
    width: 100%;
    background: white;
    border-radius: 0.5em;
    display: flex;
    flex-direction: column;
}

#defect-list-header[b-izmwhcp7kb] {
    background: rgba(217, 83, 79, 0.2);
}

    #defect-list-header span label[b-izmwhcp7kb],
    #defects-list span label[b-izmwhcp7kb] {
        width: 15%;
    }

    #defect-list-header .full-text[b-izmwhcp7kb],
    #defects-list .full-text[b-izmwhcp7kb] {
        word-break: break-all;
        width: 20%;
    }

    #defect-list-header .quantity[b-izmwhcp7kb],
    #defects-list .quantity[b-izmwhcp7kb] {
        width: 7%;
        text-align: center;
    }

#defects-list span[b-izmwhcp7kb] {
    display: inline-flex;
    align-items: center;
}

#defects-list img[b-izmwhcp7kb] {
    width: 1.5em;
    height: 1.5em;
    margin-right: 0.5em;
}

.made-by-worker[b-izmwhcp7kb] {
    color: #d9534f;
    font-family: 'Ubuntu-Medium';
}

#report-btn[b-izmwhcp7kb] {
}

.fa-person-circle-exclamation[b-izmwhcp7kb] {
    margin-right: 0.5em;
}

.search-component[b-izmwhcp7kb] {
    width: 100%;
    position: relative;
}

#price label[b-izmwhcp7kb] {
    font-family: 'Ubuntu-Medium';
}

#price span[b-izmwhcp7kb] {
    color: #dc3545;
    font-family: 'Ubuntu-Medium';
    background: #e9ecef;
}
/* _content/ArasWeb/Pages/Employees/Employees.razor.rz.scp.css */
#container[b-aelekigvud] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#statistics[b-aelekigvud] {
    width: 20%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#statistics .box[b-aelekigvud] {
    width: 100%;
    height: 35%;
    background: white;
    border-radius: 1em;
    padding: 2em;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 1em 0;
}

    #statistics .box .oi[b-aelekigvud] {
        font-size: 1.5em;
        padding: 1em;
        background: rgba(13, 110, 253, 0.3);
        border-radius: 1em;
    }

    #statistics .box .data[b-aelekigvud] {
        display: flex;
        justify-content: space-between;
        align-items: start;
        flex-direction: column;
        width: 45%;
    }

        #statistics .box .data label[b-aelekigvud] {
            font-size: 0.8em;
            color: grey;
            font-family: var(--font-light);
        }

        #statistics .box .data span[b-aelekigvud] {
            font-size: 2em;
            font-family: var(--font-bold);
        }

#employees-container[b-aelekigvud] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

/* Tabovi stoje iznad kartice, kao na ostalim stranicama. */
#tab-container[b-aelekigvud] {
    width: 100%;
    height: calc(92% - 3.5rem);
    display: flex;
    flex-direction: column;
    background: white;
    border-radius: 1em;
    padding: 1em;
}

.list-wrapper[b-aelekigvud]{
    height: 95%;
}

    .list-wrapper img[b-aelekigvud] {
        width: 1.5em;
        height: 1.5em;
        margin-right: 0.5em;
    }

    .list-wrapper li span[b-aelekigvud],
    .list-wrapper .list-header span[b-aelekigvud] {
        width: 80%;
    }

    .list-wrapper li span label[b-aelekigvud],
    .list-wrapper .list-header span label[b-aelekigvud]{
        width: 32%;
    }

        
        .list-wrapper li span label i[b-aelekigvud] {
            margin-right: 0.5em;
        }


.employees .list-header span[b-aelekigvud], .employees .list-item span[b-aelekigvud] {
    width: 65%;
}

.admin[b-aelekigvud] {
    border: 0.1em solid rgb(2, 117, 216);
    background: rgba(2, 117, 216, 0.1);
    color: rgb(2, 117, 216);
}

.technology[b-aelekigvud],
.mentor[b-aelekigvud],
.sales_representative[b-aelekigvud]{
    border: 0.1em solid rgb(92, 184, 92);
    background: rgba(92, 184, 92, 0.1);
    color: rgb(92, 184, 92);
}

.production[b-aelekigvud] {
    border: 0.1em solid rgb(10, 78, 112);
    background: rgba(10, 78, 112, 0.1);
    color: rgb(10, 78, 112);
}

.control[b-aelekigvud] {
    border: 0.1em solid rgb(240, 173, 78);
    background: rgba(240, 173, 78, 0.1);
    color: rgb(240, 173, 78);
}

.toolbox[b-aelekigvud] {
    border: 0.1em solid rgb(91, 192, 222);
    background: rgba(91, 192, 222, 0.1);
    color: rgb(91, 192, 222);
}

.hygiene[b-aelekigvud] {
    border: 0.1em solid rgb(142, 110, 196);
    background: rgba(142, 110, 196, 0.1);
    color: rgb(142, 110, 196);
}

.user-role[b-aelekigvud] {
    padding: 0.3em 0.8em;
    border-radius: 0.5em;
    font-size: 0.8em;
    font-family: var(--font-bold);
    text-align: center;
}


#add-user-btn[b-aelekigvud] {
    margin-left: auto;
    margin-right: 0.5em;
}

/*
    MODAL:
*/
form[b-aelekigvud]{
    background: pink;
}

.add-user-container[b-aelekigvud] {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    padding: 5em;
    overflow-y: scroll;
    align-items: center;
}

.add-user-container .disabled[b-aelekigvud] {
    background: var(--color-bg-tab-inactive);
}

.add-user-input[b-aelekigvud]{
    display: flex;
    flex-direction: column;
    width: 50%;
    padding: 0 2em;
    margin-bottom: 1em;
}

.note[b-aelekigvud] {
    display: flex;
    flex-direction: column;
    padding: 0 2em;
    width: 100%;
    font-size: 0.9em;
    font-style: italic;
    color: grey;
}

.undefined[b-aelekigvud]{
    font-family: var(--font-italic);
    opacity: 0.8;
    font-size: 0.8em;
}
/* Korisničko ime sa stanjem prijave ispod njega (MFA, zaključan). */
.list-wrapper li span label.user-name-cell[b-aelekigvud] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.3em;
}

.user-flags[b-aelekigvud] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3em;
}

.user-flag[b-aelekigvud] {
    display: inline-flex;
    align-items: center;
    gap: 0.35em;
    padding: 0.15em 0.6em;
    border-radius: 1em;
    font-size: 0.75em;
    font-family: var(--font-bold);
    line-height: 1.5;
    white-space: nowrap;
    /* Čip, ne dugme: bez globalnog min-height od 44px iz site.css. */
    min-height: 0;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

    .list-wrapper li span label .user-flag i[b-aelekigvud] {
        margin-right: 0;
    }

.user-flag.mfa[b-aelekigvud] {
    border: 0.1em solid rgba(92, 184, 92, 0.6);
    background: rgba(92, 184, 92, 0.1);
    color: #3d8b3d;
}

    .user-flag.mfa:hover[b-aelekigvud] {
        background: rgba(92, 184, 92, 0.22);
    }

.user-flag.locked[b-aelekigvud] {
    border: 0.1em solid rgba(217, 83, 79, 0.6);
    background: rgba(217, 83, 79, 0.08);
    color: #c9302c;
}

    .user-flag.locked:hover[b-aelekigvud] {
        background: rgba(217, 83, 79, 0.18);
    }

.user-flag-action[b-aelekigvud] {
    font-style: normal;
    font-family: var(--font-light);
    padding-left: 0.35em;
    border-left: 0.1em solid currentColor;
    opacity: 0.85;
}

.user-flag:hover .user-flag-action[b-aelekigvud] {
    text-decoration: underline;
    opacity: 1;
}

.modal-note[b-aelekigvud] {
    font-size: 0.85em;
    color: #6c757d;
    margin-top: 0.5em;
}

/* _content/ArasWeb/Pages/Invoices/CreateInvoice.razor.rz.scp.css */
#create-invoice-container[b-0komme4zkp] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#create-invoice-form[b-0komme4zkp] {
    background: white;
    border-radius: 0.5em;
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow-y: auto;
}

.form-body[b-0komme4zkp] {
    flex: 1;
    padding: 1.5em 2em;
    display: flex;
    flex-direction: column;
    width: 100%;
}

.form-actions[b-0komme4zkp] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 0.75em;
    padding: 1em 2em;
    background: #f8f9fa;
    border-top: 1px solid #e4eef2;
    border-bottom-left-radius: 0.5em;
    border-bottom-right-radius: 0.5em;
}

/* Invoice header two-column layout */
.invoice-form-grid[b-0komme4zkp] {
    display: flex;
    column-gap: 1.5em;
    margin-bottom: 1em;
}

.invoice-form-col[b-0komme4zkp] {
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* Input section boxes (mirrors modal .modal-input-box) */
.modal-input-box[b-0komme4zkp] {
    display: flex;
    flex-direction: column;
    margin-bottom: 1em;
}

    .modal-input-box label[b-0komme4zkp] {
        margin-bottom: 0.3em;
        font-family: var(--font-light);
        font-size: 0.9em;
    }

.required-star[b-0komme4zkp] {
    color: #dc3545;
    font-weight: bold;
}

/* Order picker */
.order-picker-header[b-0komme4zkp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.5em;
}

.order-picker-label[b-0komme4zkp] {
    font-family: var(--font-medium);
    font-size: 1em;
    font-weight: 600;
    color: #14425a;
    margin-bottom: 0 !important;
}

.order-count-badge[b-0komme4zkp] {
    background: #14425a;
    color: white;
    font-size: 0.8em;
    padding: 0.2em 0.7em;
    border-radius: 1em;
    font-family: var(--font-medium);
    white-space: nowrap;
}

.order-filter-row[b-0komme4zkp] {
    display: flex;
    gap: 0.5em;
    margin-bottom: 0.5em;
}

.order-search[b-0komme4zkp] {
    flex: 1;
}

.order-date[b-0komme4zkp] {
    width: 145px;
    flex-shrink: 0;
}
/* _content/ArasWeb/Pages/Invoices/InvoiceDetails.razor.rz.scp.css */
#invoice-details-container[b-8oa6bds3tu] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 1.5em;
    overflow-y: auto;
    padding: 1em;
}

#invoice[b-8oa6bds3tu] {
    background: white;
    border-radius: 0.5em;
    padding: 2em;
    display: flex;
    flex-direction: column;
    gap: 1.5em;
}

#invoice-header[b-8oa6bds3tu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1em;
}

#invoice-header h4[b-8oa6bds3tu] {
    margin: 0;
    color: #333;
}

.invoice-info-grid[b-8oa6bds3tu] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1em;
}

.info-item[b-8oa6bds3tu] {
    display: flex;
    flex-direction: column;
    gap: 0.5em;
}

.info-item label[b-8oa6bds3tu] {
    font-weight: 600;
    color: #555;
    font-size: 0.9em;
}

.info-item input[b-8oa6bds3tu],
.info-item select[b-8oa6bds3tu] {
    padding: 0.5em;
}

#invoice-delivery[b-8oa6bds3tu],
#invoice-articles[b-8oa6bds3tu] {
    padding-top: 1.25em;
    border-top: 1px solid #e4eef2;
    display: flex;
    flex-direction: column;
    gap: 0.75em;
}

.section-title[b-8oa6bds3tu] {
    font-weight: 600;
    color: #14425a;
    font-size: 1em;
    margin-bottom: 0.25em;
}

.delivery-grid[b-8oa6bds3tu] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 1em;
    align-items: end;
}

#invoice-actions[b-8oa6bds3tu] {
    display: flex;
    gap: 1em;
    margin-top: 1em;
    padding-top: 1em;
    border-top: 1px solid #e0e0e0;
}

#invoice-actions button[b-8oa6bds3tu] {
    padding: 0.75em 1.5em;
    display: flex;
    align-items: center;
    gap: 0.5em;
}

#invoice-attachments[b-8oa6bds3tu] {
    padding-top: 1.25em;
    border-top: 1px solid #e4eef2;
    display: flex;
    flex-direction: column;
    gap: 0.75em;
}

.attachment-upload[b-8oa6bds3tu] {
    align-self: flex-start;
    cursor: pointer;
}

/* Vlastito dugme umjesto sistemskog birača: InputFile se sakriva, klik hvata labela.
   ::deep je obavezan — InputFile je komponenta, pa izolovana CSS ne doseže njen <input>
   i bez toga nativni birač ostane vidljiv pored dugmeta. Isto kao u ArticleInput. */
[b-8oa6bds3tu] .attachment-upload input[type="file"] {
    display: none !important;
}

.attachment-upload-button[b-8oa6bds3tu] {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    padding: 0.5em 1em;
    border-radius: 0.35em;
    background: #e4eef2;
    color: #14425a;
    font-size: 0.9em;
}

.attachment-upload-button:hover[b-8oa6bds3tu] {
    background: #d4e4ea;
}

.attachment-empty[b-8oa6bds3tu] {
    margin: 0;
    color: #6c757d;
    font-size: 0.9em;
}

.attachment-list[b-8oa6bds3tu] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.4em;
}

.attachment-row[b-8oa6bds3tu] {
    display: flex;
    align-items: center;
    gap: 0.75em;
    padding: 0.5em 0.75em;
    border: 1px solid #ddd;
    border-radius: 0.35em;
}

.attachment-row .pdf-icon[b-8oa6bds3tu] {
    color: #d9534f;
    font-size: 1.25em;
}

.attachment-row .img-icon[b-8oa6bds3tu] {
    color: var(--ar-primary);
    font-size: 1.25em;
}

/* Ime uzima slobodan prostor i skraćuje se, da dugmad ostanu na istom mjestu u svakom redu. */
.attachment-name[b-8oa6bds3tu] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #14425a;
}

.attachment-meta[b-8oa6bds3tu] {
    color: #6c757d;
    font-size: 0.85em;
    white-space: nowrap;
}

@media (max-width: 700px) {
    .attachment-row[b-8oa6bds3tu] {
        flex-wrap: wrap;
    }

    .attachment-meta[b-8oa6bds3tu] {
        width: 100%;
        white-space: normal;
    }
}
/* _content/ArasWeb/Pages/Invoices/Invoices.razor.rz.scp.css */
#invoices[b-uume72lums] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#invoices-container[b-uume72lums] {
    display: flex;
    flex-direction: column;
    width: 100%;
    border-radius: 0.5em;
    background: white;
    padding: 1em 0;
}

#invoice-filters[b-uume72lums] {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.5em;
    width: 70%;
    padding: 0 1em;
    font-family: var(--font-light);
    font-size: 0.9em;
}

.filter-box[b-uume72lums] {
    margin-right: 1em;
    display: flex;
    flex-direction: column;
}

    .filter-box label[b-uume72lums] {
        margin-bottom: 0.5em;
    }

    .filter-box select[b-uume72lums] {
        width: 15em;
        padding: 0.5em 0.2em;
    }

    .filter-box img[b-uume72lums] {
        width: 1em;
        height: 1em;
        margin: 0 0.5em;
    }

#invoices-list[b-uume72lums] {
    width: 100%;
}

.invoice-actions[b-uume72lums] {
    display: flex;
    align-items: center;
    gap: 0.5em;
}

.invoice-form-grid[b-uume72lums] {
    display: flex;
    column-gap: 1.5em;
}

.invoice-form-col[b-uume72lums] {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.required-star[b-uume72lums] {
    color: #dc3545;
    font-weight: bold;
}

.order-picker-header[b-uume72lums] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.5em;
}

.order-picker-label[b-uume72lums] {
    font-family: var(--font-medium);
    font-size: 1em;
    font-weight: 600;
    color: #14425a;
    margin-bottom: 0 !important;
}

.order-count-badge[b-uume72lums] {
    background: #14425a;
    color: white;
    font-size: 0.8em;
    padding: 0.2em 0.7em;
    border-radius: 1em;
    font-family: var(--font-medium);
    white-space: nowrap;
}

.order-filter-row[b-uume72lums] {
    display: flex;
    gap: 0.5em;
    margin-bottom: 0.5em;
}

.order-search[b-uume72lums] {
    flex: 1;
}

.order-date[b-uume72lums] {
    width: 145px;
    flex-shrink: 0;
}
/* _content/ArasWeb/Pages/ItemsBuying/AddMaterial.razor.rz.scp.css */
/* Prijedlog narudžbe sa skladišta materijala, iznad forme stavke. */
.suggestion-note[b-k4x2ui4ol4] {
    display: flex;
    gap: 0.7em;
    align-items: flex-start;
    margin: 0;
    padding: 0.8em 1em;
    border-left: 4px solid var(--color-primary);
    border-radius: 0.5em;
    background: #f0f7fd;
    color: var(--color-text-dark);
    font-size: 0.92em;
}

    .suggestion-note i[b-k4x2ui4ol4] {
        margin-top: 0.2em;
        color: var(--color-primary);
    }

    .suggestion-note b[b-k4x2ui4ol4] {
        font-family: var(--font-medium);
        font-weight: normal;
    }

/* Stavka s radnog naloga: obavijest i, ako je upisana, napomena za rezanje jedna ispod druge. */
.work-order-notes[b-k4x2ui4ol4] {
    display: flex;
    flex-direction: column;
    gap: 0.7em;
}
/* _content/ArasWeb/Pages/ItemsBuying/AddOther.razor.rz.scp.css */
h5[b-pih1dzgw3r] {
    color: var(--color-sidebar-start);
    margin-bottom: 1.5em;
}

.container[b-pih1dzgw3r] {
    background: white;
    padding: 2em;
    border-radius: 1em;
    width: 100%;
}

.input-row[b-pih1dzgw3r] {
    display: flex;
    width: 100%;
    margin-bottom: 1em;
}

.input-box[b-pih1dzgw3r] {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: flex-start;
    width: 100%;
}

.input-box label[b-pih1dzgw3r] {
    width: 100%;
    margin-bottom: 0.5em;
    font-family: var(--font-light);
    color: var(--color-text-dark);
}

.input-box .form-control[b-pih1dzgw3r] {
    width: 100%;
}

.input-box textarea[b-pih1dzgw3r] {
    resize: none;
}

button i[b-pih1dzgw3r] {
    margin-right: 0.5em;
}

/* Sifarnik i slobodan unos pune isto polje, pa prekidac stoji uz njegovu labelu
   umjesto da bude zasebno pitanje iznad forme. */
.source-switch[b-pih1dzgw3r] {
    display: inline-flex;
    align-self: flex-start;
    background: var(--color-bg-surface);
    border-radius: 0.45em;
    padding: 0.12em;
    margin-bottom: 0.5em;
}

    .source-switch button[b-pih1dzgw3r] {
        border: none;
        background: transparent;
        border-radius: 0.35em;
        /* site.css drzi svako dugme na 44px visine; prekidac nije dugme za akciju pa se toga oslobadja. */
        min-height: 0;
        padding: 0.15em 0.65em;
        font-family: var(--font-light);
        font-size: 0.78em;
        line-height: 1.5;
        color: var(--color-text-muted);
        transition: background 0.15s ease, color 0.15s ease;
    }

        .source-switch button:hover[b-pih1dzgw3r] {
            color: var(--color-text-dark);
        }

        .source-switch button.active[b-pih1dzgw3r] {
            background: var(--color-bg-card);
            color: var(--color-text-dark);
            font-family: var(--font-medium);
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
        }

.field-hint[b-pih1dzgw3r] {
    margin-top: 0.4em;
    font-family: var(--font-italic);
    font-size: 0.8em;
    color: var(--color-text-muted);
}

/* Padajuca lista typeahead-a mora prekriti polja ispod, inace se crta iza njih. */
.typeahead-box[b-pih1dzgw3r] {
    position: relative;
    z-index: 200;
    width: 100%;
}

    .typeahead-box[b-pih1dzgw3r]  .blazored-typeahead,
    .typeahead-box[b-pih1dzgw3r]  .blazored-typeahead__input {
        width: 100%;
    }
/* _content/ArasWeb/Pages/ItemsBuying/CuttingNoteNotice.razor.rz.scp.css */
/* Napomena za rezanje s radnog naloga iznad stavke materijala, da je nabava ne previdi. */
.cutting-note[b-yew48ht99c] {
    display: flex;
    gap: 0.7em;
    align-items: flex-start;
    padding: 0.8em 1em;
    border-left: 4px solid #f0ad4e;
    border-radius: 0.5em;
    background: #fff4e0;
    color: var(--color-text-dark);
}

    .cutting-note i[b-yew48ht99c] {
        margin-top: 0.2em;
        color: #e08e0b;
        font-size: 1.1em;
    }

    .cutting-note b[b-yew48ht99c] {
        font-family: var(--font-medium);
        font-weight: normal;
        font-size: 0.92em;
    }

    .cutting-note p[b-yew48ht99c] {
        margin: 0.2em 0 0;
        font-family: var(--font-medium);
        font-size: 1.05em;
        white-space: pre-line;
        word-break: break-word;
    }

        .cutting-note p:not(:last-child)[b-yew48ht99c] {
            margin-bottom: 0.6em;
        }
/* _content/ArasWeb/Pages/ItemsBuying/ItemBuyingDetails.razor.rz.scp.css */
#offer-details-container[b-f2te7fiajq] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
}

#offer[b-f2te7fiajq],
#articles-container[b-f2te7fiajq] {
    height: 100%;
    display: flex;
    flex-direction: column;
    padding: 1em;
    background: white;
    border-radius: 0.5em;
}

#offer[b-f2te7fiajq] {
    width: 26%;
    padding-right: 2em;
    overflow-y: auto;
    min-height: 0;
    /* The content <article> in MainLayout isn't height-bounded, so height:100% here
       collapses to auto and overflow-y can't engage. Cap the sidebar to the viewport
       minus the fixed 114px top-row header so it scrolls internally and the action
       buttons never spill out of the card (incl. when the page is zoomed in). */
    max-height: calc(100vh - 130px);
}

#offer-name[b-f2te7fiajq],
.select-values[b-f2te7fiajq] {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: .5em;
}

    #offer-name label[b-f2te7fiajq], .select-values label[b-f2te7fiajq] {
        font-family: 'Ubuntu-Light';
        margin-bottom: 0.3em;
    }

/* Slightly tighter inputs so the extra feature-flag fields (broj potvrde, rok
   isporuke, certifikat) fit in the card without forcing a scroll on a normal
   screen. The max-height scroll on #offer stays as a safety net only. */
#offer .form-control[b-f2te7fiajq] {
    padding-top: 0.3em;
    padding-bottom: 0.3em;
}

#offer button[b-f2te7fiajq] {
    width: 100%;
    margin-bottom: 0.4em;
    padding-top: 0.35em;
    padding-bottom: 0.35em;
    flex-shrink: 0;
}

    #offer button i[b-f2te7fiajq] {
        margin-right: 0.3em;
    }

#offer #generate-offer-pdf[b-f2te7fiajq],
#offer #generate-offer-excel[b-f2te7fiajq] {
    font-family: 'Ubuntu-Medium';
    margin-bottom: 0.5em;
    border: 0.01em solid gray;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
    background: white;
    color: black;
}

    #offer #generate-offer-pdf img[b-f2te7fiajq],
    #offer #generate-offer-excel img[b-f2te7fiajq] {
        width: 1.5em;
        height: 1.5em;
        margin-right: 0.5em;
    }

#generate-offer-excel[b-f2te7fiajq] {
    border: 0.1em solid #5cb85c;
    color: #3d783d;
}


#articles-container[b-f2te7fiajq] {
    width: 71%;
    padding-left: 2em;
}

#articles-list[b-f2te7fiajq] {
    width: 100%;
    height: 75%;
    margin-bottom: 3em;
}

.add-article-btn[b-f2te7fiajq] {
    justify-self: end;
    margin-left: auto;
    margin-right: 2em;
    margin-bottom: 1em;
}

[b-f2te7fiajq] #empty-list img {
    width: 18em;
}

.article-item-details[b-f2te7fiajq] {
    width: 65%;
}

    .article-item-details label[b-f2te7fiajq] {
        width: 50%;
    }

    .article-item-details .dimensions[b-f2te7fiajq] {
        width: 30%;
        font-size: 0.9em;
        color: #6c757d;
    }

/* Kod materijala red nosi pet kolona umjesto tri: dva certifikata (3.1 i RoHS/REACH). Certifikat je
   jedna mala pilula (naziv fajla i ko ga je dodao su u tooltipu), pa su te dvije kolone uske, a ostatak
   reda dobija mjesto. Celija je zasebna komponenta, pa sirina ide kroz ::deep. */
.article-item-details.with-certificate[b-f2te7fiajq] {
    width: 82%;
    gap: 0.75em;
}

    .article-item-details.with-certificate > label[b-f2te7fiajq] {
        width: 21%;
    }

    .article-item-details.with-certificate .dimensions[b-f2te7fiajq] {
        width: 18%;
    }

    .article-item-details.with-certificate .date-and-user[b-f2te7fiajq] {
        width: 20%;
    }

    .article-item-details.with-certificate[b-f2te7fiajq]  .certificate-col {
        width: 16%;
        flex-shrink: 0;
        min-width: 0;
    }

    /* "RoHS/REACH" je jedna duga rijec: lomi se samo iza kose crte (<wbr> u zaglavlju), ne usred nje. */
    .list-header .article-item-details.with-certificate .certificate-col[b-f2te7fiajq] {
        font-size: 0.9em;
        overflow-wrap: normal;
    }

.remove-article-btn[b-f2te7fiajq] {
    margin-right: 0.5em;
    color: #d9534f;
    cursor: pointer;
}

.page-info[b-f2te7fiajq] {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.cancel-offer-btn[b-f2te7fiajq] {
    cursor: pointer !important;
    background: #dc3545;
    font-size: 0.9em;
    padding: 0.3em 0.8em;
    color: white;
    border-radius: 0.5em;
    margin-left: auto;
}

#material-certificate-section[b-f2te7fiajq],
#customer-order-confirmation[b-f2te7fiajq] {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: .5em;
}

    #material-certificate-section > label[b-f2te7fiajq],
    #customer-order-confirmation > label:first-child[b-f2te7fiajq] {
        font-family: 'Ubuntu-Light';
        margin-bottom: 0.3em;
    }

.certificate-upload-label[b-f2te7fiajq] {
    cursor: pointer;
    display: inline-block;
    width: 100%;
}

.file-input[b-f2te7fiajq] {
    display: none;
}

.certificate-upload-button[b-f2te7fiajq] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4em;
    padding: 0.4em 0.6em;
    border: 1px dashed #14425a;
    border-radius: 0.4em;
    font-size: 0.8em;
    color: #14425a;
    background: #e4eef2;
    transition: background 0.15s;
}

    .certificate-upload-button:hover[b-f2te7fiajq] {
        background: #cddde5;
    }

.certificate-preview[b-f2te7fiajq] {
    display: flex;
    align-items: center;
    gap: 0.4em;
    margin-top: 0.5em;
    padding: 0.4em 0.5em;
    background: #f8f9fa;
    border-radius: 0.4em;
    border: 1px solid #dee2e6;
}

.certificate-icon[b-f2te7fiajq] {
    font-size: 1.3em;
    flex-shrink: 0;
}

.pdf-icon[b-f2te7fiajq] {
    color: #d9534f;
}

.img-icon[b-f2te7fiajq] {
    color: var(--ar-primary);
}

.word-icon[b-f2te7fiajq] {
    color: #2b579a;
}

.certificate-filename[b-f2te7fiajq] {
    flex: 1;
    font-size: 0.78em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #6c757d;
}

.certificate-download-btn[b-f2te7fiajq] {
    flex-shrink: 0;
    font-size: 0.75em;
    padding: 0.2em 0.5em;
}

#delivered-order[b-f2te7fiajq] {
    width: 100%;
    display: flex;
    justify-content: end;
    align-items: center;
    flex-direction: column;
    opacity: 0.9;
    font-size: 0.8em;
    margin-bottom: 1em;
}

    #delivered-order label[b-f2te7fiajq] {
        border-radius: 2em;
        width: 100%;
        padding: 0.3em 1.5em;
        word-break: break-all;
        font-family: 'Ubuntu-Medium';
        display: flex;
        justify-content: center;
        align-items: center;
        background: rgba(205, 254, 194, 0.8);
        margin-bottom: 0.5em;
    }

    #delivered-order i[b-f2te7fiajq] {
        margin-right: 0.5em;
    }

    #delivered-order span[b-f2te7fiajq] {
        opacity: 0.8;
        font-size: 0.85em;
    }

/* Prepisano iz ItemsBuying.razor.css — izolacija stilova ne dijeli pravila između komponenti. */
.supplier-filter-note[b-f2te7fiajq] {
    display: block;
    margin-top: 0.35em;
    font-family: var(--font-italic);
    font-size: 0.75em;
    color: var(--color-text-muted);
}

/* Potvrda narudžbe od kupca: ikona, naziv, preuzimanje i uklanjanje u jednom redu. */
.confirmation-card[b-f2te7fiajq] {
    display: flex;
    align-items: center;
    gap: 0.4em;
    padding: 0.4em 0.5em;
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 0.4em;
    min-width: 0;
}

/* Dugme izgleda kao link: "#offer button" i globalni "button" mu inače daju punu širinu,
   44px visine i centriran tekst. */
#offer .confirmation-filename[b-f2te7fiajq] {
    flex: 1;
    min-width: 0;
    min-height: 0;
    width: auto;
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    display: block;
    text-align: left;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.85em;
    color: #14425a;
}

    #offer .confirmation-filename:hover[b-f2te7fiajq],
    #offer .confirmation-filename:focus-visible[b-f2te7fiajq] {
        color: var(--ar-primary-hover);
        text-decoration: underline;
    }

/* "#offer button" širi svako dugme kartice na punu širinu, a globalni "button" mu daje 44px
   visine - ovdje su to ikonice uz naziv fajla. Padding im daje površinu za klik. */
#offer .confirmation-icon-btn[b-f2te7fiajq] {
    width: auto;
    min-height: 0;
    margin: 0;
    padding: 0.3em;
    border: 0;
    border-radius: 0.3em;
    background: none;
    color: var(--ar-primary);
    flex-shrink: 0;
}

    #offer .confirmation-icon-btn i[b-f2te7fiajq] {
        margin-right: 0;
    }

    #offer .confirmation-icon-btn:hover[b-f2te7fiajq] {
        color: #14425a;
        background: #e4eef2;
    }

#offer .confirmation-remove-btn[b-f2te7fiajq] {
    color: #d9534f;
}

    #offer .confirmation-remove-btn:hover[b-f2te7fiajq] {
        color: #b52b27;
        background: #fbe3e2;
    }

.confirmation-note[b-f2te7fiajq] {
    margin-top: 0.3em;
    font-size: 0.78em;
    color: #6c757d;
}

#offer .confirmation-loading[b-f2te7fiajq] {
    opacity: 0.6;
    cursor: progress;
}
/* _content/ArasWeb/Pages/ItemsBuying/ItemsBuying.razor.rz.scp.css */
#offers[b-s36c1fcddi] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#offers-container[b-s36c1fcddi] {
    width: 100%;
    border-radius: 0.5em;
    padding: 1em 0;
}

#offer-filters[b-s36c1fcddi] {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.5em;
    width: 100%;
    padding: 0 1em;
    font-family: var(--font-light);
    font-size: 0.9em;
}

.filter-box[b-s36c1fcddi] {
    margin-right: 1em;
    display: flex;
    flex-direction: column;
}

    .filter-box label[b-s36c1fcddi] {
        margin-bottom: 0.5em;
    }

    .filter-box select[b-s36c1fcddi] {
        width: 15em;
        padding: 0.5em 0.2em;
    }

    .filter-box img[b-s36c1fcddi] {
        width: 1em;
        height: 1em;
        margin: 0 0.5em;
    }

#offers-list[b-s36c1fcddi] {
    width: 100%;
}

#create-offer-btn[b-s36c1fcddi] {
}

    #create-offer-btn i[b-s36c1fcddi] {
        margin-right: 0.5em;
    }

.delivery-status[b-s36c1fcddi] {
    margin-top: 0.5em;
}

    .delivery-status span[b-s36c1fcddi] {
        border-radius: 2em;
        width: auto;
        padding: 0.3em 1.5em;
        word-break: break-all;
        font-family: var(--font-medium);
        font-size: 0.8em;
        justify-content: center;
        width: 11em;
    }

.delivery-status img[b-s36c1fcddi] {
    width: 1.2em;
    height: 1.2em;
    margin-right: 0.5em;
}

.delivered span[b-s36c1fcddi] {
    background: rgba(205, 254, 194, 0.8)
}

.not-delivered span[b-s36c1fcddi] {
    background: rgba(236, 236, 236, 0.8)
}

/* Objasnjava zasto je lista kraca nego sto korisnik ocekuje. */
.supplier-filter-note[b-s36c1fcddi] {
    display: block;
    margin-top: 0.35em;
    font-family: var(--font-italic);
    font-size: 0.75em;
    color: var(--color-text-muted);
}

/* Prijedlog narudžbe sa skladišta materijala. */
.suggestion-note[b-s36c1fcddi] {
    display: flex;
    gap: 0.7em;
    align-items: flex-start;
    margin-bottom: 1em;
    padding: 0.7em 0.9em;
    border-left: 4px solid var(--color-primary);
    border-radius: 0.3em;
    background: #f0f7fd;
    color: var(--color-text-dark);
    font-size: 0.9em;
}

    .suggestion-note i[b-s36c1fcddi] {
        margin-top: 0.2em;
        color: var(--color-primary);
    }

    .suggestion-note b[b-s36c1fcddi] {
        font-family: var(--font-medium);
        font-weight: normal;
    }

/* Grupna narudžba sa skladišta: stavke s količinom koja se smije promijeniti. */
.bulk-lines[b-s36c1fcddi] {
    display: flex;
    flex-direction: column;
    margin-bottom: 1em;
    max-height: 18em;
    overflow-y: auto;
}

.bulk-line[b-s36c1fcddi] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 0.4em 0.8em;
    align-items: center;
    padding: 0.5em 0;
    border-bottom: 1px solid var(--color-border-light);
    font-size: 0.9em;
}

    .bulk-line b[b-s36c1fcddi] {
        font-family: var(--font-medium);
        font-weight: normal;
    }

    .bulk-line small[b-s36c1fcddi] {
        display: block;
        color: var(--color-text-muted);
    }

.bulk-pieces[b-s36c1fcddi] {
    display: inline-flex;
    align-items: center;
    gap: 0.35em;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

    .bulk-pieces input[b-s36c1fcddi] {
        width: 4.5em;
        padding: 0.2em 0.4em;
    }

.bulk-remove[b-s36c1fcddi] {
    border: none;
    background: transparent;
    color: var(--color-text-muted);
    padding: 0.2em 0.4em;
}

    .bulk-remove:hover[b-s36c1fcddi] {
        color: var(--color-danger, #d9534f);
    }

@media (max-width: 600px) {
    .bulk-line[b-s36c1fcddi] {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .bulk-pieces[b-s36c1fcddi] {
        grid-column: 1;
        white-space: normal;
    }
}

/* -- Materijali: narudžbe ili naručen materijal s radnih naloga (MAS-56) -- */

#tabs .pending-count[b-s36c1fcddi],
#tabs .tab-option-active .pending-count[b-s36c1fcddi] {
    background: #f0ad4e;
    color: white;
}

#material-views[b-s36c1fcddi] {
    display: flex;
    gap: var(--ar-space-2);
}

    #material-views .view-option[b-s36c1fcddi] {
        min-height: 2.4em;
        padding: 0.3em 1em;
        border-radius: 999px;
        background: white;
        color: #14425a;
        border: 0.1em solid #e4eef2;
        font-family: 'Ubuntu-Light';
        gap: 0.5em;
    }

        #material-views .view-option.active[b-s36c1fcddi] {
            background: #14425a;
            color: white;
            border-color: #14425a;
            font-family: 'Ubuntu-Medium';
        }

    #material-views .view-count[b-s36c1fcddi] {
        font-size: 0.8em;
        padding: 0.1em 0.6em;
        border-radius: 999px;
        background: #f0ad4e;
        color: white;
        font-family: 'Ubuntu-Medium';
    }
/* _content/ArasWeb/Pages/ItemsBuying/MaterialCertificateCell.razor.rz.scp.css */
/* Sirinu kolone odreduje red na stranici; ovdje je samo sadrzaj celije.
   Globalno pravilo ".list-wrapper ul li span" iz site.css hvata i ove span-ove (sirina 90%,
   space-between), pa se to ovdje eksplicitno resetuje. */
.certificate-col[b-33ludzs35e] {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    min-width: 0;
}

/* Priložen certifikat i prazno mjesto za njega su iste visine i oblika, pa kolona stoji poravnata. */
.certificate-pill[b-33ludzs35e],
.certificate-add[b-33ludzs35e] {
    height: 1.9em;
    border-radius: 1em;
    font-size: 0.85em;
}

.certificate-pill[b-33ludzs35e] {
    display: inline-flex;
    width: auto;
    justify-content: flex-start;
    align-items: stretch;
    flex-shrink: 0;
    border: 1px solid #d7e3e8;
    background: #f5f9fb;
    overflow: hidden;
}

.certificate-segment[b-33ludzs35e] {
    display: flex;
    align-items: center;
    padding: 0 0.5em;
    color: var(--ar-primary);
    cursor: pointer;
    transition: background 0.15s;
}

    .certificate-segment + .certificate-segment[b-33ludzs35e] {
        border-left: 1px solid #d7e3e8;
    }

    .certificate-segment:hover[b-33ludzs35e] {
        background: #e4eef2;
        color: #14425a;
    }

    .certificate-segment.busy[b-33ludzs35e] {
        cursor: progress;
    }

    .certificate-segment.pdf-icon[b-33ludzs35e] {
        color: #d9534f;
        font-size: 1.15em;
    }

    .certificate-segment.img-icon[b-33ludzs35e] {
        color: var(--ar-primary);
        font-size: 1.15em;
    }

    /* Same size as the file icon it stands in for, so the pill keeps its width while a file is fetched. */
    .certificate-segment.certificate-open.fa-spinner[b-33ludzs35e] {
        font-size: 1.15em;
    }

/* Brisanje je prigusenije od ostalih — uz kantu za brisanje stavke desno ne smije izgledati isto. */
.certificate-remove[b-33ludzs35e] {
    color: #6c757d;
}

    .certificate-remove:hover[b-33ludzs35e] {
        color: #d9534f;
    }

.certificate-add[b-33ludzs35e] {
    display: inline-flex;
    width: auto;
    flex-shrink: 0;
    align-items: center;
    gap: 0.4em;
    padding: 0 0.8em;
    margin-bottom: 0;
    border: 1px dashed #9fb8c4;
    color: #14425a;
    background: white;
    white-space: nowrap;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}

    .certificate-add:hover[b-33ludzs35e] {
        background: #e4eef2;
        border-color: #14425a;
    }

    .certificate-add i[b-33ludzs35e] {
        font-size: 0.85em;
    }
/* _content/ArasWeb/Pages/ItemsBuying/MaterialInput.razor.rz.scp.css */
#order-tool-box[b-n41bn196pc] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}

h5[b-n41bn196pc] {
    color: var(--color-sidebar-start);
}

h4[b-n41bn196pc] {
    text-align: center;
}

#order-tool[b-n41bn196pc] {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

#tool-info[b-n41bn196pc] {
    flex-direction: column;
    background: white;
    padding: 1em;
    border-radius: 1em;
    width: 45%;
}

#input-container[b-n41bn196pc] {
    width: 100%;
    height: 95%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-top: 1em;
}

.input-box[b-n41bn196pc],
[b-n41bn196pc] .input-box {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: flex-start;
    width: 100%;
    margin-bottom: 1em;
    position: relative;
}

    .input-box label[b-n41bn196pc],
    [b-n41bn196pc] .input-box label,
    #note label[b-n41bn196pc] {
        width: 100%;
        margin-bottom: 0.3em;
        font-family: var(--font-light);
    }

.input-wrapper[b-n41bn196pc] {
    width: 100%;
    position: relative;
    display: block;
}

.unit[b-n41bn196pc] {
    position: absolute;
    /* Lijevo od strelica broja, koje Chrome crta uz desnu ivicu polja. */
    right: 2.25rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--ar-text-muted);
    z-index: 2;
    font-size: var(--ar-fs-sm);
    pointer-events: none;
}

.input-wrapper[b-n41bn196pc]  input {
    padding-right: 4.5rem;
}

.material-typeahead-box[b-n41bn196pc] {
    position: relative;
    z-index: 200;
}

#article-shape[b-n41bn196pc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

    #article-shape div[b-n41bn196pc] {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 40%;
        cursor: pointer;
        padding: 0.5em;
        border-radius: 0.5em;
    }

.selected-shape[b-n41bn196pc] {
    border: 0.1em solid #5cb85c;
    background: var(--color-bg-surface);
}

.unselected-shape[b-n41bn196pc] {
    border: 0.1em solid lightgray;
    background: white;
}

.circle[b-n41bn196pc],
.square[b-n41bn196pc] {
    height: 2em;
    width: 2em;
    background-color: var(--color-text-dark);
    display: inline-flex;
}

.circle[b-n41bn196pc] {
    border-radius: 50%;
}

.l-profile[b-n41bn196pc] {
    height: 2em;
    width: 2em;
    display: inline-block;
    background: var(--color-text-dark);
    clip-path: polygon(0% 0%, 30% 0%, 30% 70%, 100% 70%, 100% 100%, 0% 100%);
}

.square-tube[b-n41bn196pc] {
    height: 2em;
    width: 2em;
    display: inline-block;
    border: 0.45em solid var(--color-text-dark);
    background: transparent;
    box-sizing: border-box;
}

.round-tube[b-n41bn196pc] {
    height: 2em;
    width: 2em;
    display: inline-block;
    border: 0.45em solid var(--color-text-dark);
    border-radius: 50%;
    background: transparent;
    box-sizing: border-box;
}

.validation-warning[b-n41bn196pc] {
    color: #d9534f;
    font-size: 0.85em;
    margin: 0.3em 0 0 0;
}

#calculated-material-params[b-n41bn196pc] {
    background: #e8e8e8;
    border-radius: 0.3em;
    padding: 1em;
    display: flex;
    flex-direction: column;
    align-items: end;
    font-size: 1.1rem;
    color: var(--color-text-dark);
    font-family: var(--font-medium);
    margin: 1em 0;
}

    #calculated-material-params div[b-n41bn196pc] {
        display: flex;
        justify-content: space-between;
        width: 100%;
    }

#material-price[b-n41bn196pc] {
    color: var(--color-primary-hover);
}


#btns[b-n41bn196pc] {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

    #btns i[b-n41bn196pc] {
        margin-right: 0.5em;
    }

#note[b-n41bn196pc] {
    margin-bottom: 2em;
}

    #note textarea[b-n41bn196pc] {
        resize: none;
    }

#aras-code-section[b-n41bn196pc] {
    display: flex;
    flex-direction: column;
    gap: 0.8em;
    background: #e4eef2;
    border-radius: 0.5em;
    padding: 0.8em 1em;
    margin-bottom: 1em;
}

#aras-code-row[b-n41bn196pc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.4em;
}

#aras-code-info[b-n41bn196pc] {
    display: flex;
    flex-direction: column;
}

    #aras-code-info label[b-n41bn196pc] {
        font-family: var(--font-light);
        font-size: 0.85em;
        color: #6c757d;
        margin-bottom: 0.2em;
    }

#aras-code-value[b-n41bn196pc] {
    font-family: var(--font-medium);
    font-size: 1.1em;
    color: #14425a;
    letter-spacing: 0.05em;
}

#aras-destination-badge[b-n41bn196pc] {
    display: flex;
    align-items: center;
    gap: 0.4em;
    font-size: 0.85em;
    font-weight: bold;
    padding: 0.25em 0.6em;
    border-radius: 0.3em;
}

#aras-qr[b-n41bn196pc] {
    display: flex;
    align-items: center;
    gap: 0.8em;
}

    #aras-qr img[b-n41bn196pc] {
        width: 70px;
        height: 70px;
        flex-shrink: 0;
        border-radius: 0.2em;
    }

#aras-receipt-section[b-n41bn196pc] {
    display: flex;
    flex-direction: column;
    gap: 0.4em;
}

#aras-received-info[b-n41bn196pc] {
    display: flex;
    align-items: center;
    gap: 0.5em;
    font-size: 0.85em;
    color: #6c757d;
    flex-wrap: wrap;
}

/* Iste širine kao forma ispod. */
.notice-slot[b-n41bn196pc] {
    width: 45%;
    margin-bottom: 1em;
}
/* _content/ArasWeb/Pages/ItemsBuying/MaterialToOrderTabContent.razor.rz.scp.css */
#material-to-order-container[b-z6fmhuif21] {
    display: flex;
    flex-direction: column;
    width: 100%;
    flex: 1;
    min-height: 0;
    border-radius: 0.5em;
    background: white;
    padding: 0.5em 0;
}

#material-to-order-filters[b-z6fmhuif21] {
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
    width: 100%;
    padding: 0.3em 1em;
    font-family: var(--font-light);
    font-size: 0.9em;
    flex-shrink: 0;
    gap: 0.5em;
    flex-wrap: wrap;
}

.filter-box[b-z6fmhuif21] {
    margin-right: 1em;
    display: flex;
    flex-direction: column;
}

    .filter-box label[b-z6fmhuif21] {
        margin-bottom: 0.5em;
    }

    .filter-box select[b-z6fmhuif21] {
        width: 13em;
        padding: 0.5em 0.2em;
    }

    .filter-box img[b-z6fmhuif21],
    .filter-box i[b-z6fmhuif21] {
        width: 1em;
        height: 1em;
        margin: 0 0.5em;
    }

.search-box input[b-z6fmhuif21] {
    width: 22em;
}

.tab-note[b-z6fmhuif21] {
    flex-basis: 100%;
    margin: 0.3em 0 0 0;
    color: #6c757d;
}

#material-to-order-list[b-z6fmhuif21] {
    width: 100%;
}

/* -- Kolone -- */

.wo-no[b-z6fmhuif21] {
    width: 10% !important;
}

.position[b-z6fmhuif21] {
    width: 22% !important;
}

.stock[b-z6fmhuif21] {
    width: 24% !important;
}

.qty[b-z6fmhuif21] {
    width: 6% !important;
    text-align: center;
}

.deadline[b-z6fmhuif21] {
    width: 11% !important;
}

.state[b-z6fmhuif21] {
    width: 22% !important;
}

.wo-no[b-z6fmhuif21], .position[b-z6fmhuif21], .stock[b-z6fmhuif21], .state[b-z6fmhuif21] {
    display: flex;
    flex-direction: column;
    gap: 0.1em;
}

    .wo-no strong[b-z6fmhuif21], .position strong[b-z6fmhuif21], .stock strong[b-z6fmhuif21] {
        font-family: 'Ubuntu-Medium';
        color: #14425a;
        font-weight: normal;
    }

.muted[b-z6fmhuif21] {
    color: #6c757d;
}

.cutting-note[b-z6fmhuif21] {
    font-family: 'Ubuntu-Italic';
    color: #14425a;
}

.overdue[b-z6fmhuif21] {
    color: #d9534f;
    font-family: 'Ubuntu-Medium';
}

.wo-link[b-z6fmhuif21] {
    font-family: 'Ubuntu-Medium';
    color: var(--ar-primary);
    text-decoration: none;
}

    .wo-link:hover[b-z6fmhuif21] {
        text-decoration: underline;
    }

.ordered-line[b-z6fmhuif21] {
    display: flex;
    align-items: baseline;
    gap: 0.5em;
    min-width: 0;
}

    .ordered-line i[b-z6fmhuif21] {
        flex: 0 0 1em;
        text-align: center;
        color: #6c757d;
    }

    /* A flex item never shrinks below its longest word by itself; a long username would run into the buttons. */
    .ordered-line > div[b-z6fmhuif21],
    .ordered-line > a[b-z6fmhuif21] {
        min-width: 0;
        overflow-wrap: break-word;
    }

.line-link[b-z6fmhuif21] {
    color: var(--ar-primary);
    text-decoration: none;
}

    .line-link:hover[b-z6fmhuif21] {
        text-decoration: underline;
    }

.row-actions[b-z6fmhuif21] {
    display: flex;
    flex-direction: column;
    gap: 0.3em;
    flex: 0 0 8em;
    margin-left: 0.8em;
}

    .row-actions button[b-z6fmhuif21] {
        min-height: 2.2em;
        justify-content: center;
    }

        .row-actions button i[b-z6fmhuif21] {
            margin-right: 0.4em;
        }

.modal-summary[b-z6fmhuif21] {
    color: #14425a;
    margin-bottom: 1em;
}

.modal-hint[b-z6fmhuif21] {
    color: #6c757d;
    font-size: 0.9em;
    margin-top: 0.8em;
}

.other-status-hint[b-z6fmhuif21] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1em;
    padding: 2em 1em;
    color: #14425a;
}

    .other-status-hint button[b-z6fmhuif21] {
        min-height: 2.2em;
    }

/* site.css gives the row 90% and the buttons the rest; here the row takes what the buttons leave. */
.list-item > span[b-z6fmhuif21] {
    flex: 1 1 auto;
    width: auto !important;
    min-width: 0;
}

.state[b-z6fmhuif21] {
    overflow-wrap: break-word;
}
/* _content/ArasWeb/Pages/ItemsBuying/MeasuringEquipmentInput.razor.rz.scp.css */
#order-tool-box[b-zaibshxe83] {
    position: relative;
    width: 100%;
    height: 100%;
}

h5[b-zaibshxe83] {
    color: var(--color-sidebar-start);
}

h4[b-zaibshxe83] {
    text-align: center;
}

form[b-zaibshxe83] {
    height: 100% !important;
}

#order-tool[b-zaibshxe83] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-bottom: 10em;
}

#tool-info[b-zaibshxe83] {
    flex-direction: column;
    background: white;
    padding: 1em;
    border-radius: 1em;
    width: 45%;
    position: relative;
}

#input-container[b-zaibshxe83] {
    width: 100%;
    height: 95%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-top: 1em;
    position: relative;
}

.input-box[b-zaibshxe83],
[b-zaibshxe83] .input-box {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: flex-start;
    width: 100%;
    margin-bottom: 1em;
    position: relative;
}

    .input-box label[b-zaibshxe83],
    [b-zaibshxe83] .input-box label,
    #note label[b-zaibshxe83] {
        width: 100%;
        margin-bottom: 0.3em;
        font-family: var(--font-light);
    }

#btns[b-zaibshxe83] {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

#btns i[b-zaibshxe83] {
    margin-right: 0.5em;
}

#note[b-zaibshxe83] {
    margin-bottom: 2em;
}

    #note textarea[b-zaibshxe83] {
        resize: none;
    }

/* Padajuca lista typeahead-a mora prekriti polja ispod, inace se crta iza njih. */
.typeahead-box[b-zaibshxe83] {
    position: relative;
    z-index: 200;
    width: 100%;
}

    .typeahead-box[b-zaibshxe83]  .blazored-typeahead,
    .typeahead-box[b-zaibshxe83]  .blazored-typeahead__input {
        width: 100%;
    }
/* _content/ArasWeb/Pages/ItemsBuying/OtherDetails.razor.rz.scp.css */
h5[b-bjrmeabny1] {
    color: var(--color-sidebar-start);
    margin-bottom: 1.5em;
}

.container[b-bjrmeabny1] {
    background: white;
    padding: 2em;
    border-radius: 1em;
    width: 100%;
}

.input-row[b-bjrmeabny1] {
    display: flex;
    width: 100%;
    margin-bottom: 1em;
}

.input-box[b-bjrmeabny1] {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: flex-start;
    width: 100%;
}

.input-box label[b-bjrmeabny1] {
    width: 100%;
    margin-bottom: 0.5em;
    font-family: var(--font-light);
    color: var(--color-text-dark);
}

.input-box .form-control[b-bjrmeabny1] {
    width: 100%;
}

.input-box textarea[b-bjrmeabny1] {
    resize: none;
}

button i[b-bjrmeabny1] {
    margin-right: 0.5em;
}

/* Sifarnik i slobodan unos pune isto polje, pa prekidac stoji uz njegovu labelu
   umjesto da bude zasebno pitanje iznad forme. */
.source-switch[b-bjrmeabny1] {
    display: inline-flex;
    align-self: flex-start;
    background: var(--color-bg-surface);
    border-radius: 0.45em;
    padding: 0.12em;
    margin-bottom: 0.5em;
}

    .source-switch button[b-bjrmeabny1] {
        border: none;
        background: transparent;
        border-radius: 0.35em;
        /* site.css drzi svako dugme na 44px visine; prekidac nije dugme za akciju pa se toga oslobadja. */
        min-height: 0;
        padding: 0.15em 0.65em;
        font-family: var(--font-light);
        font-size: 0.78em;
        line-height: 1.5;
        color: var(--color-text-muted);
        transition: background 0.15s ease, color 0.15s ease;
    }

        .source-switch button:hover[b-bjrmeabny1] {
            color: var(--color-text-dark);
        }

        .source-switch button.active[b-bjrmeabny1] {
            background: var(--color-bg-card);
            color: var(--color-text-dark);
            font-family: var(--font-medium);
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
        }

.field-hint[b-bjrmeabny1] {
    margin-top: 0.4em;
    font-family: var(--font-italic);
    font-size: 0.8em;
    color: var(--color-text-muted);
}

/* Padajuca lista typeahead-a mora prekriti polja ispod, inace se crta iza njih. */
.typeahead-box[b-bjrmeabny1] {
    position: relative;
    z-index: 200;
    width: 100%;
}

    .typeahead-box[b-bjrmeabny1]  .blazored-typeahead,
    .typeahead-box[b-bjrmeabny1]  .blazored-typeahead__input {
        width: 100%;
    }
/* _content/ArasWeb/Pages/ItemsBuying/ToolInput.razor.rz.scp.css */
#order-tool-box[b-jjgi8wpjur] {
    position: relative;
    width: 100%;
    height: 100%;
}

h5[b-jjgi8wpjur] {
    color: var(--color-sidebar-start);
}

h4[b-jjgi8wpjur] {
    text-align: center;
}

form[b-jjgi8wpjur] {
    height: 100% !important;
    background-color: pink !important;
}

#order-tool[b-jjgi8wpjur] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-bottom: 10em;
}

#tool-info[b-jjgi8wpjur] {
    flex-direction: column;
    background: white;
    padding: 1em;
    border-radius: 1em;
    width: 45%;
    position: relative;
}
#input-container[b-jjgi8wpjur] {
    width: 100%;
    height: 95%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-top: 1em;
    position: relative;
}

.input-box[b-jjgi8wpjur],
[b-jjgi8wpjur] .input-box {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: flex-start;
    width: 100%;
    margin-bottom: 1em;
    position: relative;
}

    .input-box label[b-jjgi8wpjur],
    [b-jjgi8wpjur] .input-box label,
    #note label[b-jjgi8wpjur] {
        width: 100%;
        margin-bottom: 0.3em;
        font-family: var(--font-light);
    }

.input-wrapper[b-jjgi8wpjur] {
    width: 100%;
    position: relative;
    display: block;
}

.unit[b-jjgi8wpjur] {
    position: absolute;
    /* Lijevo od strelica broja, koje Chrome crta uz desnu ivicu polja. */
    right: 2.25rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--ar-text-muted);
    z-index: 2;
    font-size: var(--ar-fs-sm);
    pointer-events: none;
}

.input-wrapper[b-jjgi8wpjur]  input {
    padding-right: 4.5rem;
}

#btns[b-jjgi8wpjur] {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

#btns i[b-jjgi8wpjur] {
    margin-right: 0.5em;
}

#note[b-jjgi8wpjur] {
    margin-bottom: 2em;
}

    #note textarea[b-jjgi8wpjur] {
        resize: none;
    }


#search-component[b-jjgi8wpjur] {
    position: absolute;
    width: 40em;
    height: 20em;
    top: 100%;
    right: -50%;
    border-radius: 1em;
    border: 0.1em solid gray;
    padding: 1em;
    background: white;
    z-index: 10000;
}

#close-btn[b-jjgi8wpjur] {
    width: 100%;
    display: flex;
    justify-content: end;
}

#search-list-wrapper[b-jjgi8wpjur] {
    width: 100%;
    height: 90%;
    overflow-y: scroll;
}

.search-list[b-jjgi8wpjur] {
    width: 100%;
    height: auto;
}

    .search-list h6[b-jjgi8wpjur] {
        font-family: var(--font-medium);
        background: var(--color-bg-header);
        padding: 0.5em;
        border-radius: .5em;
        margin: 0.5em 0;
    }

.search-item[b-jjgi8wpjur] {
    width: 98%;
    position: relative;
    display: flex;
    justify-content: start;
    margin: 0.3em;
    border-bottom: 0.01em solid lightgray;
    padding: 0.3em;
}

.search-item-field[b-jjgi8wpjur] {
    width: auto;
    margin-right: 0.8em;
    display: flex;
    flex-direction: column;
    width: 50%;
}

    .search-item-field label[b-jjgi8wpjur] {
        font-family: var(--font-medium);
        word-break: break-all;
    }

    .search-item-field span[b-jjgi8wpjur] {
        font-family: var(--font-light);
        font-size: 0.8em;
    }

#search-placeholder[b-jjgi8wpjur] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    opacity: 0.8;
}

    #search-placeholder i[b-jjgi8wpjur] {
        font-size: 6em;
        opacity: 0.7;
        margin-bottom: 0.1em;
    }

    #search-placeholder p[b-jjgi8wpjur] {
        color: gray;
    }

.btn-item[b-jjgi8wpjur] {
    display: flex;
    justify-content: end;
    align-items: center;
    margin-left: auto;
}

    .btn-item button[b-jjgi8wpjur] {
        padding: 0.2em 0.8em;
        border-radius: 0.5em;
    }

.optional[b-jjgi8wpjur] {
    font-size: 0.9em;
    font-family: var(--font-italic);
}
/* _content/ArasWeb/Pages/Login/Login.razor.rz.scp.css */
.auth-form[b-wposuzfp4u] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    padding: 5em;
    border-radius: 1em;
    background: white;
}

#logo[b-wposuzfp4u] {
    max-width: 20em;
    height: 5em;
    object-fit: contain;
    margin-bottom: 2em;
}

.form-group[b-wposuzfp4u]{
    width: 100%;
    margin-bottom: 1em;
}

.form-group label[b-wposuzfp4u] {
    width: 100%;
    text-align: left;
    margin-bottom: 0.3em;
    font-size: 0.9em;
}

button[b-wposuzfp4u] {
    padding: 0.8em 0.5em;
    margin-top: 1em;
    border: none;
    box-shadow: none;
    width: 100%;
    background: var(--color-text-dark);
    color: white;
    text-transform: uppercase;
    font-family: var(--font-medium);
    border-radius: 0.5em;
}

h3[b-wposuzfp4u] {
    color: var(--color-text-dark)
}

.auth-form .input-group-text[b-wposuzfp4u] {
    height: 100% !important;
    cursor: pointer !important;
    background: rgba(4, 52, 76, 0.1);
}

#remember-me[b-wposuzfp4u] {
    display: flex;
    justify-content: start;
    align-items: center;
}

    #remember-me label[b-wposuzfp4u] {
        width: 80%;
        margin-left: 0.8em;
        margin-bottom: 0;
    }

/* The steps after the password: wider for the QR and the instructions, narrower padding on a phone. */
.auth-form.mfa-step[b-wposuzfp4u] {
    width: min(30em, calc(100vw - 2em));
    padding: 2.5em 2.5em;
    text-align: center;
}

    .auth-form.mfa-step #logo[b-wposuzfp4u] {
        margin-bottom: 1em;
    }

.mfa-title[b-wposuzfp4u] {
    color: var(--color-text-dark);
    font-family: var(--font-medium);
    margin-bottom: 0.4em;
}

.mfa-text[b-wposuzfp4u] {
    color: #6c757d;
    font-size: 0.9em;
    margin-bottom: 1.2em;
}

.mfa-hint[b-wposuzfp4u] {
    display: block;
    color: #6c757d;
    font-size: 0.85em;
}

.mfa-help[b-wposuzfp4u] {
    margin-top: 1em;
    margin-bottom: 0;
}

.mfa-setup-code[b-wposuzfp4u] {
    margin-top: 1em;
}

.mfa-recovery-input[b-wposuzfp4u] {
    text-align: center;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

#trust-device[b-wposuzfp4u] {
    display: flex;
    justify-content: start;
    align-items: flex-start;
    text-align: left;
}

    #trust-device .form-check-input[b-wposuzfp4u] {
        margin-top: 0.2em;
        flex-shrink: 0;
    }

    #trust-device label[b-wposuzfp4u] {
        margin-left: 0.8em;
        margin-bottom: 0;
    }

.mfa-links[b-wposuzfp4u] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 1em;
}

button.link-button[b-wposuzfp4u] {
    width: auto;
    padding: 0;
    margin-top: 1em;
    background: none;
    color: var(--ar-primary);
    text-transform: none;
    font-family: var(--font-light);
    font-size: 0.85em;
}

    button.link-button:hover[b-wposuzfp4u] {
        text-decoration: underline;
    }

button:disabled[b-wposuzfp4u] {
    opacity: 0.6;
}

@media (max-width: 500px) {
    .auth-form.mfa-step[b-wposuzfp4u] {
        padding: 1.5em 1em;
    }
}
/* _content/ArasWeb/Pages/MeasurementProtocol/MeasurementProtocolEntry.razor.rz.scp.css */
#protocol-entry[b-d70uogc8cj] {
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

#protocol-entry-container[b-d70uogc8cj] {
    width: 100%;
    min-height: 90%;
    background: var(--color-bg-card);
    border-radius: 1em;
    padding: 1em;
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}

.header-row[b-d70uogc8cj] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: var(--space-md);
}

    .header-row h3[b-d70uogc8cj] {
        font-family: var(--font-medium);
        color: var(--color-text-dark);
        font-size: 1.15em;
        margin: 0;
    }

.save-state[b-d70uogc8cj] {
    font-family: var(--font-light);
    color: var(--color-text-muted);
    font-size: 0.85em;
}

.protocol-info[b-d70uogc8cj] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-md) 2em;
    background: var(--color-bg-main);
    border-radius: var(--space-sm);
    padding: var(--space-md);
    font-family: var(--font-medium);
    color: var(--color-text-dark);
}

    .protocol-info small[b-d70uogc8cj] {
        display: block;
        font-family: var(--font-light);
        color: var(--color-text-muted);
        font-size: 0.78em;
    }

.operation-tabs[b-d70uogc8cj] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
}

.op-tab[b-d70uogc8cj] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0.45em 0.9em;
    min-height: 3.2em;
    border-radius: 0.6em;
    background: var(--color-bg-main);
    border: 2px solid transparent;
    max-width: 18em;
    min-width: 0;
    text-align: left;
    cursor: pointer;
}

.op-selected[b-d70uogc8cj] {
    background: white;
    border-color: var(--ar-primary);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
}

.op-badge[b-d70uogc8cj] {
    display: inline-block;
    margin-right: 0.4em;
    padding: 0 0.5em;
    border-radius: 1em;
    background: var(--ar-primary);
    color: white;
    font-family: var(--font-medium);
    font-size: 0.9em;
}

.op-name[b-d70uogc8cj] {
    font-family: var(--font-medium);
    color: var(--color-text-dark);
    font-size: 0.85em;
    /* Mjerenje nosi dug opis u zagradi; lomi se unutar taba umjesto da pređe na susjedni. */
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
}

.op-state[b-d70uogc8cj] {
    font-family: var(--font-light);
    color: var(--color-text-muted);
    font-size: 0.78em;
}

.alert[b-d70uogc8cj] {
    margin: 0;
}

.grid-note[b-d70uogc8cj] {
    margin: 0;
    font-family: var(--font-medium);
    color: var(--color-text-muted);
    font-size: 0.88em;
}

.cell-info[b-d70uogc8cj] {
    margin: 0;
    font-family: var(--font-light);
    color: var(--color-text-dark);
    font-size: 0.88em;
    min-height: 1.4em;
}

.grid-wrapper[b-d70uogc8cj] {
    width: 100%;
    overflow-x: auto;
    border-radius: var(--space-sm);
    border: 1px solid #dee2e6;
}

.protocol-grid[b-d70uogc8cj] {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    font-size: 0.95em;
}

    .protocol-grid th[b-d70uogc8cj],
    .protocol-grid td[b-d70uogc8cj] {
        border-right: 1px solid #dee2e6;
        border-bottom: 1px solid #dee2e6;
        text-align: center;
        vertical-align: middle;
        padding: 0.25em;
        background: white;
    }

    .protocol-grid th[b-d70uogc8cj] {
        background: #e4eef2;
        font-family: var(--font-medium);
        color: #14425a;
        font-size: 0.85em;
        white-space: nowrap;
    }

/* Mjera ostaje vidljiva dok se tabela skrola u stranu. */
.col-rb[b-d70uogc8cj] {
    position: sticky;
    left: 0;
    z-index: 1;
    width: 3em;
    min-width: 3em;
}

.col-dim[b-d70uogc8cj] {
    position: sticky;
    left: 3em;
    z-index: 1;
    min-width: 8em;
    text-align: left !important;
    font-family: var(--font-medium);
    color: var(--color-text-dark);
}

.dim-note[b-d70uogc8cj] {
    display: block;
    font-family: var(--font-light);
    color: var(--color-text-muted);
    font-size: 0.8em;
}

/* Zbirno: mjera koju nijedna obrada nije izmjerila. */
.dim-missing[b-d70uogc8cj] {
    display: block;
    font-family: var(--font-medium);
    color: #b02a37;
    font-size: 0.8em;
}

.row-missing td.col-rb[b-d70uogc8cj],
.row-missing td.col-dim[b-d70uogc8cj] {
    background: #fff3cd;
}

.op-summary[b-d70uogc8cj] {
    border-style: dashed;
    border-color: #b8c7cf;
}

    .op-summary.op-selected[b-d70uogc8cj] {
        border-style: solid;
        border-color: var(--ar-primary);
    }

.col-range[b-d70uogc8cj] {
    min-width: 4.5em;
    color: var(--color-text-muted);
    white-space: nowrap;
}

.col-general[b-d70uogc8cj] {
    font-size: 0.8em;
    white-space: nowrap;
}

.col-sample[b-d70uogc8cj] {
    min-width: 5em;
}

.cell input[b-d70uogc8cj] {
    width: 100%;
    min-width: 4.5em;
    height: 2.6em;
    border: 1px solid #b8c7cf;
    border-radius: 0.4em;
    text-align: center;
    font-size: 1em;
    background: white;
}

    .cell input:focus[b-d70uogc8cj] {
        outline: 2px solid var(--ar-primary);
        border-color: transparent;
    }

.grid-readonly td.cell[b-d70uogc8cj] {
    background: #eef1f3;
}

.cell-out span[b-d70uogc8cj],
.cell-out input[b-d70uogc8cj] {
    color: #b02a37;
    font-family: var(--font-medium);
}

.cell-out input[b-d70uogc8cj] {
    background: #f8d7da;
    border-color: #b02a37;
}

td.cell-out:not(.cell-editable)[b-d70uogc8cj] {
    background: #f8d7da !important;
}

.cell-error input[b-d70uogc8cj] {
    border: 2px solid #b02a37;
    background: #fff3cd;
}

.legend[b-d70uogc8cj] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5em;
    font-family: var(--font-light);
    color: var(--color-text-muted);
    font-size: 0.82em;
}

.legend-box[b-d70uogc8cj] {
    display: inline-block;
    width: 1em;
    height: 1em;
    border-radius: 0.2em;
    vertical-align: -0.15em;
    border: 1px solid #b8c7cf;
}

.legend-out[b-d70uogc8cj] {
    background: #f8d7da;
    border-color: #b02a37;
}

.sampling-rule[b-d70uogc8cj] {
    margin: 0;
    font-family: var(--font-italic, 'Ubuntu-Italic');
    color: var(--color-text-muted);
    font-size: 0.8em;
}

.actions[b-d70uogc8cj] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-md);
}

    .actions .btn[b-d70uogc8cj] {
        min-height: 2.8em;
        padding: 0 1.5em;
    }

/* Navoj: ocjena kontrolnikom umjesto broja. */
.gauge[b-d70uogc8cj] {
    display: flex;
    gap: 0.3em;
    min-width: 7.5em;
}

    .gauge button[b-d70uogc8cj] {
        flex: 1;
        height: 2.6em;
        border: 1px solid #b8c7cf;
        border-radius: 0.4em;
        background: white;
        color: #14425a;
        font-size: 0.85em;
        white-space: nowrap;
        padding: 0 0.4em;
    }

    .gauge .gauge-ok.on[b-d70uogc8cj] {
        background: #5cb85c;
        border-color: #4cae4c;
        color: white;
        font-family: var(--font-medium);
    }

    .gauge .gauge-nok.on[b-d70uogc8cj] {
        background: #b02a37;
        border-color: #b02a37;
        color: white;
        font-family: var(--font-medium);
    }
/* _content/ArasWeb/Pages/MeasurementProtocol/MeasurementProtocols.razor.rz.scp.css */
#iso-tolerances-page[b-1qeavgkknz] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#content-container[b-1qeavgkknz] {
    width: 100%;
    flex: 1;
    display: flex;
    flex-direction: column;
    background: white;
    border-radius: 1em;
    padding: 1em;
    min-height: 0;
}

.list-wrapper[b-1qeavgkknz] {
    flex: 1;
    overflow: auto;
    min-height: 0;
}

.item-details[b-1qeavgkknz] {
    width: 90%;
}

.list .item-details label[b-1qeavgkknz] {
    font-size: 0.9em;
    text-align: left;
}
/* _content/ArasWeb/Pages/MeasurementProtocol/MeasurementProtocolsIndex.razor.rz.scp.css */
/* Several ancestors in this page's height chain (#protocols-container,
   .list-wrapper, etc.) combine a percentage height with their own padding.
   Without border-box, padding adds on top of that percentage instead of
   being included in it, so each level overflows its parent by its own
   padding amount - and those overflows compound down the chain, which is
   what was clipping the pagination bar. border-box everywhere in this
   page's own markup removes that compounding at the source. Blazor's CSS
   isolation scopes this to elements this page itself renders, so it can't
   leak into the shared <Pagination> component's own box model. */
#measurement-protocols[b-xqytdfqyh6],
#measurement-protocols *[b-xqytdfqyh6] {
    box-sizing: border-box;
}

#measurement-protocols[b-xqytdfqyh6] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#protocol-tabs[b-xqytdfqyh6] {
    display: flex;
    gap: 0.5em;
    flex-shrink: 0;
}

    #protocol-tabs .tab-button[b-xqytdfqyh6] {
        height: var(--ar-h-md) !important;
        min-height: var(--ar-h-md) !important;
    }

.tab-button[b-xqytdfqyh6] {
    border: none;
    background: white;
    padding: 0.6em 1.5em;
    border-radius: 2em;
    font-family: var(--font-medium);
    color: var(--color-muted);
    cursor: pointer;
}

.tab-button.active[b-xqytdfqyh6] {
    background: var(--color-primary);
    color: white;
}

.queue-actions[b-xqytdfqyh6] {
    display: flex;
    gap: 0.5em;
    flex-shrink: 0;
    white-space: nowrap;
}

.queue-actions button[b-xqytdfqyh6] {
    padding: 0.4em 0.9em;
    font-size: 0.85em;
}

/* This list is laid out as a real table via CSS Grid, not flexbox.
   Flexbox sized each column from that row's own content, and since every
   <li> is an INDEPENDENT flex container, the same column ended up a
   different width on every row - which is why alignment kept drifting and
   needed constant per-column width tweaking. Grid solves it structurally:
   one shared grid-template-columns means column N is the exact same width
   on the header and on every row, whatever the content.

   Rows are `1fr auto`: the labels block takes the room that's left, the
   action button(s) take exactly what they need. The ID prefix is here to
   outrank the global `.list-wrapper ul li` / `.list-header` rules in
   site.css (which set display:flex + justify-content:space-between - the
   latter being what left a big dead gap between the date column and the
   action button). */
#protocols-list .list-wrapper ul li[b-xqytdfqyh6],
#protocols-list .list-header[b-xqytdfqyh6] {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 1.5em;
}

/* The five data columns. Article gets the most room (it stacks article name
   + drawing name and is the most variable); status is fixed because its
   badge is a fixed-length phrase; minmax(0, …) on the flexible ones stops
   long unbroken content from blowing the column out past its share. */
#protocols-list .row-labels[b-xqytdfqyh6] {
    display: grid;
    grid-template-columns:
        minmax(0, 2.4fr)
        minmax(0, 1.1fr)
        minmax(0, 1fr)
        12em
        minmax(0, 1.3fr);
    align-items: center;
    gap: 1em;
    width: 100%;
    min-width: 0;
}

/* .list-area (global, site.css) sets overflow:hidden, and .list-wrapper ul
   (global) is a hardcoded height:90%, leaving only a 10% sliver for whatever
   comes after it. The shared <Pagination> component needs more room than
   that sliver, so it was getting clipped. Override to flexbox so the list
   scrolls within whatever space Pagination doesn't need, instead of a fixed
   split that breaks depending on Pagination's actual content height. */
#protocols-list .list-wrapper[b-xqytdfqyh6] {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 0.5em;
    /* Without border-box, height:100% + padding renders TALLER than the
       parent's actual 100% (padding adds on top of, not inside, the 100%),
       overflowing .list-area's overflow:hidden bound by exactly the padding
       amount - which is what was clipping the pagination bar's bottom edge,
       regardless of how few rows were showing. */
    box-sizing: border-box;
}

#protocols-list .list-wrapper ul[b-xqytdfqyh6] {
    height: auto;
    flex: 1 1 auto;
    min-height: 0;
}

/* Trim the global per-row vertical padding (1em top+bottom = 32px/row) so a
   full page of rows plus the pagination bar actually fits without the
   pagination bar's bottom edge getting clipped by .list-area's overflow:hidden. */
#protocols-list .list-wrapper ul li[b-xqytdfqyh6] {
    padding-top: 0.6em;
    padding-bottom: 0.6em;
}

/* .list-page-body (global, site.css) sets height:90% - a flat percentage of
   #measurement-protocols' FULL height, not of whatever's left after
   #protocol-tabs (added on this page only). That 90% doesn't shrink to
   account for the tabs, so it demands more room than actually remains and
   overflows by roughly the tabs' height - which is what was pushing the
   pagination bar past the viewport. flex:1 1 auto makes it fill whatever
   space genuinely remains instead of a fixed fraction of the whole. */
#protocols-container[b-xqytdfqyh6] {
    display: flex;
    flex-direction: column;
    width: 100%;
    border-radius: 0.5em;
    background: white;
    padding: 1em 0;
    height: auto;
    flex: 1 1 auto;
    min-height: 0;
}

#protocol-filters[b-xqytdfqyh6] {
    display: flex;
    flex-wrap: wrap;
    row-gap: 0.5em;
    justify-content: flex-start;
    align-items: flex-end;
    width: 100%;
    padding: 0.3em 1em;
    font-family: var(--font-light);
    font-size: 0.9em;
    flex-shrink: 0;
    gap: 0.5em;
}

.filter-box[b-xqytdfqyh6] {
    margin-right: 1em;
    display: flex;
    flex-direction: column;
}

    .filter-box label[b-xqytdfqyh6] {
        margin-bottom: 0.5em;
    }

    .filter-box select[b-xqytdfqyh6], .filter-box input[b-xqytdfqyh6] {
        width: 15em;
        padding: 0.5em 0.2em;
    }

    .filter-box img[b-xqytdfqyh6] {
        width: 1em;
        height: 1em;
        margin: 0 0.5em;
    }

#protocols-list[b-xqytdfqyh6] {
    width: 100%;
}

/* Column WIDTHS come from the grid template above - these rules only handle
   what's inside each cell. Everything is centered so a short value and a
   long value in the same column still read as one straight column, and
   word-break:normal + overflow-wrap:break-word wraps text at whitespace,
   breaking mid-word only as a last resort for a single over-long token. */
.protocol-article[b-xqytdfqyh6],
.protocol-order[b-xqytdfqyh6],
.protocol-customer[b-xqytdfqyh6],
.protocol-status[b-xqytdfqyh6],
.date-and-user[b-xqytdfqyh6] {
    width: auto;
    min-width: 0;
    text-align: left;
    overflow-wrap: break-word;
    word-break: normal;
}

.protocol-status[b-xqytdfqyh6] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0.25em;
}

.protocol-status .measure-progress[b-xqytdfqyh6] {
    font-family: var(--font-light);
    color: var(--color-muted);
    font-size: 0.75em;
}

/* Article is the exception to the centered columns above: it's the name
   column, it holds the longest and most variable values, and it stacks two
   lines (article name over drawing name). Left-aligning it keeps those two
   lines flush with each other and gives every row a common left edge to
   scan down - centering made ragged, hard-to-scan text. The header label
   carries the same class, so it left-aligns with the column it labels. */
.protocol-article[b-xqytdfqyh6] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    gap: 0.2em;
}

.protocol-article .article-name[b-xqytdfqyh6] {
    font-family: var(--font-medium);
    color: var(--color-primary);
}

.protocol-article .drawing-name[b-xqytdfqyh6] {
    font-size: 0.85em;
    color: var(--color-muted);
    font-family: var(--font-light);
}

/* Status styling */
.protocol-status span[b-xqytdfqyh6] {
    border-radius: 2em;
    width: auto;
    padding: 0.3em 1.5em;
    white-space: nowrap;
    font-family: var(--font-medium);
    font-size: 0.8em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.protocol-status img[b-xqytdfqyh6] {
    width: 1.2em;
    height: 1.2em;
    margin-right: 0.5em;
}

.status-finalized span[b-xqytdfqyh6] {
    background: rgba(205, 254, 194, 0.8);
}

.status-active span[b-xqytdfqyh6] {
    background: rgba(137, 196, 244, 0.8);
}

/* Date and user styling */
/* Sat i osoba jedno ispod drugog, ikone u istoj koloni; naslov kolone iste veličine kao ostali. */
.date-and-user[b-xqytdfqyh6] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.3em;
    font-size: 0.85em;
}

.list-header .date-and-user[b-xqytdfqyh6] {
    display: block;
    font-size: inherit;
    text-align: left;
}

.date-and-user .date-info[b-xqytdfqyh6],
.date-and-user .user-info[b-xqytdfqyh6] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.5em;
}

.date-and-user .date-info i[b-xqytdfqyh6] {
    width: 1.2em;
    text-align: center;
    color: var(--ar-navy-600);
}

.date-and-user .date-info[b-xqytdfqyh6] {
    font-family: var(--font-light);
    color: var(--color-muted);
}

.date-and-user .user-info[b-xqytdfqyh6] {
    font-family: var(--font-medium);
}

.date-and-user img[b-xqytdfqyh6] {
    width: 1.2em;
    height: 1.2em;
}
/* _content/ArasWeb/Pages/Neuskladenosti/Dorade.razor.rz.scp.css */
#requests[b-sfd3plfc3o] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#requests-container[b-sfd3plfc3o] {
    width: 100%;
    border-radius: 0.5em;
    padding: 1em;
}

#requests-list[b-sfd3plfc3o] {
    width: 100%;
}

.list-wrapper[b-sfd3plfc3o] {
    padding: 0;
}

.request-status span[b-sfd3plfc3o] {
    border-radius: 2em;
    width: auto;
    padding: 0.3em 1.5em;
    word-break: break-all;
    font-family: var(--font-medium);
    font-size: 0.8em;
    justify-content: center;
    width: 11em;
}

.request-status img[b-sfd3plfc3o] {
    width: 1.2em;
    height: 1.2em;
    margin-right: 0.5em;
}

.request-status i[b-sfd3plfc3o] {
    margin-right: 0.8em;
    color: var(--color-danger);
}

.approved span[b-sfd3plfc3o] {
    background: rgba(205, 254, 194, 0.8)
}

.pending span[b-sfd3plfc3o] {
    background: rgba(236, 236, 236, 0.8)
}

.declined span[b-sfd3plfc3o] {
    background: rgba(217, 83, 79, 0.5)
}

#create-btn[b-sfd3plfc3o] {
    margin-left: auto;
}

.list-item span label[b-sfd3plfc3o] {
    width: 18%
}

.made-by-employee[b-sfd3plfc3o] {
    color: var(--color-danger);
    font-family: var(--font-medium);
}


.disabled span[b-sfd3plfc3o] {
    background: #f5f5f5
}


#search-and-report[b-sfd3plfc3o] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: var(--font-light);
    font-size: 0.9em;
    margin-left: auto;
    gap: 0.8em;
}

#generate-excel[b-sfd3plfc3o] {
    background: white;
    color: #3d783d;
    font-family: var(--font-medium);
    border: 0.1em solid #5cb85c;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
}

    #generate-excel img[b-sfd3plfc3o] {
        width: 1.5em;
        height: 1.5em;
        margin-right: 0.5em;
    }

#filters[b-sfd3plfc3o] {
    display: flex;
    justify-content: start;
    align-items: center;
    width: 100%;
    padding: 0 1em;
    font-family: var(--font-light);
    font-size: 0.9em;
    margin-bottom: 1em;
}

.filter-box[b-sfd3plfc3o] {
    margin-right: 2em;
    display: flex; 
    flex-direction: column;
    align-items: start;
    width: 20%;
}

    .filter-box label[b-sfd3plfc3o] {
        width: auto;
        margin-right: 1em;
        text-align: right;
    }

    .filter-box img[b-sfd3plfc3o] {
        width: 1em;
        height: 1em;
        margin-right: 0.5em;
    }

.search-box-wrapper[b-sfd3plfc3o] {
    width: 100%;
}

#defect-in-advance[b-sfd3plfc3o] {
    background: white;
    color: var(--color-danger);
    border: 0.1em solid var(--color-danger);
    font-family: var(--font-medium);
}

#defect-in-advance i[b-sfd3plfc3o] {
    margin-right: 0.5em;
}
/* _content/ArasWeb/Pages/Neuskladenosti/PonovoPraviti.razor.rz.scp.css */
#requests[b-irdxs67ab0] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#requests-container[b-irdxs67ab0] {
    width: 100%;
    border-radius: 0.5em;
    padding: 1em;
}

#requests-list[b-irdxs67ab0] {
    width: 100%;
}

.list-wrapper[b-irdxs67ab0] {
    padding: 0;
}

.request-status span[b-irdxs67ab0] {
    border-radius: 2em;
    width: auto;
    padding: 0.3em 1.5em;
    word-break: break-all;
    font-family: var(--font-medium);
    font-size: 0.8em;
    justify-content: center;
    width: 11em;
}

.request-status img[b-irdxs67ab0] {
    width: 1.2em;
    height: 1.2em;
    margin-right: 0.5em;
}

.request-status i[b-irdxs67ab0] {
    margin-right: 0.8em;
    color: var(--color-danger);
}

.approved span[b-irdxs67ab0] {
    background: rgba(205, 254, 194, 0.8)
}

.pending span[b-irdxs67ab0] {
    background: rgba(236, 236, 236, 0.8)
}

.declined span[b-irdxs67ab0] {
    background: rgba(217, 83, 79, 0.5)
}

#create-btn[b-irdxs67ab0] {
}

.list-item span label[b-irdxs67ab0] {
    width: 18%
}

.made-by-employee[b-irdxs67ab0] {
    color: var(--color-danger);
    font-family: var(--font-medium);
}


#search-and-report[b-irdxs67ab0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: var(--font-light);
    font-size: 0.9em;
    gap: 0.8em;
    margin-left: auto;
}

#generate-pdf[b-irdxs67ab0] {
    font-family: var(--font-medium);
    margin-bottom: auto;
    border: 0.01em solid gray;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
    background: white;
    color: black;
}

    #generate-pdf img[b-irdxs67ab0] {
        width: 1.5em;
        height: 1.5em;
        margin-right: 0.5em;
    }

#filters[b-irdxs67ab0] {
    display: flex;
    justify-content: start;
    align-items: center;
    width: 100%;
    padding: 0 1em;
    font-family: var(--font-light);
    font-size: 0.9em;
    margin-bottom: 1em;
}

.filter-box[b-irdxs67ab0] {
    margin-right: 2em;
    display: flex;
    flex-direction: column;
    align-items: start;
    width: 20%;
}

    .filter-box label[b-irdxs67ab0] {
        width: auto;
        margin-right: 1em;
        text-align: right;
    }

    .filter-box img[b-irdxs67ab0] {
        width: 1em;
        height: 1em;
        margin-right: 0.5em;
    }

.search-box-wrapper[b-irdxs67ab0] {
    width: 100%;
}
/* _content/ArasWeb/Pages/Neuskladenosti/Skart.razor.rz.scp.css */
#defects-container[b-lxurdv0zcw] {
    width: 100%;
    height: 100%;
}

#defects-list-container[b-lxurdv0zcw] {
    width: 100%;
}

#defect-filters[b-lxurdv0zcw] {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.5em;
    width: 100%;
    padding: 1em;
    font-family: var(--font-light);
    font-size: 0.9em;
}

.filter-box[b-lxurdv0zcw] {
    margin-right: 1em;
    display: flex;
    flex-direction: column;
}

    .filter-box label[b-lxurdv0zcw] {
        margin-bottom: 0.5em;
    }

    .filter-box input[b-lxurdv0zcw] {
        padding: 0.5em 0.5em;
    }

    .filter-box img[b-lxurdv0zcw] {
        width: 1em;
        height: 1em;
        margin: 0 0.5em;
    }

#defects[b-lxurdv0zcw] {
    width: 100%;
    background: white;
    border-radius: 0.5em;
    display: flex;
    flex-direction: column;
}

#defect-list-header[b-lxurdv0zcw] {
    background: rgba(217, 83, 79, 0.2);
}

    #defect-list-header span label[b-lxurdv0zcw],
    #defects-list span label[b-lxurdv0zcw] {
        width: 15%;
    }

    #defect-list-header .full-text[b-lxurdv0zcw],
    #defects-list .full-text[b-lxurdv0zcw] {
        word-break: break-word;
        width: 18%;
    }

    /* Operacija i iznos s razlaganjem: dodano uz obračun škarta po trošku. */
    #defect-list-header .operation[b-lxurdv0zcw],
    #defects-list .operation[b-lxurdv0zcw] {
        width: 16%;
    }

    #defect-list-header .amount[b-lxurdv0zcw],
    #defects-list .amount[b-lxurdv0zcw] {
        width: 18%;
    }

    #defects-list .full-text[b-lxurdv0zcw],
    #defects-list .operation[b-lxurdv0zcw],
    #defects-list .amount[b-lxurdv0zcw] {
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
    }

    #defects-list .amount-total[b-lxurdv0zcw] {
        color: #dc3545;
        font-family: 'Ubuntu-Medium';
    }

    #defects-list .sub-line[b-lxurdv0zcw] {
        display: block;
        color: #6c757d;
        font-size: 0.8em;
        font-family: 'Ubuntu-Italic';
    }

    #defects-list .breakdown[b-lxurdv0zcw] {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100%;
    }

    #defect-list-header .quantity[b-lxurdv0zcw],
    #defects-list .quantity[b-lxurdv0zcw] {
        width: 7%;
        text-align: center;
    }

#defects-list span[b-lxurdv0zcw] {
    display: inline-flex;
    align-items: center;
}

#defects-list img[b-lxurdv0zcw] {
    width: 1.5em;
    height: 1.5em;
    margin-right: 0.5em;
}

.made-by-worker[b-lxurdv0zcw] {
    color: #d9534f;
    font-family: 'Ubuntu-Medium';
}

#report-btn[b-lxurdv0zcw] {
}

.fa-person-circle-exclamation[b-lxurdv0zcw]{
    margin-right: 0.5em;
}

.search-component[b-lxurdv0zcw]{
    width: 100%;
    position: relative;
}

#price label[b-lxurdv0zcw] {
    font-family: 'Ubuntu-Medium';
}

#price span[b-lxurdv0zcw] {
    color: #dc3545;
    font-family: 'Ubuntu-Medium';
    background: #e9ecef;
}
/* _content/ArasWeb/Pages/Odrzavanje/ChecklistCard.razor.rz.scp.css */
.checklist-items[b-uqq1g2d6ok] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .6em;
}

.checklist-item[b-uqq1g2d6ok] {
    display: flex;
    align-items: center;
    gap: .8em;
}

.task-checkbox-placeholder[b-uqq1g2d6ok] {
    width: 32px;
    min-width: 32px;
    height: 32px;
}

/* Ista zelena kvačica kao TaskCheckbox.done, samo bez dugmeta - nema šta kliknuti. */
.task-checkbox-static[b-uqq1g2d6ok] {
    width: 32px;
    min-width: 32px;
    height: 32px;
    border-radius: .35em;
    border: 2px solid #5cb85c;
    background: #5cb85c;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.05em;
}

.checklist-item-name[b-uqq1g2d6ok] {
    flex: 1;
    color: #14425a;
}

.emulsion-btn[b-uqq1g2d6ok] {
    border: 1px solid var(--ar-primary);
    background: var(--ar-primary-soft);
    color: var(--ar-primary-text);
    border-radius: .6em;
    padding: .4em .8em;
    font-size: .82em;
    min-height: 44px;
    cursor: pointer;
}

/* Učitavanje nije uspjelo, ili je lista od jučer - radnik mora imati šta dodirnuti,
   ne samo poruku. */
.checklist-retry[b-uqq1g2d6ok] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .8em;
}

.checklist-stale[b-uqq1g2d6ok] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .6em;
    margin-bottom: 1em;
    padding: .7em .9em;
    border-radius: .6em;
    background: rgba(240, 173, 78, .12);
    border: 1px solid #f0ad4e;
    color: #8a6d3b;
}

.retry-btn[b-uqq1g2d6ok] {
    display: inline-flex;
    align-items: center;
    gap: .5em;
    border: 1px solid var(--ar-primary);
    background: var(--ar-primary-soft);
    color: var(--ar-primary-text);
    border-radius: .6em;
    padding: .4em .9em;
    font-size: .85em;
    min-height: 44px;
    cursor: pointer;
}

.checklist-footer[b-uqq1g2d6ok] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1em;
    padding-top: .8em;
    border-top: 1px solid #e4eef2;
}

/* Poziv na akciju - ista plava kao ostala primarna dugmad u aplikaciji. Dok nema novih
   kvačica, dugme je sivo i neaktivno, da je jasno da slanje nema šta poslati. */
.submit-btn[b-uqq1g2d6ok] {
    gap: .5em;
    background: var(--color-primary);
    color: white;
    font-family: 'Ubuntu-Medium';
    cursor: pointer;
}

.submit-btn:hover:not(:disabled)[b-uqq1g2d6ok] {
    background: var(--color-primary-hover);
}

.submit-btn:disabled[b-uqq1g2d6ok] {
    background: #e4eef2;
    color: #9fb2bb;
    box-shadow: none !important;
    cursor: default;
}

.checklist-progress[b-uqq1g2d6ok] {
    font-family: 'Ubuntu-Medium';
    color: #14425a;
}

.empty-note[b-uqq1g2d6ok] {
    color: #6c757d;
    margin: 0;
}
/* _content/ArasWeb/Pages/Odrzavanje/FeedLista.razor.rz.scp.css */
.empty-note[b-k63wy606oa] {
    margin: 0;
    color: #6c757d;
    font-size: .88em;
}

/* Dnevnik zna narasti - kartica se ne razvlači s njim, ostatak se skroluje. Otprilike
   10 redova prije nego scrollbar preuzme. */
.feed-scroll[b-k63wy606oa] {
    max-height: 400px;
    overflow-y: auto;
}

/* Isti ritam kao ostali redovi modula: visina za prst na tabletu, najtanja linija. */
.feed-row[b-k63wy606oa] {
    display: flex;
    align-items: flex-start;
    gap: .8em;
    padding: .55em .3em;
    min-height: 56px;
    border-bottom: 1px solid #f6f6f6;
}

.feed-row:last-child[b-k63wy606oa] {
    border-bottom: none;
}

.feed-row.attention .row-title[b-k63wy606oa] {
    color: #b8443f;
}

.row-main[b-k63wy606oa] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.row-title[b-k63wy606oa] {
    color: #14425a;
    font-family: 'Ubuntu-Light';
    font-size: .85em;
}

.row-sub[b-k63wy606oa] {
    color: #6c757d;
    font-size: .78em;
}

/* Ikona u pločici umjesto golog vremena - vrsta događaja se prepozna prije čitanja opisa. */
.feed-icon[b-k63wy606oa] {
    width: 30px;
    height: 30px;
    flex: none;
    border-radius: .5em;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .85em;
    margin-top: .15em;
}

.feed-icon.tone-blue[b-k63wy606oa] {
    background: var(--ar-primary-soft);
    color: var(--ar-primary);
}

.feed-icon.tone-red[b-k63wy606oa] {
    background: rgba(217, 83, 79, .12);
    color: #d9534f;
}

.feed-icon.tone-green[b-k63wy606oa] {
    background: rgba(38, 176, 80, .12);
    color: #26b050;
}

.feed-icon.tone-amber[b-k63wy606oa] {
    background: rgba(255, 204, 0, .25);
    color: #8a6d00;
}

.feed-meta[b-k63wy606oa] {
    display: flex;
    align-items: center;
    gap: .4em;
    margin-top: .25em;
    flex-wrap: wrap;
}

.role-badge[b-k63wy606oa] {
    background: var(--ar-primary-soft);
    color: var(--ar-primary);
    font-family: 'Ubuntu-Medium';
    font-size: .68em;
    padding: .15em .6em;
    border-radius: 2em;
}

.role-badge.production[b-k63wy606oa] {
    background: rgba(38, 176, 80, .15);
    color: #26b050;
}

.feed-who[b-k63wy606oa] {
    font-family: 'Ubuntu-Light';
    font-size: .72em;
    color: gray;
}

/* Isti zapis više puta zaredom (npr. djelimične potvrde checkliste) je jedan red. */
.feed-repeat[b-k63wy606oa] {
    color: #6c757d;
    font-size: .75em;
    white-space: nowrap;
}
/* _content/ArasWeb/Pages/Odrzavanje/IzborIliUnos.razor.rz.scp.css */
.izbor-ili-unos[b-bjlno03prj] {
    display: flex;
    flex-direction: column;
    gap: 0.4em;
    width: 100%;
}

.izbor-ili-unos .form-control[b-bjlno03prj] {
    width: 100%;
}
/* _content/ArasWeb/Pages/Odrzavanje/KarticaMasine.razor.rz.scp.css */
/* Kartica se ne razvlači preko cijelog ekrana: na širokom monitoru bi zaglavlje stajalo
   skroz lijevo, a radnje skroz desno, pa bi korisnik svaki put očima prelazio karticu s
   kraja na kraj. Ograničena širina drži sve oko sredine, a opet je dovoljno široka da
   tabele i kartice intervala ne budu zgurane. */
#kartica-masine[b-lk9jmfga6v] {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
}

/* Globalni .badge-count nosi margin-bottom: 10px; u redu poravnatom po sredini to pill
   podigne pet piksela iznad naziva mašine i dugmadi. Ovdje ga skidamo - razmak u zaglavlju
   već drži gap. */
#kartica-masine .badge-count[b-lk9jmfga6v] {
    margin-bottom: 0;
}

#content-container[b-lk9jmfga6v] {
    width: 100%;
    flex: 1;
    display: flex;
    flex-direction: column;
    background: white;
    border-radius: 1em;
    padding: 1em;
    min-height: 0;
    overflow: auto;
}

.machine-meta[b-lk9jmfga6v] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5em;
    padding-bottom: 1em;
    border-bottom: 1px solid #e4eef2;
    font-size: 0.85em;
    color: #14425a;
}

.machine-meta label[b-lk9jmfga6v] {
    display: block;
    color: #55646c;
    font-size: 0.9em;
    margin-bottom: 0.1em;
}

/* Jedno ulje po redu - naziv i namjena zajedno se čitaju kao "šta ide gdje". */
.meta-oils .oil[b-lk9jmfga6v] {
    display: block;
}

.meta-oils b[b-lk9jmfga6v] {
    font-family: 'Ubuntu-Medium';
    font-weight: normal;
}

.card-tabs[b-lk9jmfga6v] {
    display: flex;
    gap: 0.5em;
    margin: 1em 0;
    flex-wrap: wrap;
}

.card-tab[b-lk9jmfga6v] {
    border: 1px solid #e4eef2;
    background: white;
    color: #55646c;
    border-radius: 2em;
    padding: 0.4em 1em;
    font-size: 0.85em;
    cursor: pointer;
}

.card-tab.active[b-lk9jmfga6v] {
    background: #e4eef2;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.template-note[b-lk9jmfga6v] {
    background: rgba(255, 204, 0, .15);
    border-radius: 0.5em;
    padding: 0.6em 0.8em;
    font-size: 0.85em;
    color: #8a6d00;
}

.obligations-head[b-lk9jmfga6v] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1em;
    gap: 1em;
}

.section-title[b-lk9jmfga6v] {
    font-family: 'Ubuntu-Medium';
    color: #14425a;
    font-size: 0.95em;
}

/* Radnje u zaglavlju: bijele s obrubom, ikona u akcentnoj plavoj. Puno sivo dugme ostaje
   samo "Nazad" - navigacija i radnja nad mašinom ne smiju izgledati isto. */
.header-action[b-lk9jmfga6v] {
    display: inline-flex;
    align-items: center;
    gap: .55em;
    background: white;
    border: 1px solid #cfdde4;
    border-radius: 1em;
    padding: .4em 1.1em;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: .9em;
    white-space: nowrap;
    cursor: pointer;
}

.header-action i[b-lk9jmfga6v] {
    color: var(--ar-primary);
}

.header-action:hover[b-lk9jmfga6v] {
    background: #eef6fb;
    border-color: var(--ar-primary-hover);
}

/* Prijava kvara je jedina radnja koja znači "nešto ne valja" - i izgleda tako. */
.header-action.danger[b-lk9jmfga6v] {
    border-color: #e8b3b1;
    color: #b8443f;
}

.header-action.danger i[b-lk9jmfga6v] {
    color: #d9534f;
}

.header-action.danger:hover[b-lk9jmfga6v] {
    background: #fdf1f1;
    border-color: #d9534f;
}

/* Paketi periodičnih servisa ove mašine - unutar taba "Obaveze", jer su dio plana. */
.card-packages[b-lk9jmfga6v] {
    display: flex;
    flex-direction: column;
    gap: .4em;
    padding: 1em 0;
    border-bottom: 1px solid #e4eef2;
}

.packages-empty[b-lk9jmfga6v] {
    margin: 0;
    color: #6c757d;
    font-size: .85em;
}

.package-row[b-lk9jmfga6v] {
    display: flex;
    align-items: center;
    gap: .8em;
    padding: .6em .8em;
    background: #f7fafb;
    border-radius: .6em;
    cursor: pointer;
}

.package-row:hover[b-lk9jmfga6v] {
    background: #e4eef2;
}

.package-main[b-lk9jmfga6v] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

.package-title[b-lk9jmfga6v] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.package-sub[b-lk9jmfga6v] {
    color: #6c757d;
    font-size: .8em;
}

/* Labela roka, ista kao u "Moj dan": boja nosi hitnost, tekst samo datum (ili prag). */
.pill[b-lk9jmfga6v] {
    display: inline-flex;
    align-items: center;
    border-radius: 2em;
    padding: .25em .8em;
    font-size: .72em;
    font-family: 'Ubuntu-Medium';
    white-space: nowrap;
}

.pill-ok[b-lk9jmfga6v] {
    background: rgba(92, 184, 92, .15);
    color: #2f7a2f;
}

.pill-warn[b-lk9jmfga6v] {
    background: rgba(240, 173, 78, .20);
    color: #9a6212;
}

.pill-late[b-lk9jmfga6v] {
    background: rgba(217, 83, 79, .14);
    color: #b8443f;
}

.pill-deferred[b-lk9jmfga6v] {
    background: var(--ar-primary-soft);
    color: var(--ar-primary-text);
}

.package-row .fa-chevron-right[b-lk9jmfga6v] {
    color: #b6c2c8;
    font-size: .8em;
}

.interval-cards[b-lk9jmfga6v] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(24em, 1fr));
    gap: 1em;
}

.interval-card[b-lk9jmfga6v] {
    background: white;
    border: 1px solid #e4eef2;
    border-radius: 1em;
    padding: 0.8em 1em;
}

.interval-head[b-lk9jmfga6v] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5em;
    margin-bottom: 0.6em;
}

.interval-label[b-lk9jmfga6v] {
    font-family: 'Ubuntu-Medium';
    color: #14425a;
    font-size: 0.9em;
}

.add-in-group[b-lk9jmfga6v] {
    color: var(--ar-primary);
    cursor: pointer;
}

.tag[b-lk9jmfga6v] {
    display: inline-block;
    border-radius: 1em;
    padding: 0.05em 0.6em;
    font-size: 0.7em;
    margin-left: 0.5em;
    font-family: 'Ubuntu-Light';
    vertical-align: middle;
}

.tag.changed[b-lk9jmfga6v] {
    background: rgba(255, 204, 0, .25);
    color: #8a6d00;
}

.tag.new[b-lk9jmfga6v] {
    background: rgba(38, 176, 80, .12);
    color: #1e8c40;
}

.task-list[b-lk9jmfga6v] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.task-row[b-lk9jmfga6v] {
    display: flex;
    align-items: center;
    gap: 0.5em;
    padding: 0.4em 0;
    border-top: 1px solid #f2f5f6;
    font-size: 0.85em;
}

.task-row.excluded .task-name[b-lk9jmfga6v],
.task-row.excluded .task-performer[b-lk9jmfga6v] {
    text-decoration: line-through;
    color: #7d878d;
}

.task-name[b-lk9jmfga6v] {
    flex: 1;
    color: #14425a;
}

.task-performer[b-lk9jmfga6v] {
    color: #55646c;
    font-size: 0.9em;
    white-space: nowrap;
}

.task-actions[b-lk9jmfga6v] {
    display: flex;
    gap: 0.5em;
}

.task-actions i[b-lk9jmfga6v] {
    cursor: pointer;
    color: #d9534f;
}

.task-actions .fa-rotate-left[b-lk9jmfga6v] {
    color: var(--ar-primary);
}

.tab-placeholder[b-lk9jmfga6v] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5em;
    color: #55646c;
    padding: 3em 1em;
}

.tab-placeholder i[b-lk9jmfga6v] {
    font-size: 2em;
    color: #cdd7db;
}

.tab-placeholder h5[b-lk9jmfga6v] {
    color: #14425a;
    margin: 0;
}

.tab-placeholder p[b-lk9jmfga6v] {
    margin: 0;
    font-size: 0.9em;
}

/* Tab "Historija intervencija" */

/* Pločice statistike po konceptu: mirna podloga i tanak obrub umjesto punog okvira, pa
   brojevi nose pažnju, a ne kutije oko njih. */
.stat-cards[b-lk9jmfga6v] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 0.7em;
    margin-bottom: 1.2em;
}

/* justify-content: space-between je brojeve razbacao po visini: pločica s dopunom ispod
   (datum, mjesec) gurala je brojku gore, a pločica bez dopune razvlačila labelu i brojku
   na krajeve. Sada labela i brojka idu jedna ispod druge od vrha, pa svi brojevi u redu
   stoje na istoj liniji, a dopuna se lijepi za dno. */
.stat-card[b-lk9jmfga6v] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25em;
    /* Taman za labelu i brojku; pločice s dopunom naraste sadržaj, a grid ostale u redu
       izravna na istu visinu. */
    min-height: 72px;
    background: #fbfcfd;
    border: 1px solid #eaeef0;
    border-radius: 0.7em;
    padding: 0.75em 0.95em;
}

.stat-card label[b-lk9jmfga6v] {
    display: block;
    color: #6c8794;
    font-size: 0.88em;
    line-height: 1.25;
    margin: 0;
}

.stat-card span[b-lk9jmfga6v] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: 1.35em;
    line-height: 1.2;
}


.history-filter[b-lk9jmfga6v] {
    display: flex;
    gap: 0.4em;
    margin-bottom: 0.8em;
}

.chip[b-lk9jmfga6v] {
    border: 1px solid #e4eef2;
    background: white;
    color: #55646c;
    border-radius: 2em;
    padding: 0.35em 0.9em;
    font-size: 0.8em;
    cursor: pointer;
}

.chip.active[b-lk9jmfga6v] {
    background: #e4eef2;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.timeline[b-lk9jmfga6v] {
    display: flex;
    flex-direction: column;
}

.timeline-item[b-lk9jmfga6v] {
    position: relative;
    display: flex;
    gap: 0.8em;
    padding-bottom: 1em;
}

/* Linija povezuje tačke; zadnja stavka je nema da traka ne visi ispod sadržaja. */
.timeline-item:not(:last-child)[b-lk9jmfga6v]::before {
    content: '';
    position: absolute;
    left: 5px;
    top: 14px;
    bottom: 0;
    width: 2px;
    background: #e4eef2;
}

.timeline-dot[b-lk9jmfga6v] {
    flex: 0 0 12px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--ar-primary);
    margin-top: 4px;
    z-index: 1;
}

.timeline-dot.fault[b-lk9jmfga6v] {
    background: #d9534f;
}

.timeline-content[b-lk9jmfga6v] {
    flex: 1;
    border: 1px solid #e4eef2;
    border-radius: 0.6em;
    padding: 0.7em;
}

.order-head[b-lk9jmfga6v] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5em;
}

.order-date[b-lk9jmfga6v] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.order-number[b-lk9jmfga6v] {
    color: #55646c;
    font-size: 0.85em;
}

.pill[b-lk9jmfga6v] {
    display: inline-block;
    border-radius: 2em;
    padding: 0.15em 0.7em;
    font-size: 0.8em;
    background: #f0f2f3;
    color: #5f6f77;
}

.pill.external[b-lk9jmfga6v] {
    background: var(--ar-primary-soft);
    color: var(--ar-primary-text);
}

.order-body[b-lk9jmfga6v] {
    display: flex;
    flex-direction: column;
    margin-top: 0.3em;
    color: #14425a;
    font-size: 0.9em;
}

.order-meta[b-lk9jmfga6v] {
    color: #55646c;
    font-size: 0.85em;
}

.link-btn[b-lk9jmfga6v] {
    border: none;
    background: none;
    color: var(--ar-primary);
    padding: 0.3em 0 0;
    cursor: pointer;
    font-size: 0.85em;
}

.order-actions[b-lk9jmfga6v] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.2em;
}

/* Zaglavlje taba: lijevo kontekst (ili ništa), desno radnja. Ista klasa na emulziji i
   obavezama drži dugme na istoj visini i istom mjestu kad se tabovi mijenjaju.
   justify-content: flex-end da dugme ostane desno i kad lijeve strane nema. */
.tab-head[b-lk9jmfga6v] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1em;
    flex-wrap: wrap;
    margin-bottom: 0.8em;
}

/* Kontekst gura dugme na desni kraj; bez njega dugme samo stoji desno. */
.tab-head > :first-child:not(:last-child)[b-lk9jmfga6v] {
    margin-right: auto;
}

.tab-head .btn-primary[b-lk9jmfga6v] {
    background: var(--ar-primary);
    border-color: var(--ar-primary);
    border-radius: 0.5em;
    min-height: 44px;
    white-space: nowrap;
}

/* Tab "Emulzija" */

.section-title[b-lk9jmfga6v] {
    font-family: 'Ubuntu-Medium';
    color: #14425a;
    font-size: 0.92em;
    margin: 1.2em 0 0.5em;
}

.stat-cards + .section-title[b-lk9jmfga6v] {
    margin-top: 0;
}

/* Sitna dopuna statistici: vrijeme zadnjeg mjerenja ne smije nositi težinu same brojke.
   margin-top: auto je drži na dnu pločice, pa ne pomjera brojku iznad sebe. */
.stat-card .stat-sub[b-lk9jmfga6v] {
    display: block;
    margin-top: auto;
    padding-top: 0.3em;
    color: #6c8794;
    font-family: 'Ubuntu-Light';
    font-size: 0.8em;
}

/* CSS bar-graf: visina stupca je postotak gornje granice Y ose, ispod stupaca stoji dan.
   Bez biblioteke - jedan stubac po danu je previše sitno da bi se isplatio ApexCharts. */
.emulsion-chart[b-lk9jmfga6v] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    /* #content-container je flex kolona, pa bi se graf inače stisnuo ispod zadane visine
       i stupci bi ostali bez čega da mjere svoj postotak. */
    flex: none;
    padding: 0.7em;
    border: 1px solid #eaeef0;
    border-radius: 0.6em;
    background: #fbfcfd;
}

/* Osa i stupci dijele istu visinu, a dani stoje u zasebnom redu ispod - tako oznaka "0"
   na osi pada tačno na dno stupca, a ne negdje u red s datumima. */
.chart-body[b-lk9jmfga6v] {
    display: flex;
    gap: 6px;
    height: 130px;
}

/* Fiksna širina u pikselima (ne em) jer isti razmak mora ponoviti i red s danima, a
   njegov font nije isti kao fontovi ose. */
.chart-axis[b-lk9jmfga6v] {
    flex: 0 0 34px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-end;
    font-size: 0.6em;
    line-height: 1;
    color: gray;
}

/* align-items ostaje stretch: kolone moraju popuniti visinu da bi postotna visina stupca
   unutar njih imala prema čemu da se računa. */
.chart-plot[b-lk9jmfga6v] {
    flex: 1;
    display: flex;
    gap: 4px;
    min-width: 0;
    /* Linije na 0, 50 i 100 % - bez njih oznake na osi nemaju prema čemu da se čitaju. */
    background-image: linear-gradient(#e7edf0, #e7edf0),
                      linear-gradient(#e7edf0, #e7edf0),
                      linear-gradient(#e7edf0, #e7edf0);
    background-repeat: no-repeat;
    background-size: 100% 1px;
    background-position: 0 0, 0 50%, 0 100%;
}

.chart-col[b-lk9jmfga6v] {
    flex: 1;
    display: flex;
    align-items: flex-end;
    min-width: 0;
}

/* Isti razmak s lijeva kao osa (34px) plus gap (6px), pa dan stoji ispod svog stupca. */
.chart-days[b-lk9jmfga6v] {
    display: flex;
    gap: 4px;
    padding-left: 40px;
}

.chart-bar[b-lk9jmfga6v] {
    width: 100%;
    background: var(--ar-primary);
    border-radius: 3px 3px 0 0;
}

.chart-bar.bad[b-lk9jmfga6v] {
    background: #d9534f;
}

.chart-day[b-lk9jmfga6v] {
    flex: 1;
    min-width: 0;
    text-align: center;
    font-size: 0.55em;
    color: gray;
}

.emulsion-history[b-lk9jmfga6v] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88em;
}

.emulsion-history th[b-lk9jmfga6v] {
    text-align: left;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-weight: normal;
    padding: 0.5em;
    border-bottom: 2px solid #ececec;
}

.emulsion-history td[b-lk9jmfga6v] {
    padding: 0.5em;
    border-bottom: 1px solid #f1f1f1;
    color: #14425a;
}

.emulsion-history td.bad[b-lk9jmfga6v] {
    color: #d9534f;
}

.emulsion-history .muted[b-lk9jmfga6v] {
    color: gray;
}

/* Granice mašine lijevo, radnja desno - brojevi u grafu moraju imati prema čemu da se čitaju. */
.limits-strip[b-lk9jmfga6v] {
    display: flex;
    align-items: center;
    gap: 1.2em;
    flex-wrap: wrap;
    background: #f9fbfc;
    border: 1px solid #ececec;
    border-radius: 0.6em;
    padding: 0.5em 0.9em;
    font-family: 'Ubuntu-Light';
    font-size: 0.82em;
    color: gray;
}

.limits-strip b[b-lk9jmfga6v] {
    font-family: 'Ubuntu-Medium';
    font-weight: normal;
    color: #14425a;
}

/* Bez okvira i podloge: ovo je uputa, a ne podatak - ne smije izgledati kao traka granica. */
.limits-missing[b-lk9jmfga6v] {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    font-family: 'Ubuntu-Light';
    font-size: 0.82em;
    color: #6c757d;
}

.limits-missing i[b-lk9jmfga6v] {
    color: #b6c2c8;
}
/* _content/ArasWeb/Pages/Odrzavanje/LegendaBoja.razor.rz.scp.css */
.legenda[b-m5qhpgk9mb] {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.legenda-btn[b-m5qhpgk9mb] {
    background: none;
    border: none;
    padding: 0;
    min-height: 0;
    color: #8fa6b2;
    font-size: 1.05em;
    cursor: pointer;
}

.legenda-btn:hover[b-m5qhpgk9mb] {
    color: var(--ar-primary-hover);
}

.legenda-panel[b-m5qhpgk9mb] {
    display: none;
    position: absolute;
    top: calc(100% + .5em);
    left: 0;
    z-index: 30;
    min-width: 320px;
    flex-direction: column;
    gap: .5em;
    padding: .9em 1em;
    background: white;
    border: 1px solid #e4eef2;
    border-radius: .8em;
    box-shadow: 0 .5em 1.5em rgba(20, 66, 90, .15);
    font-size: .85em;
    color: #14425a;
    /* Miš prelazi preko panela dok čita - bez ovoga bi se zatvorio na pola puta. */
    cursor: default;
}

.legenda:hover .legenda-panel[b-m5qhpgk9mb],
.legenda.open .legenda-panel[b-m5qhpgk9mb] {
    display: flex;
}

.legenda-naslov[b-m5qhpgk9mb] {
    font-family: 'Ubuntu-Medium';
    padding-bottom: .4em;
    border-bottom: 1px solid #e4eef2;
}

.legenda-red[b-m5qhpgk9mb] {
    display: flex;
    align-items: center;
    gap: .6em;
    white-space: nowrap;
}

.legenda-napomena[b-m5qhpgk9mb] {
    padding-top: .4em;
    border-top: 1px solid #e4eef2;
    color: #6c757d;
    font-size: .92em;
    white-space: normal;
}

/* Iste boje kao labele paketa u "Moj dan" - legenda gubi smisao ako se raziđu. */
.pill[b-m5qhpgk9mb] {
    display: inline-flex;
    align-items: center;
    border-radius: 2em;
    padding: .25em .8em;
    font-size: .85em;
    font-family: 'Ubuntu-Medium';
    white-space: nowrap;
}

.pill-ok[b-m5qhpgk9mb] {
    background: rgba(92, 184, 92, .15);
    color: #2f7a2f;
}

.pill-warn[b-m5qhpgk9mb] {
    background: rgba(240, 173, 78, .20);
    color: #9a6212;
}

.pill-late[b-m5qhpgk9mb] {
    background: rgba(217, 83, 79, .14);
    color: #b8443f;
}

.pill-deferred[b-m5qhpgk9mb] {
    background: var(--ar-primary-soft);
    color: var(--ar-primary-text);
}

.pill-count[b-m5qhpgk9mb] {
    background: #e4eef2;
    color: #14425a;
}
/* _content/ArasWeb/Pages/Odrzavanje/Modals/ChecklistModal.razor.rz.scp.css */
.checklist-modal-body[b-543i1di44v] {
    gap: 1em;
}

.checklist-modal-body .modal-hint[b-543i1di44v] {
    margin: 0;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.checklist-modal-body[b-543i1di44v]  .checklist-card {
    width: 100%;
}
/* _content/ArasWeb/Pages/Odrzavanje/Modals/DodajObavezuModal.razor.rz.scp.css */
/* .custom-modal-body je flex kolona s align-items: start, pa se grid bez width: 100%
   stisne na sadržaj - forma je stajala u lijevoj trećini modala, a placeholder naziva
   nije stao u polje. */
[b-muqrldbx3q] .obaveza-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1em;
    padding: 0.5em;
    width: 100%;
}

[b-muqrldbx3q] .obaveza-grid .modal-input-box {
    display: flex;
    flex-direction: column;
    margin-bottom: 0;
}

[b-muqrldbx3q] .obaveza-grid .modal-input-box.full-row {
    grid-column: 1 / -1;
}

[b-muqrldbx3q] .obaveza-grid .modal-input-box label {
    font-size: 0.85em;
    margin-bottom: 0.4em;
    font-family: 'Ubuntu-Light';
}

[b-muqrldbx3q] .task-kind {
    display: flex;
    gap: 1.5em;
    flex-wrap: wrap;
}

[b-muqrldbx3q] .obaveza-grid .modal-input-box .task-kind-option {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    margin: 0;
    font-size: 0.9em;
    font-family: 'Ubuntu-Medium';
    color: #14425a;
    cursor: pointer;
}
/* _content/ArasWeb/Pages/Odrzavanje/Modals/EksterniZapisnikModal.razor.rz.scp.css */
.custom-modal-body.eksterni-zapisnik[b-j2v07umoax] {
    /* ArasModal postavlja align-items:start, pa se djeca skupljaju na svoju sirinu i
       zbijaju uz lijevu ivicu; stretch ih razvlaci na punu sirinu modala.
       min-height:0 je drugi dio price: bez njega ugnijezdeni flex stupac ne moze biti
       nizi od sadrzaja, pa umjesto tijela skroluje cijeli .modal-body i podnozje s
       dugmadima (Preuzmi PDF, Spremi) zavrsi ispod ivice ekrana. */
    min-height: 0;
    align-items: stretch;
    display: flex;
    flex-direction: column;
    gap: 1.2em;
}

.from-report[b-j2v07umoax] {
    display: flex;
    align-items: center;
    gap: 0.5em;
    background: rgba(217, 83, 79, .08);
    color: #b8443f;
    border-radius: 0.6em;
    padding: 0.6em 0.8em;
    font-size: 0.85em;
}

section[b-j2v07umoax] {
    display: flex;
    flex-direction: column;
    gap: 0.8em;
    border-top: 1px solid #e4eef2;
    padding-top: 0.9em;
}

section:first-of-type[b-j2v07umoax] {
    border-top: none;
    padding-top: 0;
}

h6[b-j2v07umoax] {
    display: flex;
    align-items: center;
    gap: 0.5em;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: 0.95em;
    margin: 0;
}

.no[b-j2v07umoax] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.6em;
    height: 1.6em;
    border-radius: 50%;
    background: #e4eef2;
    font-size: 0.85em;
}

.read-grid[b-j2v07umoax] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 0.6em;
    background: #f7fafb;
    border-radius: 0.6em;
    padding: 0.8em;
}

.read-grid label[b-j2v07umoax] {
    display: block;
    color: #55646c;
    font-size: 0.8em;
}

.read-grid span[b-j2v07umoax] {
    color: #14425a;
}

.form-grid[b-j2v07umoax] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.8em;
}

/* Datum/vrijeme inače iscrtava preglednik svojim zadanim izgledom - ovdje se barem
   uskladi obrub, boja i veličina fonta s ostatkom forme. */
.modal-input-box input[type="datetime-local"].form-control[b-j2v07umoax] {
    padding: 0.5em 0.6em;
    border: 1px solid #e4eef2;
    border-radius: 0.5em;
    color: #14425a;
    font-family: 'Ubuntu-Light';
    font-size: 0.9em;
    color-scheme: light;
}

.modal-input-box input[type="datetime-local"].form-control:focus[b-j2v07umoax] {
    outline: none;
    border-color: var(--ar-primary);
    box-shadow: 0 0 0 0.15em rgba(2, 117, 216, .15);
}

.modal-input-box label[b-j2v07umoax] {
    display: block;
    color: #55646c;
    font-size: 0.8em;
    margin-bottom: 0.3em;
}

.optional[b-j2v07umoax] {
    color: #7d878d;
}

.choice-row[b-j2v07umoax] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
}

.choice[b-j2v07umoax] {
    border: 1px solid #e4eef2;
    background: white;
    color: #55646c;
    border-radius: 2em;
    padding: 0.5em 1.1em;
    font-size: 0.85em;
    min-height: 44px;
    cursor: pointer;
}

.choice.selected[b-j2v07umoax] {
    background: #e4eef2;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

/* Ikona + tekst inače sjede zbijeno na istu visinu kao čist tekst - malo više
   paddinga i razmaka između njih daje im daha. */
.choice.state-choice[b-j2v07umoax] {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    padding: 0.6em 1.4em;
}

.costs .total[b-j2v07umoax] {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.total-value[b-j2v07umoax] {
    color: #5cb85c;
    font-family: 'Ubuntu-Medium';
    font-size: 1.1em;
    padding: 0.4em 0;
}

.attachment-list[b-j2v07umoax] {
    list-style: none;
    margin: 0.5em 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.3em;
}

.attachment-list li[b-j2v07umoax] {
    display: flex;
    align-items: center;
    gap: 0.5em;
    font-size: 0.85em;
    color: #14425a;
}

.link-btn[b-j2v07umoax] {
    border: none;
    background: none;
    color: var(--ar-primary);
    padding: 0;
    cursor: pointer;
    font-size: 0.9em;
}

.mt-1[b-j2v07umoax] {
    margin-top: 0.4em;
}

/* Izračunata polja (zastoj, prijevod sati u h/min) - prikaz, ne unos. */
.field-value[b-j2v07umoax] {
    display: block;
    padding: 0.45em 0;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.field-hint[b-j2v07umoax] {
    display: block;
    margin-top: 0.25em;
    color: #55646c;
    font-size: 0.8em;
}

/* Bez ovoga polja u mrežnoj ćeliji ostaju na svojoj prirodnoj širini. */
.modal-input-box[b-j2v07umoax] {
    width: 100%;
}

.modal-input-box .form-control[b-j2v07umoax],
.modal-input-box .decimal-input-wrapper[b-j2v07umoax] {
    width: 100%;
}
/* _content/ArasWeb/Pages/Odrzavanje/Modals/InterniServisModal.razor.rz.scp.css */
.custom-modal-body.interni-servis[b-yv2srbl15o] {
    /* ArasModal postavlja align-items:start, pa se djeca skupljaju na svoju sirinu i
       zbijaju uz lijevu ivicu; stretch ih razvlaci na punu sirinu modala.
       min-height:0 je drugi dio price: bez njega ugnijezdeni flex stupac ne moze biti
       nizi od sadrzaja, pa umjesto tijela skroluje cijeli .modal-body i podnozje s
       dugmadima (Preuzmi PDF, Spremi) zavrsi ispod ivice ekrana. */
    min-height: 0;
    align-items: stretch;
    display: flex;
    flex-direction: column;
    gap: 0.9em;
}

.from-report[b-yv2srbl15o] {
    display: flex;
    align-items: center;
    gap: 0.5em;
    background: rgba(217, 83, 79, .08);
    color: #b8443f;
    border-radius: 0.6em;
    padding: 0.6em 0.8em;
    font-size: 0.85em;
}

.machine-line[b-yv2srbl15o] {
    display: flex;
    align-items: center;
    gap: 0.5em;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.modal-input-box label[b-yv2srbl15o] {
    display: block;
    color: #55646c;
    font-size: 0.8em;
    margin-bottom: 0.3em;
}

.optional[b-yv2srbl15o] {
    color: #7d878d;
}

.form-grid[b-yv2srbl15o] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.8em;
}

/* Zastoj i rad kao dva odvojena bloka umjesto pomiješani u istoj mreži. */
.time-groups[b-yv2srbl15o] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 0.8em;
}

.time-group[b-yv2srbl15o] {
    display: flex;
    flex-direction: column;
    gap: 0.6em;
    background: #f7fafb;
    border: 1px solid #e4eef2;
    border-radius: 0.8em;
    padding: 0.9em;
}

.time-group-title[b-yv2srbl15o] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: 0.85em;
}

.time-group-fields[b-yv2srbl15o] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 0.6em;
}

/* Datum/vrijeme inače iscrtava preglednik svojim zadanim izgledom - ovdje se barem
   uskladi obrub, boja i veličina fonta s ostatkom forme. */
.modal-input-box input[type="datetime-local"].form-control[b-yv2srbl15o] {
    padding: 0.5em 0.6em;
    border: 1px solid #e4eef2;
    border-radius: 0.5em;
    color: #14425a;
    font-family: 'Ubuntu-Light';
    font-size: 0.9em;
    color-scheme: light;
}

.modal-input-box input[type="datetime-local"].form-control:focus[b-yv2srbl15o] {
    outline: none;
    border-color: var(--ar-primary);
    box-shadow: 0 0 0 0.15em rgba(2, 117, 216, .15);
}

.time-group-total[b-yv2srbl15o] {
    border-top: 1px solid #e4eef2;
    padding-top: 0.6em;
}

.choice-row[b-yv2srbl15o] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
}

.choice[b-yv2srbl15o] {
    border: 1px solid #e4eef2;
    background: white;
    color: #55646c;
    border-radius: 2em;
    padding: 0.5em 1.1em;
    font-size: 0.85em;
    min-height: 44px;
    cursor: pointer;
}

.choice.selected[b-yv2srbl15o] {
    background: #e4eef2;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

/* Ikona + tekst inače sjede zbijeno na istu visinu kao čist tekst - malo više
   paddinga i razmaka između njih daje im daha. */
.choice.state-choice[b-yv2srbl15o] {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    padding: 0.6em 1.4em;
}

.pill[b-yv2srbl15o] {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    border-radius: 2em;
    padding: 0.5em 1.1em;
    font-size: 0.85em;
    font-family: 'Ubuntu-Medium';
}

.costs .total[b-yv2srbl15o] {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.total-value[b-yv2srbl15o] {
    color: #5cb85c;
    font-family: 'Ubuntu-Medium';
    font-size: 1.1em;
    padding: 0.4em 0;
}

.modal-hint[b-yv2srbl15o] {
    color: #55646c;
    font-size: 0.8em;
    margin: 0;
}

/* Izračunata polja (zastoj, prijevod sati u h/min) - prikaz, ne unos. */
.field-value[b-yv2srbl15o] {
    display: block;
    padding: 0.45em 0;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.field-hint[b-yv2srbl15o] {
    display: block;
    margin-top: 0.25em;
    color: #55646c;
    font-size: 0.8em;
}

/* Bez ovoga polja u mrežnoj ćeliji ostaju na svojoj prirodnoj širini. */
.modal-input-box[b-yv2srbl15o] {
    width: 100%;
}

.modal-input-box .form-control[b-yv2srbl15o],
.modal-input-box .decimal-input-wrapper[b-yv2srbl15o] {
    width: 100%;
}
/* _content/ArasWeb/Pages/Odrzavanje/Modals/NaCekanjeModal.razor.rz.scp.css */
/* Klasa .na-cekanje stoji na samom .custom-modal-body, pa se pravila pišu bez vodećeg
   ::deep - izolacija taj element već obilježava. ::deep treba samo za ono što iscrtavaju
   ugniježđene komponente (InputDate i sl. daju .form-control bez našeg scope atributa). */
.na-cekanje[b-5qirk7zygd] {
    gap: 1em;
}

.na-cekanje .modal-hint[b-5qirk7zygd] {
    margin: 0;
    color: #6c757d;
    font-size: 0.85em;
}

.na-cekanje .modal-input-box[b-5qirk7zygd] {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.na-cekanje .modal-input-box label[b-5qirk7zygd] {
    font-size: 0.85em;
    margin-bottom: 0.4em;
    font-family: 'Ubuntu-Light';
}

.na-cekanje .optional[b-5qirk7zygd] {
    color: #6c757d;
    font-size: 0.85em;
}

/* .custom-modal-body ima align-items:start, pa se polja skupljaju na sadržaj. */
.na-cekanje[b-5qirk7zygd]  .form-control {
    width: 100%;
}

/* Razlozi su fiksni spisak iz koncepta - radio lista, ne slobodan unos, da se
   kasnije mogu prebrojati po razlogu. */
.na-cekanje .reason-list[b-5qirk7zygd] {
    display: flex;
    flex-direction: column;
    gap: 0.4em;
    width: 100%;
}

.na-cekanje .reason-option[b-5qirk7zygd] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.6em;
    padding: 0.6em 0.8em;
    border: 1px solid #e4eef2;
    border-radius: 0.7em;
    background: white;
    color: #14425a;
    font-size: 0.88em;
    text-align: left;
    cursor: pointer;
    min-height: 44px;
}

.na-cekanje .reason-option i[b-5qirk7zygd] {
    color: #b6c2c8;
}

.na-cekanje .reason-option.selected[b-5qirk7zygd] {
    border-color: var(--ar-primary);
    background: var(--ar-primary-soft);
}

.na-cekanje .reason-option.selected i[b-5qirk7zygd] {
    color: var(--ar-primary);
}

.na-cekanje .run-choice[b-5qirk7zygd] {
    display: flex;
    gap: 0.4em;
    width: 100%;
}

.na-cekanje .run-choice .reason-option[b-5qirk7zygd] {
    flex: 1;
    text-align: left;
}

.na-cekanje .run-choice span[b-5qirk7zygd] {
    display: flex;
    flex-direction: column;
}

.na-cekanje .run-choice small[b-5qirk7zygd] {
    color: #6c757d;
    font-size: 0.8em;
}

.na-cekanje .field-warning[b-5qirk7zygd] {
    display: block;
    margin-top: 0.4em;
    color: #b8860b;
    font-size: 0.85em;
}

@media (max-width: 480px) {
    .na-cekanje .run-choice[b-5qirk7zygd] {
        flex-direction: column;
    }
}
/* _content/ArasWeb/Pages/Odrzavanje/Modals/NalogDetaljModal.razor.rz.scp.css */
.custom-modal-body.nalog-detalj[b-9x5dtfdvde] {
    /* ArasModal postavlja align-items:start, pa se djeca skupljaju na svoju sirinu i
       zbijaju uz lijevu ivicu; stretch ih razvlaci na punu sirinu modala.
       min-height:0 je drugi dio price: bez njega ugnijezdeni flex stupac ne moze biti
       nizi od sadrzaja, pa umjesto tijela skroluje cijeli .modal-body i podnozje s
       dugmadima (Preuzmi PDF, Spremi) zavrsi ispod ivice ekrana. */
    min-height: 0;
    align-items: stretch;
    display: flex;
    flex-direction: column;
    gap: 0.9em;
}

.detalj-head[b-9x5dtfdvde] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5em;
}

.number[b-9x5dtfdvde] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: 1.05em;
}

.pill[b-9x5dtfdvde] {
    display: inline-flex;
    align-items: center;
    gap: 0.35em;
    border-radius: 2em;
    padding: 0.25em 0.8em;
    font-size: 0.8em;
    font-family: 'Ubuntu-Medium';
    background: #f0f2f3;
    color: #5f6f77;
}

.pill.type[b-9x5dtfdvde] {
    background: #e4eef2;
    color: #14425a;
}

.detalj-machine[b-9x5dtfdvde] {
    display: flex;
    align-items: center;
    gap: 0.5em;
    color: #14425a;
}

.loc[b-9x5dtfdvde] {
    color: #55646c;
    font-size: 0.85em;
}

.detalj-grid[b-9x5dtfdvde] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 0.6em;
    background: #f7fafb;
    border-radius: 0.6em;
    padding: 0.8em;
}

.detalj-grid label[b-9x5dtfdvde] {
    display: block;
    color: #55646c;
    font-size: 0.8em;
}

.detalj-grid span[b-9x5dtfdvde] {
    color: #14425a;
}

.detalj-card[b-9x5dtfdvde] {
    border: 1px solid #e4eef2;
    border-radius: 0.6em;
    padding: 0.8em;
}

.detalj-card label[b-9x5dtfdvde] {
    display: block;
    color: #55646c;
    font-size: 0.8em;
    margin-bottom: 0.3em;
}

.detalj-card p[b-9x5dtfdvde] {
    margin: 0;
    color: #14425a;
    white-space: pre-wrap;
}

/* Intervencija poslije koje je prijava vraćena u rad - ista žuta kao napomena u detalju prijave. */
.detalj-card.reopened[b-9x5dtfdvde] {
    border-color: rgba(224, 180, 0, 0.45);
    background: rgba(255, 204, 0, 0.12);
}

.order-index[b-9x5dtfdvde] {
    margin-left: 0.3em;
    color: #55646c;
    font-size: 0.9em;
}

.attachment-list[b-9x5dtfdvde] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.3em;
}

.attachment-list li[b-9x5dtfdvde] {
    display: flex;
    align-items: center;
    gap: 0.5em;
    font-size: 0.85em;
    color: #14425a;
}

.link-btn[b-9x5dtfdvde] {
    border: none;
    background: none;
    color: var(--ar-primary);
    padding: 0;
    cursor: pointer;
    font-size: 0.9em;
}

.modal-hint[b-9x5dtfdvde] {
    color: #55646c;
    font-size: 0.8em;
    margin: 0;
}
/* _content/ArasWeb/Pages/Odrzavanje/Modals/OcitanjeBrojilaModal.razor.rz.scp.css */
.ocitanje-brojila[b-j0qfqm3m2b] {
    gap: 1em;
}

.ocitanje-brojila .machine-head[b-j0qfqm3m2b] {
    display: flex;
    align-items: center;
    gap: .8em;
    border-left: 4px solid var(--ar-primary);
    padding: .2em 0 .2em .8em;
}

.ocitanje-brojila .machine-icon[b-j0qfqm3m2b] {
    color: var(--ar-primary);
    font-size: 1.4em;
}

.ocitanje-brojila .machine-text[b-j0qfqm3m2b] {
    display: flex;
    flex-direction: column;
}

.ocitanje-brojila .machine-name[b-j0qfqm3m2b] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: 1.15em;
}

.ocitanje-brojila .machine-location[b-j0qfqm3m2b] {
    color: #6c757d;
    font-size: .85em;
}

.ocitanje-brojila .current-hours[b-j0qfqm3m2b] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* Broj sati ne smije biti prilijepljen uz tekst kad se red skupi. */
    gap: 1.5em;
    background: #e4eef2;
    border-radius: .7em;
    padding: .6em .9em;
    font-size: .9em;
}

/* Stanje brojila je ono zbog čega se ovaj red gleda - istakne se od opisa lijevo. */
.ocitanje-brojila .current-hours-value[b-j0qfqm3m2b] {
    font-family: 'Ubuntu-Medium';
    color: #14425a;
    white-space: nowrap;
}

.ocitanje-brojila .current-hours label[b-j0qfqm3m2b] {
    color: #6c757d;
    margin: 0;
}

.ocitanje-brojila .current-hours-text[b-j0qfqm3m2b] {
    display: flex;
    flex-direction: column;
}

.ocitanje-brojila .current-hours .current-hours-sub[b-j0qfqm3m2b] {
    font-family: 'Ubuntu-Light';
    color: #6c757d;
    font-size: .85em;
}

.ocitanje-brojila .link-btn[b-j0qfqm3m2b] {
    background: none;
    border: none;
    color: var(--ar-primary);
    cursor: pointer;
    padding: 0;
    min-height: 0;
}

.ocitanje-brojila .undo-reading[b-j0qfqm3m2b] {
    align-self: flex-start;
    font-size: .85em;
}

.ocitanje-brojila .delete-confirm[b-j0qfqm3m2b] {
    display: flex;
    flex-direction: column;
    gap: .5em;
    background: rgba(217, 83, 79, .08);
    border: 1px solid rgba(217, 83, 79, .35);
    border-radius: .7em;
    padding: .6em .9em;
    font-size: .88em;
    color: #14425a;
}

.ocitanje-brojila .delete-confirm-buttons[b-j0qfqm3m2b] {
    display: flex;
    justify-content: flex-end;
    gap: 1em;
}

.ocitanje-brojila .link-btn.danger[b-j0qfqm3m2b] {
    color: #d9534f;
    font-family: 'Ubuntu-Medium';
}

.ocitanje-brojila .current-hours span[b-j0qfqm3m2b] {
    font-family: 'Ubuntu-Medium';
    color: #14425a;
}

.ocitanje-brojila .modal-input-box[b-j0qfqm3m2b] {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.ocitanje-brojila .modal-input-box label[b-j0qfqm3m2b] {
    font-size: 0.85em;
    margin-bottom: 0.4em;
    font-family: 'Ubuntu-Light';
}

.ocitanje-brojila[b-j0qfqm3m2b]  .form-control {
    width: 100%;
}
/* _content/ArasWeb/Pages/Odrzavanje/Modals/OdgodaModal.razor.rz.scp.css */
/* Isti obrazac kao NaCekanjeModal (na-cekanje) - CSS izolacija je po komponenti, pa se
   ovdje ne može naslijediti, samo ponoviti pod .odgoda-modal. */
.odgoda-modal[b-4g8btvmg4l] {
    gap: 1em;
}

.odgoda-modal .modal-hint[b-4g8btvmg4l] {
    margin: 0;
    color: #6c757d;
    font-size: 0.85em;
}

.odgoda-modal .modal-input-box[b-4g8btvmg4l] {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.odgoda-modal .modal-input-box label[b-4g8btvmg4l] {
    font-size: 0.85em;
    margin-bottom: 0.4em;
    font-family: 'Ubuntu-Light';
}

.odgoda-modal[b-4g8btvmg4l]  .form-control {
    width: 100%;
}

.odgoda-modal /* Šifarnik nije stigao - modal mora ponuditi novi pokušaj, a ne prazan spisak. */
.reason-retry[b-4g8btvmg4l] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .6em;
    margin-bottom: .6em;
    color: #8a6d3b;
    font-size: .88em;
}

.reason-retry-btn[b-4g8btvmg4l] {
    display: inline-flex;
    align-items: center;
    gap: .5em;
    border: 1px solid var(--ar-primary);
    background: var(--ar-primary-soft);
    color: var(--ar-primary-text);
    border-radius: .6em;
    padding: .4em .9em;
    font-size: .9em;
    min-height: 44px;
    cursor: pointer;
}

.reason-list[b-4g8btvmg4l] {
    display: flex;
    flex-direction: column;
    gap: 0.4em;
    width: 100%;
}

.odgoda-modal .reason-option[b-4g8btvmg4l] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.6em;
    padding: 0.6em 0.8em;
    border: 1px solid #e4eef2;
    border-radius: 0.7em;
    background: white;
    color: #14425a;
    font-size: 0.88em;
    text-align: left;
    cursor: pointer;
    min-height: 44px;
}

.odgoda-modal .reason-option i[b-4g8btvmg4l] {
    color: #b6c2c8;
}

.odgoda-modal .reason-option.selected[b-4g8btvmg4l] {
    border-color: var(--ar-primary);
    background: var(--ar-primary-soft);
}

.odgoda-modal .reason-option.selected i[b-4g8btvmg4l] {
    color: var(--ar-primary);
}
/* _content/ArasWeb/Pages/Odrzavanje/Modals/PaketModal.razor.rz.scp.css */
.paket-modal[b-nbta0x6g1y] {
    gap: 1em;
}

.paket-head[b-nbta0x6g1y] {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.paket-machine[b-nbta0x6g1y] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.paket-sub[b-nbta0x6g1y] {
    color: #6c757d;
    font-size: .85em;
}

.late-text[b-nbta0x6g1y] {
    color: #b8443f;
}

.paket-items[b-nbta0x6g1y] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .6em;
    width: 100%;
}

/* Fiksna visina reda: dugme "Odgodi" nosi globalnih 44px, pa bi red bez njega bio niži i
   lista bi se pomjerala kako se stavke čekiraju. */
.paket-item[b-nbta0x6g1y] {
    display: flex;
    align-items: center;
    gap: .8em;
    min-height: 44px;
}

.paket-bulk[b-nbta0x6g1y] {
    display: flex;
    gap: 1.5em;
    width: 100%;
}

.paket-bulk .problem-btn[b-nbta0x6g1y] {
    margin-left: auto;
    color: #b8443f;
}

.link-btn:disabled[b-nbta0x6g1y] {
    color: #9fb2bb;
    cursor: default;
}

/* Mjesto kvačice kod stavke koja se zatvara mjerenjem - ista širina da se nazivi poravnaju. */
.emulsion-placeholder[b-nbta0x6g1y] {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 32px;
    min-width: 32px;
    height: 32px;
    color: #6c757d;
}

.paket-item-main[b-nbta0x6g1y] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

.paket-item-name[b-nbta0x6g1y] {
    color: #14425a;
}

.paket-item-sub[b-nbta0x6g1y] {
    color: #6c757d;
    font-size: .78em;
}

/* Zašto je kvačica zaključana - tablet ne prikazuje tooltip, pa to mora pisati u redu. */
.locked-note[b-nbta0x6g1y] {
    color: #8a6d3b;
}

.pill[b-nbta0x6g1y] {
    display: inline-flex;
    align-items: center;
    border-radius: 2em;
    padding: .25em .8em;
    font-size: .72em;
    font-family: 'Ubuntu-Medium';
    white-space: nowrap;
}

.interval-pill[b-nbta0x6g1y] {
    background: #ececec;
    color: #14425a;
}

.link-btn[b-nbta0x6g1y] {
    background: none;
    border: none;
    color: var(--ar-primary);
    font-size: .85em;
    cursor: pointer;
    padding: 0;
    /* Razmak između ikone i teksta - bez njega se slijepe u jednu mrlju. */
    display: inline-flex;
    align-items: center;
    gap: .5em;
}

.paket-footer[b-nbta0x6g1y] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding-top: .8em;
    border-top: 1px solid #e4eef2;
}

/* Poziv na akciju - ista plava kao ostala primarna dugmad; sivo dok nema izmjena. */
.submit-btn[b-nbta0x6g1y] {
    gap: .5em;
    background: var(--color-primary);
    color: white;
    font-family: 'Ubuntu-Medium';
    cursor: pointer;
}

.submit-btn:hover:not(:disabled)[b-nbta0x6g1y] {
    background: var(--color-primary-hover);
}

.submit-btn:disabled[b-nbta0x6g1y] {
    background: #e4eef2;
    color: #9fb2bb;
    box-shadow: none !important;
    cursor: default;
}

.paket-progress[b-nbta0x6g1y] {
    font-family: 'Ubuntu-Medium';
    color: #14425a;
}

/* Red emulzije nema kvačicu - umjesto nje nudi radnju koja ga jedina može zatvoriti. */
.emulsion-link[b-nbta0x6g1y] {
    background: none;
    border: none;
    color: var(--ar-primary);
    cursor: pointer;
    padding: 0;
    min-height: 0;
    font-size: inherit;
    margin-left: .5em;
}
/* _content/ArasWeb/Pages/Odrzavanje/Modals/PdfPregledModal.razor.rz.scp.css */
.custom-modal-body.pdf-pregled[b-4b1vux5fw2] {
    /* ArasModal postavlja align-items:start, pa se djeca skupljaju na svoju sirinu i
       zbijaju uz lijevu ivicu; stretch ih razvlaci na punu sirinu modala.
       min-height:0 je drugi dio price: bez njega ugnijezdeni flex stupac ne moze biti
       nizi od sadrzaja, pa umjesto tijela skroluje cijeli .modal-body i podnozje s
       dugmadima (Preuzmi PDF, Spremi) zavrsi ispod ivice ekrana. */
    min-height: 0;
    align-items: stretch;
    display: flex;
    flex-direction: column;
    gap: 0.8em;
}

.report-head[b-4b1vux5fw2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.2em;
    border-bottom: 1px solid #e4eef2;
    padding-bottom: 0.8em;
}

h5[b-4b1vux5fw2] {
    margin: 0;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.period[b-4b1vux5fw2] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: 0.9em;
}

.filters[b-4b1vux5fw2] {
    color: #55646c;
    font-size: 0.8em;
    text-align: center;
}

.kpis[b-4b1vux5fw2] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 0.6em;
}

.kpis div[b-4b1vux5fw2] {
    border: 1px solid #e4eef2;
    border-radius: 0.6em;
    padding: 0.6em;
}

.kpis label[b-4b1vux5fw2] {
    display: block;
    color: #55646c;
    font-size: 0.8em;
}

.kpis span[b-4b1vux5fw2] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: 1.05em;
}

h6[b-4b1vux5fw2] {
    margin: 0;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: 0.9em;
}

/* overflow:auto obara flex-item automatski minimum na 0, pa bi bez min-height ova
   kutija skupila ispod visine sadržaja čim modalu ponestane prostora - a onda se
   vidi samo jedan red umjesto par. Vanjski .modal-body skroluje kad zaista zatreba. */
.preview-scroll[b-4b1vux5fw2] {
    min-height: 150px;
    max-height: 260px;
    overflow: auto;
}

.preview-scroll.tall[b-4b1vux5fw2] {
    min-height: 200px;
    max-height: 300px;
}

table[b-4b1vux5fw2] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8em;
}

th[b-4b1vux5fw2] {
    text-align: left;
    color: #55646c;
    font-family: 'Ubuntu-Light';
    font-weight: normal;
    padding: 0.4em;
    border-bottom: 1px solid #e4eef2;
    position: sticky;
    top: 0;
    background: white;
}

td[b-4b1vux5fw2] {
    padding: 0.4em;
    border-bottom: 1px solid #f2f5f6;
    color: #14425a;
}

.num[b-4b1vux5fw2] {
    text-align: right;
    white-space: nowrap;
}
/* _content/ArasWeb/Pages/Odrzavanje/Modals/PrijavaDetaljModal.razor.rz.scp.css */
/* Klase .prijava-detalj i .detalj-actions stoje na elementima ove komponente, pa se
   pravila pišu bez vodećeg ::deep - izolacija ih već obilježava. Ranije su sva bila
   mrtva jer je ::deep tražio scope-ovanog pretka iznad .custom-modal-body, kojeg nema. */
.prijava-detalj[b-9v04rxfb08] {
    gap: 1em;
}

.prijava-detalj .detalj-head[b-9v04rxfb08] {
    display: flex;
    align-items: center;
    gap: 0.6em;
    flex-wrap: wrap;
    width: 100%;
}

.prijava-detalj .detalj-head h5[b-9v04rxfb08] {
    flex: 1;
    min-width: 0;
    margin: 0;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: 1.05em;
}

.prijava-detalj .pill[b-9v04rxfb08] {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    border-radius: 2em;
    padding: 0.25em 0.8em;
    font-size: 0.72em;
    font-family: 'Ubuntu-Medium';
    white-space: nowrap;
}

.prijava-detalj .detalj-machine[b-9v04rxfb08] {
    display: flex;
    align-items: center;
    gap: 0.5em;
    width: 100%;
    color: #14425a;
    font-size: 0.9em;
}

.prijava-detalj .detalj-machine .loc[b-9v04rxfb08] {
    color: #55646c;
    font-size: 0.9em;
}

.prijava-detalj .detalj-card[b-9v04rxfb08] {
    width: 100%;
    background: #f7fafb;
    border-radius: 0.8em;
    padding: 0.8em 1em;
}

.prijava-detalj .detalj-card label[b-9v04rxfb08] {
    color: #55646c;
    font-size: 0.8em;
}

.prijava-detalj .detalj-card p[b-9v04rxfb08] {
    margin: 0.3em 0 0;
    color: #14425a;
    white-space: pre-wrap;
}

/* Pet koraka toka. Prošli su plavi, tekući naglašen, budući blijedi - dokle se
   stiglo i šta fali vidi se bez čitanja vremena. */
.prijava-detalj .timeline[b-9v04rxfb08] {
    display: flex;
    width: 100%;
    gap: 0.3em;
}

.prijava-detalj .timeline-step[b-9v04rxfb08] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4em;
    text-align: center;
}

.prijava-detalj .timeline-step .dot[b-9v04rxfb08] {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8em;
    background: #eef2f4;
    color: #b6c2c8;
}

.prijava-detalj .timeline-step.done .dot[b-9v04rxfb08] {
    background: var(--ar-primary-soft);
    color: var(--ar-primary-text);
}

.prijava-detalj .timeline-step.active .dot[b-9v04rxfb08] {
    background: var(--ar-primary);
    color: white;
}

.prijava-detalj .timeline-step .step-label[b-9v04rxfb08] {
    display: block;
    font-size: 0.72em;
    color: #14425a;
}

.prijava-detalj .timeline-step.pending .step-label[b-9v04rxfb08] {
    color: #b6c2c8;
}

.prijava-detalj .timeline-step .step-time[b-9v04rxfb08] {
    display: block;
    font-size: 0.68em;
    color: #55646c;
}

.prijava-detalj .detalj-note[b-9v04rxfb08] {
    display: flex;
    gap: 0.6em;
    width: 100%;
    padding: 0.7em 1em;
    border-radius: 0.8em;
    background: #f0f2f3;
    color: #14425a;
    font-size: 0.85em;
}

.prijava-detalj .detalj-note.warning[b-9v04rxfb08] {
    background: rgba(255, 204, 0, 0.15);
}

.prijava-detalj .detalj-note.info[b-9v04rxfb08] {
    background: var(--ar-primary-soft);
}

.prijava-detalj .detalj-note div[b-9v04rxfb08] {
    display: flex;
    flex-direction: column;
}

.prijava-detalj .detalj-note span[b-9v04rxfb08] {
    color: #55646c;
    font-size: 0.9em;
}

/* auto-fit umjesto fiksnog broja kolona: na širokom modalu stanu tri polja u red,
   na tabletu dva, na telefonu jedno - bez media queryja. */
.prijava-detalj .detalj-grid[b-9v04rxfb08] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.8em 1em;
    width: 100%;
}

.prijava-detalj .detalj-grid label[b-9v04rxfb08] {
    display: block;
    color: #55646c;
    font-size: 0.78em;
}

.prijava-detalj .detalj-grid span[b-9v04rxfb08] {
    color: #14425a;
    font-size: 0.88em;
}

/* Intervencije prijave - vraćena ih ima više, svaka u svojoj kartici, redom. */
.prijava-detalj .intervencije[b-9v04rxfb08] {
    display: flex;
    flex-direction: column;
    gap: 0.6em;
    width: 100%;
}

.prijava-detalj .section-label[b-9v04rxfb08] {
    color: #55646c;
    font-size: 0.8em;
}

.prijava-detalj .intervencija[b-9v04rxfb08] {
    display: flex;
    flex-direction: column;
    gap: 0.6em;
    padding: 0.8em 1em;
    border-radius: 0.8em;
    background: #f7fafb;
    border-left: 3px solid #5cb85c;
}

/* Intervencija koja nije riješila kvar - žuta ivica, kao napomena ispod nje. */
.prijava-detalj .intervencija.reopened[b-9v04rxfb08] {
    border-left-color: #e0b400;
}

.prijava-detalj .intervencija-head[b-9v04rxfb08] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.6em;
    color: #14425a;
}

.prijava-detalj .intervencija-no[b-9v04rxfb08] {
    font-family: 'Ubuntu-Medium';
    font-size: 0.9em;
}

.prijava-detalj .intervencija-head .number[b-9v04rxfb08] {
    font-family: 'Ubuntu-Medium';
    font-size: 0.9em;
    padding: 0;
}

.prijava-detalj .pill.type[b-9v04rxfb08] {
    background: #e4eef2;
    color: #14425a;
}

.prijava-detalj .intervencija-who[b-9v04rxfb08] {
    color: #55646c;
    font-size: 0.82em;
}

.prijava-detalj .intervencija-grid[b-9v04rxfb08] {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

.prijava-detalj .intervencija-opis[b-9v04rxfb08] {
    margin: 0;
    color: #14425a;
    font-size: 0.88em;
    white-space: pre-wrap;
}

.prijava-detalj .detalj-photo[b-9v04rxfb08] {
    display: block;
    margin-top: 0.5em;
    max-width: 100%;
    border-radius: 0.6em;
}

.prijava-detalj .link-btn[b-9v04rxfb08] {
    background: transparent;
    border: none;
    color: var(--ar-primary);
    padding: 0.3em 0;
    cursor: pointer;
    font-size: 0.88em;
}

/* Dvostruka klasa da nadjača ::deep .buttons iz ArasModal-a, koji ima svoj razmak
   i poravnanje. Najviše su tri radnje istovremeno i u jedan red stanu do ~760px. */
.buttons.detalj-actions[b-9v04rxfb08] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 0.5em;
}

.buttons.detalj-actions button[b-9v04rxfb08] {
    min-height: 44px;
    margin-left: 0;
    padding: 0 1.1em;
    white-space: nowrap;
}

.buttons.detalj-actions .ghost-btn[b-9v04rxfb08] {
    background: white;
    color: #14425a;
    border: 1px solid #d7e3e8;
}

/* "Upiši troškove" u donjem desnom uglu kartice intervencije - pravo dugme, ne link,
   da se na riješenoj prijavi odmah vidi. */
.prijava-detalj .intervencija-actions[b-9v04rxfb08] {
    display: flex;
    justify-content: flex-end;
}

.prijava-detalj .cost-btn[b-9v04rxfb08] {
    background: var(--color-primary-hover);
    color: white;
    border: none;
    border-radius: 0.6em;
    min-height: 38px;
    padding: 0 1em;
    font-size: 0.85em;
    white-space: nowrap;
    cursor: pointer;
}

.prijava-detalj .cost-btn:disabled[b-9v04rxfb08] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Gura dugme na lijevi kraj trake, ostala ostaju desno. */
.buttons.detalj-actions .push-left[b-9v04rxfb08] {
    margin-right: auto;
}

.buttons.detalj-actions button:disabled[b-9v04rxfb08] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Ispod toga natpisi tipa "Završi - eksterni nalog" više ne stanu jedan pored
   drugog, pa idu preko cijele širine umjesto da se lome na pola reda. */
@media (max-width: 760px) {
    .buttons.detalj-actions[b-9v04rxfb08] {
        flex-direction: column;
        /* nowrap je obavezan: uz smjer column, wrap lomi u drugu kolonu čim je
           visina ograničena, pa dugmad izlete desno i traka dobije horizontalni skrol. */
        flex-wrap: nowrap;
        align-items: stretch;
    }

    .buttons.detalj-actions button[b-9v04rxfb08] {
        width: 100%;
        box-sizing: border-box;
    }
}

@media (max-width: 700px) {
    .prijava-detalj .timeline-step .step-time[b-9v04rxfb08] {
        display: none;
    }
}
/* _content/ArasWeb/Pages/Odrzavanje/Modals/PrijavaKvaraModal.razor.rz.scp.css */
/* Klasa .prijava-kvara stoji na samom .custom-modal-body - bez vodećeg ::deep, jer
   izolacija taj element već obilježava. ::deep treba samo za .form-control, koji
   iscrtavaju InputText/InputTextArea i koji nema naš scope atribut. */
.prijava-kvara[b-qd2qm4ywvt] {
    gap: 1em;
}

.prijava-kvara .machine-line[b-qd2qm4ywvt] {
    display: flex;
    align-items: center;
    gap: 0.5em;
    width: 100%;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.prijava-kvara .modal-input-box[b-qd2qm4ywvt] {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.prijava-kvara .modal-input-box label[b-qd2qm4ywvt] {
    font-size: 0.85em;
    margin-bottom: 0.4em;
    font-family: 'Ubuntu-Light';
}

/* .custom-modal-body ima align-items:start, pa se polja skupljaju na sadržaj. */
.prijava-kvara[b-qd2qm4ywvt]  .form-control {
    width: 100%;
}

.prijava-kvara .optional[b-qd2qm4ywvt] {
    color: #6c757d;
    font-size: 0.85em;
}

/* Prioritet se bira karticom s objašnjenjem, ne brojem iz padajuće liste -
   radnik bira po tome šta se dešava, a ne po šifri. */
.prijava-kvara .prio-cards[b-qd2qm4ywvt] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5em;
    width: 100%;
}

.prijava-kvara .prio-card[b-qd2qm4ywvt] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2em;
    text-align: left;
    padding: 0.6em 0.8em;
    border: 1px solid #e4eef2;
    border-radius: 0.7em;
    background: white;
    cursor: pointer;
    min-height: 44px;
}

.prijava-kvara .prio-card .prio-tag[b-qd2qm4ywvt] {
    font-family: 'Ubuntu-Medium';
    font-size: 0.8em;
}

.prijava-kvara .prio-card .prio-desc[b-qd2qm4ywvt] {
    color: #6c757d;
    font-size: 0.75em;
    line-height: 1.3;
}

.prijava-kvara .photo-picked[b-qd2qm4ywvt] {
    display: flex;
    align-items: center;
    gap: 0.5em;
    padding: 0.5em 0.8em;
    background: #f7fafb;
    border-radius: 0.6em;
    font-size: 0.85em;
    color: #14425a;
    width: 100%;
}

.prijava-kvara .photo-picked .photo-name[b-qd2qm4ywvt] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.prijava-kvara .photo-picked .link-btn[b-qd2qm4ywvt] {
    background: transparent;
    border: none;
    color: var(--ar-primary);
    cursor: pointer;
}

@media (max-width: 600px) {
    .prijava-kvara .prio-cards[b-qd2qm4ywvt] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* _content/ArasWeb/Pages/Odrzavanje/Modals/TroskoviNalogaModal.razor.rz.scp.css */
/* Polja troškova kao u EksterniZapisnikModal, u manjem modalu. */
.custom-modal-body .modal-hint[b-6ki3xlgv0b] {
    margin: 0 0 1em;
    color: #6c757d;
    font-size: 0.85em;
}

.custom-modal-body .modal-input-box[b-6ki3xlgv0b] {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.custom-modal-body .modal-input-box label[b-6ki3xlgv0b] {
    font-size: 0.85em;
    margin-bottom: 0.4em;
    font-family: 'Ubuntu-Light';
}

.custom-modal-body[b-6ki3xlgv0b]  .form-control {
    width: 100%;
}

.form-grid[b-6ki3xlgv0b] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 0.8em;
}

.costs .total[b-6ki3xlgv0b] {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.total-value[b-6ki3xlgv0b] {
    color: #5cb85c;
    font-family: 'Ubuntu-Medium';
    font-size: 1.1em;
    padding: 0.4em 0;
}

.coverage[b-6ki3xlgv0b] {
    margin-top: 1em;
}

.choice-row[b-6ki3xlgv0b] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
}

.choice[b-6ki3xlgv0b] {
    border: 1px solid #e4eef2;
    background: white;
    color: #55646c;
    border-radius: 2em;
    padding: 0.5em 1.1em;
    font-size: 0.85em;
    min-height: 44px;
    cursor: pointer;
}

.choice.selected[b-6ki3xlgv0b] {
    background: #e4eef2;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}
/* _content/ArasWeb/Pages/Odrzavanje/Modals/UnosEmulzijeModal.razor.rz.scp.css */
/* Vrijednosti prepisane iz odobrenog koncepta "Modul Održavanje" - brzi unos emulzije. */

.unos-emulzije[b-4g7aiy8nv5] {
    gap: 1em;
}

/* Zajednički .custom-modal-body je flex kolona s align-items:start, pa se djeca ne
   razvlače sama - bez ovoga bi dva polja stala jedno ispod drugog i u širokom modalu. */
.unos-emulzije > *[b-4g7aiy8nv5] {
    width: 100%;
}

.unos-emulzije .machine-head[b-4g7aiy8nv5] {
    display: flex;
    align-items: center;
    gap: .6em;
}

.unos-emulzije .machine-icon[b-4g7aiy8nv5] {
    color: var(--ar-primary);
}

.unos-emulzije .machine-name[b-4g7aiy8nv5] {
    color: #14425a;
    font-family: 'Ubuntu-Bold';
    font-size: 1.05em;
}

/* Podaci fluida: mirna traka, ne kartica - referenca koja se čita, ne radnja. */
.unos-emulzije .fluid-strip[b-4g7aiy8nv5] {
    background: #f9fbfc;
    border: 1px solid #ececec;
    border-radius: .6em;
    padding: .6em .9em;
    font-family: 'Ubuntu-Light';
    font-size: .82em;
    color: #14425a;
    line-height: 1.5;
}

.unos-emulzije .fluid-strip b[b-4g7aiy8nv5] {
    font-family: 'Ubuntu-Medium';
    font-weight: normal;
}

.unos-emulzije .section[b-4g7aiy8nv5] {
    display: flex;
    flex-direction: column;
    gap: .6em;
}

.unos-emulzije .section-title[b-4g7aiy8nv5] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: .92em;
    margin: 0;
}

.unos-emulzije .section-note[b-4g7aiy8nv5] {
    color: gray;
    font-family: 'Ubuntu-Light';
    font-size: .8em;
    margin: -.3em 0 0 0;
}

/* Dva polja dijele red; na uskom ekranu se slažu jedno ispod drugog, jer se mjerenje
   unosi i s telefona kraj mašine. */
.unos-emulzije .measure-grid[b-4g7aiy8nv5] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 1em;
}

.unos-emulzije .measure-field[b-4g7aiy8nv5] {
    display: flex;
    flex-direction: column;
}

.unos-emulzije .measure-field label[b-4g7aiy8nv5] {
    font-family: 'Ubuntu-Light';
    font-size: .9em;
    color: #14425a;
    margin-bottom: .3em;
}

/* Krupno polje: unosi se prstom, u rukavicama, kraj mašine. */
.unos-emulzije[b-4g7aiy8nv5]  .big-input {
    width: 100%;
    min-height: 52px;
    padding: .4em .7em;
    border: 1px solid lightgray;
    border-radius: .5em;
    font-size: 1.2em;
    text-align: center;
    font-family: 'Ubuntu-Medium';
    color: #14425a;
}

.unos-emulzije .measure-result[b-4g7aiy8nv5] {
    display: flex;
    align-items: center;
    gap: 1em;
    padding: .8em 1em;
    border: 1px solid #ececec;
    border-radius: .7em;
}

.unos-emulzije .result-main[b-4g7aiy8nv5] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.unos-emulzije .result-label[b-4g7aiy8nv5] {
    font-family: 'Ubuntu-Light';
    font-size: .78em;
    color: gray;
    text-transform: uppercase;
    letter-spacing: .03em;
}

.unos-emulzije .k-value[b-4g7aiy8nv5] {
    font-family: 'Ubuntu-Bold';
    font-size: 1.8em;
    color: #14425a;
    line-height: 1.1;
}

.unos-emulzije .result-note[b-4g7aiy8nv5] {
    font-family: 'Ubuntu-Light';
    font-size: .76em;
    color: gray;
}

.unos-emulzije .pill[b-4g7aiy8nv5] {
    display: inline-flex;
    align-items: center;
    gap: .35em;
    border-radius: 2em;
    padding: .35em 1em;
    font-family: 'Ubuntu-Medium';
    font-size: .8em;
    white-space: nowrap;
}

.unos-emulzije .switch-input[b-4g7aiy8nv5] {
    align-self: flex-start;
    background: none;
    border: none;
    color: var(--ar-primary);
    cursor: pointer;
    padding: 0;
    min-height: 0;
    font-size: .82em;
}

.unos-emulzije .chips[b-4g7aiy8nv5] {
    display: flex;
    flex-wrap: wrap;
    gap: .4em;
}

.unos-emulzije .chip[b-4g7aiy8nv5] {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    border: 1px solid #ececec;
    background: #fff;
    color: gray;
    border-radius: 2em;
    padding: .4em 1em;
    font-family: 'Ubuntu-Medium';
    font-size: .82em;
    cursor: pointer;
}

.unos-emulzije .chip.active[b-4g7aiy8nv5] {
    background: var(--ar-primary-soft);
    border-color: var(--ar-blue-200);
    color: var(--ar-primary);
}

.unos-emulzije .correction[b-4g7aiy8nv5] {
    display: flex;
    flex-direction: column;
    gap: .5em;
}

.unos-emulzije .correction-line[b-4g7aiy8nv5] {
    display: flex;
    align-items: flex-start;
    gap: .7em;
    border-radius: .6em;
    padding: .7em .9em;
    font-size: .88em;
    line-height: 1.4;
}

.unos-emulzije .correction-line i[b-4g7aiy8nv5] {
    margin-top: .15em;
}

.unos-emulzije .correction-line.tone-info[b-4g7aiy8nv5] {
    background: #f9fbfc;
    border: 1px solid #ececec;
    color: gray;
}

.unos-emulzije .correction-line.tone-ok[b-4g7aiy8nv5] {
    background: rgba(38, 176, 80, .12);
    border: 1px solid rgba(38, 176, 80, .35);
    color: #26b050;
}

/* Savjet za emulziju u granicama - blijedo, da ne izgleda kao uzbuna. */
.unos-emulzije .correction-line.tone-warning[b-4g7aiy8nv5] {
    background: rgba(255, 204, 0, .1);
    border: 1px solid rgba(255, 204, 0, .4);
    color: #8a6d00;
}

.unos-emulzije .correction-line.tone-bad[b-4g7aiy8nv5] {
    background: rgba(217, 83, 79, .12);
    border: 1px solid rgba(217, 83, 79, .35);
    color: #d9534f;
}

/* Kvačica "Dolijevam emulziju": cijeli red je meta, kao stavka dnevne liste. */
.unos-emulzije .topup-toggle[b-4g7aiy8nv5] {
    display: flex;
    align-items: center;
    gap: .8em;
    padding: .6em .9em;
    border: 1px solid #ececec;
    border-radius: .6em;
    background: #f9fbfc;
}

.unos-emulzije .topup-toggle.recommended[b-4g7aiy8nv5] {
    border-color: rgba(217, 83, 79, .35);
    background: rgba(217, 83, 79, .05);
}

.unos-emulzije .topup-text[b-4g7aiy8nv5] {
    display: flex;
    flex-direction: column;
    cursor: pointer;
    user-select: none;
}

.unos-emulzije .topup-label[b-4g7aiy8nv5] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.unos-emulzije .topup-note[b-4g7aiy8nv5] {
    color: #6c757d;
    font-size: .8em;
}

.unos-emulzije .after-section[b-4g7aiy8nv5] {
    border-top: 1px solid #ececec;
    padding-top: .9em;
}

.unos-emulzije .after-warning[b-4g7aiy8nv5] {
    color: #d9534f;
    font-size: .85em;
    margin: 0;
    display: flex;
    align-items: center;
    gap: .4em;
}

/* Modal otvoren iz korekcija: zatečeno stanje je podsjetnik, ne polje. */
.unos-emulzije .found-recap[b-4g7aiy8nv5] {
    display: flex;
    flex-direction: column;
    background: rgba(217, 83, 79, .08);
    border: 1px solid rgba(217, 83, 79, .3);
    border-radius: .7em;
    padding: .7em 1em;
}

.unos-emulzije .found-label[b-4g7aiy8nv5] {
    font-family: 'Ubuntu-Light';
    font-size: .78em;
    color: gray;
    text-transform: uppercase;
    letter-spacing: .03em;
}

.unos-emulzije .found-value[b-4g7aiy8nv5] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: 1.05em;
}

.unos-emulzije .found-status[b-4g7aiy8nv5] {
    color: #d9534f;
    font-size: .85em;
}

.unos-emulzije .modal-hint[b-4g7aiy8nv5] {
    color: #6c757d;
    font-family: 'Ubuntu-Light';
    font-size: .8em;
    margin: 0;
}
/* _content/ArasWeb/Pages/Odrzavanje/Modals/VratiURadModal.razor.rz.scp.css */
/* Isti raspored kao ZatvoriBezIntervencijeModal - ::deep samo za .form-control iz InputTextArea. */
.custom-modal-body .modal-hint[b-kkeig1vb9q] {
    margin: 0 0 1em;
    color: #6c757d;
    font-size: 0.85em;
}

.custom-modal-body .modal-input-box[b-kkeig1vb9q] {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.custom-modal-body .modal-input-box label[b-kkeig1vb9q] {
    font-size: 0.85em;
    margin-bottom: 0.4em;
    font-family: 'Ubuntu-Light';
}

.custom-modal-body[b-kkeig1vb9q]  .form-control {
    width: 100%;
}
/* _content/ArasWeb/Pages/Odrzavanje/Modals/ZatvoriBezIntervencijeModal.razor.rz.scp.css */
/* .custom-modal-body je element ove komponente, pa mu izolacija dodjeljuje scope -
   bez vodećeg ::deep. ::deep treba samo za .form-control iz InputTextArea. */
.custom-modal-body .modal-hint[b-zj9moy4wmu] {
    margin: 0 0 1em;
    color: #6c757d;
    font-size: 0.85em;
}

.custom-modal-body .modal-input-box[b-zj9moy4wmu] {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.custom-modal-body .modal-input-box label[b-zj9moy4wmu] {
    font-size: 0.85em;
    margin-bottom: 0.4em;
    font-family: 'Ubuntu-Light';
}

/* .custom-modal-body ima align-items:start, pa se polje skuplja na sadržaj. */
.custom-modal-body[b-zj9moy4wmu]  .form-control {
    width: 100%;
}
/* _content/ArasWeb/Pages/Odrzavanje/Odrzavanje.razor.rz.scp.css */
#odrzavanje[b-amesrh82ov] {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Isto dugme kao radnje na kartici mašine - svijetlo s obrubom. */
.header-action[b-amesrh82ov] {
    display: inline-flex;
    align-items: center;
    gap: .55em;
    background: white;
    border: 1px solid #cfdde4;
    border-radius: 1em;
    padding: .4em 1.1em;
    min-height: 44px;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: .9em;
    white-space: nowrap;
    cursor: pointer;
}

.header-action i[b-amesrh82ov] {
    color: var(--ar-primary);
}

.header-action:hover[b-amesrh82ov] {
    background: #eef6fb;
    border-color: var(--ar-primary-hover);
}
/* _content/ArasWeb/Pages/Odrzavanje/OsvjezenoChip.razor.rz.scp.css */
.refresh-chip[b-9818lnhadw] {
    display: inline-flex;
    align-items: center;
    gap: .5em;
    border-radius: 2em;
    padding: .5em 1em;
    font-size: .85em;
    font-family: 'Ubuntu-Medium';
    background: #e4eef2;
    color: #6c757d;
    border: none;
    min-height: 40px;
    white-space: nowrap;
}

.refresh-chip.stale[b-9818lnhadw] {
    background: rgba(217, 83, 79, .12);
    color: #b8443f;
    cursor: pointer;
}
/* _content/ArasWeb/Pages/Odrzavanje/SkenerMasina.razor.rz.scp.css */
/* Više pogodaka ručne pretrage - lista iznad trake za unos (ona je fiksirana na dnu). */
.machine-matches[b-4s8dvejhf8] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 76px;
    z-index: 100;
    max-height: 45vh;
    overflow-y: auto;
    background: white;
    padding: .8em 1em;
    display: flex;
    flex-direction: column;
    gap: .4em;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, .15);
}

.matches-title[b-4s8dvejhf8] {
    color: #6c757d;
    font-size: .85em;
}

.match-option[b-4s8dvejhf8] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    min-height: 52px;
    background: #fff;
    border: 1px solid #e4eef2;
    border-radius: .8em;
    padding: .5em .9em;
    text-align: left;
    cursor: pointer;
}

.match-option:hover[b-4s8dvejhf8] {
    border-color: var(--color-primary);
}

.match-name[b-4s8dvejhf8] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.match-sub[b-4s8dvejhf8] {
    color: #6c757d;
    font-size: .8em;
}
/* _content/ArasWeb/Pages/Odrzavanje/Tabs/DnevnikTab.razor.rz.scp.css */
#dnevnik[b-hnfvpahg4c] {
    display: flex;
    flex-direction: column;
    gap: .9em;
}

.dnevnik-head[b-hnfvpahg4c] {
    display: flex;
    align-items: center;
    gap: .8em;
    flex-wrap: wrap;
}

.head-note[b-hnfvpahg4c] {
    font-family: 'Ubuntu-Light';
    font-size: .85em;
    color: gray;
}

.head-actions[b-hnfvpahg4c] {
    display: flex;
    align-items: center;
    gap: .8em;
    margin-left: auto;
}

.pill[b-hnfvpahg4c] {
    display: inline-flex;
    align-items: center;
    border-radius: 2em;
    padding: .3em 1em;
    font-size: .8em;
    font-family: 'Ubuntu-Medium';
    white-space: nowrap;
}

.count-pill[b-hnfvpahg4c] {
    background: var(--ar-primary-soft);
    color: var(--ar-primary);
}

.toolbar-btn[b-hnfvpahg4c] {
    display: inline-flex;
    align-items: center;
    gap: .5em;
    background: #fff;
    border: 1px solid lightgray;
    color: #14425a;
    border-radius: .5em;
    padding: .4em 1.2em;
    min-height: 44px;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .08);
}

.toolbar-btn:hover:not(:disabled)[b-hnfvpahg4c] {
    background: #e4eef2;
}

.toolbar-btn:disabled[b-hnfvpahg4c] {
    opacity: .6;
    cursor: default;
}

/* ---------- Filteri ---------- */

.filter-card[b-hnfvpahg4c] {
    background: #fff;
    border-radius: 1em;
    padding: .9em 1.2em;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .06);
    display: flex;
    flex-direction: column;
    gap: .5em;
}

.filter-row[b-hnfvpahg4c] {
    display: flex;
    align-items: center;
    gap: .5em;
    flex-wrap: wrap;
}

.filter-label[b-hnfvpahg4c] {
    font-family: 'Ubuntu-Light';
    font-size: .8em;
    color: gray;
    width: 5.5em;
}

.chip[b-hnfvpahg4c] {
    background: #fff;
    color: gray;
    border: 1px solid lightgray;
    font-size: .82em;
    padding: .3em .9em;
    border-radius: 2em;
    cursor: pointer;
    min-height: 34px;
}

.chip.active[b-hnfvpahg4c] {
    background: var(--ar-primary-soft);
    color: var(--ar-primary);
    border-color: var(--ar-primary);
}

.range-inputs[b-hnfvpahg4c] {
    display: inline-flex;
    align-items: center;
    gap: .4em;
    color: gray;
}

.range-inputs input[b-hnfvpahg4c] {
    width: 11em;
    min-height: 34px;
    padding: .2em .5em;
}

/* ---------- Tabela ---------- */

.log-card[b-hnfvpahg4c] {
    background: var(--ar-bg-surface);
    border-radius: var(--ar-radius-lg);
    box-shadow: var(--ar-shadow-sm);
    overflow: hidden;
}

/* Na uskom ekranu tabela se skroluje vodoravno umjesto da stisne kolone u nečitljivo. */
.log-scroll[b-hnfvpahg4c] {
    overflow-x: auto;
}

/* Širine kolona u rem: zaglavlje i redovi ih dijele i kad imaju različitu veličinu slova. */
.log-row[b-hnfvpahg4c] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: var(--ar-space-3) var(--ar-space-6);
    border-bottom: 1px solid var(--ar-border);
    font-size: var(--ar-fs-md);
    min-height: 4rem;
    min-width: 1100px;
}

.log-row:last-child[b-hnfvpahg4c] {
    border-bottom: none;
}

.log-header[b-hnfvpahg4c] {
    background: var(--ar-bg-head);
    font-family: var(--ar-font);
    font-weight: var(--ar-fw-medium);
    color: var(--ar-text);
    min-height: 3.25rem;
    border-bottom-color: var(--ar-border-strong);
}

.col-date[b-hnfvpahg4c] {
    width: 9.5rem;
    flex: none;
    color: var(--ar-text);
}

.col-user[b-hnfvpahg4c] {
    width: 10rem;
    flex: none;
    color: #14425a;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.col-role[b-hnfvpahg4c] {
    width: 7.5rem;
    flex: none;
}

.col-machine[b-hnfvpahg4c] {
    width: 12rem;
    flex: none;
    font-family: 'Ubuntu-Light';
    color: gray;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.col-event[b-hnfvpahg4c] {
    width: 9rem;
    flex: none;
    display: flex;
    align-items: center;
    gap: .45em;
    color: var(--ar-primary);
}

.col-event i[b-hnfvpahg4c] {
    font-size: .9em;
}

.event-tone-red[b-hnfvpahg4c] {
    color: #d9534f;
}

.event-tone-green[b-hnfvpahg4c] {
    color: #26b050;
}

.event-tone-amber[b-hnfvpahg4c] {
    color: #8a6d00;
}

.col-desc[b-hnfvpahg4c] {
    flex: 1;
    min-width: 16rem;
    color: #14425a;
}

.log-header .col-date[b-hnfvpahg4c],
.log-header .col-user[b-hnfvpahg4c],
.log-header .col-role[b-hnfvpahg4c],
.log-header .col-machine[b-hnfvpahg4c],
.log-header .col-event[b-hnfvpahg4c],
.log-header .col-desc[b-hnfvpahg4c] {
    color: var(--ar-text);
    font-family: var(--ar-font);
    font-weight: var(--ar-fw-medium);
}

.muted[b-hnfvpahg4c] {
    font-family: 'Ubuntu-Light';
    color: gray;
}

.source-icon[b-hnfvpahg4c] {
    color: #b6c2c8;
    font-size: .75em;
    margin-left: .3em;
}

.role-pill[b-hnfvpahg4c] {
    display: inline-block;
    font-family: 'Ubuntu-Medium';
    font-size: .75em;
    padding: .2em .7em;
    border-radius: 2em;
    background: rgba(84, 124, 140, .25);
    color: #14425a;
}

.role-pill.production[b-hnfvpahg4c] {
    background: rgba(38, 176, 80, .15);
    color: #26b050;
}

.role-pill.maintenance[b-hnfvpahg4c] {
    background: var(--ar-primary-soft);
    color: var(--ar-primary);
}

.role-pill.hygiene[b-hnfvpahg4c] {
    background: rgba(142, 110, 196, .15);
    color: #7a5cb8;
}

.attention-pill[b-hnfvpahg4c] {
    display: inline-block;
    margin-left: .5em;
    font-family: 'Ubuntu-Medium';
    font-size: .72em;
    padding: .1em .6em;
    border-radius: 2em;
    background: rgba(255, 204, 0, .25);
    color: #8a6d00;
}

.empty-state[b-hnfvpahg4c] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5em;
    padding: 2.5em;
    color: gray;
    font-family: 'Ubuntu-Light';
}

.empty-state i[b-hnfvpahg4c] {
    font-size: 2em;
    color: #d7e3e8;
}
/* _content/ArasWeb/Pages/Odrzavanje/Tabs/EmulzijaTab.razor.rz.scp.css */
/* Vrijednosti (boje, razmaci, visine) su prepisane iz odobrenog koncepta
   "Modul Održavanje", da se izgled ne razilazi s onim što je klijent vidio. */

#emulzija-tab[b-n0557nzuqd] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    /* Stavke flex kolone imaju min-width:auto, pa bi ih tabela široka 980px razvukla i
       cijela stranica bi skrolala ustranu - umjesto da skrola samo tabela. */
    min-width: 0;
}

/* Kartica koncepta: lagana sjena, ne Bootstrapov .shadow (0 .5rem 1rem) - od njega
   ekran izgleda teško i razvučeno. */
.odr-card[b-n0557nzuqd] {
    background: #fff;
    border-radius: 1em;
    padding: 1em;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .06);
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.card-head[b-n0557nzuqd] {
    display: flex;
    align-items: center;
    gap: 1em;
    margin-bottom: .8em;
    flex-wrap: wrap;
}

.card-title[b-n0557nzuqd] {
    font-family: 'Ubuntu-Medium';
    color: #14425a;
    font-size: 1.05em;
}

.card-note[b-n0557nzuqd],
.card-hint[b-n0557nzuqd] {
    font-family: 'Ubuntu-Light';
    font-size: .8em;
    color: gray;
    margin: 0;
}

.card-hint[b-n0557nzuqd] {
    font-size: .85em;
    margin-bottom: .7em;
}

/* Kad proizvodnja nema tabova, red ostaje samo s radnjama - zato desno, ne razvučeno. */
.tab-toolbar[b-n0557nzuqd] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1em;
    flex-wrap: wrap;
    min-height: 44px;
    padding: .4em 0;
    margin-bottom: .6em;
}

.tab-toolbar .toolbar-right[b-n0557nzuqd] {
    margin-left: auto;
}

/* Pod-tabovi su pilule u istom redu s brojevima i radnjama - isti obrazac kao tab
   "Mašine i oprema". Proizvodnja ih uopšte ne dobija (samo dnevni unos), pa red tad
   sadrži samo chip i dugme. */
.sub-tabs[b-n0557nzuqd] {
    display: flex;
    gap: .5em;
    flex-wrap: wrap;
}

.sub-tab[b-n0557nzuqd] {
    border: 1px solid #e4eef2;
    background: white;
    color: #55646c;
    border-radius: 2em;
    padding: .4em 1em;
    font-size: .85em;
    cursor: pointer;
}

.sub-tab:hover[b-n0557nzuqd] {
    color: #14425a;
}

.sub-tab.active[b-n0557nzuqd] {
    background: #e4eef2;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.toolbar-right[b-n0557nzuqd] {
    display: flex;
    align-items: center;
    gap: .8em;
    flex-wrap: wrap;
}

.chip-stat[b-n0557nzuqd] {
    display: inline-flex;
    align-items: center;
    gap: .4em;
    background: var(--ar-primary-soft);
    color: var(--ar-primary);
    font-family: 'Ubuntu-Medium';
    font-size: .85em;
    padding: .3em 1em;
    border-radius: 2em;
    white-space: nowrap;
}

.chip-stat.bad[b-n0557nzuqd] {
    background: rgba(217, 83, 79, .15);
    color: #d9534f;
}

.odr-btn[b-n0557nzuqd] {
    display: inline-flex;
    align-items: center;
    gap: .5em;
    border-radius: .5em;
    padding: .4em 1.2em;
    min-height: 44px;
    cursor: pointer;
    font-size: .9em;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .08);
}

.odr-btn.ghost[b-n0557nzuqd] {
    background: #fff;
    border: 1px solid lightgray;
    color: #14425a;
}

.odr-btn.ghost:hover:not(:disabled)[b-n0557nzuqd] {
    background: #e4eef2;
}

.odr-btn.primary-green[b-n0557nzuqd] {
    background: #26b050;
    border: none;
    color: #fff;
    font-family: 'Ubuntu-Medium';
}

.odr-btn.primary-green:hover:not(:disabled)[b-n0557nzuqd] {
    background: #1e8c40;
}

.odr-btn:disabled[b-n0557nzuqd] {
    opacity: .6;
    cursor: default;
    box-shadow: none;
}

.link-btn[b-n0557nzuqd] {
    background: none;
    border: none;
    color: var(--ar-primary);
    cursor: pointer;
    padding: 0;
    min-height: 0;
    font-size: .85em;
}

.link-btn.muted-link[b-n0557nzuqd] {
    color: gray;
}

.link-btn.discard[b-n0557nzuqd] {
    color: #8a6d00;
}

/* Nesačuvan dan mora biti vidljiv i kad je dugme "Spremi" van vidnog polja. */
.dirty-banner[b-n0557nzuqd] {
    display: flex;
    align-items: center;
    gap: .7em;
    background: rgba(255, 204, 0, .18);
    border: 1px solid rgba(255, 204, 0, .6);
    border-radius: .6em;
    padding: .7em 1em;
    margin-bottom: .6em;
    font-size: .88em;
    color: #5a4600;
}

.dirty-banner i[b-n0557nzuqd] {
    color: #8a6d00;
}

.machine-picker[b-n0557nzuqd] {
    display: flex;
    flex-direction: column;
    max-width: 24em;
    margin-bottom: 1em;
}

.machine-picker label[b-n0557nzuqd] {
    font-size: .85em;
    color: gray;
    margin-bottom: .3em;
}

/* ---------- Dnevni unos ---------- */

.table-scroll[b-n0557nzuqd] {
    flex: 1;
    min-height: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

.emulsion-table[b-n0557nzuqd] {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: .92em;
}

.emulsion-table th[b-n0557nzuqd] {
    text-align: left;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-weight: normal;
    padding: .6em .5em;
    border-bottom: 2px solid #ececec;
    /* "K - koncentracija" u uskoj koloni polja se inače lomi u dva reda. */
    white-space: nowrap;
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 1;
}

.emulsion-table td[b-n0557nzuqd] {
    padding: .45em .5em;
    border-bottom: 1px solid #f1f1f1;
    color: #14425a;
    vertical-align: top;
}

/* Mjerenje koje čeka dolijevanje - red se izdvaja, ali bez vike. */
.emulsion-table tr.needs-correction[b-n0557nzuqd] {
    background: rgba(217, 83, 79, .05);
}

/* Radnik je mjerio: red je zapis, ne unos. Polja ostaju vidljiva, ali zaključana. */
.emulsion-table tr.locked[b-n0557nzuqd] {
    background: #fbfcfd;
}

.col-input[b-n0557nzuqd]  .cell-input:disabled {
    background: #f2f5f6;
    color: #6c757d;
    cursor: not-allowed;
}

.col-no[b-n0557nzuqd] {
    width: 3em;
    color: gray;
}

.col-input[b-n0557nzuqd] {
    width: 120px;
}

/* Polje s vrijednošću van granica se boji samo - pill na kraju reda je predaleko od
   broja koji je pogrešan. */
.col-input[b-n0557nzuqd]  .cell-input {
    width: 100%;
    min-height: 40px;
    padding: .3em .5em;
    border: 1px solid lightgray;
    border-radius: .4em;
    text-align: center;
    font-family: 'Ubuntu-Medium';
    color: #14425a;
}

.col-input.bad[b-n0557nzuqd]  .cell-input {
    border-color: #d9534f;
    background: rgba(217, 83, 79, .07);
    color: #d9534f;
}

.col-actions[b-n0557nzuqd] {
    width: 14em;
    white-space: nowrap;
}

/* Radnje u tabeli su dugmad, ne plavi tekst: u redu punom brojeva se link ne prepozna
   kao nešto na šta se klika. */
.row-btn[b-n0557nzuqd] {
    display: inline-flex;
    align-items: center;
    gap: .35em;
    background: #fff;
    border: 1px solid #cfdde4;
    border-radius: .4em;
    color: #14425a;
    font-size: .8em;
    padding: .35em .8em;
    min-height: 32px;
    cursor: pointer;
}

.row-btn:hover[b-n0557nzuqd] {
    background: #e4eef2;
}

.row-btn.primary[b-n0557nzuqd] {
    background: var(--ar-primary);
    border-color: var(--ar-primary);
    color: #fff;
}

.row-btn.primary:hover[b-n0557nzuqd] {
    background: var(--ar-primary-hover);
}

/* Radnik je mjerio danas - radnja je obavljena, pa red pokazuje stanje, ne dugme. */
.row-btn.done[b-n0557nzuqd] {
    background: rgba(38, 176, 80, .12);
    border-color: rgba(38, 176, 80, .35);
    color: #26b050;
    cursor: default;
}

.row-btn + .row-btn[b-n0557nzuqd] {
    margin-left: .4em;
}

.col-limit[b-n0557nzuqd],
.col-fluid[b-n0557nzuqd] {
    font-family: 'Ubuntu-Light';
    color: gray;
    font-size: .9em;
}

.machine-name[b-n0557nzuqd] {
    display: block;
    font-family: 'Ubuntu-Medium';
    color: #14425a;
}

.machine-sub[b-n0557nzuqd],
.limit-sub[b-n0557nzuqd],
.read-by[b-n0557nzuqd],
.after-note[b-n0557nzuqd] {
    display: block;
    font-family: 'Ubuntu-Light';
    font-size: .85em;
    color: gray;
}

.muted[b-n0557nzuqd] {
    color: gray;
}

.pill[b-n0557nzuqd] {
    display: inline-flex;
    align-items: center;
    gap: .35em;
    border-radius: 2em;
    padding: .25em .8em;
    font-family: 'Ubuntu-Medium';
    font-size: .78em;
    white-space: nowrap;
}

/* ---------- Mjesečni izvještaj ---------- */

.month-toolbar[b-n0557nzuqd] {
    display: flex;
    align-items: center;
    gap: .8em;
    margin: .8em 0;
}

.month-label[b-n0557nzuqd] {
    font-family: 'Ubuntu-Medium';
    color: #14425a;
}

.month-filled[b-n0557nzuqd] {
    color: gray;
    font-family: 'Ubuntu-Light';
    font-size: .85em;
    margin-left: auto;
}

.matrix-scroll[b-n0557nzuqd] {
    flex: 1;
    min-height: 0;
    overflow: auto;
    border: 1px solid #ececec;
    border-radius: .5em;
}

.monthly-table[b-n0557nzuqd] {
    border-collapse: collapse;
    font-size: .75em;
    min-width: 100%;
}

.monthly-table th[b-n0557nzuqd] {
    background: #ececec;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-weight: normal;
    padding: .5em .35em;
    white-space: nowrap;
    border-right: 1px solid #e6e6e6;
    position: sticky;
    top: 0;
    z-index: 1;
}

.monthly-table td[b-n0557nzuqd] {
    padding: .3em .35em;
    border-bottom: 1px solid #f1f1f1;
    border-right: 1px solid #f6f6f6;
    text-align: center;
    color: #14425a;
}

/* Naziv mašine ostaje vidljiv dok se matrica pomjera ulijevo - inače se ne zna čiji je red. */
.sticky-col[b-n0557nzuqd] {
    position: sticky;
    left: 0;
    background: #fff;
    text-align: left !important;
    min-width: 190px;
    padding: .35em .7em !important;
    border-right: 1px solid #d6d6d6 !important;
    white-space: nowrap;
    z-index: 2;
}

.monthly-table th.sticky-col[b-n0557nzuqd] {
    background: #ececec;
    z-index: 3;
}

.day-col[b-n0557nzuqd] {
    min-width: 2.6em;
}

/* Vikend i praznik imaju kolonu - bez njih brojevi dana preskaču (4, 7, 8...) pa matrica
   izgleda kao da dani fale. Blijed broj kaže da prazna ćelija ispod nije propust. */
.day-col.nonworking[b-n0557nzuqd] {
    color: #9aa9b1;
}

.day-cell.bad[b-n0557nzuqd] {
    background: rgba(217, 83, 79, .07);
}

.cell-k[b-n0557nzuqd] {
    display: block;
    font-family: 'Ubuntu-Medium';
}

.cell-n[b-n0557nzuqd] {
    display: block;
    font-family: 'Ubuntu-Light';
    color: gray;
}

.cell-k.bad[b-n0557nzuqd],
.cell-n.bad[b-n0557nzuqd] {
    color: #d9534f;
}

/* ---------- Heat-map ---------- */

.heat-legend[b-n0557nzuqd] {
    display: flex;
    align-items: center;
    gap: 1em;
    flex-wrap: wrap;
    font-family: 'Ubuntu-Light';
    font-size: .8em;
    color: gray;
    margin-left: auto;
}

.heat-legend span[b-n0557nzuqd] {
    display: inline-flex;
    align-items: center;
    gap: .35em;
}

.heat-row[b-n0557nzuqd] {
    display: flex;
    align-items: center;
    gap: .6em;
    padding: .2em 0;
}

.heat-name[b-n0557nzuqd] {
    width: 200px;
    flex: none;
    font-size: .82em;
    color: #14425a;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Ćelije dijele raspoloživu širinu: cijeli mjesec stane bez skrolanja, pa se obrazac
   (koja mašina stalno bježi iz granica) vidi na prvi pogled. */
.heat-cells[b-n0557nzuqd] {
    display: flex;
    gap: 3px;
    flex: 1;
    min-width: 0;
}

.heat-cells .heat-cell[b-n0557nzuqd] {
    flex: 1;
    height: 22px;
}

.heat-cell[b-n0557nzuqd] {
    display: inline-block;
    width: 14px;
    height: 14px;
    border-radius: 3px;
}

.heat-cell.ok[b-n0557nzuqd] {
    background: #26b050;
}

.heat-cell.near[b-n0557nzuqd] {
    background: rgba(255, 204, 0, .85);
}

.heat-cell.bad[b-n0557nzuqd] {
    background: #d9534f;
}

.heat-cell.none[b-n0557nzuqd] {
    background: #ececec;
}

.heat-score[b-n0557nzuqd] {
    width: 110px;
    flex: none;
    text-align: right;
    font-family: 'Ubuntu-Light';
    font-size: .76em;
    color: gray;
}

/* ---------- Prazna stanja ---------- */

.tab-placeholder[b-n0557nzuqd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .4em;
    background: #fff;
    border-radius: 1em;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .06);
    padding: 3em 1em;
    color: gray;
    text-align: center;
}

.tab-placeholder i[b-n0557nzuqd] {
    font-size: 2em;
    color: #cdd9de;
}

.tab-placeholder h5[b-n0557nzuqd] {
    color: #14425a;
    margin: 0;
}

.tab-placeholder p[b-n0557nzuqd] {
    margin: 0;
    font-size: .9em;
}

.tab-placeholder button[b-n0557nzuqd] {
    margin-top: .6em;
    flex: none;
    border: 1px solid lightgray;
    border-radius: .5em;
    padding: .4em 1.2em;
}
/* _content/ArasWeb/Pages/Odrzavanje/Tabs/HistorijaTab.razor.rz.scp.css */
#historija-tab[b-ej5fcl5svu] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: white;
    border-radius: 1em;
    padding: 1em;
    gap: 0.8em;
}

.tab-toolbar[b-ej5fcl5svu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1em;
    flex-wrap: wrap;
}

.pdf-btn[b-ej5fcl5svu] {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    background: white;
    color: #14425a;
    border: 1px solid #d7e3e8;
}

.pdf-btn i[b-ej5fcl5svu] {
    color: #d9534f;
}

.pdf-btn:hover:not(:disabled)[b-ej5fcl5svu] {
    background: #f7fafb;
}

/* Mreža umjesto flex trake: grupe filtera dobijaju ravnomjerne kolone i uredno se
   prelamaju u novi red, pa se labele i chipovi ne razilaze pri sužavanju. */
.filter-card[b-ej5fcl5svu] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    align-items: start;
    gap: 0.9em 1.2em;
    background: #f7fafb;
    border: 1px solid #e4eef2;
    border-radius: 0.8em;
    padding: 0.9em;
}

.filter-group[b-ej5fcl5svu] {
    display: flex;
    flex-direction: column;
    gap: 0.4em;
    min-width: 0;
}

.filter-label[b-ej5fcl5svu] {
    color: #55646c;
    font-size: 0.8em;
}

.filter-select[b-ej5fcl5svu] {
    width: 100%;
    font-size: 0.85em;
}

.sub-tabs[b-ej5fcl5svu] {
    display: flex;
    gap: 0.5em;
}

.sub-tab[b-ej5fcl5svu] {
    border: 1px solid #e4eef2;
    background: white;
    color: #55646c;
    border-radius: 2em;
    padding: 0.4em 1em;
    font-size: 0.85em;
    cursor: pointer;
}

.sub-tab.active[b-ej5fcl5svu] {
    background: #e4eef2;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.table-scroll[b-ej5fcl5svu] {
    flex: 1;
    min-height: 0;
    overflow: auto;
}

.history-table[b-ej5fcl5svu] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85em;
}

/*
   Namjerno BEZ table-layout: fixed. Uz fiksni raspored ćelija širina kolone je tvrda
   granica, pa sadržaj koji se ne smije prelomiti (trajanja i brojevi imaju
   white-space: nowrap) jednostavno iscuri preko ivice u susjednu kolonu. S
   automatskim rasporedom širine iz colgroup-a su samo željeni omjeri - kolona se
   raširi kad joj sadržaj to traži, a tabela nikad ne razbije poravnanje.
   Horizontalni skrol iz .table-scroll pokriva slučaj kad zbir premaši širinu ekrana.
*/
.chrono-table[b-ej5fcl5svu] {
    min-width: 1100px;
}

.summary-table[b-ej5fcl5svu] {
    min-width: 900px;
}

/* Redovi su sad jednostavni (bez trake, bez oznake) - sredina umjesto vrha izgleda
   uredno kad "Najčešći uzrok" prelomi u dva reda. */
.summary-table td[b-ej5fcl5svu] {
    vertical-align: middle;
}

/* Dugi nazivi i uzroci se prelamaju unutar svoje kolone umjesto da je rastegnu. */
.summary-table td[b-ej5fcl5svu],
.chrono-table td[b-ej5fcl5svu] {
    overflow-wrap: anywhere;
}

/* Omjeri kolona; klase se dodjeljuju <col> elementima, pa vrijede za cijelu kolonu. */
.c-date[b-ej5fcl5svu] {
    width: 8%;
}

.c-number[b-ej5fcl5svu] {
    width: 11%;
}

.c-machine[b-ej5fcl5svu] {
    width: 16%;
}

.c-kind[b-ej5fcl5svu] {
    width: 10%;
}

.c-cause[b-ej5fcl5svu] {
    width: 15%;
}

.c-performer[b-ej5fcl5svu] {
    width: 13%;
}

.c-count[b-ej5fcl5svu] {
    width: 7%;
}

.c-bar[b-ej5fcl5svu] {
    width: 12%;
}

.c-dur[b-ej5fcl5svu] {
    width: 10%;
}

.c-money[b-ej5fcl5svu] {
    width: 9%;
}

.c-icons[b-ej5fcl5svu] {
    width: 4%;
}

.history-table th[b-ej5fcl5svu] {
    text-align: left;
    color: #55646c;
    font-family: 'Ubuntu-Light';
    font-weight: normal;
    padding: 0.5em;
    border-bottom: 1px solid #e4eef2;
    position: sticky;
    top: 0;
    background: var(--color-bg-header);
    white-space: nowrap;
}

.history-table th.sortable[b-ej5fcl5svu] {
    cursor: pointer;
}

/* .history-table th (jedna klasa + element) je specifičniji od .num (jedna klasa), pa
   bez ovoga nadjača text-align:right i naslovi brojčanih kolona ostanu zalijepljeni
   lijevo dok su podaci ispod poravnati desno. */
.history-table th.num[b-ej5fcl5svu] {
    text-align: right;
}

.sort-icon[b-ej5fcl5svu] {
    color: #ced4da;
    margin-left: 0.2em;
}

.sort-icon.active[b-ej5fcl5svu] {
    color: var(--ar-primary);
}

.history-table td[b-ej5fcl5svu] {
    padding: 0.4em 0.5em;
    border-bottom: 1px solid #f2f5f6;
    color: #14425a;
    vertical-align: top;
}

.history-table tbody tr[b-ej5fcl5svu] {
    cursor: pointer;
    transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

/* Isti "uzet red" osjećaj kao liste narudžbi (border-left akcent na hover), samo bez
   pomjeranja kolona - inset sjena se ne računa u širinu ćelije kao pravi border. */
.history-table tbody tr:hover[b-ej5fcl5svu] {
    background: #f5f9fb;
    box-shadow: inset 0.25em 0 0 0 var(--color-text-muted);
}

.history-table tfoot td[b-ej5fcl5svu] {
    border-top: 1px solid #e4eef2;
    border-bottom: none;
    font-family: 'Ubuntu-Medium';
    background: white;
    position: sticky;
    bottom: 0;
}

.num[b-ej5fcl5svu] {
    text-align: right;
    white-space: nowrap;
}

/* Širinu zadaje <col class="c-icons">; ovdje ostaje samo izgled. */
.col-more[b-ej5fcl5svu] {
    text-align: right;
    white-space: nowrap;
    color: var(--ar-primary);
}

/* Razmak između ikonice priloga i ikonice za pregled - kad su obje prisutne. */
.col-more i + i[b-ej5fcl5svu] {
    margin-left: 0.5em;
}

.pill[b-ej5fcl5svu] {
    display: inline-block;
    border-radius: 2em;
    padding: 0.15em 0.7em;
    font-size: 0.8em;
    background: #e4eef2;
    color: #14425a;
}

.pill.external[b-ej5fcl5svu] {
    background: var(--ar-primary-soft);
    color: var(--ar-primary-text);
}

.pill.muted[b-ej5fcl5svu] {
    background: #ececec;
    color: #7b8a91;
}

.sub[b-ej5fcl5svu] {
    display: block;
    font-size: 0.85em;
    color: #55646c;
}

.machine-name[b-ej5fcl5svu] {
    display: block;
    font-family: 'Ubuntu-Medium';
}

.period-note[b-ej5fcl5svu] {
    margin: 0 0 0.5em;
    font-size: 0.85em;
    color: #6c757d;
}

.more[b-ej5fcl5svu] {
    display: flex;
    justify-content: center;
}
/* _content/ArasWeb/Pages/Odrzavanje/Tabs/MasineTab.razor.rz.scp.css */
#masine-tab[b-ieq21lv6ei] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: white;
    border-radius: 1em;
    padding: 1em;
}

.tab-toolbar[b-ieq21lv6ei] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1em;
    flex-wrap: wrap;
    margin-bottom: 1em;
}

.sub-tabs[b-ieq21lv6ei] {
    display: flex;
    gap: 0.5em;
}

.sub-tab[b-ieq21lv6ei] {
    border: 1px solid #e4eef2;
    background: white;
    color: #55646c;
    border-radius: 2em;
    padding: 0.4em 1em;
    font-size: 0.85em;
    cursor: pointer;
}

.sub-tab.active[b-ieq21lv6ei] {
    background: #e4eef2;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.toolbar-right[b-ieq21lv6ei] {
    display: flex;
    align-items: center;
    gap: 0.5em;
}

.type-select[b-ieq21lv6ei] {
    width: auto;
    min-width: 11em;
    font-size: 0.85em;
}

.table-scroll[b-ieq21lv6ei] {
    flex: 1;
    min-height: 0;
    overflow: auto;
}

.machines-table[b-ieq21lv6ei] {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 0.85em;
}

.machines-table th[b-ieq21lv6ei] {
    text-align: left;
    color: #55646c;
    font-family: 'Ubuntu-Light';
    font-weight: normal;
    padding: 0.5em;
    border-bottom: 1px solid #e4eef2;
    position: sticky;
    top: 0;
    background: var(--color-bg-header);
}

.machines-table td[b-ieq21lv6ei] {
    padding: 0.55em 0.5em;
    border-bottom: 1px solid #f2f5f6;
    color: #14425a;
}

.machines-table tbody tr[b-ieq21lv6ei] {
    cursor: pointer;
    transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

/* Isti "uzet red" osjećaj kao liste narudžbi (border-left akcent na hover), samo bez
   pomjeranja kolona - inset sjena se ne računa u širinu ćelije kao pravi border. */
.machines-table tbody tr:hover[b-ieq21lv6ei] {
    background: #f5f9fb;
    box-shadow: inset 0.25em 0 0 0 var(--color-text-muted);
}

.col-no[b-ieq21lv6ei] {
    width: 3em;
    color: #55646c;
}

.col-more[b-ieq21lv6ei] {
    width: 3em;
    text-align: right;
    color: var(--ar-primary);
}

.machine-name[b-ieq21lv6ei] {
    display: block;
    font-family: 'Ubuntu-Medium';
}

.machine-sub[b-ieq21lv6ei] {
    display: block;
    font-size: 0.85em;
    color: #55646c;
}
/* _content/ArasWeb/Pages/Odrzavanje/Tabs/MojaMasinaTab.razor.rz.scp.css */
#moja-masina-tab[b-bmysciiojc] {
    display: flex;
    flex-direction: column;
    gap: 1em;
}

.masina-picker[b-bmysciiojc] {
    display: flex;
    align-items: flex-end;
    gap: 1em;
    flex-wrap: wrap;
    background: white;
    border-radius: 1em;
    padding: 1em;
}

.masina-picker label[b-bmysciiojc] {
    display: block;
    color: #6c757d;
    font-size: 0.85em;
    margin-bottom: 0.4em;
}

/* Polje zauzme sav prostor do "Prijavi kvar"; na uskom ekranu dugme pređe u novi red. */
.masina-select[b-bmysciiojc] {
    flex: 1;
    min-width: 18em;
}

/* "Prijavi kvar" je glavna radnja ovog ekrana - crveno i dovoljno veliko za prst. */
.report-btn[b-bmysciiojc] {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    background: #d9534f;
    color: white;
    border: none;
    border-radius: 0.6em;
    padding: 0 1.2em;
    min-height: 44px;
    cursor: pointer;
}

.tab-placeholder[b-bmysciiojc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.4em;
    background: white;
    border-radius: 1em;
    padding: 3em 1em;
    color: #6c757d;
    text-align: center;
}

.tab-placeholder i[b-bmysciiojc] {
    font-size: 2em;
    color: #d7e3e8;
}

.tab-placeholder h5[b-bmysciiojc] {
    margin: 0;
    color: #14425a;
}

.tab-placeholder p[b-bmysciiojc] {
    margin: 0;
    font-size: 0.88em;
}

.checklist-section[b-bmysciiojc] {
    background: white;
    border-radius: 1em;
    padding: 1em;
    flex-shrink: 0;
}

.checklist-section > label[b-bmysciiojc] {
    display: block;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    margin-bottom: 0.6em;
}

/* Emulzija je jedan red kao u konceptu: ikona, stanje, status, radnja. */
.emulsion-section[b-bmysciiojc] {
    display: flex;
    align-items: center;
    gap: 1.2em;
    flex-wrap: wrap;
    background: white;
    border-radius: 1em;
    padding: 1em 1.2em;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .06);
    flex-shrink: 0;
}

.emulsion-icon[b-bmysciiojc] {
    width: 44px;
    height: 44px;
    flex: none;
    border-radius: 0.6em;
    background: #f5f9fb;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #3e677d;
    font-size: 1.2em;
}

.emulsion-text[b-bmysciiojc] {
    flex: 1;
    min-width: 200px;
    display: flex;
    flex-direction: column;
}

.emulsion-title[b-bmysciiojc] {
    font-family: 'Ubuntu-Medium';
    color: #14425a;
}

.emulsion-sub[b-bmysciiojc] {
    font-family: 'Ubuntu-Light';
    font-size: 0.82em;
    color: gray;
}

/* Neuspjelo učitavanje nije isto što i "nema mjerenja" - boja to i kaže na prvi pogled. */
.emulsion-failed[b-bmysciiojc] {
    color: #d9534f;
}

.emulsion-section .pill[b-bmysciiojc] {
    display: inline-flex;
    align-items: center;
    gap: 0.35em;
    border-radius: 2em;
    padding: 0.3em 0.9em;
    font-family: 'Ubuntu-Medium';
    font-size: 0.8em;
    white-space: nowrap;
}

.emulsion-action[b-bmysciiojc] {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    border: none;
    background: var(--ar-primary);
    color: white;
    border-radius: 0.5em;
    padding: 0.5em 1.4em;
    min-height: 48px;
    cursor: pointer;
}

.emulsion-action:hover[b-bmysciiojc] {
    background: var(--ar-primary-hover);
}

/* Kartica ne dijeli visinu s checklistom (flex: 1 ju je, kad se obaveze učitaju, stiskao na
   jedan red) - ima svoju visinu, a skroluje se samo lista unutar nje. */
.moje-prijave[b-bmysciiojc] {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 0.6em;
    background: white;
    border-radius: 1em;
    padding: 1em;
}

/* Pet redova (min-height 60px + razmak) vidljivo, ostali se skroluju unutar kartice. */
.prijave-list[b-bmysciiojc] {
    display: flex;
    flex-direction: column;
    gap: 0.6em;
    max-height: calc(5 * 60px + 4 * 0.6em);
    overflow-y: auto;
    padding-right: 0.2em;
}

.moje-prijave > label[b-bmysciiojc] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.empty-note[b-bmysciiojc] {
    margin: 0;
    color: #6c757d;
    font-size: 0.88em;
}

/* Fiksne rubne kolone i min-height: da se sadržaj ne pomjera kad status promijeni
   dužinu ili kad se ispod njega pojavi druga linija. */
.moja-prijava-row[b-bmysciiojc] {
    display: grid;
    grid-template-columns: 3.5em minmax(0, 1fr) 12em;
    align-items: center;
    gap: 1em;
    padding: 0.7em 0.9em;
    border: 1px solid #f0f4f5;
    border-radius: 0.8em;
    min-height: 60px;
    /* Red je flex stavka u koloni koja skroluje; bez ovoga ga flex sabije ispod
       visine sadržaja na užem ekranu, pa se redovi preklope. */
    flex-shrink: 0;
}

.pill[b-bmysciiojc] {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    border-radius: 2em;
    padding: 0.25em 0.8em;
    font-size: 0.72em;
    font-family: 'Ubuntu-Medium';
    white-space: nowrap;
}

/* Oznaka prioriteta je mala i centrirana u svojoj koloni - bez ovoga je grid razvuče na
   cijelu širinu kolone, a tekst ostane lijevo. */
.prio-pill[b-bmysciiojc] {
    justify-self: center;
    align-self: center;
    justify-content: center;
    min-width: 2.8em;
    padding: 0.25em 0.6em;
}

.row-main[b-bmysciiojc] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.row-title[b-bmysciiojc] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: 0.92em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.row-sub[b-bmysciiojc] {
    color: #6c757d;
    font-size: 0.8em;
}

.row-status[b-bmysciiojc] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.3em;
    min-width: 0;
}

/* Jedna linija s tri tačke: duže ime ili razlog čekanja ne smiju razvući red. */
.row-note[b-bmysciiojc] {
    max-width: 100%;
    color: #6c757d;
    font-size: 0.78em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 700px) {
    .masina-select[b-bmysciiojc] {
        min-width: 100%;
    }

    .moja-prijava-row[b-bmysciiojc] {
        grid-template-columns: 3.5em minmax(0, 1fr);
        row-gap: 0.4em;
    }

    .row-status[b-bmysciiojc] {
        grid-column: 2;
        align-items: flex-start;
    }
}

/* Mjerenje je obavljeno - stanje, ne dugme. */
.emulsion-done[b-bmysciiojc] {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    background: rgba(38, 176, 80, .12);
    color: #26b050;
    font-family: 'Ubuntu-Medium';
    border-radius: 0.5em;
    padding: 0.5em 1.2em;
    min-height: 48px;
}
/* _content/ArasWeb/Pages/Odrzavanje/Tabs/MojDanHigijenaTab.razor.rz.scp.css */
#moj-dan-higijena[b-xsv6fp9wj6] {
    display: flex;
    flex-direction: column;
    gap: 1em;
}

.hig-top[b-xsv6fp9wj6] {
    display: flex;
    align-items: center;
    gap: .6em;
    flex-wrap: wrap;
}

.chip[b-xsv6fp9wj6] {
    display: inline-flex;
    align-items: center;
    gap: .5em;
    border-radius: 2em;
    padding: .5em 1em;
    font-size: .85em;
    font-family: 'Ubuntu-Medium';
    background: #e4eef2;
    color: #14425a;
    border: none;
    min-height: 40px;
}

button.chip[b-xsv6fp9wj6] {
    cursor: pointer;
}

.chip.danger[b-xsv6fp9wj6] {
    background: rgba(217, 83, 79, .12);
    color: #b8443f;
}

.chip.outline[b-xsv6fp9wj6] {
    background: white;
    border: 1px solid #cfdde4;
}

/* Glavna radnja kad nešto ne valja - crveno i dovoljno veliko za prst. */
.report-btn[b-xsv6fp9wj6] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: .5em;
    background: #d9534f;
    color: white;
    border: none;
    border-radius: .6em;
    padding: 0 1.2em;
    min-height: 44px;
    font-family: 'Ubuntu-Medium';
    cursor: pointer;
}

.hig-grid[b-xsv6fp9wj6] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: 1em;
    align-items: start;
}

.md-card[b-xsv6fp9wj6] {
    background: #fff;
    border-radius: 1em;
    padding: 1em;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .06);
    min-width: 0;
}

.md-card-head[b-xsv6fp9wj6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .6em;
    margin-bottom: .6em;
}

.md-card-head label[b-xsv6fp9wj6] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    margin: 0;
}

.empty-note[b-xsv6fp9wj6] {
    margin: 0;
    color: #6c757d;
    font-size: .88em;
}

.later-note[b-xsv6fp9wj6] {
    margin: .6em 0 0;
    color: #6c757d;
    font-size: .8em;
}

/* Objekat i njegova checklista - odvojeni tankom linijom, kao redovi u Mom danu. */
.object-block[b-xsv6fp9wj6] {
    padding: .6em 0;
    border-bottom: 1px solid #f0f3f5;
}

.object-block:last-child[b-xsv6fp9wj6] {
    border-bottom: none;
    padding-bottom: 0;
}

.object-head[b-xsv6fp9wj6] {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: .2em .5em;
    margin-bottom: .4em;
}

.object-head i[b-xsv6fp9wj6] {
    color: #3e677d;
    font-size: .85em;
}

.object-name[b-xsv6fp9wj6] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.md-row[b-xsv6fp9wj6] {
    display: flex;
    align-items: center;
    gap: .8em;
    padding: .55em .3em;
    min-height: 56px;
    border-bottom: 1px solid #f6f6f6;
}

.md-row:last-of-type[b-xsv6fp9wj6] {
    border-bottom: none;
}

.md-row.clickable[b-xsv6fp9wj6] {
    cursor: pointer;
}

.md-row.clickable:hover[b-xsv6fp9wj6] {
    background: #f9fbfc;
}

.row-main[b-xsv6fp9wj6] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.row-title[b-xsv6fp9wj6] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: .9em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.row-sub[b-xsv6fp9wj6] {
    color: #6c757d;
    font-size: .78em;
}

.pill[b-xsv6fp9wj6] {
    display: inline-flex;
    align-items: center;
    border-radius: 2em;
    padding: .25em .8em;
    font-size: .72em;
    font-family: 'Ubuntu-Medium';
    white-space: nowrap;
}

.pill-ok[b-xsv6fp9wj6] {
    background: rgba(92, 184, 92, .15);
    color: #2f7a2f;
}

.pill-warn[b-xsv6fp9wj6] {
    background: rgba(240, 173, 78, .20);
    color: #9a6212;
}

.pill-late[b-xsv6fp9wj6] {
    background: rgba(217, 83, 79, .14);
    color: #b8443f;
}

.pill-deferred[b-xsv6fp9wj6] {
    background: var(--ar-primary-soft);
    color: var(--ar-primary-text);
}

.count-pill[b-xsv6fp9wj6] {
    background: #e4eef2;
    color: #14425a;
}

.tab-placeholder[b-xsv6fp9wj6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .4em;
    background: white;
    border-radius: 1em;
    padding: 3em 1em;
    color: #6c757d;
    text-align: center;
}

.tab-placeholder i[b-xsv6fp9wj6] {
    font-size: 2em;
    color: #d7e3e8;
}

.tab-placeholder h5[b-xsv6fp9wj6] {
    margin: 0;
    color: #14425a;
}

.tab-placeholder p[b-xsv6fp9wj6] {
    margin: 0;
    font-size: .88em;
}

@media (max-width: 600px) {
    .hig-grid[b-xsv6fp9wj6] {
        grid-template-columns: 1fr;
    }

    /* Na telefonu "Prijavi kvar" preko cijele širine, ispod čipova. */
    .report-btn[b-xsv6fp9wj6] {
        margin-left: 0;
        width: 100%;
        justify-content: center;
    }
}
/* _content/ArasWeb/Pages/Odrzavanje/Tabs/MojDanTab.razor.rz.scp.css */
#moj-dan[b-a4tbmfn6t8] {
    display: flex;
    flex-direction: column;
    gap: 1em;
}

.moj-dan-chips[b-a4tbmfn6t8] {
    display: flex;
    gap: .6em;
    flex-wrap: wrap;
}

.chip[b-a4tbmfn6t8] {
    display: inline-flex;
    align-items: center;
    gap: .5em;
    border-radius: 2em;
    padding: .5em 1em;
    font-size: .85em;
    font-family: 'Ubuntu-Medium';
    background: #e4eef2;
    color: #14425a;
    border: none;
    min-height: 40px;
}

button.chip[b-a4tbmfn6t8] {
    cursor: pointer;
}

.chip.static[b-a4tbmfn6t8] {
    cursor: default;
}

.chip.danger[b-a4tbmfn6t8] {
    background: rgba(217, 83, 79, .12);
    color: #b8443f;
}

/* Pozadina čipa je ista kao pozadina stranice, pa čip bez upozorenja izgleda kao običan
   tekst. Bijelo s obrubom ga vraća u labelu, kao i crvene pored njega. */
.chip.outline[b-a4tbmfn6t8] {
    background: white;
    border: 1px solid #cfdde4;
}

/* Očitanje brojila - u desnom uglu reda s čipovima, primarna plava kao ostala dugmad akcije. */
.reading-btn[b-a4tbmfn6t8] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: .5em;
    background: var(--color-primary);
    color: white;
    font-family: 'Ubuntu-Medium';
    font-size: .88em;
    border-radius: .6em;
    min-height: 40px;
    cursor: pointer;
}

.reading-btn:hover[b-a4tbmfn6t8] {
    background: var(--color-primary-hover);
}

.equipment-picker[b-a4tbmfn6t8] {
    gap: .5em;
}

.equipment-picker .modal-hint[b-a4tbmfn6t8] {
    margin: 0 0 .3em;
    color: #6c757d;
    font-size: .85em;
}

.equipment-option[b-a4tbmfn6t8] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .8em;
    width: 100%;
    background: #fff;
    border: 1px solid #e4eef2;
    border-radius: .8em;
    padding: .6em .9em;
    text-align: left;
    cursor: pointer;
}

.equipment-option:hover[b-a4tbmfn6t8] {
    border-color: var(--color-primary);
}

.moj-dan-grid[b-a4tbmfn6t8] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 1em;
    align-items: start;
}

.moj-dan-col[b-a4tbmfn6t8] {
    display: flex;
    flex-direction: column;
    gap: 1em;
    min-width: 0;
}

/* Kartica iz koncepta: lagana sjena umjesto Bootstrapovog .shadow (0 .5rem 1rem) - od
   njega ekran izgleda teško, a ovdje ih stoji šest jedna ispod druge. */
.md-card[b-a4tbmfn6t8] {
    background: #fff;
    border-radius: 1em;
    padding: 1em;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .06);
}

/* Isti akcenat kao crveni okvir u konceptu - prijave i zakašnjelo traže pažnju prije
   ostalih kartica. */
.md-card.accent-red[b-a4tbmfn6t8] {
    border-left: .35em solid #d9534f;
}

/* Zakašnjelo je upozorenje, ne greška - žuti akcenat, kao u konceptu. */
.md-card.accent-amber[b-a4tbmfn6t8] {
    border-left: .35em solid #e0a800;
}

.md-card > label[b-a4tbmfn6t8] {
    display: block;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    margin-bottom: .6em;
}

.md-card-head[b-a4tbmfn6t8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: .6em;
}

.md-card-head label[b-a4tbmfn6t8] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.link-btn[b-a4tbmfn6t8] {
    background: none;
    border: none;
    color: var(--ar-primary);
    font-size: .85em;
    cursor: pointer;
    padding: 0;
}

.empty-note[b-a4tbmfn6t8] {
    margin: 0;
    color: #6c757d;
    font-size: .88em;
}

/* Red je visok koliko treba prstu na tabletu u hali (56px), a razdvaja ga najtanja
   moguća linija - kao u konceptu. */
.md-row[b-a4tbmfn6t8] {
    display: flex;
    align-items: center;
    gap: .8em;
    padding: .55em .3em;
    min-height: 56px;
    border-bottom: 1px solid #f6f6f6;
}

.md-row:last-child[b-a4tbmfn6t8] {
    border-bottom: none;
}

.md-row.clickable[b-a4tbmfn6t8] {
    cursor: pointer;
}

.md-row.clickable:hover[b-a4tbmfn6t8] {
    background: #f9fbfc;
}

.md-row.attention .row-title[b-a4tbmfn6t8] {
    color: #b8443f;
}

.row-main[b-a4tbmfn6t8] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.row-title[b-a4tbmfn6t8] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: .9em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.row-sub[b-a4tbmfn6t8] {
    color: #6c757d;
    font-size: .78em;
}

.row-date[b-a4tbmfn6t8] {
    color: #6c757d;
    font-size: .8em;
    white-space: nowrap;
}

.pill[b-a4tbmfn6t8] {
    display: inline-flex;
    align-items: center;
    border-radius: 2em;
    padding: .25em .8em;
    font-size: .72em;
    font-family: 'Ubuntu-Medium';
    white-space: nowrap;
}

/* Labela roka - jedini nosilac hitnosti u redu paketa. Zelena: ima još vremena.
   Žuta: rok je prošao, tolerancija traje. Crvena: zakašnjelo. Plava: odgođeno, pa ne
   važi kalendarski rok nego izabrani dan. */
.pill-ok[b-a4tbmfn6t8] {
    background: rgba(92, 184, 92, .15);
    color: #2f7a2f;
}

.pill-warn[b-a4tbmfn6t8] {
    background: rgba(240, 173, 78, .20);
    color: #9a6212;
}

.pill-late[b-a4tbmfn6t8] {
    background: rgba(217, 83, 79, .14);
    color: #b8443f;
}

.pill-deferred[b-a4tbmfn6t8] {
    background: var(--ar-primary-soft);
    color: var(--ar-primary-text);
}

/* Koliko je do servisa po radnim satima - žuto kad je prag blizu. Prekoračen prag se
   ovdje ne ponavlja: mašina je zbog njega već crvena među obavezama. */
.service-note.soon[b-a4tbmfn6t8] {
    color: #9a6212;
    font-family: 'Ubuntu-Medium';
}

/* Mašine koje danas još nisu završile dnevne obaveze - bez otvaranja pune liste. */
.supervision-exceptions[b-a4tbmfn6t8] {
    display: flex;
    flex-wrap: wrap;
    gap: .4em;
    margin-top: .6em;
}

.daily-item-note[b-a4tbmfn6t8] {
    margin-left: .5em;
    font-size: .8em;
    color: #6c757d;
}

.chip.muted[b-a4tbmfn6t8] {
    color: #6c757d;
}

/* Prvo učitavanje nije uspjelo - isti izgled kao prazno stanje u "Moja mašina". */
.tab-placeholder[b-a4tbmfn6t8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .4em;
    background: white;
    border-radius: 1em;
    padding: 3em 1em;
    color: #6c757d;
    text-align: center;
}

.tab-placeholder i[b-a4tbmfn6t8] {
    font-size: 2em;
    color: #d7e3e8;
}

.tab-placeholder h5[b-a4tbmfn6t8] {
    margin: 0;
    color: #14425a;
}

.tab-placeholder p[b-a4tbmfn6t8] {
    margin: 0;
    font-size: .88em;
}

.ok-pill[b-a4tbmfn6t8] {
    background: rgba(92, 184, 92, .15);
    color: #2f7a2f;
}

.danger-pill[b-a4tbmfn6t8] {
    background: rgba(217, 83, 79, .12);
    color: #b8443f;
}

.count-pill[b-a4tbmfn6t8] {
    background: #e4eef2;
    color: #14425a;
}

/* Paket koji nije urađen na planirani dan - rok još nije prošao, pa žuto, ne crveno. */
.carried-pill[b-a4tbmfn6t8] {
    background: rgba(240, 173, 78, .18);
    color: #9a6212;
}

.plan-day + .plan-day[b-a4tbmfn6t8] {
    margin-top: .4em;
}

.plan-day-label[b-a4tbmfn6t8] {
    display: block;
    color: #6c757d;
    font-family: 'Ubuntu-Medium';
    font-size: .78em;
    text-transform: uppercase;
    letter-spacing: .03em;
    padding-top: .4em;
}

.plan-later[b-a4tbmfn6t8] {
    margin-top: .8em;
    padding-top: .4em;
    border-top: 1px solid #e4eef2;
}

.unsaved-note[b-a4tbmfn6t8] {
    color: #b8443f;
}

/* Mjesec u "Kasnije" se otvara u listu paketa - dugme koje izgleda kao red. */
.month-row[b-a4tbmfn6t8] {
    width: 100%;
    min-height: 0;
    background: none;
    border: none;
    border-bottom: 1px solid #f0f4f5;
    text-align: left;
    cursor: pointer;
    font: inherit;
}

.month-package[b-a4tbmfn6t8] {
    padding-left: 1.8em;
}

.accordion-group[b-a4tbmfn6t8] {
    margin-top: .6em;
    padding-top: .6em;
    border-top: 1px solid #f0f4f5;
    border-left: 3px solid transparent;
}

.accordion-group.ok[b-a4tbmfn6t8] {
    border-left-color: #5cb85c;
}

.accordion-group.pending[b-a4tbmfn6t8] {
    border-left-color: #d9534f;
}

/* Red je samo naslov dok se ne klikne - puna lista stavki bi zatrpala nekoliko desetina
   mašina odjednom (D). */
.accordion-head[b-a4tbmfn6t8] {
    display: flex;
    align-items: center;
    gap: .7em;
    width: 100%;
    background: none;
    border: none;
    padding: .3em .4em .3em .6em;
    cursor: pointer;
    text-align: left;
}

.accordion-head .row-main[b-a4tbmfn6t8] {
    flex: 1.4;
}

.chevron[b-a4tbmfn6t8] {
    color: #b6c2c8;
    font-size: .8em;
    width: 1em;
}

.accordion-head .progress-bar[b-a4tbmfn6t8] {
    flex: 1;
    height: 8px;
    border-radius: 4px;
    background: #ececec;
    overflow: hidden;
    margin: 0;
}

.progress-fill[b-a4tbmfn6t8] {
    height: 100%;
    background: #d9534f;
}

.progress-fill.ok[b-a4tbmfn6t8] {
    background: #5cb85c;
}

.row-count[b-a4tbmfn6t8] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: .85em;
    min-width: 2.6em;
    text-align: right;
}

.done-icon[b-a4tbmfn6t8] {
    color: #5cb85c;
}

.pending-icon[b-a4tbmfn6t8] {
    color: #d9534f;
    font-size: .6em;
}

/* Zaglavlje kartice dnevnih obaveza - cijelo je dugme, zatvoreno pokazuje samo status. */
.daily-head[b-a4tbmfn6t8] {
    display: flex;
    align-items: center;
    gap: .7em;
    width: 100%;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    text-align: left;
}

.daily-title[b-a4tbmfn6t8] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

/* Udio mašina koje su završile - zeleno; ostatak trake je crvenkast dok ima nezavršenih. */
.daily-bar[b-a4tbmfn6t8] {
    height: 8px;
    border-radius: 4px;
    background: #ececec;
    overflow: hidden;
    margin-top: .7em;
}

.daily-bar.pending[b-a4tbmfn6t8] {
    background: rgba(217, 83, 79, .25);
}

.daily-bar-fill[b-a4tbmfn6t8] {
    height: 100%;
    background: #5cb85c;
}

.daily-empty[b-a4tbmfn6t8] {
    margin-top: .6em;
}

.daily-items[b-a4tbmfn6t8] {
    list-style: none;
    margin: .5em 0 0;
    padding: 0 0 0 1.8em;
    display: flex;
    flex-direction: column;
    gap: .4em;
}

.daily-item[b-a4tbmfn6t8] {
    display: flex;
    align-items: center;
    gap: .7em;
}

.daily-item-name[b-a4tbmfn6t8] {
    color: #14425a;
    font-size: .88em;
}

.daily-item.done .daily-item-name[b-a4tbmfn6t8] {
    color: #2f7a2f;
    text-decoration: line-through;
}

/* Iste širine kao TaskCheckbox, da se nazivi stavki poravnaju. */
.daily-done-icon[b-a4tbmfn6t8],
.daily-placeholder[b-a4tbmfn6t8] {
    display: inline-flex;
    justify-content: center;
    width: 32px;
    min-width: 32px;
}

.daily-done-icon[b-a4tbmfn6t8] {
    color: #5cb85c;
}

.daily-actions[b-a4tbmfn6t8] {
    display: flex;
    justify-content: flex-end;
    gap: .6em;
    margin: .7em 0 .3em;
}

/* 44px, kao i ostala dugmad - ovo se pritiska prstom u rukavici, kraj mašine. */
.daily-cancel[b-a4tbmfn6t8],
.daily-save[b-a4tbmfn6t8] {
    border-radius: .6em;
    padding: 0 1em;
    min-height: 44px;
    cursor: pointer;
    font-size: .85em;
}

.daily-cancel[b-a4tbmfn6t8] {
    background: transparent;
    border: 1px solid #d0dbe0;
    color: #14425a;
}

.daily-save[b-a4tbmfn6t8] {
    display: inline-flex;
    align-items: center;
    gap: .5em;
    background: var(--color-primary);
    border: none;
    color: white;
    font-family: 'Ubuntu-Medium';
}

@media (max-width: 700px) {
    .moj-dan-grid[b-a4tbmfn6t8] {
        grid-template-columns: 1fr;
    }
}

/* Snimljene linije korekcije uz mjerenje - tekst zna biti dug, pa se ne skraćuje u jedan red. */
.correction-note[b-a4tbmfn6t8] {
    white-space: normal;
    line-height: 1.35;
}

/* Redovi "Izvršeno danas" su u FeedLista.razor.css - isti dnevnik je i na adminovom pregledu. */

.md-card-head .head-note[b-a4tbmfn6t8] {
    font-family: 'Ubuntu-Light';
    font-size: .78em;
    color: gray;
    text-align: right;
}

.md-card-head label.amber[b-a4tbmfn6t8] {
    color: #8a6d00;
}
/* _content/ArasWeb/Pages/Odrzavanje/Tabs/PregledTab.razor.rz.scp.css */
#pregled[b-9giscaurb5] {
    display: flex;
    flex-direction: column;
    gap: 1em;
}

.pregled-toolbar[b-9giscaurb5] {
    display: flex;
    align-items: center;
    gap: .8em;
    flex-wrap: wrap;
}

.period-chips[b-9giscaurb5] {
    display: flex;
    gap: .5em;
    flex-wrap: wrap;
}

.chip[b-9giscaurb5] {
    display: inline-flex;
    align-items: center;
    gap: .5em;
    border-radius: 2em;
    padding: .45em 1em;
    font-size: .85em;
    background: #fff;
    color: #6c757d;
    border: 1px solid lightgray;
    min-height: 40px;
    cursor: pointer;
}

.chip.active[b-9giscaurb5] {
    background: var(--ar-primary-soft);
    color: var(--ar-primary);
    border-color: var(--ar-primary);
    font-family: 'Ubuntu-Medium';
}

.toolbar-actions[b-9giscaurb5] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .6em;
    margin-left: auto;
}

/* Svijetla dugmad s obrubom, kao u konceptu - radnja na pregledu, ne primarna akcija. */
.toolbar-btn[b-9giscaurb5] {
    display: inline-flex;
    align-items: center;
    gap: .5em;
    background: #fff;
    border: 1px solid lightgray;
    color: #14425a;
    border-radius: .5em;
    padding: .4em 1.2em;
    min-height: 44px;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .08);
}

.toolbar-btn:hover:not(:disabled)[b-9giscaurb5] {
    background: #e4eef2;
}

.toolbar-btn:disabled[b-9giscaurb5] {
    opacity: .6;
    cursor: default;
}

/* ---------- Podesi prikaz ---------- */

.kpi-config[b-9giscaurb5] {
    background: #fff;
    border-radius: 1em;
    padding: 1.1em 1.3em;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .06);
    border: 1px solid var(--ar-blue-200);
}

.kpi-config-head[b-9giscaurb5] {
    display: flex;
    align-items: center;
    gap: .6em;
    margin-bottom: .3em;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.kpi-config-head i[b-9giscaurb5] {
    color: var(--ar-primary);
}

.kpi-config-note[b-9giscaurb5] {
    font-family: 'Ubuntu-Light';
    font-size: .82em;
    color: gray;
    margin: 0 0 .9em;
}

.kpi-config-grid[b-9giscaurb5] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
    gap: .7em;
}

.kpi-toggle[b-9giscaurb5] {
    display: flex;
    gap: .8em;
    align-items: flex-start;
    padding: .7em .9em;
    border: 1px solid #ececec;
    border-radius: .6em;
    background: #f9fbfc;
    cursor: pointer;
    text-align: left;
}

.kpi-toggle:hover[b-9giscaurb5] {
    background: #f0f6f9;
}

.switch[b-9giscaurb5] {
    width: 40px;
    height: 22px;
    flex: none;
    border-radius: 11px;
    background: #c9d2d6;
    position: relative;
    margin-top: .15em;
    transition: background .15s;
}

.switch.on[b-9giscaurb5] {
    background: #26b050;
}

.knob[b-9giscaurb5] {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .25);
    transition: left .15s;
}

.switch.on .knob[b-9giscaurb5] {
    left: 20px;
}

.kpi-toggle-text[b-9giscaurb5] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.kpi-toggle-label[b-9giscaurb5] {
    font-family: 'Ubuntu-Medium';
    font-size: .88em;
    color: #14425a;
}

.kpi-toggle-info[b-9giscaurb5] {
    font-family: 'Ubuntu-Light';
    font-size: .78em;
    color: gray;
    line-height: 1.35;
}

/* ---------- KPI kartice ---------- */

.kpi-grid[b-9giscaurb5] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 1em;
}

.kpi-card[b-9giscaurb5] {
    background: #fff;
    border-radius: 1em;
    padding: 1.1em 1.2em;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .05);
    border: 1px solid #eef1f3;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: .6em;
    min-height: 118px;
}

.kpi-head[b-9giscaurb5] {
    display: flex;
    align-items: center;
    gap: .7em;
}

.kpi-icon[b-9giscaurb5] {
    width: 34px;
    height: 34px;
    flex: none;
    border-radius: .55em;
    background: #f4f8fa;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .9em;
}

.kpi-label[b-9giscaurb5] {
    flex: 1;
    min-width: 0;
    font-size: .85em;
    color: #6c8794;
    line-height: 1.25;
}

.kpi-value[b-9giscaurb5] {
    font-family: 'Ubuntu-Medium';
    font-size: 1.55em;
    line-height: 1.1;
}

.kpi-sub[b-9giscaurb5] {
    font-family: 'Ubuntu-Light';
    font-size: .78em;
    color: gray;
    min-height: 1.2em;
}

/* ---------- Donji red: problematične mašine i dnevnik ---------- */

.pregled-grid[b-9giscaurb5] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 1em;
    align-items: start;
}

.md-card[b-9giscaurb5] {
    background: #fff;
    border-radius: 1em;
    padding: 1em;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .06);
    min-width: 0;
}

.md-card-head[b-9giscaurb5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .6em;
    margin-bottom: .7em;
}

.md-card-head label[b-9giscaurb5] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    margin: 0;
}

.md-card-head label i[b-9giscaurb5] {
    color: #3e677d;
    margin-right: .4em;
}

.head-note[b-9giscaurb5] {
    font-family: 'Ubuntu-Light';
    font-size: .78em;
    color: gray;
    text-align: right;
}

.head-pills[b-9giscaurb5] {
    display: flex;
    gap: .5em;
}

.empty-note[b-9giscaurb5] {
    margin: 0;
    color: #6c757d;
    font-size: .88em;
}

.pill[b-9giscaurb5] {
    display: inline-flex;
    align-items: center;
    border-radius: 2em;
    padding: .25em .8em;
    font-size: .72em;
    font-family: 'Ubuntu-Medium';
    white-space: nowrap;
    border: none;
}

.count-pill[b-9giscaurb5] {
    background: var(--ar-primary-soft);
    color: var(--ar-primary);
}

.danger-pill[b-9giscaurb5] {
    background: rgba(217, 83, 79, .12);
    color: #b8443f;
}

.report-pill[b-9giscaurb5] {
    background: #ececec;
    color: #6c757d;
    cursor: pointer;
}

.report-pill.open[b-9giscaurb5] {
    background: rgba(217, 83, 79, .15);
    color: #d9534f;
}

.problem-row[b-9giscaurb5] {
    padding: .6em .3em;
    border-bottom: 1px solid #f6f6f6;
    cursor: pointer;
}

.problem-row:last-child[b-9giscaurb5] {
    border-bottom: none;
}

.problem-row:hover[b-9giscaurb5] {
    background: #f9fbfc;
}

.problem-head[b-9giscaurb5] {
    display: flex;
    align-items: center;
    gap: .6em;
    margin-bottom: .35em;
}

.problem-name[b-9giscaurb5] {
    flex: 1;
    min-width: 0;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.problem-downtime[b-9giscaurb5] {
    font-family: 'Ubuntu-Medium';
    font-size: .85em;
    color: #d9534f;
    min-width: 70px;
    text-align: right;
}

.problem-bar[b-9giscaurb5] {
    height: 7px;
    background: #ececec;
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: .35em;
}

.problem-bar-fill[b-9giscaurb5] {
    height: 100%;
}

.problem-bar-fill.tone-red[b-9giscaurb5] {
    background: #d9534f;
}

.problem-bar-fill.tone-amber[b-9giscaurb5] {
    background: #ffcc00;
}

.problem-bar-fill.tone-blue[b-9giscaurb5] {
    background: var(--ar-primary);
}

.problem-sub[b-9giscaurb5] {
    font-family: 'Ubuntu-Light';
    font-size: .8em;
    color: #6c8794;
}

.tab-placeholder[b-9giscaurb5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .4em;
    background: white;
    border-radius: 1em;
    padding: 3em 1em;
    color: #6c757d;
    text-align: center;
}

.tab-placeholder i[b-9giscaurb5] {
    font-size: 2em;
    color: #d7e3e8;
}

.tab-placeholder h5[b-9giscaurb5] {
    margin: 0;
    color: #14425a;
}

.tab-placeholder p[b-9giscaurb5] {
    margin: 0;
    font-size: .88em;
}

/* ---------- Infrastruktura ---------- */

.infra-stats[b-9giscaurb5] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: .8em;
}

.infra-stat[b-9giscaurb5] {
    display: flex;
    flex-direction: column;
    gap: .2em;
    padding: .7em .8em;
    border-radius: .7em;
    background: #f7fafb;
    min-width: 0;
}

.infra-stat-label[b-9giscaurb5] {
    font-size: .8em;
    color: #6c8794;
}

.infra-stat-value[b-9giscaurb5] {
    font-family: 'Ubuntu-Medium';
    font-size: 1.35em;
    color: #14425a;
    line-height: 1.15;
}

.infra-stat-sub[b-9giscaurb5] {
    font-family: 'Ubuntu-Light';
    font-size: .76em;
    color: gray;
}

.infra-link[b-9giscaurb5] {
    margin-top: .8em;
    border: none;
    background: none;
    padding: 0;
    color: var(--ar-primary);
    font-size: .85em;
    cursor: pointer;
}

.infra-link i[b-9giscaurb5] {
    font-size: .85em;
    margin-left: .3em;
}

@media (max-width: 700px) {
    .pregled-grid[b-9giscaurb5],
    .kpi-config-grid[b-9giscaurb5] {
        grid-template-columns: 1fr;
    }

    .toolbar-actions[b-9giscaurb5] {
        margin-left: 0;
    }
}
/* _content/ArasWeb/Pages/Odrzavanje/Tabs/PrijavaKvaraTab.razor.rz.scp.css */
#prijava-kvara-tab[b-gp6oyo524i] {
    display: flex;
    flex-direction: column;
    gap: 1em;
}

.prijava-top[b-gp6oyo524i] {
    display: flex;
    align-items: center;
    gap: 1em;
    flex-wrap: wrap;
    background: white;
    border-radius: 1em;
    padding: 1em;
}

/* Tekst zauzme sav prostor do "Prijavi kvar"; na uskom ekranu dugme pređe u novi red. */
.prijava-text[b-gp6oyo524i] {
    flex: 1;
    min-width: 16em;
    display: flex;
    flex-direction: column;
    gap: 0.2em;
}

.prijava-title[b-gp6oyo524i] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

/* "Prijavi kvar" je jedina radnja ovog ekrana - crveno i dovoljno veliko za prst. */
.report-btn[b-gp6oyo524i] {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    background: #d9534f;
    color: white;
    border: none;
    border-radius: 0.6em;
    padding: 0 1.2em;
    min-height: 44px;
    cursor: pointer;
}

.moje-prijave[b-gp6oyo524i] {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 0.6em;
    background: white;
    border-radius: 1em;
    padding: 1em;
}

/* Pet redova (min-height 60px + razmak) vidljivo, ostali se skroluju unutar kartice. */
.prijave-list[b-gp6oyo524i] {
    display: flex;
    flex-direction: column;
    gap: 0.6em;
    max-height: calc(5 * 60px + 4 * 0.6em);
    overflow-y: auto;
    padding-right: 0.2em;
}

.moje-prijave > label[b-gp6oyo524i] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.empty-note[b-gp6oyo524i] {
    margin: 0;
    color: #6c757d;
    font-size: 0.88em;
}

/* Fiksne rubne kolone i min-height: da se sadržaj ne pomjera kad status promijeni
   dužinu ili kad se ispod njega pojavi druga linija. */
.moja-prijava-row[b-gp6oyo524i] {
    display: grid;
    grid-template-columns: 3.5em minmax(0, 1fr) 12em;
    align-items: center;
    gap: 1em;
    padding: 0.7em 0.9em;
    border: 1px solid #f0f4f5;
    border-radius: 0.8em;
    min-height: 60px;
    /* Red je flex stavka u koloni koja skroluje; bez ovoga ga flex sabije ispod
       visine sadržaja na užem ekranu, pa se redovi preklope. */
    flex-shrink: 0;
}

.pill[b-gp6oyo524i] {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    border-radius: 2em;
    padding: 0.25em 0.8em;
    font-size: 0.72em;
    font-family: 'Ubuntu-Medium';
    white-space: nowrap;
}

/* Oznaka prioriteta je mala i centrirana u svojoj koloni - bez ovoga je grid razvuče na
   cijelu širinu kolone, a tekst ostane lijevo. */
.prio-pill[b-gp6oyo524i] {
    justify-self: center;
    align-self: center;
    justify-content: center;
    min-width: 2.8em;
    padding: 0.25em 0.6em;
}

.row-main[b-gp6oyo524i] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.row-title[b-gp6oyo524i] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: 0.92em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.row-sub[b-gp6oyo524i] {
    color: #6c757d;
    font-size: 0.8em;
}

.row-status[b-gp6oyo524i] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.3em;
    min-width: 0;
}

/* Jedna linija s tri tačke: duže ime ili razlog čekanja ne smiju razvući red. */
.row-note[b-gp6oyo524i] {
    max-width: 100%;
    color: #6c757d;
    font-size: 0.78em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 700px) {
    .prijava-text[b-gp6oyo524i] {
        min-width: 100%;
    }

    .moja-prijava-row[b-gp6oyo524i] {
        grid-template-columns: 3.5em minmax(0, 1fr);
        row-gap: 0.4em;
    }

    .row-status[b-gp6oyo524i] {
        grid-column: 2;
        align-items: flex-start;
    }
}
/* _content/ArasWeb/Pages/Odrzavanje/Tabs/PrijaveTab.razor.rz.scp.css */
.prijave-page[b-js35wh94kf] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

#prijave-tab[b-js35wh94kf] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    background: white;
    border-radius: 1em;
    padding: 1em;
}

.tab-toolbar[b-js35wh94kf] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1em;
    flex-wrap: wrap;
    margin-bottom: 1em;
}

.toolbar-right[b-js35wh94kf] {
    display: flex;
    align-items: center;
    gap: .8em;
}

.sub-tabs[b-js35wh94kf] {
    display: flex;
    gap: 0.5em;
    flex-wrap: wrap;
}

.sub-tab[b-js35wh94kf] {
    border: 1px solid #e4eef2;
    background: white;
    color: #55646c;
    border-radius: 2em;
    padding: 0.4em 1em;
    font-size: 0.85em;
    cursor: pointer;
}

.sub-tab.active[b-js35wh94kf] {
    background: #e4eef2;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.prijave-list[b-js35wh94kf] {
    flex: 1;
    min-height: 0;
    overflow: auto;
    display: flex;
    flex-direction: column;
    gap: 0.6em;
}

/* Red je klikabilan cijelom širinom - u hali se cilja prstom, ne mišem.
   Prva i zadnja kolona su fiksne, ne auto: inače bi širina zavisila od dužine
   statusa ("NOVA" naspram "ZATVORENA") pa bi se sadržaj pomjerao od reda do reda.
   min-height drži istu visinu i kad ispod statusa nema druge linije. */
.prijava-row[b-js35wh94kf] {
    display: grid;
    grid-template-columns: 3.5em minmax(0, 2fr) minmax(0, 1fr) 12em;
    align-items: center;
    gap: 1em;
    padding: 0.8em 1em;
    border: 1px solid #f0f4f5;
    border-radius: 0.8em;
    cursor: pointer;
    min-height: 64px;
    /* Red je flex stavka u koloni koja skroluje; bez ovoga ga flex sabije ispod
       visine sadržaja čim se na užem ekranu složi u tri linije, pa se redovi preklope. */
    flex-shrink: 0;
    transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

/* Isti hover akcent kao Historija servisa/Mašine i oprema - ovdje red ostaje krupan
   namjerno (dira se prstom u hali), samo boja/sjena prate ostatak modula. */
.prijava-row:hover[b-js35wh94kf] {
    background: #f5f9fb;
    box-shadow: inset 0.25em 0 0 0 var(--color-text-muted);
}

.pill[b-js35wh94kf] {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    border-radius: 2em;
    padding: 0.25em 0.8em;
    font-size: 0.72em;
    font-family: 'Ubuntu-Medium';
    white-space: nowrap;
}

.prio-pill[b-js35wh94kf] {
    justify-self: start;
}

.row-main[b-js35wh94kf] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.row-title[b-js35wh94kf] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    font-size: 0.95em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.row-title i[b-js35wh94kf] {
    color: #55646c;
    font-size: 0.85em;
    margin-left: 0.4em;
}

.row-sub[b-js35wh94kf] {
    color: #55646c;
    font-size: 0.8em;
}

.row-machine[b-js35wh94kf] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    color: #14425a;
    font-size: 0.85em;
}

.row-loc[b-js35wh94kf] {
    color: #55646c;
    font-size: 0.85em;
}

.row-status[b-js35wh94kf] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.3em;
    min-width: 0;
}

/* Jedna linija s tri tačke: duže ime ili razlog čekanja ne smiju razvući red. */
.row-note[b-js35wh94kf] {
    max-width: 100%;
    color: #55646c;
    font-size: 0.78em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Ispod tableta red se slaže u dvije kolone da naslov ostane čitljiv.
   Status ide lijevo uz ostalo, ali kolona ostaje fiksna radi istog poravnanja. */
@media (max-width: 900px) {
    .prijava-row[b-js35wh94kf] {
        grid-template-columns: 3.5em minmax(0, 1fr);
        row-gap: 0.4em;
    }

    .row-machine[b-js35wh94kf],
    .row-status[b-js35wh94kf] {
        grid-column: 2;
        align-items: flex-start;
    }
}
/* _content/ArasWeb/Pages/Odrzavanje/TaskCheckbox.razor.rz.scp.css */
.task-checkbox[b-sv8g0fpkf9] {
    /* Globalno "button" pravilo (site.css) daje svakom dugmetu min-height:44px - bez
       eksplicitnog min-height/min-width ovdje, kvadrat bi se razvukao u 30×44 pravougaonik
       koji se ne prepoznaje kao čekiranje. */
    width: 32px;
    height: 32px;
    min-width: 32px;
    min-height: 32px;
    flex-shrink: 0;
    border-radius: .35em;
    border: 2px solid #ccd3d6;
    background: #fff;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.05em;
    cursor: pointer;
    transition: background .15s, border-color .15s;
    padding: 0;
    position: relative;
}

/* Kvadrat ostaje 32px da lista obaveza ostane gusta, ali prst u rukavici gađa 44px:
   nevidljivo prošireno polje dodira oko kvačice (klik na njega ide samom dugmetu). */
.task-checkbox[b-sv8g0fpkf9]::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 44px;
    height: 44px;
    transform: translate(-50%, -50%);
}

.task-checkbox:hover:not(:disabled)[b-sv8g0fpkf9] {
    border-color: var(--ar-primary-hover);
}

.task-checkbox:disabled[b-sv8g0fpkf9] {
    cursor: default;
    opacity: .6;
}

.task-checkbox.done[b-sv8g0fpkf9] {
    background: #5cb85c;
    border-color: #5cb85c;
}

.task-checkbox.late[b-sv8g0fpkf9] {
    border-color: #d9534f;
    background: rgba(217, 83, 79, .08);
}
/* _content/ArasWeb/Pages/Offers/OfferDetails.razor.rz.scp.css */
#offer-details-container[b-17l9g0fw0k] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
}

#offer[b-17l9g0fw0k],
#articles-container[b-17l9g0fw0k] {
    height: 100%;
    display: flex;
    flex-direction: column;
    padding: 1em;
    background: white;
    border-radius: 0.5em;
}

#offer[b-17l9g0fw0k] {
    width: 22%;
    padding-right: 2em;
    /* Contain the sidebar content inside the white card. The card height is
       bounded by the layout, so the compact spacing below is what lets every
       field + button fit without scrolling on a normal screen; this scroll is
       only a safety net for very short viewports / high zoom. */
    overflow-y: auto;
    min-height: 0;
    max-height: calc(100vh - 150px);
}

#offer-name[b-17l9g0fw0k],
#document-type[b-17l9g0fw0k] {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: .5em;
}

    #offer-name label[b-17l9g0fw0k], #document-type label[b-17l9g0fw0k]{
        font-family: var(--font-light);
        margin-bottom: 0.3em;
    }

/* Slightly tighter inputs so the extra select fields fit in the card. */
#offer .form-control[b-17l9g0fw0k] {
    padding-top: 0.3em;
    padding-bottom: 0.3em;
}

#offer button[b-17l9g0fw0k] {
    width: 100%;
    margin-bottom: 0.4em;
    padding-top: 0.35em;
    padding-bottom: 0.35em;
    flex-shrink: 0;
}

#offer button i[b-17l9g0fw0k] {
    margin-right: 0.3em;
}

#offer #generate-offer-pdf[b-17l9g0fw0k],
#offer #generate-offer-excel[b-17l9g0fw0k] {
    font-family: var(--font-medium);
    margin-bottom: auto;
    border: 0.01em solid gray;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
    background: white;
    color: black;
}

    #offer #generate-offer-pdf img[b-17l9g0fw0k],
    #offer #generate-offer-excel img[b-17l9g0fw0k] {
        width: 1.5em;
        height: 1.5em;
        margin-right: 0.5em;
    }

#generate-offer-excel[b-17l9g0fw0k] {
    border: 0.1em solid #5cb85c;
    color: #3d783d;
}


#approve-offer-btn[b-17l9g0fw0k] {
    margin-top: auto;
}

#articles-container[b-17l9g0fw0k] {
    width: 75%;
    padding-left: 2em;
}

#articles-list[b-17l9g0fw0k] {
    width: 100%;
    height: 75%;
    margin-bottom: 3em;
}

.add-article-btn[b-17l9g0fw0k] {
    justify-self: end;
    margin-left: auto;
    margin-right: 2em;
    margin-bottom: 1em;
}

[b-17l9g0fw0k] #empty-list img{
    width: 18em;
}

/*
    The shared .list-header / .list-wrapper ul li rule (site.css) uses
    justify-content: space-between, which spreads DIRECT children evenly across
    the row. That only kept .article-item-details aligned between the header
    (1 child before Rb.) and each row (3 children) because it was always the
    first child, which space-between pins to the start regardless of sibling
    count. Adding .row-number as a new first child breaks that: the header now
    has 2 children (so .article-item-details is pushed flush to the row's right
    edge) while each row still has 4, landing it somewhere in between. Switching
    to flex-start lets both rely purely on fixed widths/order instead, and the
    icon+button are pushed back to the right edge explicitly below.
*/
.list-header[b-17l9g0fw0k],
.list-item[b-17l9g0fw0k] {
    justify-content: flex-start;
    gap: 0.5em;
}

.list-header .row-number[b-17l9g0fw0k],
.list-item .row-number[b-17l9g0fw0k] {
    width: 3em;
    flex: 0 0 auto;
    display: flex;
    justify-content: center;
    text-align: center;
}

.article-item-details[b-17l9g0fw0k]{
    width: 60%;
}

.article-item-details label[b-17l9g0fw0k] {
    width: 50%;
}

.remove-article-btn[b-17l9g0fw0k] {
    margin-left: auto;
    margin-right: 0.5em;
    color: var(--color-danger);
    cursor: pointer;
}

.page-info[b-17l9g0fw0k] {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.cancel-offer-btn[b-17l9g0fw0k] {
    cursor: pointer !important;
    background: var(--color-danger);
    font-size: 0.9em;
    padding: 0.3em 0.8em;
    color: white;
    border-radius: 0.5em;
    margin-left: auto;
}

#approved-offer[b-17l9g0fw0k] {
    width: 100%;
    display: flex;
    justify-content: end;
    align-items: center;
    margin-bottom: .5em;
    opacity: 0.9
}

    #approved-offer label[b-17l9g0fw0k] {
        border-radius: 2em;
        width: 100%;
        padding: 0.3em 1.5em;
        word-break: break-all;
        font-family: var(--font-medium);
        font-size: 0.8em;
        display: flex;
        justify-content: center;
        align-items: center;
        background:rgba(205, 254, 194, 0.8);
    }

    #approved-offer i[b-17l9g0fw0k] {
        margin-right: 0.5em;
    }
/* _content/ArasWeb/Pages/Offers/Offers.razor.rz.scp.css */
#offers[b-u6byv30x8q] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#offers-container[b-u6byv30x8q] {
    display: flex;
    flex-direction: column;
    width: 100%;
    border-radius: 0.5em;
    background: white;
    padding: 1em 0;
}

#offer-filters[b-u6byv30x8q] {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.5em;
    width: 70%;
    padding: 0 1em;
    font-family: var(--font-light);
    font-size: 0.9em;
}

.filter-box[b-u6byv30x8q] {
    margin-right: 1em;
    display: flex;
    flex-direction: column;
}

    .filter-box label[b-u6byv30x8q] {
        margin-bottom: 0.5em;
    }

    .filter-box select[b-u6byv30x8q] {
        width: 15em;
        padding: 0.5em 0.2em;
    }

    .filter-box img[b-u6byv30x8q] {
        width: 1em;
        height: 1em;
        margin: 0 0.5em;
    }

#offers-list[b-u6byv30x8q] {
    width: 100%;
}

#create-offer-btn[b-u6byv30x8q] {
}

#create-offer-btn i[b-u6byv30x8q] {
    margin-right: 0.5em;
}

.offer-status span[b-u6byv30x8q] {
    border-radius: 2em;
    width: auto;
    padding: 0.3em 1.5em;
    word-break: break-all;
    font-family: var(--font-medium);
    font-size: 0.8em;
    justify-content: center;
    width: 11em;
}

    .offer-status img[b-u6byv30x8q] {
        width: 1.2em;
        height: 1.2em;
        margin-right: 0.5em;
    }

.approved span[b-u6byv30x8q] {
    background: rgba(205, 254, 194, 0.8) 
}

.not-approved span[b-u6byv30x8q] {
    background: rgba(236, 236, 236, 0.8)
}
/* _content/ArasWeb/Pages/Orders/CreateOrder.razor.rz.scp.css */
#back-btn[b-5al3o68l7f]{
    cursor: pointer;
}

#create-order-container[b-5al3o68l7f] {
    width: 100%;
    height: 98%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}

#offer-info-container[b-5al3o68l7f] {
    height: auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-top: 1em;
    height: 100%;
}

#selecting-offer-info-wrapper[b-5al3o68l7f] {
    height: 100%;
    width: 100%;
    background: white;
    border-radius: 0.5em;
    overflow-y: scroll;
    padding: 1em;
}

#offer-filters[b-5al3o68l7f] {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.5em;
    width: 100%;
    flex-shrink: 0;
    padding: 0.3em 1em;
}

#include-offers-with-orders-label[b-5al3o68l7f] {
    display: flex;
    justify-content: start;
    height: auto;
    font-family: var(--font-light);
    margin-left: 1em;
}

.toggle-only-offers-withour-orders[b-5al3o68l7f] {
    margin-right: .3em !important;
    cursor: pointer;
    width: 1.2em;
    height: 1.2em;
    border-radius: 50%;
    border: 0.1em solid lightgray;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.2em;
}

.selected-all-offers[b-5al3o68l7f] {
    border: 0.1em solid var(--color-primary-hover)
}

.selected-all-offers span[b-5al3o68l7f] {
    width: 100%;
    height: 100%;
    background: var(--color-primary-hover);
    border-radius: 50%;
}

#offers-list[b-5al3o68l7f] {
    width: 100%;
    height: 87%;
}

#selecting-offer-container button[b-5al3o68l7f] {
    align-self: end;
}

#order[b-5al3o68l7f] {
    height: auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: 1em;
    padding: 1em;
    background: white;
    border-radius: 0.5em;
}

#order-header[b-5al3o68l7f] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}


#order-input[b-5al3o68l7f] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding: 0 1em;
}

    #order-input div[b-5al3o68l7f] {
        width: 30%;
        display: flex;
        flex-direction: column;
        margin: 1em 0;
    }

    #order-input div label[b-5al3o68l7f] {
        font-family: var(--font-light);
        margin-bottom: 0.5em;
    }

#order-note-input[b-5al3o68l7f] {
    width: 100%;
    padding: 0 1em;
    margin-bottom: 0.5em;
    display: flex;
    flex-direction: column;
}

    #order-note-input label[b-5al3o68l7f] {
        font-family: var(--font-light);
        margin-bottom: 0.5em;
    }

#selecting-offer-container[b-5al3o68l7f],
#selecting-articles-container[b-5al3o68l7f] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#selecting-articles-container[b-5al3o68l7f] {
    height: auto;
    overflow-y: visible;
    padding: 1em;
    padding-bottom: 1.5em;
    background: white;
    border-radius: 0.5em;
}

#selecting-offer-container .list-header[b-5al3o68l7f] {
    background: rgba(13, 110, 253, 0.3)
}

.list-wrapper .list[b-5al3o68l7f],
.list-wrapper .list-header[b-5al3o68l7f] {
    background: rgba(211,211,211,0.5);
}

.list-wrapper .list[b-5al3o68l7f] {
    padding-left: 0.5em;
}

.list-item[b-5al3o68l7f] {
    background: white;
}

#offers-list .list-item label[b-5al3o68l7f], #offers-list .list-item span[b-5al3o68l7f], #offers-list .list-item input[b-5al3o68l7f] {
    cursor: pointer;
}

.list-wrapper ul li:hover[b-5al3o68l7f] {
    border: 0.1em solid #accbff;
}

.select-order[b-5al3o68l7f] {
    width: 10%;
    display: flex;
    justify-content: center;
    border: 0.01em solid lightgray;
    width: 1.8em;
    height: 1.8em;
    padding: 0.5em;
    text-align: center;
    border-radius: 0.5em;
}

    .select-order img[b-5al3o68l7f] {
        width: 0.7em;
        height: 0.7em;
    }

.selected-offer[b-5al3o68l7f] {
    border: 0.1em solid var(--color-primary-hover);
    background: #dbedff;
    font-family: var(--font-medium);
}

    .selected-offer .select-order[b-5al3o68l7f] {
        border: 0.1em solid #accbff;
        background: var(--color-primary-hover);
    }

.continue-btn[b-5al3o68l7f] {
    margin-left: auto;
}

/*
    SELECTING ARTICLES:
*/
#articles-list[b-5al3o68l7f] {
    height: auto;
    width: 100%;
}

.article-already-in-orders[b-5al3o68l7f]{
    background: #f1f1f1;
}

#articles-list .list-wrapper[b-5al3o68l7f] {
    height: auto;
}

#selecting-articles-container h5[b-5al3o68l7f]{
    align-self: start;
}

.article-num[b-5al3o68l7f] {
    width: 10%;
    height: 100%;
    display: flex;
    align-items: start;
    font-family: var(--font-regular);
}

.article-details[b-5al3o68l7f]{
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: start;
    width: 45%;
    height: 100%;
    padding-right: 1em;
}

.list-item .item-wrapper[b-5al3o68l7f] {
    width: 100%;
    display: flex;
    justify-content: start;
    align-items: end;
    padding-right: 1em;
    margin-bottom: 0.3em;
}

    .list-item .item-wrapper .item-name[b-5al3o68l7f],
    .list-item .item-wrapper .item-value[b-5al3o68l7f] {
        height: 100%;
    }

    .list-item .item-wrapper .item-value[b-5al3o68l7f] {
        font-family: var(--font-medium);
    }

    .list-item .item-wrapper .item-name[b-5al3o68l7f] {
        font-size: 0.9em;
        font-family: var(--font-light);
        margin-right: 0.3em;
    }

#articles-list .calculator[b-5al3o68l7f] {
    display: flex;
    flex-direction: column;
    width: 45%;
    align-items: end;
}

    #articles-list .calculator .calculator-item[b-5al3o68l7f] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 0.3em;
        padding: 0.5em 1em;
        border: 0.01em solid lightgrey;
        border-radius: 0.7em;
    }

        #articles-list .calculator .calculator-item .calculator-details[b-5al3o68l7f] {
            width: 90%;
            display: flex;
            justify-content: start;
            align-items: center;
        }

            #articles-list .calculator .calculator-item .calculator-details .item-wrapper[b-5al3o68l7f] {
                width: 50%;
                margin: 0;
                align-items: center;
            }

        #articles-list .calculator .calculator-item .calculator-selection[b-5al3o68l7f] {
            display: flex;
            justify-content: center;
            border: 0.01em solid lightgray;
            width: 1.5em;
            height: 1.5em;
            padding: 0.5em;
            text-align: center;
            border-radius: 0.5em;
            margin-right: 1em;
            cursor: pointer;
        }

    #articles-list .calculator .calculator-item img[b-5al3o68l7f] {
        width: 0.5em;
        height: 0.5em;
    }

.calculation-selected[b-5al3o68l7f] {
    background: var(--color-primary-hover);
}

.calculator-item-selected[b-5al3o68l7f] {
    border: 0.1em solid var(--color-primary-hover) !important;
    background: rgba(2, 117, 216, 0.1);
}
/*
    PREVIEW STYLE
*/
#preview[b-5al3o68l7f] {
    height: auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    padding: 1em;
    border-radius: 0.5em;
    overflow-y: scroll;
}

#preview h3[b-5al3o68l7f] {
    text-align: center;
    margin-bottom: 1em;
}

    #preview #order-preview[b-5al3o68l7f] {
        background: white;
        height: auto;
        width: 100%;
        display: flex;
        flex-direction: column;
        border-radius: 0.5em;
    }

        #preview #order-preview .checkmark[b-5al3o68l7f] {
            display: flex;
            justify-content: center;
            background: #70bc64;
            width: 100%;
            border-top-left-radius: 0.5em;
            border-top-right-radius: 0.5em;
            padding: 0.5em 0;
        }

        #preview #order-preview .checkmark span[b-5al3o68l7f] {
            background: white;
            border-radius: 50%;
        }

            #preview #order-preview .checkmark img[b-5al3o68l7f] {
                width: 2em; 
                height: 2em;
            }

        #preview #order-preview .checkmark-bottom[b-5al3o68l7f] {
            border-radius: 0;
            border-bottom-left-radius: 0.5em;
            border-bottom-right-radius: 0.5em;
            height: 2em;
        }

        #preview #order-preview #header[b-5al3o68l7f] {
            width: 100%;
            display: flex;
            justify-content: space-between;
            border-bottom: 0.1em solid lightgrey;
            padding: 2em;
        }

            #preview #order-preview #header .group[b-5al3o68l7f] {
                display: flex;
                flex-direction: column;
            }

            #preview #order-preview #body[b-5al3o68l7f] {
                padding: 2em;
                width: 100%;
            }

    #preview .info[b-5al3o68l7f] {
        display: flex;
        flex-direction: column;
        margin-bottom: 0.5em ;
    }

    #preview .right[b-5al3o68l7f]{
        align-items: end;
    }

    #preview .info label[b-5al3o68l7f] {
        font-family: var(--font-light)
    }

        #preview .info span[b-5al3o68l7f] {
            font-family: var(--font-medium);
            font-size: 1.1em;
        }

#preview-articles-list[b-5al3o68l7f] {
    width: 100%;
    padding: 1em;
}

    #preview-articles-list ul[b-5al3o68l7f] {
        width: 100%;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
    }

        #preview-articles-list ul li[b-5al3o68l7f] {
            width: 100%;
            margin: 0;
            padding: 0;
            list-style-type: none;
            width: 100%;
            display: flex;
            justify-content: space-between;
            align-items: center;
            border-bottom: 0.1em solid lightgrey;
            padding: 0.5em;
        }

            #preview-articles-list ul li label[b-5al3o68l7f] {
                width: 18%;
                word-wrap: break-word;
            }

        #preview-articles-list ul .header[b-5al3o68l7f]{
            font-family: var(--font-bold);
            background: #d1d1d1;
            border-radius: 0.3em;
        }

        #preview-articles-list ul li .quantity[b-5al3o68l7f] {
            width: 7%;
            text-align: center;
        }

        #preview-articles-list ul li .amount[b-5al3o68l7f],
        #preview-articles-list ul li .date[b-5al3o68l7f] {
            width: 10%;
            text-align: right;
        }

        #total[b-5al3o68l7f]{
            display: flex;
            flex-direction: column;
            align-items: end;
            padding-right: 1em;
            font-size: 1.2em;
        }

        #total label[b-5al3o68l7f] {
            font-family: var(--font-light);
        }

            #total span[b-5al3o68l7f] {
                font-family: var(--font-bold);
                color: #198754;
            }

    #preview #btns[b-5al3o68l7f]{
        margin-top: 2em;
        margin-left: auto;
    }

/* Oznaka za sastavnice: kooperant radi s našim materijalom. */
.our-material[b-5al3o68l7f] {
    display: flex;
    align-items: center;
    gap: 0.4em;
    margin-top: 0.4em;
    font-family: var(--font-light);
    font-size: 0.9em;
    color: var(--color-text-dark);
    cursor: pointer;
}
/* _content/ArasWeb/Pages/Orders/CreateOrderArticle.razor.rz.scp.css */
#create-article[b-txd4f7svz3]{
    width: 100%;
    height: 100%;
}

    [b-txd4f7svz3] form {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: start;
        justify-content: center;
    }


#create-article-container[b-txd4f7svz3] {
    width: 50%;
    height: auto;
    background: white;
    border-radius: 1em;
    padding: 1em;
}

#create-article-container h5[b-txd4f7svz3] {
    margin-bottom: 1em;
}

#create-article-buttons[b-txd4f7svz3] {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-top: 2em;
    padding: 0 1em;
}

#create-article-form[b-txd4f7svz3] {
    display: flex;
    flex-direction: column;
    padding: 0 1em;
}

#create-article-form div[b-txd4f7svz3] {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: 1em;
}

    #create-article-form div label[b-txd4f7svz3] {
        font-family: var(--font-light);
        margin-bottom: 0.5em;
    }

.calculated-value span[b-txd4f7svz3] {
    background: var(--color-bg-tab-inactive);
    color: var(--color-primary);
    font-family: var(--font-bold)
}

.note-row[b-txd4f7svz3] {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: 1em;
}

    .note-row label[b-txd4f7svz3] {
        font-family: var(--font-light);
        margin-bottom: 0.5em;
    }

/* Oznaka za sastavnice: kooperant radi s našim materijalom. */
.our-material[b-txd4f7svz3] {
    display: flex;
    align-items: center;
    gap: 0.4em;
    margin-top: 0.4em;
    font-family: var(--font-light);
    font-size: 0.9em;
    color: var(--color-text-dark);
    cursor: pointer;
}
/* _content/ArasWeb/Pages/Orders/ImportOrderArticles.razor.rz.scp.css */
#import-page[b-0s4t1i99hj] {
    max-width: 1100px;
    margin: 0 auto;
    padding: 1em 0 3em;
}

#import-page h4[b-0s4t1i99hj] {
    color: #14425a;
    margin-bottom: 1em;
}

.card-box[b-0s4t1i99hj] {
    background: white;
    padding: 1em 1.2em;
    border-radius: 1em;
    margin-top: 1em;
    box-shadow: 0 2px 8px rgba(0,0,0,.08);
}

.error-box[b-0s4t1i99hj] {
    background: #f2dede;
    color: #a94442;
}

.card-title[b-0s4t1i99hj] {
    color: #14425a;
    font-weight: 600;
    font-size: 1.05em;
    margin-bottom: .6em;
    display: block;
}

.field-grid[b-0s4t1i99hj] {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 1em;
}

.field[b-0s4t1i99hj] { display: flex; flex-direction: column; margin-top: .4em; }
.field label[b-0s4t1i99hj] { color: #6c757d; font-size: .85em; margin-bottom: .2em; }

.warn-text[b-0s4t1i99hj] { color: #d9534f; font-size: .8em; margin-top: .2em; }

/* --- Artikli --- */
.articles-header[b-0s4t1i99hj] { margin-top: 1.6em; }

.article-card[b-0s4t1i99hj] {
    background: white;
    border-radius: 1em;
    margin-top: .8em;
    box-shadow: 0 2px 8px rgba(0,0,0,.08);
    overflow: hidden;
}

.article-summary[b-0s4t1i99hj] {
    display: flex;
    align-items: center;
    gap: 1em;
    padding: .9em 1.2em;
    cursor: pointer;
    transition: background .15s;
}
.article-summary:hover[b-0s4t1i99hj] { background: #e4eef2; }

.chevron[b-0s4t1i99hj] { color: var(--ar-primary); width: 1em; }
.art-name[b-0s4t1i99hj] { color: #14425a; font-weight: 600; min-width: 160px; }
.art-meta[b-0s4t1i99hj] { color: #6c757d; font-size: .9em; }

.badge-ok[b-0s4t1i99hj], .badge-warn[b-0s4t1i99hj] {
    font-size: .82em;
    padding: .12em .5em;
    border-radius: .5em;
}
.badge-ok[b-0s4t1i99hj] { color: #3c763d; background: #dff0d8; }
.badge-warn[b-0s4t1i99hj] { color: #8a6d3b; background: #fcf8e3; }

.warn-pill[b-0s4t1i99hj] {
    margin-left: auto;
    color: #8a6d3b;
    background: #fcf8e3;
    padding: .12em .5em;
    border-radius: .5em;
    font-size: .82em;
}

.article-details[b-0s4t1i99hj] {
    padding: 0 1.2em 1.2em;
    border-top: 1px solid #e4eef2;
}

.warn-strip[b-0s4t1i99hj] {
    background: #fcf8e3;
    color: #8a6d3b;
    padding: .6em .8em;
    border-radius: .6em;
    margin: .8em 0;
    font-size: .88em;
}

.details-body[b-0s4t1i99hj] {
    margin-top: .8em;
}

.preview-link[b-0s4t1i99hj] {
    display: inline-flex;
    align-items: center;
    gap: .4em;
    color: var(--ar-primary);
    cursor: pointer;
    font-size: .9em;
    margin-bottom: .6em;
}
.preview-link:hover[b-0s4t1i99hj] { text-decoration: underline; }

.preview-inline[b-0s4t1i99hj] {
    margin-bottom: .6em;
}

.group-title[b-0s4t1i99hj] {
    color: #14425a;
    font-weight: 600;
    margin: 1em 0 .4em;
    font-size: .95em;
}
.group-title .from-csv[b-0s4t1i99hj] { color: #5cb85c; font-weight: 400; font-size: .78em; }
.group-title .manual[b-0s4t1i99hj] { color: #6c757d; font-weight: 400; font-size: .78em; }

.dim-grid[b-0s4t1i99hj] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: .6em;
}
.dim-grid span[b-0s4t1i99hj] {
    display: flex;
    flex-direction: column;
    color: #6c757d;
    font-size: .82em;
    gap: .2em;
}

/* Same wording and colour as the validation warnings on the article and work order forms. */
.validation-warning[b-0s4t1i99hj] {
    color: #d9534f;
    font-size: 0.85em;
    margin: 0.3em 0 0 0;
}

.actions[b-0s4t1i99hj] { margin-top: 1.4em; }

@media (max-width: 800px) {
    .field-grid[b-0s4t1i99hj] { grid-template-columns: 1fr; }
    .details-grid[b-0s4t1i99hj] { grid-template-columns: 1fr; }
}
/* _content/ArasWeb/Pages/Orders/OrderArticleDetails.razor.rz.scp.css */
#create-article[b-dgeaaox402] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: start;
    flex-direction: column;
}

/*Aktivnosti: */


#complete-article-manually[b-dgeaaox402] {
    margin-left: auto;
}

#article-activities-container[b-dgeaaox402] {
    width: 100%;
    overflow-y: scroll;
}

#activity-container[b-dgeaaox402] {
    width: 100%;
    padding: 1em 2em;
    border-radius: 0.5em;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: #ebebeb;
    height: 100%;
    overflow-y: scroll;
}

#activities-header[b-dgeaaox402] {
    width: 100%;
    display: flex;
    align-items: center;
    margin-bottom: 1em;
}

    #activities-header h5[b-dgeaaox402] {
        margin: 0;
    }

    #activities-header img[b-dgeaaox402] {
        width: 1.5em;
        height: 1.5em;
        margin-right: 1em;
    }

.activities-list[b-dgeaaox402] {
    width: 100%;
    background: transparent;
    height: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
    padding: 0 5em;
    margin-top: 1em;
    justify-content: flex-start;
}

.activity-item-container[b-dgeaaox402] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    position: relative;
}

.timeline[b-dgeaaox402] {
    width: 30%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
}

    .timeline .line[b-dgeaaox402] {
        width: 40%;
        height: 100%;
        border-right: 0.1em solid #cfcfcf;
    }

    .timeline .branch[b-dgeaaox402] {
        width: 60%;
        position: absolute;
        left: 20%;
        display: flex;
    }

    .timeline .dot[b-dgeaaox402] {
        width: 1.2em;
        height: 1.2em;
        border-radius: 50%;
        background: #198754;
        position: absolute;
        left: calc(40% - 0.6em);
    }

.activity-item-wrapper[b-dgeaaox402] {
    width: 70%;
    padding-bottom: 1em;
}

.activity-item[b-dgeaaox402] {
    width: 100%;
    padding: 1.5em 2em;
    border-radius: 0.5em;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    background: white;
}

.status-and-operation[b-dgeaaox402] {
    display: flex;
    width: 100%;
    justify-content: space-between;
    margin-bottom: 0.5em;
}

.status[b-dgeaaox402] {
    font-family: 'Ubuntu-Medium';
    font-size: 0.8em;
    border-radius: 0.8em;
    padding: 0.3em 0.8em;
    width: 8em;
    color: white;
    text-align: center;
}

.operation[b-dgeaaox402] {
    font-family: 'Ubuntu-Bold';
    color: #198754;
}

.pending[b-dgeaaox402] {
    opacity: 0.6;
    color: black;
    background: lightgray;
}

i[b-dgeaaox402] {
    margin-right: 0.3em;
}

.status-and-operation .completed[b-dgeaaox402] {
    background: rgba(92, 184, 92, 0.3);
}

.status-and-operation .wip[b-dgeaaox402] {
    background: rgba(13, 110, 253, 0.3);
}

.completed-ua[b-dgeaaox402] {
    background: rgba(92, 184, 92, 0.1);
}

.wip-ua[b-dgeaaox402] {
    background: rgba(13, 110, 253, 0.1);
}

.stop-ua[b-dgeaaox402], .rework-ua[b-dgeaaox402], .repeat-ua[b-dgeaaox402] {
    background: rgba(240, 173, 78, 0.3);
}

.stop-cause[b-dgeaaox402], .is-repeat[b-dgeaaox402] {
    text-transform: uppercase;
    background: rgba(217, 83, 79, 0.5);
    border: 0.2em solid rgba(217, 83, 79, 0.9);
    padding: 0.3em 0.5em;
    text-align: center;
    font-family: 'Ubuntu-Medium';
    color: white;
    border-radius: 0.5em;
}

    .stop-cause span[b-dgeaaox402] {
        text-align: center !important;
    }

.is-repeat[b-dgeaaox402] {
    background: rgba(84, 124, 140, 0.8);
    border: 0.2em solid rgba(84, 124, 140, 0.9);
}

/* Rad zatvoren na kraju smjene, ostatak preuzeo kolega. */
.shift-handover[b-dgeaaox402] {
    background: rgba(108, 117, 125, 0.7);
    border-color: rgba(108, 117, 125, 0.9);
}

.pending-ua[b-dgeaaox402] {
    background: lightgray;
    color: black;
}

.user-activity[b-dgeaaox402] {
    display: flex;
    justify-content: space-between;
    margin: .5em 0;
    font-family: 'Ubuntu-Light';
    border-radius: 0.5em;
    padding: 1em;
}

.details[b-dgeaaox402], .time[b-dgeaaox402] {
    display: flex;
    flex-direction: column;
}

.time[b-dgeaaox402] {
    font-size: 0.85em;
}

    .details div[b-dgeaaox402],
    .time div[b-dgeaaox402] {
        display: flex;
        flex-direction: column;
        margin-bottom: 0.8em;
    }

        .details div label[b-dgeaaox402],
        .time div label[b-dgeaaox402] {
            font-size: 0.85em;
            opacity: 0.9;
        }

        .details div span[b-dgeaaox402] {
            font-family: 'Ubuntu-Medium';
        }

        .time div label[b-dgeaaox402], .time div span[b-dgeaaox402] {
            text-align: right;
        }

    .time img[b-dgeaaox402] {
        width: 1.5em;
        margin: 0 0.5em;
    }

.plate-material-info[b-dgeaaox402] {
    background: #e4eef2;
    border-left: 3px solid #14425a;
    border-radius: 0.4em;
    padding: 0.5em 0.8em !important;
    margin-bottom: 0.8em;
}

    .plate-material-info label[b-dgeaaox402] {
        color: #14425a;
        font-family: 'Ubuntu-Medium' !important;
        font-size: 0.8em !important;
        opacity: 1 !important;
        margin-bottom: 0.15em;
    }

    .plate-material-info span[b-dgeaaox402] {
        font-family: 'Ubuntu-Medium';
        font-size: 1em;
        color: #14425a;
        letter-spacing: 0.02em;
    }

    .plate-material-info .plate-meta[b-dgeaaox402] {
        display: block;
        font-family: 'Ubuntu-Light';
        font-size: 0.82em;
        color: #6c757d;
        margin-top: 0.1em;
        letter-spacing: 0;
    }

        .plate-material-info .plate-meta strong[b-dgeaaox402] {
            font-family: 'Ubuntu-Medium';
            color: #14425a;
        }

/* Početak koji je radnik ispravio pri završetku; zabilježeni ostaje vidljiv. */
.time .corrected-time[b-dgeaaox402] {
    display: block;
    color: #6c757d;
    font-family: 'Ubuntu-Italic';
    font-size: 0.8em;
    text-align: right;
}

/* Adminova ispravka ploče; globalni stil daje dugmetu flex i 44px visine. */
.plate-fix-btn[b-dgeaaox402] {
    display: inline-flex;
    align-items: center;
    gap: 0.35em;
    min-height: 0;
    margin-top: 0.4em;
    padding: 0.2em 0.7em;
    border: 1px solid #14425a;
    border-radius: 0.4em;
    background: white;
    color: #14425a;
    font-family: 'Ubuntu-Light';
    font-size: 0.82em;
    cursor: pointer;
}

    .plate-fix-btn:hover[b-dgeaaox402] {
        background: #e4eef2;
    }

.plate-modal-context[b-dgeaaox402] {
    color: #6c757d;
    font-size: 0.9em;
    margin-bottom: 0.8em;
}

.plate-modal-hint[b-dgeaaox402] {
    display: block;
    color: #6c757d;
    margin-top: 0.3em;
}
/* _content/ArasWeb/Pages/Orders/OrderDetails.razor.rz.scp.css */
#create-order-container[b-4f9bwihtj3] {
    width: 100%;
    height: 98%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    overflow-y: scroll;
}

#order-details-back-top[b-4f9bwihtj3] {
    align-self: flex-start;
    padding: 0.5em 0;
}

/*
    PREVIEW STYLE
*/

#preview[b-4f9bwihtj3] {
    height: auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    padding: 1em;
    border-radius: 0.5em;
}

    #preview #order-preview[b-4f9bwihtj3] {
        background: white;
        height: auto;
        width: 100%;
        display: flex;
        flex-direction: column;
        border-radius: 0.5em;
        margin-bottom: 2em;
    }

.checkmark-top[b-4f9bwihtj3], .checkmark-bottom[b-4f9bwihtj3] {
    display: flex;
    justify-content: center;
    background: #70bc64;
    width: 100%;
    border-top-left-radius: 0.5em;
    border-top-right-radius: 0.5em;
    padding: 0.5em 0;
    height: 2em;
}

#upper-bar[b-4f9bwihtj3] {
    width: 100%;
    height: auto;
    border-radius: 1em;
    margin-bottom: 1em;
    padding: 0.5em 1em;
    display: flex;
    align-items: center;
    justify-content: center;
    background:rgba(13, 110, 253, 0.3) 
}


input:not([type="checkbox"])[b-4f9bwihtj3], select[b-4f9bwihtj3] {
    width: 100%;
    position: relative;
    background: #C2D7BF;
}

.quantity input[b-4f9bwihtj3] {
    text-align: center;
}

#preview #order-preview .checkmark-bottom[b-4f9bwihtj3] {
    border-radius: 0;
    border-bottom-left-radius: 0.5em;
    border-bottom-right-radius: 0.5em;
}

        #preview #order-preview #header[b-4f9bwihtj3] {
            width: 100%;
            display: flex;
            justify-content: space-between;
            border-bottom: 0.1em solid lightgrey;
            padding: 2em;           
        }

            #preview #order-preview #header .group[b-4f9bwihtj3] {
                display: flex;
                flex-direction: column;
            }

        #preview #order-preview #body[b-4f9bwihtj3] {
            padding: 2em;
            width: 100%;
        }

    #preview .info[b-4f9bwihtj3] {
        display: flex;
        flex-direction: column;
        margin-bottom: 0.5em;
    }

    #preview .right[b-4f9bwihtj3] {
        align-items: end;
    }

    #preview .info label[b-4f9bwihtj3] {
        font-family: 'Ubuntu-Light'
    }

    #preview .info span[b-4f9bwihtj3] {
        font-family: 'Ubuntu-Medium';
        font-size: 1.1em;
    }

#bulk-close-bar[b-4f9bwihtj3] {
    display: flex;
    justify-content: flex-start;
    padding: 0.5em 1em 0;
}

/* Tabela artikala: isto zaglavlje i redovi kao ostale liste dizajn sistema. */
#preview-articles-list[b-4f9bwihtj3] {
    width: 100%;
    padding: var(--ar-space-4) 0;
}

    #preview-articles-list ul[b-4f9bwihtj3] {
        width: 100%;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        border: 1px solid var(--ar-border);
        border-radius: var(--ar-radius-md);
        overflow: hidden;
    }

        #preview-articles-list ul li[b-4f9bwihtj3] {
            width: 100%;
            margin: 0;
            list-style-type: none;
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: var(--ar-space-2);
            min-height: 3.25rem;
            padding: var(--ar-space-2) var(--ar-space-4);
            border-bottom: 1px solid var(--ar-border-subtle);
            color: var(--ar-text);
            position: relative;
            transition: background-color var(--ar-dur-fast) var(--ar-ease);
        }

            #preview-articles-list ul li:last-child[b-4f9bwihtj3] {
                border-bottom: none;
            }

            #preview-articles-list ul li:not(.header):hover[b-4f9bwihtj3] {
                background: var(--ar-bg-hover);
            }

            #preview-articles-list ul li label[b-4f9bwihtj3] {
                width: 15%;
                margin: 0;
                word-wrap: break-word;
                position: relative;
            }

            #preview-articles-list ul li .row-number[b-4f9bwihtj3] {
                width: 4%;
                text-align: center;
                white-space: nowrap;
                color: var(--ar-text-muted);
            }

            #preview-articles-list ul li .select-col[b-4f9bwihtj3] {
                width: 10%;
                display: flex;
                align-items: center;
                justify-content: center;
                padding: 0;
            }

            #preview-articles-list ul .header .select-col-header[b-4f9bwihtj3] {
                width: 10%;
                display: flex;
                align-items: center;
                justify-content: center;
            }

            #preview-articles-list ul .header .select-all-btn[b-4f9bwihtj3] {
                min-height: 0;
                height: 1.75rem;
                padding: 0 var(--ar-space-3);
                font-family: var(--ar-font);
                font-weight: var(--ar-fw-medium);
                font-size: var(--ar-fs-xs);
                color: var(--ar-text);
                background: var(--ar-bg-surface);
                border: 1px solid var(--ar-border-strong);
                border-radius: var(--ar-radius-pill);
                text-decoration: none;
                white-space: nowrap;
            }

                #preview-articles-list ul .header .select-all-btn:hover[b-4f9bwihtj3] {
                    border-color: var(--ar-primary);
                    color: var(--ar-primary-text);
                    text-decoration: none;
                }

        #preview-articles-list ul .header[b-4f9bwihtj3] {
            min-height: 3rem;
            background: var(--ar-bg-head);
            border-bottom: 1px solid var(--ar-border-strong);
            font-family: var(--ar-font);
            font-weight: var(--ar-fw-medium);
            font-size: var(--ar-fs-md);
        }

            #preview-articles-list ul .header .row-number[b-4f9bwihtj3] {
                color: var(--ar-text);
            }

        #preview-articles-list ul li .quantity[b-4f9bwihtj3] {
            width: 7%;
            text-align: center;
            font-variant-numeric: tabular-nums;
        }

        #preview-articles-list ul li .amount[b-4f9bwihtj3] {
            width: 11%;
            text-align: right;
            font-variant-numeric: tabular-nums;
            font-weight: var(--ar-fw-medium);
        }

        #preview-articles-list ul .header .amount[b-4f9bwihtj3] {
            font-weight: var(--ar-fw-medium);
        }

        #preview-articles-list ul li .date[b-4f9bwihtj3] {
            width: 11%;
            display: flex;
            justify-content: center;
            position: relative;
            text-align: center;
            font-variant-numeric: tabular-nums;
        }

        #preview-articles-list ul li .article-status[b-4f9bwihtj3] {
            width: 18%;
        }

        #preview-articles-list ul li .supplier[b-4f9bwihtj3]{
            width: 12%;
            text-align: center;
        }

        #preview-articles-list ul li .surface-treatment[b-4f9bwihtj3] {
            width: 12%;
            text-align: center;
        }

        #preview-articles-list ul li .drawing-name[b-4f9bwihtj3] {
            color: var(--ar-primary-text);
            font-weight: var(--ar-fw-medium);
            text-decoration: none;
            cursor: pointer;
        }

            #preview-articles-list ul li .drawing-name:hover[b-4f9bwihtj3] {
                text-decoration: underline;
            }

        #preview-articles-list ul li .drawing-name .supplier-order-badge[b-4f9bwihtj3] {
            display: inline-flex;
            align-items: center;
            gap: 0.35em;
            margin-left: 0.5em;
            padding: 0.15em 0.6em;
            border-radius: var(--ar-radius-pill);
            background: var(--ar-navy-100);
            color: var(--ar-text);
            text-decoration: none;
            cursor: default;
            font-size: var(--ar-fs-xs);
            font-weight: var(--ar-fw-medium);
            vertical-align: middle;
            white-space: nowrap;
        }

        #total[b-4f9bwihtj3] {
            display: flex;
            flex-direction: column;
            align-items: end;
            padding-right: 1em;
            font-size: 1.2em;
        }

    #total label[b-4f9bwihtj3] {
        font-family: 'Ubuntu-Light';
    }

    #total span[b-4f9bwihtj3] {
        font-family: 'Ubuntu-Bold';
        color: #198754;
    }

#order-note[b-4f9bwihtj3] {
    margin-top: 1em;
    margin-bottom: 1.5em;
    padding: 0.8em 1em;
    border-left: 3px solid var(--ar-primary);
    background: #f0f6fb;
    border-radius: 0.4em;
}

    #order-note label[b-4f9bwihtj3] {
        font-family: 'Ubuntu-Bold';
        color: #14425a;
        font-size: 0.85em;
        margin-bottom: 0.2em;
        display: block;
    }

    #order-note p[b-4f9bwihtj3] {
        margin: 0;
        color: #14425a;
        white-space: pre-wrap;
    }

#statuses[b-4f9bwihtj3]{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

#statuses button[b-4f9bwihtj3] {
    margin-left: auto;
    margin-right: 1em;
}

.progresses[b-4f9bwihtj3] {
    height: 100%;
    padding: 2em;
    display: flex;
    align-items: center;
    font-family: 'Ubuntu-Bold';
    justify-content: center;
    position: relative;
}

.line[b-4f9bwihtj3] {
    width: 10em;
    height: 0.3em;
    background: #70bc64;
    margin-left: 0.1em;
}

.steps[b-4f9bwihtj3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 2em;
    height: 2em;
    border-radius: 50%;
    background-color: #70bc64;
}

    .steps span[b-4f9bwihtj3] {
        font-size: 1.1em;
        color: #fff;
    }

    .steps img[b-4f9bwihtj3] {
        width: 2em;
        height: 2em;
        background: white;
        border-radius: 50%;
    }

    .steps label[b-4f9bwihtj3] {
        color: #70bc64;
        display: flex;
        justify-content: center;
        width: auto;
        position: absolute;
        bottom: 0;
    }

.not-achieved[b-4f9bwihtj3] {
    background-color: lightgrey;
    color: lightgrey;
}

    .not-achieved label[b-4f9bwihtj3] {
        color: lightgrey;
    }

.article-status[b-4f9bwihtj3] {
    text-align: center;
}

    .article-status span[b-4f9bwihtj3] {
        display: inline-flex;
        align-items: center;
        gap: 0.4em;
        width: auto;
        padding: 0.3em 0.75em;
        border-radius: var(--ar-radius-pill);
        background: var(--ar-gray-200);
        color: var(--ar-gray-600);
        font-weight: var(--ar-fw-medium);
        font-size: var(--ar-fs-sm);
        text-align: center;
    }

        .article-status span img[b-4f9bwihtj3] {
            width: 1.1em;
            height: 1.1em;
        }

.article-order-created span[b-4f9bwihtj3] {
    background: var(--ar-gray-200);
    color: var(--ar-gray-600);
}

.article-order-in-progress span[b-4f9bwihtj3] {
    background: var(--ar-blue-100);
    color: var(--ar-blue-700);
}

.article-order-finished span[b-4f9bwihtj3] {
    background: var(--ar-green-100);
    color: var(--ar-green-700);
}

#send-articles-to-control[b-4f9bwihtj3] {
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: center;
}

    #send-articles-to-control #send-articles-to-control_label[b-4f9bwihtj3] {
        font-size: 1.1em;
        margin-bottom: 1em;
        font-family: 'Ubuntu-Regular'
    }

    #send-articles-to-control #articles-for-control[b-4f9bwihtj3] {
        width: 100%;
        overflow-y: scroll;
        height: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

        #send-articles-to-control #articles-for-control .article-for-control[b-4f9bwihtj3] {
            width: 50%;
            padding: 0.8em 1.2em;
            display: flex;
            justify-content: start;
            align-items: center;
            border-radius: 1em;
            background: rgba(13, 110, 253, 0.2);
            margin-bottom: 0.5em;
        }

            #send-articles-to-control #articles-for-control .article-for-control div[b-4f9bwihtj3] {
                flex-direction: column;
                display: flex;
                margin-left: 1em;
            }

            #send-articles-to-control #articles-for-control .article-for-control div label[b-4f9bwihtj3] {
                font-family: 'Ubuntu-Medium';
                margin: 0;
            }

            #send-articles-to-control #articles-for-control .article-for-control div span[b-4f9bwihtj3] {
                font-family: 'Ubuntu-Light';
                font-size: 0.7em;
            }

/* Order Confirmation Modal */
[b-4f9bwihtj3] #order-confirmation-modal {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

[b-4f9bwihtj3] #ocm-pickers {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    padding: 1.25rem 1.5rem 1rem;
    flex-shrink: 0;
}

[b-4f9bwihtj3] .ocm-picker-group {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

[b-4f9bwihtj3] .ocm-picker-label {
    font-size: 0.9rem;
    font-weight: 600;
    color: #64748b;
    font-family: var(--font-regular);
    letter-spacing: 0.01em;
}

[b-4f9bwihtj3] .ocm-btn-group {
    display: flex;
    gap: 0.3rem;
    flex-wrap: wrap;
}

[b-4f9bwihtj3] .ocm-btn {
    border: none;
    border-radius: 6px;
    padding: 5px 13px;
    font-size: 0.9rem;
    font-family: var(--font-regular);
    cursor: pointer;
    background: #f1f5f9;
    color: #475569;
    transition: background 0.1s, color 0.1s;
}

[b-4f9bwihtj3] .ocm-btn:hover {
    background: #e2e8f0;
}

[b-4f9bwihtj3] .ocm-btn-active {
    background: #b5ccb3;
    color: #1a3d1a;
}

[b-4f9bwihtj3] .ocm-divider {
    height: 1px;
    background: #e2e8f0;
    flex-shrink: 0;
    margin: 0 1.5rem;
}

[b-4f9bwihtj3] #ocm-articles {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    padding: 1rem 1.5rem 1.25rem;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

[b-4f9bwihtj3] .ocm-articles-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
}

[b-4f9bwihtj3] .som-table-head .som-bulk-discount {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

[b-4f9bwihtj3] .som-bulk-discount input {
    text-transform: none;
    letter-spacing: normal;
    font-weight: 400;
    text-align: center;
}

[b-4f9bwihtj3] .ocm-articles-label {
    font-size: 0.87rem;
    font-weight: 600;
    color: #64748b;
    font-family: var(--font-regular);
}

[b-4f9bwihtj3] .ocm-count-badge {
    font-size: 0.87rem;
    color: #64748b;
    background: #f1f5f9;
    padding: 2px 9px;
    border-radius: 10px;
    font-family: var(--font-regular);
    font-weight: 600;
}

[b-4f9bwihtj3] .ocm-table {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

[b-4f9bwihtj3] .ocm-table-head {
    display: grid;
    grid-template-columns: 1fr 1fr 150px;
    column-gap: 8px;
    padding: 7px 14px;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    flex-shrink: 0;
}

[b-4f9bwihtj3] .ocm-table-head span {
    font-size: 0.87rem;
    font-weight: 700;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    font-family: var(--font-regular);
    margin: 0;
}

[b-4f9bwihtj3] .ocm-table-body {
    overflow-y: auto;
    flex: 1;
    min-height: 0;
    max-height: 260px;
}

[b-4f9bwihtj3] .ocm-table-row {
    display: grid;
    grid-template-columns: 1fr 1fr 150px;
    column-gap: 8px;
    padding: 8px 14px;
    border-bottom: 1px solid #f1f5f9;
    align-items: start;
    background: white;
}

[b-4f9bwihtj3] .ocm-table-row:last-child {
    border-bottom: none;
}

[b-4f9bwihtj3] .ocm-table-row:hover {
    background: #f8fafc;
}

[b-4f9bwihtj3] .ocm-table-head > :nth-child(1),
[b-4f9bwihtj3] .ocm-table-head > :nth-child(2),
[b-4f9bwihtj3] .ocm-table-row > :nth-child(1),
[b-4f9bwihtj3] .ocm-table-row > :nth-child(2) {
    border-right: 1px solid #edf0f3;
    padding-right: 10px;
}

[b-4f9bwihtj3] .ocm-table-row > :nth-child(3) {
    display: flex;
    justify-content: center;
}

[b-4f9bwihtj3] .ocm-drawing-name {
    font-size: 0.87rem;
    color: #334155;
    font-family: var(--font-light);
    overflow-wrap: break-word;
    word-break: break-word;
}

[b-4f9bwihtj3] .ocm-article-name {
    font-size: 0.87rem;
    color: #334155;
    font-family: var(--font-light);
    overflow-wrap: break-word;
    word-break: break-word;
}

[b-4f9bwihtj3] .ocm-date-input {
    border: 1px solid #d1d5db;
    border-radius: 6px;
    padding: 5px 8px;
    font-size: 0.87rem;
    color: #334155;
    background: white;
    font-family: var(--font-light);
    width: auto;
    outline: none;
}

[b-4f9bwihtj3] .ocm-date-input:focus {
    border-color: #93c5fd;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.15);
}

/* Supplier Order Modal */
[b-4f9bwihtj3] #supplier-order-modal {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

[b-4f9bwihtj3] #som-pickers {
    display: grid;
    grid-template-columns: 1.3fr 1fr 1fr;
    gap: 1.25rem;
    padding: 1.25rem 1.5rem 1rem;
    flex-shrink: 0;
}

[b-4f9bwihtj3] #som-articles {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    padding: 1rem 1.5rem 1.25rem;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

[b-4f9bwihtj3] .som-table-head {
    display: grid;
    grid-template-columns: 2em 1fr 3em 6.5em 5em 6.5em 6.5em 8.5em;
    column-gap: 8px;
    padding: 7px 14px;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    flex-shrink: 0;
    align-items: center;
}

[b-4f9bwihtj3] .som-table-head span {
    font-size: 0.8rem;
    font-weight: 700;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-family: var(--font-regular);
    margin: 0;
    text-align: center;
}

[b-4f9bwihtj3] .som-table-row {
    display: grid;
    grid-template-columns: 2em 1fr 3em 6.5em 5em 6.5em 6.5em 8.5em;
    column-gap: 8px;
    padding: 8px 14px;
    border-bottom: 1px solid #f1f5f9;
    align-items: center;
    background: white;
}

[b-4f9bwihtj3] .som-table-row:last-child {
    border-bottom: none;
}

[b-4f9bwihtj3] .som-table-row:hover {
    background: #f8fafc;
}

[b-4f9bwihtj3] .som-table-row span {
    text-align: center;
    font-size: 0.87rem;
    color: #334155;
    font-family: var(--font-light);
}

[b-4f9bwihtj3] .som-table-row .ocm-drawing-name {
    text-align: left;
}

[b-4f9bwihtj3] .som-table-empty {
    padding: 1.5em;
    text-align: center;
    font-size: 0.87rem;
    color: #94a3b8;
    font-family: var(--font-light);
}

[b-4f9bwihtj3] .som-table-row input[type="number"] {
    width: 100%;
    text-align: center;
}

[b-4f9bwihtj3] #som-total {
    display: flex;
    flex-direction: column;
    align-items: end;
    padding: 0.8em 0.2em 0.2em;
    font-size: 1.1em;
    flex-shrink: 0;
}

[b-4f9bwihtj3] #som-total label {
    font-family: 'Ubuntu-Light';
}

[b-4f9bwihtj3] #som-total span {
    font-family: 'Ubuntu-Bold';
    color: #198754;
}
/* _content/ArasWeb/Pages/Orders/OrderDetailsPerModule.razor.rz.scp.css */
#create-order-container[b-p9lbrml4zm] {
    width: 100%;
    height: 98%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    overflow-y: scroll;
}

/*
    PREVIEW STYLE
*/

#preview[b-p9lbrml4zm] {
    height: auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    padding: 1em;
    border-radius: 0.5em;
}

    #preview #order-preview[b-p9lbrml4zm] {
        background: white;
        height: auto;
        width: 100%;
        display: flex;
        flex-direction: column;
        border-radius: 0.5em;
        margin-bottom: 2em;
    }

.checkmark-top[b-p9lbrml4zm], .checkmark-bottom[b-p9lbrml4zm] {
    display: flex;
    justify-content: center;
    background: rgba(13, 110, 253, 0.8);
    width: 100%;
    border-top-left-radius: 0.5em;
    border-top-right-radius: 0.5em;
    padding: 0.5em 0;
    height: 2em;
}


input[b-p9lbrml4zm], select[b-p9lbrml4zm] {
    width: 100%;
    position: relative;
    background: #C2D7BF;
}

#preview #order-preview .checkmark-bottom[b-p9lbrml4zm] {
    border-radius: 0;
    border-bottom-left-radius: 0.5em;
    border-bottom-right-radius: 0.5em;
}

#preview #order-preview #header[b-p9lbrml4zm] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    border-bottom: 0.1em solid lightgrey;
    padding: 2em;
}

    #preview #order-preview #header .group[b-p9lbrml4zm] {
        display: flex;
        flex-direction: column;
    }

#preview #order-preview #body[b-p9lbrml4zm] {
    padding: 2em;
    width: 100%;
}

#preview .info[b-p9lbrml4zm] {
    display: flex;
    flex-direction: column;
    margin-bottom: 0.5em;
}

#preview .right[b-p9lbrml4zm] {
    align-items: end;
}

#preview .info label[b-p9lbrml4zm] {
    font-family: 'Ubuntu-Light'
}

#preview .info span[b-p9lbrml4zm] {
    font-family: 'Ubuntu-Medium';
    font-size: 1.1em;
}

#preview-articles-list[b-p9lbrml4zm] {
    width: 100%;
    padding: 1em;
}

    #preview-articles-list ul[b-p9lbrml4zm] {
        width: 100%;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
    }

        #preview-articles-list ul li[b-p9lbrml4zm] {
            width: 100%;
            margin: 0;
            padding: 0;
            list-style-type: none;
            width: 100%;
            display: flex;
            justify-content: space-between;
            align-items: center;
            border-bottom: 0.1em solid lightgrey;
            padding: 0.5em;
            position: relative;
        }

            #preview-articles-list ul li label[b-p9lbrml4zm] {
                width: 20%;
                word-wrap: break-word;
                position: relative;
            }

        #preview-articles-list ul .header[b-p9lbrml4zm] {
            font-family: 'Ubuntu-Bold';
            background: #d1d1d1;
            border-radius: 0.3em;
        }

        #preview-articles-list ul li .row-number[b-p9lbrml4zm] {
            width: 4%;
            text-align: center;
            white-space: nowrap;
        }

        #preview-articles-list ul li .quantity[b-p9lbrml4zm]{
            width: 7%;
            text-align: center;
        }

        #preview-articles-list ul li .drawing-name[b-p9lbrml4zm] {
            width: 12%;
        }

        #preview-articles-list ul li .supplier-val[b-p9lbrml4zm] {
            width: 12%;
        }

        #preview-articles-list ul li .total-quantity[b-p9lbrml4zm],
        #preview-articles-list ul li .quantity-in-module[b-p9lbrml4zm] {
            width: 10%;
            text-align: center;
        }

        #preview-articles-list ul li .amount[b-p9lbrml4zm],
        #preview-articles-list ul li .date[b-p9lbrml4zm] {
            width: 10%;
            text-align: right;
        }

        #preview-articles-list ul li .date[b-p9lbrml4zm] {
            width: 17%;
            display: flex;
            justify-content: end;
            position: relative;
        }

        #preview-articles-list ul li .show-details-btn[b-p9lbrml4zm]{
            width: 10em;
            font-size: 0.8em !important;
        }

        #preview-articles-list ul li .show-details-btn i[b-p9lbrml4zm] {
            margin-right: 0.3em;
        }

        #preview-articles-list ul li .details[b-p9lbrml4zm]{
            width: 25%;
            display: flex;
            flex-direction: column;
            word-break: break-all;
        }

.operations-list[b-p9lbrml4zm] {
    height: 15em;
    overflow-y: scroll;
}

.position-progress[b-p9lbrml4zm] {
    margin-bottom: 0.5em;
}

.details-row[b-p9lbrml4zm] {
    display: flex;
    flex-direction: column;
    align-items: start;
    margin-bottom: 0.5em;
    background: rgba(13, 110, 253, 0.3);
    padding: 0.2em 0.8em;
    border-radius: 1em;
}

    .details-row .op-name[b-p9lbrml4zm] {
        font-size: 0.8em;
        font-family: 'Ubuntu-Bold';
        font-weight: bold;
    }

    .details-row .op-desc[b-p9lbrml4zm] {
        font-size: 0.7em;
        margin-top: 0.5em;
    }

#preview-articles-list ul li .details .details-row-to-do[b-p9lbrml4zm] {
    background-color: #e9ecef;
    color: #6c757d;
    opacity: 0.6;
}

#preview-articles-list ul li .details .details-row-in-progress[b-p9lbrml4zm] {
    background-color: #cfe2ff;
    color: #084298;
}

#preview-articles-list ul li .details .details-row-completed[b-p9lbrml4zm] {
    background-color: #d1f2d6; 
    color: #1e4620;
}

#btns[b-p9lbrml4zm] {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-top: 1em;
}


.article-status[b-p9lbrml4zm] {
    text-align: center;
}

    .article-status span[b-p9lbrml4zm] {
        border-radius: 2em;
        text-align: center;
        width: auto;
        display: inline-flex;
        padding: 0.3em 1.5em;
        word-break: break-all;
        font-family: 'Ubuntu-Medium';
        font-size: 0.8em;
    }

        .article-status span img[b-p9lbrml4zm] {
            width: 1.2em;
            height: 1.2em;
            margin-right: 0.5em;
        }


.article-order-created span[b-p9lbrml4zm] {
    background: rgba(236, 236, 236, 0.8);
}

.article-order-in-progress span[b-p9lbrml4zm] {
    background-color: #cfe2ff; 
}

.article-order-finished span[b-p9lbrml4zm] {
    background: rgba(205, 254, 194, 0.8);
}

.article-disabled-for-me label[b-p9lbrml4zm]{
    opacity: 0.5;
}

.article-disabled-for-me[b-p9lbrml4zm] {
    background: #f5f5f5;
}

.article-disabled-for-me button[b-p9lbrml4zm] {
    background: white;
}

.article-disabled-for-me .article-status span[b-p9lbrml4zm] {
    border: 0.01em solid black;
}

.taken[b-p9lbrml4zm] {
    font-size: 0.9em;
    font-family: 'Ubuntu-Medium';
    padding: 0.3em 0.8em;
    background: lightgray;
    border-radius: 1em;
    border: 0.1em solid #d9534f;
    color: #d9534f;
}

.taken i[b-p9lbrml4zm] {
    margin-right: 0.3em;
}

.btn-outline-primary:hover[b-p9lbrml4zm] {
    background:var(--ar-primary-hover)
}

#order-module-note[b-p9lbrml4zm] {
    margin: 1em 2em 0 2em;
    padding: 0.8em 1em;
    border-left: 3px solid var(--ar-primary);
    background: #f0f6fb;
    border-radius: 0.4em;
}

    #order-module-note label[b-p9lbrml4zm] {
        font-family: 'Ubuntu-Bold';
        color: #14425a;
        font-size: 0.85em;
        margin-bottom: 0.2em;
        display: block;
    }

    #order-module-note p[b-p9lbrml4zm] {
        margin: 0;
        color: #14425a;
        white-space: pre-wrap;
    }

/* Inspekcija prvog komada: dva reda istog naloga, /1 i /2. */
#preview-articles-list ul li .drawing-name .first-article-label[b-p9lbrml4zm] {
    display: block;
    font-family: var(--font-medium);
    font-size: 0.85em;
    color: var(--color-icon-accent);
}

#preview-articles-list ul li.first-article-locked[b-p9lbrml4zm] {
    background: var(--color-bg-main);
}

    #preview-articles-list ul li.first-article-locked label[b-p9lbrml4zm] {
        color: var(--color-text-muted);
    }
/* _content/ArasWeb/Pages/Planning/BuyerPlanInput.razor.rz.scp.css */
#buyer-plan-creation[b-xggr33qsp5] {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
    overflow-y: scroll;
}

#buyer-plan-form[b-xggr33qsp5] {
    width: 80%;
    padding: 1em;
    border-radius: 1em;
    background: white;
}

.buyer-plan-input[b-xggr33qsp5] {
    padding: 0 1em !important;
}

.plan-group-details[b-xggr33qsp5] {
    padding: 1em;
}

.plan-group-item-wrapper[b-xggr33qsp5] {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1em;
}

.plan-group-item[b-xggr33qsp5] {
    width: 28%;
}

.plan-group-item-quarterly[b-xggr33qsp5] {
    width: 60%;
    display: flex;
    align-items: center;
}

.plan-group-label[b-xggr33qsp5] {
    font-family: var(--font-medium) !important;
    font-size: 1.2em !important;
}

.plan-group[b-xggr33qsp5] {
    display: flex;
    flex-direction: column;
    padding-bottom: 1em;
    border-bottom: 0.1em solid lightgray;
    margin-top: 1em;
}

    .plan-group button[b-xggr33qsp5] {
        align-self: end;
        font-family: var(--font-bold);
        padding: 0.4em 0.8em;
        border-radius: 0.4em;
    }

.no-plan-data-label[b-xggr33qsp5] {
    font-family: var(--font-light) !important;
    font-size: 0.8em;
    color: gray;
    font-style: italic
}

.remove-btn[b-xggr33qsp5] {
    color: var(--color-danger);
    cursor: pointer;
}

.create-or-alter-plan-btn[b-xggr33qsp5] {
    margin-left: auto;
    margin-top: 1em;
}

.weekly-planned-amount[b-xggr33qsp5] {
    display: flex;
    justify-content: space-between;
    padding: 1em;
    align-items: end;
}

    .weekly-planned-amount div[b-xggr33qsp5] {
        width: 30%;
    }

    .weekly-planned-amount i[b-xggr33qsp5] {
        margin-right: 0.5em;
    }


.buttons[b-xggr33qsp5] {
    padding: 1em;
    margin-top: 1em;
    display: flex;
    justify-content: space-between;
    width: 100%;
}
/* _content/ArasWeb/Pages/Planning/BuyerPlansOverview.razor.rz.scp.css */
#buyers-container[b-3aayhx39o4] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.buyers-list-container .list-header[b-3aayhx39o4] {
    background: rgba(13, 110, 253, 0.1);
}

.buyers-list-container[b-3aayhx39o4] {
    background: white;
    border-radius: 0.5em;
    width: 100%;
    height: 85%;
}

#buyers-list[b-3aayhx39o4] {
    width: 100%;
}

#buyers-container .item-details[b-3aayhx39o4] {
    text-align: left;
    width: 85%;
}

#buyers-container .item-details label[b-3aayhx39o4] {
    text-align: left;
    word-break: break-all;
}
/* _content/ArasWeb/Pages/Planning/BuyersDashboard.razor.rz.scp.css */
#wrapper[b-14ymcgbfl1] {
    width: 100%;
    height: 100%;
    overflow-y: scroll;
}

#wrapper header[b-14ymcgbfl1] {
    display: flex;
    justify-content: space-between;
}

#wrapper header a[b-14ymcgbfl1]{
    font-family: 'Ubuntu-Bold'
}

#statistics[b-14ymcgbfl1] {
    height: auto;
}

#time-period-numbers[b-14ymcgbfl1] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: start;
    margin: 1em 0;
}

.time-period-data[b-14ymcgbfl1]{
    /* width: 30%*/
    width: 49%;
    height: 100%;
    min-height: 20em;
    background: white;
    padding: 2em;
    border-radius: 1em;
}

    .time-period-data .data-type[b-14ymcgbfl1] {
        font-family: 'Ubuntu-Medium';
        width: 100%;
        margin-bottom: 1em;
        color: #054463;
        font-size: 1.5em;
    }

    .time-period-data .completed-amount[b-14ymcgbfl1] {
        font-family: 'Ubuntu-Bold';
        width: 100%;
        margin: 1em 0;
        color: #054463;
        font-size: 1.6em;
        margin-bottom: 1.5em;
    }

    .time-period-data .additional-data[b-14ymcgbfl1] {
        font-family: 'Ubuntu-Light';
        font-size: 0.85em;
    }

    .progress-bar-box[b-14ymcgbfl1] {
        width: 100%;
    }

    .progress-bar-line[b-14ymcgbfl1] {
        width: 100%;
        height: 1em;
        background: lightgray;
        display: block;
        border-radius: 1em;
        margin-top: 1em;
    }

        .progress-bar-line div[b-14ymcgbfl1] {
            height: 1em;
            background: #547c8c;
            border-radius: 1em;
        }

.low .progress-bar-line div[b-14ymcgbfl1] {
    background: #d9534f
}

.medium .progress-bar-line div[b-14ymcgbfl1] {
    background: #5bc0de
}

.low .metrics-label[b-14ymcgbfl1] {
    color: #d9534f;
    font-family: 'Ubuntu-Bold'
}

.medium .metrics-label[b-14ymcgbfl1] {
    color: #5bc0de;
    font-family: 'Ubuntu-Bold'
}

.time-period-data .numbers[b-14ymcgbfl1] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    font-size: 0.9em;
    font-family: 'Ubuntu-Light'
}

.time-period-data .buyers-count[b-14ymcgbfl1], .realized[b-14ymcgbfl1], .no-plan-created[b-14ymcgbfl1] {
    font-family: 'Ubuntu-Medium';
    color: #054463;
    width: 100%;
    margin-top: 1em;
}

.additional-info[b-14ymcgbfl1] {
    font-family: 'Ubuntu-Medium';
    color: #054463;
    width: 100%;
}

.realized[b-14ymcgbfl1] {
    color: var(--ar-primary);
    font-family: 'Ubuntu-Bold';
    font-size: 1.1em;
}

.realized-box[b-14ymcgbfl1] {
    background: rgba(2, 117, 216, 0.1)
}

.no-plan-created[b-14ymcgbfl1] {
    font-family: 'Ubuntu-Bold';
    font-size: 1em;
    color: #d9534f
}

.time-period-data .comparison[b-14ymcgbfl1] {
    font-size: 0.9em;
    font-family: 'Ubuntu-Light';
    margin-top: 0.5em;
}

time-period-data i[b-14ymcgbfl1] {    
    margin-right: 0.5em;
}
.positive-value i[b-14ymcgbfl1], .positive-value span[b-14ymcgbfl1] {
    color: var(--ar-primary);
    font-weight: bold;
}

.negative-value i[b-14ymcgbfl1], .negative-value span[b-14ymcgbfl1] {
    color: #d9534f;
    font-weight: bold;
}

.no-change-value i[b-14ymcgbfl1], .no-change-value span[b-14ymcgbfl1] {
    color: #5cb85c;
    font-weight: bold;
}

#custom-charts[b-14ymcgbfl1] {
    width: 100%;
    height: auto;
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    padding: 1em;
    border-radius: 1em;
    margin-bottom: 1em;
}


.chart[b-14ymcgbfl1] {
    width: 49%;
    margin-bottom: 1em;
    margin-top: .5em;
    height: auto;
}

.overall-chart[b-14ymcgbfl1] {
    width: 60% !important;
    justify-self: center;
    margin-left: 20%;
    margin-right: 20%
}

.pie-chart[b-14ymcgbfl1] {
    width: 49%;
}

#ordered-vs-planned-chart[b-14ymcgbfl1] {
    width: 49%;
    margin: 0;
}

.chart-container[b-14ymcgbfl1] {
    width: 100%;
    position: relative;
    background: white;
    padding: 1em;
    border-radius: 1em;
}

#charts[b-14ymcgbfl1] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

#custom-charts #filters[b-14ymcgbfl1] {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    background: white;
    padding: 1em;
    border-radius: 1em;
    font-size: 0.9em;
}

#custom-charts #filters .filter[b-14ymcgbfl1] {
    height: auto;
    width: 30%;
    position: relative;
    margin-top: .8em;
}

#custom-charts #selecting-buyer[b-14ymcgbfl1] {
    width: 100%;
    position: relative;
}

#custom-charts #data[b-14ymcgbfl1] {
    width: 100%;
    display: flex;
    height: auto;
    flex-direction: column;
}

#multiselect-filter[b-14ymcgbfl1] {
    position: relative;
    cursor: pointer;
}

    #multiselect-filter #available-options[b-14ymcgbfl1] {
        position: absolute;
        background: white;
        border: 0.1em solid gray;
        z-index: 9999;
        border-radius: .5em;
        cursor: pointer;
        height: 25em;
        width: 30em;
        display: flex;
        flex-direction: column;
        padding: 0.8em;
    }

        #multiselect-filter #available-options .available-opt-list[b-14ymcgbfl1] {
            display: flex;
            position: relative;
            flex-direction: column;
            height: 85%;
            padding: 1em;
            overflow-y: scroll;
        }

        #multiselect-filter #available-options .available-opt[b-14ymcgbfl1] {
            margin: 0.3em 0;
            border-bottom: 0.05em solid lightgray;
            display: flex;
            justify-content: space-between;
            align-items: center;
            width: 100%;
        }

    #multiselect-filter #available-options #buttons[b-14ymcgbfl1] {
        width: 100%;
        display: flex;
        justify-content: space-between;
        border-bottom: 0.1em solid lightgray;
        padding: 0.5em;
        height: 15%;
    }

    #multiselect-filter #available-options #buttons .reset-all[b-14ymcgbfl1]{
        background: transparent;
        border: none;
        color: darkgray;
        text-decoration: underline;
        padding: 0;
    }

        #multiselect-filter #available-options .available-opt .checkbox[b-14ymcgbfl1] {
            width: 1em;
            height: 100%;
            display: block;
            cursor: pointer;
        }

        #multiselect-filter #available-options .available-opt label[b-14ymcgbfl1] {
            text-align: left;
            width: 85%;
        }



#area-chart-wrapper[b-14ymcgbfl1] {
    width: 80%;
    background: white;
    border-radius: 1em;
    padding: 1em;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-self: center;
    margin: 0 10%;
    margin-top: 1em;
}

#area-chart-wrapper .chart[b-14ymcgbfl1] {
    width: 90%;
}

    #area-chart-wrapper #buyer-selector-filter[b-14ymcgbfl1]{
        width: auto;
        padding: 1em;
        margin-bottom: 1em;
        padding-right: 15em;
    }

    #area-chart-wrapper #buyer-selector-filter p[b-14ymcgbfl1] {
        font-style: italic;
    }

        #area-chart-wrapper #buyer-selector-filter label[b-14ymcgbfl1] {
           margin-bottom: .5em;
        }


#generate-pdf[b-14ymcgbfl1] {
    font-family: 'Ubuntu-Medium';
    border: 0.01em solid gray;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
}

    #generate-pdf img[b-14ymcgbfl1] {
        width: 1.5em;
        height: 1.5em;
        margin-right: 0.5em;
    }
/* _content/ArasWeb/Pages/Planning/BuyersPlanDetails.razor.rz.scp.css */
#buyer-plan-details-wrapper[b-aixuuk1s5r] {
    width: 100%;
    height: 100%;
    overflow-y: scroll;
}

h4[b-aixuuk1s5r] {
    text-align: center;
}

#buyer-plan-details[b-aixuuk1s5r] {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center
}

#buyer-details[b-aixuuk1s5r] {
    width: 65%;
    background: white;
    border-radius: 1em;
    padding: 1em 3em;
    display: flex;
    justify-content: space-between;
    margin-bottom: 1em;
}

.buyer-details-box[b-aixuuk1s5r]{
    display: flex;
    flex-direction: column;
}

.buyer-details-box label[b-aixuuk1s5r] {
    font-family: 'Ubuntu-Medium';
    font-size: 1.2em;
}

    .buyer-details-box span[b-aixuuk1s5r] {
        font-family: 'Ubuntu-Light';
        font-size: 0.9em;
    }

#plans[b-aixuuk1s5r] {
    width: 65%;
    height: 90%;
    background: white;
    border-radius: 1em;
    padding: 1em;
    display: flex;
    flex-direction: column;
}

#plans-list[b-aixuuk1s5r] {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 1em;
}

.plan-param[b-aixuuk1s5r] {
    display: flex;
    flex-direction: column;
    border-right: 0.06em solid lightgray;
    width: 50%;
    padding: 0.5em;
}

.plan-row[b-aixuuk1s5r] {
    width: 100%;
    display: flex;
    border: 0.06em solid lightgray;
}

.plan-param span[b-aixuuk1s5r] {
    font-family: 'Ubuntu-Light';
    font-size: 0.85em;
}

#year-tabs[b-aixuuk1s5r] {
    width: 100%;
    height: auto;
    display: flex;
    justify-content: space-evenly;
    background: #ededed;
    border-radius: 0.5em;
    margin: 1em 0;
    color: white;
}

    #year-tabs label[b-aixuuk1s5r] {
        padding: 0.8em;
        cursor: pointer;
        border-radius: 0.5em;
    }

.selected-year[b-aixuuk1s5r] {
    background: rgba(4, 52, 76, 0.5) !important;
    color: white;
    font-family: 'Ubuntu-Bold';
}

.offer-info[b-aixuuk1s5r] {
    font-size: 0.8em !important;
    display: flex;
    justify-content: start;
    align-items: center;
    background: rgba(2, 117, 216, 0.2);
    padding: 0 0.3em;
    border-radius: 0.5em;
}

.offer-info button[b-aixuuk1s5r] {
    outline: none;
    background: transparent;
    border: none;
    padding: 0;
    color: var(--ar-primary);
    font-family: 'Ubuntu-Regular';
    text-decoration: underline;
    margin-left: 0.3em;
}

.create-or-alter-plan-btn[b-aixuuk1s5r] {
    margin-left: auto;
}
/* _content/ArasWeb/Pages/Planning/Menu.razor.rz.scp.css */
#wrapper[b-meqj7gvd8u] {
    width: 100%;
    height: 100%;
}

#menu[b-meqj7gvd8u] {
    width: 100%;
    height: 95%;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
}


.menu-item[b-meqj7gvd8u] {
    width: 30%;
    background: white;
    margin: 1em 0;
    padding: 1em 2em;
    border-radius: 1em;    
    color: var(--color-sidebar-start);
    cursor: pointer;
    border: 0.1em solid lightgray;
}

    .menu-item label[b-meqj7gvd8u] {
        width: 100%;
        text-transform: uppercase;
        font-family: var(--font-bold);
        font-size: 1.3em;
        text-align: center;
    }

    .menu-item:hover[b-meqj7gvd8u] {
        background: rgba(4, 52, 76, 0.2);
        cursor: pointer;
    }

    .disabled[b-meqj7gvd8u] {
        opacity: 0.5;
        cursor: default;
    }

    .disabled:hover[b-meqj7gvd8u] {
        background: transparent;
        cursor: not-allowed
    }

.menu-item ul[b-meqj7gvd8u] {
    width: 100%;
    margin-top: 1em;
    list-style-type: none;
}

.menu-item ul li[b-meqj7gvd8u] {
    color: #0071c1
}

.menu-item ul li a[b-meqj7gvd8u] {
   text-decoration: none;
}

    .menu-item ul li a:hover[b-meqj7gvd8u] {
        text-decoration: underline;
    }
/* _content/ArasWeb/Pages/PreCutting/PreCutting.razor.rz.scp.css */
#pre-cutting[b-zna40falgf] {
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

#pre-cutting-container[b-zna40falgf] {
    width: 100%;
    height: auto;
    min-height: 90%;
    background: var(--color-bg-card);
    border-radius: 1em;
    padding: 1em;
}

.header-row[b-zna40falgf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);
}

    .header-row h3[b-zna40falgf] {
        font-family: var(--font-medium);
        color: var(--color-text-dark);
        font-size: 1.15em;
        margin: 0;
    }

#print-btn[b-zna40falgf] {
    flex-shrink: 0;
    background: var(--color-primary);
    border: 1px solid var(--color-primary-border);
    color: white;
    gap: 0.5em;
}

    #print-btn:disabled[b-zna40falgf] {
        opacity: 0.5;
    }

.description[b-zna40falgf] {
    font-family: var(--font-light);
    color: var(--color-text-muted);
    font-size: 0.88em;
    margin: 0.4em 0 var(--space-md) 0;
    max-width: 60em;
}

#pre-cutting-list[b-zna40falgf] {
    width: 100%;
}

/* Širine kolona — struktura liste dolazi iz site.css, kao i u Narudžbama. */
.material[b-zna40falgf], .dimension[b-zna40falgf] {
    width: 16%;
    word-break: break-word;
}

.order-no[b-zna40falgf], .drawing[b-zna40falgf] {
    width: 13%;
    word-break: break-all;
}

.work-order[b-zna40falgf] {
    width: 9%;
    text-align: center;
}

.qty[b-zna40falgf] {
    width: 7%;
    text-align: center;
}

.due-date-box[b-zna40falgf] {
    width: 12%;
}

#cutting-entry-body[b-zna40falgf] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-lg);
}

.entry-summary[b-zna40falgf] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-md);
    background: var(--color-bg-main);
    border-radius: var(--space-sm);
    padding: var(--space-md);
}

    .entry-summary label[b-zna40falgf] {
        display: block;
        font-family: var(--font-medium);
        color: var(--color-text-dark);
    }

    .entry-summary span[b-zna40falgf] {
        font-family: var(--font-light);
        color: var(--color-text-muted);
        font-size: 0.82em;
    }

/* Napomena je textarea: fiksna visina i bez hvataljke za razvlačenje, da unos
   ne pomjera dugmad modala. Duži tekst dobija scroll. */
.entry-field textarea.form-control[b-zna40falgf] {
    resize: none;
    overflow-y: auto;
    min-height: 4.5em;
}

.entry-field label[b-zna40falgf] {
    display: block;
    font-family: var(--font-light);
    color: var(--color-text-muted);
    font-size: 0.88em;
    margin-bottom: 0.25em;
}
/* _content/ArasWeb/Pages/Prices/PriceList.razor.rz.scp.css */
#tab-container[b-w49zpx4q5r] {
    width: 100%;
    height: 92%;
    display: flex;
    flex-direction: column;
    background: white;
    border-radius: 1em;
    padding: 1em;
}

.list-wrapper[b-w49zpx4q5r] {
    height: 95%;
}

.item-details[b-w49zpx4q5r] {
    width: 90%;
}


.list .item-details label[b-w49zpx4q5r] {
    font-size: 0.9em;
    text-align: left;
}

.price-item-prop[b-w49zpx4q5r] {
    margin-bottom: 1em;
    display: flex;
    flex-direction: column;
}

.readonly input[b-w49zpx4q5r],
.readonly select[b-w49zpx4q5r] {
    background: lightgray;
    cursor: default;
}

.add-open-modal[b-w49zpx4q5r]{
    justify-self: end;
    margin-left: auto;
    margin-right: 1em;
}

.price-tabs[b-w49zpx4q5r] {
    display: flex;
    gap: 0.5em;
    margin: 0 0.75em 0.75em;
}

.tab-button[b-w49zpx4q5r] {
    border: none;
    background: white;
    padding: 0.4em 1.2em;
    border-radius: 2em;
    font-family: var(--font-medium);
    color: var(--color-muted);
    cursor: pointer;
}

.tab-button.active[b-w49zpx4q5r] {
    background: var(--color-primary);
    color: white;
}

/* _content/ArasWeb/Pages/Reclamations/AddReclamation.razor.rz.scp.css */
#add-defect-container[b-m6okes4j2v] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: center;
    overflow-y: scroll;
}

#add-defect[b-m6okes4j2v] {
    width: 50%;
    height: 90%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.add-defect-form[b-m6okes4j2v] {
    width: 100%;
    background: white;
    padding: 1em;
    border-radius: 1em;
    margin-bottom: 1em;
}

.btn-danger[b-m6okes4j2v] {
    margin-left: auto;
}

.modal-input-box[b-m6okes4j2v] {
    margin-bottom: 0.5em;
    position: relative;
}

    .modal-input-box label[b-m6okes4j2v] {
        margin-bottom: 0.3em;
        font-family: var(--font-light);
        font-size: 0.9em;
    }

#defect-list-header[b-m6okes4j2v] {
    background: rgba(217, 83, 79, 0.2);
}

    #defect-list-header span label[b-m6okes4j2v],
    #defects-list span label[b-m6okes4j2v] {
        width: 15%;
    }

    #defect-list-header .full-text[b-m6okes4j2v],
    #defects-list .full-text[b-m6okes4j2v] {
        word-break: break-all;
        width: 20%;
    }

    #defect-list-header .quantity[b-m6okes4j2v],
    #defects-list .quantity[b-m6okes4j2v] {
        width: 7%;
        text-align: center;
    }

#defects-list span[b-m6okes4j2v] {
    display: inline-flex;
    align-items: center;
}

#defects-list img[b-m6okes4j2v] {
    width: 1.5em;
    height: 1.5em;
    margin-right: 0.5em;
}

.made-by-worker[b-m6okes4j2v] {
    color: var(--color-danger);
    font-family: var(--font-medium);
}

#report-btn[b-m6okes4j2v] {
    margin-bottom: 1em;
    margin-left: auto;
    margin-right: 1em;
}

.fa-person-circle-exclamation[b-m6okes4j2v] {
    margin-right: 0.5em;
}

#price label[b-m6okes4j2v] {
    font-family: var(--font-medium);
}

#price span[b-m6okes4j2v] {
    color: var(--color-danger);
    font-family: var(--font-medium);
    background: #e9ecef;
}

#search-component[b-m6okes4j2v] {
    position: absolute;
    width: 40em;
    height: 20em;
    top: 100%;
    right: 0;
    border-radius: 1em;
    border: 0.1em solid gray;
    padding: 1em;
    background: white;
    z-index: 10000;
}

#close-btn[b-m6okes4j2v] {
    width: 100%;
    display: flex;
    justify-content: end;
}

#search-list-wrapper[b-m6okes4j2v] {
    width: 100%;
    height: 90%;
    overflow-y: scroll;
}

.search-list[b-m6okes4j2v] {
    width: 100%;
    height: auto;
}

    .search-list h6[b-m6okes4j2v] {
        font-family: var(--font-medium);
        background: var(--color-bg-header);
        padding: 0.5em;
        border-radius: .5em;
        margin: 0.5em 0;
    }

.search-item[b-m6okes4j2v] {
    width: 98%;
    position: relative;
    display: flex;
    justify-content: start;
    margin: 0.3em;
    border-bottom: 0.01em solid lightgray;
    padding: 0.3em;
}

.search-item-field[b-m6okes4j2v] {
    width: auto;
    margin-right: 0.8em;
    display: flex;
    flex-direction: column;
    width: 50%;
}

    .search-item-field label[b-m6okes4j2v] {
        font-family: var(--font-medium);
        word-break: break-all;
    }

    .search-item-field span[b-m6okes4j2v] {
        font-family: var(--font-light);
        font-size: 0.8em;
    }

#search-placeholder[b-m6okes4j2v] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    opacity: 0.8;
}

    #search-placeholder i[b-m6okes4j2v] {
        font-size: 6em;
        opacity: 0.7;
        margin-bottom: 0.1em;
    }

    #search-placeholder p[b-m6okes4j2v] {
        color: gray;
    }

.btn-item[b-m6okes4j2v] {
    display: flex;
    justify-content: end;
    align-items: center;
    margin-left: auto;
}

    .btn-item button[b-m6okes4j2v] {
        padding: 0.2em 0.8em;
        border-radius: 0.5em;
    }

.optional[b-m6okes4j2v] {
    font-size: 0.9em;
    font-family: var(--font-italic);
}


#calculated-material-params[b-m6okes4j2v] {
    background: rgba(13, 110, 253, 0.2);
    border-radius: 0.3em;
    padding: 1em;
    display: flex;
    flex-direction: column;
    align-items: end;
    font-size: 1.1rem;
    color: var(--color-text-dark);
    font-family: var(--font-medium);
    margin: 1em 0;
}

    #calculated-material-params div[b-m6okes4j2v] {
        display: flex;
        justify-content: space-between;
        width: 100%;
    }

#buttons[b-m6okes4j2v] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin: 0.8em 0;
}
/* _content/ArasWeb/Pages/Reclamations/EditReclamation.razor.rz.scp.css */
#add-defect-container[b-07c5v91lk4] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: center;
    overflow-y: scroll;
}

#add-defect[b-07c5v91lk4] {
    width: 50%;
    height: 90%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.add-defect-form[b-07c5v91lk4] {
    width: 100%;
    background: white;
    padding: 1em;
    border-radius: 1em;
    margin-bottom: 1em;
}

.btn-danger[b-07c5v91lk4] {
    margin-left: auto;
}

.modal-input-box[b-07c5v91lk4] {
    margin-bottom: 0.5em;
    position: relative;
}

    .modal-input-box label[b-07c5v91lk4] {
        margin-bottom: 0.3em;
        font-family: 'Ubuntu-Light';
        font-size: 0.9em;
    }

#defect-list-header[b-07c5v91lk4] {
    background: rgba(217, 83, 79, 0.2);
}

    #defect-list-header span label[b-07c5v91lk4],
    #defects-list span label[b-07c5v91lk4] {
        width: 15%;
    }

    #defect-list-header .full-text[b-07c5v91lk4],
    #defects-list .full-text[b-07c5v91lk4] {
        word-break: break-all;
        width: 20%;
    }

    #defect-list-header .quantity[b-07c5v91lk4],
    #defects-list .quantity[b-07c5v91lk4] {
        width: 7%;
        text-align: center;
    }

#defects-list span[b-07c5v91lk4] {
    display: inline-flex;
    align-items: center;
}

#defects-list img[b-07c5v91lk4] {
    width: 1.5em;
    height: 1.5em;
    margin-right: 0.5em;
}

.made-by-worker[b-07c5v91lk4] {
    color: #d9534f;
    font-family: 'Ubuntu-Medium';
}

#report-btn[b-07c5v91lk4] {
    margin-bottom: 1em;
    margin-left: auto;
    margin-right: 1em;
}

.fa-person-circle-exclamation[b-07c5v91lk4] {
    margin-right: 0.5em;
}

#price label[b-07c5v91lk4] {
    font-family: 'Ubuntu-Medium';
}

#price span[b-07c5v91lk4] {
    color: #dc3545;
    font-family: 'Ubuntu-Medium';
    background: #e9ecef;
}

#search-component[b-07c5v91lk4] {
    position: absolute;
    width: 40em;
    height: 20em;
    top: 100%;
    right: 0;
    border-radius: 1em;
    border: 0.1em solid gray;
    padding: 1em;
    background: white;
    z-index: 10000;
}

#close-btn[b-07c5v91lk4] {
    width: 100%;
    display: flex;
    justify-content: end;
}

#search-list-wrapper[b-07c5v91lk4] {
    width: 100%;
    height: 90%;
    overflow-y: scroll;
}

.search-list[b-07c5v91lk4] {
    width: 100%;
    height: auto;
}

    .search-list h6[b-07c5v91lk4] {
        font-family: 'Ubuntu-Medium';
        background: #ececec;
        padding: 0.5em;
        border-radius: .5em;
        margin: 0.5em 0;
    }

.search-item[b-07c5v91lk4] {
    width: 98%;
    position: relative;
    display: flex;
    justify-content: start;
    margin: 0.3em;
    border-bottom: 0.01em solid lightgray;
    padding: 0.3em;
}

.search-item-field[b-07c5v91lk4] {
    width: auto;
    margin-right: 0.8em;
    display: flex;
    flex-direction: column;
    width: 50%;
}

    .search-item-field label[b-07c5v91lk4] {
        font-family: 'Ubuntu-Medium';
        word-break: break-all;
    }

    .search-item-field span[b-07c5v91lk4] {
        font-family: 'Ubuntu-Light';
        font-size: 0.8em;
    }

#search-placeholder[b-07c5v91lk4] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    opacity: 0.8;
}

    #search-placeholder i[b-07c5v91lk4] {
        font-size: 6em;
        opacity: 0.7;
        margin-bottom: 0.1em;
    }

    #search-placeholder p[b-07c5v91lk4] {
        color: gray;
    }

.btn-item[b-07c5v91lk4] {
    display: flex;
    justify-content: end;
    align-items: center;
    margin-left: auto;
}

    .btn-item button[b-07c5v91lk4] {
        padding: 0.2em 0.8em;
        border-radius: 0.5em;
    }

.optional[b-07c5v91lk4] {
    font-size: 0.9em;
    font-family: 'Ubuntu-Italic';
}


#calculated-material-params[b-07c5v91lk4] {
    background: rgba(13, 110, 253, 0.2);
    border-radius: 0.3em;
    padding: 1em;
    display: flex;
    flex-direction: column;
    align-items: end;
    font-size: 1.1rem;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    margin: 1em 0;
}

    #calculated-material-params div[b-07c5v91lk4] {
        display: flex;
        justify-content: space-between;
        width: 100%;
    }

#buttons[b-07c5v91lk4] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 0.5em;
    margin: 0.8em 0;
}

#buttons button[b-07c5v91lk4] {
    margin: 0;
}
/* _content/ArasWeb/Pages/Reclamations/ReclamationDocuments.razor.rz.scp.css */
.reclamation-documents[b-4sze55zow9] {
    width: 100%;
    background: white;
    padding: 1em;
    border-radius: 1em;
    margin-bottom: 1em;
    display: flex;
    flex-direction: column;
    gap: 0.75em;
}

.section-title[b-4sze55zow9] {
    font-family: 'Ubuntu-Medium';
    color: #14425a;
    margin: 0;
}

.section-hint[b-4sze55zow9] {
    margin: 0;
    color: #6c757d;
    font-size: 0.85em;
}

.attachment-upload[b-4sze55zow9] {
    align-self: flex-start;
    cursor: pointer;
}

/* InputFile je komponenta, pa izolovana CSS bez ::deep ne doseže njen <input>. Isto kao u InvoiceDetails. */
[b-4sze55zow9] .attachment-upload input[type="file"] {
    display: none !important;
}

.attachment-upload-button[b-4sze55zow9] {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    padding: 0.5em 1em;
    border-radius: 0.35em;
    background: #e4eef2;
    color: #14425a;
    font-size: 0.9em;
}

.attachment-upload-button:hover[b-4sze55zow9] {
    background: #d4e4ea;
}

.attachment-empty[b-4sze55zow9] {
    margin: 0;
    color: #6c757d;
    font-size: 0.9em;
}

.attachment-list[b-4sze55zow9] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.4em;
}

.attachment-row[b-4sze55zow9] {
    display: flex;
    align-items: center;
    gap: 0.75em;
    padding: 0.5em 0.75em;
    border: 1px solid #ddd;
    border-radius: 0.35em;
}

/* Samo ikona tipa fajla: `>` ne dira ikone u dugmadima, a boje ispod je nadjačaju. */
.attachment-row > i[b-4sze55zow9] {
    font-size: 1.25em;
    color: #6c757d;
}

.attachment-row .pdf-icon[b-4sze55zow9] {
    color: #d9534f;
}

.attachment-row .img-icon[b-4sze55zow9] {
    color: var(--ar-primary);
}

.attachment-row .word-icon[b-4sze55zow9] {
    color: #2b579a;
}

.attachment-row .excel-icon[b-4sze55zow9] {
    color: #217346;
}

/* Ime i podaci su jedno ispod drugog, pa ime ostaje vidljivo i u uskoj kartici. */
.attachment-text[b-4sze55zow9] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.attachment-name[b-4sze55zow9] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #14425a;
}

.attachment-meta[b-4sze55zow9] {
    color: #6c757d;
    font-size: 0.8em;
}

.attachment-row button[b-4sze55zow9] {
    white-space: nowrap;
    flex-shrink: 0;
}

@media (max-width: 560px) {
    .attachment-row[b-4sze55zow9] {
        flex-wrap: wrap;
    }
}
/* _content/ArasWeb/Pages/Reclamations/Reclamations.razor.rz.scp.css */
#offers[b-zy415kjzvf] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#offers-list .list-header[b-zy415kjzvf] {
    background: rgba(217, 83, 79, 0.2)
}

#offers-container[b-zy415kjzvf] {
    display: flex;
    flex-direction: column;
    width: 100%;
    border-radius: 0.5em;
    background: white;
    padding: 1em 0;
}

#offer-filters[b-zy415kjzvf] {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.5em;
    width: 100%;
    padding: 0 1em;
    font-family: var(--font-light);
    font-size: 0.9em;
}

.filter-box[b-zy415kjzvf] {
    margin-right: 1em;
    display: flex;
    flex-direction: column;
}

    .filter-box label[b-zy415kjzvf] {
        margin-bottom: 0.5em;
    }

    .filter-box select[b-zy415kjzvf] {
        width: 15em;
        padding: 0.5em 0.2em;
    }

    .filter-box img[b-zy415kjzvf] {
        width: 1em;
        height: 1em;
        margin: 0 0.5em;
    }

#offers-list[b-zy415kjzvf] {
    width: 100%;
}


#add-reclamation-btn[b-zy415kjzvf] {
}

    #add-reclamation-btn i[b-zy415kjzvf] {
        margin-right: 0.5em;
    }


#search-and-report[b-zy415kjzvf] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: var(--font-light);
    font-size: 0.9em;
    gap: 0.8em;
    margin-left: auto;
}

#generate-pdf[b-zy415kjzvf] {
    font-family: var(--font-medium);
    margin-bottom: auto;
    border: 0.01em solid gray;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
    background: white;
    color: black;
}

    #generate-pdf img[b-zy415kjzvf] {
        width: 1.5em;
        height: 1.5em;
        margin-right: 0.5em;
    }

/* Globalni stil liste rasteže svaki span u redu; ovaj ostaje uz broj. */
.attachment-count[b-zy415kjzvf] {
    display: inline-flex !important;
    width: auto !important;
    gap: 0.25em;
    margin-left: 0.5em;
    color: #6c757d;
    font-family: var(--font-light);
    font-size: 0.85em;
    white-space: nowrap;
}
/* _content/ArasWeb/Pages/Reclamations/ReclamationTabs.razor.rz.scp.css */
.reclamation-tabs a[b-oezi9t4sri] {
    text-decoration: none;
    gap: 0.4em;
}
/* _content/ArasWeb/Pages/Reclamations/SupplierReclamationDetails.razor.rz.scp.css */
#supplier-reclamation[b-ja5e8hyk8l] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.content[b-ja5e8hyk8l] {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    padding-bottom: 2em;
    display: flex;
    flex-direction: column;
    gap: 1em;
}

.card[b-ja5e8hyk8l] {
    background: white;
    border: none;
    border-radius: 1em;
    padding: 1em;
    display: flex;
    flex-direction: column;
    gap: 0.75em;
}

    .card h6[b-ja5e8hyk8l] {
        margin: 0;
        font-family: 'Ubuntu-Medium';
        color: #14425a;
    }

.grid[b-ja5e8hyk8l] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75em;
}

.field[b-ja5e8hyk8l] {
    display: flex;
    flex-direction: column;
    gap: 0.3em;
    min-width: 0;
}

    .field label[b-ja5e8hyk8l] {
        margin: 0;
        font-family: 'Ubuntu-Light';
        font-size: 0.9em;
        color: #14425a;
    }

.span-2[b-ja5e8hyk8l] {
    grid-column: span 2;
}

.hint[b-ja5e8hyk8l] {
    margin: 0;
    font-size: 0.8em;
    color: #6c757d;
}

.links[b-ja5e8hyk8l] {
    display: flex;
    flex-wrap: wrap;
    gap: 1em;
    font-size: 0.9em;
}

    .links a[b-ja5e8hyk8l] {
        color: var(--ar-primary);
        text-decoration: none;
    }

        .links a i[b-ja5e8hyk8l] {
            margin-right: 0.3em;
        }

.locked-note[b-ja5e8hyk8l] {
    margin: 0;
    padding: 0.6em 1em;
    border-radius: 0.5em;
    background: #e4eef2;
    color: #14425a;
    font-size: 0.9em;
}

    .locked-note i[b-ja5e8hyk8l] {
        margin-right: 0.4em;
    }

.actions[b-ja5e8hyk8l] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 0.6em;
}

    .actions button i[b-ja5e8hyk8l] {
        margin-right: 0.4em;
    }

    .actions .btn-danger[b-ja5e8hyk8l] {
        margin-right: auto;
    }

.pdf-group[b-ja5e8hyk8l] {
    display: flex;
    align-items: center;
    gap: 0.4em;
}

    .pdf-group select[b-ja5e8hyk8l] {
        width: 9em;
    }

.history ul[b-ja5e8hyk8l] {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.4em;
    font-size: 0.9em;
    color: #14425a;
}

.history i[b-ja5e8hyk8l] {
    width: 1.2em;
    margin-right: 0.4em;
    color: #6c757d;
}

.closing-note[b-ja5e8hyk8l] {
    margin: 0.3em 0 0 1.6em;
    color: #6c757d;
    white-space: pre-wrap;
}

.status-badge[b-ja5e8hyk8l] {
    display: inline-block;
    padding: 0.25em 0.8em;
    border-radius: 1em;
    font-size: 0.85em;
    font-family: 'Ubuntu-Medium';
    margin-left: 0.5em;
}

.status-draft[b-ja5e8hyk8l] {
    background: #e9ecef;
    color: #6c757d;
}

.status-sent[b-ja5e8hyk8l] {
    background: rgba(2, 117, 216, 0.15);
    color: var(--ar-primary);
}

.status-answered[b-ja5e8hyk8l] {
    background: rgba(240, 173, 78, 0.2);
    color: #b06d00;
}

.status-closed[b-ja5e8hyk8l] {
    background: rgba(92, 184, 92, 0.2);
    color: #3d8b3d;
}

.status-overdue[b-ja5e8hyk8l] {
    background: rgba(217, 83, 79, 0.15);
    color: #d9534f;
}

@media (max-width: 900px) {
    .grid[b-ja5e8hyk8l] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .grid[b-ja5e8hyk8l] {
        grid-template-columns: minmax(0, 1fr);
    }

    .span-2[b-ja5e8hyk8l] {
        grid-column: auto;
    }

    .actions[b-ja5e8hyk8l] {
        justify-content: stretch;
    }

        .actions button[b-ja5e8hyk8l],
        .pdf-group[b-ja5e8hyk8l] {
            width: 100%;
        }

        .actions .btn-danger[b-ja5e8hyk8l] {
            margin-right: 0;
        }
}
/* _content/ArasWeb/Pages/Reclamations/SupplierReclamations.razor.rz.scp.css */
#supplier-reclamations[b-kh2zmvtx9s] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.supplier-reclamations-body[b-kh2zmvtx9s] {
    display: flex;
    flex-direction: column;
    width: 100%;
    border-radius: 0.5em;
    background: white;
    padding: 1em 0;
}

.filters[b-kh2zmvtx9s] {
    display: flex;
    flex-wrap: wrap;
    gap: 1em;
    padding: 0 1em;
    font-family: var(--font-light);
    font-size: 0.9em;
}

.filter-box[b-kh2zmvtx9s] {
    display: flex;
    flex-direction: column;
}

    .filter-box label[b-kh2zmvtx9s] {
        margin-bottom: 0.5em;
    }

    .filter-box select[b-kh2zmvtx9s] {
        width: 15em;
        min-width: 12em;
        padding: 0.5em 0.2em;
    }

    .filter-box img[b-kh2zmvtx9s] {
        width: 1em;
        height: 1em;
        margin: 0 0.5em;
    }

.list-header[b-kh2zmvtx9s] {
    background: rgba(217, 83, 79, 0.2) !important;
}

/* Globalno je svaka kolona 25 %; ovdje ih je sedam, pa svaka dobija svoju širinu. */
label.c-number[b-kh2zmvtx9s] { width: 15% !important; }
label.c-supplier[b-kh2zmvtx9s] { width: 16% !important; }
label.c-article[b-kh2zmvtx9s] { width: 25% !important; }
label.c-qty[b-kh2zmvtx9s] { width: 6% !important; }
label.c-date[b-kh2zmvtx9s] { width: 12% !important; padding-right: 0.5em; }
li label.c-date[b-kh2zmvtx9s] { white-space: nowrap; }
label.c-status[b-kh2zmvtx9s] { width: 14% !important; }

.number[b-kh2zmvtx9s] {
    font-family: var(--font-medium);
    color: #d9534f;
}

/* Globalni stil liste rasteže svaki span u redu; ovaj ostaje uz broj. */
.attachment-count[b-kh2zmvtx9s] {
    display: inline-flex !important;
    width: auto !important;
    gap: 0.25em;
    margin-left: 0.4em;
    color: #6c757d;
    font-family: var(--font-light);
    font-size: 0.85em;
    white-space: nowrap;
}

.article-code[b-kh2zmvtx9s] {
    display: block;
    font-family: var(--font-medium);
    font-size: 0.85em;
    color: #14425a;
}

.overdue[b-kh2zmvtx9s] {
    color: #d9534f;
    font-family: var(--font-medium);
}

.overdue-count[b-kh2zmvtx9s] {
    background: rgba(217, 83, 79, 0.15);
    color: #d9534f;
}

.status-badge[b-kh2zmvtx9s] {
    display: inline-block;
    width: auto !important;
    padding: 0.2em 0.7em;
    border-radius: 1em;
    font-size: 0.85em;
    font-family: var(--font-medium);
}

.status-draft[b-kh2zmvtx9s] {
    background: #e9ecef;
    color: #6c757d;
}

.status-sent[b-kh2zmvtx9s] {
    background: rgba(2, 117, 216, 0.15);
    color: var(--ar-primary);
}

.status-answered[b-kh2zmvtx9s] {
    background: rgba(240, 173, 78, 0.2);
    color: #b06d00;
}

.status-closed[b-kh2zmvtx9s] {
    background: rgba(92, 184, 92, 0.2);
    color: #3d8b3d;
}

@media (max-width: 1100px) {
    label.c-created[b-kh2zmvtx9s] {
        display: none !important;
    }

    label.c-article[b-kh2zmvtx9s] {
        width: 27% !important;
    }

    label.c-date[b-kh2zmvtx9s] {
        width: 15% !important;
    }
}

@media (max-width: 768px) {
    .filter-box select[b-kh2zmvtx9s] {
        width: 100%;
    }
}
/* _content/ArasWeb/Pages/RepeatedOrderArticles/RepeatRequestDetails.razor.rz.scp.css */
#request-container[b-kpas5ijgi1] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: center;
    overflow-y: scroll;
}

#request[b-kpas5ijgi1] {
    width: 50%;
    height: 90%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.request-form[b-kpas5ijgi1] {
    width: 100%;
    background: white;
    padding: 1em;
    border-radius: 1em;
    margin-bottom: 1em;
}


.btn-primary[b-kpas5ijgi1] {
    margin-left: auto;
}

.modal-input-box[b-kpas5ijgi1] {
    width: 48%;
    margin-bottom: 0.5em;
}

    .modal-input-box label[b-kpas5ijgi1] {
        margin-bottom: 0.3em;
        font-family: var(--font-light);
        font-size: 0.9em;
    }

.row-wrapper[b-kpas5ijgi1] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 0.5em;
}

.value[b-kpas5ijgi1] {
    display: flex;
    flex-direction: column;
    font-family: var(--font-regular)
}

.date-and-user img[b-kpas5ijgi1] {
    width: 1.2em;
}

.date-and-user img[b-kpas5ijgi1], .date-and-user i[b-kpas5ijgi1] {
    margin-right: 0.5em;
}

.made-by-worker[b-kpas5ijgi1] {
    color: var(--color-danger);
    font-family: var(--font-medium);
    flex-direction: row;
    align-items: center;
}

.fa-person-circle-exclamation[b-kpas5ijgi1] {
    margin-right: 0.5em;
}

.search-component[b-kpas5ijgi1] {
    width: 100%;
    position: relative;
}

#resolve-request[b-kpas5ijgi1] {
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: 5em 10em;
}

#resolve-request #description[b-kpas5ijgi1] {
    width: 100%;
    margin-bottom: 2em;
}

#resolve-request #selection[b-kpas5ijgi1] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    #resolve-request #selection button[b-kpas5ijgi1] {
        background: transparent;
        font-family: var(--font-bold);
        border: 0.2em solid gray;
        color: gray;
        width: 45%;
    }

    #resolve-request #selection #yes[b-kpas5ijgi1] {
        color: #70bc64;
        border: 0.2em solid #70bc64;
    }

        #resolve-request #selection #yes:hover[b-kpas5ijgi1] {
            background: #70bc64;
            color: white;
        }

    #resolve-request #selection #no[b-kpas5ijgi1] {
        color: var(--color-danger);
        border: 0.2em solid var(--color-danger);
    }

    #resolve-request #selection #no:hover[b-kpas5ijgi1] {
        color: white;
        background: var(--color-danger);
    }

.status-bar-approved[b-kpas5ijgi1],
.status-bar-declined[b-kpas5ijgi1] {
    width: 100%;
    display: flex;
    justify-content: center;
    border-radius: 0.5em;
    padding: 1em;
}

.status-bar-declined[b-kpas5ijgi1] {
    background: rgba(217, 83, 79, 0.3);
    font-size: 1.5em;
}

.status-bar-approved[b-kpas5ijgi1] {
    background: rgba(92, 184, 92, 0.3)
}

.status-bar-approved img[b-kpas5ijgi1] {
    width: 1.5em;
}
/* _content/ArasWeb/Pages/RepeatedOrderArticles/RepeatRequests.razor.rz.scp.css */
#requests[b-untsr3slx7] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#requests-container[b-untsr3slx7] {
    width: 100%;
    border-radius: 0.5em;
    padding: 1em;
}

#requests-list[b-untsr3slx7] {
    width: 100%;
}

.list-wrapper[b-untsr3slx7] {
    padding: 0;
}

.request-status span[b-untsr3slx7] {
    border-radius: 2em;
    width: auto;
    padding: 0.3em 1.5em;
    word-break: break-all;
    font-family: var(--font-medium);
    font-size: 0.8em;
    justify-content: center;
    width: 11em;
}

.request-status img[b-untsr3slx7] {
    width: 1.2em;
    height: 1.2em;
    margin-right: 0.5em;
}

.request-status i[b-untsr3slx7] {
    margin-right: 0.8em;
    color: var(--color-danger);
}

.approved span[b-untsr3slx7] {
    background: rgba(205, 254, 194, 0.8)
}

.pending span[b-untsr3slx7] {
    background: rgba(236, 236, 236, 0.8)
}

.declined span[b-untsr3slx7] {
    background: rgba(217, 83, 79, 0.5)
}

#create-btn[b-untsr3slx7] {
}

.list-item span label[b-untsr3slx7] {
    width: 18%
}

.made-by-employee[b-untsr3slx7] {
    color: var(--color-danger);
    font-family: var(--font-medium);
}


#search-and-report[b-untsr3slx7] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: var(--font-light);
    font-size: 0.9em;
    gap: 0.8em;
    margin-left: auto;
}

#generate-pdf[b-untsr3slx7] {
    font-family: var(--font-medium);
    margin-bottom: auto;
    border: 0.01em solid gray;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
    background: white;
    color: black;
}

    #generate-pdf img[b-untsr3slx7] {
        width: 1.5em;
        height: 1.5em;
        margin-right: 0.5em;
    }

#filters[b-untsr3slx7] {
    display: flex;
    justify-content: start;
    align-items: center;
    width: 100%;
    padding: 0 1em;
    font-family: var(--font-light);
    font-size: 0.9em;
    margin-bottom: 1em;
}

.filter-box[b-untsr3slx7] {
    margin-right: 2em;
    display: flex;
    flex-direction: column;
    align-items: start;
    width: 20%;
}

    .filter-box label[b-untsr3slx7] {
        width: auto;
        margin-right: 1em;
        text-align: right;
    }

    .filter-box img[b-untsr3slx7] {
        width: 1em;
        height: 1em;
        margin-right: 0.5em;
    }

.search-box-wrapper[b-untsr3slx7] {
    width: 100%;
}
/* _content/ArasWeb/Pages/RepeatedOrderArticles/RequestOrderArticleRecreation.razor.rz.scp.css */
#request-container[b-qhj3cbvosq] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: center;
    overflow-y: scroll;
}

#request[b-qhj3cbvosq] {
    width: 50%;
    height: 90%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.request-form[b-qhj3cbvosq] {
    width: 100%;
    background: white;
    padding: 1em;
    border-radius: 1em;
    margin-bottom: 1em;
}

.btn-primary[b-qhj3cbvosq] {
    margin-left: auto;
}

.modal-input-box[b-qhj3cbvosq] {
    width: 100%;
    margin-bottom: 1em;
}

    .modal-input-box label[b-qhj3cbvosq] {
        margin-bottom: 0.3em;
        font-family: 'Ubuntu-Light';
        font-size: 0.9em;
    }

.search-component[b-qhj3cbvosq] {
    width: 100%;
    position: relative;
}

.list-placeholder[b-qhj3cbvosq], .empty-ops[b-qhj3cbvosq] {
    background: #e1e1e1;
    font-family: 'Ubuntu-Light';
    font-size: 0.9em;
    padding: 1em;
    border-radius: .5em;
    opacity: 0.8;
}

.operations ul[b-qhj3cbvosq] {
    width: 100%;
    margin: 0;
    padding: 0;
}

    .operations ul li[b-qhj3cbvosq] {
        list-style-type: none;
        font-size: 0.9em;
        padding: 0.8em;
        background: rgba(13, 110, 253, 0.1);
        width: 100%;
        display: flex;
        flex-direction: column;
        margin-bottom: 0.3em;
        border-radius: 0.5em;
    }

.operations ul li .activity[b-qhj3cbvosq] {
    width: 100%;
    display: flex;
    justify-content: start;
}

    .operations ul li .activity-name[b-qhj3cbvosq] {
        font-family: 'Ubuntu-Bold';
        width: 100%;
    }

    .operations ul li .activity-details[b-qhj3cbvosq] {
        display: flex;
        font-size: 0.85em;
        padding: 0.5em;
        justify-content: space-between;
        width: 90%;
    }

.checkbox-box[b-qhj3cbvosq]{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 1em;
}

.checkbox-box input[b-qhj3cbvosq] {
    cursor: pointer;
}
.activity-details span[b-qhj3cbvosq] {
    text-align: left;
}
/* _content/ArasWeb/Pages/Reports/MaterialConsumption.razor.rz.scp.css */
#material-consumption-wrapper[b-hz2vfvo2s6] {
    padding: var(--space-md) var(--space-lg) 3em var(--space-lg);
}

/* ---------- Step cards ---------- */

.step-card[b-hz2vfvo2s6] {
    background: var(--color-bg-card);
    border-radius: 0.5em;
    margin-top: var(--space-md);
    overflow: hidden;
}

.step-head[b-hz2vfvo2s6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);
    padding: var(--space-md) 1.5em;
    border-bottom: 1px solid var(--color-bg-surface);
    cursor: pointer;
    user-select: none;
}

.step-head.static[b-hz2vfvo2s6] {
    cursor: default;
}

.step-head-left[b-hz2vfvo2s6] {
    display: flex;
    align-items: center;
    gap: 0.9em;
    min-width: 0;
}

.step-index[b-hz2vfvo2s6] {
    flex-shrink: 0;
    width: 2em;
    height: 2em;
    border-radius: 50%;
    background: var(--color-bg-surface);
    color: var(--color-text-dark);
    font-family: var(--font-medium);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.step-title[b-hz2vfvo2s6] {
    display: block;
    color: var(--color-text-dark);
    font-family: var(--font-medium);
    font-size: 1.05em;
    margin: 0;
}

.step-subtitle[b-hz2vfvo2s6] {
    margin: 0.15em 0 0 0;
    font-family: var(--font-light);
    font-size: 0.85em;
    color: var(--color-text-muted);
}

.step-toggle[b-hz2vfvo2s6] {
    border: none;
    background: transparent;
    color: var(--color-icon-accent);
    padding: 0.3em 0.6em;
    border-radius: 0.4em;
}

    .step-toggle:hover[b-hz2vfvo2s6] {
        background: var(--color-bg-surface);
    }

.step-body[b-hz2vfvo2s6] {
    padding: 1.25em 1.5em;
}

.step-actions[b-hz2vfvo2s6] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--space-md);
    padding: 0.85em 1.5em;
    background: var(--color-bg-main);
    border-top: 1px solid var(--color-bg-surface);
}

.step-actions-note[b-hz2vfvo2s6] {
    font-family: var(--font-light);
    font-size: 0.9em;
    color: var(--color-text-muted);
}

/* Same shape as every other Excel button in the app (Izvještaji, Dorade,
   Nalozi): white, green outline, icon capped at 1.5em so the button keeps
   the standard button height. */
.excel-btn[b-hz2vfvo2s6] {
    background: var(--color-bg-card);
    color: #3d783d;
    font-family: var(--font-medium);
    border: 0.1em solid var(--color-success);
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

    .excel-btn:hover[b-hz2vfvo2s6] {
        background: rgba(38, 176, 80, 0.08);
        color: #3d783d;
    }

    .excel-btn img[b-hz2vfvo2s6] {
        width: 1.5em;
        height: 1.5em;
        margin-right: 0.5em;
    }

/* ---------- Filters ---------- */

.picker-filters[b-hz2vfvo2s6] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-md);
    align-items: flex-end;
    margin-bottom: 1.25em;
}

.field[b-hz2vfvo2s6] {
    display: flex;
    flex-direction: column;
    min-width: 12em;
    flex: 1 1 12em;
}

    .field label[b-hz2vfvo2s6] {
        margin-bottom: 0.3em;
        font-family: var(--font-light);
        font-size: 0.9em;
        color: var(--color-text-dark);
    }

.field-action[b-hz2vfvo2s6] {
    flex: 0 0 auto;
    min-width: auto;
}

.required-star[b-hz2vfvo2s6] {
    color: var(--color-danger);
}

/* ---------- Picker toolbar ---------- */

.picker-toolbar[b-hz2vfvo2s6] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-sm) var(--space-md);
    margin-bottom: 0.75em;
}

.order-search[b-hz2vfvo2s6] {
    flex: 1 1 18em;
    min-width: 14em;
}

.status-tabs[b-hz2vfvo2s6] {
    display: flex;
    gap: var(--space-xs);
    flex-wrap: wrap;
}

.status-tab[b-hz2vfvo2s6] {
    border: 1px solid var(--color-border);
    background: var(--color-bg-card);
    color: var(--color-text-muted);
    font-family: var(--font-light);
    font-size: 0.85em;
    padding: 0.4em 0.9em;
    border-radius: 2em;
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    white-space: nowrap;
}

    .status-tab:hover[b-hz2vfvo2s6] {
        border-color: var(--color-primary);
        color: var(--color-primary);
    }

    .status-tab.active[b-hz2vfvo2s6] {
        background: var(--color-primary);
        border-color: var(--color-primary-border);
        color: white;
        font-family: var(--font-medium);
    }

.status-tab-count[b-hz2vfvo2s6] {
    background: rgba(0, 0, 0, 0.08);
    border-radius: 1em;
    padding: 0 0.5em;
    font-size: 0.9em;
}

.status-tab.active .status-tab-count[b-hz2vfvo2s6] {
    background: rgba(255, 255, 255, 0.25);
}

.picker-meta[b-hz2vfvo2s6] {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    margin-bottom: 0.25em;
}

.link-button[b-hz2vfvo2s6] {
    border: none;
    background: transparent;
    color: var(--color-link);
    font-family: var(--font-light);
    font-size: 0.85em;
    padding: 0;
    margin-bottom: 10px;
}

    .link-button:hover[b-hz2vfvo2s6] {
        text-decoration: underline;
    }

/* ---------- Picker table ---------- */

.picker-table-wrapper[b-hz2vfvo2s6] {
    max-height: 26em;
    overflow-y: auto;
    border: 1px solid var(--color-border);
    border-radius: 0.5em;
}

.picker-table[b-hz2vfvo2s6] {
    margin-bottom: 0;
}

    .picker-table thead th[b-hz2vfvo2s6] {
        position: sticky;
        top: 0;
        z-index: 1;
        background: var(--color-bg-surface);
        color: var(--color-text-dark);
        font-family: var(--font-medium);
        font-size: 0.85em;
        border-bottom: 1px solid var(--color-border);
        white-space: nowrap;
    }

    .picker-table tbody tr[b-hz2vfvo2s6] {
        cursor: pointer;
    }

        .picker-table tbody tr:hover[b-hz2vfvo2s6] {
            background: var(--color-bg-main);
        }

    .picker-table tbody td[b-hz2vfvo2s6] {
        vertical-align: middle;
        font-size: 0.9em;
    }

.row-selected[b-hz2vfvo2s6] {
    background: rgba(40, 138, 237, 0.08) !important;
}

    .row-selected td:first-child[b-hz2vfvo2s6] {
        box-shadow: inset 0.2em 0 0 var(--color-primary);
    }

.status-pill[b-hz2vfvo2s6] {
    display: inline-flex;
    align-items: center;
    border-radius: 2em;
    padding: 0.2em 0.9em;
    font-family: var(--font-medium);
    font-size: 0.78em;
    white-space: nowrap;
}

.status-pending[b-hz2vfvo2s6] {
    background: rgba(236, 236, 236, 0.9);
    color: #5a5a5a;
}

.status-progress[b-hz2vfvo2s6] {
    background: rgba(255, 204, 0, 0.25);
    color: #8a6d00;
}

.status-done[b-hz2vfvo2s6] {
    background: rgba(38, 176, 80, 0.16);
    color: #1c7c39;
}

/* ---------- Empty states ---------- */

.empty-state[b-hz2vfvo2s6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-sm);
    color: var(--color-text-muted);
    font-family: var(--font-light);
    padding: 2.5em var(--space-md);
    text-align: center;
}

    .empty-state i[b-hz2vfvo2s6] {
        font-size: 1.8em;
        color: var(--color-border);
    }

    .empty-state p[b-hz2vfvo2s6] {
        margin: 0;
    }

/* ---------- Result tiles ---------- */

.tiles[b-hz2vfvo2s6] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11em, 1fr));
    gap: var(--space-md);
    margin-bottom: 1.25em;
}

.tile[b-hz2vfvo2s6] {
    background: var(--color-bg-main);
    border: 1px solid var(--color-bg-surface);
    border-radius: 0.5em;
    padding: 0.85em var(--space-md);
}

    .tile label[b-hz2vfvo2s6] {
        display: block;
        font-family: var(--font-light);
        font-size: 0.8em;
        color: var(--color-text-muted);
        margin-bottom: 0.25em;
    }

    .tile strong[b-hz2vfvo2s6] {
        font-family: var(--font-medium);
        font-size: 1.3em;
        color: var(--color-text-dark);
    }

        .tile strong span[b-hz2vfvo2s6] {
            font-size: 0.65em;
            color: var(--color-text-muted);
        }

.tile-accent[b-hz2vfvo2s6] {
    background: var(--color-bg-surface);
    border-color: #cfe0e7;
}

.tile-warning[b-hz2vfvo2s6] {
    background: rgba(255, 204, 0, 0.12);
    border-color: rgba(255, 204, 0, 0.5);
}

/* ---------- Order chips ---------- */

.order-chips[b-hz2vfvo2s6] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-xs);
    margin-bottom: var(--space-md);
}

    .order-chips label[b-hz2vfvo2s6] {
        font-family: var(--font-light);
        font-size: 0.85em;
        color: var(--color-text-muted);
        margin: 0 var(--space-xs) 0 0;
    }

.order-chip[b-hz2vfvo2s6] {
    background: var(--color-bg-surface);
    color: var(--color-text-dark);
    border-radius: 0.35em;
    padding: 0.15em 0.6em;
    font-size: 0.8em;
    font-family: var(--font-light);
}

.inline-note[b-hz2vfvo2s6] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    background: rgba(255, 204, 0, 0.12);
    border-left: 0.25em solid var(--color-warning);
    border-radius: 0.35em;
    padding: 0.6em var(--space-md);
    margin-bottom: var(--space-md);
    font-family: var(--font-light);
    font-size: 0.88em;
    color: var(--color-text-dark);
}

/* ---------- Result tables ---------- */

.result-section[b-hz2vfvo2s6] {
    margin-top: 1.75em;
}

.section-head[b-hz2vfvo2s6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    color: var(--color-icon-accent);
}

.section-title[b-hz2vfvo2s6] {
    display: block;
    color: var(--color-text-dark);
    font-family: var(--font-medium);
    font-size: 1.05em;
    margin-bottom: 0.4em;
}

.section-note[b-hz2vfvo2s6] {
    font-family: var(--font-light);
    font-size: 0.85em;
    color: var(--color-text-muted);
    margin: 0 0 var(--space-sm) 0;
}

.skipped .section-title[b-hz2vfvo2s6] {
    color: var(--color-text-muted);
}

.result-table[b-hz2vfvo2s6] {
    margin-bottom: 0;
}

    .result-table th[b-hz2vfvo2s6] {
        background: var(--color-bg-surface);
        color: var(--color-text-dark);
        font-family: var(--font-medium);
        font-size: 0.85em;
        white-space: nowrap;
    }

    .result-table td[b-hz2vfvo2s6] {
        font-size: 0.9em;
        vertical-align: middle;
    }

    .result-table .col-number[b-hz2vfvo2s6],
    .result-table .col-count[b-hz2vfvo2s6] {
        text-align: right;
    }

.cell-missing[b-hz2vfvo2s6] {
    color: var(--color-text-muted);
}

.row-total td[b-hz2vfvo2s6] {
    font-family: var(--font-medium);
    color: var(--color-text-dark);
    background: var(--color-bg-main);
    border-top: 2px solid var(--color-text-dark);
}

.grand-total[b-hz2vfvo2s6] {
    display: flex;
    align-items: baseline;
    justify-content: flex-end;
    gap: var(--space-md);
    margin-top: 1.75em;
    padding-top: var(--space-md);
    border-top: 2px solid var(--color-text-dark);
    color: var(--color-text-dark);
    font-family: var(--font-medium);
}

    .grand-total strong[b-hz2vfvo2s6] {
        font-size: 1.35em;
        color: var(--color-success);
    }

/* ---------- Column widths ---------- */

.col-check[b-hz2vfvo2s6] {
    width: 2.6em;
}

.col-date[b-hz2vfvo2s6] {
    width: 8.5em;
}

.col-status[b-hz2vfvo2s6] {
    width: 9em;
}

.col-number[b-hz2vfvo2s6] {
    width: 9em;
}

.col-number-left[b-hz2vfvo2s6] {
    width: 9em;
    text-align: left;
}

.col-count[b-hz2vfvo2s6] {
    width: 6em;
}

.col-thickness[b-hz2vfvo2s6] {
    width: 10em;
}

.col-code[b-hz2vfvo2s6] {
    width: 8em;
}

.col-reason[b-hz2vfvo2s6] {
    width: 14em;
}

@media (max-width: 900px) {
    #material-consumption-wrapper[b-hz2vfvo2s6] {
        padding: var(--space-sm) var(--space-md) 2em var(--space-md);
    }

    .step-body[b-hz2vfvo2s6],
    .step-head[b-hz2vfvo2s6],
    .step-actions[b-hz2vfvo2s6] {
        padding-left: var(--space-md);
        padding-right: var(--space-md);
    }

    .field[b-hz2vfvo2s6] {
        flex: 1 1 100%;
    }
}

/* Kolona i plocica za materijal potrosen na ponovnu izradu — vidi se da je visak, a ne redovan utrosak. */
.cell-remake[b-hz2vfvo2s6] {
    color: #d9534f;
}

.tile-remake strong[b-hz2vfvo2s6] {
    color: #d9534f;
}
/* _content/ArasWeb/Pages/Reports/Reports.razor.rz.scp.css */
#reports-wrapper[b-k34jd9wwud] {
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    display: flex;
    flex-direction: column;
}

#reports[b-k34jd9wwud] {
    width: 50%;
    background: white;
    border-radius: 0.5em;
    padding: 1em;
    margin-bottom: 2em;
    align-self: center;
}

#reports-container[b-k34jd9wwud] {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin-top: 1em;
}

.data-box[b-k34jd9wwud] {
    width: 50%;
    margin: 1em 0;
    padding-right: 1em;
}

    .data-box label[b-k34jd9wwud] {
        width: 100%;
        margin-bottom: 0.5em;
        font-family: var(--font-light);
        font-size: 0.9em;
    }

.full-width[b-k34jd9wwud]{
    width: 100%;
}

#order-article-picker[b-k34jd9wwud] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: start;
}

#order-article-picker div[b-k34jd9wwud] {
    width: auto;
    height: 100%;
    margin-right: 0.5em;
}

#order-article-picker label[b-k34jd9wwud] {
    width: auto;
}

#download-btns[b-k34jd9wwud] {
    width: 100%;
    display: flex;
    justify-content: end;
    padding: 0.5em;
}

.generate-btn[b-k34jd9wwud],
#preview-btn[b-k34jd9wwud] {
    margin-top: 1em;
    margin-left: auto;
}

.generate-btn[b-k34jd9wwud] {
    font-family: var(--font-medium);
    border: 0.01em solid gray;
    background: white;
    color: black;
    border: 0.1em solid gray;
    margin-left: 1em;
}

    .generate-btn img[b-k34jd9wwud] {
        width: 1.5em;
        height: 1.5em;
        margin-right: 0.5em;
    }

#generate-excel-btn[b-k34jd9wwud] {
    background: white;
    color: #3d783d;
    font-family: var(--font-medium);
    border: 0.1em solid #5cb85c;
}

/*

    REPORT PREVIEW STYLE
*/

#report-preview[b-k34jd9wwud] {
    background: white;
    width: 100%;
    height: auto;
    padding: 2em;
    border-radius: 1em;
    font-family: Arial, sans-serif;
    margin: 0;
}

    #report-preview .header[b-k34jd9wwud] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 2em
    }

    #report-preview .header-left[b-k34jd9wwud] {
        text-align: left;
    }

    #report-preview .date-label[b-k34jd9wwud],
    #report-preview[b-k34jd9wwud]  .employee-name label,
    #report-preview[b-k34jd9wwud]  .total-time label{
        font-size: 0.8em;
        font-weight: lighter;
        margin-bottom: 0;
    }

    #report-preview .date-value[b-k34jd9wwud] {        
        font-weight: normal;
    }

    #report-preview .header-right[b-k34jd9wwud] {
       display: flex;
       flex-direction: column;
       align-items: end;
    }

    #report-preview .header-right .logo[b-k34jd9wwud] {
        width: 200px;
        height: auto;
    }

    #report-preview[b-k34jd9wwud]  .title-section {
        text-align: center;
        margin-bottom: 3em;
    }

    #report-preview[b-k34jd9wwud]  .title {
        font-size: 1.2em;
        font-weight: bold;
    }

    #report-preview[b-k34jd9wwud]  .subtitle {
        font-size: 1em;
        font-weight: bold;
    }

    #report-preview[b-k34jd9wwud]  .activity-table {
        margin: 1em 0;
        width: 100%;
        border-collapse: collapse;
        border-radius: 0.5em;
    }

        #report-preview[b-k34jd9wwud]  .activity-table table {
            width: 100%;
        }

        #report-preview[b-k34jd9wwud]  .activity-table th, 
        [b-k34jd9wwud] .activity-table td {
            padding: 1em;
            border: 0.05em solid #ccc;
            text-align: left;
        }

        #report-preview[b-k34jd9wwud]  .activity-table th {
            background-color: #f1f1f1;
            font-weight: bold;
        }

        #report-preview[b-k34jd9wwud]  .activity-table td {
            font-size: 0.8em;
            color: #000;
            word-break: break-all;
        }    

    #report-preview .header-info[b-k34jd9wwud] {
        padding: 1em;
        text-align: right;
        font-weight: lighter;
        font-size: 0.8em;
        color: gray;
    }

        #report-preview .header-info p[b-k34jd9wwud] {
            margin: 0;
        }

        #report-preview .header-info #company-name[b-k34jd9wwud] {
            font-weight: bold;
            color: black;
        }


    #report-preview[b-k34jd9wwud]  .employee-name,
    #report-preview[b-k34jd9wwud]  .total-time {
        margin-top: 1em;
        display: flex;
        flex-direction: column;
    }

        #report-preview[b-k34jd9wwud]  .employee-name span,
        #report-preview[b-k34jd9wwud]  .total-time span {
            font-weight: bolder;
        }

    #report-preview[b-k34jd9wwud]  .total-time {
        margin-bottom: 2em;
        border-bottom: 0.05em solid lightgray;
        align-items: end;
        padding-bottom: 1em;
    }

    #report-preview[b-k34jd9wwud]  .warning {
        color: #DC4C64 !important;
        font-family: var(--font-medium)
    }

/* Prevent breaking of table rows and important sections */
tr[b-k34jd9wwud], .header-info[b-k34jd9wwud], .tbl-box[b-k34jd9wwud] {
    page-break-inside: avoid; /* Prevent breaks inside rows or elements */
    break-inside: avoid;
}

/* Ensure consistent font size */
#reports-container[b-k34jd9wwud] {
    font-size: 16px; /* Adjust font size */
    line-height: 1.5; /* Improve readability */
}

/* Add padding to prevent content being clipped */
#reports-container[b-k34jd9wwud] {
    padding: 10px;
}
/* _content/ArasWeb/Pages/Reworks/ReworkOperations.razor.rz.scp.css */
#requests[b-62x2t2c8m1] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#requests-container[b-62x2t2c8m1] {
    width: 100%;
    border-radius: 0.5em;
    padding: 1em;
}

#requests-list[b-62x2t2c8m1] {
    width: 100%;
}

.list-wrapper[b-62x2t2c8m1] {
    padding: 0;
}

.request-status span[b-62x2t2c8m1] {
    border-radius: 2em;
    width: auto;
    padding: 0.3em 1.5em;
    word-break: break-all;
    font-family: var(--font-medium);
    font-size: 0.8em;
    justify-content: center;
    width: 11em;
}

.request-status img[b-62x2t2c8m1] {
    width: 1.2em;
    height: 1.2em;
    margin-right: 0.5em;
}

.request-status i[b-62x2t2c8m1] {
    margin-right: 0.8em;
    color: var(--color-danger);
}

.approved span[b-62x2t2c8m1] {
    background: rgba(205, 254, 194, 0.8)
}

.pending span[b-62x2t2c8m1] {
    background: rgba(236, 236, 236, 0.8)
}

.declined span[b-62x2t2c8m1] {
    background: rgba(217, 83, 79, 0.5)
}

#create-btn[b-62x2t2c8m1] {
    margin-left: auto;
}

.list-item span label[b-62x2t2c8m1] {
    width: 18%
}

.made-by-employee[b-62x2t2c8m1] {
    color: var(--color-danger);
    font-family: var(--font-medium);
}


.disabled span[b-62x2t2c8m1] {
    background: #f5f5f5
}


#search-and-report[b-62x2t2c8m1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: var(--font-light);
    font-size: 0.9em;
    margin-left: auto;
    gap: 0.8em;
}

#generate-excel[b-62x2t2c8m1] {
    background: white;
    color: #3d783d;
    font-family: var(--font-medium);
    border: 0.1em solid #5cb85c;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
}

    #generate-excel img[b-62x2t2c8m1] {
        width: 1.5em;
        height: 1.5em;
        margin-right: 0.5em;
    }

#filters[b-62x2t2c8m1] {
    display: flex;
    justify-content: start;
    align-items: center;
    width: 100%;
    padding: 0 1em;
    font-family: var(--font-light);
    font-size: 0.9em;
    margin-bottom: 1em;
}

.filter-box[b-62x2t2c8m1] {
    margin-right: 2em;
    display: flex; 
    flex-direction: column;
    align-items: start;
    width: 20%;
}

    .filter-box label[b-62x2t2c8m1] {
        width: auto;
        margin-right: 1em;
        text-align: right;
    }

    .filter-box img[b-62x2t2c8m1] {
        width: 1em;
        height: 1em;
        margin-right: 0.5em;
    }

.search-box-wrapper[b-62x2t2c8m1] {
    width: 100%;
}

#defect-in-advance[b-62x2t2c8m1] {
    background: white;
    color: var(--color-danger);
    border: 0.1em solid var(--color-danger);
    font-family: var(--font-medium);
}

#defect-in-advance i[b-62x2t2c8m1] {
    margin-right: 0.5em;
}
/* _content/ArasWeb/Pages/Settings/LoginNetworksEditor.razor.rz.scp.css */
.networks[b-8mfj0qhf19] {
    margin-top: 0.6em;
    display: flex;
    flex-direction: column;
    gap: 0.6em;
    font-family: var(--font-light);
    font-size: 0.9em;
}

.networks-current[b-8mfj0qhf19] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5em;
}

.networks-tag[b-8mfj0qhf19] {
    font-size: 0.8em;
    padding: 0.1em 0.6em;
    border-radius: 1em;
    background: #e4eef2;
    color: #14425a;
}

    .networks-tag.ok[b-8mfj0qhf19] {
        background: #e3f4e3;
        color: #2f7a2f;
    }

    .networks-tag.warning[b-8mfj0qhf19] {
        background: #fff3cd;
        color: #7a5a00;
    }

.networks-note[b-8mfj0qhf19] {
    color: var(--color-text-muted);
    font-size: 0.85em;
    font-style: italic;
    margin: 0;
}

    .networks-note.warning[b-8mfj0qhf19] {
        color: #7a5a00;
        font-style: normal;
    }

.networks-muted[b-8mfj0qhf19] {
    color: var(--color-text-muted);
    margin: 0;
}

.networks-table[b-8mfj0qhf19] {
    width: 100%;
    border-collapse: collapse;
    background: white;
    border-radius: 0.5em;
    overflow: hidden;
}

    .networks-table th[b-8mfj0qhf19],
    .networks-table td[b-8mfj0qhf19] {
        padding: 0.35em 0.6em;
        text-align: left;
        border-bottom: 1px solid #e4eef2;
        vertical-align: middle;
    }

    .networks-table th[b-8mfj0qhf19] {
        font-size: 0.8em;
        color: var(--color-text-muted);
        font-weight: normal;
    }

    .networks-table code[b-8mfj0qhf19] {
        color: #14425a;
        font-size: 0.95em;
    }

.networks-add[b-8mfj0qhf19] {
    display: grid;
    grid-template-columns: minmax(14em, 2fr) minmax(8em, 1fr) auto;
    gap: 0.5em;
    align-items: center;
}

.networks-denials-toggle[b-8mfj0qhf19] {
    background: none;
    border: none;
    padding: 0;
    color: #14425a;
    font-family: var(--font-regular);
    display: flex;
    align-items: center;
    gap: 0.4em;
}

    .networks-denials-toggle i[b-8mfj0qhf19] {
        transition: transform 0.15s;
        font-size: 0.8em;
    }

        .networks-denials-toggle i.open[b-8mfj0qhf19] {
            transform: rotate(180deg);
        }

@media (max-width: 576px) {
    .networks-add[b-8mfj0qhf19] {
        grid-template-columns: 1fr;
    }
}
/* _content/ArasWeb/Pages/Settings/Settings.razor.rz.scp.css */
#settings[b-nztxy5wwyp] {
    width: 100%;
    height: 100%;
    overflow-y: scroll;
}

    #settings #settings-container[b-nztxy5wwyp] {
        width: 100%;
        height: auto;
        min-height: 90%;
        background: white;
        border-radius: 1em;
        padding: 1em;
    }

#tabs[b-nztxy5wwyp] {
    width: 100%;
    height: auto;
}

#non-working-days[b-nztxy5wwyp] {
    width: 100%;
    height: auto;
    padding: 1em;
}

/* Naslov s izborom godine: "Neradni dani za ‹ 2027. › godinu" u jednom redu. */
.year-picker[b-nztxy5wwyp] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5em;
    margin-bottom: 0.5rem;
}

    .year-picker h3[b-nztxy5wwyp] {
        margin-bottom: 0;
    }

.padded-table > :not(caption) > * > *[b-nztxy5wwyp] {
    padding: 0.75rem 1rem; /* vertical | horizontal */
}

/* -- Faze procesa -------------------------------------------------------- */

#process-phases-settings[b-nztxy5wwyp],
#business-settings[b-nztxy5wwyp] {
    width: 100%;
    height: auto;
    padding: 1em;
    max-width: 70em; /* dugački nazivi faza inače razvuku redove preko cijelog ekrana */
    margin-inline: auto; /* uži od kartice: stoji u sredini, ne uz lijevu ivicu */
}

    #process-phases-settings h3[b-nztxy5wwyp],
    #business-settings h3[b-nztxy5wwyp] {
        font-family: var(--font-medium);
        color: var(--color-text-dark);
        font-size: 1.15em;
        margin-bottom: 0.25em;
    }

    #process-phases-settings .phase-description[b-nztxy5wwyp],
    #business-settings .setting-description[b-nztxy5wwyp] {
        font-family: var(--font-light);
        color: var(--color-text-muted);
        font-size: 0.88em;
        margin-bottom: var(--space-md);
    }

/* Jedna kolona po defaultu (telefon, uski prozor), dvije od 75em naviše.
   Prag je 75em a ne 62em jer meni sa strane uzme do 12em: na 62em bi kolona ostala
   oko 23em, a naziv "Mjerenje (PROVJERA MATERIJALA, ...)" bi se lomio u četiri reda.
   align-items: start da kraća kartica ne bude razvučena na visinu duže. */
.phase-cards[b-nztxy5wwyp] {
    display: grid;
    grid-template-columns: 1fr;
    align-items: start;
    gap: var(--space-md);
    margin-bottom: var(--space-md);
}

@media (min-width: 75em) {
    .phase-cards[b-nztxy5wwyp] {
        grid-template-columns: 1fr 1fr;
    }
}

.phase-card[b-nztxy5wwyp] {
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: 1em;
    overflow: hidden; /* da zaglavlje prati zaobljene uglove kartice */
    min-width: 0; /* bez ovoga duga imena faza gurnu kolonu preko širine mreže */
}

/* --color-bg-header, isto što koriste zaglavlja modala i pretrage. --color-bg-surface
   je svjetloplava i nigdje drugdje se ne koristi za zaglavlje. */
.phase-card-header[b-nztxy5wwyp] {
    background: var(--color-bg-header);
    color: var(--color-text-dark);
    font-family: var(--font-medium);
    font-size: 0.95em;
    padding: 0.7em 1.2em;
}

    .phase-card-header i[b-nztxy5wwyp] {
        color: var(--color-icon-accent);
        margin-right: 0.5em;
    }

.phase-card-body[b-nztxy5wwyp] {
    padding: 0 1.2em;
}

.phase-row[b-nztxy5wwyp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.55em 0;
    border-bottom: 1px solid var(--color-border-light);
}

    .phase-row:last-child[b-nztxy5wwyp] {
        border-bottom: none;
    }

    /* Bez Bootstrapovog uvlačenja prekidača: stoji uz lijevu ivicu, po sredini reda. */
    .phase-row .form-check[b-nztxy5wwyp] {
        margin-bottom: 0;
        padding-left: 0;
        display: flex;
        align-items: center;
        gap: 0.6em;
    }

    .phase-row .form-check-label[b-nztxy5wwyp] {
        font-family: var(--font-regular);
        font-size: 0.92em;
        color: var(--color-text-dark);
        cursor: pointer;
    }

    .phase-row .form-check-input[b-nztxy5wwyp] {
        margin: 0;
        cursor: pointer;
        flex-shrink: 0;
    }

        /* Bootstrap postavlja background-image za kvačicu zasebno, pa boja ne gasi kvačicu. */
        .phase-row .form-check-input:checked[b-nztxy5wwyp] {
            background-color: var(--color-primary);
            border-color: var(--color-primary);
        }

        .phase-row .form-check-input:focus[b-nztxy5wwyp] {
            border-color: var(--color-primary);
            box-shadow: 0 0 0 0.15rem rgba(40, 138, 237, 0.25);
        }

/* Zaključane faze: prigušene, bez pokazivača da se na njih može kliknuti. */
.phase-row.locked .form-check-label[b-nztxy5wwyp],
.phase-row.locked .form-check-input[b-nztxy5wwyp] {
    cursor: default;
}

.phase-row.locked .form-check-label[b-nztxy5wwyp] {
    color: var(--color-text-muted);
}

.phase-condition[b-nztxy5wwyp] {
    font-family: var(--font-light);
    font-size: 0.8em;
    color: var(--color-text-muted);
    white-space: nowrap;
}

.phase-lock[b-nztxy5wwyp] {
    color: var(--color-text-muted);
    font-size: 0.8em;
    margin-left: var(--space-sm);
}

.phase-extras[b-nztxy5wwyp] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    flex-shrink: 0;
}

.phase-protocol[b-nztxy5wwyp] {
    display: flex;
    align-items: center;
    gap: 0.35em;
    margin: 0;
    font-size: 0.8em;
    color: var(--color-text-muted);
    white-space: nowrap;
    cursor: pointer;
}

.format-select[b-nztxy5wwyp] {
    margin-top: 0.5em;
}

    .format-select label[b-nztxy5wwyp] {
        font-family: var(--font-regular);
        font-size: 0.85em;
        color: var(--color-text-muted);
        display: block;
        margin-bottom: 0.3em;
    }

    .format-select select[b-nztxy5wwyp] {
        max-width: 18em;
    }

/* Upozorenje koje se ne odnosi na ostale postavke — one mijenjaju samo sta je dostupno od sada. */
.form-code[b-nztxy5wwyp] {
    max-width: 22em;
    margin-top: 0.4em;
}

    .form-code label[b-nztxy5wwyp] {
        font-family: var(--font-light);
        color: var(--color-text-muted);
        font-size: 0.85em;
        margin-bottom: 0.2em;
    }

.setting-card-note[b-nztxy5wwyp] {
    font-family: var(--font-light);
    color: var(--color-text-muted);
    font-size: 0.8em;
    font-style: italic;
    margin: 0.4em 0 0 0;
}

/* Pravila za male kolicine: kolicina, postotak, ukloni. */
.rules-table[b-nztxy5wwyp] {
    margin: 0.6em 0 0 0;
    display: flex;
    flex-direction: column;
    gap: 0.5em;
    align-items: flex-start;
}

.rules-row[b-nztxy5wwyp] {
    display: grid;
    grid-template-columns: 6em 9em auto;
    gap: 0.6em;
    align-items: center;
}

.shifts-table .rules-row[b-nztxy5wwyp] {
    grid-template-columns: 8em 8em auto;
}

.rules-header span[b-nztxy5wwyp] {
    font-family: var(--font-light);
    font-size: 0.8em;
    color: var(--color-text-muted);
}

.rules-percent[b-nztxy5wwyp] {
    display: flex;
    align-items: center;
    gap: 0.4em;
}

/* Postavke poslovanja: zaglavlje s pretragom, kategorije, kartica po kategoriji, red po postavci. */
.bs-header[b-nztxy5wwyp] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: var(--space-md);
    flex-wrap: wrap;
}

.bs-search[b-nztxy5wwyp] {
    max-width: 16em;
    margin-bottom: var(--space-md);
}

.bs-chips[b-nztxy5wwyp] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
    margin-bottom: var(--space-md);
}

.bs-chip[b-nztxy5wwyp] {
    font-family: var(--font-regular);
    font-size: 0.85em;
    color: var(--color-text-muted);
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: 2em;
    padding: 0.3em 0.9em;
    cursor: pointer;
}

    .bs-chip span[b-nztxy5wwyp] {
        margin-left: 0.3em;
        opacity: 0.7;
    }

    .bs-chip.active[b-nztxy5wwyp] {
        color: white;
        background: var(--color-primary);
        border-color: var(--color-primary);
    }

.bs-card[b-nztxy5wwyp] {
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: 1em;
    margin-bottom: var(--space-md);
    overflow: hidden;
}

.bs-card-heading[b-nztxy5wwyp] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 0.5em;
    padding: 0.8em 1.2em;
}

    .bs-card-heading strong[b-nztxy5wwyp] {
        font-family: var(--font-medium);
        color: var(--color-text-dark);
    }

    .bs-card-heading span[b-nztxy5wwyp] {
        font-family: var(--font-light);
        font-size: 0.8em;
        color: var(--color-text-muted);
    }

.bs-subgroup[b-nztxy5wwyp] {
    font-family: var(--font-regular);
    font-size: 0.78em;
    color: var(--color-text-muted);
    padding: 0.6em 1.2em 0;
    border-top: 1px solid var(--color-border-light);
}

.bs-item[b-nztxy5wwyp] {
    border-top: 1px solid var(--color-border-light);
}

.bs-subgroup + .bs-item[b-nztxy5wwyp] {
    border-top: none;
}

.bs-row[b-nztxy5wwyp] {
    display: flex;
    align-items: center;
    gap: 0.8em;
    padding: 0.7em 1.2em;
}

    .bs-row:not(.static):hover[b-nztxy5wwyp] {
        background: var(--color-bg-header);
    }

/* Zavisna postavka uvučena ispod one od koje zavisi. */
.bs-item.child .bs-row[b-nztxy5wwyp] {
    padding-left: 3em;
}

/* Dugme preko cijelog reda: poništava globalni stil dugmeta (flex, 44px, okvir). */
.bs-toggle[b-nztxy5wwyp] {
    flex: 1;
    min-width: 0;
    min-height: 0;
    display: flex;
    align-items: center;
    gap: 0.6em;
    padding: 0;
    border: none;
    background: none;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

    .bs-toggle:focus-visible[b-nztxy5wwyp] {
        outline: 2px solid var(--color-primary);
        outline-offset: 2px;
        border-radius: 0.3em;
    }

.bs-pill[b-nztxy5wwyp] {
    flex-shrink: 0;
    font-family: var(--font-regular);
    font-size: 0.78em;
    color: var(--color-text-dark);
    background: var(--color-bg-header);
    border: 1px solid var(--color-border-light);
    border-radius: 2em;
    padding: 0.1em 0.7em;
    white-space: nowrap;
}

.bs-chevron[b-nztxy5wwyp] {
    flex-shrink: 0;
    font-size: 0.8em;
    color: var(--color-text-muted);
    transition: transform 0.15s;
}

    .bs-chevron.open[b-nztxy5wwyp] {
        transform: rotate(180deg);
    }

/* Bootstrapov prekidač bez njegovog uvlačenja: stoji u svojoj koloni lijevo od naziva. */
.bs-switch.form-check[b-nztxy5wwyp] {
    flex-shrink: 0;
    width: 2.2em;
    min-height: 0;
    margin: 0;
    padding: 0;
}

    .bs-switch .form-check-input[b-nztxy5wwyp] {
        float: none;
        width: 2.2em;
        height: 1.2em;
        margin: 0;
        cursor: pointer;
    }

        .bs-switch .form-check-input:checked[b-nztxy5wwyp] {
            background-color: var(--color-primary);
            border-color: var(--color-primary);
        }

        .bs-switch .form-check-input:focus[b-nztxy5wwyp] {
            border-color: var(--color-primary);
            box-shadow: 0 0 0 0.15rem rgba(40, 138, 237, 0.25);
        }

        .bs-switch .form-check-input:disabled[b-nztxy5wwyp] {
            cursor: not-allowed;
        }

.bs-value-icon[b-nztxy5wwyp] {
    flex-shrink: 0;
    width: 2.2em;
    text-align: center;
    margin-top: 0.25em;
    color: var(--color-text-muted);
}

.bs-body[b-nztxy5wwyp] {
    flex: 1;
    min-width: 0;
    display: block;
}

.bs-name[b-nztxy5wwyp] {
    font-family: var(--font-regular);
    font-size: 0.92em;
    color: var(--color-text-dark);
    margin: 0;
}

.bs-tag[b-nztxy5wwyp] {
    font-family: var(--font-light);
    font-size: 0.72em;
    border-radius: 2em;
    padding: 0.1em 0.6em;
    margin-left: 0.4em;
    white-space: nowrap;
}

    .bs-tag.warning[b-nztxy5wwyp] {
        background: #fff3cd;
        color: #664d03;
    }

.bs-summary[b-nztxy5wwyp] {
    display: block;
    font-family: var(--font-light);
    font-size: 0.85em;
    color: var(--color-text-muted);
}

.bs-parent[b-nztxy5wwyp] {
    margin-right: 0.3em;
}

/* Poravnato s nazivom, ispod prekidača. */
.bs-details[b-nztxy5wwyp] {
    margin: 0 1.2em 0.8em 4.2em;
    padding: 0.7em 0.9em;
    border-radius: 0.6em;
    background: var(--color-bg-header);
}

.bs-item.child .bs-details[b-nztxy5wwyp] {
    margin-left: 6em;
}

    .bs-details p[b-nztxy5wwyp] {
        font-family: var(--font-light);
        font-size: 0.85em;
        color: var(--color-text-dark);
        margin: 0;
    }

/* Ostaje na dnu ekrana dok se lista skrola, samo kad ima nespremljenih izmjena. */
.bs-save-bar[b-nztxy5wwyp] {
    position: sticky;
    bottom: 0;
    z-index: 5;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.6em;
    padding: 0.7em 1.2em;
    border-radius: 1em;
    background: #e7f1fd;
    border: 1px solid var(--color-primary);
}

    .bs-save-bar span[b-nztxy5wwyp] {
        font-family: var(--font-regular);
        color: var(--color-text-dark);
    }

    .bs-save-bar div[b-nztxy5wwyp] {
        display: flex;
        gap: 0.5em;
    }

@media (max-width: 576px) {
    .bs-search[b-nztxy5wwyp] {
        max-width: none;
    }

    /* Jedan red koji se pomjera prstom, umjesto četiri reda kategorija. */
    .bs-chips[b-nztxy5wwyp] {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 0.2em;
    }

    .bs-chip[b-nztxy5wwyp] {
        flex-shrink: 0;
        white-space: nowrap;
    }

    .bs-item.child .bs-row[b-nztxy5wwyp] {
        padding-left: 2em;
    }

    /* Vrijednost ispod opisa, da ne stisne naziv u tri reda. */
    .bs-toggle[b-nztxy5wwyp] {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        column-gap: 0.6em;
        row-gap: 0.3em;
    }

    .bs-body[b-nztxy5wwyp] {
        grid-column: 1;
        grid-row: 1;
    }

    .bs-pill[b-nztxy5wwyp] {
        grid-column: 1;
        grid-row: 2;
        justify-self: start;
    }

    .bs-chevron[b-nztxy5wwyp] {
        grid-column: 2;
        grid-row: 1 / span 2;
    }

    .bs-details[b-nztxy5wwyp],
    .bs-item.child .bs-details[b-nztxy5wwyp] {
        margin-left: 1.2em;
    }
}

.role-picks[b-nztxy5wwyp] {
    margin-top: 0.6em;
}

    .role-picks > label[b-nztxy5wwyp] {
        font-family: var(--font-light);
        color: var(--color-text-muted);
        font-size: 0.85em;
        margin-bottom: 0.3em;
    }

.role-pick-list[b-nztxy5wwyp] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(13em, 1fr));
    gap: 0.3em 1em;
}

.role-pick[b-nztxy5wwyp] {
    display: flex;
    align-items: center;
    gap: 0.5em;
    font-size: 0.9em;
    cursor: pointer;
}

    .role-pick .form-check-input[b-nztxy5wwyp] {
        margin: 0;
        flex-shrink: 0;
    }
/* _content/ArasWeb/Pages/Sifarnik/AddMeasuringEquipment.razor.rz.scp.css */
#equipment-container[b-q6cfb4hbsm] {
    height: 95%;
    overflow-y: scroll;
}

.container[b-q6cfb4hbsm] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    background: white;
    padding: 1em;
    border-radius: 1em;
    margin: 0;
    margin-bottom: 1em;
}

#item-info-container[b-q6cfb4hbsm],
#quantity-info-container[b-q6cfb4hbsm] {
    width: 100%;
    height: 95%;
    display: flex;
    flex-direction: column;
    margin-top: 1em;
    justify-content: space-between;
}

.input-row[b-q6cfb4hbsm] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    position: relative;
    margin-bottom: 2em;
}

.input-box[b-q6cfb4hbsm] {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: flex-start;
    width: 45%;
    position: relative;
}

    .input-box label[b-q6cfb4hbsm] {
        width: 100%;
        font-family: 'Ubuntu-Light';
        font-size: 0.9em;
        margin-bottom: 0.5em;
    }

    .input-box span[b-q6cfb4hbsm] {
        font-size: 1.2em;
        font-family: 'Ubuntu-Medium';
    }
/* _content/ArasWeb/Pages/Sifarnik/Alati.razor.rz.scp.css */
#alati-page[b-lcmed4b5zi] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#content-container[b-lcmed4b5zi] {
    width: 100%;
    flex: 1;
    display: flex;
    flex-direction: column;
    background: white;
    border-radius: 1em;
    padding: 1em;
    min-height: 0;
}

.list-wrapper[b-lcmed4b5zi] {
    flex: 1;
    overflow: auto;
    min-height: 0;
}

.item-details[b-lcmed4b5zi] {
    text-align: left;
    width: 90%;
}

.list .item-details label[b-lcmed4b5zi] {
    font-size: 0.9em;
}

#tools-list-wrapper label[b-lcmed4b5zi] {
    width: 24%;
}

.tool-optimal-quantity[b-lcmed4b5zi] {
    border-left: 0.3em solid #5cb85c;
}

.tool-min-quantity[b-lcmed4b5zi] {
    border-left: 0.3em solid var(--color-danger);
    background: rgba(220, 53, 69, 0.1)
}

.tool-min-quantity .quantity[b-lcmed4b5zi] {
    color: var(--color-danger);
    font-family: var(--font-medium);
}

#tools-list-wrapper .item-details .quantity[b-lcmed4b5zi] {
    width: 15%;
    text-align: center;
}

#tools-list-wrapper .item-details .location[b-lcmed4b5zi] {
    text-align: center;
}

#tools-list-wrapper .item-details .name[b-lcmed4b5zi] {
    width: 35%;
}
/* _content/ArasWeb/Pages/Sifarnik/Infrastruktura.razor.rz.scp.css */
#infrastruktura-page[b-dqqh8lkp77] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#content-container[b-dqqh8lkp77] {
    width: 100%;
    height: 92%;
    display: flex;
    flex-direction: column;
    background: white;
    border-radius: 1em;
    padding: 1em 0;
}

.sub-tabs[b-dqqh8lkp77] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
    padding: 0 1em 1em 1em;
}

.sub-tab[b-dqqh8lkp77] {
    border: 1px solid #e4eef2;
    background: white;
    color: #55646c;
    border-radius: 2em;
    padding: 0.4em 1em;
    font-size: 0.85em;
    cursor: pointer;
}

.sub-tab.active[b-dqqh8lkp77] {
    background: #e4eef2;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.list-wrapper[b-dqqh8lkp77] {
    height: 100%;
    overflow-y: auto;
    padding: 0 1em;
}

.item-details[b-dqqh8lkp77] {
    text-align: left;
    width: 85%;
}

.list .item-details label[b-dqqh8lkp77] {
    font-size: 0.9em;
}

.item-details .name[b-dqqh8lkp77] {
    width: 26%;
}

.item-details .code[b-dqqh8lkp77] {
    width: 14%;
}

.item-details .location[b-dqqh8lkp77] {
    width: 20%;
    color: #6c757d;
}

.item-details .template[b-dqqh8lkp77] {
    width: 22%;
}

.item-details .status[b-dqqh8lkp77] {
    width: 18%;
    color: #6c757d;
}

.in-plan[b-dqqh8lkp77] {
    border-left: 0.3em solid #5cb85c !important;
}

.no-plan[b-dqqh8lkp77] {
    border-left: 0.3em solid #d7e3e8 !important;
}

/* Bez ::deep (tijelo je element ove stranice), a s .custom-modal-body da nadjača ArasModal,
   koji ga poravnava na početak - forma bi bila uža od modala. */
.custom-modal-body.infra-modal-body[b-dqqh8lkp77] {
    align-items: stretch;
    max-height: 60vh;
    overflow-y: auto;
}

[b-dqqh8lkp77] .infra-modal-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1em;
    padding: 0.5em;
}

[b-dqqh8lkp77] .infra-modal-grid .full-row {
    grid-column: 1 / -1;
}

[b-dqqh8lkp77] .infra-modal-grid .modal-input-box {
    display: flex;
    flex-direction: column;
    margin-bottom: 0;
}

[b-dqqh8lkp77] .infra-modal-grid .modal-input-box label {
    font-size: 0.85em;
    margin-bottom: 0.4em;
    font-family: 'Ubuntu-Light';
}

#remove-btn[b-dqqh8lkp77] {
    margin-right: auto;
}

@media (max-width: 700px) {
    [b-dqqh8lkp77] .infra-modal-grid {
        grid-template-columns: 1fr;
    }
}
/* _content/ArasWeb/Pages/Sifarnik/Masine.razor.rz.scp.css */
#masine-page[b-25r8eu93kg] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#content-container[b-25r8eu93kg] {
    width: 100%;
    height: 92%;
    display: flex;
    flex-direction: column;
    background: white;
    border-radius: 1em;
    padding: 1em 0;
}

.list-wrapper[b-25r8eu93kg] {
    height: 100%;
    overflow-y: auto;
    padding: 0 1em;
}

.item-details[b-25r8eu93kg] {
    text-align: left;
    width: 85%;
}

.list .item-details label[b-25r8eu93kg] {
    font-size: 0.9em;
}

.item-details .name[b-25r8eu93kg] {
    width: 19%;
}

.item-details .description[b-25r8eu93kg] {
    width: 14%;
}

.item-details .opis[b-25r8eu93kg] {
    width: 17%;
}

.item-details .location[b-25r8eu93kg] {
    width: 17%;
    color: #6c757d;
}

.item-details .machine-type[b-25r8eu93kg] {
    width: 15%;
}

.item-details .status[b-25r8eu93kg] {
    width: 18%;
    color: #6c757d;
}

.active-machine[b-25r8eu93kg] {
    border-left: 0.3em solid #5cb85c !important;
}

.inactive-machine[b-25r8eu93kg] {
    border-left: 0.3em solid #d9534f !important;
}

/* Machine modal grid layout */
[b-25r8eu93kg] .machine-modal-body {
    max-height: 60vh;
    overflow-y: auto;
}

[b-25r8eu93kg] .machine-modal-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1em;
    padding: 0.5em;
}

[b-25r8eu93kg] .machine-modal-grid .modal-input-box {
    display: flex;
    flex-direction: column;
    margin-bottom: 0;
}

[b-25r8eu93kg] .machine-modal-grid .modal-input-box label {
    font-size: 0.85em;
    margin-bottom: 0.4em;
    font-family: 'Ubuntu-Light';
}

[b-25r8eu93kg] .machine-modal-grid .modal-input-box input {
    font-size: 0.9em;
}

/* Pillovi vrste - isti izgled kao tabovi šifarnika šablona. */
.sub-tabs[b-25r8eu93kg] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
    padding: 0 1em 1em 1em;
}

.sub-tab[b-25r8eu93kg] {
    border: 1px solid #e4eef2;
    background: white;
    color: #55646c;
    border-radius: 2em;
    padding: 0.4em 1em;
    font-size: 0.85em;
    cursor: pointer;
}

.kind-change-note[b-25r8eu93kg] {
    margin: 0.4em 0 0 0;
    font-size: 0.8em;
    color: #9a6700;
}

.sub-tab.active[b-25r8eu93kg] {
    background: #e4eef2;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}
/* _content/ArasWeb/Pages/Sifarnik/Materijali.razor.rz.scp.css */
#materijali-page[b-luzke9vrxi] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#content-container[b-luzke9vrxi] {
    width: 100%;
    height: 92%;
    display: flex;
    flex-direction: column;
    background: white;
    border-radius: 1em;
    padding: 1em;
}

/* #content-container is a column flexbox with .price-tabs as a sibling above this -
   flex: 1 lets this take whatever height .price-tabs doesn't use, instead of the fixed
   100% that made the two together overflow the white card. min-height: 0 is required
   for a flex child to shrink below its content size so the inner ul's own scroll (see
   site.css .list-wrapper ul) kicks in instead of pushing the list out past the card. */
.list-wrapper[b-luzke9vrxi] {
    flex: 1;
    min-height: 0;
}

.item-details[b-luzke9vrxi] {
    width: 95%;
}

.list .item-details label[b-luzke9vrxi] {
    font-size: 0.9em;
    text-align: left;
}

.material-code-label[b-luzke9vrxi] {
    word-break: break-all;
}

.col-type[b-luzke9vrxi] {
}

.col-thickness[b-luzke9vrxi] {
    width: 18%;
}

.col-density[b-luzke9vrxi] {
    width: 25%;
}

.col-location[b-luzke9vrxi] {
    width: 15%;
    word-break: break-all;
}

.col-price[b-luzke9vrxi] {
    width: 15%;
}

.list .item-details label.col-type[b-luzke9vrxi],
.list .item-details label.col-thickness[b-luzke9vrxi],
.list .item-details label.col-density[b-luzke9vrxi],
.list .item-details label.col-location[b-luzke9vrxi],
.list .item-details label.col-price[b-luzke9vrxi],
.list .item-details label.material-code-label[b-luzke9vrxi],
.list-header .item-details label.col-type[b-luzke9vrxi],
.list-header .item-details label.col-thickness[b-luzke9vrxi],
.list-header .item-details label.col-density[b-luzke9vrxi],
.list-header .item-details label.col-location[b-luzke9vrxi],
.list-header .item-details label.col-price[b-luzke9vrxi],
.list-header .item-details label.material-code-label[b-luzke9vrxi] {
    text-align: center;
}

.price-tabs[b-luzke9vrxi] {
    display: flex;
    gap: 0.5em;
    margin-bottom: 1em;
}

.tab-button[b-luzke9vrxi] {
    border: none;
    background: white;
    padding: 0.4em 1.2em;
    border-radius: 2em;
    font-family: var(--font-medium);
    color: var(--color-muted);
    cursor: pointer;
}

.tab-button.active[b-luzke9vrxi] {
    background: var(--color-primary);
    color: white;
}

.readonly input[b-luzke9vrxi],
.readonly select[b-luzke9vrxi] {
    background: lightgray;
    cursor: default;
}
/* _content/ArasWeb/Pages/Sifarnik/MeasuringEquipmentDetails.razor.rz.scp.css */
#equipment-container[b-lvyrphkje5] {
    height: 95%;
    overflow-y: scroll;
}

.container[b-lvyrphkje5] {
    width: 48%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    background: white;
    padding: 1em;
    border-radius: 1em;
    margin: 0;
    margin-bottom: 1em;
}

#item-info-container[b-lvyrphkje5],
#quantity-info-container[b-lvyrphkje5] {
    width: 100%;
    height: 95%;
    display: flex;
    flex-direction: column;
    margin-top: 1em;
    justify-content: space-between;
}

.input-row[b-lvyrphkje5] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    position: relative;
    margin-bottom: 2em;
}

.input-box[b-lvyrphkje5] {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: flex-start;
    width: 45%;
    position: relative;
}

    .input-box label[b-lvyrphkje5] {
        width: 100%;
        font-family: 'Ubuntu-Light';
        font-size: 0.9em;
        margin-bottom: 0.5em;
    }

    .input-box span[b-lvyrphkje5] {
        font-size: 1.2em;
        font-family: 'Ubuntu-Medium';
    }

.quantity-info[b-lvyrphkje5] {
    background: white;
    padding: 1em;
    border-radius: 0.5em;
    width: 45%;
}

    .quantity-info span[b-lvyrphkje5] {
        font-size: 1.5em;
        color: #14425a;
        font-family: 'Ubuntu-Medium';
    }

    .quantity-info label[b-lvyrphkje5] {
        font-size: 0.8em;
        color: #6c757d;
        margin-bottom: 0;
    }
/* _content/ArasWeb/Pages/Sifarnik/MjernaOprema.razor.rz.scp.css */
#mjerna-oprema-page[b-a72mjc1q96] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#content-container[b-a72mjc1q96] {
    width: 100%;
    height: 92%;
    display: flex;
    flex-direction: column;
    background: white;
    border-radius: 1em;
    padding: 1em;
}

#equipment-filters[b-a72mjc1q96] {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.5em;
    width: 100%;
    padding: 0 0 1em 0;
    font-family: var(--font-light);
    font-size: 0.9em;
}

.filter-box[b-a72mjc1q96] {
    margin-right: 1em;
    display: flex;
    flex-direction: column;
}

    .filter-box label[b-a72mjc1q96] {
        margin-bottom: 0.5em;
    }

    .filter-box select[b-a72mjc1q96] {
        width: 15em;
        padding: 0.5em 0.2em;
    }

    .filter-box img[b-a72mjc1q96] {
        width: 1em;
        height: 1em;
        margin: 0 0.5em;
    }

.list-wrapper[b-a72mjc1q96] {
    height: 100%;
    overflow-y: auto;
}

.list-header[b-a72mjc1q96],
.list-wrapper ul li[b-a72mjc1q96] {
    display: grid;
    grid-template-columns: minmax(160px, 1.8fr) minmax(90px, 1fr) minmax(130px, 1.4fr) minmax(110px, 1.3fr) minmax(70px, 0.6fr) 2.5em;
    column-gap: 1em;
    align-items: center;
}

.item-details[b-a72mjc1q96] {
    display: contents;
    text-align: left;
}

.list .item-details label[b-a72mjc1q96] {
    font-size: 0.9em;
}

.item-details label[b-a72mjc1q96] {
    width: auto;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.item-details label:not(:first-child)[b-a72mjc1q96] {
    text-align: left;
}

.fa-eye[b-a72mjc1q96] {
    justify-self: center;
}

.actions[b-a72mjc1q96] {
    display: flex;
    gap: 1em;
}

.actions i[b-a72mjc1q96] {
    cursor: pointer;
    color: var(--color-primary);
}

.actions i:hover[b-a72mjc1q96] {
    opacity: 0.7;
}
/* _content/ArasWeb/Pages/Sifarnik/Ostalo.razor.rz.scp.css */
#ostalo-page[b-eqhw377x6g] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#content-container[b-eqhw377x6g] {
    width: 100%;
    flex: 1;
    display: flex;
    flex-direction: column;
    background: white;
    border-radius: 1em;
    padding: 1em;
    min-height: 0;
}

.list-wrapper[b-eqhw377x6g] {
    flex: 1;
    overflow: auto;
    min-height: 0;
}

.item-details[b-eqhw377x6g] {
    width: 90%;
}

.list .item-details label[b-eqhw377x6g] {
    font-size: 0.9em;
    text-align: left;
}
/* _content/ArasWeb/Pages/Sifarnik/PovrsinskObrade.razor.rz.scp.css */
#povrsinske-obrade-page[b-sqofhfj049] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#content-container[b-sqofhfj049] {
    width: 100%;
    height: 92%;
    display: flex;
    flex-direction: column;
    background: white;
    border-radius: 1em;
    padding: 1em;
}

/* #content-container is a column flexbox with .price-tabs as a sibling above this -
   flex: 1 lets this take whatever height .price-tabs doesn't use, instead of the fixed
   100% that made the two together overflow the white card. min-height: 0 is required
   for a flex child to shrink below its content size so the inner ul's own scroll (see
   site.css .list-wrapper ul) kicks in instead of pushing the list out past the card. */
.list-wrapper[b-sqofhfj049] {
    flex: 1;
    min-height: 0;
}

.item-details[b-sqofhfj049] {
    width: 90%;
}

.list .item-details label[b-sqofhfj049] {
    font-size: 0.9em;
    text-align: left;
}

.price-tabs[b-sqofhfj049] {
    display: flex;
    gap: 0.5em;
    margin-bottom: 1em;
}

.tab-button[b-sqofhfj049] {
    border: none;
    background: white;
    padding: 0.4em 1.2em;
    border-radius: 2em;
    font-family: var(--font-medium);
    color: var(--color-muted);
    cursor: pointer;
}

.tab-button.active[b-sqofhfj049] {
    background: var(--color-primary);
    color: white;
}

.readonly input[b-sqofhfj049] {
    background: lightgray;
    cursor: default;
}
/* _content/ArasWeb/Pages/Sifarnik/SabloniOdrzavanja.razor.rz.scp.css */
#sabloni-page[b-ntwp2s56mj] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#content-container[b-ntwp2s56mj] {
    width: 100%;
    flex: 1;
    display: flex;
    flex-direction: column;
    background: white;
    border-radius: 1em;
    padding: 1em;
    min-height: 0;
}

/* Tabovi kategorija - isti izgled kao pod-tabovi "Mašine i oprema" u održavanju. */
.sub-tabs[b-ntwp2s56mj] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
    margin-bottom: 1em;
}

.sub-tab[b-ntwp2s56mj] {
    border: 1px solid #e4eef2;
    background: white;
    color: #55646c;
    border-radius: 2em;
    padding: 0.4em 1em;
    font-size: 0.85em;
    cursor: pointer;
}

.sub-tab.active[b-ntwp2s56mj] {
    background: #e4eef2;
    color: #14425a;
    font-family: 'Ubuntu-Medium';
}

.list-wrapper[b-ntwp2s56mj] {
    flex: 1;
    overflow: auto;
    min-height: 0;
}

.item-details[b-ntwp2s56mj] {
    width: 90%;
    text-align: left;
}

.list .item-details label[b-ntwp2s56mj] {
    font-size: 0.9em;
    text-align: left;
}

.item-details .name[b-ntwp2s56mj] {
    width: 30%;
}

.item-details .manufacturer[b-ntwp2s56mj] {
    width: 22%;
}

.item-details .type[b-ntwp2s56mj] {
    width: 22%;
    color: #6c757d;
}

.item-details .count[b-ntwp2s56mj] {
    width: 13%;
    color: #6c757d;
}

/* Detalj šablona */
.template-detail[b-ntwp2s56mj] {
    flex: 1;
    overflow: auto;
    min-height: 0;
}

.detail-head[b-ntwp2s56mj] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1em;
    padding-bottom: 1em;
    border-bottom: 1px solid #e4eef2;
    margin-bottom: 1em;
}

.detail-head h5[b-ntwp2s56mj] {
    color: #14425a;
    font-family: 'Ubuntu-Medium';
    margin-bottom: 0.3em;
}

.detail-sub[b-ntwp2s56mj] {
    font-size: 0.85em;
    color: #6c757d;
}

.detail-note[b-ntwp2s56mj] {
    margin-top: 0.6em;
    margin-bottom: 0;
    font-size: 0.85em;
    color: #14425a;
    background: #e4eef2;
    border-radius: 0.5em;
    padding: 0.6em 0.8em;
    max-width: 60em;
}

.detail-actions[b-ntwp2s56mj] {
    display: flex;
    gap: 0.5em;
    flex-shrink: 0;
}

.empty-note[b-ntwp2s56mj] {
    font-size: 0.9em;
    color: #6c757d;
    padding: 2em 0;
    text-align: center;
}

.interval-cards[b-ntwp2s56mj] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(24em, 1fr));
    gap: 1em;
}

.interval-card[b-ntwp2s56mj] {
    background: white;
    border: 1px solid #e4eef2;
    border-radius: 1em;
    padding: 0.8em 1em;
}

.interval-head[b-ntwp2s56mj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.6em;
}

.interval-label[b-ntwp2s56mj] {
    font-family: 'Ubuntu-Medium';
    color: #14425a;
    font-size: 0.9em;
}

.interval-count[b-ntwp2s56mj] {
    background: #e4eef2;
    color: #14425a;
    border-radius: 1em;
    padding: 0.1em 0.6em;
    font-size: 0.75em;
}

.task-list[b-ntwp2s56mj] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.task-row[b-ntwp2s56mj] {
    display: flex;
    align-items: center;
    gap: 0.5em;
    padding: 0.4em 0;
    border-top: 1px solid #f2f5f6;
    font-size: 0.85em;
    cursor: grab;
}

.task-row.dragging[b-ntwp2s56mj] {
    opacity: 0.4;
    background: #e4eef2;
    border-radius: 0.4em;
}

.drag-handle[b-ntwp2s56mj] {
    color: #cdd7db;
    cursor: grab;
}

.task-row:hover .drag-handle[b-ntwp2s56mj] {
    color: #6c757d;
}

.task-name[b-ntwp2s56mj] {
    flex: 1;
    color: #14425a;
}

.task-performer[b-ntwp2s56mj] {
    color: #6c757d;
    font-size: 0.9em;
    white-space: nowrap;
}

.task-actions[b-ntwp2s56mj] {
    display: flex;
    gap: 0.5em;
    color: var(--ar-primary);
}

.task-actions i[b-ntwp2s56mj] {
    cursor: pointer;
}

.task-actions i.disabled[b-ntwp2s56mj] {
    color: #cdd7db;
    pointer-events: none;
}

.task-actions .fa-xmark[b-ntwp2s56mj] {
    color: #d9534f;
}

/* Modali */
[b-ntwp2s56mj] .modal-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1em;
    padding: 0.5em;
}

[b-ntwp2s56mj] .modal-grid .modal-input-box {
    display: flex;
    flex-direction: column;
    margin-bottom: 0;
}

[b-ntwp2s56mj] .modal-grid .modal-input-box.full-row {
    grid-column: 1 / -1;
}

[b-ntwp2s56mj] .modal-grid .modal-input-box label {
    font-size: 0.85em;
    margin-bottom: 0.4em;
    font-family: 'Ubuntu-Light';
}

[b-ntwp2s56mj] .modal-grid .hint {
    font-size: 0.75em;
    color: #6c757d;
    margin-top: 0.3em;
}

[b-ntwp2s56mj] .task-kind {
    display: flex;
    gap: 1.5em;
    flex-wrap: wrap;
}

[b-ntwp2s56mj] .modal-grid .modal-input-box .task-kind-option {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    margin: 0;
    font-size: 0.9em;
    font-family: 'Ubuntu-Medium';
    color: #14425a;
    cursor: pointer;
}

.back-btn[b-ntwp2s56mj] {
    white-space: nowrap;
}
/* _content/ArasWeb/Pages/Sifarnik/VrsteOpremeModal.razor.rz.scp.css */
/* ArasModal poravnava .custom-modal-body na početak - tabela i forma bi se skupile. */
.custom-modal-body.types-modal-body[b-2zt805s33p] {
    align-items: stretch;
    max-height: 65vh;
    overflow-y: auto;
}

.types-hint[b-2zt805s33p] {
    font-size: 0.85em;
    color: #6c757d;
    margin: 0 0 0.8em 0;
}

.types-table-wrapper[b-2zt805s33p] {
    overflow-x: auto;
}

.types-table[b-2zt805s33p] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85em;
}

.types-table th[b-2zt805s33p] {
    font-family: 'Ubuntu-Medium';
    color: #6c757d;
    font-weight: normal;
    text-align: left;
    padding: 0.4em 0.6em;
    border-bottom: 1px solid #e4eef2;
}

.types-table td[b-2zt805s33p] {
    padding: 0.45em 0.6em;
    color: #14425a;
    border-bottom: 1px solid #f1f5f7;
}

.types-table tbody tr[b-2zt805s33p] {
    cursor: pointer;
}

.types-table tbody tr:hover[b-2zt805s33p],
.types-table tbody tr.selected[b-2zt805s33p] {
    background: #e4eef2;
}

.types-table tbody tr.inactive td[b-2zt805s33p] {
    color: #6c757d;
}

.types-form[b-2zt805s33p] {
    margin-top: 1em;
    padding-top: 0.8em;
    border-top: 1px solid #e4eef2;
}

.types-form-title[b-2zt805s33p] {
    display: block;
    font-family: 'Ubuntu-Medium';
    color: #14425a;
    margin-bottom: 0.6em;
}

.types-form-grid[b-2zt805s33p] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.8em 1em;
}

.types-form-grid .modal-input-box[b-2zt805s33p] {
    display: flex;
    flex-direction: column;
    margin-bottom: 0;
}

.types-form-grid .modal-input-box label[b-2zt805s33p] {
    font-size: 0.85em;
    margin-bottom: 0.4em;
}

.types-active[b-2zt805s33p] {
    display: flex;
    align-items: center;
    gap: 0.5em;
    font-size: 0.85em;
    color: #14425a;
    align-self: end;
    padding-bottom: 0.5em;
}

.types-note[b-2zt805s33p] {
    font-size: 0.8em;
    color: #6c757d;
    margin: 0.6em 0 0 0;
}

@media (max-width: 700px) {
    .types-form-grid[b-2zt805s33p] {
        grid-template-columns: 1fr;
    }
}
/* _content/ArasWeb/Pages/Technology/OrderArticleDetails.razor.rz.scp.css */
#create-article[b-wc3sgaydju] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}

#create-article-container[b-wc3sgaydju] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

#status-info[b-wc3sgaydju] {
    width: 100%;
    height: auto;
    border-radius: 1em;
    margin-bottom: 1em;
    padding: 0.5em 1em;
    display: flex;
    align-items: center;
    justify-content: center;
}

    #status-info span[b-wc3sgaydju] {
        border-radius: 2em;
        text-align: center;
        width: auto;
        display: inline-flex;
        padding: 0.3em 1.5em;
        word-break: break-all;
        font-family: 'Ubuntu-Medium';
        margin-right: 1em;
    }

        #status-info span img[b-wc3sgaydju] {
            width: 1.5em;
            height: 1.5em;
            margin-right: 0.5em;
        }

.article-in-progress[b-wc3sgaydju] {
    background: rgba(13, 110, 253, 0.3);
}

.article-finished[b-wc3sgaydju] {
    background: rgba(144, 238, 144, 0.5);
}

.article-new[b-wc3sgaydju] {
    background: rgba(211, 211, 211, 0.5);
}

#change-status[b-wc3sgaydju],
#pause-work[b-wc3sgaydju] {
    margin-right: 1em;
}

#article-info[b-wc3sgaydju] {
    height: 100%;
    width: 50%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    background: white;
    padding: 1em;
    border-radius: 1em;
    overflow-y: scroll;
}

#article-info h5[b-wc3sgaydju] {
    margin-bottom: 2em;
}

.input-box[b-wc3sgaydju] {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: flex-start;
    width: 100%;
    margin-bottom: 1em;
    position: relative;
}

    .input-box label[b-wc3sgaydju]{
        width: 100%;
        margin-bottom: 0.3em;
        font-family: 'Ubuntu-Light'
    }

    .input-box span[b-wc3sgaydju] {
        border: none;
        padding: 0;
    }

#article-shape[b-wc3sgaydju] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

    #article-shape div[b-wc3sgaydju] {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 40%;
        padding: 0.5em;
        border-radius: 0.5em;
    }

.selected-shape[b-wc3sgaydju] {
    border: 0.1em solid #5cb85c;
    background: #e4eef2;
}

.unselected-shape[b-wc3sgaydju] {
    border: 0.1em solid lightgray;
    background: white;
    opacity: 0.5;
}

.circle[b-wc3sgaydju],
.square[b-wc3sgaydju] {
    height: 2em;
    width: 2em;
    background-color: #14425a;
    display: inline-flex;
}

.circle[b-wc3sgaydju] {
    border-radius: 50%;
}

.l-profile[b-wc3sgaydju] {
    height: 2em;
    width: 2em;
    display: inline-block;
    background: #14425a;
    clip-path: polygon(0% 0%, 30% 0%, 30% 70%, 100% 70%, 100% 100%, 0% 100%);
}

.square-tube[b-wc3sgaydju] {
    height: 2em;
    width: 2em;
    display: inline-block;
    border: 0.45em solid #14425a;
    background: transparent;
    box-sizing: border-box;
}

.round-tube[b-wc3sgaydju] {
    height: 2em;
    width: 2em;
    display: inline-block;
    border: 0.45em solid #14425a;
    border-radius: 50%;
    background: transparent;
    box-sizing: border-box;
}

#article-shape .square-tube[b-wc3sgaydju],
#article-shape .round-tube[b-wc3sgaydju] {
    border: 0.45em solid #14425a;
}

#create-article-btns[b-wc3sgaydju] {
    width: 100%;
    margin: 2em 0;
    display: flex;
}

    #create-article-btns .save-article[b-wc3sgaydju] {
        margin-right: 1em;
    }


/*
    MODAL ZA IZMJENU STATUSA
*/

#change-order-article-status[b-wc3sgaydju],
#delegate-article[b-wc3sgaydju] {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

#change-order-article-status #note[b-wc3sgaydju]{
    width: 70%;
}

    #change-order-article-status p[b-wc3sgaydju],
    #delegate-article p[b-wc3sgaydju]{
        font-size: 1.5em;
        font-family: 'Ubuntu-Medium';
        margin-bottom: 2em;
        color: var(--ar-primary);
        width: 80%;
        text-align: center;
    }

    #change-order-article-status span[b-wc3sgaydju] {
        font-size: 0.8em;
        font-family: 'Ubuntu-Italic';        
    }

    #change-order-article-status label[b-wc3sgaydju] {
        margin-bottom: 0.5em;
    }

/*
    MODAL ZA DELEGIRANJE
*/

#delegate-article p[b-wc3sgaydju] {
    color: black;
}

    #delegate-article .modal-input-box[b-wc3sgaydju] {
        width: 50%;
        margin-bottom: 1em;
    }
.tech-note-text[b-wc3sgaydju] {
    margin: 0;
    white-space: pre-wrap;
    height: auto;
    min-height: 2.4em;
    background: #f0f6fb;
    color: #14425a;
}
/* _content/ArasWeb/Pages/Technology/WorkOrderMeasurementProtocolData.razor.rz.scp.css */
#generate-pdf[b-m2njfuqmfd] {
    background: white;
    border: 0.05em solid grey;
    color: black;
}

    #generate-pdf img[b-m2njfuqmfd] {
        width: 1.5em;
        height: 1.5em;
        margin-right: 0.5em;
    }

.feature-fill[b-m2njfuqmfd] {
    width: auto;
    margin-bottom: 0.25em;
}

    .feature-fill.feature-missing[b-m2njfuqmfd] {
        border-color: #f0ad4e;
    }

.retired-note[b-m2njfuqmfd] {
    display: block;
    color: #b02a37;
    font-size: 0.8em;
}

.form-hint[b-m2njfuqmfd] {
    color: #6c757d;
    font-size: 0.85em;
    max-width: 40rem;
}

.gdt-group[b-m2njfuqmfd] {
    color: var(--ar-text-muted);
    font-size: var(--ar-fs-sm);
    margin: var(--ar-space-2) 0 var(--ar-space-1);
}

.gdt-options[b-m2njfuqmfd] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--ar-space-2);
    max-width: 40rem;
}

.gdt-option[b-m2njfuqmfd] {
    display: flex;
    align-items: center;
    gap: var(--ar-space-2);
    min-height: 2.5rem;
    padding: var(--ar-space-1) var(--ar-space-3);
    border: 1px solid var(--ar-border-strong);
    border-radius: var(--ar-radius-sm);
    background: var(--ar-bg-surface);
    color: var(--ar-text);
    font-size: var(--ar-fs-md);
    font-weight: var(--ar-fw-regular);
}

    .gdt-option:hover[b-m2njfuqmfd] {
        border-color: var(--ar-navy-400);
        background: var(--ar-bg-hover);
    }

    .gdt-option .gdt-symbol[b-m2njfuqmfd] {
        font-size: 1.3em;
        min-width: 1.2em;
        text-align: center;
    }

.gdt-option.selected[b-m2njfuqmfd] {
    border-color: var(--ar-primary);
    background: var(--ar-primary-soft);
    box-shadow: 0 0 0 1px var(--ar-primary);
}

/* Drugo dugme pored „Dodaj“: isti posao, prozor ostaje otvoren. */
.buttons .next-btn[b-m2njfuqmfd] {
    background: white;
    color: var(--ar-primary);
    border: 1px solid var(--ar-primary);
}

#measurement-reports[b-m2njfuqmfd] {
    display: flex;
    flex-direction: column;
    gap: 0.75em;
    background: white;
    padding: 1em;
    border-radius: 1em;
    margin-top: 2em;
    margin-bottom: 0;
}

    #measurement-reports .section-title[b-m2njfuqmfd] {
        color: #14425a;
        font-family: 'Ubuntu-Medium';
    }

/* Flex, ne inline: kao inline labela pravi red viši od dugmeta i razvlači ostalu dugmad u redu. */
.report-upload[b-m2njfuqmfd] {
    display: flex;
    margin-top: 0;
    margin-bottom: 0;
    cursor: pointer;
}

    .report-upload .btn[b-m2njfuqmfd] {
        display: inline-flex;
        align-items: center;
        gap: 0.3em;
        font-family: 'Ubuntu-Light';
    }

/* Vlastito dugme umjesto sistemskog birača: InputFile se sakriva, klik hvata labela.
   ::deep je obavezan — InputFile je komponenta, pa izolovana CSS ne doseže njen <input>.
   Isto kao u InvoiceDetails. */
[b-m2njfuqmfd] .report-upload input[type="file"] {
    display: none !important;
}

.report-list[b-m2njfuqmfd] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.4em;
}

.report-row[b-m2njfuqmfd] {
    display: flex;
    align-items: center;
    gap: 0.75em;
    padding: 0.5em 0.75em;
    border: 1px solid #ddd;
    border-radius: 0.35em;
}

    .report-row .pdf-icon[b-m2njfuqmfd] {
        color: #d9534f;
        font-size: 1.25em;
    }

    .report-row .img-icon[b-m2njfuqmfd] {
        color: var(--ar-primary);
        font-size: 1.25em;
    }

/* Ime uzima slobodan prostor i skraćuje se, da dugmad ostanu na istom mjestu u svakom redu. */
.report-name[b-m2njfuqmfd] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #14425a;
}

.report-meta[b-m2njfuqmfd] {
    color: #6c757d;
    font-size: 0.85em;
    white-space: nowrap;
}

@media (max-width: 700px) {
    .report-row[b-m2njfuqmfd] {
        flex-wrap: wrap;
    }

    .report-meta[b-m2njfuqmfd] {
        width: 100%;
        white-space: normal;
    }
}
/* _content/ArasWeb/Pages/Technology/WorkOrderPreview.razor.rz.scp.css */
#work-order-wrapper[b-bhti36qwv9] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: scroll;
}

#work-order[b-bhti36qwv9] {
    background: white;
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    padding: 2em;
    border-radius: 1em;
}

#work-order_header[b-bhti36qwv9] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: start;
    border-bottom: 0.1em solid lightgray;
    margin-bottom: 0.5em;
}

    #work-order_header #left[b-bhti36qwv9] {
        width: 78%;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    #work-order_header #title-and-logo[b-bhti36qwv9] {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
    }

        #work-order_header #title-and-logo label[b-bhti36qwv9] {
            font-family: var(--font-bold);
            font-size: 1.5em;
            color: var(--color-text-dark);
            margin-bottom: 0.5em;
        }

    #work-order_header #left #order-general-info[b-bhti36qwv9] {
        width: 100%;
        display: flex;
        flex-direction: column;
        border: 0.01em solid gray;
        border-radius: 0.5em;
        margin-bottom: 0.5em;
    }

    #work-order_header #left .info[b-bhti36qwv9] {
        width: 100%;
        flex-direction: column;
        display: flex;
    }

    #work-order_header #left .info[b-bhti36qwv9] {
        width: 20%;
        border-right: 0.01em solid lightgray;
        border-bottom: 0.01em solid lightgray;
        padding: 0.3em;
        height: 100%;
    }

    /* Broj narudžbe i broj crteža su kratki, a vrsta kupca zna biti duga (MAS-42). */
    #work-order_header #left .first-col[b-bhti36qwv9],
    #work-order_header #left .middle-col[b-bhti36qwv9] {
        width: 40%;
    }

    #work-order_header #left #note .info[b-bhti36qwv9] {
        width: 100% !important;
        background: #f1f1f1;
        border-bottom-left-radius: 0.5em;
        border-bottom-right-radius: 0.5em;
    }

    #work-order_header #left #note .info span[b-bhti36qwv9] {
        color: var(--color-danger);
        font-family: var(--font-bold);
    }

        #work-order_header #left .info label[b-bhti36qwv9],
        #work-order #body .group .info label[b-bhti36qwv9] {
            font-family: var(--font-light);
            font-size: 0.8em;
        }

        #work-order #body .group .info span[b-bhti36qwv9] {
            word-break: break-all;
        }

        /* Naziv se prelama na razmaku, a riječ siječe samo ako sama ne stane. */
        #work-order_header #left .info span[b-bhti36qwv9] {
            overflow-wrap: break-word;
        }

    #work-order_header #left .group[b-bhti36qwv9] {
        display: flex;
        width: 100%;
        justify-content: space-between;
        align-items: center;
        font-size: 1.05em;
    }

    #work-order_header #right[b-bhti36qwv9] {
        display: flex;
        flex-direction: column;
        align-items: end;
        justify-content: start;
        width: 22%;
    }

        #work-order_header #right #qr-img[b-bhti36qwv9] {
            width: 12em;
        }

        #work-order_header #right #logo[b-bhti36qwv9] {
            width: 11em;
        }    

/* Grouped layout: the same fields split into more boxes. .group already draws its own frame, so
   the only thing the split needs is air between the boxes — and the note, which moved down out of
   the header, keeping the red it had up there. */
#work-order #body.grouped .group[b-bhti36qwv9],
#work-order #body.grouped .tbl-box[b-bhti36qwv9] {
    margin-bottom: 0.5em;
}

/* Same weight as .tbl-name above a table, so a titled box and a titled table read alike. */
#work-order #body.grouped .group-title[b-bhti36qwv9] {
    margin: 0 0 0.2em 0.2em;
    font-size: 0.9em;
    font-family: var(--font-bold);
}

#work-order #body.grouped #note .info span[b-bhti36qwv9] {
    color: var(--color-danger);
    font-family: var(--font-bold);
    /* break-all suits codes and dimensions, but it cuts a sentence mid-word. */
    word-break: normal;
    overflow-wrap: break-word;
}

#work-order #body[b-bhti36qwv9] {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

    #work-order #body .body-col[b-bhti36qwv9] {
        width: 49%;
        display: flex;
        height: auto;
        flex-direction: column;
    }

    #work-order #body .group[b-bhti36qwv9] {
        border-radius: 0.5em;
        border: 0.01em solid gray;
    }

        #work-order #body .group .info[b-bhti36qwv9] {
            width: 100%;
            display: flex;
            justify-content: space-between;
            border-bottom: 0.01em solid lightgrey;
        }

            #work-order #body .group .info label[b-bhti36qwv9],
            #work-order #body .group .info span[b-bhti36qwv9] {
                width: 50%;
                padding: 0.3em 0.5em;
            }

            #work-order #body .group .info span[b-bhti36qwv9] {
                text-align: right;
                align-items: center;
                border-left: 0.01em solid lightgray;
            }

            #work-order #body .group #rezanje span[b-bhti36qwv9] {
                border-left: 0 !important;
            }

/* Keeps the label/value rhythm of every other row — only the weight and the left rule set it
   apart. Those carry it, not the fill: the pogon prints in black and white, and the PDF is
   rendered from this very markup. box-sizing so the accent rule does not widen the row. */
#work-order #body .group .info.cutting-note[b-bhti36qwv9] {
    box-sizing: border-box;
    background-color: #e4eef2;
    border-left: 0.35em solid #14425a;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

    #work-order #body .group .info.cutting-note label[b-bhti36qwv9],
    #work-order #body .group .info.cutting-note span[b-bhti36qwv9] {
        font-family: var(--font-bold);
        color: #14425a;
    }

    #work-order #body .group .info.cutting-note span[b-bhti36qwv9] {
        word-break: break-word;
    }

.has-surface-treatment label[b-bhti36qwv9], .has-surface-treatment span[b-bhti36qwv9] {
    font-family: var(--font-bold) !important;
    font-size: 1.2em !important;
}

.tbl-box[b-bhti36qwv9] {
    width: 100%;
    display: flex;
    flex-direction: column;
    background: #f1f1f1;
    border-radius: .5em;
    padding: 0.5em;
    margin-top: 0.8em;
    page-break-inside: avoid;
    border: 0.1em solid gray;
}

.tbl-name[b-bhti36qwv9] {
    margin: 0.5em 0;
    font-size: 0.9em;
    font-family: var(--font-bold);
}

    .tbl-box .tbl-box-list[b-bhti36qwv9] {
        display: flex;
        flex-direction: column;
        width: 100%;
        font-size: 10px;
        border: 0.05em solid lightgrey;
        border-radius: .3em;
        background: white;
    }

.tbl-box-list-header[b-bhti36qwv9],
.tbl-box-list-item[b-bhti36qwv9] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    border-bottom: 0.05em solid lightgrey;
}

#work-order_header #title-and-logo .avio-badge[b-bhti36qwv9] {
    font-family: var(--font-medium);
    font-size: 1em;
    color: white;
    background-color: #14425a;
    border-radius: 0.4em;
    padding: 0.2em 0.75em;
    letter-spacing: 0.06em;
    margin-bottom: 0.5em;
}

#work-order_header #left #order-general-info .group .info.avio-info span[b-bhti36qwv9] {
    font-family: var(--font-medium);
    color: #14425a;
    font-size: 1em;
    letter-spacing: 0.05em;
}

    .tbl-box-list-header label[b-bhti36qwv9] {
        font-family: var(--font-medium);
    }

    .tbl-box-list-item label[b-bhti36qwv9] {
        font-family: var(--font-light);
    }

    .tbl-box-list-header label[b-bhti36qwv9],
    .tbl-box-list-item label[b-bhti36qwv9] {
        width: 30%;
        word-break: break-all;
        padding: 0.5em 0.8em;
        border-right: 0.1em solid lightgray;
    }

.ostale-obrade label[b-bhti36qwv9] {
    width: 50%;
}

.ostale-obrade .col-vrsta[b-bhti36qwv9] {
    width: 18%;
    word-break: normal;
    overflow-wrap: break-word;
}

.ostale-obrade .col-lokacija[b-bhti36qwv9] {
    width: 37%;
    word-break: normal;
    overflow-wrap: break-word;
}

.ostale-obrade .col-masina[b-bhti36qwv9] {
    width: 22%;
    word-break: normal;
    overflow-wrap: break-word;
}

.ostale-obrade .col-firmware[b-bhti36qwv9] {
    width: 23%;
    border-right: none;
    word-break: normal;
    overflow-wrap: break-word;
}

/* Five columns; ɸ is deliberately not one of them — the shop reads the ER label, and they asked
   for the raw number to go. It is still stored, so a corrected catalogue repairs old orders. */
.alati .col-sifra[b-bhti36qwv9] {
    width: 14%;
    word-break: normal;
    overflow-wrap: break-word;
}

.alati .col-naziv[b-bhti36qwv9] {
    width: 34%;
    word-break: normal;
    overflow-wrap: break-word;
}

.alati .col-duzina[b-bhti36qwv9],
.alati .col-prihvat[b-bhti36qwv9] {
    width: 13%;
    word-break: normal;
}

.alati .col-napomena[b-bhti36qwv9] {
    width: 26%;
    border-right: none;
    word-break: normal;
    overflow-wrap: break-word;
}

#alati-table[b-bhti36qwv9] {
    margin-bottom: .5em;
}

/* A step above the other tables: this one is read at the machine, not at a desk. The table only
   exists when the tools are kept as rows, so nothing else on the order moves. */
#alati-table .tbl-box-list[b-bhti36qwv9] {
    font-size: 12px;
}

.cadcam-info[b-bhti36qwv9] {
    margin-top: 0.8em;
}

.dorezivanje-table .tbl-box-list-item label[b-bhti36qwv9] {
    width: 100%;
}

.ensats-table .tbl-box-list-item label[b-bhti36qwv9] {
    width: 80%;
}

.ensats-table .tbl-box-list-item .label-bolded[b-bhti36qwv9] {
    width: 20%;
    font-family: var(--font-bold);
}

.img-container[b-bhti36qwv9] {
    display: flex;
    width: 100%;
    flex-direction: column;
    margin-bottom: .5em;
    border: 0.1em solid gray;
    border-radius: 0.5em;
}

    .img-container img[b-bhti36qwv9] {
        width: 100%;
        border-bottom-left-radius: 0.5em;
        border-bottom-right-radius: 0.5em;
    }

    .img-container label[b-bhti36qwv9] {
        background: #f1f1f1;
        width: 100%;
        padding: 0.3em 0.5em;
        border-top-right-radius: .5em;
        border-top-left-radius: .5em;
        font-size: 0.9em;
        font-family: var(--font-bold);
    }

    .img-container p[b-bhti36qwv9] {
        color: gray;
        width: 100%;
        text-align: center;
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 90%;
    }


#alati-img[b-bhti36qwv9] {
    height: 100%;
    min-height: 28em;
}

    #alati-img img[b-bhti36qwv9] {
        height: 100%;
    }

#model-img[b-bhti36qwv9] {
    margin-bottom: 0;
}

#footer[b-bhti36qwv9]{
    width: 100%;
    display: flex;
    border-top: 0.01em solid lightgray;
    margin-top: .3em;
    padding-top: .2em;
    justify-content: end;
}

#footer .info[b-bhti36qwv9] {
    width: auto;
    display: flex;
    flex-direction: column;
    margin-right: 2em;
}

    #footer .info label[b-bhti36qwv9] {
        font-family: var(--font-light);
        font-size: 0.75em;
        margin-bottom: 0;
    }

    #footer .info span[b-bhti36qwv9] {
        font-size: 0.85em;
    }

/* Three lines in the bottom right corner, label and name on the same line, the way their own
   sheet is laid out. The two-column footer above is untouched. */
#footer.stacked[b-bhti36qwv9] {
    flex-direction: column;
    align-items: flex-end;
}

    #footer.stacked .info[b-bhti36qwv9] {
        flex-direction: row;
        align-items: baseline;
        gap: 0.4em;
        margin-right: 0;
    }

        #footer.stacked .info label[b-bhti36qwv9] {
            font-size: 0.85em;
        }

#work-order-buttons[b-bhti36qwv9] {
    width: 100%;
    display: flex;
    justify-content: end;
    padding: 1em;
}

#work-order-buttons button[b-bhti36qwv9] {
    margin-left: 1em;
}

#work-order-buttons button i[b-bhti36qwv9] {
    margin-right: 0.5em;
}

#generate-pdf[b-bhti36qwv9],
#preview-pdf[b-bhti36qwv9] {
    background: lightgrey;
    border: 0.05em solid grey;
    color: black;
}

    #generate-pdf img[b-bhti36qwv9],
    #preview-pdf img[b-bhti36qwv9] {
        width: 1.5em;
        height: 1.5em;
        margin-right: 0.5em;
    }

#generate-excel[b-bhti36qwv9] {
    background: white;
    color: #3d783d;
    font-family: var(--font-medium);
    border: 0.1em solid #5cb85c;
}

    #generate-excel img[b-bhti36qwv9] {
        width: 1.5em;
        height: 1.5em;
        margin-right: 0.5em;
    }

#edit-btn[b-bhti36qwv9] {
    margin-right: auto;
}

/*
    MODAL ZA IZMJENU STATUSA
*/
#change-order-article-status[b-bhti36qwv9] {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

    #change-order-article-status #note[b-bhti36qwv9] {
        width: 70%;
    }

    #change-order-article-status p[b-bhti36qwv9] {
        font-size: 1.5em;
        font-family: var(--font-medium);
        margin-bottom: 2em;
        color: var(--ar-primary);
        width: 80%;
        text-align: center;
    }

    #change-order-article-status span[b-bhti36qwv9] {
        font-size: 0.8em;
        font-family: var(--font-italic);
    }

    #change-order-article-status label[b-bhti36qwv9] {
        margin-bottom: 0.5em;
    }

/* Inspekcija prvog komada: izbor dijela naloga koji se prikazuje i štampa. */
#first-article-parts[b-bhti36qwv9] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-md);
    margin-bottom: var(--space-md);
}

    #first-article-parts button[b-bhti36qwv9] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.2em;
        background: var(--color-bg-card);
        border: 1px solid var(--color-border);
        border-radius: var(--space-sm);
        padding: 0.6em var(--space-md);
        color: var(--color-text-dark);
        text-align: left;
    }

        #first-article-parts button strong[b-bhti36qwv9] {
            font-family: var(--font-medium);
        }

        #first-article-parts button span[b-bhti36qwv9] {
            font-family: var(--font-light);
            font-size: 0.88em;
        }

        #first-article-parts button.part-active[b-bhti36qwv9] {
            border: 2px solid var(--color-text-dark);
            background: var(--color-bg-surface);
        }

/* Its own line under the title: the note of a whole-quantity RN is long. */
#work-order_header #title-and-logo .first-article-note[b-bhti36qwv9] {
    display: block;
    flex-basis: 100%;
    font-family: var(--font-medium);
    font-size: 0.85em;
    color: var(--color-text-dark);
    margin-bottom: 0.5em;
}

.first-article-finalize-note[b-bhti36qwv9] {
    background: var(--color-bg-surface);
    border-radius: var(--space-sm);
    padding: 0.6em var(--space-md);
    color: var(--color-text-dark);
    font-size: 0.92em;
}
/* _content/ArasWeb/Pages/Toolbox/AddTool.razor.rz.scp.css */
#tool-container[b-lenzo6d9in] {
    height: 95%;
    overflow-y: scroll;
}

.container[b-lenzo6d9in] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    background: white;
    padding: 1em;
    border-radius: 1em;
    margin: 0;
    margin-bottom: 1em;
}

#item-info-container[b-lenzo6d9in],
#quantity-info-container[b-lenzo6d9in] {
    width: 100%;
    height: 95%;
    display: flex;
    flex-direction: column;
    margin-top: 1em;
    justify-content: space-between;
}

.input-row[b-lenzo6d9in] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    position: relative;
    margin-bottom: 2em;
}

.input-box[b-lenzo6d9in] {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: flex-start;
    width: 45%;
    position: relative;
}

    .input-box label[b-lenzo6d9in] {
        width: 100%;
        font-family: 'Ubuntu-Light';
        font-size: 0.9em;
        margin-bottom: 0.5em;
    }

    .input-box span[b-lenzo6d9in] {
        font-size: 1.2em;
        font-family: 'Ubuntu-Medium';
    }
/* _content/ArasWeb/Pages/Toolbox/Toolbox.razor.rz.scp.css */
#toolbox-page[b-jaax40oedn] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

/* Tabovi stoje iznad kartice, kao na ostalim stranicama. */
#tab-container[b-jaax40oedn] {
    width: 100%;
    height: calc(92% - 3.5rem);
    display: flex;
    flex-direction: column;
    background: white;
    border-radius: 1em;
    padding: 1em;
}

.list-wrapper[b-jaax40oedn] {
    height: 95%;
}

.item-details[b-jaax40oedn] {
    text-align: left;
    width: 90%;
}

.list .item-details label[b-jaax40oedn] {
    font-size: 0.9em;
}

#machines-tab .list-wrapper label[b-jaax40oedn] {
    width: 32%;
}

#tools-list-wrapper label[b-jaax40oedn],
#measuring-equipment-list-wrapper label[b-jaax40oedn] {
    width: 24%;
}

.tool-optimal-quantity[b-jaax40oedn] {
    border-left: 0.3em solid #5cb85c;
}

.tool-min-quantity[b-jaax40oedn] {
    border-left: 0.3em solid var(--color-danger);
    background: rgba(220, 53, 69, 0.1)
}

    .tool-min-quantity .quantity[b-jaax40oedn] {
        color: var(--color-danger);
        font-family: var(--font-medium);
    }

.status span[b-jaax40oedn] {
    border-radius: 2em;
    width: auto;
    padding: 0.3em 1.5em;
    word-break: break-all;
    font-family: var(--font-medium);
    font-size: 0.8em;
    justify-content: center;
    width: 11em;
}

.inactive-machine .status span[b-jaax40oedn] {
    background: rgba(236, 236, 236, 0.8)
}

.active-machine .status span[b-jaax40oedn] {
    background: rgba(137, 196, 244, 0.8)
}

#tools-list-wrapper .item-details .quantity[b-jaax40oedn],
#measuring-equipment-list-wrapper .item-details .quantity[b-jaax40oedn] {
    width: 15%;
    text-align: center;
}

#tools-list-wrapper .item-details .location[b-jaax40oedn],
#measuring-equipment-list-wrapper .item-details .location[b-jaax40oedn] {
    text-align: center;
}

#tools-list-wrapper .item-details .name[b-jaax40oedn],
#measuring-equipment-list-wrapper .item-details .name[b-jaax40oedn] {
    width: 35%;
}

.machine-item-container[b-jaax40oedn] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    padding: 0 8em;
}

    .machine-item-container .prop[b-jaax40oedn] {
        margin-bottom: 1em;
    }

        .machine-item-container .prop label[b-jaax40oedn] {
            margin-bottom: 0.3em;
        }

        .machine-item-container .prop input[type=checkbox][b-jaax40oedn] {
            margin-right: 0.5em;
            margin-bottom: 0;
            cursor: pointer;
            width: 1.1em;
            height: 1.1em;
        }

.readonly input[b-jaax40oedn] {
    background: lightgray;
    cursor: default;
}


#remove-machine-btn[b-jaax40oedn] {
    margin-right: auto;
}
/* _content/ArasWeb/Pages/Toolbox/ToolCharges.razor.rz.scp.css */
#tool-charges[b-h0llfe7b53] {
    width: 100%;
    border-radius: 0.5em;
    padding: 1em;
}

#tool-charges-list[b-h0llfe7b53] {
    width: 100%;
}

.item-details[b-h0llfe7b53] {
    text-align: left;
    width: 90%;
}

.status span[b-h0llfe7b53] {
    border-radius: 2em;
    width: auto;
    padding: 0.3em 1.5em;
    word-break: break-all;
    font-family: 'Ubuntu-Medium';
    font-size: 0.8em;
    justify-content: center;
    width: 11em;
    background: rgba(137, 196, 244, 0.8)
}

.status img[b-h0llfe7b53] {
    width: 1.2em;
    height: 1.2em;
    margin-right: 0.5em;
}

.tool[b-h0llfe7b53], .machine[b-h0llfe7b53] {
    display: flex;
    flex-direction: column;
    font-size: 0.95em;
    font-family: 'Ubuntu-Regular';  
}

.tool[b-h0llfe7b53] {
    color: var(--ar-primary);
    cursor: pointer;
    text-decoration: underline;
}

.tool .tool-code[b-h0llfe7b53], 
.tool .machine-code[b-h0llfe7b53] {
    font-size: 0.8em;
    font-family: 'Ubuntu-Light';
}

.blazored-typeahead__input[b-h0llfe7b53] {
    outline: none !important;
    border: none !important;
}

.blazored-typeahead__results[b-h0llfe7b53] {
    max-height: 15em !important;
}

.readonly input[b-h0llfe7b53] {
    background: lightgray;
    cursor: default;
}

.return-btn[b-h0llfe7b53] {
    width: auto;
    display: flex;
}

.return-btn i[b-h0llfe7b53] {
    margin-right: 0.5em;
}

#charge-filters[b-h0llfe7b53] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 1em;
}

#charge-filters .form-check[b-h0llfe7b53] {
    margin: 0;
}

.returned-at[b-h0llfe7b53] {
    display: block;
    font-size: 0.75em;
    color: #6c757d;
    margin-top: 0.2em;
}

.return-btn-placeholder[b-h0llfe7b53] {
    visibility: hidden;
}
/* _content/ArasWeb/Pages/Toolbox/ToolDetails.razor.rz.scp.css */
#tool-container[b-ivjkykdaih] {
    height: 95%;
    overflow-y: scroll;
}

.container[b-ivjkykdaih] {
    width: 48%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    background: white;
    padding: 1em;
    border-radius: 1em;
    margin: 0;
}

#item-info-container[b-ivjkykdaih],
#quantity-info-container[b-ivjkykdaih] {
    width: 100%;
    height: 95%;
    display: flex;
    flex-direction: column;
    margin-top: 1em;
    justify-content: space-between;
}

.input-row[b-ivjkykdaih] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    position: relative;
    margin-bottom: 2em;
}

.input-box[b-ivjkykdaih] {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: flex-start;
    width: 45%;
    position: relative;
}

    .input-box label[b-ivjkykdaih] {
        width: 100%;
        font-family: 'Ubuntu-Light';
        font-size: 0.9em;
        margin-bottom: 0.5em;
    }

    .input-box span[b-ivjkykdaih] {
        font-size: 1.2em;
        font-family: 'Ubuntu-Medium';
    }

.quantity-info[b-ivjkykdaih] {
    padding: 1em;
    background: rgba(13, 110, 253, 0.3);
    border-radius: 1em;
}

.quantity-info span[b-ivjkykdaih] {
    font-size: 1.2em;
}


/*TIMELINE*/

.timeline-container[b-ivjkykdaih] {
    position: relative;
    margin: 40px;
    padding-left: 40px;
}

    .timeline-container[b-ivjkykdaih]::before {
        content: "";
        position: absolute;
        left: 15px;
        top: 0;
        bottom: 0;
        width: 2px;
        background: #dcdcdc;
    }

.timeline-date[b-ivjkykdaih] {
    font-weight: 600;
    color: #6c757d;
    margin-bottom: 20px;
}

.timeline-item[b-ivjkykdaih] {
    position: relative;
    margin-bottom: 25px;
}

.timeline-dot[b-ivjkykdaih] {
    position: absolute;
    left: -27px;
    top: 10px;
    width: 12px;
    height: 12px;
    background: var(--ar-primary);
    border-radius: 50%;
    border: 2px solid white;
    box-shadow: 0 0 0 2px #dcdcdc;
}

.timeline-content[b-ivjkykdaih] {
    border-radius: 10px;
}

    .timeline-content .card-body[b-ivjkykdaih] {
        font-size: 14px;
    }
/* _content/ArasWeb/Pages/Trainings/EdukacijaDetalji.razor.rz.scp.css */
#training[b-y3qd3qxqg4] {
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

#training-container[b-y3qd3qxqg4] {
    width: 100%;
    height: auto;
    min-height: 90%;
    background: var(--color-bg-card);
    border-radius: 1em;
    padding: 1em;
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}

    #training-container fieldset[b-y3qd3qxqg4] {
        display: flex;
        flex-direction: column;
        gap: var(--space-md);
        border: 0;
        margin: 0;
        padding: 0;
        min-width: 0;
    }

.header-row[b-y3qd3qxqg4] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
}

    .header-row h3[b-y3qd3qxqg4] {
        font-family: var(--font-medium);
        color: var(--color-text-dark);
        font-size: 1.15em;
        margin: 0;
    }

.back-btn[b-y3qd3qxqg4] {
    background: transparent;
    color: var(--color-text-dark);
    padding: 0 0.6em;
}

.training-status[b-y3qd3qxqg4] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    background: var(--color-bg-surface);
    border-radius: var(--space-sm);
    padding: 0.6em var(--space-md);
    color: var(--color-text-dark);
    font-size: 0.9em;
}

    .training-status.read-only[b-y3qd3qxqg4] {
        background: #fff3cd;
        color: #664d03;
    }

.training-section[b-y3qd3qxqg4] {
    display: flex;
    flex-direction: column;
    gap: 0.6em;
    border-top: 1px solid var(--color-bg-surface);
    padding-top: var(--space-md);
}

    .training-section:first-child[b-y3qd3qxqg4] {
        border-top: 0;
        padding-top: 0;
    }

.section-title[b-y3qd3qxqg4] {
    font-family: var(--font-medium);
    color: var(--color-text-dark);
    margin: 0;
}

.section-description[b-y3qd3qxqg4],
.empty-note[b-y3qd3qxqg4] {
    font-family: var(--font-light);
    color: var(--color-text-muted);
    font-size: 0.88em;
    margin: 0;
}

.training-grid[b-y3qd3qxqg4] {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: var(--space-md);
}

.training-field label[b-y3qd3qxqg4] {
    display: block;
    font-family: var(--font-light);
    color: var(--color-text-muted);
    font-size: 0.88em;
    margin-bottom: 0.25em;
}

.lecturer-mode[b-y3qd3qxqg4],
.yes-no[b-y3qd3qxqg4] {
    display: flex;
    gap: var(--space-sm);
}

    .yes-no .btn[b-y3qd3qxqg4] {
        min-height: 0;
        white-space: nowrap;
    }

.training-table[b-y3qd3qxqg4] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.92em;
}

    .training-table th[b-y3qd3qxqg4] {
        background: var(--color-bg-header);
        font-family: var(--font-medium);
        color: var(--color-text-dark);
        font-weight: normal;
        padding: 0.5em;
        text-align: left;
    }

    .training-table td[b-y3qd3qxqg4] {
        border-bottom: 1px solid var(--color-bg-surface);
        padding: 0.4em 0.5em;
        vertical-align: middle;
        color: var(--color-text-dark);
    }

    .training-table textarea[b-y3qd3qxqg4] {
        resize: vertical;
    }

    .training-table tr.absent td.col-name[b-y3qd3qxqg4] {
        color: var(--color-text-muted);
        text-decoration: line-through;
    }

.col-no[b-y3qd3qxqg4] {
    width: 3.5em;
    text-align: center !important;
}

.col-topic[b-y3qd3qxqg4] {
    width: 30%;
}

.col-name[b-y3qd3qxqg4] {
    width: 25%;
}

.col-attended[b-y3qd3qxqg4] {
    width: 12em;
}

.col-rating[b-y3qd3qxqg4] {
    width: 8em;
}

.col-action[b-y3qd3qxqg4] {
    width: 3em;
}

    .col-action .btn[b-y3qd3qxqg4] {
        min-height: 0;
    }

.stars[b-y3qd3qxqg4] {
    color: #f0ad4e;
    letter-spacing: 0.1em;
    white-space: nowrap;
}

.feedback[b-y3qd3qxqg4] {
    font-family: var(--font-light);
}

.muted[b-y3qd3qxqg4] {
    color: var(--color-text-muted);
    font-style: italic;
}

.training-section button[b-y3qd3qxqg4],
.training-actions button[b-y3qd3qxqg4] {
    gap: 0.4em;
}

.add-row[b-y3qd3qxqg4] {
    align-self: flex-start;
}

.participant-add[b-y3qd3qxqg4] {
    display: flex;
    gap: var(--space-sm);
    flex-wrap: wrap;
}


#training-comment textarea[b-y3qd3qxqg4] {
    resize: vertical;
}

/* Prilozi: isti izgled kao na fakturi (InvoiceDetails.razor.css). */
.attachment-upload[b-y3qd3qxqg4] {
    align-self: flex-start;
    cursor: pointer;
}

/* ::deep je obavezan — InputFile je komponenta, pa izolovana CSS ne doseže njen <input>. */
[b-y3qd3qxqg4] .attachment-upload input[type="file"] {
    display: none !important;
}

.attachment-upload-button[b-y3qd3qxqg4] {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    padding: 0.5em 1em;
    border-radius: 0.35em;
    background: #e4eef2;
    color: #14425a;
    font-size: 0.9em;
}

    .attachment-upload-button:hover[b-y3qd3qxqg4] {
        background: #d4e4ea;
    }

.attachment-list[b-y3qd3qxqg4] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.4em;
}

.attachment-row[b-y3qd3qxqg4] {
    display: flex;
    align-items: center;
    gap: 0.75em;
    padding: 0.5em 0.75em;
    border: 1px solid #ddd;
    border-radius: 0.35em;
}

    .attachment-row .pdf-icon[b-y3qd3qxqg4] {
        color: #d9534f;
        font-size: 1.25em;
    }

    .attachment-row .img-icon[b-y3qd3qxqg4] {
        color: var(--ar-primary);
        font-size: 1.25em;
    }

.attachment-name[b-y3qd3qxqg4] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #14425a;
}

.attachment-meta[b-y3qd3qxqg4] {
    color: #6c757d;
    font-size: 0.85em;
    white-space: nowrap;
}

.training-actions[b-y3qd3qxqg4] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
    border-top: 1px solid var(--color-bg-surface);
    padding-top: var(--space-md);
}

    .training-actions .spacer[b-y3qd3qxqg4] {
        flex: 1;
    }

.state-badge[b-y3qd3qxqg4] {
    display: inline-block;
    width: fit-content;
    padding: 0.15em 0.6em;
    border-radius: 1em;
    font-family: var(--font-medium);
    font-size: 0.82em;
    white-space: nowrap;
}

.state-progress[b-y3qd3qxqg4] {
    background: var(--color-bg-surface);
    color: var(--color-text-dark);
}

.state-waiting[b-y3qd3qxqg4] {
    background: #fff3cd;
    color: #664d03;
}

.state-done[b-y3qd3qxqg4] {
    background: #d1e7dd;
    color: #0f5132;
}

/* Prošla edukacija kojoj predavač nije potvrdio prisustvo: posao koji čeka, ne najava. */
.state-overdue[b-y3qd3qxqg4] {
    background: #f8d7da;
    color: #842029;
}

/* Na telefonu tabela postaje niz kartica, jedan red ispod drugog. */
@media (max-width: 768px) {
    .training-grid[b-y3qd3qxqg4] {
        grid-template-columns: 1fr;
    }

    .training-table thead[b-y3qd3qxqg4] {
        display: none;
    }

    .training-table tr[b-y3qd3qxqg4] {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.4em;
        border-bottom: 1px solid var(--color-border);
        padding: 0.5em 0;
    }

    .training-table td[b-y3qd3qxqg4] {
        border: 0;
        width: auto !important;
        padding: 0.2em;
    }

        .training-table td.col-topic[b-y3qd3qxqg4],
        .training-table td:not([class])[b-y3qd3qxqg4] {
            flex: 1 1 100%;
        }

    .attachment-row[b-y3qd3qxqg4] {
        flex-wrap: wrap;
    }

    .attachment-meta[b-y3qd3qxqg4] {
        width: 100%;
        white-space: normal;
    }

    .training-actions button[b-y3qd3qxqg4] {
        flex: 1 1 auto;
    }
}
/* _content/ArasWeb/Pages/Trainings/Edukacije.razor.rz.scp.css */
#trainings[b-xhve2ins99] {
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

#trainings-container[b-xhve2ins99] {
    width: 100%;
    height: auto;
    min-height: 90%;
    background: var(--color-bg-card);
    border-radius: 1em;
    padding: 1em;
}

.header-row[b-xhve2ins99] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--space-md);
}

    .header-row button[b-xhve2ins99] {
        gap: 0.4em;
    }

    .header-row h3[b-xhve2ins99] {
        font-family: var(--font-medium);
        color: var(--color-text-dark);
        font-size: 1.15em;
        margin: 0;
    }

.description[b-xhve2ins99] {
    font-family: var(--font-light);
    color: var(--color-text-muted);
    font-size: 0.88em;
    margin: 0.4em 0 var(--space-md) 0;
    max-width: 60em;
}

/* Širine kolona; struktura liste dolazi iz site.css. */
/* Datum ne lomi red, pa dobija stalnu širinu; ostale kolone se sužavaju. */
.date[b-xhve2ins99] {
    flex: none;
    width: 7.5em !important;
    font-family: var(--font-medium);
    white-space: nowrap;
}

.title[b-xhve2ins99] {
    width: 27%;
    word-break: break-word;
}

.lecturer[b-xhve2ins99] {
    width: 18%;
    word-break: break-word;
}

.state[b-xhve2ins99] {
    width: 14%;
}

.attendance[b-xhve2ins99] {
    width: 12%;
    text-align: center;
}

.rating[b-xhve2ins99] {
    width: 12%;
    text-align: center;
    white-space: nowrap;
}

    .rating small[b-xhve2ins99] {
        color: var(--color-text-muted);
        margin-left: 0.35em;
    }

    .rating .star-on[b-xhve2ins99] {
        margin-right: 0.25em;
    }

.star-on[b-xhve2ins99] {
    color: #f0ad4e;
}

.state-badge[b-xhve2ins99] {
    display: inline-block;
    width: fit-content;
    padding: 0.15em 0.6em;
    border-radius: 1em;
    font-family: var(--font-medium);
    font-size: 0.82em;
    white-space: nowrap;
}

.state-progress[b-xhve2ins99] {
    background: var(--color-bg-surface);
    color: var(--color-text-dark);
}

.state-waiting[b-xhve2ins99] {
    background: #fff3cd;
    color: #664d03;
}

.state-done[b-xhve2ins99] {
    background: #d1e7dd;
    color: #0f5132;
}

/* Prošla edukacija kojoj predavač nije potvrdio prisustvo: posao koji čeka, ne najava. */
.state-overdue[b-xhve2ins99] {
    background: #f8d7da;
    color: #842029;
}

/* Na telefonu šest kolona ne stane: red postaje kartica u dvije kolone. */
@media (max-width: 768px) {
    .header-row[b-xhve2ins99] {
        flex-direction: column;
        align-items: stretch;
    }

    #trainings-list .list-header[b-xhve2ins99] {
        display: none !important;
    }

    #trainings-list .list-item[b-xhve2ins99] {
        flex-direction: column;
        align-items: stretch;
        gap: var(--space-sm);
    }

        #trainings-list .list-item > span[b-xhve2ins99] {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 0.4em var(--space-md);
            width: 100%;
        }

        #trainings-list .list-item label[b-xhve2ins99] {
            width: auto;
            text-align: left;
        }

        #trainings-list .list-item button[b-xhve2ins99] {
            width: 100%;
        }
}
/* _content/ArasWeb/Pages/Trainings/MojeEdukacije.razor.rz.scp.css */
#my-trainings[b-c49igayh9i] {
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

#my-trainings-container[b-c49igayh9i] {
    width: 100%;
    height: auto;
    min-height: 90%;
    background: var(--color-bg-card);
    border-radius: 1em;
    padding: 1em;
}

.header-row[b-c49igayh9i] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--space-md);
}

    .header-row h3[b-c49igayh9i] {
        font-family: var(--font-medium);
        color: var(--color-text-dark);
        font-size: 1.15em;
        margin: 0;
    }

    .header-row .badge-count[b-c49igayh9i] {
        margin: 0;
    }

.description[b-c49igayh9i] {
    font-family: var(--font-light);
    color: var(--color-text-muted);
    font-size: 0.88em;
    margin: 0.4em 0 var(--space-md) 0;
    max-width: 60em;
}

.training-cards[b-c49igayh9i] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(22em, 1fr));
    gap: var(--space-md);
}

.training-card[b-c49igayh9i] {
    display: flex;
    flex-direction: column;
    gap: 0.7em;
    border: 1px solid var(--color-border);
    border-radius: var(--space-sm);
    padding: var(--space-md);
    color: var(--color-text-dark);
}

    /* Kartica za komentar je uvijek iste visine, koliko god tema imala: zaglavlje i forma
       stoje na mjestu, a teme se skrolaju u prostoru između njih. */
    .training-card.waiting[b-c49igayh9i] {
        height: 34em;
    }

        .training-card.waiting .card-head[b-c49igayh9i],
        .training-card.waiting .feedback-form[b-c49igayh9i] {
            flex: none;
        }

        .training-card.waiting .topics[b-c49igayh9i] {
            flex: 1 1 auto;
            min-height: 0;
            overflow-y: auto;
            padding-right: 0.4em;
        }

        .training-card.waiting .feedback-form[b-c49igayh9i] {
            margin-top: auto;
        }

    .training-card.waiting[b-c49igayh9i] {
        border-left: 0.3em solid #f0ad4e;
    }

.card-head[b-c49igayh9i] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--space-sm);
}

    .card-head strong[b-c49igayh9i] {
        display: block;
        font-family: var(--font-medium);
    }

    .card-head .meta[b-c49igayh9i] {
        font-family: var(--font-light);
        font-size: 0.85em;
        color: var(--color-text-muted);
    }

.topics[b-c49igayh9i] {
    margin: 0;
    padding-left: 1.3em;
    font-size: 0.9em;
}

    .topics li[b-c49igayh9i] {
        margin-bottom: 0.3em;
    }

.topic-title[b-c49igayh9i] {
    font-family: var(--font-medium);
}

.topic-description[b-c49igayh9i] {
    display: block;
    font-family: var(--font-light);
    color: var(--color-text-muted);
}

.feedback-form[b-c49igayh9i] {
    display: flex;
    flex-direction: column;
    gap: 0.4em;
    background: var(--color-bg-main);
    border-radius: var(--space-sm);
    padding: 0.7em;
}

    .feedback-form label[b-c49igayh9i] {
        font-family: var(--font-light);
        color: var(--color-text-muted);
        font-size: 0.85em;
        margin: 0;
    }

    .feedback-form textarea[b-c49igayh9i] {
        resize: none;
    }

.rating-input[b-c49igayh9i] {
    display: flex;
    gap: 0.2em;
}

    .rating-input .star[b-c49igayh9i] {
        background: transparent;
        padding: 0 0.3em;
        font-size: 1.6em;
        color: #d0d5d9;
    }

        .rating-input .star.on[b-c49igayh9i] {
            color: #f0ad4e;
        }

.feedback-actions[b-c49igayh9i] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--space-sm);
    flex-wrap: wrap;
}

.deadline[b-c49igayh9i] {
    font-family: var(--font-light);
    font-size: 0.8em;
    color: var(--color-text-muted);
}

.feedback-given[b-c49igayh9i] {
    display: flex;
    flex-direction: column;
    gap: 0.2em;
    font-size: 0.9em;
}

.stars[b-c49igayh9i] {
    color: #f0ad4e;
    letter-spacing: 0.1em;
}

.muted[b-c49igayh9i] {
    font-family: var(--font-light);
    color: var(--color-text-muted);
    font-size: 0.88em;
}

.card-note[b-c49igayh9i] {
    margin: 0;
}

.state-badge[b-c49igayh9i] {
    display: inline-block;
    width: fit-content;
    padding: 0.15em 0.6em;
    border-radius: 1em;
    font-family: var(--font-medium);
    font-size: 0.78em;
    white-space: nowrap;
}

.state-progress[b-c49igayh9i] {
    background: var(--color-bg-surface);
    color: var(--color-text-dark);
}

.state-waiting[b-c49igayh9i] {
    background: #fff3cd;
    color: #664d03;
}

.state-done[b-c49igayh9i] {
    background: #d1e7dd;
    color: #0f5132;
}

.state-absent[b-c49igayh9i] {
    background: var(--color-bg-header);
    color: var(--color-text-muted);
}

.trainings-section[b-c49igayh9i] {
    margin-bottom: 1.5em;
}

    .trainings-section h4[b-c49igayh9i] {
        font-family: var(--font-medium);
        color: var(--color-text-dark);
        font-size: 1em;
        margin: 0 0 0.7em 0;
        display: flex;
        align-items: center;
        gap: 0.5em;
    }

        .trainings-section h4 i[b-c49igayh9i] {
            color: var(--color-icon-accent);
        }

.deadline-badge[b-c49igayh9i] {
    display: inline-flex;
    align-items: center;
    gap: 0.3em;
    white-space: nowrap;
    background: #fff3cd;
    color: #664d03;
    border-radius: 1em;
    padding: 0.15em 0.6em;
    font-family: var(--font-medium);
    font-size: 0.78em;
}

/* Sklopljene kartice iste širine kao kartica za komentar, red po red; klik otvara teme i komentar.
   align-items: start, da otvorena kartica ne razvuče ostale u svom redu. */
.compact-list[b-c49igayh9i] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(22em, 1fr));
    gap: var(--space-md);
    align-items: start;
}

.compact-card[b-c49igayh9i] {
    border: 1px solid var(--color-border);
    border-radius: var(--space-sm);
    color: var(--color-text-dark);
}

    .compact-card.open[b-c49igayh9i] {
        border-color: var(--color-icon-accent);
    }

/* Sklopljena kartica je uvijek iste visine: naslov najviše u dva reda, ispod datum i predavač. */
.compact-head[b-c49igayh9i] {
    width: 100%;
    height: 5.4em;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 1.2em;
    grid-template-rows: auto auto;
    align-content: center;
    grid-template-areas:
        "title state chevron"
        "meta meta chevron";
    align-items: center;
    gap: 0.25em var(--space-sm);
    background: transparent;
    border-radius: var(--space-sm);
    padding: 0.6em var(--space-md);
    min-height: 0;
    text-align: left;
    color: var(--color-text-dark);
}

    .compact-head:hover[b-c49igayh9i] {
        background: var(--color-bg-main);
    }

.compact-title[b-c49igayh9i] {
    font-family: var(--font-medium);
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    overflow-wrap: anywhere;
}

.compact-meta[b-c49igayh9i] {
    font-family: var(--font-light);
    font-size: 0.88em;
    color: var(--color-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.compact-title[b-c49igayh9i] { grid-area: title; }
.compact-head .state-badge[b-c49igayh9i] { grid-area: state; justify-self: end; }
.compact-meta[b-c49igayh9i] { grid-area: meta; }

.chevron[b-c49igayh9i] {
    grid-area: chevron;
    color: var(--color-text-muted);
    font-size: 0.8em;
    transition: transform 0.15s ease;
}

.compact-card.open .chevron[b-c49igayh9i] {
    transform: rotate(180deg);
}

.compact-body[b-c49igayh9i] {
    display: flex;
    flex-direction: column;
    gap: 0.7em;
    padding: 0 var(--space-md) var(--space-md) var(--space-md);
    border-top: 1px solid var(--color-bg-surface);
    padding-top: 0.7em;
}

    /* I otvorena sklopljena kartica ima granicu; duge teme se skrolaju. */
    .compact-body .topics[b-c49igayh9i] {
        max-height: 14em;
        overflow-y: auto;
        padding-right: 0.4em;
    }

@media (max-width: 768px) {
    .training-cards[b-c49igayh9i] {
        grid-template-columns: 1fr;
    }

    .feedback-actions button[b-c49igayh9i] {
        width: 100%;
    }

    .compact-list[b-c49igayh9i] {
        grid-template-columns: 1fr;
    }
}
/* _content/ArasWeb/Pages/Trainings/ParticipantPicker.razor.rz.scp.css */
.person-picker[b-qo0tq57z5w] {
    position: relative;
    flex: 1;
    min-width: 14em;
    max-width: 30em;
}

    .person-picker input[b-qo0tq57z5w] {
        padding-right: 2em;
    }

.picker-caret[b-qo0tq57z5w] {
    position: absolute;
    right: 0.8em;
    top: 50%;
    transform: translateY(-50%);
    color: var(--color-text-muted);
    font-size: 0.8em;
    pointer-events: none;
}

.person-picker-results[b-qo0tq57z5w] {
    position: absolute;
    top: calc(100% + 0.25em);
    left: 0;
    right: 0;
    z-index: 20;
    max-height: 22em;
    overflow-y: auto;
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--space-sm);
    box-shadow: 0 0.4em 1em rgba(0, 0, 0, 0.12);
    padding: 0.25em 0;
}

.person-picker-group[b-qo0tq57z5w] {
    position: sticky;
    top: -0.25em;
    display: flex;
    justify-content: space-between;
    background: var(--color-bg-header);
    color: var(--color-text-dark);
    font-family: var(--font-medium);
    font-size: 0.78em;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 0.35em 0.8em;
}

    .person-picker-group span[b-qo0tq57z5w] {
        color: var(--color-text-muted);
    }

.person-picker-option[b-qo0tq57z5w] {
    padding: 0.45em 0.8em 0.45em 1.4em;
    color: var(--color-text-dark);
    font-family: var(--font-light);
    cursor: pointer;
}

    .person-picker-option:hover[b-qo0tq57z5w],
    .person-picker-option.active[b-qo0tq57z5w] {
        background: var(--color-bg-surface);
    }

.person-picker-empty[b-qo0tq57z5w] {
    padding: 0.6em 0.8em;
    color: var(--color-text-muted);
    font-family: var(--font-light);
    font-size: 0.9em;
}
/* _content/ArasWeb/Pages/User/MyProfile.razor.rz.scp.css */
#my-profile-wrapper[b-085frmx6wt]{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

#my-profile[b-085frmx6wt],
#my-mfa[b-085frmx6wt] {
    width: 50%;
    background: white;
    border-radius: 0.5em;
    padding: 1em;
}

#my-profile-container[b-085frmx6wt]{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin-top: 1em;
}

.data-box[b-085frmx6wt]{
    width: 50%;
    margin: 1em 0;
    padding-right: 1em;
}

.data-box label[b-085frmx6wt] {
    width: 100%;
    margin-bottom: 0.5em;
    font-family: 'Ubuntu-Light';
    font-size: 0.9em;
}

.note[b-085frmx6wt] {
    width: 100%;
    display: flex;
    flex-direction: column;
    font-size: 0.9em;
    font-style: italic;
    color: grey;
    margin: 1em 0;
    font-family: 'Ubuntu-Light';
}

#my-mfa[b-085frmx6wt] {
    margin-top: 2em;
    margin-bottom: 0;
    color: #14425a;
}

.mfa-header[b-085frmx6wt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1em;
}

    .mfa-header h5[b-085frmx6wt] {
        margin: 0;
        font-family: 'Ubuntu-Medium';
    }

.mfa-badge[b-085frmx6wt] {
    padding: 0.2em 0.7em;
    border-radius: 1em;
    background: #e4eef2;
    color: #6c757d;
    font-size: 0.85em;
    white-space: nowrap;
}

.mfa-badge-on[b-085frmx6wt] {
    background: #5cb85c;
    color: white;
}

.mfa-description[b-085frmx6wt] {
    margin: 1em 0;
    font-size: 0.9em;
    font-family: 'Ubuntu-Light';
}

.mfa-facts[b-085frmx6wt] {
    display: flex;
    flex-wrap: wrap;
}

    .mfa-facts .data-box span[b-085frmx6wt] {
        font-family: 'Ubuntu-Medium';
        font-size: 1.2em;
    }

.mfa-warning[b-085frmx6wt] {
    color: #d9534f;
}

.mfa-code-label[b-085frmx6wt] {
    font-size: 0.9em;
    margin-bottom: 0.5em;
}

.mfa-code-row[b-085frmx6wt] {
    max-width: 16em;
    margin: 1em auto 0;
}

.mfa-setup-field[b-085frmx6wt] {
    max-width: 16em;
    margin: 1em auto 0;
}

    .mfa-setup-field label[b-085frmx6wt] {
        display: block;
        font-size: 0.9em;
        margin-bottom: 0.3em;
    }

.mfa-buttons[b-085frmx6wt] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
    margin-top: 1em;
}

.mfa-action[b-085frmx6wt] {
    margin-top: 1em;
}

@media (max-width: 900px) {
    #my-profile[b-085frmx6wt],
    #my-mfa[b-085frmx6wt] {
        width: 100%;
    }

    .data-box[b-085frmx6wt] {
        width: 100%;
    }
}
/* _content/ArasWeb/Pages/Warehouse/MaterialRackView.razor.rz.scp.css */
.rack-top[b-vsmndkw15o] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7em 1.4em;
    align-items: center;
    padding: 0 1em var(--space-md);
}

.rack-stats[b-vsmndkw15o] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
}

.rack-stat[b-vsmndkw15o] {
    border: none;
    background: var(--color-bg-surface);
    border-radius: 0.7em;
    padding: 0.4em 0.9em;
    font-size: 0.85em;
    color: var(--color-text-dark);
}

    .rack-stat b[b-vsmndkw15o] {
        font-family: var(--font-medium);
        font-size: 1.1em;
        margin-right: 0.3em;
        font-variant-numeric: tabular-nums;
    }

    .rack-stat.unplaced[b-vsmndkw15o] {
        background: #fff3cd;
        color: #664d03;
        cursor: pointer;
    }

.rack-legend[b-vsmndkw15o] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4em 1em;
    align-items: center;
    font-size: 0.82em;
    color: var(--color-text-muted);
}

    .rack-legend > span[b-vsmndkw15o] {
        display: inline-flex;
        align-items: center;
        gap: 0.4em;
    }

    .rack-legend .legend-gap[b-vsmndkw15o] {
        width: 0.1em;
        height: 1.2em;
        background: var(--color-border-light);
    }

.dot[b-vsmndkw15o] {
    display: inline-block;
    flex: none;
    width: 0.65em;
    height: 0.65em;
    border-radius: 50%;
}

/* Tri stalaže u redu, sljedeće u novi red; polja se skupe da stanu, bez vodoravnog skrola. */
.rack-area[b-vsmndkw15o] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1em;
    align-items: stretch; /* stalaže u redu iste visine: kraćoj se police rašire, ispod nema praznine */
    padding: 0 1em 1em;
}

.rack.span-2[b-vsmndkw15o] {
    grid-column: span 2;
}

.rack.span-all[b-vsmndkw15o] {
    grid-column: 1 / -1;
}

@media (max-width: 1279px) {
    .rack-area[b-vsmndkw15o] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .rack.span-2[b-vsmndkw15o] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 767px) {
    .rack-area[b-vsmndkw15o] {
        grid-template-columns: minmax(0, 1fr);
    }

    .rack.span-2[b-vsmndkw15o],
    .rack.span-all[b-vsmndkw15o] {
        grid-column: auto;
    }
}

.rack[b-vsmndkw15o] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    background: linear-gradient(180deg, #f8fbfc, #edf3f6);
    border: 1px solid #dbe4e9;
    border-radius: 1em;
    padding: 0.9em 0.6em 1.2em;
}

.rack-head[b-vsmndkw15o] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.6em;
    margin-bottom: 0.9em;
}

.rack-title[b-vsmndkw15o] {
    display: flex;
    align-items: center;
    gap: 0.6em;
    min-width: 0;
}

    .rack-title h5[b-vsmndkw15o] {
        margin: 0;
        font-size: 1rem;
        font-family: var(--font-medium);
        color: var(--color-text-dark);
        overflow-wrap: anywhere;
    }

    .rack-title small[b-vsmndkw15o] {
        display: block;
        color: var(--color-text-muted);
        font-size: 0.8rem;
        margin-top: 0.1em;
    }

.rack-no[b-vsmndkw15o] {
    display: inline-flex;
    flex: none;
    width: 2em;
    height: 2em;
    border-radius: 0.6em;
    background: var(--color-text-dark);
    color: #fff;
    font-family: var(--font-medium);
    align-items: center;
    justify-content: center;
}

.rack-sum[b-vsmndkw15o] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.35em;
    font-family: var(--font-medium);
    color: var(--color-text-dark);
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.occ[b-vsmndkw15o] {
    display: block;
    height: 0.3em;
    width: 5.5em;
    background: #d6e3ec;
    border-radius: 1em;
    overflow: hidden;
}

    .occ span[b-vsmndkw15o] {
        display: block;
        height: 100%;
        background: var(--color-icon-accent);
        border-radius: 1em;
    }

.sticker-btn[b-vsmndkw15o] {
    display: inline-flex;
    align-items: center;
    gap: 0.35em;
    border: none;
    background: transparent;
    color: var(--color-link);
    font-family: var(--font-light);
    font-size: 0.8rem;
    padding: 0;
}

    .sticker-btn:hover[b-vsmndkw15o] {
        text-decoration: underline;
    }

.rack-cols[b-vsmndkw15o] {
    display: grid;
    grid-template-columns: 1em minmax(0, 1fr);
    gap: 4px;
    margin-bottom: 0.3em;
}

    .rack-cols div[b-vsmndkw15o] {
        display: grid;
        gap: 4px;
        padding: 0 11px;
        font-size: 0.68rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: var(--color-text-muted);
        text-align: center;
        white-space: nowrap;
    }

.rack-grid[b-vsmndkw15o] {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.rack-body[b-vsmndkw15o] {
    flex: 1;
    display: grid;
    grid-template-columns: 1em minmax(0, 1fr);
    column-gap: 4px;
}

.rownos[b-vsmndkw15o] {
    display: grid;
}

    .rownos span[b-vsmndkw15o] {
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--color-text-muted);
        font-size: 0.8rem;
    }

/* Stubovi lijevo i desno, police između. */
.unit[b-vsmndkw15o] {
    position: relative;
    padding: 0 7px;
    display: grid;
    grid-auto-rows: 1fr;
    background: #fff;
    border-radius: 3px;
}

    .unit[b-vsmndkw15o]::before,
    .unit[b-vsmndkw15o]::after {
        content: "";
        position: absolute;
        top: -6px;
        bottom: -9px;
        width: 7px;
        border-radius: 3px 3px 2px 2px;
        background: repeating-linear-gradient(to bottom, #2f5d75 0 10px, #1f4456 10px 12px);
        z-index: 1;
    }

    .unit[b-vsmndkw15o]::before {
        left: 0;
    }

    .unit[b-vsmndkw15o]::after {
        right: 0;
    }

.shelf[b-vsmndkw15o] {
    display: grid;
    gap: 4px;
    padding: 4px 4px 0;
}

    .shelf[b-vsmndkw15o]::after {
        content: "";
        grid-column: 1 / -1;
        height: 5px;
        margin: 0 -4px;
        background: linear-gradient(#c3d0d8, #8ea5b3);
        border-radius: 1px;
        box-shadow: 0 2px 3px rgba(20, 66, 90, 0.12);
    }

.cell[b-vsmndkw15o] {
    appearance: none;
    border: 1px solid transparent;
    border-radius: 0.5em;
    min-height: 6.6rem;
    padding: 0.3em 0.3em 0.25em;
    text-align: left;
    display: flex;
    flex-direction: column;
    align-items: stretch; /* globalni stil dugmeta centrira */
    gap: 0.15em;
    cursor: pointer;
    font-size: 1rem;
    color: var(--color-text-dark);
    background: transparent;
    min-width: 0;
    overflow: hidden;
    transition: border-color 0.15s ease, background-color 0.15s ease, transform 0.1s ease, opacity 0.15s ease;
}

    .cell.empty[b-vsmndkw15o] {
        border: 1px dashed #d3dde3;
        color: #a3b0b8;
        background: #fbfcfd;
    }

        .cell.empty .free[b-vsmndkw15o] {
            margin: auto;
            font-size: 0.8rem;
        }

    .cell.has[b-vsmndkw15o] {
        background: #f1f6fb;
        border-color: #d6e4f1;
    }

    .cell:hover[b-vsmndkw15o] {
        border-color: var(--color-primary);
        transform: translateY(-1px);
    }

    .cell.sel[b-vsmndkw15o] {
        border-color: var(--color-primary);
        box-shadow: 0 0 0 2px rgba(40, 138, 237, 0.35);
        background: #e5f0fc;
    }

    /* Filter: pogođena polja uokvirena, ostala zatamnjena. */
    .cell.match[b-vsmndkw15o] {
        border-color: var(--color-primary);
    }

    .cell.dim[b-vsmndkw15o] {
        opacity: 0.35;
    }

@media (prefers-reduced-motion: reduce) {
    .cell:hover[b-vsmndkw15o] {
        transform: none;
    }
}

.cell-top[b-vsmndkw15o] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.3em;
}

.cell .loc[b-vsmndkw15o] {
    font-size: 0.72rem;
    color: var(--color-text-muted);
    letter-spacing: 0.02em;
}

.cell .flag[b-vsmndkw15o] {
    color: var(--color-danger);
    font-size: 0.75rem;
}

.cell-icons[b-vsmndkw15o] {
    display: inline-flex;
    align-items: center;
    gap: 0.3em;
}

/* Isti materijal je i na drugom polju (stanje mu je zajedničko). */
.cell .also[b-vsmndkw15o] {
    color: var(--color-link);
    font-size: 0.68rem;
}

.cell-kg[b-vsmndkw15o] {
    font-family: var(--font-medium);
    font-size: 1rem;
    line-height: 1.15;
    font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere;
}

    .cell-kg small[b-vsmndkw15o] {
        font-family: var(--font-light);
        font-size: 0.72rem;
        color: var(--color-text-muted);
    }

.cell.neg .cell-kg[b-vsmndkw15o] {
    color: var(--color-danger);
}

.cell-dim[b-vsmndkw15o] {
    display: flex;
    align-items: center;
    gap: 0.25em;
    font-size: 0.78rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Naslagan materijal: prvi red stanja na dnu, svaki u svom obliku. */
.stack[b-vsmndkw15o] {
    margin-top: auto;
    display: flex;
    flex-direction: column-reverse;
    gap: 3px;
    padding-top: 0.3em;
}

.pile[b-vsmndkw15o] {
    display: flex;
    gap: 2px;
}

    .pile.slabs[b-vsmndkw15o] {
        flex-direction: column-reverse;
    }

    .pile.bars[b-vsmndkw15o] {
        flex-wrap: wrap-reverse;
    }

.slab[b-vsmndkw15o] {
    display: block;
    height: 4px;
    border-radius: 1.5px;
}

    .slab.ghost[b-vsmndkw15o] {
        background: none;
        border: 1px dashed var(--color-danger);
        height: 5px;
    }

.rod[b-vsmndkw15o],
.ring[b-vsmndkw15o],
.box[b-vsmndkw15o],
.angle[b-vsmndkw15o] {
    display: block;
    flex: none;
    width: 9px;
    height: 9px;
    box-sizing: border-box;
}

.rod[b-vsmndkw15o],
.ring[b-vsmndkw15o] {
    border-radius: 50%;
}

.ring[b-vsmndkw15o],
.box[b-vsmndkw15o] {
    border: 2.5px solid;
}

.box[b-vsmndkw15o] {
    border-radius: 1px;
}

.angle[b-vsmndkw15o] {
    clip-path: polygon(0% 0%, 35% 0%, 35% 65%, 100% 65%, 100% 100%, 0% 100%);
}

/* Detalj polja: panel s desne strane preko stalaža; na telefonu list odozdo. Ispod modala (kartica se otvara iz njega). */
.rack-drawer[b-vsmndkw15o] {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1040;
    width: min(400px, 100vw);
    background: var(--color-bg-card);
    box-shadow: -8px 0 28px rgba(20, 66, 90, 0.18);
    transform: translateX(105%);
    transition: transform 0.22s ease;
    display: flex;
    flex-direction: column;
    outline: none;
}

    .rack-drawer.open[b-vsmndkw15o] {
        transform: none;
    }

.drawer-body[b-vsmndkw15o] {
    flex: 1;
    overflow-y: auto;
    padding: 1.3em 1.4em 1.5em;
}

    .drawer-body .rd-head[b-vsmndkw15o] {
        padding-right: 2.2em; /* mjesto za X */
    }

.drawer-close[b-vsmndkw15o] {
    position: absolute;
    top: 0.8em;
    right: 0.8em;
    width: 2.2em;
    height: 2.2em;
    border: none;
    border-radius: 50%;
    background: var(--color-bg-surface);
    color: var(--color-text-dark);
}

    .drawer-close:hover[b-vsmndkw15o] {
        background: #d6e3ec;
    }

@media (max-width: 768px) {
    .rack-drawer[b-vsmndkw15o] {
        top: auto;
        left: 0;
        width: 100%;
        max-height: 75vh;
        border-radius: 1.2em 1.2em 0 0;
        box-shadow: 0 -8px 28px rgba(20, 66, 90, 0.2);
        transform: translateY(105%);
    }
}

@media (prefers-reduced-motion: reduce) {
    .rack-drawer[b-vsmndkw15o] {
        transition: none;
    }
}

.rd-head[b-vsmndkw15o] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.8em;
}

.rd-loc[b-vsmndkw15o] {
    font-size: 1.9em;
    font-family: var(--font-medium);
    color: var(--color-text-dark);
    line-height: 1;
}

.rd-title[b-vsmndkw15o] {
    font-size: 1.2em;
    font-family: var(--font-medium);
    color: var(--color-text-dark);
}

.rd-sub[b-vsmndkw15o] {
    color: var(--color-text-muted);
    font-size: 0.88em;
    margin: 0.3em 0 1em;
}

.rd-item[b-vsmndkw15o] {
    border-top: 1px solid #e3eaee;
    padding: 0.8em 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.3em 0.8em;
    align-items: center;
}

    .rd-item b[b-vsmndkw15o] {
        font-family: var(--font-medium);
        font-weight: normal;
        color: var(--color-text-dark);
        display: flex;
        align-items: center;
        gap: 0.45em;
        overflow-wrap: anywhere;
    }

    .rd-item small[b-vsmndkw15o] {
        color: var(--color-text-muted);
        display: block;
    }

    .rd-item small.fields[b-vsmndkw15o] {
        color: var(--color-link);
    }

    .rd-item .row2[b-vsmndkw15o] {
        grid-column: 1 / -1;
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 0.6em;
        flex-wrap: wrap;
    }

.rd-kg[b-vsmndkw15o] {
    font-family: var(--font-medium);
    color: var(--color-text-dark);
    font-size: 1.1em;
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.pills[b-vsmndkw15o] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3em;
}

.pill[b-vsmndkw15o] {
    display: inline-block;
    padding: 0.1em 0.6em;
    border-radius: 1em;
    font-size: 0.8em;
}

    .pill.low[b-vsmndkw15o] {
        background: #fff3cd;
        color: #664d03;
    }

    .pill.in[b-vsmndkw15o] {
        background: #e5f0fc;
        color: #0b5394;
    }

    .pill.value[b-vsmndkw15o] {
        background: #e8f5ec;
        color: #1d6b33;
    }

.rd-free[b-vsmndkw15o] {
    color: var(--color-text-muted);
    padding: 0.6em 0;
}

.note[b-vsmndkw15o] {
    border-left: 4px solid var(--color-primary);
    background: #f0f7fd;
    padding: 0.6em 0.9em;
    border-radius: 0.3em;
    color: var(--color-text-dark);
    font-size: 0.88em;
    margin: 0.6em 0 0;
}

.minus[b-vsmndkw15o] {
    color: var(--color-danger) !important;
}

/* Na telefonu je polje stalaže s 4 kolone oko 58px; poslije osnovnih pravila, da ih nadjača. */
@media (max-width: 767px) {
    .cell-dim[b-vsmndkw15o] {
        font-size: 0.7rem;
    }

    .cell .loc[b-vsmndkw15o] {
        font-size: 0.66rem;
    }
}
/* _content/ArasWeb/Pages/Warehouse/MaterialReceiptPanel.razor.rz.scp.css */
.receipt[b-yzicjzaq66] {
    display: flex;
    flex-direction: column;
    gap: 0.5em;
    border: 0.1em solid #c9e0f7;
    background: #f0f7fd;
    border-radius: 0.8em;
    padding: 0.8em 1em;
    color: var(--color-text-dark);
}

.receipt-head[b-yzicjzaq66] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5em;
}

    .receipt-head .title[b-yzicjzaq66] {
        font-family: var(--font-medium);
    }

        .receipt-head .title i[b-yzicjzaq66] {
            margin-right: 0.3em;
        }

.pill[b-yzicjzaq66] {
    padding: 0.1em 0.7em;
    border-radius: 1em;
    font-size: 0.8em;
    font-family: var(--font-medium);
}

    .pill.lager[b-yzicjzaq66] {
        background: var(--color-bg-surface);
    }

    .pill.proizvodnja[b-yzicjzaq66] {
        background: #fff3cd;
        color: #664d03;
    }

.receipt p[b-yzicjzaq66] {
    margin: 0;
}

.muted[b-yzicjzaq66] {
    color: var(--color-text-muted);
    font-size: 0.9em;
}

.info[b-yzicjzaq66],
.warn[b-yzicjzaq66] {
    border-radius: 0.6em;
    padding: 0.5em 0.7em;
    font-size: 0.9em;
}

.info[b-yzicjzaq66] {
    background: white;
}

.warn[b-yzicjzaq66] {
    background: #fff3cd;
    color: #664d03;
}

.receive-form[b-yzicjzaq66] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11em, 1fr));
    gap: 0.6em;
}

.field[b-yzicjzaq66] {
    display: flex;
    flex-direction: column;
    gap: 0.25em;
    min-width: 0;
}

    .field.wide[b-yzicjzaq66] {
        grid-column: 1 / -1;
    }

    .field > label[b-yzicjzaq66] {
        font-size: 0.85em;
        font-family: var(--font-medium);
        margin: 0;
    }

.fixed[b-yzicjzaq66] {
    padding: 0.4em 0;
}

.receipts[b-yzicjzaq66] {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 0.85em;
}

    .receipts li[b-yzicjzaq66] {
        display: flex;
        flex-wrap: wrap;
        gap: 0.2em 0.8em;
        padding: 0.3em 0;
        border-top: 0.1em solid #d6e4f1;
    }

        .receipts li.reversed[b-yzicjzaq66] {
            color: var(--color-text-muted);
            text-decoration: line-through;
        }

.tag[b-yzicjzaq66] {
    text-decoration: none;
    padding: 0 0.4em;
    border-radius: 0.6em;
    background: #e9ecef;
}

.confirm[b-yzicjzaq66] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5em;
    background: #fdf1f1;
    border-radius: 0.6em;
    padding: 0.5em 0.7em;
}

    .confirm p[b-yzicjzaq66] {
        flex-basis: 100%;
        font-size: 0.9em;
    }

    .confirm .btn[b-yzicjzaq66] {
        min-height: 0;
    }

.counts .muted[b-yzicjzaq66] {
    margin-left: 0.3em;
}

/* Na skeneru: bijela kartica kao na dizajnu. */
.receipt.scan[b-yzicjzaq66] {
    background: white;
    border-color: #dbe4e9;
    padding: 1.1em 1.2em;
    gap: 0.7em;
}

.scan-head h5[b-yzicjzaq66] {
    margin: 0;
    font-size: 1.3em;
    font-family: var(--font-medium);
}

.kv[b-yzicjzaq66] {
    display: grid;
    grid-template-columns: 9em minmax(0, 1fr);
    gap: 0.4em 1em;
    margin: 0;
    font-size: 0.95em;
}

    .kv dt[b-yzicjzaq66] {
        color: var(--color-text-muted);
        font-weight: normal;
    }

    .kv dd[b-yzicjzaq66] {
        margin: 0;
        display: flex;
        align-items: center;
        gap: 0.4em;
        flex-wrap: wrap;
    }

.kg[b-yzicjzaq66] {
    font-family: var(--font-medium);
    font-size: 1.15em;
}

.done[b-yzicjzaq66] {
    background: #d1e7dd;
    color: #0f5132;
    border-radius: 0.6em;
    padding: 0.6em 0.8em;
    font-size: 0.95em;
}

.stock[b-yzicjzaq66] {
    font-size: 0.9em;
}

    .stock a[b-yzicjzaq66] {
        margin-left: 0.6em;
    }

.btn-lg[b-yzicjzaq66] {
    font-size: 1.1em;
    padding: 0.7em 1em;
}
/* _content/ArasWeb/Pages/Warehouse/MaterialReceiptScanner.razor.rz.scp.css */
#receipt-scanner[b-eyuvm2hpq8] {
    width: 100%;
    display: flex;
    flex-direction: column;
    color: var(--color-text-dark);
}

.two[b-eyuvm2hpq8] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.2em;
    align-items: start;
}

@media (min-width: 1000px) {
    .two[b-eyuvm2hpq8] {
        grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    }
}

/* Na telefonu skenirana stavka ide iznad kamere i liste, da se ne skrola do nje. */
@media (max-width: 999px) {
    .card-box.active[b-eyuvm2hpq8] {
        order: -1;
    }
}

.box[b-eyuvm2hpq8] {
    background: white;
    border-radius: 1em;
    padding: 1em;
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);
    min-width: 0;
}

.camera[b-eyuvm2hpq8] {
    position: relative;
    background: #0d1b24;
    border-radius: 0.8em;
    overflow: hidden;
    min-height: 13em;
}

    .camera[b-eyuvm2hpq8]  video,
    .camera[b-eyuvm2hpq8]  div {
        width: 100%;
    }

.camera-off[b-eyuvm2hpq8] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.6em;
    padding: 1em;
    color: #e4eef2;
    text-align: center;
    font-size: 0.9em;
}

    .camera-off .btn[b-eyuvm2hpq8] {
        background: white;
        gap: 0.4em;
    }

.manual[b-eyuvm2hpq8] {
    display: flex;
    gap: 0.5em;
    margin-top: 0.8em;
}

    .manual input[b-eyuvm2hpq8] {
        flex: 1;
        min-width: 0;
    }

.waiting-head[b-eyuvm2hpq8] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 0.5em;
    margin: 1.2em 0 0.6em;
}

    .waiting-head h5[b-eyuvm2hpq8] {
        margin: 0;
        font-size: 1em;
        font-family: var(--font-medium);
    }

    .waiting-head input[b-eyuvm2hpq8] {
        width: 16em;
        max-width: 100%;
    }

.muted[b-eyuvm2hpq8] {
    color: var(--color-text-muted);
    font-size: 0.9em;
}

.wait-list[b-eyuvm2hpq8] {
    display: flex;
    flex-direction: column;
    gap: 0.4em;
    max-height: 26em;
    overflow-y: auto;
}

/* flex-shrink: lista ima najveću visinu, pa bi se stavke inače sabile jedna u drugu. */
.wait[b-eyuvm2hpq8] {
    flex-shrink: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.8em;
    width: 100%;
    text-align: left;
    background: white;
    border: 0.1em solid var(--color-border);
    border-radius: 0.8em;
    padding: 0.6em 0.8em;
    color: var(--color-text-dark);
    min-height: 0;
}

    .wait:hover[b-eyuvm2hpq8] {
        border-color: var(--color-primary);
    }

    .wait.selected[b-eyuvm2hpq8] {
        border-color: var(--color-primary);
        background: #e5f0fc;
    }

.wait-text[b-eyuvm2hpq8] {
    display: flex;
    flex-direction: column;
    gap: 0.1em;
    min-width: 0;
}

    .wait-text b[b-eyuvm2hpq8] {
        font-family: var(--font-medium);
        font-weight: normal;
    }

    .wait-text small[b-eyuvm2hpq8] {
        color: var(--color-text-muted);
        overflow-wrap: anywhere;
    }

.empty[b-eyuvm2hpq8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.6em;
    padding: 3em 1em;
    color: var(--color-text-muted);
    text-align: center;
}

    .empty i[b-eyuvm2hpq8] {
        font-size: 2.4em;
        opacity: 0.35;
    }
/* _content/ArasWeb/Pages/Warehouse/MaterialStockAddModal.razor.rz.scp.css */
.add-body[b-m454qbjyrn] {
    padding: var(--space-lg);
}

.form-grid[b-m454qbjyrn] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(13em, 1fr));
    gap: var(--space-md) var(--space-lg);
}

.field[b-m454qbjyrn] {
    display: flex;
    flex-direction: column;
    gap: 0.3em;
    min-width: 0;
}

    .field.full[b-m454qbjyrn] {
        grid-column: 1 / -1;
    }

    .field > label[b-m454qbjyrn] {
        font-family: var(--font-medium);
        color: var(--color-text-dark);
        font-size: 0.9em;
        margin: 0;
    }

.shapes[b-m454qbjyrn] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.5em;
}

.shape[b-m454qbjyrn] {
    flex-direction: column;
    gap: 0.35em;
    padding: 0.6em 0.3em;
    border: 0.1em solid var(--color-border);
    border-radius: 0.6em;
    background: white;
    color: var(--color-text-dark);
    font-size: 0.85em;
    line-height: 1.1;
    text-align: center;
}

    .shape:hover[b-m454qbjyrn] {
        border-color: var(--color-primary);
    }

    .shape.active[b-m454qbjyrn] {
        border-color: var(--color-success);
        background: var(--color-bg-surface);
        font-family: var(--font-medium);
    }

.fixed-field[b-m454qbjyrn] {
    margin: 0;
    padding: 0.45em 0;
    color: var(--color-text-dark);
}

.muted[b-m454qbjyrn] {
    color: var(--color-text-muted);
    font-family: var(--font-light);
}

.calc[b-m454qbjyrn] {
    border: 0.1em solid #c9e0f7;
    background: #f0f7fd;
    border-radius: 0.8em;
    padding: var(--space-md);
}

.calc-title[b-m454qbjyrn] {
    font-family: var(--font-medium);
}

.calc-row[b-m454qbjyrn] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(8em, 1fr));
    gap: var(--space-md);
    align-items: end;
}

.done[b-m454qbjyrn] {
    display: flex;
    gap: var(--space-md);
    align-items: flex-start;
    color: var(--color-text-dark);
}

    .done i[b-m454qbjyrn] {
        color: var(--color-success);
        font-size: 1.8em;
    }

    .done p[b-m454qbjyrn] {
        margin: 0 0 0.4em 0;
    }

@media (max-width: 640px) {
    .shapes[b-m454qbjyrn] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.scan[b-m454qbjyrn] {
    border-bottom: 0.1em solid var(--color-border);
    padding-bottom: var(--space-md);
}

.scan-row[b-m454qbjyrn] {
    display: flex;
    gap: 0.5em;
}

    .scan-row input[b-m454qbjyrn] {
        flex: 1;
        min-width: 0;
    }

.plate-info[b-m454qbjyrn] {
    color: #0f5132;
}

    .plate-info i[b-m454qbjyrn] {
        margin-right: 0.3em;
    }
/* _content/ArasWeb/Pages/Warehouse/MaterialStockCardModal.razor.rz.scp.css */
.card-body-wrap[b-xy19oaviyh] {
    padding: var(--space-lg);
    color: var(--color-text-dark);
}

.card-head[b-xy19oaviyh] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6em;
    font-family: var(--font-medium);
    font-size: 1.05em;
    margin-bottom: var(--space-md);
}

.pill[b-xy19oaviyh] {
    display: inline-block;
    padding: 0.15em 0.7em;
    border-radius: 1em;
    font-size: 0.8em;
    font-family: var(--font-medium);
}

    .pill.lager[b-xy19oaviyh] {
        background: var(--color-bg-surface);
        color: var(--color-text-dark);
    }

    .pill.proizvodnja[b-xy19oaviyh] {
        background: #fff3cd;
        color: #664d03;
    }

.muted[b-xy19oaviyh] {
    color: var(--color-text-muted);
    font-family: var(--font-light);
    font-size: 0.9em;
}

.facts[b-xy19oaviyh] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(13em, 1fr));
    gap: var(--space-md);
    margin-bottom: var(--space-md);
}

.fact[b-xy19oaviyh] {
    display: flex;
    flex-direction: column;
    gap: 0.35em;
    border: 0.1em solid var(--color-border-light, #e3eaee);
    border-radius: 0.8em;
    padding: 0.7em 0.9em;
    min-width: 0;
}

    .fact > label[b-xy19oaviyh] {
        font-size: 0.8em;
        color: var(--color-text-muted);
        margin: 0;
    }

    .fact .btn[b-xy19oaviyh] {
        align-self: flex-start;
        min-height: 0;
    }

/* Ostala polja istog materijala; × ih uklanja. */
.field-chip[b-xy19oaviyh] {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    padding: 0.15em 0.3em 0.15em 0.6em;
    border-radius: 1em;
    background: var(--color-bg-surface, #e4eef2);
    color: var(--color-text-dark);
    font-variant-numeric: tabular-nums;
}

    .field-chip button[b-xy19oaviyh] {
        border: none;
        background: transparent;
        color: var(--color-text-muted);
        padding: 0 0.3em;
        line-height: 1;
    }

        .field-chip button:hover:not(:disabled)[b-xy19oaviyh] {
            color: var(--color-danger);
        }

.big[b-xy19oaviyh] {
    font-family: var(--font-medium);
    font-size: 1.5em;
    font-variant-numeric: tabular-nums;
}

.minus[b-xy19oaviyh] {
    color: var(--color-danger);
}

.plus[b-xy19oaviyh] {
    color: #198754;
}

.note[b-xy19oaviyh] {
    border-radius: 0.6em;
    padding: 0.6em 0.9em;
    margin: 0 0 var(--space-md);
    font-size: 0.9em;
}

    .note.warn[b-xy19oaviyh] {
        background: #f8d7da;
        color: #842029;
    }

    .note.low[b-xy19oaviyh] {
        background: #fff3cd;
        color: #664d03;
    }

.actions[b-xy19oaviyh] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
    margin-bottom: var(--space-md);
}

    .actions .btn[b-xy19oaviyh] {
        gap: 0.4em;
        border: 0.1em solid var(--color-border);
    }

        .actions .btn.active[b-xy19oaviyh] {
            border-color: var(--color-primary);
            background: var(--color-bg-surface);
        }

.panel[b-xy19oaviyh] {
    border: 0.1em solid #c9e0f7;
    background: #f0f7fd;
    border-radius: 0.8em;
    padding: var(--space-md);
    margin-bottom: var(--space-md);
}

    .panel h5[b-xy19oaviyh] {
        font-size: 1em;
        margin: 0 0 0.6em;
    }

    .panel p[b-xy19oaviyh] {
        margin: 0 0 0.6em;
    }

    .panel.reverse[b-xy19oaviyh] {
        background: #fdf1f1;
        border-color: #f1c4c4;
        margin: 0.3em 0 0.6em;
    }

.panel-grid[b-xy19oaviyh] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12em, 1fr));
    gap: var(--space-md);
    margin-bottom: 0.6em;
}

.field[b-xy19oaviyh] {
    display: flex;
    flex-direction: column;
    gap: 0.3em;
    min-width: 0;
}

    .field.wide[b-xy19oaviyh] {
        grid-column: span 2;
    }

    .field > label[b-xy19oaviyh] {
        font-size: 0.85em;
        font-family: var(--font-medium);
        margin: 0;
    }

.panel-buttons[b-xy19oaviyh] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5em;
}

.movements-title[b-xy19oaviyh] {
    font-size: 1em;
    margin: var(--space-md) 0 0.5em;
}

.movements[b-xy19oaviyh] {
    overflow-x: auto;
    font-size: 0.88em;
}

.mov-row[b-xy19oaviyh] {
    display: grid;
    grid-template-columns: 9.5em 8em 7em 7em 5em minmax(10em, 1fr) 9em 5.5em;
    gap: 0.6em;
    align-items: center;
    padding: 0.45em 0.6em;
    border-bottom: 0.1em solid #e3eaee;
    min-width: 62em;
    font-variant-numeric: tabular-nums;
}

    .mov-row.mov-head[b-xy19oaviyh] {
        background: var(--color-bg-header);
        font-family: var(--font-medium);
        border-radius: 0.4em;
        border-bottom: none;
    }

    .mov-row.reversed[b-xy19oaviyh] {
        color: var(--color-text-muted);
    }

    .mov-row .right[b-xy19oaviyh] {
        text-align: right;
        justify-self: end;
    }

    .mov-row .btn-link[b-xy19oaviyh] {
        min-height: 0;
        padding: 0 0.3em;
        color: var(--color-danger);
    }

.note-cell[b-xy19oaviyh] {
    word-break: break-word;
}

.tag[b-xy19oaviyh] {
    display: inline-block;
    margin-left: 0.3em;
    padding: 0 0.4em;
    border-radius: 0.6em;
    background: #e9ecef;
    font-size: 0.8em;
}

@media (max-width: 640px) {
    .field.wide[b-xy19oaviyh] {
        grid-column: auto;
    }
}
/* _content/ArasWeb/Pages/Warehouse/MaterialWarehouseOverview.razor.rz.scp.css */
.tiles[b-kqtg1am94l] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9.5em, 1fr));
    gap: 1em;
    padding: 0 1em;
}

.tile[b-kqtg1am94l] {
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* globalni stil dugmeta centrira */
    gap: 0.2em;
    text-align: left;
    border: 1px solid #dbe4e9;
    background: var(--color-bg-card);
    border-radius: 1em;
    padding: 0.9em 1.1em;
    color: var(--color-text-dark);
    font-family: var(--font-light);
}

button.tile[b-kqtg1am94l] {
    cursor: pointer;
    transition: border-color 0.15s ease;
}

    button.tile:hover[b-kqtg1am94l] {
        border-color: var(--color-primary);
    }

.tile label[b-kqtg1am94l] {
    margin: 0;
    color: var(--color-text-muted);
    font-size: 0.85em;
    cursor: inherit;
}

.tile .v[b-kqtg1am94l] {
    font-family: var(--font-medium);
    font-size: 1.5em;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

    .tile .v small[b-kqtg1am94l] {
        font-family: var(--font-light);
        font-size: 0.6em;
        color: var(--color-text-muted);
    }

.tile > small[b-kqtg1am94l] {
    color: var(--color-text-muted);
    font-size: 0.8em;
}

.tile.alert .v[b-kqtg1am94l] {
    color: var(--color-danger);
}

.two[b-kqtg1am94l] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1em;
    padding: 1.2em 1em 1em;
}

@media (min-width: 1000px) {
    .two[b-kqtg1am94l] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }
}

.box[b-kqtg1am94l] {
    border: 1px solid #dbe4e9;
    border-radius: 1em;
    padding: 1em 1.1em;
    min-width: 0;
}

    .box h5[b-kqtg1am94l] {
        font-family: var(--font-medium);
        font-size: 1em;
        color: var(--color-text-dark);
        margin-bottom: 0.8em;
    }

.muted[b-kqtg1am94l] {
    color: var(--color-text-muted);
}

.bar-legend[b-kqtg1am94l] {
    display: flex;
    gap: 1em;
    font-size: 0.8em;
    color: var(--color-text-muted);
    margin-bottom: 0.6em;
}

    .bar-legend > span[b-kqtg1am94l] {
        display: inline-flex;
        align-items: center;
        gap: 0.35em;
    }

.swatch[b-kqtg1am94l] {
    display: inline-block;
    width: 1em;
    height: 0.7em;
    border-radius: 0.2em;
    background: var(--color-icon-accent);
}

    .swatch.light[b-kqtg1am94l] {
        opacity: 0.45;
    }

.bars[b-kqtg1am94l] {
    display: grid;
    grid-template-columns: minmax(6em, auto) minmax(0, 1fr) auto;
    gap: 0.6em 0.8em;
    align-items: center;
    font-size: 0.9em;
}

.bar-name[b-kqtg1am94l] {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    color: var(--color-text-dark);
}

.track[b-kqtg1am94l] {
    display: flex;
    height: 1.1em;
    background: var(--color-bg-surface);
    border-radius: 0.3em;
    overflow: hidden;
}

.bar[b-kqtg1am94l] {
    height: 100%;
}

    .bar.light[b-kqtg1am94l] {
        opacity: 0.45;
    }

.bar-kg[b-kqtg1am94l] {
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    color: var(--color-text-dark);
}

    .bar-kg small[b-kqtg1am94l] {
        display: block;
        color: var(--color-text-muted);
    }

.dot[b-kqtg1am94l] {
    display: inline-block;
    flex: none;
    width: 0.65em;
    height: 0.65em;
    border-radius: 50%;
}

.short[b-kqtg1am94l] {
    display: flex;
    flex-direction: column;
}

.short-row[b-kqtg1am94l] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.3em 1em;
    align-items: center;
    border-bottom: 1px solid var(--color-border-light);
    padding: 0.55em 0;
}

    .short-row b[b-kqtg1am94l] {
        font-family: var(--font-medium);
        font-weight: normal;
        color: var(--color-text-dark);
        overflow-wrap: anywhere;
    }

    .short-row small[b-kqtg1am94l] {
        display: block;
        color: var(--color-text-muted);
        font-variant-numeric: tabular-nums;
    }

.short-actions[b-kqtg1am94l] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 0.4em;
}

    .short-actions .btn[b-kqtg1am94l] {
        display: inline-flex;
        align-items: center;
        gap: 0.35em;
        white-space: nowrap;
    }

.box-head[b-kqtg1am94l] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: baseline;
    gap: 0.5em;
}

/* Lista ili po dobavljaču, kao prekidač prikaza na stranici. */
.mini-toggle[b-kqtg1am94l] {
    display: inline-flex;
    border-radius: 0.6em;
    background: var(--color-bg-surface);
    padding: 0.15em;
    gap: 0.15em;
    font-size: 0.85em;
}

    .mini-toggle button[b-kqtg1am94l] {
        border: none;
        background: transparent;
        border-radius: 0.5em;
        padding: 0.25em 0.8em;
        color: var(--color-text-muted);
    }

        .mini-toggle button.active[b-kqtg1am94l] {
            background: var(--color-bg-card);
            color: var(--color-text-dark);
            font-family: var(--font-medium);
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
        }

.supplier-group[b-kqtg1am94l] {
    margin-bottom: 1em;
}

.supplier-head[b-kqtg1am94l] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5em 1em;
    flex-wrap: wrap;
    padding: 0.5em 0.7em;
    border-radius: 0.6em;
    background: var(--color-bg-surface);
}

    .supplier-head b[b-kqtg1am94l] {
        font-family: var(--font-medium);
        font-weight: normal;
        color: var(--color-text-dark);
    }

    .supplier-head small[b-kqtg1am94l] {
        display: block;
        color: var(--color-text-muted);
    }

    .supplier-head .btn[b-kqtg1am94l] {
        display: inline-flex;
        align-items: center;
        gap: 0.35em;
        white-space: nowrap;
    }

.supplier-group .short-row[b-kqtg1am94l] {
    padding-left: 0.7em;
}

.covered[b-kqtg1am94l] {
    color: #0b5394;
    font-size: 0.8em;
}
/* _content/ArasWeb/Pages/Warehouse/PrintSticker.razor.rz.scp.css */
#print-sticker-page[b-jk51ddwt4h] {
    padding: 1.5em;
    max-width: 600px;
    margin: 0 auto;
}

#print-sticker-form[b-jk51ddwt4h] {
    background: white;
    padding: 1.5em;
    border-radius: 1em;
    display: flex;
    flex-direction: column;
    gap: 1.2em;
}

.section-description[b-jk51ddwt4h] {
    color: #6c757d;
    margin-bottom: 0;
}

.input-row[b-jk51ddwt4h] {
    display: flex;
    gap: 0.6em;
}

.input-row input[b-jk51ddwt4h] {
    flex: 1;
    font-size: 1.1rem;
    letter-spacing: 1px;
}

#sticker-preview[b-jk51ddwt4h] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 1em;
    padding: 1em;
    border-radius: 0.5em;
    background: #f8f9fa;
    flex-wrap: wrap;
}

#sticker-qr-preview img[b-jk51ddwt4h] {
    width: 90px;
    height: 90px;
}

#sticker-info[b-jk51ddwt4h] {
    display: flex;
    flex-direction: column;
    gap: 0.3em;
    flex: 1;
}

.ar-code-big[b-jk51ddwt4h] {
    font-size: 1.4rem;
    font-weight: bold;
    color: #14425a;
    letter-spacing: 2px;
}

.destination-label[b-jk51ddwt4h] {
    font-size: 0.9rem;
    font-weight: bold;
    padding: 0.2em 0.6em;
    border-radius: 0.3em;
    display: inline-block;
    width: fit-content;
}

.destination-lager[b-jk51ddwt4h] {
    background: #cce5ff;
    color: #004085;
}

.destination-proizvodnja[b-jk51ddwt4h] {
    background: #d4edda;
    color: #155724;
}

.mat-name-label[b-jk51ddwt4h] {
    font-size: 0.85rem;
    color: #6c757d;
}
/* _content/ArasWeb/Pages/Warehouse/SkladisteMaterijala.razor.rz.scp.css */
#warehouse[b-gyon5c2o73] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#warehouse-container[b-gyon5c2o73] {
    width: 100%;
    border-radius: 0.5em;
    padding: 1em 0;
    background: var(--color-bg-card);
}

.search[b-gyon5c2o73] {
    position: relative;
    display: flex;
    align-items: center;
}

    .search i[b-gyon5c2o73] {
        position: absolute;
        left: 0.8em;
        color: var(--color-text-muted);
        pointer-events: none;
    }

    .search input[b-gyon5c2o73] {
        padding-left: 2.2em;
        width: 17em;
    }

.dimension[b-gyon5c2o73] {
    width: 11em;
}

.add-btn[b-gyon5c2o73] {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
}

.switched-off[b-gyon5c2o73] {
    margin: 0 1em var(--space-md);
    padding: 0.6em 0.9em;
    border-radius: 0.6em;
    background: #fff3cd;
    color: #664d03;
    font-size: 0.9em;
}

.filters[b-gyon5c2o73] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0.5em 1.5em;
    padding: 0 1em;
    font-family: var(--font-light);
    font-size: 0.9em;
}

.filter-box[b-gyon5c2o73] {
    display: flex;
    flex-direction: column;
}

    .filter-box label[b-gyon5c2o73] {
        margin-bottom: 0.5em;
    }

    .filter-box select[b-gyon5c2o73] {
        width: 14em;
        padding: 0.5em 0.2em;
    }

.check[b-gyon5c2o73] {
    display: flex;
    align-items: center;
    gap: 0.4em;
    min-height: 2.4em;
    margin: 0;
    cursor: pointer;
}

.filter-actions[b-gyon5c2o73] {
    margin-left: auto;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
}

    .filter-actions .btn[b-gyon5c2o73] {
        display: inline-flex;
        align-items: center;
        gap: 0.4em;
    }

.excel-btn img[b-gyon5c2o73] {
    width: 1.2em;
    height: 1.2em;
}

/* Stalaža i kontrolna tabla imaju svoj skrol, kao spisak. */
#racks[b-gyon5c2o73],
#overview[b-gyon5c2o73] {
    overflow-y: auto;
    padding-top: var(--space-md);
}

.answer[b-gyon5c2o73] {
    margin: var(--space-md) 1em 0;
    padding: 0.8em 1.1em;
    border-radius: 0.8em;
    background: var(--color-bg-surface);
    color: var(--color-text-dark);
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.4em 1.2em;
}

    .answer .big[b-gyon5c2o73] {
        font-family: var(--font-medium);
        font-size: 1.6em;
        font-variant-numeric: tabular-nums;
    }

.muted[b-gyon5c2o73] {
    color: var(--color-text-muted);
}

.minus[b-gyon5c2o73] {
    color: var(--color-danger) !important;
}

/* Širine kolona; struktura liste dolazi iz site.css. */
.material[b-gyon5c2o73] {
    width: 22%;
    word-break: break-word;
    font-family: var(--font-medium);
}

    .material small[b-gyon5c2o73] {
        display: block;
        font-family: var(--font-light);
        color: var(--color-text-muted);
    }

.type[b-gyon5c2o73] {
    width: 9%;
}

.shape[b-gyon5c2o73] {
    width: 14%;
    display: flex;
    align-items: center;
    gap: 0.45em;
}

.section[b-gyon5c2o73] {
    width: 12%;
    white-space: nowrap;
}

.location[b-gyon5c2o73] {
    width: 8%;
}

.kg[b-gyon5c2o73],
.minimum[b-gyon5c2o73],
.incoming[b-gyon5c2o73] {
    width: 11%;
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* Na užem laptopu naslov kolone ide u dva reda; kilaže ostaju u jednom. */
.list-header .kg[b-gyon5c2o73],
.list-header .minimum[b-gyon5c2o73],
.list-header .incoming[b-gyon5c2o73] {
    white-space: normal;
}

.kg[b-gyon5c2o73] {
    font-family: var(--font-medium);
}

.in[b-gyon5c2o73] {
    display: inline-block;
    padding: 0.1em 0.6em;
    border-radius: 1em;
    background: #e5f0fc;
    color: #0b5394;
    font-size: 0.9em;
}

.low[b-gyon5c2o73] {
    display: inline-block;
    padding: 0.1em 0.6em;
    border-radius: 1em;
    background: #fff3cd;
    color: #664d03;
    font-size: 0.9em;
}

/* Naručeno, a još nikad na stanju: nema karticu. */
#stock-list .incoming-only[b-gyon5c2o73] {
    cursor: default;
    color: var(--color-text-muted);
}

.not-yet[b-gyon5c2o73] {
    width: 6.5em;
    text-align: center;
    color: var(--color-text-muted);
    font-size: 0.8em;
}

.list-foot[b-gyon5c2o73] {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5em;
    padding: 0 1em;
    color: var(--color-text-muted);
    font-size: 0.9em;
}

    .list-foot b[b-gyon5c2o73] {
        color: var(--color-text-dark);
        font-variant-numeric: tabular-nums;
    }

/* Proizvodnja po materijalu ili po poziciji. */
.view-toggle[b-gyon5c2o73] {
    display: inline-flex;
    border-radius: 0.6em;
    background: var(--color-bg-surface);
    padding: 0.2em;
    gap: 0.2em;
}

    .view-toggle button[b-gyon5c2o73] {
        border: none;
        background: transparent;
        border-radius: 0.5em;
        padding: 0.4em 0.9em;
        color: var(--color-text-muted);
        display: inline-flex;
        align-items: center;
        gap: 0.4em;
    }

        .view-toggle button.active[b-gyon5c2o73] {
            background: var(--color-bg-card);
            color: var(--color-text-dark);
            font-family: var(--font-medium);
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
        }

/* Materijal u radu po poziciji: lista sa svojim skrolom, kao spisak stanja. */
#in-work[b-gyon5c2o73] {
    overflow-y: auto;
    padding: var(--space-md) 1em 0;
}

    #in-work .intro[b-gyon5c2o73] {
        font-size: 0.9em;
        margin-bottom: var(--space-sm);
    }

.in-work-row[b-gyon5c2o73] {
    display: grid;
    grid-template-columns: 1.2fr 1.2fr 2.4fr 0.7fr 1fr 0.9fr;
    gap: 0.5em;
    align-items: center;
    padding: 0.5em 0.6em;
    border-bottom: 0.1em solid var(--color-border-light);
    font-size: 0.92em;
}

.in-work-head[b-gyon5c2o73] {
    position: sticky;
    top: 0;
    background: var(--color-bg-card);
    color: var(--color-text-muted);
    font-size: 0.85em;
}

.in-work-row .right[b-gyon5c2o73] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.in-work-row .position[b-gyon5c2o73],
.in-work-row .kg-cell[b-gyon5c2o73] {
    font-family: var(--font-medium);
}

    .in-work-row > span:last-child[b-gyon5c2o73] {
        padding-left: 0.8em;
    }

/* Otpad: period, zbir i lista, kao u radu po nalogu. */
#waste[b-gyon5c2o73] {
    overflow-y: auto;
    padding: var(--space-md) 1em 0;
}

    #waste .intro[b-gyon5c2o73] {
        font-size: 0.9em;
        margin: var(--space-sm) 0;
    }

.waste-period[b-gyon5c2o73] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5em;
    color: var(--color-text-muted);
}

    .waste-period input[b-gyon5c2o73] {
        width: 10.5em;
    }

.waste-summary[b-gyon5c2o73] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0.6em 2em;
    padding: 0.8em 1.1em;
    border-radius: 0.8em;
    background: var(--color-bg-surface);
    color: var(--color-text-dark);
}

.waste-figure[b-gyon5c2o73] {
    display: flex;
    flex-direction: column;
}

    .waste-figure b[b-gyon5c2o73] {
        font-family: var(--font-medium);
        font-variant-numeric: tabular-nums;
        font-size: 1.1em;
    }

    .waste-figure.main b[b-gyon5c2o73] {
        font-size: 1.6em;
    }

.waste-types[b-gyon5c2o73] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4em 1em;
    margin-left: auto;
    font-size: 0.9em;
}

.waste-type[b-gyon5c2o73] {
    display: inline-flex;
    align-items: center;
    gap: 0.35em;
}

    .waste-type i[b-gyon5c2o73] {
        width: 0.7em;
        height: 0.7em;
        border-radius: 50%;
    }

    .waste-type b[b-gyon5c2o73] {
        font-variant-numeric: tabular-nums;
    }

.waste-unknown[b-gyon5c2o73] {
    margin: var(--space-sm) 0 0;
    font-size: 0.88em;
    color: var(--color-text-muted);
}

.waste-row[b-gyon5c2o73] {
    display: grid;
    grid-template-columns: 0.8fr 1.4fr 2.2fr 1fr 0.8fr 0.8fr 0.8fr;
    gap: 0.5em;
    align-items: center;
    padding: 0.5em 0.6em;
    border-bottom: 0.1em solid var(--color-border-light);
    font-size: 0.92em;
}

.waste-head[b-gyon5c2o73] {
    position: sticky;
    top: 0;
    margin-top: var(--space-sm);
    background: var(--color-bg-card);
    color: var(--color-text-muted);
    font-size: 0.85em;
}

.waste-row .right[b-gyon5c2o73] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.waste-row .position[b-gyon5c2o73],
.waste-row .kg-cell[b-gyon5c2o73] {
    font-family: var(--font-medium);
}

@media (max-width: 768px) {
    .waste-head[b-gyon5c2o73] {
        display: none;
    }

    .waste-row[b-gyon5c2o73] {
        grid-template-columns: 1fr 1fr;
    }

        .waste-row .right[b-gyon5c2o73] {
            text-align: left;
        }

            .waste-row .right[b-gyon5c2o73]::before {
                content: attr(data-label) " ";
                color: var(--color-text-muted);
                font-family: var(--font-light);
            }

    .waste-types[b-gyon5c2o73] {
        margin-left: 0;
    }

    .in-work-head[b-gyon5c2o73] {
        display: none;
    }

    .in-work-row[b-gyon5c2o73] {
        grid-template-columns: 1fr 1fr;
    }

        .in-work-row .right[b-gyon5c2o73] {
            text-align: left;
        }

    .search input[b-gyon5c2o73],
    .dimension[b-gyon5c2o73] {
        width: 100%;
    }

    .filter-actions[b-gyon5c2o73] {
        margin-left: 0;
    }

    #stock-list .list-header[b-gyon5c2o73] {
        display: none !important;
    }

    #stock-list .list-item[b-gyon5c2o73] {
        flex-direction: column;
        align-items: stretch;
        gap: var(--space-sm);
    }

        #stock-list .list-item > span[b-gyon5c2o73] {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 0.4em var(--space-md);
            width: 100%;
        }

        #stock-list .list-item label[b-gyon5c2o73] {
            width: auto;
            text-align: left;
        }

        #stock-list .list-item .material[b-gyon5c2o73] {
            grid-column: 1 / -1;
        }

        #stock-list .list-item button[b-gyon5c2o73] {
            width: 100%;
        }
}
/* _content/ArasWeb/Pages/Warehouse/WarehouseRacksModal.razor.rz.scp.css */
.racks-body[b-gu8v7lne30] {
    padding: var(--space-lg);
    color: var(--color-text-dark);
}

.muted[b-gu8v7lne30] {
    color: var(--color-text-muted);
    font-family: var(--font-light);
    font-size: 0.9em;
}

.empty[b-gu8v7lne30] {
    color: var(--color-text-muted);
    margin: var(--space-md) 0;
}

.rack-row[b-gu8v7lne30] {
    display: grid;
    grid-template-columns: 5em minmax(8em, 1fr) 6em 6em 6em 10em;
    gap: 0.6em;
    align-items: center;
    padding: 0.4em 0;
    border-bottom: 0.1em solid #e3eaee;
}

    .rack-row.rack-head[b-gu8v7lne30] {
        font-family: var(--font-medium);
        border-bottom: none;
    }

        /* Na ćelijama, ne na redu: kolone su u em, pa bi manji red imao uže kolone. */
        .rack-row.rack-head span[b-gu8v7lne30] {
            font-size: 0.85em;
        }

.number[b-gu8v7lne30] {
    font-family: var(--font-medium);
    font-size: 1.2em;
    text-align: center;
}

.row-buttons[b-gu8v7lne30] {
    display: flex;
    gap: 0.4em;
}

    .row-buttons .btn[b-gu8v7lne30] {
        min-height: 0;
    }

.add-rack[b-gu8v7lne30] {
    margin-top: var(--space-md);
    gap: 0.4em;
}

@media (max-width: 640px) {
    .rack-row[b-gu8v7lne30] {
        grid-template-columns: 4em 1fr 1fr;
    }

        .rack-row.rack-head[b-gu8v7lne30] {
            display: none;
        }
}
/* _content/ArasWeb/Pages/Warehouse/WorkOrderStockInfo.razor.rz.scp.css */
label[b-vk9fr4q8ea] {
    font-family: var(--font-regular);
    font-size: 0.9em;
}

.stock-line[b-vk9fr4q8ea] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4em;
    margin-top: 0.3em;
}

.chip[b-vk9fr4q8ea] {
    display: inline-flex;
    align-items: center;
    gap: 0.35em;
    padding: 0.2em 0.7em;
    border-radius: 1em;
    background: var(--color-bg-surface);
    color: var(--color-text-dark);
    font-size: 0.9em;
}

    .chip b[b-vk9fr4q8ea] {
        font-family: var(--font-medium);
        font-weight: normal;
        font-variant-numeric: tabular-nums;
    }

    .chip.in[b-vk9fr4q8ea] {
        background: #e5f0fc;
        color: #0b5394;
    }

    .chip.minus b[b-vk9fr4q8ea] {
        color: var(--color-danger);
    }

.verdict[b-vk9fr4q8ea] {
    margin: 0.5em 0 0;
    font-size: 0.9em;
    color: var(--color-text-dark);
}

    .verdict b[b-vk9fr4q8ea] {
        font-family: var(--font-medium);
        font-weight: normal;
    }

    .verdict.ok[b-vk9fr4q8ea] {
        color: #1d6b33;
    }

    .verdict.short[b-vk9fr4q8ea] {
        color: #8a6d00;
    }

.muted[b-vk9fr4q8ea] {
    margin: 0.3em 0 0;
    color: var(--color-text-muted);
    font-size: 0.9em;
}
/* _content/ArasWeb/Shared/Components/ArasModal.razor.rz.scp.css */
.modal-header[b-ou40ttfqto] {
    background: var(--ar-bg-surface);
    color: var(--ar-text);
    border: none;
    border-bottom: 1px solid var(--ar-border-subtle);
    padding: var(--ar-space-4) var(--ar-space-6);
    border-top-left-radius: var(--ar-radius-lg);
    border-top-right-radius: var(--ar-radius-lg);
    min-height: 3.5rem;
}

    .modal-header .modal-title[b-ou40ttfqto] {
        font-family: var(--ar-font);
        font-weight: var(--ar-fw-medium);
        font-size: var(--ar-fs-lg);
        line-height: 1.3;
        color: var(--ar-text);
    }

.header-warning .modal-title[b-ou40ttfqto] {
    color: var(--ar-danger-text);
}

.modal-header .modal-close-btn[b-ou40ttfqto] {
    width: var(--ar-h-sm);
    min-height: var(--ar-h-sm);
    height: var(--ar-h-sm);
    padding: 0;
    color: var(--ar-text-muted);
    background: transparent;
    outline: none;
    border: none;
    font-size: var(--ar-fs-base);
    cursor: pointer;
    border-radius: var(--ar-radius-sm);
}

.modal-header .modal-close-btn:hover[b-ou40ttfqto] {
    background: var(--ar-bg-hover);
    color: var(--ar-text);
}

.modal-footer[b-ou40ttfqto] {
    padding: 1.5rem 1rem;
    background: var(--color-sidebar-start);
}

.modal[b-ou40ttfqto] {
    justify-content: center;
    align-items: center;
    display: flex;
}

.modal.show .modal-dialog[b-ou40ttfqto] {
    animation: modalFadeIn-b-ou40ttfqto 0.2s ease-out;
}

@keyframes modalFadeIn-b-ou40ttfqto {
    from {
        opacity: 0;
        transform: translateY(-10px) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.modal-body[b-ou40ttfqto] {
    padding: 0;
    background: var(--color-bg-card);
    flex: 1;
    display: flex;
    flex-direction: column;
    border-radius: 0 0 var(--ar-radius-lg) var(--ar-radius-lg);
    overflow-y: auto;
}

.modal-dialog[b-ou40ttfqto] {
    width: 100%;
    max-height: 80vh;
    height: auto;
    margin: 0;
}

.modal-content[b-ou40ttfqto] {
    height: 100%;
    border: none;
    border-radius: var(--ar-radius-lg);
    box-shadow: var(--ar-shadow-lg);
    display: flex;
    flex-direction: column;
    max-height: 80vh;
}

/* Podnožje = ar-modal-footer: Odustani sekundarno, glavna radnja plava, opasna crvena. */
[b-ou40ttfqto] .buttons {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: end;
    align-items: center;
    gap: var(--ar-space-2);
    background: var(--ar-bg-sunken);
    border-top: 1px solid var(--ar-border-subtle);
    border-bottom-left-radius: var(--ar-radius-lg);
    border-bottom-right-radius: var(--ar-radius-lg);
    padding: var(--ar-space-4) var(--ar-space-6);
    /* Dug obrazac (kupac) ne smije stisnuti podnožje: skroluje tijelo, dugmad ostaju odmaknuta od dna. */
    flex-shrink: 0;
}

    [b-ou40ttfqto] .buttons button {
        outline: none;
        background: var(--ar-primary);
        border: 1px solid transparent;
        color: var(--ar-text-inverse);
        box-shadow: none !important;
        margin-left: 0;
    }

    [b-ou40ttfqto] .buttons button:hover:not(:disabled) {
        background: var(--ar-primary-hover);
    }

    [b-ou40ttfqto] .buttons button:disabled {
        opacity: .5;
        cursor: not-allowed;
    }

    [b-ou40ttfqto] .buttons button i {
        margin-right: 0;
    }

    [b-ou40ttfqto] .buttons .danger-btn {
        background: var(--ar-danger);
    }

    [b-ou40ttfqto] .buttons .danger-btn:hover:not(:disabled) {
        background: var(--ar-danger-hover);
    }

    [b-ou40ttfqto] .buttons .cancel-btn,
    [b-ou40ttfqto] .buttons .ghost-btn,
    [b-ou40ttfqto] .buttons .secondary-btn,
    [b-ou40ttfqto] .buttons .print-btn,
    [b-ou40ttfqto] .buttons .next-btn {
        background: var(--ar-btn-secondary);
        border-color: var(--ar-btn-secondary);
        color: var(--ar-text-inverse);
    }

    [b-ou40ttfqto] .buttons .cancel-btn:hover:not(:disabled),
    [b-ou40ttfqto] .buttons .ghost-btn:hover:not(:disabled),
    [b-ou40ttfqto] .buttons .secondary-btn:hover:not(:disabled),
    [b-ou40ttfqto] .buttons .print-btn:hover:not(:disabled),
    [b-ou40ttfqto] .buttons .next-btn:hover:not(:disabled) {
        background: var(--ar-btn-secondary-hover);
        border-color: var(--ar-btn-secondary-hover);
        color: var(--ar-text-inverse);
    }

    [b-ou40ttfqto] .buttons .btn-success {
        background: var(--ar-success);
    }

[b-ou40ttfqto] .buttons-warning {
    background: var(--ar-warning-soft);
    color: var(--ar-warning-text);
}

[b-ou40ttfqto] .custom-modal-body {
    width: 100%;
    flex: 1;
    min-height: 0;
    padding: var(--ar-space-6);
    scrollbar-gutter: stable;
    display: flex;
    justify-content: flex-start;
    align-items: start;
    flex-direction: column;
    overflow-y: auto;
}

[b-ou40ttfqto] .modal-body .modal-body-input {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 0 var(--ar-space-8);
}

[b-ou40ttfqto] .modal-body-wide-container .modal-body-input {
    padding: 0 var(--ar-space-2);
}

    [b-ou40ttfqto] .modal-body .modal-body-input .modal-input-box {
        display: flex;
        flex-direction: column;
        margin-bottom: var(--space-md);
    }

[b-ou40ttfqto] .modal-body label {
    margin-bottom: .375rem;
    font-family: var(--ar-font);
    font-weight: var(--ar-fw-medium);
    font-size: var(--ar-fs-md);
    color: var(--ar-text);
}

/* Pitanje potvrde = ar-confirm: rečenica, ne velika slova. */
[b-ou40ttfqto] .modal-question {
    width: 100%;
    padding: 0;
    text-align: left;
    font-family: var(--ar-font);
    font-weight: var(--ar-fw-medium);
    font-size: var(--ar-fs-lg);
    line-height: 1.35;
    color: var(--ar-text);
    margin: 0;
}

/* Ikona samo uz pitanje potvrde; modal-body-danger nose i detalji (npr. Dorada) bez pitanja. */
[b-ou40ttfqto] .modal-body-danger:has(> .modal-question) {
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: var(--ar-space-4);
}

[b-ou40ttfqto] .modal-body-danger:has(> .modal-question)::before {
    content: "\f071";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    flex: none;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--ar-danger-soft);
    color: var(--ar-danger);
}

[b-ou40ttfqto] .modal-body-danger p:not(.modal-question) {
    color: var(--ar-text-muted);
}

[b-ou40ttfqto] .modal-confirm-quest {
    color: var(--color-primary);
    font-family: var(--font-medium);
    font-size: 1.4em;
    text-align: center;
    width: 100%;
}

[b-ou40ttfqto] .info-message {
    text-align: center;
    padding: 0 3em;
    font-size: 0.9em;
}
/* _content/ArasWeb/Shared/Components/ArticleInput.razor.rz.scp.css */
#create-article[b-r5pt29s28i] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}

h5[b-r5pt29s28i] {
    color: var(--color-sidebar-start);
}

h4[b-r5pt29s28i] {
    margin-bottom: 0;
}

#other-costs h5 span[b-r5pt29s28i] {
    font-size: 0.6em;
    display: inline-block;
    font-family: var(--font-italic);
    margin-left: 0.5em;
}

#create-article-container[b-r5pt29s28i] {
    width: 100%;
    height: 95%;
    display: flex;
    flex-direction: column;
}

/* First row with 3 columns: Article, Material, Order+Drawing */
#article-material-order-drawing-info[b-r5pt29s28i] {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

#article-info[b-r5pt29s28i],
#material-info[b-r5pt29s28i],
#order-data-and-drawing[b-r5pt29s28i] {
    width: 32%;
    height: 100%;
    display: flex;
    flex-direction: column;
    background: white;
    padding: 1em;
    border-radius: 1em;
}

#time-costs[b-r5pt29s28i] {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

#time-costs[b-r5pt29s28i],
#other-costs[b-r5pt29s28i],
#calculator[b-r5pt29s28i],
#note[b-r5pt29s28i],
#discount[b-r5pt29s28i] {
    height: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    background: white;
    padding: 1em;
    border-radius: 1em;
}

/* Order Data and Drawing combined section */
#order-data-and-drawing[b-r5pt29s28i] {
    display: flex;
    flex-direction: column;
    gap: 1em;
}

#order-data-section[b-r5pt29s28i],
#drawing-section[b-r5pt29s28i] {
    display: flex;
    flex-direction: column;
}

#order-data-section h5[b-r5pt29s28i],
#drawing-section h5[b-r5pt29s28i] {
    margin-bottom: 0.5em;
}

#order-data-container[b-r5pt29s28i] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.5em;
}

#time-costs[b-r5pt29s28i],
#other-costs[b-r5pt29s28i],
#calculator[b-r5pt29s28i] {
    width: 100%;
    margin-top: 2em;
}

#article-info-container[b-r5pt29s28i],
#material-info-container[b-r5pt29s28i] {
    width: 100%;
    height: 95%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-top: 1em;
}

.input-box[b-r5pt29s28i],
[b-r5pt29s28i] .input-box,
#machine-time[b-r5pt29s28i] {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: flex-start;
    width: 100%;
    margin-bottom: 1em;
    position: relative;
}

    .input-box label[b-r5pt29s28i],
    [b-r5pt29s28i] .input-box label, 
    .time-cost label[b-r5pt29s28i],
    #ensats label[b-r5pt29s28i],
    #surface-treatment label[b-r5pt29s28i],
    #machine-time label[b-r5pt29s28i],
    #add-quantity label[b-r5pt29s28i],
    #note label[b-r5pt29s28i] {
        width: 100%;
        margin-bottom: 0.3em;
        font-family: var(--font-light);
    }


.input-wrapper[b-r5pt29s28i] {
    width: 100%;
    position: relative;
    display: block;
}

.unit[b-r5pt29s28i] {
    position: absolute;
    /* Lijevo od strelica broja, koje Chrome crta uz desnu ivicu polja. */
    right: 2.25rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--ar-text-muted);
    z-index: 2;
    font-size: var(--ar-fs-sm);
    pointer-events: none;
}

.input-wrapper[b-r5pt29s28i]  input {
    padding-right: 4.5rem;
}

.material-typeahead-box[b-r5pt29s28i] {
    position: relative;
    z-index: 200;
}

.material-dropdown[b-r5pt29s28i] {
    margin-bottom: 0.5em;
}

#article-shape[b-r5pt29s28i] {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 0.5em;
}

    #article-shape div[b-r5pt29s28i] {
        display: flex;
        justify-content: center;
        align-items: center;
        flex: 1;
        cursor: pointer;
        padding: 0.5em;
        border-radius: 0.5em;
    }

.selected-shape[b-r5pt29s28i] {
    border: 0.1em solid #5cb85c;
    background: var(--color-bg-surface);
}

.unselected-shape[b-r5pt29s28i] {
    border: 0.1em solid lightgray;
    background: white;
}

.circle[b-r5pt29s28i],
.square[b-r5pt29s28i] {
    height: 2em;
    width: 2em;
    background-color: var(--color-text-dark);
    display: inline-flex;
}

.circle[b-r5pt29s28i] {
    border-radius: 50%;
}

.l-profile[b-r5pt29s28i] {
    height: 2em;
    width: 2em;
    display: inline-block;
    background: var(--color-text-dark);
    clip-path: polygon(0% 0%, 30% 0%, 30% 70%, 100% 70%, 100% 100%, 0% 100%);
}

.square-tube[b-r5pt29s28i] {
    height: 2em;
    width: 2em;
    display: inline-block;
    border: 0.45em solid var(--color-text-dark);
    background: transparent;
    box-sizing: border-box;
}

.round-tube[b-r5pt29s28i] {
    height: 2em;
    width: 2em;
    display: inline-block;
    border: 0.45em solid var(--color-text-dark);
    border-radius: 50%;
    background: transparent;
    box-sizing: border-box;
}

.validation-warning[b-r5pt29s28i] {
    color: #d9534f;
    font-size: 0.85em;
    margin: 0.3em 0 0 0;
}

#calculated-material-params[b-r5pt29s28i] {
    background: #e8e8e8;
    border-radius: 0.3em;
    padding: 1em;
    display: flex;
    flex-direction: column;
    align-items: end;
    font-size: 1.1rem;
    color: var(--color-text-dark);
    font-family: var(--font-medium);
}

    #calculated-material-params div[b-r5pt29s28i] {
        display: flex;
        justify-content: space-between;
        width: 100%;
    }

#material-price[b-r5pt29s28i] {
    color: var(--color-primary-hover);
}


#machine-time[b-r5pt29s28i],
.time-cost[b-r5pt29s28i],
.time-price[b-r5pt29s28i] {
    width: 30%;
    position: relative;
}

    #machine-time img[b-r5pt29s28i] {
        width: 1.5em;
        margin: 0.5em;
    }

#other-time-costs[b-r5pt29s28i] {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    position: relative;
    flex-wrap: wrap
}

.time-price[b-r5pt29s28i] {
    background: #e8e8e8;
    border-radius: 0.3em;
    padding: 1em;
    font-size: 1.1rem;
    color: var(--color-primary-hover);
    font-family: var(--font-medium);
    margin-top: 1em;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#other-costs-container[b-r5pt29s28i] {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    margin-top: 1em;
    position: relative;
}

.other-costs-row[b-r5pt29s28i] {
    width: 100%;
    margin-bottom: 1em;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#ensats[b-r5pt29s28i],
#surface-treatment[b-r5pt29s28i] {
    width: 30%;
}

.other-costs-calculated-price[b-r5pt29s28i] {
    background: #e8e8e8;
    border-radius: 0.3em;
    padding: 1em;
    font-size: 1.1rem;
    color: var(--color-primary-hover);
    font-family: var(--font-medium);
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 40%;
}

#calculator h3[b-r5pt29s28i] {
    border: none;
    text-align: center;
}

#calculator[b-r5pt29s28i] {
    height: 50em;
}

/* Visina se uzima iz preostalog prostora, ne kao postotak kartice: naslov i dugmad su
   braca u istoj flex koloni, pa je fiksnih 80% prelijevalo listu preko njih cim bi
   referent dodao vise kolicina. min-height: 0 je uslov da skrol uopste proradi. */
#calculator-container[b-r5pt29s28i] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

    #calculator-container .list-wrapper[b-r5pt29s28i] {
        flex: 1;
        min-height: 0;
        height: auto;
        display: flex;
        flex-direction: column;
        box-sizing: border-box;
    }

    #calculator-container .list-wrapper ul[b-r5pt29s28i] {
        flex: 1;
        min-height: 0;
        height: auto;
    }

    #calculator-container .list-item .costs[b-r5pt29s28i] {
        display: flex;
        align-items: start;
        flex-direction: column;
        font-size: 0.8em;
        color: gray;
    }

    #calculator-container .list-item .show-in-offer[b-r5pt29s28i] {
        display: flex;
        justify-content: center;
    }

    #calculator-container .list-item .costs label[b-r5pt29s28i] {
        width: 100%;
    }

    #calculator-container .calculator-warning[b-r5pt29s28i] {
        color: #f0ad4e;
        margin-left: 0.4em;
        cursor: help;
    }

    #calculator-container .quantity[b-r5pt29s28i] {
        width: 10%;
    }

    #calculator-container .costs[b-r5pt29s28i] {
        width: 40%;
    }

    #calculator-container .price-per-article[b-r5pt29s28i] {
        width: 20%;
    }

    #calculator-container .total-price[b-r5pt29s28i] {
        width: 20%;
    }

    #calculator-container .list-item .total-price[b-r5pt29s28i] {
        color: #5cb85c;
        font-family: var(--font-medium);
    }

    #calculator-container .show-in-offer[b-r5pt29s28i] {
        width: 10%;
    }

#create-article-btns[b-r5pt29s28i] {
    width: 100%;
    display: flex;
    gap: var(--ar-space-2);
    padding: var(--ar-space-6) 0;
}

#calculator-container .list-header .show-in-offer[b-r5pt29s28i] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.1em;
}

#calculator-container .select-all-btn[b-r5pt29s28i] {
    padding: 0;
    font-size: 0.75em;
    text-decoration: none;
}

#calculator-container .show-in-offer input[b-r5pt29s28i] {
    cursor: pointer;
}

#calculator-btns[b-r5pt29s28i] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: end;
    margin-bottom: 1em;
}

#add-quantity div[b-r5pt29s28i] {
    width: 15em;
    display: flex;
}

    #add-quantity div button[b-r5pt29s28i] {
        margin-left: 1em;
    }

#calculator-btns #refresh img[b-r5pt29s28i] {
    width: 1.5em;
    height: 1.5em;
}

#note[b-r5pt29s28i] {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin: 2em 0;
}

    #note textarea[b-r5pt29s28i] {
        resize: none;
        margin-top: 0.5em;
    }

/* Discount section styles */
#discount[b-r5pt29s28i] {
    width: 100%;
    margin-top: 2em;
    margin-bottom: 0;
    height: auto;
}

#discount label[b-r5pt29s28i] {
    font-family: 'Ubuntu-Light';
    margin-bottom: 0.3em;
}

#discount .discount-description[b-r5pt29s28i] {
    font-size: 0.85em;
    color: #6c757d;
    margin-bottom: 0.5em;
    font-style: italic;
}

#discount input[b-r5pt29s28i] {
    max-width: 150px;
}


.info-display[b-r5pt29s28i] {
    display: flex;
    flex-direction: column;
    gap: 0.3em;
}

    .info-display label[b-r5pt29s28i] {
        font-family: var(--font-light);
        font-size: 0.9em;
        color: var(--color-muted);
    }

    .info-display span[b-r5pt29s28i] {
        font-family: var(--font-medium);
        font-size: 1em;
        color: var(--color-text-dark);
    }

.section-description[b-r5pt29s28i] {
    font-size: 0.85em;
    color: #6c757d;
    margin: 0.3em 0;
    font-style: italic;
}

#drawing-section[b-r5pt29s28i] {
    display: flex;
    flex-direction: column;
}

#drawing-upload-section[b-r5pt29s28i] {
    margin-top: 0.5em;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.file-upload-label[b-r5pt29s28i] {
    cursor: pointer;
    margin-bottom: 0.5em;
    display: inline-block;
    width: 100%;
}

[b-r5pt29s28i] .file-input,
.file-input[b-r5pt29s28i],
[b-r5pt29s28i] input[type="file"] {
    display: none !important;
    visibility: hidden !important;
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Hide Blazor InputFile component */
[b-r5pt29s28i] .blazor-file-input {
    display: none !important;
}

.file-upload-button[b-r5pt29s28i] {
    display: block;
    padding: 0.5em 1em;
    background: var(--color-primary);
    color: white;
    border-radius: 0.5em;
    cursor: pointer;
    transition: background 0.2s;
    font-size: 0.9em;
    text-align: center;
    width: 100%;
}

.file-upload-button:hover[b-r5pt29s28i] {
    background: var(--color-primary-hover);
}

.file-upload-button i[b-r5pt29s28i] {
    margin-right: 0.5em;
}

#drawing-preview[b-r5pt29s28i] {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 1em;
    width: 100%;
}

.drawing-image[b-r5pt29s28i] {
    max-width: 100%;
    max-height: 180px;
    width: auto;
    height: auto;
    object-fit: contain;
    border: 1px solid #e0e0e0;
    border-radius: 0.5em;
    padding: 0.5em;
    background: #f9f9f9;
}

.pdf-preview[b-r5pt29s28i] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1.5em;
    border: 2px dashed #d9534f;
    border-radius: 0.5em;
    background: #fff5f5;
    min-height: 120px;
}

.pdf-preview i[b-r5pt29s28i] {
    font-size: 2.5em !important;
}

.pdf-preview p[b-r5pt29s28i] {
    font-size: 0.85em;
    margin: 0.5em 0 0.3em 0;
    font-weight: 600;
}

.pdf-preview small[b-r5pt29s28i] {
    font-size: 0.7em;
    color: #999;
}

.image-preview-wrapper[b-r5pt29s28i] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}
/* _content/ArasWeb/Shared/Components/AutocompleteTextInput.razor.rz.scp.css */
.autocomplete-container[b-zbm5l3to1w] {
    width: 100%;
}

/* Tied to the ShowSuggestions Blazor state (suggestions-open class) rather than :focus-within.
   Suggestion items use @onmousedown:preventDefault so picking one doesn't blur the input, which
   means :focus-within stayed true after a selection - so the reserved space only collapsed
   later, on the native (synchronous, pre-render) blur caused by clicking e.g. the Spremi button.
   That collapse shifted the button out from under the cursor mid-click, swallowing the first
   click. Driving this off Blazor state instead collapses the space as soon as the dropdown
   actually closes (on selection/blur), well before any later click. */
.autocomplete-container.reserve-space.suggestions-open[b-zbm5l3to1w] {
    padding-bottom: 12.5em;
}

.autocomplete-wrapper[b-zbm5l3to1w] {
    position: relative;
    width: 100%;
}

.autocomplete-suggestions[b-zbm5l3to1w] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    max-height: 12em;
    overflow-y: auto;
    background: white;
    border: 0.06em solid #ced4da;
    border-radius: 0.5em;
    z-index: 1000;
    margin-top: 0.2em;
}

.autocomplete-suggestion-item[b-zbm5l3to1w] {
    padding: 0.5em 0.75em;
    cursor: pointer;
    font-family: 'Ubuntu-Light';
}

    .autocomplete-suggestion-item:hover[b-zbm5l3to1w] {
        background: #e4eef2;
    }
/* _content/ArasWeb/Shared/Components/CalibrationDocumentField.razor.rz.scp.css */
.document-field[b-wsbj5kwfnf] {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: .5em;
}

    .document-field > label:first-child[b-wsbj5kwfnf] {
        font-family: 'Ubuntu-Light';
        margin-bottom: 0.3em;
    }

.upload-label[b-wsbj5kwfnf] {
    cursor: pointer;
    display: inline-block;
    width: 100%;
}

    .upload-label.loading[b-wsbj5kwfnf] {
        cursor: progress;
    }

[b-wsbj5kwfnf] .file-input {
    display: none;
}

.upload-button[b-wsbj5kwfnf] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4em;
    padding: 0.4em 0.6em;
    border: 1px dashed #14425a;
    border-radius: 0.4em;
    font-size: 0.8em;
    color: #14425a;
    background: #e4eef2;
}

    .upload-button:hover[b-wsbj5kwfnf] {
        background: #cddde5;
    }

.preview[b-wsbj5kwfnf] {
    display: flex;
    align-items: center;
    gap: 0.4em;
    margin-top: 0.5em;
    padding: 0.4em 0.5em;
    background: #f8f9fa;
    border-radius: 0.4em;
    border: 1px solid #dee2e6;
}

.file-icon[b-wsbj5kwfnf] {
    font-size: 1.3em;
    flex-shrink: 0;
}

.pdf-icon[b-wsbj5kwfnf] {
    color: #d9534f;
}

.img-icon[b-wsbj5kwfnf] {
    color: var(--ar-primary);
}

.filename[b-wsbj5kwfnf] {
    flex: 1;
    min-width: 0;
    font-size: 0.78em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #6c757d;
}

.small-btn[b-wsbj5kwfnf] {
    flex-shrink: 0;
    font-size: 0.75em;
    padding: 0.2em 0.5em;
}

.removed-hint[b-wsbj5kwfnf] {
    margin: 0.4em 0 0;
    font-size: 0.78em;
    color: #6c757d;
}
/* _content/ArasWeb/Shared/Components/CalibrationDueLegend.razor.rz.scp.css */
.calibration-legend[b-vwosjqrc50] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5em;
    margin-bottom: 0.75em;
    font-family: var(--font-light);
    color: var(--color-text-muted);
    font-size: 0.9em;
}

.legend-box[b-vwosjqrc50] {
    display: inline-block;
    width: 1em;
    height: 1em;
    border-radius: 0.2em;
    vertical-align: -0.15em;
}

.legend-warning[b-vwosjqrc50] {
    background: var(--calibration-warning-bg);
    border: 1px solid #e0b800;
}

.legend-expired[b-vwosjqrc50] {
    background: var(--calibration-expired-bg);
    border: 1px solid #d9534f;
}
/* _content/ArasWeb/Shared/Components/DecimalInput.razor.rz.scp.css */
.decimal-input-wrapper[b-nukitid9w5] {
    width: 100%;
}

.decimal-input-error[b-nukitid9w5] {
    color: #dc3545;
    font-size: 0.78em;
    margin-top: 0.2em;
    font-family: 'Ubuntu-Light';
}
/* _content/ArasWeb/Shared/Components/DurationInput.razor.rz.scp.css */
.duration-input[b-klzzjz1y06] {
    display: flex;
    gap: 0.5em;
    width: 100%;
}

.duration-part[b-klzzjz1y06] {
    display: flex;
    align-items: center;
    gap: 0.3em;
    flex: 1;
    min-width: 0;
}

.duration-part input[b-klzzjz1y06] {
    min-width: 0;
    text-align: right;
}

.duration-unit[b-klzzjz1y06] {
    color: #6c757d;
    font-size: 0.9em;
}
/* _content/ArasWeb/Shared/Components/EmptyLIst.razor.rz.scp.css */
#empty-list[b-5czf074pgy] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: var(--ar-space-2);
    padding: var(--ar-space-12) var(--ar-space-4);
    color: var(--ar-text-muted);
    font-size: var(--ar-fs-md);
}

.empty-icon[b-5czf074pgy] {
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--ar-navy-100);
    color: var(--ar-navy-500);
    font-size: 1.4rem;
    line-height: 3.5rem;
    text-align: center;
    margin-bottom: var(--ar-space-2);
}

#empty-list p[b-5czf074pgy] {
    font-size: var(--ar-fs-md);
    color: var(--ar-text-muted);
    margin: 0;
}
/* _content/ArasWeb/Shared/Components/InfoTooltip.razor.rz.scp.css */
.row-number-info[b-x2jp0ty7gr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.05em;
    height: 1.05em;
    margin-left: 0.15em;
    font-size: 0.7rem;
    font-weight: 700;
    font-family: Arial, sans-serif;
    border-radius: 50%;
    background: var(--ar-primary);
    color: #fff;
    cursor: pointer;
    position: relative;
    vertical-align: middle;
}

.row-number-info:focus-visible[b-x2jp0ty7gr] {
    outline: 2px solid var(--ar-primary);
    outline-offset: 2px;
}

.row-number-tooltip[b-x2jp0ty7gr] {
    position: absolute;
    left: 0;
    bottom: 145%;
    transform: translateY(4px);
    width: 14rem;
    max-width: 90vw;
    padding: 0.6em 0.8em;
    background: #14425a;
    color: #fff;
    font-family: 'Ubuntu-Light';
    font-size: 0.8rem;
    font-weight: 400;
    line-height: 1.4;
    text-align: left;
    white-space: normal;
    border-radius: 0.4em;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.15s ease, transform 0.15s ease;
    z-index: 20;
    pointer-events: none;
}

.row-number-tooltip[b-x2jp0ty7gr]::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 0.4em;
    transform: none;
    border: 6px solid transparent;
    border-top-color: #14425a;
}

.row-number-info:hover .row-number-tooltip[b-x2jp0ty7gr],
.row-number-info:focus-visible .row-number-tooltip[b-x2jp0ty7gr] {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
/* _content/ArasWeb/Shared/Components/ListLoader.razor.rz.scp.css */
.skeleton-row[b-987s5nv96a] {
    display: flex;
    align-items: center;
    gap: var(--ar-space-6);
    padding: var(--ar-space-4) var(--ar-space-6);
    width: 100%;
    list-style: none;
}

.skeleton-block[b-987s5nv96a] {
    height: 1em;
    border-radius: 0.3em;
    background: linear-gradient(90deg, var(--ar-gray-200) 25%, var(--ar-gray-100) 50%, var(--ar-gray-200) 75%);
    background-size: 200% 100%;
    animation: shimmer-b-987s5nv96a 1.5s infinite;
}

.skeleton-short[b-987s5nv96a] {
    width: 15%;
}

.skeleton-medium[b-987s5nv96a] {
    width: 25%;
}

.skeleton-long[b-987s5nv96a] {
    width: 35%;
}

@keyframes shimmer-b-987s5nv96a {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}
/* _content/ArasWeb/Shared/Components/Loader.razor.rz.scp.css */
#loader[b-fybydipp3p] {
    position: fixed;
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(2px);
    display: flex;
    justify-content: center;
    align-items: center;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: var(--ar-z-loader);
}

.loader-card[b-fybydipp3p] {
    background: var(--ar-bg-surface);
    border-radius: var(--ar-radius-lg);
    padding: var(--ar-space-8);
    box-shadow: var(--ar-shadow-md);
}
/* _content/ArasWeb/Shared/Components/MachineMaintenanceFields.razor.rz.scp.css */
.machine-maintenance-section[b-zvbc4jtmzk] {
    grid-column: 1 / -1;
    border-top: 1px solid #e4eef2;
    padding-top: 1em;
    margin-top: 0.5em;
}

.machine-maintenance-title[b-zvbc4jtmzk] {
    font-family: 'Ubuntu-Medium';
    color: #14425a;
    font-size: 0.95em;
    margin-bottom: 0.8em;
}

.machine-maintenance-title i[b-zvbc4jtmzk] {
    margin-right: 0.4em;
    color: var(--ar-primary);
}

.machine-maintenance-grid[b-zvbc4jtmzk] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1em;
    margin-bottom: 1em;
}

.machine-maintenance-grid .modal-input-box[b-zvbc4jtmzk] {
    display: flex;
    flex-direction: column;
}

.machine-maintenance-grid .modal-input-box label[b-zvbc4jtmzk] {
    font-size: 0.85em;
    margin-bottom: 0.4em;
    font-family: 'Ubuntu-Light';
}

.machine-maintenance-grid .modal-input-box input[b-zvbc4jtmzk],
.machine-maintenance-grid .modal-input-box select[b-zvbc4jtmzk] {
    font-size: 0.9em;
}

.hint[b-zvbc4jtmzk] {
    font-size: 0.75em;
    color: #6c757d;
    margin-top: 0.3em;
}

/* Prekidač nema svoju labelu iznad polja, pa se poravnava s donjom ivicom inputa u redu. */
.machine-maintenance-switch[b-zvbc4jtmzk] {
    justify-content: flex-end;
}

.switch-label[b-zvbc4jtmzk] {
    display: flex;
    align-items: center;
    gap: 0.5em;
    font-size: 0.9em !important;
    margin-bottom: 0 !important;
    padding: 0.35em 0;
    cursor: pointer;
}

.switch-label input[b-zvbc4jtmzk] {
    width: 1.1em;
    height: 1.1em;
    cursor: pointer;
}

.oils[b-zvbc4jtmzk] {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    gap: 0.5em;
}

.oils > label[b-zvbc4jtmzk] {
    font-size: 0.85em;
    font-family: 'Ubuntu-Light';
    margin-bottom: 0;
}

.oil-row[b-zvbc4jtmzk] {
    display: grid;
    grid-template-columns: 1fr 1.4fr auto;
    gap: 0.6em;
    align-items: center;
}

.oil-row input[b-zvbc4jtmzk] {
    font-size: 0.9em;
}

.oil-remove[b-zvbc4jtmzk] {
    border: none;
    background: none;
    color: #6c757d;
    padding: 0.3em 0.5em;
    cursor: pointer;
}

.oil-remove:hover[b-zvbc4jtmzk] {
    color: #d9534f;
}

.add-oil[b-zvbc4jtmzk] {
    align-self: flex-start;
    border: none;
    background: none;
    color: var(--ar-primary);
    font-size: 0.85em;
    padding: 0.2em 0;
    cursor: pointer;
}

.add-oil i[b-zvbc4jtmzk] {
    margin-right: 0.3em;
}
/* _content/ArasWeb/Shared/Components/MeasurementName.razor.rz.scp.css */
/* Okvir tolerancije kao na crtežu: ćelije simbol | vrijednost | referenca. */
.gdt-frame[b-fwyeowkhfc] {
    display: inline-flex;
    align-items: stretch;
    border: 1px solid currentColor;
    border-radius: 2px;
    vertical-align: middle;
    line-height: 1.3;
    white-space: nowrap;
}

.gdt-cell[b-fwyeowkhfc] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.6em;
    padding: 0.05em 0.4em;
}

    .gdt-cell + .gdt-cell[b-fwyeowkhfc] {
        border-left: 1px solid currentColor;
    }
/* _content/ArasWeb/Shared/Components/MfaCodeInput.razor.rz.scp.css */
.mfa-code-input[b-vd5lxuk26c] {
    font-family: var(--font-medium);
    font-size: 1.6em;
    letter-spacing: 0.4em;
    text-align: center;
    padding: 0.4em 0.2em 0.4em 0.6em;
}

    .mfa-code-input[b-vd5lxuk26c]::placeholder {
        color: #c5d3da;
    }
/* _content/ArasWeb/Shared/Components/MfaRecoveryCodes.razor.rz.scp.css */
.mfa-recovery[b-n589dw0rt1] {
    width: 100%;
    text-align: left;
}

.mfa-recovery-text[b-n589dw0rt1] {
    font-size: 0.9em;
    color: #14425a;
}

.mfa-recovery-codes[b-n589dw0rt1] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.4em;
    margin: 0.8em 0;
}

    .mfa-recovery-codes code[b-n589dw0rt1] {
        padding: 0.4em;
        border-radius: 0.4em;
        background: #e4eef2;
        color: #14425a;
        font-size: 1em;
        text-align: center;
        user-select: all;
    }

.mfa-recovery-actions[b-n589dw0rt1] {
    display: flex;
    gap: 0.5em;
}

.mfa-secondary-button[b-n589dw0rt1] {
    flex: 1;
    padding: 0.5em;
    border: 1px solid #14425a;
    border-radius: 0.5em;
    background: white;
    color: #14425a;
    font-family: var(--font-medium);
    font-size: 0.85em;
}

    .mfa-secondary-button i[b-n589dw0rt1] {
        margin-right: 0.4em;
    }
/* _content/ArasWeb/Shared/Components/MfaSetupPanel.razor.rz.scp.css */
.mfa-setup[b-enyvkumufs] {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: left;
}

.mfa-steps[b-enyvkumufs] {
    width: 100%;
    padding-left: 1.2em;
    margin-bottom: 1em;
    font-size: 0.9em;
    color: #14425a;
}

    .mfa-steps li[b-enyvkumufs] {
        margin-bottom: 0.3em;
    }

.mfa-qr[b-enyvkumufs] {
    width: 12em;
    height: 12em;
    image-rendering: pixelated;
    border: 1px solid #e4eef2;
    border-radius: 0.5em;
    padding: 0.4em;
    background: white;
}

.mfa-manual[b-enyvkumufs] {
    width: 100%;
    margin-top: 0.8em;
    font-size: 0.85em;
    color: #6c757d;
}

    .mfa-manual summary[b-enyvkumufs] {
        cursor: pointer;
        color: var(--ar-primary);
    }

    .mfa-manual p[b-enyvkumufs] {
        margin: 0.4em 0;
    }

    .mfa-manual code[b-enyvkumufs] {
        display: block;
        padding: 0.5em;
        border-radius: 0.4em;
        background: #e4eef2;
        color: #14425a;
        font-size: 1.05em;
        word-break: break-word;
        user-select: all;
    }

.mfa-hint[b-enyvkumufs] {
    font-size: 0.9em;
}
/* _content/ArasWeb/Shared/Components/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-0rldim3s5r] {
    background-color: rgba(255, 255, 255, 0.1);
}

.navbar[b-0rldim3s5r] {
    padding: 0;
}

.top-row[b-0rldim3s5r] {
    /* One pixel short of the header's 4rem, with no line of its own: the navy starts on the row of
       the header's grey line, so both whites end on the same pixel. A grey line on the navy read as
       part of the white, so the white looked taller than the header's. */
    height: calc(4rem - 1px);
    background-color: white;
    overflow: hidden;
}

.navbar-brand[b-0rldim3s5r] {
    font-size: 1.1rem;
}

#logo[b-0rldim3s5r] {
    width: auto;
    max-width: 11rem;
    max-height: 2.75rem;
    height: auto;
    object-fit: contain;
}

.header-logo[b-0rldim3s5r] {
    display: block;
    width: auto;
    max-width: 11rem;
    height: 2.75rem !important;
    max-height: 2.75rem !important;
    object-fit: contain;
}

/* = ar-nav-item: stavka i podstavka imaju isti oblik, podstavka je samo uvučena. */
.oi[b-0rldim3s5r], i[b-0rldim3s5r] {
    width: 1.75rem;
    font-size: 1rem;
    text-align: center;
    opacity: 0.85;
}

.nav-item[b-0rldim3s5r] {
    font-size: var(--ar-fs-md);
    padding-bottom: 2px;
    font-family: var(--ar-font);
}

    .nav-item:first-of-type[b-0rldim3s5r] {
        padding-top: var(--ar-space-3);
    }

    .nav-item:last-of-type[b-0rldim3s5r] {
        padding-bottom: var(--ar-space-3);
    }

    .nav-item[b-0rldim3s5r]  a {
        color: var(--ar-nav-text);
        border-radius: var(--ar-radius-sm);
        min-height: 2.75rem;
        display: flex;
        align-items: center;
        gap: var(--ar-space-2);
        line-height: 1.3;
        padding: var(--ar-space-1) var(--ar-space-2);
        transition: background-color var(--ar-dur-fast) var(--ar-ease), color var(--ar-dur-fast) var(--ar-ease);
        /* Dug naziv („Inspekcija prvog komada") se prelama u drugi red uz tekst, ne siječe se s „…". */
        white-space: normal;
        overflow-wrap: anywhere;
    }

        .nav-item[b-0rldim3s5r]  a > span:first-child {
            flex-shrink: 0;
        }

        .nav-item[b-0rldim3s5r]  a.active {
            background-color: var(--ar-nav-active);
            color: white;
            font-weight: var(--ar-fw-medium);
            box-shadow: inset 3px 0 0 white;
        }

.nav-item[b-0rldim3s5r]  a:hover {
    background-color: rgba(255,255,255,0.08);
    color: white;
}

.sub-item[b-0rldim3s5r] {
    padding: 0 var(--ar-space-2) 2px var(--ar-space-4);
    animation: slideDown-b-0rldim3s5r 0.2s ease-out;
}

.sub-item[b-0rldim3s5r]  a {
    min-height: 2.375rem;
    padding-left: 2.25rem;
}

@keyframes slideDown-b-0rldim3s5r {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.nav-chevron[b-0rldim3s5r] {
    margin-left: auto;
}

.sidebar-toggle[b-0rldim3s5r] {
    display: none;
}

@media (min-width: 641px) {
    .navbar-toggler[b-0rldim3s5r] {
        display: none;
    }

    .top-row[b-0rldim3s5r] {
        flex-shrink: 0;
    }

    .collapse[b-0rldim3s5r] {
        /* Never collapse the sidebar for wide screens */
        display: block;
        overflow-y: auto;
        flex: 1;
        min-height: 0;
    }
}

/* Sklapanje menija na ikone (MAS-38) samo na tabletu: na većem ekranu meni je uvijek otvoren. */
@media (min-width: 641px) and (max-width: 1279.98px) {
    .sidebar-toggle[b-0rldim3s5r] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        width: 2.5rem;
        min-height: 2.5rem;
        padding: 0;
        margin-left: auto;
        border-radius: var(--ar-radius-sm);
        background: transparent;
        color: var(--ar-text);
    }

        .sidebar-toggle:hover[b-0rldim3s5r] {
            background: var(--ar-bg-hover);
        }

        .sidebar-toggle i[b-0rldim3s5r] {
            opacity: 1;
        }

    .top-row.is-collapsed #logo[b-0rldim3s5r],
    .top-row.is-collapsed .header-logo[b-0rldim3s5r] {
        display: none;
    }

    .top-row.is-collapsed .container-fluid[b-0rldim3s5r] {
        justify-content: center;
        padding: 0;
    }

        .top-row.is-collapsed .sidebar-toggle[b-0rldim3s5r] {
            margin-left: 0;
        }

    .is-collapsed .nav-label[b-0rldim3s5r],
    .is-collapsed .nav-chevron[b-0rldim3s5r],
    .is-collapsed .sub-item[b-0rldim3s5r] {
        display: none;
    }

    .is-collapsed .nav-item.px-3[b-0rldim3s5r] {
        padding-inline: var(--ar-space-2) !important;
    }

    .is-collapsed .nav-item[b-0rldim3s5r]  a {
        justify-content: center;
        padding: 0;
    }
}


@media (max-width: 640.98px) {

    #logo[b-0rldim3s5r] {
        display: none;
    }

    .top-row[b-0rldim3s5r] {
        background-color: var(--ar-navy-700);
    }
}


[b-0rldim3s5r]::-webkit-scrollbar {
    width: 0.3em;
}

[b-0rldim3s5r]::-webkit-scrollbar-track {
    background: transparent;
}

[b-0rldim3s5r]::-webkit-scrollbar-thumb {
    background: var(--ar-navy-600);
    border-radius: 5em;
}

    [b-0rldim3s5r]::-webkit-scrollbar-thumb:hover {
        background: var(--ar-navy-500);
        cursor: pointer;
    }
/* _content/ArasWeb/Shared/Components/OrderArticleInput.razor.rz.scp.css */
#create-article-container[b-g8s3wp43hz] {
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    display: flex;
    flex-direction: column;
}

#article-and-material-info[b-g8s3wp43hz],
#time-costs[b-g8s3wp43hz] {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

#article-info[b-g8s3wp43hz],
#material-info[b-g8s3wp43hz],
#order-data-and-drawing[b-g8s3wp43hz],
#time-costs[b-g8s3wp43hz],
#quantity[b-g8s3wp43hz] {
    height: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    background: white;
    padding: 1em;
    border-radius: 1em;
}

#article-info[b-g8s3wp43hz],
#material-info[b-g8s3wp43hz],
#order-data-and-drawing[b-g8s3wp43hz] {
    width: 32%;
}

#order-data-and-drawing[b-g8s3wp43hz] {
    gap: 1em;
}

#order-data-section[b-g8s3wp43hz],
#drawing-section[b-g8s3wp43hz] {
    display: flex;
    flex-direction: column;
}

#order-data-section h5[b-g8s3wp43hz],
#drawing-section h5[b-g8s3wp43hz] {
    margin-bottom: 0.5em;
}

#order-data-container[b-g8s3wp43hz] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.5em;
    margin-top: 1em;
}

#drawing-upload-section[b-g8s3wp43hz] {
    margin-top: 0.5em;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.file-upload-label[b-g8s3wp43hz] {
    cursor: pointer;
    margin-bottom: 0.5em;
    display: inline-block;
    width: 100%;
}

[b-g8s3wp43hz] .file-input,
.file-input[b-g8s3wp43hz],
[b-g8s3wp43hz] input[type="file"] {
    display: none !important;
    visibility: hidden !important;
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

[b-g8s3wp43hz] .blazor-file-input {
    display: none !important;
}

.file-upload-button[b-g8s3wp43hz] {
    display: block;
    padding: 0.5em 1em;
    background: var(--color-primary);
    color: white;
    border-radius: 0.5em;
    cursor: pointer;
    transition: background 0.2s;
    font-size: 0.9em;
    text-align: center;
    width: 100%;
}

.file-upload-button:hover[b-g8s3wp43hz] {
    background: var(--color-primary-hover);
}

.file-upload-button i[b-g8s3wp43hz] {
    margin-right: 0.5em;
}

#drawing-preview[b-g8s3wp43hz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 1em;
    width: 100%;
}

.drawing-image[b-g8s3wp43hz] {
    max-width: 100%;
    max-height: 180px;
    width: auto;
    height: auto;
    object-fit: contain;
    border: 1px solid #e0e0e0;
    border-radius: 0.5em;
    padding: 0.5em;
    background: #f9f9f9;
}

.pdf-preview[b-g8s3wp43hz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1.5em;
    border: 2px dashed #d9534f;
    border-radius: 0.5em;
    background: #fff5f5;
    min-height: 120px;
}

.pdf-preview i[b-g8s3wp43hz] {
    font-size: 2.5em !important;
}

.pdf-preview p[b-g8s3wp43hz] {
    font-size: 0.85em;
    margin: 0.5em 0 0.3em 0;
    font-weight: 600;
}

.pdf-preview small[b-g8s3wp43hz] {
    font-size: 0.7em;
    color: #999;
}

.image-preview-wrapper[b-g8s3wp43hz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

#time-costs[b-g8s3wp43hz],
#quantity[b-g8s3wp43hz] {
    width: 100%;
    margin-top: 2em;
}

#article-info-container[b-g8s3wp43hz],
#material-info-container[b-g8s3wp43hz] {
    width: 100%;
    height: 95%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-top: 1em;
}

.input-box[b-g8s3wp43hz],
#machine-time[b-g8s3wp43hz] {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: flex-start;
    width: 100%;
    margin-bottom: 1em;
    position: relative;
}

    .input-box label[b-g8s3wp43hz],
    .time-cost label[b-g8s3wp43hz],
    .quantity-input label[b-g8s3wp43hz],
    .deadline-and-supplier-col label[b-g8s3wp43hz],
    #technology-work-order-btns label[b-g8s3wp43hz]{
        width: 100%;
        margin-bottom: 0.3em;
        font-family: 'Ubuntu-Light';
    }

.input-wrapper[b-g8s3wp43hz] {
    width: 100%;
    position: relative;
    display: block;
}

.unit[b-g8s3wp43hz] {
    position: absolute;
    /* Lijevo od strelica broja, koje Chrome crta uz desnu ivicu polja. */
    right: 2.25rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--ar-text-muted);
    z-index: 2;
    font-size: var(--ar-fs-sm);
    pointer-events: none;
}

.input-wrapper[b-g8s3wp43hz]  input {
    padding-right: 4.5rem;
}

#article-shape[b-g8s3wp43hz] {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 0.5em;
}

    #article-shape div[b-g8s3wp43hz] {
        display: flex;
        justify-content: center;
        align-items: center;
        flex: 1;
        cursor: pointer;
        padding: 0.5em;
        border-radius: 0.5em;
    }

.selected-shape[b-g8s3wp43hz] {
    border: 0.1em solid #5cb85c;
    background: #e4eef2;
}

.unselected-shape[b-g8s3wp43hz] {
    border: 0.1em solid lightgray;
    background: white;
}

.circle[b-g8s3wp43hz],
.square[b-g8s3wp43hz] {
    height: 2em;
    width: 2em;
    background-color: #14425a;
    display: inline-flex;
}

.circle[b-g8s3wp43hz] {
    border-radius: 50%;
}

.l-profile[b-g8s3wp43hz] {
    height: 2em;
    width: 2em;
    display: inline-block;
    background: #14425a;
    clip-path: polygon(0% 0%, 30% 0%, 30% 70%, 100% 70%, 100% 100%, 0% 100%);
}

.square-tube[b-g8s3wp43hz] {
    height: 2em;
    width: 2em;
    display: inline-block;
    border: 0.45em solid #14425a;
    background: transparent;
    box-sizing: border-box;
}

.round-tube[b-g8s3wp43hz] {
    height: 2em;
    width: 2em;
    display: inline-block;
    border: 0.45em solid #14425a;
    border-radius: 50%;
    background: transparent;
    box-sizing: border-box;
}

.validation-warning[b-g8s3wp43hz] {
    color: #d9534f;
    font-size: 0.85em;
    margin: 0.3em 0 0 0;
}

#machine-time[b-g8s3wp43hz],
.time-cost[b-g8s3wp43hz],
.time-price[b-g8s3wp43hz] {
    width: 30%;
    position: relative;
}

    #machine-time img[b-g8s3wp43hz] {
        width: 1.5em;
        margin: 1em 0.5em;
    }

#other-time-costs[b-g8s3wp43hz],
#quantity-container[b-g8s3wp43hz],
#deadline-and-supplier[b-g8s3wp43hz],
#technology-work-order-btns[b-g8s3wp43hz] {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    position: relative;
    flex-wrap: wrap
}

#deadline-and-supplier[b-g8s3wp43hz], #quantity-container[b-g8s3wp43hz] {
    margin-bottom: 1em;
}

.deadline-and-supplier-col[b-g8s3wp43hz], #technology-work-order-btns div[b-g8s3wp43hz] {
    width: 30%;
}

.quantity-input[b-g8s3wp43hz] {
    width: 30%;
}

#quantity-container[b-g8s3wp43hz] {
    justify-content: flex-start;
    gap: 5%;
}

.note-input[b-g8s3wp43hz] {
    width: 63%;
}

.article-note-display[b-g8s3wp43hz] {
    width: 100%;
}

.article-note-text[b-g8s3wp43hz] {
    margin: 0;
    white-space: pre-wrap;
    height: auto;
    min-height: 2.4em;
    background: #f0f6fb;
    color: #14425a;
}

    .quantity-input span[b-g8s3wp43hz] {
        font-family: 'Ubuntu-Bold';
        background: #e8e8e8;
        color: var(--ar-primary);
        width: 100%;
        padding: 0.3em;
        border: 0.1em solid lightgray;
        display: inline-flex;
        border-radius: 0.4em;
    }

    .quantity-input input[b-g8s3wp43hz],
    #deadline-date input[b-g8s3wp43hz]
    {
        font-family: 'Ubuntu-Bold';
        color: var(--ar-primary);
    }

#create-article-btns[b-g8s3wp43hz] {
    width: 100%;
    display: flex;
    gap: var(--ar-space-2);
    padding: var(--ar-space-6) 0;
}


#completed[b-g8s3wp43hz] {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border-radius: 0.5em;
    padding: 1em;
    background: rgba(92, 184, 92, 0.3);
    margin-top: 1em;
}

#completed p[b-g8s3wp43hz] {
    margin: 0;
    font-family: 'Ubuntu-Light';
}

#completed img[b-g8s3wp43hz] {
    width: 1.2em;
    margin-right: .3em;
}

.manually-completed[b-g8s3wp43hz] {
    font-size: 0.9em;
    font-family: 'Ubuntu-Medium' !important;
    margin-top: 1em;
}

#upper-bar[b-g8s3wp43hz] {
    width: 100%;
    padding: 1em;
    display: flex;
    justify-content: center;
    background: rgba(13, 110, 253, 0.3);
    margin-bottom: 1em;
}

#send-articles-to-control[b-g8s3wp43hz]{
    text-align: center;
    font-family: 'Ubuntu-Medium';
    display: flex;
    justify-content: center;
}

#send-articles-to-control p[b-g8s3wp43hz] {
    width: 100%;
    text-align: center;
    font-size: 1.2em;
}

#create-article-btns button i[b-g8s3wp43hz] {
    margin-right: 0.3em;
}

#technology-work-order-btns[b-g8s3wp43hz] {
    margin-top: 1em;
}

.modify-supplier-btn[b-g8s3wp43hz] {
    cursor: pointer;
    color: #1861ac;
    display: inline-block;
    margin-left: 1em;
}

.placeholder[b-g8s3wp43hz] {
    background: transparent;
}

#modify-supplier-box[b-g8s3wp43hz] {
    width: 100%;
    padding: 0 8em;
}

#modify-supplier-box label[b-g8s3wp43hz] {
    text-align: left;
    width: 100%;
}

/* Oznaka za sastavnice: kooperant radi s našim materijalom. */
.our-material[b-g8s3wp43hz] {
    display: flex;
    align-items: center;
    gap: 0.4em;
    margin-top: 0.4em;
    font-family: var(--font-light);
    font-size: 0.9em;
    color: var(--color-text-dark);
    cursor: pointer;
}
/* _content/ArasWeb/Shared/Components/OrdersTemplate.razor.rz.scp.css */
#orders[b-chvo1cuqkc] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#orders-container[b-chvo1cuqkc] {
    display: flex;
    flex-direction: column;
    width: 100%;
    flex: 1;
    min-height: 0;
    border-radius: 0.5em;
    background: white;
    padding: 0.5em 0;
}

#order-filters[b-chvo1cuqkc] {
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
    width: 100%;
    padding: 0.3em 1em;
    font-family: var(--font-light);
    font-size: 0.9em;
    flex-shrink: 0;
    gap: 0.5em;
}

#search-and-report[b-chvo1cuqkc] {
    display: flex;
    align-items: center;
    font-family: var(--font-light);
    font-size: 0.9em;
    gap: 0.8em;
}

#generate-pdf[b-chvo1cuqkc] {
    font-family: var(--font-medium);
    border: 0.01em solid gray;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
    background: white;
    color: black;
    height: 2.8em;
}

    #generate-pdf img[b-chvo1cuqkc] {
        width: 1.5em;
        height: 1.5em;
        margin-right: 0.5em;
    }

.filter-box[b-chvo1cuqkc] {
    margin-right: 1em;
    display: flex;
    flex-direction: column;
}

    .filter-box label[b-chvo1cuqkc] {
        margin-bottom: 0.5em;
    }

    .filter-box select[b-chvo1cuqkc] {
        width: 15em;
        padding: 0.5em 0.2em;
    }

    .filter-box img[b-chvo1cuqkc] {
        width: 1em;
        height: 1em;
        margin: 0 0.5em;
    }

#orders-list[b-chvo1cuqkc] {
    width: 100%;
}


.order-status span[b-chvo1cuqkc] {
    font-family: var(--font-medium);
}

#create-btn[b-chvo1cuqkc] {
    flex-shrink: 0;
}

.due-date-today[b-chvo1cuqkc],
.due-date-late[b-chvo1cuqkc],
.order-status span[b-chvo1cuqkc] {
    font-family: var(--font-medium);
    font-size: 0.8em;
}

    .due-date-today span[b-chvo1cuqkc],
    .due-date-late span[b-chvo1cuqkc],
    .order-status span[b-chvo1cuqkc] {
        border-radius: 2em;
        text-align: center;
        width: auto;
        display: inline-flex;
        padding: 0.3em 1.5em;
        word-break: break-all;
    }

    .due-date-today span[b-chvo1cuqkc] {
        background: var(--color-warning);
    }

    .due-date-late span[b-chvo1cuqkc] {
        background: var(--color-danger);
        color: white;
    }

    .order-status span img[b-chvo1cuqkc] {
        width: 1.2em;
        height: 1.2em;
        margin-right: 0.5em;
    }

.order-created span[b-chvo1cuqkc] {
    background: rgba(236, 236, 236, 0.8);
}

.order-in-progress span[b-chvo1cuqkc] {
    background: rgba(137, 196, 244, 0.8);
}

.order-finished span[b-chvo1cuqkc] {
    background: rgba(205, 254, 194, 0.8);
}

.order-no[b-chvo1cuqkc], .buyer[b-chvo1cuqkc], .offer-name[b-chvo1cuqkc] {
    width: 18%;
    word-break: break-all;
}

.articles-count[b-chvo1cuqkc] {
    width: 12%;
    text-align: center;
}

.order-status[b-chvo1cuqkc] {
    width: 20%;
}

.due-date-box[b-chvo1cuqkc] {
    width: 16%;
}

/*
    MODAL ZA KREIRANJE:
*/

#create-new-order[b-chvo1cuqkc] {
    width: 100%;
    padding: 5em 3em;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}

    #create-new-order #description[b-chvo1cuqkc] {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        flex-direction: column;
    }

        #create-new-order #description p[b-chvo1cuqkc] {
            width: 100%;
            text-align: center;
            font-size: 1.5em;
            margin: 0;
            font-family: var(--font-bold);
        }

        #create-new-order #description label[b-chvo1cuqkc] {
            font-size: 0.9em;
            font-family: var(--font-light);
            margin-top: 0.5em;
        }

    #create-new-order #selection[b-chvo1cuqkc] {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 1em;
        padding: 0 2em;
    }

        #create-new-order #selection button[b-chvo1cuqkc] {
            background: transparent;
            font-family: var(--font-bold);
            border: 0.2em solid gray;
            color: gray;
            width: 31%;
        }

        #create-new-order #selection #with-offer[b-chvo1cuqkc] {
            color: #70bc64;
            border: 0.2em solid #70bc64;
        }

            #create-new-order #selection #with-offer:hover[b-chvo1cuqkc] {
                background: #70bc64;
                color: white;
            }

        #create-new-order #selection #without-offer:hover[b-chvo1cuqkc] {
            background: gray;
            color: white;
        }

        #create-new-order #selection #from-csv[b-chvo1cuqkc] {
            color: var(--ar-primary);
            border: 0.2em solid var(--ar-primary);
        }

            #create-new-order #selection #from-csv:hover[b-chvo1cuqkc] {
                background: var(--ar-primary-hover);
                color: white;
            }


.no-offer span[b-chvo1cuqkc] {
    background: #f1f1f1;
    text-align: center;
    width: auto;
    display: inline-flex;
    padding: 0.3em 1.5em;
    word-break: break-all;
    font-family: var(--font-medium);
    font-size: 0.8em;
    border-radius: 1em;
}
/* _content/ArasWeb/Shared/Components/PageHeader.razor.rz.scp.css */
.page-info[b-zat6ggyqfl] {
    width: 100%;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding: var(--ar-space-1) 0 var(--ar-space-4);
    flex-shrink: 0;
    gap: var(--ar-space-3) var(--ar-space-4);
}

.page-info-left[b-zat6ggyqfl] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--ar-space-3);
}

/* h4 nosi podrazumijevanu donju marginu, pa naslov u flex redu sjedi niže od dugmadi -
   bez ovoga se "Nazad", naziv i akcije ne poklapaju po sredini reda. */
.page-info-left h4[b-zat6ggyqfl] {
    margin: 0;
    padding: 0;
    line-height: var(--ar-lh-tight);
    font-family: var(--ar-font);
    font-weight: var(--ar-fw-medium);
    font-size: var(--ar-fs-2xl);
    color: var(--ar-text);
}

.page-info-right[b-zat6ggyqfl] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: var(--ar-space-2);
    margin-left: auto;
}

#statistics-wrapper[b-zat6ggyqfl] {
    display: flex;
    align-items: center;
    gap: var(--ar-space-2);
}
/* _content/ArasWeb/Shared/Components/PageHeaderStatistics.razor.rz.scp.css */
.statistics-container[b-tq8hvhnrwi] {
    display: flex;
    align-items: center;
}

/* = ar-badge-navy ar-badge-lg: brojač uz naslov stranice, bez kartice. */
.statistics[b-tq8hvhnrwi] {
    background: var(--ar-navy-200);
    color: var(--ar-navy-700);
    padding: 0 .75rem;
    border-radius: var(--ar-radius-pill);
    display: flex;
    align-items: center;
    height: 1.75rem;
    gap: var(--ar-space-2);
    box-shadow: none !important;
}

.icon[b-tq8hvhnrwi] {
    display: inline-flex;
    font-size: var(--ar-fs-xs);
    opacity: .8;
}

.data[b-tq8hvhnrwi] {
    display: flex;
    align-items: baseline;
    gap: .3rem;
}

    .data span[b-tq8hvhnrwi] {
        font-family: var(--ar-font);
        font-weight: var(--ar-fw-medium);
        font-size: var(--ar-fs-sm);
        font-variant-numeric: tabular-nums;
        margin: 0;
    }

    .data label[b-tq8hvhnrwi] {
        color: var(--ar-navy-600);
        font-family: var(--ar-font);
        margin: 0;
        font-size: var(--ar-fs-sm);
    }
/* _content/ArasWeb/Shared/Components/Pagination.razor.rz.scp.css */
.pagination-bar[b-d1k4famge3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--ar-space-3);
    padding: var(--ar-space-3) var(--ar-space-4);
    flex-shrink: 0;
    border-top: 1px solid var(--ar-border-subtle);
    font-size: var(--ar-fs-sm);
    color: var(--ar-text-muted);
}

.page-controls[b-d1k4famge3] {
    display: flex;
    align-items: center;
    gap: 2px;
}

.page-size-picker[b-d1k4famge3] {
    display: flex;
    align-items: center;
    gap: var(--ar-space-2);
    font-size: var(--ar-fs-sm);
    color: var(--ar-text-muted);
}

.page-size-picker label[b-d1k4famge3] {
    white-space: nowrap;
    margin: 0;
}

.page-size-picker select[b-d1k4famge3] {
    width: 4.75rem;
    height: var(--ar-h-sm);
    font-size: var(--ar-fs-md);
}

.page-info[b-d1k4famge3] {
    font-size: var(--ar-fs-sm);
    color: var(--ar-text-muted);
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

/* = ar-page */
.pagination-btn[b-d1k4famge3] {
    min-width: 2rem;
    min-height: 2rem;
    height: 2rem;
    padding: 0 var(--ar-space-2);
    border: 0;
    border-radius: var(--ar-radius-sm);
    background: transparent;
    color: var(--ar-text);
    font-family: var(--ar-font);
    font-weight: var(--ar-fw-medium);
    font-size: var(--ar-fs-sm);
    font-variant-numeric: tabular-nums;
    cursor: pointer;
}

.pagination-btn:hover:not(:disabled):not(.active)[b-d1k4famge3] {
    background: var(--ar-bg-hover);
}

.pagination-btn.active[b-d1k4famge3] {
    background: var(--ar-primary);
    color: var(--ar-text-inverse);
    cursor: default;
}

.pagination-btn:disabled[b-d1k4famge3] {
    color: var(--ar-text-subtle);
    cursor: not-allowed;
}

.pagination-ellipsis[b-d1k4famge3] {
    color: var(--ar-text-muted);
    padding: 0 var(--ar-space-1);
    user-select: none;
}

/* Telefon: broj po stranici i ukupno u prvom redu, stranice ispod cijelom širinom, da ništa ne izlazi van ekrana. */
@media (max-width: 768px) {
    .pagination-bar[b-d1k4famge3] {
        flex-wrap: wrap;
        row-gap: var(--ar-space-2);
    }

    .page-controls[b-d1k4famge3] {
        order: 3;
        width: 100%;
        justify-content: center;
        flex-wrap: wrap;
    }
}
/* _content/ArasWeb/Shared/Components/PositionStatusBadge.razor.rz.scp.css */
.position-status[b-520m12yyjp] {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    padding: 0.2em 0.7em;
    border-radius: 1em;
    font-size: 0.85em;
    font-weight: 500;
    white-space: nowrap;
}

.position-status.in-work[b-520m12yyjp] {
    color: var(--color-primary-border);
    background: rgba(40, 138, 237, 0.15);
}

.position-status.running[b-520m12yyjp] {
    color: #b54708;
    background: rgba(247, 144, 9, 0.18);
}

.position-status.completed[b-520m12yyjp] {
    color: #1a7a37;
    background: rgba(38, 176, 80, 0.15);
}

.progress-count[b-520m12yyjp] {
    font-variant-numeric: tabular-nums;
    opacity: 0.85;
}

.dot[b-520m12yyjp] {
    width: 0.55em;
    height: 0.55em;
    border-radius: 50%;
    background: currentColor;
    animation: position-status-pulse-b-520m12yyjp 1.4s ease-in-out infinite;
}

@keyframes position-status-pulse-b-520m12yyjp {
    50% { opacity: 0.3; }
}
/* _content/ArasWeb/Shared/Components/ProcedureDocumentCard.razor.rz.scp.css */
#procedure-card[b-wacs6sim6v] {
    width: 100%;
    max-width: 900px;
    margin: 0.5em auto 0 auto;
    display: flex;
    flex-direction: column;
    background: white;
    padding: 1em;
    border-radius: 1em;
}

    #procedure-card > label[b-wacs6sim6v] {
        font-family: 'Ubuntu-Medium';
        color: #14425a;
        font-size: 1.1em;
        margin-bottom: 0.6em;
    }

.procedure-preview[b-wacs6sim6v] {
    width: 100%;
    border: 1px solid #dee2e6;
    border-radius: 0.5em;
    overflow: hidden;
    background: #e4eef2;
}

.procedure-frame[b-wacs6sim6v] {
    /* Sized so the download button below the preview stays above the fold
       (no scrolling to reach it). Shrinks with the viewport. */
    width: 100%;
    height: calc(100vh - 360px);
    min-height: 240px;
    max-height: 560px;
    border: 0;
    display: block;
}

.procedure-actions[b-wacs6sim6v] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6em;
    margin-top: 0.8em;
}

.procedure-filename[b-wacs6sim6v] {
    display: flex;
    align-items: center;
    gap: 0.4em;
    font-family: 'Ubuntu-Light';
    color: #6c757d;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pdf-icon[b-wacs6sim6v] {
    color: #d9534f;
    font-size: 1.2em;
    flex-shrink: 0;
}

.procedure-download-btn[b-wacs6sim6v] {
    flex-shrink: 0;
}

    .procedure-download-btn i[b-wacs6sim6v] {
        margin-right: 0.35em;
    }

.procedure-unavailable[b-wacs6sim6v] {
    font-family: 'Ubuntu-Light';
    color: #6c757d;
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 0.5em;
    padding: 1em;
    text-align: center;
    margin: 0;
}

    .procedure-unavailable i[b-wacs6sim6v] {
        color: #f0ad4e;
        margin-right: 0.4em;
    }
/* _content/ArasWeb/Shared/Components/SearchArticlesOnlyComponent.razor.rz.scp.css */
.input-box[b-w4ho4xug8a]{
    position: relative;
}

#search-component[b-w4ho4xug8a] {
    position: absolute;
    width: 50em;
    height: 30em;
    top: 100%;
    left: 0;
    border-radius: 1em;
    border: 0.1em solid gray;
    padding: 1em;
    background: white;
    z-index: 9999;
}

#close-btn[b-w4ho4xug8a] {
    width: 100%;
    display: flex;
    justify-content: end;
}

#search-list-wrapper[b-w4ho4xug8a] {
    width: 100%;
    height: 95%;
    overflow-y: scroll;
}

.search-list[b-w4ho4xug8a] {
    width: 100%;
    height: auto;
}

    .search-list h6[b-w4ho4xug8a] {
        font-family: 'Ubuntu-Medium';
        background: #ececec;
        padding: 0.5em;
        border-radius: .5em;
        margin: 0.5em 0;
    }

.search-item[b-w4ho4xug8a] {
    width: 98%;
    position: relative;
    display: flex;
    justify-content: start;
    margin: 0.3em;
    border-bottom: 0.01em solid lightgray;
    padding: 0.3em;
}

.search-item-field[b-w4ho4xug8a] {
    width: auto;
    margin-right: 0.8em;
    display: flex;
    flex-direction: column;
    width: 20%;
}

    .search-item-field label[b-w4ho4xug8a] {
        font-family: 'Ubuntu-Medium';
        word-break: break-all;
    }

    .search-item-field span[b-w4ho4xug8a] {
        font-family: 'Ubuntu-Light';
        font-size: 0.8em;
    }

.btn-item[b-w4ho4xug8a] {
    display: flex;
    justify-content: end;
    align-items: center;
    margin-left: auto;
}
/* _content/ArasWeb/Shared/Components/SearchComponent.razor.rz.scp.css */
#search-box[b-g48babjg6a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: 'Ubuntu-Light';
    font-size: 0.9em;
    margin-left: auto;
    position: relative;
}

#search-component[b-g48babjg6a] {
    position: absolute;
    width: 50em;
    height: 30em;
    top: 100%;
    right: 0;
    border-radius: 1em;
    border: 0.1em solid gray;
    padding: 1em;
    background: white;
    z-index: 1000;
}

#close-btn[b-g48babjg6a]{
    width: 100%;
    display: flex;
    justify-content: end;
}

#search-list-wrapper[b-g48babjg6a] {
    width: 100%;
    height: 95%;
    overflow-y: scroll;
}

.search-list[b-g48babjg6a] {
    width: 100%;
    height: auto;
}

    .search-list h6[b-g48babjg6a] {
        font-family: 'Ubuntu-Medium';
        background: #ececec;
        padding: 0.5em;
        border-radius: .5em;
        margin: 0.5em 0;
    }

.search-item[b-g48babjg6a] {
    width: 98%;
    position: relative;
    display: flex;
    justify-content: start;
    margin: 0.3em;
    border-bottom: 0.01em solid lightgray;
    padding: 0.3em;
}

.search-item-field[b-g48babjg6a] {
    width: auto;
    margin-right: 0.8em;
    display: flex;
    flex-direction: column;
    width: 20%;
}

    .search-item-field label[b-g48babjg6a] {
        font-family: 'Ubuntu-Medium';
        word-break: break-all;
    }

    .search-item-field span[b-g48babjg6a] {
        font-family: 'Ubuntu-Light';
        font-size: 0.8em;
    }

#search-placeholder[b-g48babjg6a] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    opacity: 0.8;
}

    #search-placeholder i[b-g48babjg6a] {
        font-size: 6em;
        opacity: 0.7;
        margin-bottom: 0.1em;
    }

    #search-placeholder p[b-g48babjg6a] {
        color: gray;
    }

.btn-item[b-g48babjg6a]{
    display: flex;
    justify-content: end;
    align-items: center;
    margin-left: auto;
}
/* _content/ArasWeb/Shared/Components/SearchComponentForDefects.razor.rz.scp.css */
#search-box[b-8kvy6hjzes] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: 'Ubuntu-Light';
    font-size: 0.9em;
    margin-left: auto;
    position: relative;
}

    #search-box .search[b-8kvy6hjzes] {
        width: 100% !important;
        border: 0.001em solid lightgray;
        border-radius: 0.25rem;
    }

#search-component[b-8kvy6hjzes] {
    position: absolute;
    width: 40em;
    height: 20em;
    top: 100%;
    right: 0;
    border-radius: 1em;
    border: 0.1em solid gray;
    padding: 1em;
    background: white;
    z-index: 10000;
}

#close-btn[b-8kvy6hjzes] {
    width: 100%;
    display: flex;
    justify-content: end;
}

#search-list-wrapper[b-8kvy6hjzes] {
    width: 100%;
    height: 90%;
    overflow-y: scroll;
}

.search-list[b-8kvy6hjzes] {
    width: 100%;
    height: auto;
}

    .search-list h6[b-8kvy6hjzes] {
        font-family: 'Ubuntu-Medium';
        background: #ececec;
        padding: 0.5em;
        border-radius: .5em;
        margin: 0.5em 0;
    }

.search-item[b-8kvy6hjzes] {
    width: 98%;
    position: relative;
    display: flex;
    justify-content: start;
    margin: 0.3em;
    border-bottom: 0.01em solid lightgray;
    padding: 0.3em;
}

.search-item-field[b-8kvy6hjzes] {
    width: auto;
    margin-right: 0.8em;
    display: flex;
    flex-direction: column;
    width: 50%;
}

    .search-item-field label[b-8kvy6hjzes] {
        font-family: 'Ubuntu-Medium';
        word-break: break-all;
    }

    .search-item-field span[b-8kvy6hjzes] {
        font-family: 'Ubuntu-Light';
        font-size: 0.8em;
    }

#search-placeholder[b-8kvy6hjzes] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    opacity: 0.8;
}

    #search-placeholder i[b-8kvy6hjzes] {
        font-size: 6em;
        opacity: 0.7;
        margin-bottom: 0.1em;
    }

    #search-placeholder p[b-8kvy6hjzes] {
        color: gray;
    }

.btn-item[b-8kvy6hjzes] {
    display: flex;
    justify-content: end;
    align-items: center;
    margin-left: auto;
}

.btn-item button[b-8kvy6hjzes] {
    padding: 0.2em 0.8em;
    border-radius: 0.5em;
}
/* _content/ArasWeb/Shared/Components/SearchComponentForReclamations.razor.rz.scp.css */
#search-box[b-niraghi16s] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: 'Ubuntu-Light';
    font-size: 0.9em;
    margin-left: auto;
    position: relative;
}

    #search-box .search[b-niraghi16s] {
        width: 100% !important;
        border: 0.01em solid lightgray;
        border-radius: 0.25rem;
    }

#search-component[b-niraghi16s] {
    position: absolute;
    width: 40em;
    height: 20em;
    top: 100%;
    right: 0;
    border-radius: 1em;
    border: 0.1em solid gray;
    padding: 1em;
    background: white;
    z-index: 10000;
}

#close-btn[b-niraghi16s] {
    width: 100%;
    display: flex;
    justify-content: end;
}

#search-list-wrapper[b-niraghi16s] {
    width: 100%;
    height: 90%;
    overflow-y: scroll;
}

.search-list[b-niraghi16s] {
    width: 100%;
    height: auto;
}

    .search-list h6[b-niraghi16s] {
        font-family: 'Ubuntu-Medium';
        background: #ececec;
        padding: 0.5em;
        border-radius: .5em;
        margin: 0.5em 0;
    }

.search-item[b-niraghi16s] {
    width: 98%;
    position: relative;
    display: flex;
    justify-content: start;
    margin: 0.3em;
    border-bottom: 0.01em solid lightgray;
    padding: 0.3em;
}

.search-item-field[b-niraghi16s] {
    width: auto;
    margin-right: 0.8em;
    display: flex;
    flex-direction: column;
    width: 50%;
}

    .search-item-field label[b-niraghi16s] {
        font-family: 'Ubuntu-Medium';
        word-break: break-all;
    }

    .search-item-field span[b-niraghi16s] {
        font-family: 'Ubuntu-Light';
        font-size: 0.8em;
    }

#search-placeholder[b-niraghi16s] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    opacity: 0.8;
}

    #search-placeholder i[b-niraghi16s] {
        font-size: 6em;
        opacity: 0.7;
        margin-bottom: 0.1em;
    }

    #search-placeholder p[b-niraghi16s] {
        color: gray;
    }

.btn-item[b-niraghi16s] {
    display: flex;
    justify-content: end;
    align-items: center;
    margin-left: auto;
}

    .btn-item button[b-niraghi16s] {
        padding: 0.2em 0.8em;
        border-radius: 0.5em;
    }
/* _content/ArasWeb/Shared/Components/SearchComponentForRepeatOperations.razor.rz.scp.css */
#search-box[b-hgxtokbeml] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: var(--font-light);
    font-size: 0.9em;
    margin-left: auto;
    position: relative;
}

    #search-box .search[b-hgxtokbeml] {
        width: 100% !important;
        border: 0.01em solid lightgray;
        border-radius: 0.25rem;
    }

#search-component[b-hgxtokbeml] {
    position: absolute;
    width: 40em;
    height: 20em;
    top: 100%;
    right: 0;
    border-radius: 1em;
    border: 0.1em solid gray;
    padding: 1em;
    background: white;
    z-index: 10000;
}

#close-btn[b-hgxtokbeml] {
    width: 100%;
    display: flex;
    justify-content: end;
}

#search-list-wrapper[b-hgxtokbeml] {
    width: 100%;
    height: 90%;
    overflow-y: scroll;
}

.search-list[b-hgxtokbeml] {
    width: 100%;
    height: auto;
}

    .search-list h6[b-hgxtokbeml] {
        font-family: var(--font-medium);
        background: var(--color-bg-header);
        padding: 0.5em;
        border-radius: .5em;
        margin: 0.5em 0;
    }

.search-item[b-hgxtokbeml] {
    width: 98%;
    position: relative;
    display: flex;
    justify-content: start;
    margin: 0.3em;
    border-bottom: 0.01em solid lightgray;
    padding: 0.3em;
}

.search-item-field[b-hgxtokbeml] {
    width: auto;
    margin-right: 0.8em;
    display: flex;
    flex-direction: column;
    width: 50%;
}

    .search-item-field label[b-hgxtokbeml] {
        font-family: var(--font-medium);
        word-break: break-all;
    }

    .search-item-field span[b-hgxtokbeml] {
        font-family: var(--font-light);
        font-size: 0.8em;
    }

#search-placeholder[b-hgxtokbeml] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    opacity: 0.8;
}

    #search-placeholder i[b-hgxtokbeml] {
        font-size: 6em;
        opacity: 0.7;
        margin-bottom: 0.1em;
    }

    #search-placeholder p[b-hgxtokbeml] {
        color: gray;
    }

.btn-item[b-hgxtokbeml] {
    display: flex;
    justify-content: end;
    align-items: center;
    margin-left: auto;
}

    .btn-item button[b-hgxtokbeml] {
        padding: 0.2em 0.8em;
        border-radius: 0.5em;
    }
/* _content/ArasWeb/Shared/Components/ShapeIcon.razor.rz.scp.css */
.shape-icon[b-rr0x25gwso] {
    display: inline-block;
    flex: none;
    width: 1em;
    height: 1em;
    box-sizing: border-box;
    vertical-align: -0.15em;
    color: var(--color-text-dark);
}

.square[b-rr0x25gwso],
.circle[b-rr0x25gwso],
.l-profile[b-rr0x25gwso] {
    background: currentColor;
}

.circle[b-rr0x25gwso] {
    border-radius: 50%;
}

.l-profile[b-rr0x25gwso] {
    clip-path: polygon(0% 0%, 30% 0%, 30% 70%, 100% 70%, 100% 100%, 0% 100%);
}

.square-tube[b-rr0x25gwso],
.round-tube[b-rr0x25gwso] {
    border: 0.22em solid currentColor;
    background: transparent;
}

.round-tube[b-rr0x25gwso] {
    border-radius: 50%;
}
/* _content/ArasWeb/Shared/Components/StalledArticlesModal.razor.rz.scp.css */
/* .modal-body u ArasModal-u ima padding: 0 — svaki sadržaj sam nosi svoj razmak, inače
   tabela ide od ivice do ivice prozora. */
#stalled-articles[b-gqtsx973yi] {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: var(--space-md) var(--space-lg) 0;
    box-sizing: border-box;
}

/* ---- Traka iznad tabele ---- */

.stalled-toolbar[b-gqtsx973yi] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-md);
    padding-bottom: var(--space-sm);
    margin-bottom: var(--space-sm);
    border-bottom: 0.1em solid var(--color-border-light);
}

.stalled-filters[b-gqtsx973yi] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-md);
}

    .stalled-filters .filter-box[b-gqtsx973yi] {
        display: flex;
        flex-direction: column;
        gap: var(--space-xs);
    }

        .stalled-filters .filter-box > label[b-gqtsx973yi] {
            font-family: var(--font-light);
            font-size: 0.75em;
            color: var(--color-text-muted);
        }

        .stalled-filters .filter-box .form-control[b-gqtsx973yi] {
            min-width: 11em;
        }

.stalled-summary[b-gqtsx973yi] {
    display: flex;
    gap: var(--space-sm);
    padding-bottom: var(--space-xs);
}

.summary-chip[b-gqtsx973yi] {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    padding: 0.35em 0.8em;
    border-radius: 1em;
    font-family: var(--font-medium);
    font-size: 0.8em;
    color: var(--color-text-dark);
    background: var(--color-bg-surface);
    white-space: nowrap;
}

    .summary-chip.is-overdue[b-gqtsx973yi] {
        color: white;
        background: var(--color-danger);
    }

/* ---- Spisak ---- */

/* Spisak zna biti dug, a filteri i dugmad moraju ostati na ekranu — inače se do "Preuzmi"
   stiže tek skrolanjem kroz cijelu tabelu. */
.stalled-body[b-gqtsx973yi] {
    max-height: 55vh;
    overflow-y: auto;
    padding-right: var(--space-xs);
}

.stalled-group-title[b-gqtsx973yi] {
    display: flex;
    align-items: center;
    gap: 0.45em;
    margin: var(--space-md) 0 var(--space-xs) 0;
    font-family: var(--font-bold);
    font-size: 0.85em;
    color: var(--color-text-dark);
}

    .stalled-group-title:first-child[b-gqtsx973yi] {
        margin-top: 0;
    }

    /* Zakašnjeli nose boju upozorenja i na naslovu i na okviru tabele — spisak se čita u prolazu,
       pa razlika mora biti vidljiva prije nego se pročita ijedan datum. */
    .stalled-group-title.overdue[b-gqtsx973yi] {
        color: var(--color-danger);
    }

.group-count[b-gqtsx973yi] {
    padding: 0.1em 0.55em;
    border-radius: 1em;
    font-family: var(--font-medium);
    font-size: 0.9em;
    color: var(--color-text-dark);
    background: var(--color-bg-surface);
}

.stalled-group-title.overdue .group-count[b-gqtsx973yi] {
    color: white;
    background: var(--color-danger);
}

.stalled-table[b-gqtsx973yi] {
    display: flex;
    flex-direction: column;
    width: 100%;
    font-size: 0.8em;
    border: 0.1em solid var(--color-border);
    border-radius: 0.4em;
    background: var(--color-bg-card);
}

    /* Traka uz lijevu ivicu umjesto samo crvenog teksta: blok se prepozna prije čitanja. */
    .stalled-table.is-overdue[b-gqtsx973yi] {
        border-color: var(--color-danger);
        border-left-width: 0.3em;
    }

.stalled-row[b-gqtsx973yi] {
    display: flex;
    width: 100%;
    border-bottom: 0.05em solid var(--color-border-light);
    color: inherit;
    text-decoration: none;
}

    .stalled-row.is-link[b-gqtsx973yi],
    .stalled-row.is-link > label[b-gqtsx973yi] {
        cursor: pointer;
    }

        .stalled-row.is-link:hover .col-crtez[b-gqtsx973yi] {
            text-decoration: underline;
        }

    .stalled-row:last-child[b-gqtsx973yi] {
        border-bottom: none;
    }

    .stalled-row:not(.stalled-head):nth-child(even)[b-gqtsx973yi] {
        background: var(--color-bg-main);
    }

    .stalled-row:not(.stalled-head):hover[b-gqtsx973yi] {
        background: var(--color-bg-surface);
    }

    .stalled-row > label[b-gqtsx973yi] {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 0.15em;
        padding: 0.55em 0.7em;
        border-right: 0.05em solid var(--color-border-light);
        word-break: normal;
        overflow-wrap: break-word;
    }

        .stalled-row > label:last-child[b-gqtsx973yi] {
            border-right: none;
        }

/* Zaglavlje ostaje vidljivo dok se spisak skrola. Tabela zato NE smije imati overflow:hidden —
   time bi postala vlastiti okvir za skrolanje i ljepljivost bi otišla. Zaobljenje se zato radi
   na samom zaglavlju, ne odsijecanjem. */
.stalled-head[b-gqtsx973yi] {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--color-bg-surface);
    border-radius: 0.35em 0.35em 0 0;
}

    .stalled-head > label[b-gqtsx973yi] {
        font-family: var(--font-medium);
        color: var(--color-text-dark);
    }

.col-rok[b-gqtsx973yi] { width: 11%; }
.col-kupac[b-gqtsx973yi] { width: 14%; }
.col-narudzba[b-gqtsx973yi] { width: 11%; }
.col-crtez[b-gqtsx973yi] { width: 18%; }
.col-artikl[b-gqtsx973yi] { width: 14%; }
.col-obrada[b-gqtsx973yi] { width: 13%; }
.col-operacija[b-gqtsx973yi] { width: 11%; }

.col-komada[b-gqtsx973yi] {
    width: 8%;
    align-items: flex-end;
}

.deadline-date[b-gqtsx973yi] {
    font-family: var(--font-medium);
}

.deadline-relative[b-gqtsx973yi] {
    font-family: var(--font-light);
    font-size: 0.85em;
    color: var(--color-text-muted);
}

.is-overdue .deadline-relative[b-gqtsx973yi] {
    color: var(--color-danger);
}

/* Po broju crteža se komad traži na paletama — jedina vrijednost u redu koja se prepisuje. */
.col-crtez[b-gqtsx973yi] {
    font-family: var(--font-medium);
    color: var(--color-text-dark);
}

.pieces[b-gqtsx973yi] {
    font-family: var(--font-medium);
    font-size: 1.1em;
}

    /* Dio je uzet u rad a ostatak stoji: taj ostatak se previdi jednako lako kao cijela pozicija. */
    .pieces.partial[b-gqtsx973yi] {
        color: var(--color-danger);
    }

.pieces-total[b-gqtsx973yi] {
    font-family: var(--font-light);
    font-size: 0.8em;
    color: var(--color-text-muted);
}

/* ---- Prazno stanje ---- */

.stalled-empty[b-gqtsx973yi] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-sm);
    padding: var(--space-lg) var(--space-md);
    color: var(--color-text-muted);
}

    .stalled-empty i[b-gqtsx973yi] {
        font-size: 2em;
        opacity: 0.5;
    }

    .stalled-empty p[b-gqtsx973yi] {
        margin: 0;
    }

    .stalled-empty.is-good i[b-gqtsx973yi] {
        color: var(--color-success);
        opacity: 1;
    }

/* ---- Dugmad ---- */

.buttons[b-gqtsx973yi] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-sm);
    /* Isti bočni razmak kao sadržaj iznad, da se dugmad poklope s ivicom tabele. */
    padding: var(--space-md) var(--space-lg);
}

#stalled-excel[b-gqtsx973yi] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
}

    #stalled-excel img[b-gqtsx973yi] {
        height: 1.2em;
    }

    #stalled-excel:disabled[b-gqtsx973yi] {
        opacity: 0.5;
        cursor: not-allowed;
    }
/* _content/ArasWeb/Shared/Components/SubmenuTabs.razor.rz.scp.css */
/* Sve ostalo (prozirna pozadina, linija ispod, podvučen aktivan tab) dolazi iz site.css,
   isto kao na Nabavi. Ondje veći razmak ispod trake daje klasa orders-phase-tabs, ali ona
   uz razmak nosi i stil za brojače kojih ovdje nema — pa se preuzima samo razmak. */
#tabs[b-ridkoneexd] {
    margin-bottom: var(--space-md, 1em);
}
/* _content/ArasWeb/Shared/Components/SupplierOrdersTabContent.razor.rz.scp.css */
#supplier-orders-container[b-jjkb8viy0f] {
    display: flex;
    flex-direction: column;
    width: 100%;
    flex: 1;
    min-height: 0;
    border-radius: 0.5em;
    background: white;
    padding: 0.5em 0;
}

#supplier-order-filters[b-jjkb8viy0f] {
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
    width: 100%;
    padding: 0.3em 1em;
    font-family: var(--font-light);
    font-size: 0.9em;
    flex-shrink: 0;
    gap: 0.5em;
    flex-wrap: wrap;
}

.filter-box[b-jjkb8viy0f] {
    margin-right: 1em;
    display: flex;
    flex-direction: column;
}

    .filter-box label[b-jjkb8viy0f] {
        margin-bottom: 0.5em;
    }

    .filter-box select[b-jjkb8viy0f] {
        width: 13em;
        padding: 0.5em 0.2em;
    }

    .filter-box img[b-jjkb8viy0f] {
        width: 1em;
        height: 1em;
        margin: 0 0.5em;
    }

#supplier-orders-list[b-jjkb8viy0f] {
    width: 100%;
}

/* -- Kolone -- */

.order-no[b-jjkb8viy0f], .buyer[b-jjkb8viy0f] {
    width: 15%;
    word-break: break-all;
}

.suppliers[b-jjkb8viy0f] {
    width: 22%;
    display: flex;
    flex-wrap: wrap;
    gap: 0.3em;
}

.articles-count[b-jjkb8viy0f] {
    width: 16%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3em;
}

.order-status[b-jjkb8viy0f] {
    width: 16%;
}

.due-date-box[b-jjkb8viy0f] {
    width: 16%;
}

/* -- Oznake -- */

/* width/justify-content se moraju eksplicitno resetovati - globalno pravilo
   ".list-wrapper ul li span" iz site.css hvata i ove ugniježdene span-ove. */
.supplier-chip[b-jjkb8viy0f] {
    display: inline-flex;
    width: auto;
    justify-content: flex-start;
    align-items: center;
    gap: 0.4em;
    background: var(--color-bg-surface);
    color: var(--color-text-dark);
    font-family: var(--font-medium);
    font-size: 0.8em;
    padding: 0.3em 0.9em;
    border-radius: 2em;
    white-space: nowrap;
}

    .supplier-chip.unknown[b-jjkb8viy0f] {
        background: rgba(236, 236, 236, 0.8);
        color: var(--color-text-muted);
    }

    .supplier-chip i[b-jjkb8viy0f] {
        color: var(--color-icon-accent);
    }

.articles-ratio[b-jjkb8viy0f] {
    width: auto;
    display: inline-flex;
    justify-content: center;
    font-family: var(--font-medium);
}

.sent-badge[b-jjkb8viy0f] {
    display: inline-flex;
    width: auto;
    justify-content: flex-start;
    align-items: center;
    gap: 0.4em;
    background: rgba(205, 254, 194, 0.8);
    color: var(--color-text-dark);
    font-family: var(--font-medium);
    font-size: 0.75em;
    padding: 0.2em 0.8em;
    border-radius: 2em;
    white-space: nowrap;
}

.due-date-today[b-jjkb8viy0f],
.due-date-late[b-jjkb8viy0f],
.order-status span[b-jjkb8viy0f] {
    font-family: var(--font-medium);
    font-size: 0.8em;
}

    .due-date-today span[b-jjkb8viy0f],
    .due-date-late span[b-jjkb8viy0f],
    .order-status span[b-jjkb8viy0f] {
        border-radius: 2em;
        text-align: center;
        width: auto;
        display: inline-flex;
        padding: 0.3em 1.5em;
        word-break: break-all;
    }

    .due-date-today span[b-jjkb8viy0f] {
        background: var(--color-warning);
    }

    .due-date-late span[b-jjkb8viy0f] {
        background: var(--color-danger);
        color: white;
    }

    .order-status span img[b-jjkb8viy0f] {
        width: 1.2em;
        height: 1.2em;
        margin-right: 0.5em;
    }

.order-created span[b-jjkb8viy0f] {
    background: rgba(236, 236, 236, 0.8);
}

.order-in-progress span[b-jjkb8viy0f] {
    background: rgba(137, 196, 244, 0.8);
}

.order-finished span[b-jjkb8viy0f] {
    background: rgba(205, 254, 194, 0.8);
}
/* _content/ArasWeb/Shared/Components/WeekRangeSelector.razor.rz.scp.css */
.form-control[b-0mvomnnh4k] {
    cursor: pointer;
}

.wk[b-0mvomnnh4k] {
    width: 100%;
    border: 0.1em solid #ddd;
    border-radius: 1em;
    padding: 1em;
    background: white;
    position: absolute;
    z-index: 999999;
    cursor: pointer;
}

.wk-header[b-0mvomnnh4k] {
    display: flex;
    align-items: center;
    gap: 1em;
}

.wk-title[b-0mvomnnh4k] {
    flex: 1;
    text-align: center;
    font-family: var(--font-regular)
}

.wk-btn[b-0mvomnnh4k] {
    border: 0.1em solid #ddd;
    background: #fff;
    border-radius: 1em;
    padding: 0.5em;
    cursor: pointer;
}

.wk-today[b-0mvomnnh4k] {
    margin-left: auto;
}

.wk-selected[b-0mvomnnh4k] {
    margin: 0.5em 0 0.6em;
    font-size: 0.95em;
}

.wk-grid[b-0mvomnnh4k] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0.5em;
}

.wk-dow[b-0mvomnnh4k] {
    text-align: center;
    font-size: 0.85em;
    opacity: 0.75;
    padding: 0.5em 0;
}

.wk-day[b-0mvomnnh4k] {
    border: 0.1em solid #eee;
    background: #fff;
    border-radius: 1em;
    padding: 0.5em 0;
    cursor: pointer;
    text-align: center;
}

    .wk-day.muted[b-0mvomnnh4k] {
        opacity: 0.45;
    }

    .wk-day.today[b-0mvomnnh4k] {
        font-family: var(--font-regular);
    }

    .wk-day.selected[b-0mvomnnh4k] {
        color: white;
        font-family: var(--font-regular);
    }

#accept[b-0mvomnnh4k] {
    margin-top: 1em;
    margin-left: auto;
}
/* _content/ArasWeb/Shared/Components/WorkOrderInput.razor.rz.scp.css */
#create-work-order-container[b-8y5kil8q0t] {
    width: 100%;
    height: 98%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    overflow-y: scroll;
}

/*
    PREVIEW STYLE
*/

#preview[b-8y5kil8q0t] {
    height: auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    padding: 1em;
    border-radius: 0.5em;
}

    #preview #order-preview[b-8y5kil8q0t] {
        background: white;
        height: auto;
        width: 100%;
        display: flex;
        flex-direction: column;
        border-radius: 0.5em;
        margin-bottom: 2em;
        background: white;
    }

.checkmark-top[b-8y5kil8q0t], .checkmark-bottom[b-8y5kil8q0t] {
    display: flex;
    justify-content: center;
    background: var(--color-primary-hover);
    width: 100%;
    border-top-left-radius: 0.5em;
    border-top-right-radius: 0.5em;
    padding: 0.5em 0;
    height: 2em;
}

#preview #order-preview .checkmark-bottom[b-8y5kil8q0t] {
    border-radius: 0;
    border-bottom-left-radius: 0.5em;
    border-bottom-right-radius: 0.5em;
}

#preview #order-preview #header[b-8y5kil8q0t] {
    width: 100%;
    display: flex;
    flex-direction: column;
    border-bottom: 0.1em solid lightgrey;
    padding: 2em;
}

    #preview #order-preview #header .group[b-8y5kil8q0t] {
        display: flex;
        width: 100%;
        justify-content: start;
    }

        #preview #order-preview #header .group .info[b-8y5kil8q0t] {
            width: 31%;
        }

#preview #order-preview #body[b-8y5kil8q0t] {
    padding: 2em;
    width: 100%;
}

#preview .info[b-8y5kil8q0t] {
    display: flex;
    flex-direction: column;
    margin-bottom: 1em;
}


    #preview .info label[b-8y5kil8q0t] {
        font-family: var(--font-regular);
        font-size: 0.9em;
    }

    #preview .info span[b-8y5kil8q0t] {
        font-family: var(--font-medium);
        font-size: 1.1em;
        color: var(--color-primary-hover);
    }

#article-info[b-8y5kil8q0t] {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

    #article-info .info[b-8y5kil8q0t] {
        width: 50%;
        padding-right: 1em;
        border-bottom: 0.05em solid lightgray;
        padding-bottom: 1em;
    }

    #article-info .right[b-8y5kil8q0t] {
        padding-right: 0;
        padding-left: 1em;
    }

#input-dimensions[b-8y5kil8q0t] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    #input-dimensions span[b-8y5kil8q0t] {
        color: black;
        margin: 0 1em;
    }

#article-info #garbage[b-8y5kil8q0t],
#article-info #garbage span[b-8y5kil8q0t] {
    color: var(--color-danger)
}

[b-8y5kil8q0t] .input-value {
    color: var(--color-primary-hover);
    background: rgba(30, 136, 229, 0.1);
}

.input-checkbox label[b-8y5kil8q0t] {
    margin-left: 0.5em;
}

/* Revealed from the right edge instead of sliding in from past it: a box sticking out of the page
   gave it a scrollbar for the length of the animation, the form narrowed by its width and the rows
   of the lists wrapped taller, then went back. The negative insets keep the shadow. */
@keyframes example-b-8y5kil8q0t {
    0% {
        clip-path: inset(-3em -3em -3em 100%);
        opacity: 0;
    }

    100% {
        clip-path: inset(-3em);
        opacity: 1;
    }
}

#add-new-item[b-8y5kil8q0t] {
    position: absolute;
    right: 0;
    top: 0;
    width: 25em;
    height: 100%;
    background: white;
    animation-name: example-b-8y5kil8q0t;
    animation-duration: 0.5s;
    z-index: 9999;
    border-radius: 1em;
    padding: 1em;
}

    #add-new-item header[b-8y5kil8q0t] {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

        #add-new-item header button[b-8y5kil8q0t] {
            background: transparent;
            font-size: 1.3em !important;
        }


.info .add-item[b-8y5kil8q0t] {
    margin-left: 1em;
    padding: 0.3em 1em;
    border-radius: 0.5em;
    background: var(--color-primary);
    color: white;
    font-family: var(--font-bold);
}

/* Secondary next to the round "+": importing replaces the list, adding one tool does not. */
.info .add-item.import-item[b-8y5kil8q0t] {
    background: white;
    color: var(--color-primary);
    border: 0.1em solid var(--color-primary);
    padding: 0.3em 0.7em;
}

/* The header is a flex row, and a plain span shrinks under its buttons until they wrap onto
   two lines. Keeps them on one line whatever the column is worth. */
.add-item-container-header .header-actions[b-8y5kil8q0t] {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    white-space: nowrap;
}

.import-box[b-8y5kil8q0t] {
    width: 100%;
    max-height: 14em;
    overflow-y: auto;
    background: #f1f1f1;
    border-radius: 0.5em;
    padding: 0.5em 0.8em;
    font-size: 0.9em;
}

    .import-box p[b-8y5kil8q0t] {
        margin: 0 0 0.2em 0;
    }

.import-error[b-8y5kil8q0t] {
    background: rgba(220, 53, 69, .1);
    color: var(--color-danger);
}

.import-warning[b-8y5kil8q0t] {
    background: rgba(255, 193, 7, .15);
}

.import-note[b-8y5kil8q0t] {
    font-size: 0.9em;
    margin: 0.5em 0;
}

#note[b-8y5kil8q0t] {
    width: 100% !important;
    color: var(--color-danger);
}

/* Puna sirina kao i #note — u dvokolonskom rasporedu bi inace razbio red. */
#cutting-note[b-8y5kil8q0t],
#material-stock[b-8y5kil8q0t] {
    width: 100% !important;
}

    #cutting-note label[b-8y5kil8q0t] {
        font-family: var(--font-bold);
    }

    #note[b-8y5kil8q0t]  textarea {
        color: var(--color-danger);
    }

.add-item-container[b-8y5kil8q0t] {
}

.empty-table[b-8y5kil8q0t] {
    width: 100%;
    background: #f1f1f1;
    padding: 0.3em 0.8em;
    border-bottom-left-radius: 0.5em;
    border-bottom-right-radius: 0.5em;
    opacity: 0.7;
}

    .empty-table label[b-8y5kil8q0t] {
        font-family: var(--font-light);
        font-size: 0.9em;
    }

.add-item-container-header[b-8y5kil8q0t] {
    display: flex;
    align-items: end;
    justify-content: space-between;
    border-bottom: 0.05em solid rgba(40, 138, 237, .5);
    padding-bottom: 0.5em;
    width: 100%;
}

#add-new-item .body[b-8y5kil8q0t] {
    height: 80%;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: start;
    padding: 0 2em;
}

    #add-new-item .body .add-new-item-input-box[b-8y5kil8q0t] {
        width: 100%;
        margin: 0.5em 0;
    }

        #add-new-item .body .add-new-item-input-box label[b-8y5kil8q0t] {
            margin-bottom: 0.5em;
        }

        #add-new-item .body .add-new-item-input-box .tool[b-8y5kil8q0t] {
            width: 100%;
            padding: .375rem .75rem;
            display: block;
            border: 1px solid #ced4da;
            border-radius: .25rem;
            background: #e9ecef;
        }

        #add-new-item .body .add-new-item-input-box .tool-placeholder[b-8y5kil8q0t] {
            opacity: .7;
            color: gray;
        }

    #add-new-item .body button[b-8y5kil8q0t] {
        margin-top: 1em;
    }

.items-list[b-8y5kil8q0t] {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: auto;
    background: rgba(40, 138, 237, .1);
}

.list-header[b-8y5kil8q0t],
.items-list_item[b-8y5kil8q0t] {
    display: flex;
    justify-content: space-between;
    width: 100%;
    text-align: left;
    font-family: var(--font-regular);
}

.list-header[b-8y5kil8q0t] {
    background: rgba(40, 138, 237, .2);
    border-radius: 0;
    font-family: var(--font-medium) !important;
    text-transform: uppercase;
    padding: 0;
}

.items-list_item[b-8y5kil8q0t] {
    border-bottom: 0.1em solid lightgray;
}

    .items-list_item span[b-8y5kil8q0t] {
        font-size: 0.9em !important;
        word-wrap: break-word;
        color: black !important;
    }

    .items-list_item img[b-8y5kil8q0t] {
        width: 1.3em;
        height: 1.3em;
        cursor: pointer;
    }

.dorezivanje-col[b-8y5kil8q0t] {
    width: 30%;
    border-right: 0.05em solid gray;
    padding: 0.5em;
    text-align: left
}

.list-header .dorezivanje-col[b-8y5kil8q0t] {
    padding: 0.8em 0.5em;
}

/* Five columns instead of the three .dorezivanje-col assumes; 90% total leaves .img-col its 10%. */
.tool-code-col[b-8y5kil8q0t],
.tool-name-col[b-8y5kil8q0t],
.tool-num-col[b-8y5kil8q0t],
.tool-note-col[b-8y5kil8q0t] {
    border-right: 0.05em solid gray;
    padding: 0.5em;
    text-align: left;
    word-break: break-word;
}

.tool-code-col[b-8y5kil8q0t] {
    width: 15%;
}

.tool-name-col[b-8y5kil8q0t] {
    width: 33%;
}

.tool-num-col[b-8y5kil8q0t] {
    width: 12%;
}

.tool-note-col[b-8y5kil8q0t] {
    width: 18%;
}

.tool-note-col[b-8y5kil8q0t]  .tool-note-input {
    width: 100%;
    border: none;
    background: transparent;
    padding: 0;
    font-size: 0.9em;
}

    .tool-note-col[b-8y5kil8q0t]  .tool-note-input:focus {
        background: white;
        outline: 0.05em solid var(--color-primary);
    }

.list-header .tool-code-col[b-8y5kil8q0t],
.list-header .tool-name-col[b-8y5kil8q0t],
.list-header .tool-num-col[b-8y5kil8q0t],
.list-header .tool-note-col[b-8y5kil8q0t] {
    padding: 0.8em 0.5em;
}

.img-col[b-8y5kil8q0t] {
    width: 10%;
    display: flex;
    justify-content: center;
    align-items: center;
}

[b-8y5kil8q0t] input[type="file"] {
    display: none;
}

/* The rule above hides every file input in this component, because the image uploads are driven by
   their own .custom-file-upload label. The tool import has no such label and needs the real input. */
[b-8y5kil8q0t] input[type="file"].import-file-input {
    display: block;
    width: 100%;
}

.custom-file-upload[b-8y5kil8q0t] {
    width: 417px;
    height: 391px;
    cursor: pointer;
    border: 0.2em dashed lightblue;
    border-radius: 1em;
    display: flex;
    justify-content: center;
    align-items: center !important;
    flex-direction: column;
    background: white;
    position: relative;
}

    .custom-file-upload span[b-8y5kil8q0t] {
        font-size: 1.2em;
        margin: 0.5em;
    }

.placeholder-img[b-8y5kil8q0t] {
    width: 2em;
    height: 2em;
}

#uploaded-img[b-8y5kil8q0t] {
    border: 0.2em dashed lightblue;
    border-radius: 1em;
}

#create-rn[b-8y5kil8q0t] {
    margin-left: auto;
    display: block;
}

[b-8y5kil8q0t] .select-value {
    background: rgba(217, 83, 79, 0.3)
}

/*
    MODAL ZA KREIRANJE:
*/

#create-work-order[b-8y5kil8q0t] {
    width: 100%;
    padding: 5em 3em;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}

    #create-work-order #description[b-8y5kil8q0t] {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        flex-direction: column;
    }

        #create-work-order #description p[b-8y5kil8q0t] {
            width: 100%;
            text-align: center;
            font-size: 1.5em;
            margin: 0;
            font-family: var(--font-bold);
        }

        #create-work-order #description label[b-8y5kil8q0t] {
            font-size: 0.9em;
            font-family: var(--font-light);
            margin-top: 0.5em;
        }

    #create-work-order #selection[b-8y5kil8q0t] {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0 5em;
    }

        #create-work-order #selection button[b-8y5kil8q0t] {
            background: transparent;
            font-family: var(--font-bold);
            border: 0.2em solid gray;
            color: gray;
            width: 45%;
        }

        #create-work-order #selection #yes[b-8y5kil8q0t] {
            color: #70bc64;
            border: 0.2em solid #70bc64;
        }

            #create-work-order #selection #yes:hover[b-8y5kil8q0t] {
                background: #70bc64;
                color: white;
            }

        #create-work-order #selection #no:hover[b-8y5kil8q0t] {
            background: gray;
            color: white;
        }

.ensats-input div[b-8y5kil8q0t] {
    margin-bottom: 0.5em;
}

.shape-selection[b-8y5kil8q0t] {
    margin-right: 50%;
}

.shape-selection-compact[b-8y5kil8q0t] {
    margin-right: 0;
}

#article-shape[b-8y5kil8q0t] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

    #article-shape div[b-8y5kil8q0t] {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 40%;
        cursor: pointer;
        padding: 0.5em;
        border-radius: 0.5em;
    }

.selected-shape[b-8y5kil8q0t] {
    border: 0.1em solid #5cb85c;
    background: var(--color-bg-surface);
}

.unselected-shape[b-8y5kil8q0t] {
    border: 0.1em solid lightgray;
    background: white;
}

.circle[b-8y5kil8q0t],
.square[b-8y5kil8q0t] {
    height: 2em;
    width: 2em;
    background-color: var(--color-text-dark);
    display: inline-flex;
}

.circle[b-8y5kil8q0t] {
    border-radius: 50%;
}

.l-profile[b-8y5kil8q0t] {
    height: 2em;
    width: 2em;
    display: inline-block;
    background: var(--color-text-dark);
    clip-path: polygon(0% 0%, 30% 0%, 30% 70%, 100% 70%, 100% 100%, 0% 100%);
}

.square-tube[b-8y5kil8q0t] {
    height: 2em;
    width: 2em;
    display: inline-block;
    border: 0.45em solid var(--color-text-dark);
    background: transparent;
    box-sizing: border-box;
}

.round-tube[b-8y5kil8q0t] {
    height: 2em;
    width: 2em;
    display: inline-block;
    border: 0.45em solid var(--color-text-dark);
    border-radius: 50%;
    background: transparent;
    box-sizing: border-box;
}

.validation-warning[b-8y5kil8q0t] {
    color: #d9534f;
    font-size: 0.85em;
    margin: 0.3em 0 0 0;
}


.remove-img-btn[b-8y5kil8q0t] {
    position: absolute;
    top: 0.5em;
    right: 0.5em;
    color: red;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    background: white;
    border: 0.1em solid red;
    border-radius: 0.5em;
}

    .remove-img-btn i[b-8y5kil8q0t] {
        font-size: 1.3em;
        padding: 0.3em;
        margin: 0;
    }


#preview .info .number-in-order[b-8y5kil8q0t] {
    display: flex;
    align-items: center;
}

    #preview .info .number-in-order span[b-8y5kil8q0t] {
        width: 30%;
        margin-right: 0.5em;
    }

#preview .info .quantity-editable[b-8y5kil8q0t] {
    display: flex;
}

    #preview .info .quantity-editable .quantity-input[b-8y5kil8q0t] {
        width: 30%;
    }

    #preview .info .quantity-editable .quantity-check[b-8y5kil8q0t]  {
        width: 70%;
        display: flex;
        align-items: center;
        justify-content: start;
        padding-left: 0.3em;
    }

    #preview .info .quantity-editable .quantity-check label[b-8y5kil8q0t] {
        color: black;
        font-family: var(--font-light);
        font-size: 0.7em;       
    }

        #preview .info .quantity-editable .quantity-check input[type=checkbox][b-8y5kil8q0t] {
            margin: 0 0.3em;
            padding: 0.5em;
            cursor: pointer;
        }

#preview .info.avio-toggle-info[b-8y5kil8q0t] {
    display: flex;
    flex-direction: column;
    gap: 0.3em;
}

#preview .info .avio-toggle[b-8y5kil8q0t] {
    display: flex;
    align-items: center;
    gap: 0.4em;
}

#preview .info .avio-toggle input[type=checkbox][b-8y5kil8q0t] {
    cursor: pointer;
    width: 1.1em;
    height: 1.1em;
    accent-color: #14425a;
}

#preview .info .avio-toggle-label[b-8y5kil8q0t] {
    font-family: var(--font-light);
    font-size: 0.85em;
    color: #14425a;
    cursor: pointer;
    margin: 0;
}

#preview .info .avio-number-badge[b-8y5kil8q0t] {
    font-family: var(--font-medium);
    font-size: 0.95em;
    color: white;
    background-color: #14425a;
    border-radius: 0.4em;
    padding: 0.15em 0.6em;
    display: inline-block;
    letter-spacing: 0.05em;
}

#preview .info .avio-number-pending[b-8y5kil8q0t] {
    font-family: var(--font-light);
    font-size: 0.75em;
    color: #6c757d;
    font-style: italic;
}
/* _content/ArasWeb/Shared/Layouts/AuthLayout.razor.rz.scp.css */
.page[b-s83wvkm8li] {
    position: absolute;
    width: 100%;
    height: 100%;
}

main[b-s83wvkm8li] {
    width: 100%;
    height: 100%;
    position: relative;
    background: var(--color-sidebar-start);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    background-image: linear-gradient(to bottom, #04344c, #053e5a, #064868, #085276, #0b5c85);
    font-family: var(--font-light);
}
/* _content/ArasWeb/Shared/Layouts/MainLayout.razor.rz.scp.css */
.page[b-cmpio3c6uf] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-cmpio3c6uf] {
    flex: 1;
    /* Stavka flex reda ima min-width:auto, pa bi je tabela sa min-width (Održavanje: 980-1100px)
       razvukla preko ekrana, iako je tabela u omotaču sa overflow:auto. Sa 0 main ostaje širok
       koliko je mjesta, a skrola samo omotač tabele. */
    min-width: 0;
    display: flex;
    flex-direction: column;
    height: 100vh;
}

.sidebar[b-cmpio3c6uf] {
    background-color: var(--ar-navy-900);
    background-image: var(--ar-nav-bg);
    display: flex;
    flex-direction: column;
}

    .sidebar #copyright[b-cmpio3c6uf] {
        margin-top: auto;
        padding-top: 0.5em;
        font-size: 0.65em;
        color: var(--ar-nav-text);
        font-family: var(--ar-font);
        padding-bottom: 1em;
        padding-left: 1rem;
        text-align: left;
        opacity: 0.7;
        background: transparent;
    }

        /* Verzija ide u novi red ispod copyrighta — sidebar je uzak, a broj se cita rijetko. */
        .sidebar #copyright #app-version[b-cmpio3c6uf] {
            display: block;
            margin-top: 0.15em;
        }

.top-row[b-cmpio3c6uf] {
    background-color: var(--ar-bg-surface);
    border-bottom: 1px solid var(--ar-border);
    justify-content: space-between;
    height: 4rem;
    /* main is a column as tall as the screen: a tall page squeezed this bar below the sidebar's
       logo row, so the two bottom lines stopped meeting. */
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

    .top-row[b-cmpio3c6uf]  a, .top-row .btn-link[b-cmpio3c6uf] {
        white-space: nowrap;
        margin-left: 1.5rem;
    }

    .top-row a:first-child[b-cmpio3c6uf] {
        overflow: hidden;
        text-overflow: ellipsis;
    }

article[b-cmpio3c6uf] {
    background: var(--color-bg-surface);
}

[b-cmpio3c6uf] form {
    width: 100%;
    overflow-y: scroll;
}

@media (max-width: 640.98px) {
    .top-row:not(.auth)[b-cmpio3c6uf] {
        display: none;
    }

    .top-row.auth[b-cmpio3c6uf] {
        justify-content: space-between;
    }

    .top-row a[b-cmpio3c6uf], .top-row .btn-link[b-cmpio3c6uf] {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-cmpio3c6uf] {
        flex-direction: row;
    }

    .sidebar[b-cmpio3c6uf] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
        flex-shrink: 0;
        transition: width var(--ar-dur) var(--ar-ease);
    }


    .top-row[b-cmpio3c6uf] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row[b-cmpio3c6uf], article[b-cmpio3c6uf] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}


/* Sklopljen meni: samo ikone, samo na tabletu (MAS-38). */
@media (min-width: 641px) and (max-width: 1279.98px) {
    .sidebar-collapsed .sidebar[b-cmpio3c6uf] {
        width: 4.5rem;
    }

        .sidebar-collapsed .sidebar #copyright[b-cmpio3c6uf] {
            display: none;
        }
}

#user[b-cmpio3c6uf] {
    height: 100%;
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: 0 1em;
}

    #user div[b-cmpio3c6uf] {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: start;
    }

        #user div label[b-cmpio3c6uf] {
            font-family: var(--ar-font);
            font-weight: var(--ar-fw-medium);
            font-size: var(--ar-fs-md);
            color: var(--ar-text);
            line-height: 1.2;
            margin: 0;
        }

        #user div span[b-cmpio3c6uf] {
            font-family: var(--ar-font);
            font-size: var(--ar-fs-xs);
            color: var(--ar-text-muted);
            text-transform: capitalize;
        }

    #user img[b-cmpio3c6uf] {
        width: 2.25rem;
        height: 2.25rem;
        margin-right: var(--ar-space-3);
    }

#logout button[b-cmpio3c6uf] {
    height: var(--ar-h-sm);
    min-height: var(--ar-h-sm);
    font-size: var(--ar-fs-sm);
}