:root {
  --ink: #17211e;
  --muted: #68736f;
  --green-950: #142820;
  --green-900: #1b332a;
  --green-800: #26483c;
  --green-700: #356353;
  --green-100: #e8f0ec;
  --amber: #c48632;
  --amber-dark: #a66a1f;
  --amber-soft: #f7ead7;
  --canvas: #f3f5f3;
  --surface: #ffffff;
  --line: #dce2df;
  --line-dark: #c9d1cd;
  --success: #2d7a57;
  --success-soft: #e5f3eb;
  --warning: #b46b19;
  --warning-soft: #fff2df;
  --danger: #b84b44;
  --danger-soft: #fbe9e7;
  --shadow: 0 12px 32px rgba(20, 40, 32, 0.07);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--canvas);
  font-synthesis: none;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--canvas); }
body { margin: 0; min-height: 100vh; background: var(--canvas); }
body.login-open { overflow: hidden; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }
.packing-capture-screen { min-height: 100vh; display: grid; place-items: center; padding: 22px; background: #edf2ef; }
.capture-card { width: min(520px, 100%); padding: 26px; border: 1px solid var(--line); border-radius: 20px; background: #fff; box-shadow: 0 22px 60px rgba(18, 43, 33, .14); }
.capture-brand { display: flex; align-items: center; gap: 11px; margin-bottom: 28px; }
.capture-brand strong, .capture-brand small { display: block; }
.capture-brand small { margin-top: 2px; color: var(--muted); font-size: .74rem; }
.capture-card h1 { margin: 7px 0 6px; font-size: 1.65rem; }
.capture-details { margin: 0 0 22px; color: var(--muted); }
.capture-zone { position: relative; min-height: 220px; display: grid; place-items: center; align-content: center; gap: 7px; padding: 24px; border: 2px dashed #b7c8bf; border-radius: 15px; color: var(--green-800); background: #f6f9f7; text-align: center; cursor: pointer; }
.capture-zone input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.capture-zone:hover, .capture-zone.has-photo { border-color: var(--green-700); background: var(--green-100); }
.capture-camera { width: 54px; height: 54px; display: grid; place-items: center; margin-bottom: 7px; border-radius: 14px; color: #fff; background: var(--amber); font-size: 1.5rem; }
.capture-zone small { max-width: 300px; color: var(--muted); font-size: .76rem; line-height: 1.4; }
.capture-preview { margin-top: 17px; }
.capture-preview img { width: 100%; max-height: 380px; display: block; object-fit: contain; border-radius: 12px; background: #edf1ef; }
.capture-preview p { margin: 8px 0 0; color: var(--success); font-size: .78rem; font-weight: 700; text-align: center; }
.capture-back { width: 100%; margin-top: 18px; text-decoration: none; }
body.capture-mode .app-shell, body.capture-mode .login-screen { display: none !important; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid rgba(196, 134, 50, 0.28);
  outline-offset: 2px;
}

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.app-shell { min-height: 100vh; display: grid; grid-template-columns: 264px minmax(0, 1fr); }
.sidebar {
  position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column;
  padding: 28px 18px 20px; color: #fff; background: var(--green-950);
}
.brand { display: flex; align-items: center; gap: 12px; padding: 0 10px 34px; }
.brand-mark { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--amber); color: #fff; font-size: 1.3rem; font-weight: 800; }
.brand strong { display: block; font-size: 1.06rem; letter-spacing: .01em; }
.brand small, .user-card small { display: block; margin-top: 2px; color: rgba(255, 255, 255, .58); font-size: .78rem; }
.main-nav { display: grid; gap: 6px; }
.nav-item {
  position: relative; width: 100%; display: flex; align-items: center; gap: 12px;
  padding: 13px 14px; border: 0; border-radius: 11px; color: rgba(255, 255, 255, .72);
  background: transparent; font-size: .92rem; text-align: left; text-decoration: none; transition: background .18s ease, color .18s ease;
}
.nav-item:hover { color: #fff; background: rgba(255, 255, 255, .06); }
.nav-item.is-active { color: #fff; background: rgba(255, 255, 255, .11); }
.nav-item.is-active::before { content: ""; position: absolute; left: -18px; width: 4px; height: 26px; border-radius: 0 4px 4px 0; background: var(--amber); }
.production-nav-row { display: grid; grid-template-columns: minmax(0, 1fr) 38px; gap: 7px; align-items: center; }
.production-nav-row .nav-item { min-width: 0; }
.production-home { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.12); border-radius: 9px; color: #cbd7d1; background: rgba(255,255,255,.05); font-size: 1rem; }
.production-home:hover { color: #fff; background: rgba(255,255,255,.12); }
.nav-icon { width: 22px; font-size: 1.2rem; line-height: 1; text-align: center; }
.nav-count { margin-left: auto; min-width: 23px; padding: 3px 7px; border-radius: 20px; background: var(--amber); color: #fff; font-size: .72rem; font-weight: 800; text-align: center; }
.nav-beta { margin-left: auto; padding: 3px 7px; border-radius: 20px; color: rgba(255,255,255,.7); background: rgba(255,255,255,.09); font-size: .62rem; font-weight: 750; white-space: nowrap; }
.sidebar-footer { margin-top: auto; display: grid; gap: 16px; }
.sidebar-footer .nav-item-maj { background: rgba(255,255,255,.07); }
.sidebar-footer .nav-item-commercial { background: rgba(203,139,45,.18); color: #fff; }
.user-card { display: flex; align-items: center; gap: 10px; padding: 13px 11px; border-top: 1px solid rgba(255, 255, 255, .1); }
.avatar { display: grid; place-items: center; width: 36px; height: 36px; flex: 0 0 36px; border-radius: 50%; background: var(--green-700); color: #fff; font-size: .75rem; font-weight: 800; }
.user-card strong { font-size: .88rem; }
.prototype-label { width: max-content; margin-left: 11px; padding: 5px 9px; border-radius: 999px; color: rgba(255, 255, 255, .58); background: rgba(255, 255, 255, .06); font-size: .7rem; letter-spacing: .02em; }
.switch-user { width: max-content; margin: -9px 0 0 58px; padding: 0; border: 0; color: rgba(255,255,255,.55); background: transparent; font-size: .72rem; text-align: left; }
.switch-user:hover { color: #fff; }

/* KARTENNCO PRODUCTION MENU VERT V1 : styles verts d’origine rétablis. */

.login-screen { position: fixed; z-index: 100; inset: 0; display: grid; place-items: center; padding: 24px; background: linear-gradient(135deg, #10231c 0%, #1b332a 70%, #2d5043 100%); }
.login-screen[hidden] { display: none; }
.login-card { width: min(470px, 100%); padding: clamp(28px, 5vw, 50px); border: 1px solid rgba(255,255,255,.12); border-radius: 22px; background: #fff; box-shadow: 0 35px 100px rgba(4, 16, 11, .42); }
.login-brand { display: flex; align-items: center; gap: 11px; margin-bottom: 40px; }
.login-brand strong, .login-brand small { display: block; }
.login-brand strong { font-size: 1rem; }
.login-brand small { margin-top: 1px; color: var(--muted); font-size: .75rem; }
.login-card h1 { margin: 6px 0 8px; font-size: clamp(1.8rem, 5vw, 2.5rem); letter-spacing: -.04em; }
.login-intro { margin: 0 0 27px; color: var(--muted); }
.microsoft-login { width: 100%; margin: 0 0 18px; border-color: #cad6d0; color: #fff; background: var(--green-800); text-align: center; }
.microsoft-login:hover { color: #fff; background: var(--green-700); }
.microsoft-status { margin: 0 0 16px; padding: 11px 12px; border-radius: 9px; color: var(--success); background: var(--success-soft); font-size: .78rem; font-weight: 750; }
.microsoft-status.is-error { color: var(--danger); background: var(--danger-soft); }
.login-form { display: grid; gap: 15px; }
.login-form .button { width: 100%; margin-top: 3px; }
.login-error { margin: -5px 0 0; padding: 9px 11px; border-radius: 8px; color: var(--danger); background: var(--danger-soft); font-size: .78rem; font-weight: 700; }
.login-groups { display: grid; gap: 20px; }
.login-group-title { display: block; margin-bottom: 9px; color: var(--muted); font-size: .7rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.login-members { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 9px; }
.login-user { min-height: 55px; display: flex; align-items: center; gap: 10px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 11px; color: var(--ink); background: #fff; text-align: left; transition: border-color .16s ease, background .16s ease, transform .16s ease; }
.login-user:hover { transform: translateY(-1px); border-color: #b8c8c0; background: var(--green-100); }
.login-user .avatar { background: var(--green-700); }
.login-user strong { font-size: .86rem; }

.main-content { min-width: 0; padding: 42px clamp(28px, 4vw, 68px) 72px; }
.mobile-header { display: none; }
.view { display: none; max-width: 1380px; margin: 0 auto; animation: fade-in .22s ease; }
.view.is-visible { display: block; }
@keyframes fade-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 30px; }
.page-header h1 { margin: 4px 0 6px; font-size: clamp(1.8rem, 3vw, 2.45rem); line-height: 1.08; letter-spacing: -.035em; }
.eyebrow { margin: 0; color: var(--amber-dark); font-size: .78rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.page-subtitle { margin: 0; color: var(--muted); font-size: .98rem; }
.header-actions { display: flex; gap: 10px; }
.edit-banner { display: flex; align-items: center; gap: 12px; margin: -10px 0 24px; padding: 14px 16px; border: 1px solid #c7d8e9; border-radius: 11px; background: #eef5fb; color: #315d83; }
.edit-banner[hidden] { display: none; }
.edit-banner-icon { width: 32px; height: 32px; display: grid; place-items: center; flex: 0 0 32px; border-radius: 8px; background: #dbeaf7; font-weight: 800; }
.edit-banner strong, .edit-banner small { display: block; }
.edit-banner strong { font-size: .88rem; }
.edit-banner small { margin-top: 2px; color: #587993; font-size: .76rem; }
.button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 17px; border: 1px solid transparent; border-radius: 10px; font-size: .9rem; font-weight: 750; transition: transform .15s ease, background .15s ease, border-color .15s ease; }
.button[hidden] { display: none; }
.button:active { transform: translateY(1px); }
.button-primary { background: var(--amber); color: #fff; box-shadow: 0 7px 18px rgba(196, 134, 50, .22); }
.button-primary:hover { background: var(--amber-dark); }
.button-secondary { color: var(--green-800); background: var(--green-100); border-color: #cfddd6; }
.button-secondary:hover { background: #dce9e3; }
.button-pause { color: #fff; background: var(--amber); box-shadow: 0 7px 18px rgba(196, 134, 50, .2); }
.button-pause:hover { background: var(--amber-dark); }
.button-ghost { color: var(--ink); background: #fff; border-color: var(--line-dark); }
.button-ghost:hover { background: #f9faf9; border-color: #aeb9b4; }
.button-success { color: #fff; background: var(--success); }
.button-success:hover { background: #236447; }
.button-danger { color: var(--danger); background: var(--danger-soft); }
.button-danger.solid { color: #fff; background: var(--danger); }
.button-small { min-height: 36px; padding: 0 12px; font-size: .82rem; }
.icon-button { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 9px; background: #fff; color: var(--ink); font-size: 1.2rem; }

.stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 22px; }
.stat-card { position: relative; min-height: 128px; padding: 22px; overflow: hidden; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); box-shadow: 0 5px 18px rgba(20, 40, 32, .035); }
.dashboard-stat-link { width: 100%; color: var(--ink); text-align: left; cursor: pointer; }
.dashboard-stat-link:hover { border-color: #b9c7c0; transform: translateY(-1px); box-shadow: 0 9px 24px rgba(20, 40, 32, .08); }
.stat-card::after { content: ""; position: absolute; right: -12px; bottom: -24px; width: 76px; height: 76px; border-radius: 50%; background: var(--stat-accent, var(--green-100)); opacity: .72; }
.stat-label { display: block; color: var(--muted); font-size: .82rem; font-weight: 700; }
.stat-value { display: block; margin-top: 10px; color: var(--green-900); font-size: 2rem; line-height: 1; font-weight: 800; letter-spacing: -.04em; }
.stat-note { display: block; margin-top: 9px; color: var(--muted); font-size: .76rem; }
.stat-open { position: relative; z-index: 1; display: block; margin-top: 11px; color: var(--green-700); font-size: .7rem; font-weight: 800; }
.dashboard-stock-section { margin-bottom: 22px; padding: 19px 21px 21px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: var(--shadow); }
.dashboard-stock-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 15px; }
.dashboard-stock-heading h2 { margin: 0; font-size: 1.05rem; }
.dashboard-stock-heading p { margin: 4px 0 0; color: var(--muted); font-size: .8rem; }
.dashboard-stock-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.dashboard-stock-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 16px 17px; border: 1px solid var(--line); border-radius: 12px; background: #fafbfa; text-align: left; }
.dashboard-stock-card:hover { border-color: #bdc9c3; background: #fff; box-shadow: 0 5px 18px rgba(20, 40, 32, .06); }
.dashboard-stock-count { width: 45px; height: 45px; display: grid; place-items: center; border-radius: 12px; font-size: 1.25rem; font-weight: 900; }
.stock-dashboard-low .dashboard-stock-count { color: #9b5900; background: #fff1d8; }
.stock-dashboard-out .dashboard-stock-count { color: var(--danger); background: var(--danger-soft); }
.dashboard-stock-copy strong, .dashboard-stock-copy small, .dashboard-stock-copy span { display: block; }
.dashboard-stock-copy strong { font-size: .9rem; }
.dashboard-stock-copy small { margin-top: 2px; color: var(--muted); font-size: .73rem; }
.dashboard-stock-copy span { margin-top: 7px; overflow: hidden; color: #56615d; font-size: .74rem; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-stock-card b { color: var(--muted); font-size: 1.2rem; }
.panel { border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: var(--shadow); }
.panel-header { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 22px; border-bottom: 1px solid var(--line); }
.panel-header h2, .form-section h2 { margin: 0; font-size: 1.08rem; letter-spacing: -.015em; }
.panel-header p, .section-heading p { margin: 4px 0 0; color: var(--muted); font-size: .82rem; }
.toolbar { display: flex; gap: 10px; }
.search-field { min-width: 300px; display: flex; align-items: center; gap: 9px; padding: 0 12px; border: 1px solid var(--line); border-radius: 9px; background: #fafbfa; }
.search-field span { color: var(--muted); font-size: 1.1rem; }
.search-field input { width: 100%; min-height: 40px; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: .85rem; }
.toolbar select { min-height: 42px; padding: 0 34px 0 12px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fafbfa; font-size: .85rem; }
.table-wrap { overflow-x: auto; }
.jobs-table { width: 100%; border-collapse: collapse; text-align: left; }
.jobs-table th { padding: 13px 18px; color: var(--muted); background: #fafbfa; border-bottom: 1px solid var(--line); font-size: .73rem; letter-spacing: .045em; text-transform: uppercase; white-space: nowrap; }
.jobs-table td { padding: 17px 18px; border-bottom: 1px solid #edf0ee; font-size: .88rem; vertical-align: middle; }
.jobs-table tbody tr { transition: background .15s ease; }
.jobs-table tbody tr:hover { background: #fafcfa; }
.production-row { cursor: grab; }
.production-row.is-dragging { opacity: .42; }
.production-row td:first-child { border-left: 4px solid transparent; }
.production-row:hover td:first-child { border-left-color: var(--amber); }
.production-drag { display:inline-grid; place-items:center; width:24px; color:var(--muted); font-size:1.1rem; vertical-align:middle; margin-right:4px; cursor:grab; }
.project-cell strong { font-size:1rem; }
.jobs-table tbody tr:last-child td { border-bottom: 0; }
.project-cell strong { display: block; margin-bottom: 3px; color: var(--ink); }
.project-cell span { color: var(--muted); font-size: .78rem; }
.station-cell { display: flex; align-items: center; gap: 9px; }
.station-icon { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 8px; color: var(--green-800); background: var(--green-100); font-size: .76rem; font-weight: 800; }
.progress-cell { min-width: 155px; }
.progress-row { display: flex; align-items: center; gap: 10px; }
.progress-track { width: 92px; height: 7px; overflow: hidden; border-radius: 99px; background: #e9eeeb; }
.progress-fill { display: block; height: 100%; border-radius: inherit; background: var(--amber); }
.progress-value { min-width: 34px; color: var(--muted); font-size: .78rem; }
.status-badge { width: max-content; display: inline-flex; align-items: center; gap: 7px; padding: 6px 9px; border-radius: 999px; font-size: .73rem; font-weight: 750; white-space: nowrap; }
.status-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.status-in-progress { color: var(--warning); background: var(--warning-soft); }
.status-ready { color: #5f6a66; background: #eef1ef; }
.status-review { color: #42689a; background: #e8eff8; }
.status-done { color: var(--success); background: var(--success-soft); }
.row-action { border: 0; background: transparent; color: var(--green-700); font-size: 1.2rem; }
.row-actions { display: flex; align-items: center; justify-content: flex-end; gap: 5px; }
.row-action.edit { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: #5c6964; font-size: .85rem; }
.row-action.edit:hover { color: var(--green-800); border-color: #b7c5be; background: var(--green-100); }
.empty-state { padding: 48px 24px; text-align: center; color: var(--muted); }
.empty-state h3 { margin: 10px 0 3px; color: var(--ink); }
.empty-state p { margin: 0; }
.empty-icon { font-size: 1.9rem; }

.stepper { display: flex; align-items: center; gap: 12px; margin: -7px 0 22px; padding: 0 4px; color: #8a9490; font-size: .78rem; font-weight: 700; }
.stepper-item { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.stepper-item b { width: 26px; height: 26px; display: grid; place-items: center; border: 1px solid var(--line-dark); border-radius: 50%; background: #fff; color: var(--muted); font-size: .73rem; }
.stepper-item.is-active { color: var(--green-800); }
.stepper-item.is-active b { color: #fff; border-color: var(--green-800); background: var(--green-800); }
.stepper-line { flex: 1; max-width: 90px; height: 1px; background: var(--line-dark); }
#production-form { display: grid; gap: 18px; }
.form-section { padding: 26px; box-shadow: 0 6px 20px rgba(20, 40, 32, .04); }
.section-heading { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 13px; margin-bottom: 24px; }
.section-heading.with-action { grid-template-columns: auto 1fr auto; }
.section-number { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; color: var(--amber-dark); background: var(--amber-soft); font-size: .74rem; font-weight: 800; }
.form-grid { display: grid; gap: 17px; }
.four-columns { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.span-2 { grid-column: span 2; }
.field { display: grid; gap: 7px; color: #4f5a56; font-size: .79rem; font-weight: 700; }
.field input, .field select, .field textarea { width: 100%; min-height: 45px; padding: 10px 12px; border: 1px solid var(--line-dark); border-radius: 9px; background: #fff; color: var(--ink); font-size: .91rem; font-weight: 450; }
.field textarea { min-height: 108px; resize: vertical; line-height: 1.45; }
.field input::placeholder, .field textarea::placeholder { color: #9ca5a1; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--amber); }
.field.has-error input { border-color: var(--danger); background: #fffafa; }
.field.readonly output { min-height: 45px; display: flex; align-items: center; padding: 10px 12px; border: 1px dashed var(--line-dark); border-radius: 9px; background: #f8faf8; color: var(--green-800); font-size: .96rem; font-weight: 800; }
.launch-checks { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; margin-top: 22px; padding: 15px 17px; border: 1px solid #ead6b9; border-radius: 10px; background: #fdf8ef; }
.launch-title { color: var(--amber-dark); font-size: .76rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.launch-checks label { display: flex; align-items: center; gap: 8px; color: #4e5753; font-size: .82rem; }
.launch-checks input { width: 17px; height: 17px; accent-color: var(--green-700); }
.upload-button { position: relative; overflow: hidden; cursor: pointer; }
.upload-button input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.bat-upload-zone { min-height: 112px; display: flex; align-items: center; justify-content: center; gap: 15px; padding: 19px; border: 1px dashed #b9c6c0; border-radius: 12px; background: #fafbfa; transition: border-color .18s ease, background .18s ease; }
.bat-upload-zone.is-dragging { border-color: var(--amber); background: #fffaf2; }
.upload-symbol { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 11px; color: var(--green-700); background: var(--green-100); font-size: 1.35rem; }
.bat-upload-zone strong { display: block; font-size: .89rem; }
.bat-upload-zone p { margin: 3px 0 0; color: var(--muted); font-size: .77rem; }
.bat-upload-zone .button { margin-left: 15px; }
.bat-preview-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.bat-preview { position: relative; overflow: hidden; aspect-ratio: 4 / 3; margin: 0; border: 1px solid var(--line); border-radius: 11px; background: #eef1ef; }
.bat-preview img { width: 100%; height: 100%; display: block; object-fit: contain; background: #f4f6f4; }
.bat-pdf-preview { height: 100%; display: grid; place-items: center; align-content: center; gap: 6px; color: #97413d; background: #fff1ef; }
.bat-pdf-preview span { padding: 8px 10px; border-radius: 8px; color: #fff; background: #bd4b45; font-size: .75rem; font-weight: 900; }
.bat-pdf-preview small { color: #8e5e5a; font-size: .7rem; }
.bat-preview-meta { position: absolute; inset: auto 0 0; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 22px 8px 7px; color: #fff; background: linear-gradient(transparent, rgba(10, 22, 17, .83)); font-size: .69rem; }
.bat-preview-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bat-remove { width: 25px; height: 25px; display: grid; place-items: center; flex: 0 0 25px; border: 0; border-radius: 6px; background: rgba(255,255,255,.17); color: #fff; font-size: .95rem; }
.bat-limit { margin: 12px 0 0; color: var(--muted); font-size: .78rem; }

.production-route { display: grid; gap: 12px; }
.route-empty { padding: 34px 24px; border: 1px dashed var(--line-dark); border-radius: 12px; background: #fafbfa; text-align: center; }
.route-empty strong { display: block; margin-bottom: 4px; }
.route-empty p { margin: 0 0 15px; color: var(--muted); font-size: .84rem; }
.step-card { border: 1px solid var(--line); border-radius: 12px; background: #fff; overflow: hidden; }
.step-card-header { min-height: 58px; display: flex; align-items: center; gap: 12px; padding: 10px 13px; background: #f8faf8; border-bottom: 1px solid var(--line); }
.drag-handle { color: #9ca5a1; letter-spacing: -2px; cursor: grab; }
.step-index { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; background: var(--green-900); color: #fff; font-size: .72rem; font-weight: 800; }
.step-title-input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--ink); font-weight: 800; }
.step-actions { display: flex; gap: 5px; }
.mini-icon { width: 31px; height: 31px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: var(--muted); }
.mini-icon:hover { color: var(--green-800); border-color: var(--line-dark); }
.step-card-body { display: grid; grid-template-columns: minmax(0, 2fr) minmax(230px, 1fr); gap: 18px; padding: 17px; }
.step-controls { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.step-controls .instructions { grid-column: 1 / -1; }

.workshop-layout { display: grid; grid-template-columns: minmax(280px, 350px) minmax(0, 1fr); gap: 18px; align-items: start; transition: grid-template-columns .22s ease; }
.workshop-layout.is-queue-collapsed { grid-template-columns: 64px minmax(0, 1fr); }
.job-queue { position: sticky; top: 24px; overflow: hidden; }
.compact-header { min-height: 76px; }
.queue-header { padding-right: 14px; }
.queue-toggle { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 9px; color: var(--green-800); background: #fff; font-size: 1.3rem; }
.queue-toggle:hover { border-color: var(--line-dark); background: var(--green-100); }
.queue-collapsed-label { display: none; padding: 18px 0 22px; color: var(--muted); font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; writing-mode: vertical-rl; transform: rotate(180deg); }
.is-queue-collapsed .queue-header { min-height: 60px; justify-content: center; padding: 12px; border-bottom: 0; }
.is-queue-collapsed .queue-title, .is-queue-collapsed .queue-body { display: none; }
.is-queue-collapsed .queue-collapsed-label { display: block; margin: 0 auto; }
.queue-section + .queue-section { border-top: 6px solid #f2f5f3; }
.queue-section-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 17px; color: #67716d; background: #f8faf9; font-size: .71rem; font-weight: 850; letter-spacing: .055em; text-transform: uppercase; }
.queue-section-title.active { color: var(--green-800); background: var(--green-100); }
.queue-section-title.finished { color: #276c50; background: #edf7f1; }
.queue-section-title b { min-width: 22px; height: 22px; display: grid; place-items: center; border-radius: 7px; color: var(--green-800); background: #fff; font-size: .7rem; }
.update-note-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:12px; }
.update-archive { padding:7px 10px; font-size:.78rem; }
.queue-empty { padding: 18px; color: var(--muted); font-size: .78rem; text-align: center; }
.queue-item { width: 100%; display: grid; grid-template-columns: auto 1fr auto auto; gap: 11px; align-items: center; padding: 16px 18px; border: 0; border-bottom: 1px solid var(--line); background: #fff; text-align: left; }
.queue-item:last-child { border-bottom: 0; }
.queue-item:hover { background: #fafcfa; }
.queue-item.is-active { background: var(--green-100); box-shadow: inset 3px 0 var(--green-700); }
.queue-item[draggable="true"] { cursor: grab; }.queue-item.is-dragging { opacity:.42; }.queue-drag { color:var(--muted); font-size:1.05rem; letter-spacing:-2px; cursor:grab; }
.queue-number { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; color: var(--green-800); background: #edf3ef; font-size: .72rem; font-weight: 800; }
.queue-item.is-active .queue-number { color: #fff; background: var(--green-700); }
.queue-item-upcoming { background: #fbfcfb; }
.queue-item-upcoming .queue-number { color: #7b8581; background: #eef1ef; }
.queue-item-finished .queue-number { color: var(--success); background: var(--success-soft); }
.queue-copy strong { display: block; font-size: .84rem; }
.queue-copy small { display: block; margin-top: 3px; color: var(--muted); font-size: .73rem; }
.queue-arrow { color: var(--muted); }
.queue-archives-link { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 17px; border: 0; border-top: 6px solid #f2f5f3; color: #66716d; background: #fbfcfb; font-size: .73rem; font-weight: 750; text-align: left; }
.queue-archives-link:hover, .queue-archives-link.is-active { color: var(--green-800); background: #f2f6f3; }
.queue-archives-link b { min-width: 23px; height: 23px; display: grid; place-items: center; border-radius: 7px; color: #68736e; background: #e9eeeb; font-size: .7rem; }
.workshop-detail { min-height: 510px; padding: 28px; }
.workshop-detail.is-overview { padding: 0; overflow: hidden; }
.production-overview { padding: 30px; }
.production-overview-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 22px; padding-bottom: 24px; border-bottom: 1px solid var(--line); }
.production-overview-head h2 { margin: 5px 0 7px; font-size: 1.55rem; }
.production-overview-head p { margin: 0; color: var(--muted); font-size: .86rem; }
.parallel-mode-badge { padding: 9px 12px; border-radius: 9px; color: #38698d; background: #e8f1f7; font-size: .76rem; font-weight: 800; white-space: nowrap; }
.production-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 22px 0 27px; }
.production-kpis article { padding: 17px 18px; border: 1px solid var(--line); border-radius: 12px; background: #f9fbfa; }
.production-kpis span, .production-kpis small { display: block; color: var(--muted); font-size: .73rem; }
.production-kpis strong { display: block; margin: 8px 0 5px; color: var(--green-900); font-size: 1.65rem; line-height: 1; }
.production-types-head h3 { margin: 0; font-size: 1.02rem; }
.production-types-head p { margin: 4px 0 0; color: var(--muted); font-size: .78rem; }
.production-type-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; margin-top: 15px; }
.production-type-card { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 12px; padding: 15px; border: 1px solid var(--line); border-radius: 11px; background: #fff; }
.production-type-icon { width: 39px; height: 39px; display: grid; place-items: center; border-radius: 10px; color: var(--amber-dark); background: var(--amber-soft); font-size: .68rem; font-weight: 900; }
.production-type-card h4 { margin: 0; font-size: .84rem; }
.production-type-card p { margin: 5px 0 0; color: var(--muted); font-size: .73rem; }
.production-type-card p strong { color: var(--green-800); }
.production-type-card p span { margin: 0 3px; color: #b4bcb8; }
.archives-view { padding: 30px; }
.archives-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 22px; padding-bottom: 24px; border-bottom: 1px solid var(--line); }
.archives-head h2 { margin: 5px 0 7px; font-size: 1.55rem; }
.archives-head p:not(.eyebrow) { margin: 0; color: var(--muted); font-size: .86rem; }
.archives-count { padding: 8px 11px; border-radius: 9px; color: var(--green-700); background: var(--green-100); font-size: .74rem; font-weight: 800; white-space: nowrap; }
.archives-list { display: grid; margin-top: 18px; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; }
.archive-row { width: 100%; display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: 13px; padding: 16px 17px; border: 0; border-bottom: 1px solid var(--line); color: var(--ink); background: #fff; text-align: left; }
.archive-row:last-child { border-bottom: 0; }
.archive-row:hover { background: #f8faf9; }
.archive-row-mark { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; color: var(--success); background: var(--success-soft); font-size: .75rem; font-weight: 900; }
.archive-row-copy strong, .archive-row-copy small { display: block; }
.archive-row-copy strong { font-size: .84rem; }
.archive-row-copy small, .archive-row-date { color: var(--muted); font-size: .73rem; }
.archive-search { width: min(460px, 100%); margin-top: 18px; }
.archives-empty { padding: 45px 22px; color: var(--muted); text-align: center; }
.archives-empty strong { display: block; margin-bottom: 4px; color: var(--ink); }
.archives-empty p { margin: 0; font-size: .8rem; }
.workshop-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding-bottom: 22px; border-bottom: 1px solid var(--line); }
.workshop-top h2 { margin: 5px 0 5px; font-size: 1.45rem; }
.workshop-meta { display: flex; flex-wrap: wrap; gap: 16px; color: var(--muted); font-size: .8rem; }
.workshop-top-actions { display: flex; align-items: center; gap: 9px; }
.bat-access-button { display: inline-flex; align-items: center; gap: 7px; padding: 9px 11px; border: 1px solid #bfd1c8; border-radius: 10px; color: var(--green-800); background: #f1f7f4; font-size: .78rem; font-weight: 800; white-space: nowrap; }
.bat-access-button:hover { border-color: var(--green-700); background: var(--green-100); }
.bat-access-button span { min-width: 20px; height: 20px; display: grid; place-items: center; padding: 0 5px; border-radius: 10px; color: #fff; background: var(--green-700); font-size: .66rem; }
.quantity-pill { padding: 10px 13px; border-radius: 10px; color: var(--green-800); background: var(--green-100); font-size: .84rem; font-weight: 800; white-space: nowrap; }
.timeline { display: grid; gap: 0; padding: 21px 0 5px; }
.timeline-step { position: relative; width: 100%; display: grid; grid-template-columns: 33px 1fr auto; gap: 11px; align-items: center; min-height: 53px; padding: 4px 8px 4px 0; border: 0; border-radius: 9px; color: var(--ink); background: transparent; text-align: left; }
.timeline-step:hover { background: #f7f9f7; }
.timeline-step.is-selected { background: #f2f6f3; box-shadow: inset 3px 0 var(--green-700); }
.timeline-step:not(:last-child)::after { content: ""; position: absolute; left: 16px; top: 39px; bottom: -10px; width: 1px; background: var(--line-dark); }
.timeline-marker { z-index: 1; width: 33px; height: 33px; display: grid; place-items: center; border: 1px solid var(--line-dark); border-radius: 50%; background: #fff; color: var(--muted); font-size: .71rem; font-weight: 800; }
.timeline-step.is-done .timeline-marker { border-color: var(--success); background: var(--success); color: #fff; }
.timeline-step.is-current .timeline-marker { border-color: var(--amber); background: var(--amber); color: #fff; box-shadow: 0 0 0 5px var(--amber-soft); }
.timeline-step.is-paused .timeline-marker { border-color: #a86612; color: #a86612; background: #fff4df; }
.timeline-copy strong { display: block; font-size: .86rem; }
.timeline-copy small { color: var(--muted); font-size: .74rem; }
.timeline-step { grid-template-columns: 33px minmax(0,1fr) auto auto; }
.assignee-avatars { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:4px; max-width:120px; }
.task-avatar { display:grid; place-items:center; width:32px; height:32px; overflow:hidden; border-radius:50%; background:var(--green-700); color:white; font-size:10px; border:2px solid white; }
.task-avatar img { width:100%; height:100%; object-fit:cover; }
#phone-qr-dialog, #maintenance-edit-dialog { border:1px solid var(--line); border-radius:20px; padding:28px; max-width: min(520px,95vw); }
#phone-qr-dialog form, #maintenance-edit-dialog form { margin-top:16px; }
#phone-qr-image { background:white; padding:12px; width:224px; margin:auto; }
.stock-quick { grid-column:1/-1; display:flex; gap:10px; flex-wrap:wrap; margin:8px 0; }
.stock-quick button { padding:10px 16px; border:1px solid var(--line-dark); border-radius:10px; background:white; color:var(--green-700); cursor:pointer; }
.timeline-status { color: var(--muted); font-size: .74rem; }
@media(max-width:600px) { .assignee-avatars { max-width:68px; } .task-avatar { width:26px;height:26px; } }
.timeline-status.current { color: var(--amber-dark); font-weight: 800; }
.timeline-status.paused { color: #9b5900; font-weight: 800; }
.timeline-status.todo { color: #42689a; }
.parallel-running { padding: 4px 7px; border-radius: 7px; color: #38698d; background: #e8f1f7; font-weight: 750; }
.archive-meta { padding: 4px 7px; border-radius: 7px; color: var(--success); background: var(--success-soft); font-weight: 750; }
.current-operation { margin-top: 22px; padding: 21px; border-radius: 13px; background: #f7f9f7; border: 1px solid var(--line); }
.current-operation.is-completed { background: #f6faf7; }
.workshop-bat { margin-top: 22px; padding: 18px; border: 1px solid var(--line); border-radius: 13px; background: #fff; }
.workshop-bat-head { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 12px; }
.workshop-bat-head h3 { margin: 0; font-size: .98rem; }
.workshop-bat-head span { color: var(--muted); font-size: .75rem; }
.workshop-bat-layout { display: grid; grid-template-columns: minmax(0, 1fr) 112px; gap: 11px; }
.bat-main { min-height: 270px; display: grid; place-items: center; padding: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: #f4f6f4; cursor: zoom-in; }
.bat-main img { width: 100%; max-height: 390px; display: block; object-fit: contain; }
.bat-thumbnails { display: grid; align-content: start; gap: 8px; }
.bat-thumb { aspect-ratio: 4 / 3; padding: 0; overflow: hidden; border: 2px solid transparent; border-radius: 8px; background: #eef1ef; }
.bat-thumb.is-active { border-color: var(--amber); }
.bat-thumb img { width: 100%; height: 100%; display: block; object-fit: cover; }
.bat-thumb.is-pdf { display: grid; place-items: center; color: #a14540; background: #fff1ef; font-size: .7rem; font-weight: 900; }
.bat-pdf-main { min-height: 270px; display: grid; place-items: center; align-content: center; gap: 13px; padding: 28px; border: 1px solid var(--line); border-radius: 10px; background: #fbfcfb; text-align: center; }
.bat-pdf-icon { padding: 12px 14px; border-radius: 10px; color: #fff; background: #bd4b45; font-size: .85rem; font-weight: 900; }
.bat-pdf-main strong { max-width: 420px; overflow-wrap: anywhere; }
.current-operation-head { display: flex; justify-content: space-between; gap: 15px; margin-bottom: 14px; }
.current-operation h3 { margin: 3px 0 0; font-size: 1.12rem; }
.operation-head-status { display: grid; justify-items: end; gap: 5px; }
.operation-status { padding: 5px 8px; border-radius: 7px; font-size: .7rem; font-weight: 800; }
.operation-status-todo { color: #42689a; background: #e8eff8; }
.operation-status-current { color: var(--amber-dark); background: var(--amber-soft); }
.operation-status-paused { color: #9b5900; background: #fff1d8; }
.operation-status-done { color: var(--success); background: var(--success-soft); }
.operation-duration { color: var(--muted); font-size: .8rem; }
.instructions-box { padding: 15px 16px; border-left: 3px solid var(--amber); border-radius: 0 9px 9px 0; background: #fff; color: #3f4945; font-size: .9rem; line-height: 1.55; white-space: pre-line; }
.operation-checks { display: flex; flex-wrap: wrap; gap: 12px 20px; margin-top: 16px; }
.operation-checks label { display: flex; align-items: center; gap: 8px; color: #4e5955; font-size: .84rem; }
.operation-checks input { width: 18px; height: 18px; accent-color: var(--green-700); }
.operation-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 17px; }
.workshop-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 9px; margin-top: 18px; }
.timer { min-height: 44px; display: flex; align-items: center; margin-right: auto; color: var(--green-800); font-variant-numeric: tabular-nums; font-size: 1.1rem; font-weight: 800; }
.completed-operation-label { min-height: 40px; display: inline-flex; align-items: center; padding: 0 12px; border-radius: 9px; color: var(--success); background: var(--success-soft); font-size: .78rem; font-weight: 800; }
.completed-operation-label { flex-direction: column; align-items: flex-start; justify-content: center; }
.completed-operation-label small { margin-top: 2px; color: #55806c; font-size: .67rem; font-weight: 650; }
.completed-actions { display: grid; justify-items: end; gap: 5px; }
.undo-operation { padding: 2px 3px; border: 0; color: #8b5650; background: transparent; font-size: .7rem; text-decoration: underline; text-underline-offset: 2px; }
.undo-operation:hover { color: var(--danger); }
.packing-workspace { display: grid; gap: 18px; }
.packing-intro { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; padding: 13px 15px; border-radius: 9px; color: var(--green-800); background: var(--green-100); }
.packing-intro strong { font-size: .86rem; }
.packing-intro span { color: var(--muted); font-size: .74rem; }
.packing-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.packing-fieldset { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 14px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.packing-fieldset.is-hidden { display: none; }
.packing-fieldset-title { grid-column: 1 / -1; color: var(--green-800); font-size: .75rem; font-weight: 800; }
.package-list { grid-column: 1 / -1; display: grid; gap: 9px; }
.package-list-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--green-800); font-size: .78rem; font-weight: 850; }
.add-package-button { min-height: 34px; padding: 0 11px; border: 1px solid #cfddd6; border-radius: 8px; color: var(--green-800); background: var(--green-100); font-size: .72rem; font-weight: 800; }
.package-row { display: grid; grid-template-columns: auto repeat(5, minmax(90px, 1fr)) auto; align-items: end; gap: 8px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.package-index { width: 28px; height: 38px; display: grid; place-items: center; margin-bottom: 1px; border-radius: 8px; color: var(--green-800); background: var(--green-100); font-size: .72rem; font-weight: 900; }
.package-row .field span { font-size: .68rem; }
.remove-package-button { width: 30px; height: 38px; display: grid; place-items: center; margin-bottom: 1px; border: 1px solid #f0d1cc; border-radius: 8px; color: var(--danger); background: var(--danger-soft); font-size: 1rem; }
.packing-total-weight { grid-column: 2; }
.packing-photo-gallery { display: grid; gap: 10px; padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.packing-photo-gallery-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--green-800); font-size: .78rem; }
.packing-photo-gallery-head span { color: var(--muted); font-size: .7rem; }
.packing-photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; }
.packing-photo-grid a { display: grid; gap: 5px; color: var(--muted); font-size: .68rem; text-decoration: none; }
.packing-photo-grid img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 9px; border: 1px solid var(--line); }
.packing-qr-panel { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 22px; padding: 18px; border: 1px dashed #b8c8c0; border-radius: 12px; background: #fff; }
.packing-qr-copy h4 { margin: 6px 0 6px; font-size: 1rem; }
.packing-qr-copy p:not(.eyebrow) { max-width: 520px; margin: 0; color: var(--muted); font-size: .78rem; line-height: 1.5; }
.packing-mobile-link { display: inline-block; margin-top: 12px; color: var(--green-700); font-size: .76rem; font-weight: 800; text-decoration: none; }
.packing-qr { width: 164px; height: 164px; display: grid; place-items: center; padding: 8px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.packing-qr img, .packing-qr canvas { max-width: 148px; max-height: 148px; }
.qr-fallback { color: var(--muted); font-size: .72rem; text-align: center; }
.workshop-empty { min-height: 430px; display: grid; place-items: center; text-align: center; color: var(--muted); }
.workshop-empty h3 { margin: 0 0 5px; color: var(--ink); }
.workshop-empty p { margin: 0; }

.template-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.template-card { display: flex; flex-direction: column; min-height: 218px; padding: 22px; border: 1px solid var(--line); border-radius: 15px; background: #fff; box-shadow: 0 5px 18px rgba(20, 40, 32, .035); }
.template-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 11px; color: var(--amber-dark); background: var(--amber-soft); font-size: .75rem; font-weight: 900; }
.template-icon img { width: 25px; height: 25px; display: block; }
.timeline-marker .template-icon { width:100%; height:100%; border-radius:50%; }
.timeline-marker .template-icon img { width:27px; height:27px; }
.timeline-marker .template-image.is-compact { width:100%; height:100%; border-radius:50%; }
.step-assignees { border:1px solid var(--line); border-radius:10px; padding:12px; display:flex; flex-wrap:wrap; gap:12px; grid-column:1/-1; }
.step-assignees label { display:flex; gap:6px; align-items:center; font-size:14px; }
.step-assignees input { width:18px; height:18px; }
#stats-grid { display:block; }
.dashboard-personal-toolbar { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:20px; }
.personal-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; align-items:start; }
.personal-widget { grid-column:span var(--widget-span,4); min-width:0; border:1px solid var(--line); border-radius:16px; background:#fff; padding:22px; overflow-wrap:anywhere; }
.personal-widget h2 { font-size:20px; margin:0 0 18px; }
.personal-widget p { font-size:16px; line-height:1.5; }
.personal-task { display:flex; gap:12px; align-items:center; text-align:left; background:transparent; border:0; border-bottom:1px solid var(--line); padding:14px 0; width:100%; color:var(--ink); cursor:pointer; }
.personal-task>span:nth-child(2) { flex:1; min-width:0; }
.personal-task small { display:block; color:var(--muted); font-size:14px; line-height:1.5; }
.personal-task strong { font-size:16px; }
.personal-task .template-icon { flex-shrink:0; }
.widget-count { display:block; font-size:36px; margin-bottom:14px; }
.widget-setting { display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:12px 0; border-bottom:1px solid var(--line); }
.widget-setting label { flex:1; min-width:180px; }
.widget-setting button,.widget-setting select,.template-order button,.machine-row button { padding:8px 12px; border:1px solid var(--line); background:var(--green-100); border-radius:8px; cursor:pointer; }
#dashboard-settings { padding:26px; max-width:700px; width:95vw; }
.template-order { display:flex; gap:8px; margin:12px 0; }
.product-photo-gallery { display:flex; flex-wrap:wrap; gap:12px; margin:20px 0; }
.product-photo-gallery img { width:160px; height:140px; object-fit:contain; background:var(--canvas); border-radius:10px; }
.hand-delivery { display:flex; gap:10px; align-items:center; padding:16px; background:var(--amber-soft); border-radius:10px; font-weight:700; }
.maintenance-form { margin:20px 0; padding:24px; display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.maintenance-form h2,.maintenance-form label:has(textarea) { grid-column:1/-1; }
.machine-row { display:flex; gap:12px; align-items:center; padding:12px; flex-wrap:wrap; }
.machine-row strong { flex:1; }
#view-maintenance details { padding:20px; } #view-maintenance summary { cursor:pointer; font-weight:700; }
#maintenance-history { display:grid; gap:14px; margin-top:20px; }
@media(max-width:1000px) { .personal-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.personal-widget[style*="4"] { grid-column:span 2; } }
@media(max-width:650px) { .personal-grid,.maintenance-form { grid-template-columns:1fr; }.personal-widget { grid-column:1; }.dashboard-personal-toolbar { align-items:flex-start; flex-direction:column; } }
.template-card h2 { margin: 17px 0 6px; font-size: 1.04rem; }
.template-card p { margin: 0 0 18px; color: var(--muted); font-size: .83rem; line-height: 1.45; }
.template-card .button { width: 100%; margin-top: auto; }
.template-image { width: 100%; height: 92px; display: block; overflow: hidden; border-radius: 11px; background: #eef2ef; }
.template-image img { width: 100%; height: 100%; display: block; object-fit: cover; }
.template-image.is-compact { width: 42px; height: 42px; border-radius: 10px; }
.team-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; }
.team-card { padding: 23px; border: 1px solid var(--line); border-radius: 15px; background: #fff; box-shadow: 0 5px 18px rgba(20, 40, 32, .035); }
.team-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.team-card h2 { margin: 0; font-size: 1.02rem; }
.team-count { padding: 5px 8px; border-radius: 999px; color: var(--green-700); background: var(--green-100); font-size: .71rem; font-weight: 800; }
.member-list { display: grid; gap: 12px; }
.member { display: flex; align-items: center; gap: 11px; padding-top: 12px; border-top: 1px solid #edf0ee; }
.member:first-child { padding-top: 0; border-top: 0; }
.member .avatar { overflow: hidden; color: #fff; background: var(--green-700); }
.member .avatar img, .user-card .avatar img { width: 100%; height: 100%; object-fit: cover; }
.member strong { display: block; font-size: .87rem; }
.member small { display: block; margin-top: 2px; color: var(--muted); font-size: .74rem; }
.member-details { min-width: 0; flex: 1; }
.member-delete { width: 32px; height: 32px; display: grid; flex: 0 0 auto; place-items: center; border: 1px solid transparent; border-radius: 8px; color: #8b5650; background: transparent; font-size: 1.1rem; }
.member-delete:hover { border-color: #f0d1cc; background: var(--danger-soft); color: var(--danger); }
.member-settings { width: 34px; height: 34px; display: grid; flex: 0 0 auto; place-items: center; border: 1px solid var(--line); border-radius: 8px; color: var(--green-700); background: #fff; font-size: .9rem; }
.member-settings:hover { background: var(--green-100); }
.team-empty, .login-empty { color: var(--muted); font-size: .8rem; }
.stock-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.stock-stats .stat-card { min-height: 150px; }
.stock-stats .stat-value { font-variant-numeric: tabular-nums; }
.stock-stat-danger .stat-value { color: var(--danger); }
.stock-stat-warning .stat-value { color: #a96000; }
.stock-reference strong { display: block; }
.stock-quantity { font-weight: 800; }
.stock-threshold { color: #56615d; font-weight: 750; }
.stock-update { color: var(--muted); font-size: .78rem; white-space: nowrap; }
.stock-category-row th { padding: 14px 18px 9px; border-bottom: 1px solid var(--line); color: var(--green-800); background: #f3f6f4; font-size: .74rem; font-weight: 900; letter-spacing: .075em; text-align: left; }
.stock-category-mark { width: 9px; height: 9px; display: inline-block; margin-right: 9px; border-radius: 3px; background: var(--green-700); }
.stock-category-maintenance { background: #4179a5; }
.stock-category-epi { background: #b97715; }
.stock-category-chimie { background: #78579e; }
.stock-state { display: inline-flex; align-items: center; gap: 7px; padding: 6px 9px; border-radius: 999px; font-size: .72rem; font-weight: 750; white-space: nowrap; }
.stock-state::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.stock-ok { color: var(--success); background: var(--success-soft); }
.stock-zero { color: var(--danger); background: var(--danger-soft); }
.stock-low { color: #a96000; background: #fff1d8; }
.stock-unknown { color: #6e7773; background: #edf0ee; }
.stock-edit { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 8px; color: var(--green-700); background: #fff; }
.stock-edit:hover { border-color: #b8c6bf; background: var(--green-100); }
.outlook-status-panel { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 22px; margin-bottom: 18px; padding: 22px 25px; }
.calendar-symbol { width: 94px; height: 94px; display: grid; place-items: center; border-radius: 24px; color: var(--amber-dark); background: var(--amber-soft); font-size: 3rem; }
.outlook-status-panel h2 { margin: 8px 0 5px; font-size: 1.15rem; }
.outlook-status-panel p { margin: 0; color: var(--muted); font-size: .84rem; line-height: 1.5; }
.outlook-status-panel a { text-decoration: none; }
.calendar-board { overflow-x: auto; }
.outlook-calendar-frame { width: 100%; height: calc(100vh - 190px); min-height: 650px; display: block; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); box-shadow: var(--shadow); }
.calendar-nav { display: flex; align-items: center; gap: 10px; }
.calendar-nav button { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 8px; color: var(--green-800); background: #fff; font-size: 1.2rem; }
.calendar-nav strong { min-width: 150px; color: var(--green-800); font-size: .78rem; text-align: center; }
.calendar-week { display: grid; grid-template-columns: repeat(7, minmax(115px, 1fr)); min-width: 805px; border-top: 1px solid var(--line); }
.calendar-day { min-height: 270px; border-right: 1px solid var(--line); background: #fff; }
.calendar-day:last-child { border-right: 0; }
.calendar-day header { display: flex; align-items: center; justify-content: space-between; padding: 12px; border-bottom: 1px solid var(--line); color: var(--muted); background: #f8faf9; text-transform: capitalize; }
.calendar-day header span { font-size: .72rem; font-weight: 750; }
.calendar-day header strong { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; font-size: .78rem; }
.calendar-day.is-today header strong { color: #fff; background: var(--amber); }
.calendar-day-events { display: grid; align-content: start; gap: 7px; padding: 9px; }
.calendar-event { padding: 9px; border: 0; border-left: 3px solid var(--green-700); border-radius: 7px; color: var(--ink); background: var(--green-100); text-align: left; }
.calendar-event.status-ready { border-left-color: #4777a2; background: #edf3f8; }
.calendar-event.status-review { border-left-color: var(--amber); background: var(--amber-soft); }
.calendar-event strong, .calendar-event small { display: block; }
.calendar-event strong { font-size: .73rem; }
.calendar-event small { margin-top: 3px; color: var(--muted); font-size: .65rem; line-height: 1.3; }
.calendar-day-empty { display: block; padding-top: 25px; color: #bdc5c1; text-align: center; }

.template-dialog { width: min(760px, calc(100vw - 30px)); padding: 0; border: 0; border-radius: 17px; box-shadow: 0 30px 90px rgba(10, 24, 18, .3); }
.template-dialog::backdrop { background: rgba(12, 27, 21, .55); backdrop-filter: blur(2px); }
.template-dialog form { padding: 25px; }
.template-edit-dialog { width: min(860px, calc(100vw - 30px)); padding: 0; border: 0; border-radius: 17px; box-shadow: 0 30px 90px rgba(10, 24, 18, .3); }
.template-edit-dialog::backdrop { background: rgba(12, 27, 21, .58); backdrop-filter: blur(2px); }
.template-edit-dialog form { padding: 25px; }
.template-edit-layout { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 22px; margin-top: 22px; }
.template-image-editor { display: grid; align-content: start; gap: 10px; }
.template-image-preview { aspect-ratio: 1; display: grid; place-items: center; overflow: hidden; border: 1px dashed var(--line-dark); border-radius: 14px; color: var(--amber-dark); background: var(--amber-soft); font-size: 1.15rem; font-weight: 900; }
.template-image-preview img { width: 100%; height: 100%; display: block; object-fit: cover; }
.template-image-remove { padding: 4px; border: 0; color: #8b5650; background: transparent; font-size: .72rem; text-decoration: underline; }
.template-fields-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.template-dialog-actions { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; }
.dialog-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.dialog-header h2 { margin: 4px 0 0; font-size: 1.45rem; }
.dialog-intro { margin: 10px 0 20px; color: var(--muted); font-size: .9rem; }
.template-picker { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; max-height: 440px; overflow: auto; }
.picker-item { display: grid; grid-template-columns: auto 1fr auto; gap: 11px; align-items: center; padding: 14px; border: 1px solid var(--line); border-radius: 11px; background: #fff; text-align: left; }
.picker-item:hover { border-color: #b7c6bf; background: #fbfcfb; }
.picker-item strong { display: block; font-size: .86rem; }
.picker-item small { display: block; margin-top: 2px; color: var(--muted); font-size: .72rem; }
.picker-plus { color: var(--amber-dark); font-size: 1.1rem; }
.bat-dialog { width: min(1000px, calc(100vw - 36px)); max-height: calc(100vh - 36px); padding: 14px; border: 0; border-radius: 15px; background: #14201b; box-shadow: 0 30px 90px rgba(7, 18, 13, .42); }
.bat-dialog::backdrop { background: rgba(7, 18, 13, .78); backdrop-filter: blur(3px); }
.bat-dialog img { width: 100%; max-height: calc(100vh - 115px); display: block; object-fit: contain; border-radius: 9px; background: #fff; }
.bat-dialog p { margin: 10px 44px 0 4px; overflow: hidden; color: rgba(255,255,255,.78); font-size: .82rem; text-overflow: ellipsis; white-space: nowrap; }
.bat-dialog-close { position: absolute; z-index: 1; right: 20px; top: 20px; width: 36px; height: 36px; display: grid; place-items: center; border: 0; border-radius: 50%; color: #fff; background: rgba(12, 27, 21, .72); font-size: 1.2rem; }
.job-bat-dialog { width: min(940px, calc(100vw - 30px)); max-height: calc(100vh - 30px); padding: 0; border: 0; border-radius: 17px; background: #f8faf8; box-shadow: 0 30px 90px rgba(10, 24, 18, .3); }
.job-bat-dialog::backdrop { background: rgba(12, 27, 21, .58); backdrop-filter: blur(2px); }
.job-bat-dialog-head { position: sticky; z-index: 2; top: 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 21px 23px; border-bottom: 1px solid var(--line); background: #fff; }
.job-bat-dialog-head h2 { margin: 4px 0 0; font-size: 1.45rem; }
#job-bat-dialog-content { padding: 0 23px 23px; }
.job-bat-dialog .workshop-bat { margin-top: 23px; }
.confirm-dialog, .stock-dialog { width: min(540px, calc(100vw - 30px)); padding: 0; border: 0; border-radius: 17px; box-shadow: 0 30px 90px rgba(10, 24, 18, .3); }
.confirm-dialog::backdrop, .stock-dialog::backdrop { background: rgba(12,27,21,.58); backdrop-filter: blur(2px); }
.confirm-dialog form { padding: 30px; text-align: center; }
.confirm-icon { width: 48px; height: 48px; display: grid; place-items: center; margin: 0 auto 15px; border-radius: 50%; color: var(--danger); background: var(--danger-soft); font-size: 1.2rem; font-weight: 900; }
.confirm-dialog h2 { margin: 0 0 8px; }
.confirm-dialog p { margin: 0; color: var(--muted); line-height: 1.5; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 25px; }
.confirm-dialog .dialog-actions { justify-content: center; }
.stock-dialog form { padding: 25px; }
.stock-dialog h2 { margin: 4px 0 0; }
.supplier-contact-text { width: 100%; min-height: 120px; resize: vertical; padding: 13px; border: 1px solid var(--line-dark); border-radius: 10px; background: #f7faf8; color: var(--ink); font: inherit; line-height: 1.5; }
.stock-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; margin-top: 22px; }
.stock-update-note { margin: 14px 0 0; padding: 11px 12px; border-radius: 8px; color: #5f6965; background: #f3f5f3; font-size: .76rem; }
.user-access-dialog { width: min(760px, calc(100vw - 30px)); }
.planning-dialog { width:min(1100px,calc(100vw - 30px)); padding:0; border:0; border-radius:17px; box-shadow:0 30px 90px rgba(10,24,18,.3); }
.planning-dialog::backdrop { background:rgba(12,27,21,.58); backdrop-filter:blur(2px); }
.planning-dialog form { padding:25px; }
.planner-loading { padding:32px; color:var(--muted); }
.planner-controls { display:grid; grid-template-columns:180px 160px 1fr; align-items:end; gap:14px; margin:18px 0; }
.planner-duration { min-height:46px; display:flex; align-items:center; gap:8px; color:var(--green-700); }
.planner-duration small { color:var(--muted); }
.planner-ruler { display:flex; justify-content:space-between; margin:0 0 6px 148px; color:var(--muted); font-size:.72rem; }
.planner-rows { border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.planner-person { display:grid; grid-template-columns:148px 1fr; min-height:62px; border-bottom:1px solid var(--line); cursor:pointer; }
.planner-person:last-child { border-bottom:0; }
.planner-person > span { display:flex; align-items:center; gap:8px; padding:9px; font-weight:750; }
.planner-person input { margin:0 0 0 12px; align-self:center; }
.planner-track { position:relative; min-width:0; background:repeating-linear-gradient(to right,transparent 0,transparent calc(8.333% - 1px),#eef2ef calc(8.333% - 1px),#eef2ef 8.333%); }
.planner-off { position:absolute; top:0; bottom:0; background:rgba(105,120,112,.13); pointer-events:none; }
.planner-off.before { left:0; width:6.25%; }.planner-off.lunch { left:41.667%;width:8.333%; }.planner-off.after { left:87.5%;width:12.5%; }
.planner-event,.planner-proposal { position:absolute; z-index:2; top:8px; bottom:8px; overflow:hidden; padding:6px 7px; border-radius:6px; white-space:nowrap; text-overflow:ellipsis; font-size:.72rem; line-height:1.15; }
.planner-event { background:var(--green-100); border-left:3px solid var(--green-700); color:var(--green-800); }.planner-proposal { z-index:3; background:#fff5df; border:2px dashed var(--amber); color:var(--amber-dark); }.planner-proposal.is-conflict { background:#fff0ed; border-color:var(--danger); color:var(--danger); }
.planner-feedback { margin:15px 0 0; padding:10px 12px; border-radius:8px; background:var(--green-100); color:var(--green-800); font-size:.9rem; }.planner-feedback.is-conflict { background:var(--danger-soft); color:var(--danger); }.planner-empty { padding:18px; color:var(--muted); }
.planning-dialog .dialog-actions > span { flex:1; }
@media(max-width:700px){.planning-dialog form{padding:18px}.planner-controls{grid-template-columns:1fr 1fr}.planner-duration{grid-column:1/-1}.planner-ruler{margin-left:106px}.planner-person{grid-template-columns:106px minmax(330px,1fr)}.planner-rows{overflow:auto}.planner-event,.planner-proposal{font-size:.65rem}}
.user-profile-editor { display: flex; align-items: center; gap: 16px; margin-top: 20px; }
.user-photo-preview { width: 76px; height: 76px; display: grid; flex: 0 0 76px; place-items: center; overflow: hidden; border-radius: 50%; color: #fff; background: var(--green-700); font-size: 1.15rem; font-weight: 850; }
.user-photo-preview img { width: 100%; height: 100%; object-fit: cover; }
.permissions-fieldset { margin: 22px 0 4px; padding: 0; border: 0; }
.permissions-fieldset legend { margin-bottom: 12px; color: var(--green-800); font-size: .8rem; font-weight: 850; }
.permissions-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.permission-item { display: flex; align-items: flex-start; gap: 9px; padding: 11px; border: 1px solid var(--line); border-radius: 9px; background: #fafbfa; }
.permission-item input { margin-top: 2px; accent-color: var(--green-700); }
.permission-item strong, .permission-item small { display: block; }
.permission-item strong { font-size: .75rem; }
.permission-item small { margin-top: 2px; color: var(--muted); font-size: .67rem; line-height: 1.35; }
.toast { position: fixed; z-index: 20; right: 24px; bottom: 24px; max-width: 360px; padding: 13px 17px; border-radius: 10px; color: #fff; background: var(--green-900); box-shadow: 0 15px 40px rgba(20, 40, 32, .25); opacity: 0; transform: translateY(12px); pointer-events: none; transition: opacity .2s ease, transform .2s ease; }
.toast.is-visible { opacity: 1; transform: none; }
#print-sheet { display: none; }

@media (max-width: 1100px) {
  .app-shell { grid-template-columns: 220px minmax(0, 1fr); }
  .main-content { padding-inline: 28px; }
  .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .four-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .template-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bat-preview-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .stock-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .toolbar { align-items: stretch; }
  .search-field { min-width: 230px; }
}

@media (max-width: 820px) {
  .app-shell { display: block; }
  .sidebar { position: fixed; z-index: 15; left: 0; width: 264px; transform: translateX(-100%); transition: transform .22s ease; box-shadow: 20px 0 50px rgba(12, 27, 21, .25); }
  .sidebar.is-open { transform: none; }
  .main-content { padding: 0 18px 50px; }
  .mobile-header { height: 70px; display: flex; align-items: center; justify-content: space-between; margin: 0 -18px 26px; padding: 0 18px; background: var(--green-950); color: #fff; }
  .mobile-header .brand { padding: 0; }
  .mobile-header .brand-mark { width: 34px; height: 34px; border-radius: 9px; }
  .mobile-header .icon-button { border-color: rgba(255,255,255,.15); background: rgba(255,255,255,.07); color: #fff; }
  .page-header { align-items: flex-start; }
  .dashboard-stock-heading { align-items: flex-start; }
  .dashboard-stock-grid { grid-template-columns: 1fr; }
  .panel-header { align-items: flex-start; flex-direction: column; }
  .toolbar { width: 100%; }
  .search-field { flex: 1; min-width: 0; }
  .workshop-layout { grid-template-columns: 1fr; }
  .workshop-layout.is-queue-collapsed { grid-template-columns: 1fr; }
  .job-queue { position: static; }
  .production-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .team-grid { grid-template-columns: 1fr; }
  .job-queue { max-height: 280px; overflow: auto; }
  .section-heading.with-action { grid-template-columns: auto 1fr; }
  .section-heading.with-action .button { grid-column: 1 / -1; }
}

@media (max-width: 610px) {
  .page-header, .create-header { align-items: stretch; flex-direction: column; }
  .page-header .button-primary, .header-actions { width: 100%; }
  .header-actions .button { flex: 1; }
  .stats-grid, .template-grid, .four-columns, .template-picker { grid-template-columns: 1fr; }
  .login-members, .stock-stats { grid-template-columns: 1fr; }
  .dashboard-stock-heading { flex-direction: column; }
  .stock-form-grid { grid-template-columns: 1fr; }
  .stock-form-grid .span-2 { grid-column: auto; }
  .permissions-grid { grid-template-columns: 1fr; }
  .outlook-status-panel { grid-template-columns: 1fr; }
  .outlook-status-panel .calendar-symbol { width: 64px; height: 64px; border-radius: 17px; font-size: 2rem; }
  .bat-preview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bat-upload-zone { align-items: flex-start; flex-direction: column; }
  .bat-upload-zone .button { width: 100%; margin-left: 0; }
  .workshop-bat-layout { grid-template-columns: 1fr; }
  .production-overview { padding: 21px; }
  .production-overview-head { flex-direction: column; }
  .archives-view { padding: 21px; }
  .archives-head { align-items: flex-start; flex-direction: column; }
  .archive-row { grid-template-columns: auto minmax(0, 1fr) auto; }
  .archive-row-date { display: none; }
  .template-edit-layout { grid-template-columns: 1fr; }
  .template-image-editor { grid-template-columns: 120px minmax(0, 1fr); align-items: center; }
  .template-image-remove { grid-column: 2; }
  .template-fields-grid { grid-template-columns: 1fr; }
  .template-fields-grid .span-2 { grid-column: auto; }
  .template-dialog-actions { grid-template-columns: 1fr; }
  .production-kpis, .production-type-grid { grid-template-columns: 1fr; }
  .packing-form-grid, .packing-fieldset, .packing-qr-panel { grid-template-columns: 1fr; }
  .packing-fieldset-title { grid-column: auto; }
  .package-row { grid-template-columns: auto 1fr; }
  .package-row .field, .remove-package-button { grid-column: 2; }
  .package-index { grid-row: 1; }
  .packing-total-weight { grid-column: auto; }
  .packing-qr { margin: 0 auto; }
  .packing-intro { align-items: flex-start; flex-direction: column; }
  .completed-actions { justify-items: stretch; width: 100%; }
  .bat-thumbnails { grid-template-columns: repeat(4, 1fr); }
  .span-2 { grid-column: auto; }
  .toolbar { flex-direction: column; }
  .toolbar select, .search-field { width: 100%; }
  .stepper { display: none; }
  .form-section { padding: 19px; }
  .launch-checks { align-items: flex-start; flex-direction: column; }
  .step-card-body { grid-template-columns: 1fr; }
  .step-controls, .operation-fields { grid-template-columns: 1fr; }
  .jobs-table th:nth-child(2), .jobs-table td:nth-child(2), .jobs-table th:nth-child(4), .jobs-table td:nth-child(4) { display: none; }
  .stock-table th:nth-child(2), .stock-table td:nth-child(2) { display: table-cell; }
  .stock-table thead th:nth-child(5), .stock-table tbody td:nth-child(5) { display: none; }
  .stock-category-row th { display: table-cell !important; }
  .workshop-detail { padding: 19px; }
  .workshop-top { flex-direction: column; }
  .workshop-top-actions { width: 100%; justify-content: space-between; }
  .workshop-actions .button { flex: 1 1 100%; }
  .timer { width: 100%; }
}

@media print {
  @page { size: A4; margin: 12mm; }
  body { background: #fff; }
  .app-shell, .toast, .template-dialog { display: none !important; }
  #print-sheet { display: block; color: #17211e; font-family: Arial, sans-serif; }
  .print-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 18px; padding: 15px 18px; background: #1b332a !important; color: #fff !important; print-color-adjust: exact; }
  .print-header h1 { margin: 0; font-size: 23px; }
  .print-header p { margin: 4px 0 0; font-size: 10px; opacity: .8; }
  .print-version { color: #e0ad66; font-size: 10px; text-align: right; }
  .print-info { display: grid; grid-template-columns: 2fr 1fr 1fr; margin-bottom: 14px; border: 1px solid #ccd3cf; }
  .print-info div { min-height: 50px; padding: 9px 11px; border-right: 1px solid #ccd3cf; }
  .print-info div:nth-child(3n) { border-right: 0; }
  .print-info span { display: block; margin-bottom: 4px; color: #69746f; font-size: 8px; font-weight: 700; text-transform: uppercase; }
  .print-info strong { font-size: 12px; }
  .print-checks { padding: 8px 10px; border: 1px solid #d4a35e; font-size: 9px; }
  .print-section-title { margin: 16px 0 8px; padding: 7px 10px; background: #f1eee9 !important; font-size: 12px; print-color-adjust: exact; }
  .print-step { margin-bottom: 10px; break-inside: avoid; border: 1px solid #cad1cd; }
  .print-step h3 { margin: 0; padding: 7px 10px; background: #1b332a !important; color: #fff !important; font-size: 11px; print-color-adjust: exact; }
  .print-step-grid { display: grid; grid-template-columns: 2fr 1fr; min-height: 72px; }
  .print-instructions, .print-followup { padding: 9px 10px; font-size: 9px; white-space: pre-line; }
  .print-followup { border-left: 1px solid #cad1cd; background: #f6f3ee !important; print-color-adjust: exact; }
  .print-final { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid #cad1cd; }
  .print-final div { min-height: 44px; padding: 8px; border-right: 1px solid #cad1cd; font-size: 9px; }
  .print-final div:last-child { border-right: 0; }
  .print-final span { display: block; color: #69746f; font-size: 8px; font-weight: 700; text-transform: uppercase; }
  .print-bat { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin-bottom: 10px; }
  .print-bat img { width: 100%; max-height: 160px; object-fit: contain; border: 1px solid #cad1cd; }
}

/* KARTENNCO ERGONOMIE PRODUCTION V1 */
#view-create [hidden]{display:none!important}
#view-create .create-header{margin-bottom:16px}#view-create h1{font-size:clamp(28px,3vw,40px)}
#view-create .form-section{padding:22px;margin-bottom:18px}#view-create .form-section h2{font-size:21px;margin:0 0 18px}
.ux-stage-label{font-size:14px;font-weight:700;color:var(--green-800,#245748);margin:8px 0}
.ux-summary{display:flex;gap:10px 22px;flex-wrap:wrap;padding:13px 18px;background:#eaf1ed;border:1px solid #d0ddd4;border-radius:12px;margin-bottom:18px;font-size:14px}.ux-summary span{color:#4c6257}
.ux-check{display:flex!important;align-items:center;gap:9px!important;align-self:center}.ux-check input{width:18px!important;height:18px!important}
.ux-error{color:#b52e23;font-size:13px;font-weight:600}.ux-warning{padding:10px 14px;border-radius:8px;background:#fff2da;color:#795014;font-size:14px}.ux-help{color:#64756a;font-size:14px}
.ux-bat-state{max-width:330px;margin-top:18px}.ux-footer{position:sticky;bottom:0;z-index:12;display:flex;align-items:center;gap:12px;padding:14px 18px;background:#fff;border:1px solid #d6dfd9;border-radius:12px;box-shadow:0 -5px 20px #123b2010}.ux-footer>span{margin-right:auto;font-size:13px;color:#64756a}
.ux-task-library{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px}.ux-task-chip{display:flex;align-items:center;gap:8px;padding:9px 12px;border:1px solid #cfdcd4;border-radius:10px;background:#f8faf8;color:#193c32;font:inherit;font-size:14px;font-weight:700;cursor:pointer}.ux-task-chip:hover{background:#e8f1eb;border-color:#245748}.ux-task-chip .template-icon,.ux-task-chip .template-image{width:28px!important;height:28px!important;min-width:28px!important}.ux-task-chip img{width:26px!important;height:26px!important;object-fit:contain}.ux-task-chip b{margin-left:5px}
.ux-step-card{margin-bottom:10px}.ux-step-card>summary{display:flex;align-items:center;gap:12px;cursor:pointer;padding:14px;list-style:none}.ux-step-card>summary::-webkit-details-marker{display:none}.ux-task-title{flex:1;min-width:0}.ux-task-title strong,.ux-task-title small{display:block}.ux-task-title small{color:#6a7a70;font-size:12px;margin-top:3px}.ux-step-card .step-card-body{border-top:1px solid #e2e8e3}.ux-step-card .step-controls{grid-template-columns:minmax(0,1fr) 180px}.ux-step-card .step-visual,.ux-step-card .station-icon{flex-shrink:0}
.ux-choice{border:0;padding:0;margin:0 0 24px}.ux-choice legend{font-weight:800;margin-bottom:12px}.ux-choice>label{display:flex;align-items:center;gap:10px;font-weight:500;padding:12px 15px;border:1px solid #d4dfd8;border-radius:10px;margin-bottom:8px;cursor:pointer}.ux-choice input{width:18px;height:18px;accent-color:#245748}
.ux-workshop-summary{position:relative;border:1px solid #c5d8cb;border-left:5px solid #245748;background:#f1f7f2;border-radius:12px;padding:16px 20px;margin:0 0 20px}.ux-workshop-summary>div{display:flex;gap:10px 24px;flex-wrap:wrap;align-items:center}.ux-workshop-summary p{margin:8px 0;white-space:pre-line}.ux-workshop-summary .ux-bat-tag{display:inline-block;font-size:13px;font-weight:700}.ux-bat-thumb{display:flex;align-items:center;gap:12px;margin-top:10px;padding:0;border:0;background:none;color:#245748;cursor:pointer}.ux-bat-thumb img{width:88px;height:62px;object-fit:contain;border:1px solid #d5dfd7;border-radius:6px;background:white}.ux-bat-thumb span{font-size:13px;font-weight:700}
.ux-packing-plan{padding:12px 15px;border-radius:9px;background:#fff3de;margin-bottom:16px;white-space:pre-line}.ux-pickup-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.ux-pickup-fields .span-2{grid-column:1/-1}
@media(max-width:700px){#view-create .form-grid{grid-template-columns:1fr!important}#view-create .span-2{grid-column:auto}.ux-footer{padding:10px;gap:8px}.ux-footer>span{display:none}.ux-footer .button{padding:12px}.ux-step-card>summary{gap:7px;padding:10px}.ux-step-card .step-controls,.ux-pickup-fields{grid-template-columns:1fr}.ux-pickup-fields .span-2{grid-column:auto}.ux-task-chip{font-size:13px}.ux-summary{gap:6px 14px}}

#ux-packing-notes{margin-bottom:22px}
body:has(#view-create.is-visible) #toast{bottom:100px}
@media(max-width:700px){.ux-footer .button{white-space:normal;text-align:center}}

/* KARTENNCO FINALISATION PRODUCTION V1 */
#view-create .create-header{margin:0 0 12px;gap:12px;align-items:center}#view-create #create-title{font-size:28px;line-height:1.15;margin:0}#view-create .ux-stage-label{margin:5px 0 0;font-size:13px}#view-create .ux-summary{padding:10px 14px;margin-bottom:14px}#view-create .ux-order-field{grid-column:1/-1}
#view-create .ux-step-card .step-card-body{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;padding:16px}#view-create .ux-step-card .step-controls{display:block}#view-create .ux-step-card textarea{min-height:100px;height:100px;width:100%;resize:vertical}
#view-create .ux-edit-title{display:flex;align-items:center;gap:5px;min-width:0}#view-create .ux-edit-title input{width:100%;min-width:0;height:36px;padding:4px 6px;border:1px solid transparent;border-radius:5px;background:transparent;font:inherit;font-weight:750;color:inherit}#view-create .ux-edit-title input:hover,#view-create .ux-edit-title input:focus{border-color:#c9d8cf;background:white}#view-create .ux-edit-title>span{color:#7d8b82;font-size:15px}
#view-create .ux-duration{display:flex;align-items:center;gap:5px;font-size:12px;white-space:nowrap}#view-create .ux-duration input{width:68px;height:36px;padding:5px 7px;font-size:14px}#view-create .step-assignees{border:0;padding:0;margin:0;display:flex;gap:8px 16px;flex-wrap:wrap}#view-create .step-assignees legend{font-size:13px;margin-bottom:8px;color:#64756a}#view-create .step-assignees label{font-size:14px;gap:6px}#view-create .step-assignees input{width:17px;height:17px}.ux-order-link{margin-bottom:12px;font-size:13px}
@media(max-width:700px){#view-create #create-title{font-size:24px}#view-create .ux-step-card>summary{flex-wrap:wrap}#view-create .ux-task-title{flex-basis:calc(100% - 90px)}#view-create .ux-duration{margin-left:22px}#view-create .step-actions{margin-left:auto}#view-create .ux-step-card .step-card-body{padding:12px}#view-create .ux-duration>span:first-child{display:none}}

/* KARTENNCO TABLEAU VISUEL V1 */
#view-workshop .page-header{margin-bottom:18px;align-items:center}#view-workshop #workshop-title{font-size:32px;margin:0}#view-workshop .page-header .eyebrow,#view-workshop .page-subtitle{display:none}#view-workshop .job-queue{display:none!important}#workshop-layout{display:block!important}#workshop-layout[hidden]{display:none!important}#workshop-detail{min-width:0}#wb-shell{margin-bottom:18px}#wb-back[hidden]{display:none}#wb-back{margin-bottom:12px}.wb-detail-open .wb-toolbar,.wb-detail-open #wb-columns{display:none}.wb-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:20px}#wb-tabs{display:flex;gap:6px;flex-wrap:wrap}#wb-tabs button{border:1px solid #cdd9d2;border-radius:9px;padding:10px 13px;font:inherit;background:white;color:#254438;cursor:pointer}#wb-tabs button.active{background:#234d3d;color:white}#wb-tabs b{font-size:12px;margin-left:6px}.wb-search{flex:1;min-width:200px}.wb-search input{width:100%;height:42px}.wb-search input,.wb-toolbar select{height:42px;padding:9px 12px;border:1px solid #cdd9d2;border-radius:9px;background:white;color:#254438;font:inherit;font-size:14px}#wb-columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:start}.wb-column{background:#e9eeeb;border:1px solid #d8dfda;border-radius:14px;min-width:0;padding:14px}.wb-column h2{display:flex;align-items:center;justify-content:space-between;font-size:18px;margin:0 0 14px}.wb-column h2 b{font-size:13px;background:white;border-radius:7px;padding:3px 8px}.wb-active{background:#e4eee8}.wb-waiting{background:#f2ecdf}.wb-stack{display:grid;gap:12px}.wb-card{min-width:0;border:1px solid #d3ded6;border-top:4px solid #b88d40;border-radius:10px;background:#fff;box-shadow:0 3px 8px #18372709;overflow:hidden}.wb-active .wb-card{border-top-color:#3e7b5e}.wb-waiting .wb-card{border-top-color:#b77b34}.wb-card.wb-late{border-top-color:#bd4a35}.wb-open{display:block;text-align:left;border:0;background:transparent;padding:16px;width:100%;color:#1b3027;font:inherit;cursor:pointer;overflow-wrap:anywhere}.wb-open>strong{display:block;font-size:19px;line-height:1.25;margin-bottom:5px}.wb-open>span{font-size:13px;color:#67746d}.wb-meta{display:flex;gap:8px;justify-content:space-between;font-size:12px;margin:15px 0 10px;flex-wrap:wrap}.wb-deadline{font-size:13px;font-weight:700}.wb-late .wb-deadline{color:#a43c2a}.wb-alert{display:block;margin-top:7px;color:#86601f}.wb-progress{height:4px;background:#e8efea;border-radius:3px;margin-top:14px;overflow:hidden}.wb-progress span{display:block;height:100%;background:#527c62}.wb-priority{display:flex;align-items:center;gap:4px;padding:6px 10px;border-top:1px solid #edf0ed;color:#77857c;font-size:11px}.wb-priority>span{margin-right:auto;cursor:grab}.wb-priority button{background:transparent;border:1px solid #dbe3dc;border-radius:5px;width:28px;height:25px;cursor:pointer}.wb-empty{font-size:13px;color:#748078;padding:12px 0}.wb-dragging{opacity:.45}#wb-columns.wb-single{grid-template-columns:1fr}#wb-columns.wb-single .wb-stack{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}#view-create .drag-handle{touch-action:none;cursor:grab;padding:10px;border-radius:6px}#view-create .ux-step-card.ux-dragging{opacity:.5}#view-create .ux-step-card.ux-drop-target{outline:2px dashed #b88d40;outline-offset:3px}
@media(max-width:1050px){#wb-columns{gap:10px}.wb-column{padding:10px}.wb-open{padding:12px}.wb-open>strong{font-size:17px}}
@media(max-width:760px){#wb-columns{grid-template-columns:1fr}.wb-toolbar{align-items:stretch}.wb-search{flex-basis:100%}#view-workshop .page-header{align-items:stretch}#view-workshop #workshop-title{font-size:26px}}

.pc-editor{display:flex;align-items:end;gap:10px}.pc-editor label{flex:1;min-width:0}.pc-editor input{width:100%}.pc-folder{margin-bottom:14px}.pc-folder small{display:block;margin-top:5px;overflow-wrap:anywhere;color:#64756a}#pc-setup{max-width:650px;width:calc(100% - 32px);border:1px solid #d2ddd5;border-radius:14px;padding:25px;color:#183d2c}#pc-setup::backdrop{background:#102c2070}#pc-setup li{margin-bottom:12px;line-height:1.5}.pc-actions{display:flex;gap:10px;flex-wrap:wrap}#pc-message{color:#91632e;font-size:14px}#pc-setup .button{white-space:normal}#wb-shell button:focus-visible,.wb-open:focus-visible{outline:3px solid #bc8b38;outline-offset:2px}@media(max-width:700px){.pc-editor{align-items:stretch;flex-direction:column}}

/* KARTENNCO AJUSTEMENTS PRODUCTION V1 */
.wb-client-row{display:flex;align-items:baseline;justify-content:space-between;gap:6px 14px;flex-wrap:wrap;margin:6px 0 10px;font-size:13px}.wb-client-row>span{color:#67746d;min-width:0;overflow-wrap:anywhere}.wb-client-row>b{white-space:nowrap;font-size:12px}#view-create #save-production.ux-save-edit{background:#2d7a57;border-color:#2d7a57;color:white}#view-create #save-production.ux-save-edit:hover{background:#246445}.pc-browse-feedback{margin:0;color:#765622;font-size:13px;line-height:1.4}@media(max-width:700px){#view-create .ux-footer{flex-wrap:wrap}#view-create #save-production.ux-save-edit{flex:1;min-width:150px}}
