html, body { font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }

h1:focus { outline: none; }

#blazor-error-ui {
    background: #fff3cd; color: #5a4a00; bottom: 0; box-shadow: 0 -1px 2px rgba(0,0,0,.2);
    display: none; left: 0; padding: .6rem 1.25rem .7rem 1.25rem; position: fixed; width: 100%; z-index: 1000;
}
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: .75rem; top: .5rem; }

/* ---- RubberManager ---- */
.rm-appbar { border-bottom: 1px solid var(--mud-palette-lines-default); }
.rm-linkbtn { background: none; border: none; color: inherit; cursor: pointer; font: inherit; padding: 0; width: 100%; text-align: left; }

.rm-login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px; background: var(--mud-palette-background); }
.rm-field { display: flex; flex-direction: column; margin-bottom: 14px; }
.rm-field label { font-size: .8rem; margin-bottom: 4px; color: var(--mud-palette-text-secondary); }
.rm-input { padding: 10px 12px; border: 1px solid var(--mud-palette-lines-inputs); border-radius: 8px; background: var(--mud-palette-surface); color: var(--mud-palette-text-primary); font-size: 1rem; }
.rm-check { flex-direction: row; align-items: center; gap: 8px; }
.rm-submit { width: 100%; padding: 10px; border: none; border-radius: 8px; background: var(--mud-palette-primary); color: #fff; font-size: 1rem; cursor: pointer; margin-top: 6px; }
.rm-submit:hover { filter: brightness(1.06); }

.rm-tile { transition: box-shadow .15s, transform .15s; background: var(--mud-palette-surface); }
.rm-tile:hover { box-shadow: 0 4px 14px rgba(43, 123, 181, .25); transform: translateY(-1px); }
.rm-tile-link { display: block; color: inherit; }
.rm-tile-off { opacity: .55; background: var(--mud-palette-background-gray); }
.rm-tile-off:hover { box-shadow: none; transform: none; }

/* Vista tablet: bersagli di tocco grandi */
.rm-big-action { min-height: 96px; font-size: 1.25rem; border-radius: 14px; }
.rm-tablet-btn { padding: 12px 22px; border: 1px solid currentColor; border-radius: 10px; background: transparent; color: inherit; font-size: 1rem; cursor: pointer; }

/* ---- Stampe (scheda formula, scheda tecnica) ---- */
.print-page { background: #e9eef3; min-height: 100vh; padding: 16px; }
.print-toolbar { max-width: 210mm; margin: 0 auto 12px; display: flex; justify-content: space-between; }
.print-sheet { background: #fff; color: #000; max-width: 210mm; min-height: 297mm; margin: 0 auto; padding: 14mm 14mm; box-shadow: 0 2px 12px rgba(0,0,0,.15); font-size: 11pt; }
.sheet-header { display: flex; justify-content: space-between; align-items: flex-end; border-bottom: 2px solid #000; padding-bottom: 6px; margin-bottom: 12px; }
.sheet-company { font-weight: 600; font-size: 12pt; }
.sheet-title { font-weight: 700; font-size: 16pt; letter-spacing: .04em; }
.sheet-info, .sheet-table, .sheet-sign { width: 100%; border-collapse: collapse; margin-bottom: 14px; }
.sheet-info th, .sheet-info td, .sheet-table th, .sheet-table td, .sheet-sign th, .sheet-sign td { border: 1px solid #555; padding: 4px 8px; text-align: left; vertical-align: top; }
.sheet-info th, .sheet-sign th { background: #eef3f8; width: 18%; font-weight: 600; }
.sheet-table thead th { background: #eef3f8; font-weight: 600; }
.sheet-table tfoot td { font-weight: 700; background: #f6f9fc; }
.sheet-table .num { text-align: right; font-variant-numeric: tabular-nums; }
.sheet-table .check { text-align: center; width: 60px; }
.sheet-table tr.ko td { font-weight: 700; background: #fde8e8; }
.sheet-block { margin-bottom: 14px; }
.sheet-block-title { font-weight: 700; margin: 10px 0 4px; }
.sheet-pre { white-space: pre-wrap; border: 1px solid #555; padding: 8px; min-height: 40mm; }
.sheet-sign td { height: 18mm; }
.sheet-footer { font-size: 9pt; color: #555; text-align: right; }

@media print {
    @page { size: A4; margin: 0; }
    html, body { background: #fff !important; }
    .no-print { display: none !important; }
    .print-page { background: #fff; padding: 0; }
    .print-sheet { box-shadow: none; max-width: none; padding: 12mm; min-height: auto; }
}

/* ---- Barcode, etichette e vista tablet ---- */
.rm-barcode { display: block; max-width: 100%; }
.rm-label { width: 100mm; border: 1px solid #000; padding: 4mm; background: #fff; color: #000; page-break-inside: avoid; }
.rm-label .lot { font-size: 18pt; font-weight: 700; letter-spacing: .05em; text-align: center; }
.rm-label table { width: 100%; border-collapse: collapse; font-size: 10pt; margin-top: 2mm; }
.rm-label td { padding: 1px 0; vertical-align: top; }
.rm-label td:first-child { color: #444; width: 32%; }
.rm-tablet .mud-input-control > .mud-input-control-input-container > .mud-input { font-size: 1.25rem; }
.rm-tablet .mud-input-label { font-size: 1.05rem; }
.rm-tablet .rm-bigbtn { min-height: 64px; font-size: 1.15rem; border-radius: 12px; }
.rm-tablet .rm-scan input { font-size: 1.6rem; letter-spacing: .06em; }
.rm-press-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 8px; }
.rm-lowstock { color: var(--mud-palette-warning); font-weight: 600; }

/* ---- Tagliando di produzione e pagine di stampa multiple ---- */
.rm-slip { width: 95mm; border: 1px solid #000; padding: 3mm; background: #fff; color: #000; page-break-inside: avoid; margin: 0 4mm 4mm 0; display: inline-block; vertical-align: top; font-size: 10pt; }
.rm-slip table { width: 100%; border-collapse: collapse; font-size: 9.5pt; }
.rm-slip td { padding: 1px 0; vertical-align: top; }
.rm-slip td:first-child { color: #444; width: 24%; }
.rm-page-break { page-break-before: always; break-before: page; }
@media print { .rm-sheet-gap { display: none; } }
.rm-sheet-gap { height: 24px; }

/* ---- Gantt ---- */
.rm-gantt { border: 1px solid var(--mud-palette-lines-default); border-radius: 10px; background: var(--mud-palette-surface); overflow: hidden; }
.rm-gscroll { overflow: auto; max-height: calc(100vh - 330px); min-height: 280px; position: relative; }
.rm-gcanvas { position: relative; }
.rm-grow { display: flex; height: 38px; border-bottom: 1px solid var(--mud-palette-lines-default); }
.rm-grow.rm-drop-ok { background: rgba(124, 203, 181, .25); }
.rm-grow.rm-drop-no { background: rgba(235, 122, 122, .18); }
.rm-ghead { height: 30px; position: sticky; top: 0; z-index: 6; background: var(--mud-palette-background-gray); }
.rm-gsection { height: 26px; background: var(--mud-palette-background-gray); font-weight: 600; font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; color: var(--mud-palette-text-secondary); }
.rm-glabel { position: sticky; left: 0; z-index: 5; flex: 0 0 auto; display: flex; align-items: center; gap: 6px; background: var(--mud-palette-surface); border-right: 1px solid var(--mud-palette-lines-default); padding-right: 6px; overflow: hidden; cursor: default; }
.rm-gsection .rm-glabel, .rm-ghead .rm-glabel { background: var(--mud-palette-background-gray); padding-left: 12px; }
.rm-glabel-text { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .82rem; }
.rm-glabel-text small { color: var(--mud-palette-text-secondary); font-size: .7rem; overflow: hidden; text-overflow: ellipsis; }
.rm-gtoggle { cursor: pointer; width: 16px; height: 16px; line-height: 14px; text-align: center; border: 1px solid var(--mud-palette-lines-inputs); border-radius: 4px; font-size: .8rem; flex: 0 0 auto; user-select: none; }
.rm-galert { flex: 0 0 auto; margin-left: auto; width: 16px; height: 16px; border-radius: 50%; color: #fff; font-size: .7rem; font-weight: 700; text-align: center; line-height: 16px; }
.rm-track { position: relative; flex: 0 0 auto; height: 100%; }
.rm-track-off { background: repeating-linear-gradient(135deg, rgba(120, 140, 160, .20) 0 4px, rgba(120, 140, 160, .06) 4px 8px); }
.rm-avail { position: absolute; top: 0; bottom: 0; background: var(--mud-palette-surface); }
.rm-gridlines { position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(to right, var(--mud-palette-lines-default) 1px, transparent 1px); }
.rm-tick { position: absolute; top: 0; height: 100%; font-size: .68rem; color: var(--mud-palette-text-secondary); border-left: 1px solid var(--mud-palette-lines-default); padding: 7px 3px; box-sizing: border-box; overflow: hidden; white-space: nowrap; }
.rm-tick-m { border-left: 2px solid var(--mud-palette-primary); font-weight: 600; }
.rm-gstop { position: absolute; top: 3px; bottom: 3px; border-radius: 3px; z-index: 1; overflow: hidden; white-space: nowrap; font-size: .68rem; padding: 2px 4px; box-sizing: border-box; color: #7a3d00; border: 1px solid #d98a2b; background: repeating-linear-gradient(45deg, rgba(240, 165, 60, .55) 0 6px, rgba(240, 165, 60, .25) 6px 12px); }
.rm-tick-we { background: rgba(120, 140, 160, .12); }
.rm-gblock { position: absolute; top: 5px; height: 28px; border-radius: 6px; padding: 0 5px; font-size: .7rem; line-height: 28px; color: #1c2b3a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; box-shadow: 0 1px 2px rgba(0, 0, 0, .18); touch-action: none; user-select: none; z-index: 2; box-sizing: border-box; }
.rm-gblock[data-draggable="1"] { cursor: grab; }
.rm-locked { }   /* il blocco e' segnalato dal solo lucchetto: il bordo si confonde con la selezione */
.rm-lock { font-size: .62rem; margin-right: 2px; }
.rm-setup { background-image: repeating-linear-gradient(45deg, rgba(255, 255, 255, .55) 0 5px, transparent 5px 10px) !important; }
.rm-over { outline: 2px dashed #d94b4b; outline-offset: -2px; }
.rm-past { opacity: .5; filter: saturate(.6); }
.rm-sel { box-shadow: 0 0 0 3px rgba(43, 123, 181, .7); z-index: 3; }
.rm-gghost { opacity: .75; z-index: 8; border: 2px dashed #3b6f9a; box-shadow: none; }
.rm-gmarker { position: absolute; top: 0; bottom: 0; border-left: 3px solid #d94b4b; z-index: 4; }
.rm-gnow { position: absolute; top: 0; bottom: 0; width: 2px; background: var(--mud-palette-primary); z-index: 7; pointer-events: none; }

/* Respiro nelle schede a tab e nei dialoghi: PanelClass di MudTabs non applica il padding, lo si da' qui. */
.mud-tabs-panels { padding: 24px 28px 28px; }
.mud-tabs-panels .mud-grid-spacing-xs-2 > .mud-grid-item,
.mud-dialog-content .mud-grid-spacing-xs-2 > .mud-grid-item { padding-top: 16px; padding-left: 16px; }
.mud-tabs-panels .mud-grid-spacing-xs-2,
.mud-dialog-content .mud-grid-spacing-xs-2 { margin-top: -8px; }
.mud-dialog-content { padding-top: 8px !important; }

/* Colori per segno e per tipo: verde = positivo/libero, giallo = impegnato/attenzione, rosso = negativo/bloccato. */
.rm-pos { color: #2e9e6b; font-weight: 600; }
.rm-neg { color: var(--mud-palette-error, #d94b4b); font-weight: 600; }
.rm-warn { color: #b9770e; font-weight: 600; }
.rm-stockbar { display: flex; height: 12px; min-width: 120px; border-radius: 6px; overflow: hidden; background: var(--mud-palette-background-gray); }
.rm-stockbar-seg { height: 100%; }
.rm-stockbar-free { background: #6FCF97; }
.rm-stockbar-reserved { background: #F2C94C; }
.rm-stockbar-blocked { background: #EB7A7A; }
.rm-stockbar-empty { background: transparent; }

/* Calendario delle manutenzioni */
.rm-cal { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.rm-cal-head { text-align: center; font-size: .8rem; color: var(--mud-palette-text-secondary); padding: 4px 0; }
.rm-cal-cell { min-height: 104px; border: 1px solid var(--mud-palette-lines-default); border-radius: 8px; padding: 4px 6px; background: var(--mud-palette-surface); overflow: hidden; }
.rm-cal-other { opacity: .45; }
.rm-cal-today { border: 2px solid var(--mud-palette-primary); }
.rm-cal-num { font-size: .8rem; font-weight: 600; margin-bottom: 2px; }
.rm-cal-entry { font-size: .72rem; line-height: 1.25; border-radius: 4px; padding: 1px 5px; margin-bottom: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #1f2d3a; }
.rm-cal-more { font-size: .72rem; color: var(--mud-palette-text-secondary); cursor: default; }
.rm-cal-due { background: #F7E3A1; }
.rm-cal-late { background: #F2A7A7; }
.rm-cal-stop { background: #F4C7A8; }
.rm-cal-done { background: #A9E0C1; }
.rm-cal-fail { background: #E48A8A; }
.rm-cal-legend { font-size: .8rem; display: inline-flex; align-items: center; gap: 4px; }
.rm-cal-dot { display: inline-block; width: 12px; height: 12px; border-radius: 3px; }

/* Schema ad albero del ciclo di lavoro */
.rm-flow-scroll { overflow: auto; padding: 16px; border: 1px solid var(--mud-palette-lines-default); border-radius: 10px; background: var(--mud-palette-background-gray); }
.rm-flow { position: relative; }
.rm-flow-edges { position: absolute; left: 0; top: 0; pointer-events: none; }
.rm-flow-node { position: absolute; box-sizing: border-box; background: var(--mud-palette-surface); border: 2px solid #C3D5E4; border-radius: 12px; padding: 8px 10px; overflow: hidden; }
.rm-flow-head { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; white-space: nowrap; }
.rm-flow-head b { overflow: hidden; text-overflow: ellipsis; }
.rm-flow-seq { flex: none; width: 24px; height: 24px; border-radius: 50%; background: #2B7BB5; color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: .8rem; font-weight: 700; }
.rm-flow-mat { display: flex; align-items: center; gap: 6px; height: 24px; font-size: .82rem; white-space: nowrap; }
.rm-flow-code { font-weight: 600; overflow: hidden; text-overflow: ellipsis; }
.rm-flow-qty { margin-left: auto; color: var(--mud-palette-text-secondary); }
.rm-flow-assembly { color: #7a5ab8; font-style: italic; }
.rm-flow-out { margin-top: 4px; font-size: .82rem; font-weight: 600; color: #3b6f9a; }
.rm-flow-dot { display: inline-block; flex: none; width: 10px; height: 10px; border-radius: 50%; }
.rm-flow-mescola { background: #7FB5E0; }
.rm-flow-inserto { background: #B9A7E5; }
.rm-flow-ingrediente { background: #F2C94C; }
.rm-flow-imballo { background: #C3D5E4; border: 1px solid #8aa4bb; }
.rm-flow-altro { background: #B0B7BF; }
.rm-flow-label { position: absolute; width: 100px; text-align: center; font-size: .75rem; font-weight: 600; color: #3b6f9a; background: var(--mud-palette-background-gray); border-radius: 6px; padding: 1px 2px; }
.rm-flow-merge { border-color: #B9A7E5; }
.rm-flow-done { border-color: #6FCF97; background: #EFFAF3; }
.rm-flow-done .rm-flow-seq { background: #3fae72; }
.rm-flow-active { border-color: #2B7BB5; box-shadow: 0 0 0 3px rgba(43, 123, 181, .35); }
.rm-flow-badge { margin-left: auto; font-size: .7rem; background: #2B7BB5; color: #fff; border-radius: 8px; padding: 1px 7px; }
.rm-flow-sel { box-shadow: 0 0 0 3px rgba(244, 179, 147, .8); }
.rm-flow-end { display: flex; align-items: center; justify-content: center; border-style: dashed; border-color: #3b6f9a; text-align: center; }
.rm-flow-legend { display: flex; gap: 16px; flex-wrap: wrap; font-size: .8rem; color: var(--mud-palette-text-secondary); }
.rm-flow-legend span { display: inline-flex; align-items: center; gap: 5px; }

/* Scheda "Ciclo e distinta": fasi compatte con i materiali come sottorighe */
.rm-phasecard { padding: 10px 14px; }
.rm-phasecard-head { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 14px; }
.rm-phasecard-flow { margin-top: 4px; }
.rm-phasecard-materials { margin-top: 8px; padding: 6px 0 0 36px; border-top: 1px dashed var(--mud-palette-lines-default); }
.rm-matrow { display: flex; align-items: center; gap: 12px; min-height: 40px; }
.rm-matkind { width: 100px; justify-content: center; }
.rm-matcode { font-weight: 600; min-width: 130px; }
.rm-matdesc { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rm-matunit { width: 90px; color: var(--mud-palette-text-secondary); font-size: .85rem; }
.rm-flow-mescola-chip { background: #D6E8F7 !important; }
.rm-flow-inserto-chip { background: #E3DCF5 !important; }
.rm-flow-ingrediente-chip { background: #FAEBB6 !important; }
.rm-flow-imballo-chip { background: #DDE6EE !important; }
.rm-flow-altro-chip { background: #E3E6EA !important; }
.rm-pick-row { display: flex; align-items: center; gap: 10px; padding: 8px 12px; cursor: pointer; border-bottom: 1px solid var(--mud-palette-lines-default); }
.rm-pick-row:hover { background: var(--mud-palette-action-default-hover, rgba(91,168,220,.12)); }
.rm-pick-kind { width: 100px; justify-content: center; }

/* Scheduler: linee tra i segmenti dello stesso ordine, blocchi attenuati nel focus */
.rm-glink { position: absolute; top: 19px; height: 0; border-top: 2px dotted #6c8ba6; z-index: 1; pointer-events: none; }
.rm-gblock.rm-dim { opacity: .28; filter: saturate(.5); }
.rm-gblock { z-index: 2; }
.rm-seg-row { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
.rm-seg-row .mud-input-control { margin-top: 0; }
.rm-filter-cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.rm-filter-list { max-height: 320px; overflow: auto; border: 1px solid var(--mud-palette-lines-default); border-radius: 8px; padding: 4px 8px; }
.rm-share-sel { background: rgba(43, 123, 181, .12); }
@media (max-width: 900px) { .rm-filter-cols { grid-template-columns: 1fr 1fr; } }

.rm-gblock.rm-hl { outline: 2px solid #E8833A; outline-offset: 0; z-index: 3; }
.rm-grow.rm-rowhl { background: rgba(232, 131, 58, .13); }
.rm-grow.rm-rowhl .rm-glabel { background: #FCEBDD; }
.rm-gpast-tag { display: inline-block; margin-left: 6px; padding: 0 6px; border-radius: 8px; background: #C9D3DC; color: #3b4a58; font-size: .66rem; font-weight: 600; vertical-align: middle; }

/* ---- statistiche ---- */
.rm-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; margin-bottom: 8px; }
.rm-kpi { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 12px; background: var(--mud-palette-surface); border: 1px solid var(--mud-palette-lines-default); border-left: 5px solid var(--kpi, #4A90C8); }
.rm-kpi .mud-icon-root { font-size: 2rem; color: var(--kpi, #4A90C8); }
.rm-kpi span { display: block; font-size: .72rem; color: var(--mud-palette-text-secondary); text-transform: uppercase; letter-spacing: .03em; }
.rm-kpi b { font-size: 1.45rem; line-height: 1.2; }
.rm-kpi b small { font-size: .72rem; font-weight: 500; color: var(--mud-palette-text-secondary); margin-left: 4px; }
.rm-statsec { margin: 22px 0 10px; font-weight: 600; }
.rm-chartcard { border-radius: 12px; height: 100%; }
.rm-livechip { font-size: .72rem; padding: 2px 9px; border-radius: 999px; color: #1c2b3a; background: color-mix(in srgb, var(--c) 28%, transparent); border: 1px solid var(--c); }

.rm-share-row { cursor: pointer; }
.rm-share-row:hover { background: rgba(43, 123, 181, .08); }

.rm-legend { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 4px; font-size: .75rem; }
.rm-legend span { display: inline-flex; align-items: center; gap: 5px; }
.rm-lg { display: inline-block; width: 26px; height: 14px; border-radius: 3px; box-sizing: border-box; border: 1px solid var(--mud-palette-lines-default); font-style: normal; font-size: .6rem; line-height: 12px; text-align: center; }
.rm-lg-block { background: #bcd9ee; border-color: transparent; }
.rm-lg-now { width: 2px; height: 16px; border: 0; background: var(--mud-palette-primary); }
.rm-lg-due { width: 0; height: 16px; border: 0; border-left: 3px solid #d94b4b; }
.rm-lg-link { height: 0; border: 0; border-top: 2px dotted #6c8ba6; }


.rm-phase-mats { display: grid; gap: 4px; margin: 2px 0 4px; }
.rm-phase-qty { float: right; font-weight: 600; }

/* ---- Marchio ---- */
.rm-brand { display: inline-flex; align-items: center; gap: 10px; margin-left: 8px; text-decoration: none; color: inherit; }
.rm-brand-mark { width: 34px; height: 34px; }
.rm-brand-name { font-size: 1.35rem; font-weight: 700; letter-spacing: .02em; color: var(--mud-palette-primary); }
.rm-brand-sep { width: 1px; height: 28px; background: var(--mud-palette-lines-inputs); }
.rm-brand-client { height: 40px; background: #fff; border-radius: 6px; padding: 2px 6px; }

/* ---- Cruscotto: icone e titoli piu' leggibili ---- */
.rm-tile .mud-avatar { border-width: 2px; background: var(--mud-palette-background-gray); }
.rm-tile .mud-avatar .mud-icon-root { color: var(--mud-palette-primary); }
.rm-tile .mud-typography-subtitle1 { font-weight: 600; }
.rm-tile-off .mud-avatar .mud-icon-root { color: var(--mud-palette-text-secondary); }