/* ===== NextERP — Production & Stock Ledger (Phase 31) ===== Same rules as maintenance.css: - no new colours: every value is a var() from app.css's :root, so dark mode follows the theme with no extra rules; - logical properties for layout; the custom select chevron has the one direction-specific position needed to mirror in Arabic and Kurdish; - everything prefixed pr- so nothing here can restyle another module. */ #prodScreen{ padding:0 22px 24px; flex:1; min-height:0; overflow-y:auto; } /* ---------- toolbar, tabs ---------- */ .pr-toolbar{ display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; padding:16px 0 10px; } .pr-toolbar-left, .pr-toolbar-right{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; min-width:0; } .pr-title{ font-family:'Oswald',sans-serif; font-size:19px; font-weight:600; text-transform:uppercase; letter-spacing:0.4px; color:var(--ink); } .pr-dept{ display:flex; align-items:center; gap:8px; } .pr-dept label{ font-size:12px; font-weight:700; color:var(--ink-soft); } .pr-dept select{ min-width:220px; max-width:100%; font-weight:600; } /* ---------- shared production controls ---------- Production dialogs are appended to , outside #prodScreen, so both roots are listed. Keeping the classes on the controls themselves prevents renderer location from deciding whether a field looks finished. */ #prodScreen input.form-control, #prodScreen textarea.form-control, #prodScreen select.form-select, .pr-overlay input.form-control, .pr-overlay textarea.form-control, .pr-overlay select.form-select{ box-sizing:border-box; min-width:0; max-width:100%; border:1px solid var(--panel-edge); border-radius:8px; padding:8px 10px; font:13px 'Inter',sans-serif; line-height:1.35; color:var(--ink); background-color:var(--panel); transition:border-color .14s ease, box-shadow .14s ease, background-color .14s ease, opacity .14s ease; } #prodScreen textarea.form-control, .pr-overlay textarea.form-control{ width:100%; resize:vertical; min-height:64px; } #prodScreen input.form-control::placeholder, .pr-overlay input.form-control::placeholder{ color:var(--ink-soft); opacity:.8; } #prodScreen input.form-control[type=number], .pr-overlay input.form-control[type=number]{ -moz-appearance:textfield; } #prodScreen input.form-control[type=number]::-webkit-inner-spin-button, #prodScreen input.form-control[type=number]::-webkit-outer-spin-button, .pr-overlay input.form-control[type=number]::-webkit-inner-spin-button, .pr-overlay input.form-control[type=number]::-webkit-outer-spin-button{ -webkit-appearance:none; margin:0; } #prodScreen input.form-control:is([type=date], [type=datetime-local], [type=time])::-webkit-calendar-picker-indicator, .pr-overlay input.form-control:is([type=date], [type=datetime-local], [type=time])::-webkit-calendar-picker-indicator{ cursor:pointer; opacity:.6; } #prodScreen input.form-control:is([type=date], [type=datetime-local], [type=time]):hover::-webkit-calendar-picker-indicator, .pr-overlay input.form-control:is([type=date], [type=datetime-local], [type=time]):hover::-webkit-calendar-picker-indicator{ opacity:1; } [data-theme="dark"] #prodScreen input.form-control:is([type=date], [type=datetime-local], [type=time])::-webkit-calendar-picker-indicator, [data-theme="dark"] .pr-overlay input.form-control:is([type=date], [type=datetime-local], [type=time])::-webkit-calendar-picker-indicator{ filter:invert(1); } #prodScreen select.form-select, .pr-overlay select.form-select{ appearance:none; -webkit-appearance:none; cursor:pointer; padding-inline-end:32px; background-image:linear-gradient(45deg, transparent 50%, var(--ink-soft) 50%), linear-gradient(135deg, var(--ink-soft) 50%, transparent 50%); background-position:calc(100% - 15px) 50%, calc(100% - 10px) 50%; background-size:5px 5px, 5px 5px; background-repeat:no-repeat; } [dir="rtl"] #prodScreen select.form-select, [dir="rtl"] .pr-overlay select.form-select{ background-position:15px 50%, 10px 50%; } #prodScreen :is(input.form-control, textarea.form-control, select.form-select):hover:not(:disabled), .pr-overlay :is(input.form-control, textarea.form-control, select.form-select):hover:not(:disabled){ border-color:var(--steel); } #prodScreen :is(input.form-control, textarea.form-control, select.form-select):active:not(:disabled), .pr-overlay :is(input.form-control, textarea.form-control, select.form-select):active:not(:disabled){ border-color:var(--accent); } #prodScreen :is(input.form-control, textarea.form-control, select.form-select):focus, .pr-overlay :is(input.form-control, textarea.form-control, select.form-select):focus{ outline:2px solid var(--accent); outline-offset:1px; border-color:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent); } #prodScreen :is(input.form-control, textarea.form-control, select.form-select):disabled, .pr-overlay :is(input.form-control, textarea.form-control, select.form-select):disabled{ cursor:not-allowed; color:var(--ink-soft); background-color:var(--bg); opacity:.72; } #prodScreen input.form-check-input, .pr-overlay input.form-check-input{ inline-size:16px; block-size:16px; flex:0 0 auto; margin:0; accent-color:var(--accent); cursor:pointer; } #prodScreen input.form-check-input:focus-visible, .pr-overlay input.form-check-input:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; } #prodScreen input.form-check-input:disabled, .pr-overlay input.form-check-input:disabled{ cursor:not-allowed; opacity:.6; } .pr-tabs{ display:flex; gap:4px; flex-wrap:wrap; border-bottom:1px solid var(--panel-edge); margin-bottom:16px; } .pr-tab.btn{ border:0; border-radius:0; background:transparent; color:var(--ink-soft); font:600 13px 'Inter',sans-serif; padding:10px 12px; border-bottom:2px solid transparent; margin-bottom:-1px; cursor:pointer; display:inline-flex; align-items:center; gap:6px; } .pr-tab:hover{ color:var(--ink); filter:none; } .pr-tab.active{ color:var(--accent); border-bottom-color:var(--accent); } .pr-tab:active:not(:disabled){ color:var(--accent); transform:none; } .pr-tab:focus-visible{ outline:2px solid var(--accent); outline-offset:-2px; } .pr-badge{ background:var(--danger); color:#fff; border-radius:999px; font-size:11px; padding:1px 7px; line-height:1.5; } .pr-banner{ background:var(--amber-note); border:1px solid var(--amber-note-edge); color:var(--amber-note-text); border-radius:var(--radius); padding:10px 14px; margin-bottom:14px; font-size:13px; } /* ---------- generic blocks ---------- */ .pr-h3{ font-family:'Oswald',sans-serif; font-size:14px; font-weight:600; text-transform:uppercase; letter-spacing:0.3px; color:var(--ink); margin:18px 0 8px; } .pr-section-head{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:10px; } .pr-section-head .pr-h3{ margin-block:10px; } .pr-spacer{ flex:1 1 auto; } .pr-muted{ color:var(--ink-soft); font-size:12.5px; } .pr-mono{ font-family:'JetBrains Mono',monospace; font-size:12.5px; } .pr-p{ margin:0; line-height:1.55; color:var(--ink); } .pr-nowrap{ white-space:nowrap; } .pr-empty{ padding:28px 16px; text-align:center; color:var(--ink-soft); background:var(--surface-soft); border:1px dashed var(--panel-edge); border-radius:var(--radius); font-size:13px; } .pr-error{ background:var(--error-bg); border:1px solid var(--pill-red-border); color:var(--danger); border-radius:10px; padding:10px 12px; font-size:13px; margin-top:8px; } .pr-warn{ background:var(--pill-yellow-bg); border:1px solid var(--pill-yellow-border); color:var(--pill-yellow-text); border-radius:10px; padding:9px 12px; font-size:13px; margin-top:8px; } .pr-ok{ background:var(--pill-green-bg); border:1px solid var(--pill-green-border); color:var(--pill-green-text); border-radius:10px; padding:9px 12px; font-size:13px; margin-top:8px; } .pr-note{ background:var(--surface-soft); border:1px solid var(--panel-edge); border-radius:10px; padding:9px 12px; font-size:13px; margin-top:8px; color:var(--ink); } .pr-hint{ background:var(--pill-blue-soft-bg); border:1px solid var(--pill-blue-soft-border); color:var(--pill-blue-soft-text); border-radius:10px; padding:9px 12px; font-size:12.5px; margin-top:8px; } .pr-warn-text{ color:var(--rust); font-weight:600; } .pr-bad{ color:var(--danger) !important; font-weight:700; } .pr-neg{ color:var(--danger); } .pr-pos{ color:var(--patina); } .pr-flag{ color:var(--rust); font-size:12px; font-weight:700; } .pr-tag{ font-size:11px; border:1px solid var(--panel-edge); border-radius:6px; padding:0 5px; color:var(--ink-soft); } .pr-more{ text-align:center; margin-top:12px; } .pr-check{ display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:500; cursor:pointer; } /* ---------- filters, segmented control ---------- */ .pr-filters{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:12px; } .pr-filters input[type=search]{ min-width:220px; } .pr-inline-label{ font-size:12px; font-weight:700; color:var(--ink-soft); } .pr-heat-search{ font-family:'JetBrains Mono',monospace !important; min-width:180px; } .pr-seg{ display:inline-flex; border:1px solid var(--panel-edge); border-radius:11px; overflow:hidden; margin-bottom:12px; flex-wrap:wrap; } .pr-seg-btn.btn{ border:0; border-radius:0; background:var(--panel); color:var(--ink-soft); font:600 12.5px 'Inter',sans-serif; padding:8px 14px; cursor:pointer; border-inline-end:1px solid var(--panel-edge); } .pr-seg-btn:last-child{ border-inline-end:0; } .pr-seg-btn:hover:not(.active):not(:disabled):not([aria-disabled="true"]){ background:var(--surface-hover); color:var(--ink); filter:none; } .pr-seg-btn.active{ background:var(--accent); color:#fff; } .pr-seg-btn:active:not(:disabled){ transform:none; } .pr-seg-btn:focus-visible{ z-index:1; outline:2px solid var(--accent); outline-offset:-2px; } /* ---------- tables ---------- */ .pr-table-wrap{ overflow-x:auto; border:1px solid var(--panel-edge); border-radius:var(--radius); background:var(--panel); } .pr-table{ width:100%; border-collapse:collapse; font-size:13px; } .pr-table th{ text-align:start; font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:0.3px; color:var(--ink-soft); background:var(--surface-soft); padding:8px 9px; border-bottom:1px solid var(--panel-edge); white-space:nowrap; } .pr-table td{ padding:7px 9px; border-bottom:1px solid var(--panel-edge); vertical-align:middle; color:var(--ink); transition:background-color .12s ease; } .pr-table tbody tr:nth-child(even):not(.pr-total) td{ background:var(--surface-soft); } .pr-table tbody tr:hover td{ background:var(--surface-hover); } .pr-table tbody tr:last-child td{ border-bottom:0; } .pr-table th.pr-num, .pr-table td.pr-num{ text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; } .pr-row-link{ cursor:pointer; } .pr-total td{ background:var(--surface-soft); font-weight:600; } .pr-change{ max-width:420px; overflow-wrap:anywhere; } .pr-change-flow{ display:flex; align-items:center; gap:5px; flex-wrap:wrap; min-width:190px; } .pr-change-field{ display:inline-flex; align-items:center; border:1px solid var(--panel-edge); border-radius:6px; padding:2px 6px; background:var(--surface-soft); color:var(--ink-soft); font:600 11px 'JetBrains Mono',monospace; } .pr-change-values{ display:inline-flex; align-items:center; gap:4px; flex-wrap:wrap; } .pr-change-chip{ display:inline-flex; align-items:center; gap:4px; max-width:240px; border:1px solid var(--pill-gray-border); border-radius:999px; padding:2px 7px; background:var(--pill-gray-bg); color:var(--pill-gray-text); font-size:11.5px; line-height:1.35; } .pr-change-chip-key{ color:var(--ink-soft); font-size:10.5px; text-transform:capitalize; } .pr-change-chip b{ color:inherit; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .pr-change-empty{ font-style:italic; opacity:.75; } .pr-change-more{ font-size:11px; color:var(--ink-soft); } .pr-change-arrow{ color:var(--ink-soft); font-weight:700; } .pr-old{ opacity:.72; } .pr-new .pr-change-chip{ background:var(--pill-blue-soft-bg); border-color:var(--pill-blue-soft-border); color:var(--pill-blue-soft-text); } .pr-prov{ color:var(--ink-soft); font-style:italic; } .pr-next{ color:var(--accent); font-weight:600; white-space:nowrap; } .pr-threshold-chips{ display:flex; align-items:center; gap:5px; flex-wrap:wrap; min-width:250px; } .pr-threshold-chip{ display:inline-flex; align-items:baseline; gap:4px; border:1px solid var(--panel-edge); border-radius:999px; padding:3px 7px; background:var(--surface-soft); color:var(--ink-soft); font-size:11px; white-space:nowrap; } .pr-threshold-chip b{ color:var(--ink); font-size:11.5px; font-variant-numeric:tabular-nums; } /* ---------- pills ---------- */ .pr-pill{ display:inline-block; font-size:11.5px; font-weight:600; border-radius:999px; padding:2px 9px; border:1px solid var(--pill-gray-border); background:var(--pill-gray-bg); color:var(--pill-gray-text); white-space:nowrap; } .pr-st-draft, .pr-rs-at_cnc, .pr-ps-available, .pr-pk-hour{ background:var(--pill-blue-soft-bg); color:var(--pill-blue-soft-text); border-color:var(--pill-blue-soft-border); } .pr-st-verified, .pr-tr-awaiting_receipt, .pr-sod-two_person, .pr-pk-shift{ background:var(--pill-yellow-bg); color:var(--pill-yellow-text); border-color:var(--pill-yellow-border); } .pr-st-approved, .pr-tr-received, .pr-rs-in_use, .pr-ps-active, .pr-al-acknowledged, .pr-lr-good, .pr-lr-in{ background:var(--pill-green-bg); color:var(--pill-green-text); border-color:var(--pill-green-border); } .pr-st-rejected, .pr-tr-disputed, .pr-rs-scrapped, .pr-ps-worn, .pr-al-open, .pr-lr-defect, .pr-sod-single{ background:var(--pill-red-bg); color:var(--pill-red-text); border-color:var(--pill-red-border); } .pr-st-cancelled, .pr-ps-retired, .pr-lr-scale, .pr-lr-out{ background:var(--pill-gray-bg); color:var(--pill-gray-text); border-color:var(--pill-gray-border); } .pr-rs-in_stock, .pr-sod-strict, .pr-pk-day{ background:var(--pill-blue-bg); color:var(--pill-blue-text); border-color:var(--pill-blue-border); } /* ---------- dashboard ---------- */ .pr-dash-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:12px; } .pr-cards{ display:grid; grid-template-columns:repeat(auto-fill, minmax(170px, 1fr)); gap:10px; } .pr-card.btn{ text-align:start; justify-content:flex-start; align-items:stretch; border:1px solid var(--panel-edge); background:var(--panel); color:var(--ink); border-radius:var(--radius); padding:14px 16px; cursor:pointer; display:flex; flex-direction:column; gap:4px; box-shadow:var(--shadow); font-family:'Inter',sans-serif; } .pr-card:hover{ background:var(--surface-hover); filter:none; } .pr-card:active:not(:disabled){ background:var(--bg); } .pr-card-n{ font-family:'Oswald',sans-serif; font-size:28px; font-weight:600; color:var(--ink); line-height:1; } .pr-card-l{ font-size:12.5px; color:var(--ink-soft); font-weight:600; } .pr-card-hot{ border-inline-start:4px solid var(--rust); } .pr-metrics{ display:grid; grid-template-columns:repeat(auto-fill, minmax(130px, 1fr)); gap:8px; } .pr-metric{ border:1px solid var(--panel-edge); border-radius:10px; padding:10px 12px; background:var(--panel); display:flex; flex-direction:column; gap:3px; } .pr-metric span{ font-size:11.5px; color:var(--ink-soft); font-weight:600; text-transform:uppercase; letter-spacing:0.3px; } .pr-metric b{ font-size:16px; font-variant-numeric:tabular-nums; color:var(--ink); } .pr-metric.pr-bad{ border-color:var(--pill-red-border); background:var(--pill-red-bg); } .pr-metric.pr-bad b{ color:var(--danger); } .pr-thresholds{ margin-top:8px; } /* ---------- modals ---------- */ .pr-modal.pr-modal-lg{ max-width:760px; } .pr-modal.pr-modal-xl{ max-width:1180px; } .pr-foot-left, .pr-foot-right{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; } .pr-foot-right{ margin-inline-start:auto; } .pr-delete-options{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:12px; margin-top:14px; } .pr-delete-option{ border:1px solid var(--panel-edge); border-radius:12px; padding:14px; background:var(--surface-soft); } .pr-delete-option h3{ margin:0 0 6px; color:var(--ink); font-size:15px; } .pr-delete-option p{ margin:0 0 12px; color:var(--ink-soft); font-size:13px; line-height:1.5; } .pr-delete-freeze{ border-color:var(--accent); } .pr-delete-purge{ border-color:var(--pill-red-border); background:var(--error-bg); } .pr-delete-purge h3{ color:var(--danger); } .pr-kv{ display:grid; grid-template-columns:repeat(auto-fill, minmax(160px, 1fr)); gap:8px 16px; } .pr-kv > div{ display:flex; flex-direction:column; gap:2px; min-width:0; } .pr-kv span{ font-size:11.5px; color:var(--ink-soft); font-weight:600; } .pr-kv b{ font-size:13.5px; color:var(--ink); overflow-wrap:anywhere; } .pr-doc-head{ display:flex; flex-direction:column; gap:10px; } .pr-transfer{ display:flex; flex-wrap:wrap; gap:6px 16px; align-items:center; margin-top:8px; padding:9px 12px; border:1px solid var(--panel-edge); border-radius:10px; background:var(--surface-soft); font-size:13px; } .pr-people{ display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:4px 16px; margin-top:12px; font-size:13px; } .pr-details{ margin-top:12px; } .pr-details summary{ cursor:pointer; font-weight:700; font-size:13px; color:var(--ink); padding:6px 0; } .pr-history{ list-style:none; margin:6px 0 0; padding:0; display:flex; flex-direction:column; gap:8px; border-inline-start:2px solid var(--panel-edge); padding-inline-start:12px; } .pr-history-head{ display:flex; gap:8px; flex-wrap:wrap; align-items:baseline; font-size:13px; } .pr-history-change{ font-size:12.5px; overflow-wrap:anywhere; } .pr-history-reason{ font-size:12.5px; color:var(--ink); font-style:italic; } /* document type chooser */ .pr-type-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:10px; } .pr-type.btn{ text-align:start; justify-content:flex-start; align-items:stretch; border:1px solid var(--panel-edge); background:var(--panel); border-radius:var(--radius); padding:14px; display:flex; flex-direction:column; gap:6px; cursor:pointer; font-family:'Inter',sans-serif; color:var(--ink); } .pr-type:hover{ border-color:var(--accent); background:var(--surface-hover); filter:none; } .pr-type:active:not(:disabled){ background:var(--bg); } .pr-type span{ font-size:12.5px; color:var(--ink-soft); line-height:1.45; } /* editor */ .pr-edit-lines td{ padding:5px 6px; } .pr-edit-lines input.form-control, .pr-edit-lines select.form-select{ padding:6px 8px; } .pr-edit-lines input[type=datetime-local]{ min-width:170px; } .pr-item-sel{ min-width:190px; } .pr-heat-in{ font-family:'JetBrains Mono',monospace !important; width:110px; } .pr-num-in{ width:110px; text-align:right; font-variant-numeric:tabular-nums; } .pr-w-cur{ width:72px !important; text-transform:uppercase; } .pr-w-sm{ width:70px !important; } .pr-line-actions{ display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; } .pr-period-row{ align-items:flex-end; } .pr-field-btn{ flex:0 0 auto !important; } .pr-rm{ color:var(--danger); } /* ---------- heat trace ---------- */ .pr-timeline{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; } .pr-timeline li{ display:grid; grid-template-columns:150px 1fr; gap:12px; padding:10px 12px; border:1px solid var(--panel-edge); border-radius:10px; background:var(--panel); border-inline-start:4px solid var(--steel); } .pr-timeline li.pr-tl-good{ border-inline-start-color:var(--patina); } .pr-timeline li.pr-tl-defect{ border-inline-start-color:var(--danger); } .pr-timeline li.pr-tl-out{ border-inline-start-color:var(--rust); } .pr-tl-date{ font-size:12.5px; color:var(--ink-soft); font-variant-numeric:tabular-nums; } .pr-tl-body{ display:flex; flex-direction:column; gap:3px; font-size:13px; } /* ---------- reports ---------- */ .pr-bar-cell{ width:22%; min-width:90px; } .pr-bar{ height:8px; background:var(--surface-soft); border-radius:999px; overflow:hidden; border:1px solid var(--panel-edge); } .pr-bar span{ display:block; height:100%; background:var(--patina); border-radius:inherit; } .pr-bar.pr-bar-bad span{ background:var(--danger); } .pr-roll-block{ margin-bottom:16px; } .pr-roll-head{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:6px; } /* ---------- alerts ---------- */ .pr-alerts{ display:flex; flex-direction:column; gap:8px; } .pr-alert{ display:flex; align-items:center; gap:12px; justify-content:space-between; padding:12px 14px; border:1px solid var(--panel-edge); border-radius:var(--radius); background:var(--panel); border-inline-start:4px solid var(--slate); } .pr-alert-open{ border-inline-start-color:var(--danger); } .pr-alert-main{ display:flex; flex-direction:column; gap:4px; min-width:0; } .pr-alert-title{ display:flex; gap:6px; align-items:center; flex-wrap:wrap; } .pr-alert-value{ font-family:'Oswald',sans-serif; font-size:18px; color:var(--ink); } /* ---------- rolls, stands ---------- */ .pr-stands{ display:grid; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); gap:10px; } .pr-stand{ border:1px solid var(--panel-edge); border-radius:var(--radius); background:var(--panel); padding:12px 14px; display:flex; flex-direction:column; gap:6px; } .pr-stand-head{ display:flex; align-items:center; gap:8px; } .pr-stand-roll{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; font-size:13px; } .pr-stand-changes{ border-top:1px dashed var(--panel-edge); padding-top:6px; display:flex; flex-direction:column; gap:2px; } .pr-run{ color:var(--patina); font-weight:600; font-size:13px; } .pr-cycle{ margin-bottom:8px; } .pr-pass-chips{ display:flex; gap:6px; flex-wrap:wrap; margin-top:4px; } .pr-pass-chip{ border:1px solid var(--panel-edge); border-radius:8px; padding:4px 9px; font-size:12.5px; font-weight:600; background:var(--surface-soft); color:var(--ink); } .pr-pass-chip small{ font-weight:500; color:var(--ink-soft); margin-inline-start:4px; } .pr-pass-chip.pr-ps-active{ border-color:var(--pill-green-border); background:var(--pill-green-bg); color:var(--pill-green-text); } .pr-pass-chip.pr-ps-worn{ border-color:var(--pill-red-border); background:var(--pill-red-bg); color:var(--pill-red-text); } .pr-pass-chip.pr-ps-retired{ opacity:0.6; } .pr-passes-edit{ display:flex; flex-direction:column; gap:6px; margin-bottom:6px; } .pr-pass-row{ display:flex; gap:8px; align-items:center; } .pr-pass-row input[data-pg]{ flex:1; min-width:0; } /* ---------- settings, admin ---------- */ .pr-thresholds-box{ padding:12px 14px; border:1px solid var(--panel-edge); border-radius:var(--radius); background:var(--panel); margin-bottom:6px; } .pr-members{ display:flex; flex-direction:column; gap:8px; } .pr-member{ display:flex; align-items:center; gap:10px 14px; flex-wrap:wrap; padding:10px 12px; border:1px solid var(--panel-edge); border-radius:10px; background:var(--panel); } .pr-member > b{ min-width:120px; } .pr-member-new input[data-newuser]{ min-width:160px; } .pr-checks{ display:flex; gap:10px; flex-wrap:wrap; flex:1 1 auto; } .pr-member-btns{ display:flex; gap:6px; margin-inline-start:auto; } /* ---------- small screens ---------- */ @media (max-width:720px){ #prodScreen{ padding:0 12px 20px; } .pr-dept select{ min-width:0; width:100%; } .pr-dept{ flex:1 1 100%; } .pr-tabs{ flex-wrap:nowrap; overflow-x:auto; } .pr-tab{ white-space:nowrap; } .pr-timeline li{ grid-template-columns:1fr; gap:4px; } .pr-filters input[type=search]{ min-width:0; flex:1 1 100%; } .pr-alert{ flex-direction:column; align-items:stretch; } }