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

a, .btn-link {
    color: #006bb7;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

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

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

/* ── App-wide table ergonomics (Maruti 2026-07-07) ────────────────────────────
   Wide/tall tables were hard to use: the horizontal scrollbar sat at the very
   bottom of a long table (scroll all the way down to move left↔right) and the
   header scrolled out of view. Cap every MudTable / MudDataGrid scroll body at
   70vh and pin its header, so:
     • the header stays visible while scrolling rows,
     • horizontal scroll lives in a bounded viewport that's always reachable.
   max-height (not height) means short tables stay short — no empty boxes. */
.mud-table-container {
    max-height: 70vh;
    overflow: auto;
}

/* Pin the header row. Opaque background so scrolled rows don't show through. */
.mud-table-container table thead th {
    position: sticky;
    top: 0;
    z-index: 3;
    background-color: var(--mud-palette-surface);
}

/* Raw (non-Mud) tables use a .table-scroll wrapper for the same behaviour. */
.table-scroll {
    max-height: 70vh;
    overflow: auto;
}

.table-scroll table thead th {
    position: sticky;
    top: 0;
    z-index: 3;
    background-color: var(--mud-palette-surface, #fff);
}

/* ── App-wide UI scale (Maruti 2026-07-30) ────────────────────────────────────
   The floor and office machines are 1366x768 at 100% Windows scaling, and the
   MudTheme sets only a font FAMILY (MainLayout.razor ~line 93) — no sizes — so
   everything rendered at MudBlazor's stock desktop sizing. Combined with
   Dense="true" on ~2,200 components, input boxes and table cells were too small
   to read or check comfortably.

   MudBlazor sizes almost everything in rem, so moving the ROOT font size scales
   text, control heights and padding together — one lever instead of touching
   thousands of components. 16px -> 18px is +12.5%.

   Deliberately the root and not `zoom`/`transform: scale()`: those blur text and
   break MudBlazor's popover positioning (pickers and menus land in the wrong
   place). Anything already sized in vh/vw or px — the 70vh table cap above,
   sticky headers — is unaffected by design. */
html {
    font-size: 18px;
}

/* Dense tables get their padding back. Dense="true" squeezes cells to ~4px,
   which at this scale reads as one solid block of digits; 8px/12px separates
   rows and columns without costing a meaningful number of visible rows. */
.mud-table-cell {
    padding: 8px 12px;
}

/* Give text inputs, selects and pickers a real touch/read target. Set on the
   control (not the inner input) so the label and adornments move with it. */
.mud-input-control {
    min-height: 2.6rem;
}

/* Guard the two things a larger root font can break on a 1366px-wide screen:
   dialogs must never exceed the viewport, and the page itself must never scroll
   sideways — wide content scrolls inside its own bounded container instead. */
.mud-dialog {
    max-width: 96vw;
}

body {
    overflow-x: hidden;
}

/* The sidebar is the one place the larger root font hurt rather than helped: at
   MudBlazor's stock 240px drawer, labels like "Production Progress" and
   "Warehouse (Godown)" wrapped onto two lines, so fewer screens fit in the list.
   Give the drawer 30px more and hold the nav labels just under body size — the
   menu is scanned, not read, so it does not need the full bump that the data
   screens do. Net effect: labels on one line AND more items visible than before. */
/* Note the exact variable name: MudBlazor reads --mud-drawer-width-left (declared
   on html), NOT --mud-drawer-width. Setting it at the root also moves the main
   content's left margin, so the drawer and content stay in step. */
/* !important is required, not lazy: MudThemeProvider injects its own html{...}
   block at runtime, AFTER this stylesheet, so an equal-specificity rule loses on
   source order. */
:root {
    --mud-drawer-width-left: 270px !important;
}

.mud-nav-link {
    font-size: 0.95rem;
    padding-top: 0.45rem;
    padding-bottom: 0.45rem;
}
/* ── Every table reads centred (Maruti 2026-08-28) ────────────────────────────
   "whenever you see tables try to align centrally for table data and headers do
   this for all tables".

   The screens had drifted: 1,838 inline text-align declarations written screen by
   screen, so a centred heading sat over a left-aligned field on one page and a
   right-aligned figure on the next. Nothing made the inconsistency visible except
   looking at two screens side by side.

   One rule instead of editing ~290 tables. !important is required, not lazy:
   those 1,838 declarations are INLINE, and an inline style beats any stylesheet
   selector however specific — without it this rule would only reach the tables
   that never set an alignment, which is the half-done result that looks like a
   bug.

   PRINTED DOCUMENTS ARE EXCLUDED. Invoices, challans, gate passes and vouchers
   follow fixed PEX paper layouts where a right-aligned amount column and a
   left-aligned description are part of the form. The :has() test is on the whole
   page rather than the table, because a print page IS its document — anything
   else on it (the filter bar above a report) belongs to the same sheet. */
body:not(:has(.print-container)) th,
body:not(:has(.print-container)) td {
    text-align: center !important;
}

/* Cells that hold a control rather than a value: the control fills its cell, so
   centring the text has to happen inside it. MudBlazor's inputs are flex rows, so
   this is the input's own alignment, not the cell's. */
body:not(:has(.print-container)) td .mud-input-slot,
body:not(:has(.print-container)) td input.mud-input-root {
    text-align: center;
}