/* Kalinka — stil după modelul „sisteme.online”: meniu verde închis, accent auriu, fundal crem cu caroiaj. */
:root {
  --bg: #f7f5ef; --grid: rgba(16, 60, 42, .045); --card: #ffffff; --card-2: #fbfaf6;
  --ink: #12211b; --muted: #66706a; --line: #e6e3da; --line-2: #efece4;
  --green-900: #062418; --green-800: #0b3326; --green-700: #0f4231; --green-600: #17583f; --green-100: #e6efe9;
  --gold: #e6be5c; --gold-ink: #2a2005; --gold-100: #fbf1d9;
  --warn: #b42318; --warn-bg: #fdecea; --ok-bg: #e8f4ec; --edit: #fff3a6; --pos: #e3f4e6; --neg: #fde8e7;
  --radius: 22px; --shadow: 0 1px 2px rgba(16, 40, 30, .04), 0 8px 24px rgba(16, 40, 30, .06);
  --font: "DM Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --serif: "DM Serif Display", Georgia, serif;
}
* { box-sizing: border-box; }
html, body { height: 100%; }
body { margin: 0; font: 15.5px/1.5 var(--font); color: var(--ink); background-color: var(--bg);
  background-image: linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);
  background-size: 28px 28px; }
a { color: var(--green-600); }
h1 { font-size: 1.5rem; margin: .2rem 0 .8rem; letter-spacing: -.01em; }
h2 { font-size: 1.12rem; margin: 0 0 .4rem; }
.serif { font-family: var(--serif); font-weight: 400; letter-spacing: 0; }
.muted { color: var(--muted); } .small { font-size: .86rem; }
.ic { flex: none; vertical-align: middle; }
[hidden] { display: none !important; }

/* ---------------- cadru: meniu lateral + bară sus */
.app { display: grid; grid-template-columns: 280px 1fr; min-height: 100vh; }
.side { background: var(--green-900); color: #e9efe9; display: flex; flex-direction: column; padding: 22px 14px 14px;
  position: sticky; top: 0; height: 100vh; overflow-y: auto; z-index: 30; }
.side-label { font-size: .74rem; letter-spacing: .22em; text-transform: uppercase; color: #9fb3a8; margin: 0 12px 14px; }
.side-nav { display: flex; flex-direction: column; gap: 4px; }
.side-nav a { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 16px; color: #e9efe9;
  text-decoration: none; font-weight: 500; }
.side-nav a:hover { background: rgba(255, 255, 255, .06); }
.side-nav a.on { background: var(--gold); color: var(--gold-ink); font-weight: 600; }
.side-nav a span { flex: 1; }
.pill { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 7px; border-radius: 999px;
  background: var(--gold); color: var(--gold-ink); font-size: .75rem; font-weight: 700; }
.side-nav a.on .pill { background: var(--green-900); color: var(--gold); }
.pill.at { background: var(--green-700); color: #fff; }
.side-user { margin-top: auto; display: flex; align-items: center; gap: 10px; padding: 14px 8px 4px; border-top: 1px solid rgba(255, 255, 255, .08); }
.side-user .who { flex: 1; min-width: 0; line-height: 1.2; }
.side-user .who b { display: block; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.side-user .who small { color: #9fb3a8; }
.side-user .out { color: #9fb3a8; }
.av { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; flex: none; font-weight: 700;
  font-size: .85rem; background: #1d4535; color: #e9efe9; letter-spacing: .02em; }
.av.sm { width: 38px; height: 38px; font-size: .78rem; background: #eceae3; color: #3d4a43; }
.av.sys { background: var(--green-800); color: var(--gold); }
.shell { min-width: 0; display: flex; flex-direction: column; }
.topbar { display: flex; align-items: center; gap: 12px; padding: 12px 22px;
  background: linear-gradient(90deg, var(--green-900), var(--green-700)); position: sticky; top: 0; z-index: 20; }
.menu-btn { display: inline-flex; align-items: center; gap: 8px; background: rgba(255, 255, 255, .06); color: #fff; border: 0;
  border-radius: 14px; padding: 10px 14px; font: 600 1rem var(--font); cursor: pointer; }
.topbar .brand { display: none; align-items: center; gap: 8px; color: #fff; text-decoration: none; font-weight: 700; }
.topbar .brand img { width: 26px; }
.badge-user { margin-left: auto; width: 46px; height: 46px; border-radius: 14px; background: var(--gold); color: var(--gold-ink);
  display: grid; place-items: center; font-weight: 700; font-size: .85rem; box-shadow: 0 2px 6px rgba(0, 0, 0, .2); }
main { padding: 28px clamp(14px, 3vw, 40px) 40px; max-width: 1500px; width: 100%; margin: 0 auto; }
main.bare { max-width: 520px; }
.scrim { display: none; }
body.side-hidden .app { grid-template-columns: 1fr; }
body.side-hidden .side { display: none; }

/* ---------------- elemente generale */
.card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px 22px; box-shadow: var(--shadow); margin: 0 0 18px; }
.btn, button { font: inherit; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 16px; border-radius: 14px;
  border: 1px solid var(--line); background: var(--card); color: var(--ink); cursor: pointer; text-decoration: none; font-weight: 500; }
.btn:hover { border-color: #cfcbbf; }
.btn.primary, button.primary { background: var(--green-800); color: #fff; border: 1px solid var(--green-800); font-weight: 600; padding: 10px 16px; border-radius: 14px; cursor: pointer; }
.btn.primary:hover, button.primary:hover { background: var(--green-700); }
.btn.ghost { background: transparent; }
.btn.danger { color: var(--warn); border-color: #f2c6c2; background: #fff7f6; }
.btn.sm { padding: 7px 12px; font-size: .9rem; border-radius: 12px; }
.btn.wide { width: 100%; justify-content: flex-start; }
button.link, .link { border: 0; background: none; color: var(--green-600); padding: 0; cursor: pointer; font-weight: 500; }
input, select, textarea { font: inherit; color: var(--ink); }
input:not([type=checkbox]):not([type=radio]):not([type=file]), select { padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--card); max-width: 100%; }
input:focus, select:focus, textarea:focus { outline: 2px solid color-mix(in srgb, var(--green-600) 35%, transparent); outline-offset: 1px; }
label { display: block; margin: .5rem 0; }
label.check { display: flex; gap: 8px; align-items: center; }
.row { display: flex; flex-wrap: wrap; gap: 8px; align-items: end; margin-top: 10px; }
.error { color: var(--warn); background: var(--warn-bg); padding: 10px 12px; border-radius: 12px; }
.ok { background: var(--ok-bg); padding: 10px 12px; border-radius: 12px; }
.empty { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; padding: 60px 16px; color: var(--muted); grid-column: 1 / -1; }
.empty .ic { color: #a8b3ac; margin-bottom: 6px; }
.empty b { color: var(--ink); font-size: 1.08rem; }
.tagchip { display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border-radius: 999px; font-size: .76rem; font-weight: 600; background: #f1efe8; color: #4a554f; }
.tagchip.public { background: #e3f2e8; color: #17583f; }
.tagchip.private { background: #fbeee0; color: #9a5a12; }
.tagchip.gold { background: var(--gold-100); color: #8a6400; }
.tagchip.imp { background: var(--warn-bg); color: var(--warn); }
.search-pill { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 999px; padding: 0 14px; background: var(--card); margin: 0; color: var(--muted); }
.search-pill input { border: 0 !important; outline: 0 !important; padding: 11px 0 !important; background: transparent !important; flex: 1; min-width: 0; }
.search-pill.sm input { padding: 8px 0 !important; }
.chips { display: flex; gap: 10px; flex-wrap: wrap; }
.chip { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 999px; border: 1px solid var(--line);
  text-decoration: none; color: var(--ink); background: var(--card); font-weight: 500; }
.chip b { background: #eceae3; border-radius: 999px; padding: 0 8px; font-size: .8rem; }
.chip.on { background: var(--green-800); border-color: var(--green-800); color: #fff; }
.chip.on b { background: rgba(255, 255, 255, .15); }
.round-btn { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line); background: var(--card); display: grid; place-items: center; color: var(--ink); cursor: pointer; flex: none; text-decoration: none; }
dialog.dlg { border: 0; border-radius: var(--radius); padding: 22px; width: min(560px, 94vw); box-shadow: 0 20px 60px rgba(0, 0, 0, .25); }
dialog.dlg::backdrop { background: rgba(6, 36, 24, .45); }
dialog.dlg input:not([type=checkbox]):not([type=radio]), dialog.dlg select { width: 100%; }
.dlg-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 16px; align-items: center; }
.dlg-actions .grow { flex: 1; }
.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.people { max-height: 320px; overflow-y: auto; margin-top: 8px; }
.person { display: flex; align-items: center; gap: 10px; padding: 8px 6px; border-radius: 12px; margin: 0; cursor: pointer; }
.person:hover { background: var(--card-2); }
.person > span:last-of-type { flex: 1; min-width: 0; line-height: 1.25; }
.person small { display: block; }
#toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); background: var(--green-900); color: #fff; padding: 11px 18px; border-radius: 14px; opacity: 0; transition: opacity .2s; pointer-events: none; max-width: 90vw; z-index: 99; }
#toast.show { opacity: .97; } #toast.err { background: var(--warn); }

/* ---------------- hub chat */
.hero { display: flex; align-items: center; gap: 24px; justify-content: space-between; flex-wrap: wrap;
  background: radial-gradient(120% 140% at 85% 20%, #2a6a4e 0%, var(--green-800) 45%, var(--green-900) 100%);
  color: #eef4ef; border-radius: 28px; padding: 30px 36px; box-shadow: var(--shadow); margin-bottom: 22px; }
.hero h1 { font-size: clamp(1.9rem, 3.4vw, 2.6rem); margin: 4px 0 8px; color: #fff; }
.hero p { margin: 0; max-width: 720px; color: #d4e2d8; font-size: 1.05rem; }
.eyebrow { font-size: .78rem; letter-spacing: .24em; text-transform: uppercase; color: var(--gold); font-weight: 700; }
.hero-search { display: flex; background: #fff; border-radius: 999px; overflow: hidden; min-width: min(320px, 100%); }
.hero-search input { border: 0 !important; padding: 13px 18px !important; flex: 1; border-radius: 0 !important; }
.hero-search button { border: 0; background: var(--gold); color: var(--gold-ink); padding: 0 18px; cursor: pointer; }
.pushbox { display: flex; align-items: center; gap: 16px; justify-content: space-between; flex-wrap: wrap; background: var(--gold-100); border-color: #f0dfb3; }
.pushbox p { margin: 4px 0 0; }
.hub { display: grid; grid-template-columns: 330px 1fr; gap: 22px; align-items: start; }
.hub-cats nav { display: flex; flex-direction: column; gap: 6px; margin: 16px 0; }
.hub-cats nav a { display: flex; align-items: center; gap: 12px; padding: 13px 16px; border-radius: 16px; color: var(--ink); text-decoration: none; font-weight: 500; font-size: 1.05rem; }
.hub-cats nav a:hover { background: var(--card-2); }
.hub-cats nav a.on { background: var(--green-800); color: #fff; }
.hub-new { display: flex; flex-direction: column; gap: 8px; border-top: 1px solid var(--line-2); padding-top: 14px; }
.hub-list { padding: 0; overflow: hidden; }
.hub-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; padding: 22px 26px 0; }
.hub-head .search-pill { width: min(420px, 100%); }
.hub-list > .chips { padding: 16px 26px 20px; border-bottom: 1px solid var(--line-2); }
.conv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; padding: 22px 26px 26px; }
.conv { display: flex; gap: 14px; align-items: flex-start; padding: 18px; border: 1px solid var(--line); border-radius: 20px; background: var(--card-2);
  text-decoration: none; color: var(--ink); box-shadow: 0 1px 2px rgba(0, 0, 0, .03); transition: transform .1s, box-shadow .1s; }
.conv:hover { transform: translateY(-1px); box-shadow: var(--shadow); }
.conv-ic { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; background: #eceae3; color: #3d4a43; flex: none; font-weight: 700; font-size: .85rem; }
.conv-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.conv-body b { font-size: 1.08rem; }
.conv-desc { color: var(--muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.conv-meta { display: flex; gap: 8px; align-items: center; margin-top: 6px; }
.results { margin: 16px 26px; border: 1px solid var(--line); border-radius: 18px; padding: 10px 14px; background: var(--card-2); }
.result { display: block; width: 100%; text-align: left; padding: 10px 6px; border: 0; border-bottom: 1px solid var(--line-2); background: none; color: var(--ink); text-decoration: none; cursor: pointer; }
.result:last-child { border-bottom: 0; }
.result small { color: var(--muted); }
mark { background: var(--gold-100); color: inherit; border-radius: 3px; padding: 0 2px; }
.sp-head { display: flex; justify-content: space-between; align-items: center; padding-bottom: 6px; }
.mention-list { padding: 12px 18px 20px; }
.mention-item { display: flex; gap: 12px; padding: 12px; border-radius: 16px; text-decoration: none; color: var(--ink); border-bottom: 1px solid var(--line-2); }
.mention-item:hover { background: var(--card-2); }

/* ---------------- conversație */
body.room-mode main { padding-bottom: 18px; }
.room { display: flex; flex-direction: column; height: calc(100vh - 70px - 46px); min-height: 520px; padding: 0; overflow: hidden; position: relative; }
.room-head { display: flex; align-items: center; gap: 14px; padding: 18px 22px; border-bottom: 1px solid var(--line-2); flex-wrap: wrap; }
.room-title { flex: 1; min-width: 200px; }
.room-title b { font-size: 1.25rem; margin-right: 6px; }
.room-title small { display: block; }
.room-tools { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.room-tools .search-pill { width: 220px; }
.sel.sm { padding: 7px 10px !important; border-radius: 12px; font-size: .88rem; }
.room-filter { display: flex; justify-content: flex-end; padding: 10px 22px; border-bottom: 1px solid var(--line-2); }
.tag-select { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 999px; padding: 0 6px 0 14px; margin: 0; color: var(--muted); background: var(--card); }
.tag-select select { border: 0 !important; background: transparent !important; padding: 9px 8px !important; min-width: 150px; }
.tag-select.sm select { min-width: 110px; padding: 7px 6px !important; }
.side-panel { position: absolute; right: 18px; top: 140px; width: min(380px, 92%); max-height: 55%; overflow-y: auto; z-index: 5;
  background: var(--card); border: 1px solid var(--line); border-radius: 18px; padding: 12px 14px; box-shadow: 0 12px 40px rgba(0, 0, 0, .14); }
.msgs { flex: 1; overflow-y: auto; padding: 18px 26px; display: flex; flex-direction: column; gap: 14px;
  background: linear-gradient(180deg, #fbfaf7, #f6f5f0); }
.day { align-self: center; font-size: .8rem; color: var(--muted); background: #fff; border: 1px solid var(--line-2); padding: 3px 12px; border-radius: 999px; }
.msg { display: flex; gap: 12px; align-items: flex-start; max-width: min(860px, 100%); }
.msg.mine { flex-direction: row-reverse; align-self: flex-end; }
.msg-main { display: flex; flex-direction: column; min-width: 0; max-width: 100%; }
.msg.mine .msg-main { align-items: flex-end; }
.msg-meta { font-size: .86rem; color: var(--muted); margin-bottom: 5px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.msg-meta b { color: var(--ink); }
.bubble { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 12px 16px; box-shadow: 0 1px 2px rgba(0, 0, 0, .04); max-width: 100%; overflow-wrap: anywhere; font-size: 1.02rem; }
.msg.mine .bubble { background: var(--green-800); color: #f1f6f2; border-color: var(--green-800); }
.msg.mine .bubble a { color: var(--gold); }
.msg.sys .bubble { border-color: #cfe0d6; background: #f4faf6; }
.msg.imp .bubble { box-shadow: inset 4px 0 0 #d92d20; }
.bubble .img img { max-width: min(480px, 100%); max-height: 420px; border-radius: 12px; display: block; margin: 2px 0 6px; }
.bubble .tx { white-space: normal; }
.quote { border-left: 3px solid var(--gold); background: rgba(0, 0, 0, .04); padding: 6px 10px; border-radius: 8px; margin-bottom: 8px; font-size: .9rem; cursor: pointer; }
.msg.mine .quote { background: rgba(255, 255, 255, .08); }
.mention { background: var(--gold-100); color: #7a5600; border-radius: 6px; padding: 0 4px; font-weight: 600; }
.mention.me { background: var(--gold); color: var(--gold-ink); }
.msg.mine .mention { background: rgba(230, 190, 92, .25); color: var(--gold); }
.doclink { display: inline-block; margin-top: 6px; font-weight: 600; }
.filecard { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 14px; background: rgba(0, 0, 0, .04); text-decoration: none; color: inherit; margin-bottom: 6px; }
.filecard small { display: block; opacity: .75; }
.msg.mine .filecard { background: rgba(255, 255, 255, .08); color: #fff; }
.voice-title { font-weight: 700; margin-bottom: 8px; }
.voice audio { width: min(280px, 100%); height: 40px; display: block; }
.transcript { margin-top: 10px; background: rgba(0, 0, 0, .05); border-radius: 12px; padding: 8px 12px; }
.msg.mine .transcript { background: rgba(255, 255, 255, .07); }
.transcript summary { cursor: pointer; font-weight: 600; font-size: .9rem; }
.tr-text { margin: 8px 0; line-height: 1.55; }
.pill-btn { display: inline-flex; align-items: center; gap: 6px; border: 0; border-radius: 999px; padding: 6px 12px; background: #f1efe8; color: var(--ink); font-size: .85rem; cursor: pointer; }
.ai-note { margin-top: 10px; border: 1px dashed #c9d9cf; border-radius: 12px; padding: 8px 12px; font-size: .93rem; background: #f6fbf8; color: var(--ink); }
.msg-actions { display: flex; gap: 6px; margin-top: 6px; opacity: 0; transition: opacity .15s; flex-wrap: wrap; }
.msg:hover .msg-actions, .msg:focus-within .msg-actions { opacity: 1; }
.msg-actions button { display: inline-flex; align-items: center; gap: 5px; border: 1px solid transparent; background: none; border-radius: 999px; padding: 4px 10px; color: var(--muted); cursor: pointer; font-size: .86rem; }
.msg-actions button:hover { background: #fff; border-color: var(--line); color: var(--ink); }
.msg-actions button.gold { background: var(--gold-100); border-color: #f0dfb3; color: #8a6400; }
.msg.flash .bubble { animation: flash 1.6s ease; }
@keyframes flash { 0%, 40% { box-shadow: 0 0 0 4px var(--gold); } 100% { box-shadow: none; } }
.composer-wrap { padding: 12px 22px 10px; border-top: 1px solid var(--line-2); position: relative; background: var(--card); }
.composer { display: flex; align-items: flex-end; gap: 10px; border: 1px solid var(--line); border-radius: 22px; padding: 8px 8px 8px 18px; background: #fff; box-shadow: var(--shadow); }
.composer textarea { flex: 1; border: 0; outline: 0 !important; resize: none; padding: 10px 0; font-size: 1.05rem; max-height: 160px; background: transparent; min-width: 0; }
.composer-tools { display: flex; align-items: center; gap: 4px; }
.tool { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; border: 0; background: none; color: #46524b; cursor: pointer; margin: 0; }
.tool:hover { background: var(--card-2); }
.tool.imp { font-size: 1.1rem; }
.tool.imp input { display: none; }
.tool.imp:has(input:checked) { background: var(--warn-bg); }
.send { width: 50px; height: 50px; border-radius: 50%; border: 0; background: var(--green-800); color: #fff; display: grid; place-items: center; cursor: pointer; }
.send:disabled { opacity: .5; }
.hint { margin: 8px 4px 0; font-size: .8rem; color: var(--muted); }
.reply-bar, .attach-preview { display: flex; align-items: center; gap: 10px; justify-content: space-between; background: var(--card-2); border: 1px solid var(--line); border-radius: 14px; padding: 8px 12px; margin-bottom: 8px; }
.attach-preview img { max-height: 90px; border-radius: 10px; }
.mention-pop { position: absolute; left: 22px; bottom: calc(100% - 4px); width: min(460px, 92%); max-height: 420px; overflow-y: auto; background: #fff; border: 1px solid var(--line); border-radius: 22px; box-shadow: 0 16px 40px rgba(0, 0, 0, .14); padding: 10px; z-index: 6; }
.mp-title { font-size: .76rem; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); font-weight: 700; padding: 6px 10px 8px; }
.mp-item { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; padding: 10px; border: 0; border-radius: 14px; background: none; cursor: pointer; color: var(--ink); }
.mp-item small { display: block; color: var(--muted); }
.mp-item.on, .mp-item:hover { background: #f1efe8; }
.rec-bar { display: flex; align-items: center; gap: 12px; border: 1px solid #f2c6c2; background: #fff7f6; border-radius: 22px; padding: 12px 16px; }
.rec-dot { width: 12px; height: 12px; border-radius: 50%; background: #d92d20; animation: pulse 1s infinite; }
.rec-bar b { margin-right: auto; font-variant-numeric: tabular-nums; }
@keyframes pulse { 50% { opacity: .3; } }

/* ---------------- documente (planificări, comenzi) */
.fab-head { background: var(--green-900); color: #fff; border-radius: 22px; padding: 20px 24px; margin-bottom: 14px; }
.fab-head .eyebrow { color: var(--gold); font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 700; }
.fab-head h1 { color: #fff; margin: 4px 0 10px; font-size: 1.6rem; }
.fab-meta { display: flex; flex-wrap: wrap; gap: 8px 18px; color: #e9efe9; }
.fab-alert { padding: 12px 16px; border-radius: 16px; margin: 0 0 14px; background: var(--warn-bg); color: var(--warn); }
.fab-alert.info { background: var(--gold-100); color: var(--gold-ink); } .fab-alert.ok { background: var(--ok-bg); color: var(--green-700); }
.fab-table .grid th.grp-fab { background: var(--gold-100); } .fab-table .grid th.grp-final { background: var(--green-100); }
.fab-table .grid td.big { font-size: 1.1rem; font-weight: 700; text-align: center; }
.fab-table .grid td.pack { font-size: .8rem; color: var(--muted); min-width: 150px; }
.fab-table .grid input.num { width: 100px; } .fab-table .grid input[type=date] { width: 140px; }
.fab-table .grid textarea { width: 190px; font: inherit; font-size: .85rem; border: 1px solid var(--line); border-radius: 10px; padding: 6px; }
.fab-table .grid input[type=checkbox] { width: 22px; height: 22px; }
.fab-table .grid tr.done th { box-shadow: inset 4px 0 0 var(--green-600); } .fab-table .grid tr.short td { background: var(--warn-bg); }
/* pe telefon: fiecare produs e un card — sus ce e de livrat, dedesubt câmpurile de completat */
@media (max-width: 700px) {
  .fab-table { overflow: visible; background: none; border: 0; box-shadow: none; }
  .fab-table table, .fab-table tbody, .fab-table tr, .fab-table td, .fab-table th { display: block; width: auto; }
  .fab-table thead { display: none; }
  .fab-table tr { background: var(--card); border: 1px solid var(--line); border-radius: 18px; margin: 0 0 12px; padding: 12px 14px;
    display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; }
  .fab-table .grid th.sticky { grid-column: 1 / -1; position: static; font-size: 1.1rem; background: none; padding: 0; box-shadow: none; }
  .fab-table .grid td { padding: 0; border: 0; text-align: left !important; background: none; }
  .fab-table .grid td::before { content: attr(data-label); display: block; font-size: .72rem; color: var(--muted); text-transform: uppercase;
    letter-spacing: .06em; margin-bottom: 2px; }
  .fab-table .grid td.pack { grid-column: 1 / -1; }
  .fab-table .grid td.big { font-size: 1.25rem; }
  .fab-table .grid td[data-label="Procesat efectiv"] { grid-column: 1 / -1; background: var(--gold-100); border-radius: 12px; padding: 8px 10px; }
  .fab-table .grid input.num { width: 100%; font-size: 1.15rem; }
  .fab-table .grid input.txt, .fab-table .grid input[type=date], .fab-table .grid textarea { width: 100%; }
  .fab-table .grid td[data-label="Țara de origine"] { grid-column: 1 / -1; }
  .fab-table tr.short { background: var(--warn-bg); } .fab-table tr.done { border-left: 5px solid var(--green-600); }
  .fab-table .grid tr.done th { box-shadow: none; }
}
/* comanda fermă la fabrică (20.10.2026): toată comanda pe un ecran — tabel pe lățimea paginii, fără bară
   orizontală, rânduri joase; când zona e îngustă (telefon, tabletă cu meniul deschis) fiecare produs e un card */
.fd { container: fd / inline-size; }
.fab-table:has(.fd-grid) { overflow-x: visible; }
.fd-grid { width: 100%; table-layout: fixed; }
.fd-grid col.c-prod { width: 26%; } .fd-grid col.c-qty { width: 11%; } .fd-grid col.c-pal { width: 5%; }
.fd-grid col.c-proc { width: 10%; } .fd-grid col.c-lot { width: 14%; } .fd-grid col.c-orig { width: 14%; }
.fd-grid col.c-date { width: 15%; } .fd-grid col.c-bio { width: 5%; }
.fab-table .fd-grid th, .fab-table .fd-grid td { white-space: normal; padding: 4px 6px; line-height: 1.25; }
.fab-table .fd-grid thead th { font-size: .78rem; } .fab-table .fd-grid thead th small { display: block; font-weight: 400; color: var(--muted); }
.fab-table .fd-grid th.sticky { position: static; font-size: .92rem; }
.fab-table .fd-grid th.sticky small.um { display: inline; }
.fab-table .fd-grid th.sticky small.pack { display: block; font-size: .7rem; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fab-table .fd-grid td.big { font-size: 1.05rem; }
.fab-table .fd-grid td.big small.planline { display: block; font-size: .7rem; font-weight: 400; color: var(--muted); white-space: nowrap; }
.fab-table .fd-grid input.num, .fab-table .fd-grid input.txt, .fab-table .fd-grid input[type=date], .fab-table .fd-grid textarea {
  width: 100%; min-width: 0; box-sizing: border-box; font-size: .88rem; padding: 5px 6px; }
.fab-table .fd-grid textarea { resize: vertical; }
.fab-table .fd-grid .lots-cell .lot-row { margin-bottom: 3px; gap: 4px; }
.fab-table .fd-grid .lots-cell .lot-row input.txt { flex: 1 1 0; min-width: 0; width: auto; }
.fab-table .fd-grid .lots-cell .lot-row input.num { flex: 0 0 4.6em; min-width: 0; width: 4.6em; }
.fab-table .fd-grid .lots-cell .lot-add { display: inline-block; flex: none; margin: 0; padding: 4px 7px; font-size: .8rem; }
.fab-table .fd-grid .lots-cell .lot-del { min-width: 24px; min-height: 24px; padding: 0 2px; font-size: 15px; }
.date-all { display: block; margin: 3px auto 0; border: 1px dashed #b89a4a; background: #fff; border-radius: 8px; font-size: .72rem; padding: 1px 6px; cursor: pointer; }
@container fd (min-width: 861px) {
  .fd .fd-steps .fab-btn { padding: 10px 14px; font-size: 1rem; border-radius: 14px; }
  .fd .fd-steps { margin-bottom: 10px; } .fd .fab-alert { padding: 8px 14px; margin-bottom: 10px; }
}
@container fd (max-width: 860px) {
  .fd .fab-table { overflow: visible; background: none; border: 0; box-shadow: none; }
  .fd .fab-table table, .fd .fab-table tbody, .fd .fab-table tr, .fd .fab-table td, .fd .fab-table th { display: block; width: auto; }
  .fd .fab-table thead { display: none; }
  .fd .fab-table tr { background: var(--card); border: 1px solid var(--line); border-radius: 18px; margin: 0 0 12px; padding: 12px 14px;
    display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; }
  .fd .fab-table .grid th.sticky { grid-column: 1 / -1; position: static; font-size: 1.1rem; background: none; padding: 0; box-shadow: none; }
  .fd .fab-table .grid td { padding: 0; border: 0; text-align: left !important; background: none; }
  .fd .fab-table .grid td::before { content: attr(data-label); display: block; font-size: .72rem; color: var(--muted); text-transform: uppercase;
    letter-spacing: .06em; margin-bottom: 2px; }
  .fd .fab-table .grid td.pack { grid-column: 1 / -1; }
  .fd .fab-table .grid td.big { font-size: 1.25rem; }
  .fd .fab-table .grid td[data-label="Procesat efectiv"] { grid-column: 1 / -1; background: var(--gold-100); border-radius: 12px; padding: 8px 10px; }
  .fd .fab-table .grid input.num { width: 100%; font-size: 1.15rem; }
  .fd .fab-table .grid input.txt, .fd .fab-table .grid input[type=date], .fd .fab-table .grid textarea { width: 100%; }
  .fd .fab-table .grid td[data-label="Țara de origine"] { grid-column: 1 / -1; }
  .fd .fab-table tr.short { background: var(--warn-bg); } .fd .fab-table tr.done { border-left: 5px solid var(--green-600); }
  .fd .fab-table .grid tr.done th { box-shadow: none; }
  .fd .fab-table .fd-grid { table-layout: auto; }
  .fd .fab-table colgroup { display: none; }
  .fd .fab-table .fd-grid .lots-cell .lot-row input.num { flex-basis: 7em; width: 7em; }
  /* card compact: produs / livrat · paleți · procesat / lot · țară / dată · BIO */
  .fd .fab-table tr { grid-template-columns: repeat(6, 1fr); gap: 6px 10px; padding: 10px 12px; margin-bottom: 8px; border-radius: 14px; }
  .fd .fab-table .grid td::before { font-size: .66rem; margin-bottom: 1px; }
  .fd .fab-table .grid td[data-label="De livrat"] { grid-column: span 2; }
  .fd .fab-table .grid td[data-label="Paleți"] { grid-column: span 1; }
  .fd .fab-table .grid td[data-label="Procesat efectiv"] { grid-column: span 3; padding: 4px 8px; }
  .fd .fab-table .grid td[data-label="Nr. lot"], .fd .fab-table .grid td[data-label="Țara de origine"] { grid-column: span 3; }
  .fd .fab-table .grid td[data-label="Data ambalării"] { grid-column: span 4; }
  .fd .fab-table .grid td[data-label="BIO"] { grid-column: span 2; }
  .fd .fab-table .grid input.num { font-size: 1.05rem; padding: 6px 8px; }
  .fd .fab-table .fd-grid .lots-cell .lot-row input.num { flex-basis: 5em; width: 5em; }
  .fd .fab-table .fd-grid th.sticky small.pack { white-space: normal; }
}
.fab-btn.loaded { background: #1f4f8a; color: #fff; }
.delivery-steps { list-style: none; padding: 0; margin: 6px 0 10px; display: grid; gap: 6px; }
.delivery-steps li { padding-left: 30px; position: relative; color: var(--muted); }
.delivery-steps li::before { content: "○"; position: absolute; left: 6px; }
.delivery-steps li.done { color: var(--ink); } .delivery-steps li.done::before { content: "✓"; color: var(--green-600); font-weight: 700; }
.retur-alert { background: #c8102e; color: #fff; border-radius: 22px; padding: 22px 18px; margin: 0 0 14px; text-align: center;
  border: 4px solid #7a0016; box-shadow: 0 0 0 4px #ffd400 inset; animation: returPulse 1.6s ease-in-out infinite; }
.retur-icon { font-size: 2.6rem; line-height: 1; }
.retur-big { font-size: clamp(1.7rem, 8vw, 2.6rem); font-weight: 900; line-height: 1.1; letter-spacing: .01em; margin: 8px 0; text-transform: uppercase; }
.retur-text { font-size: 1.05rem; line-height: 1.4; }
@keyframes returPulse { 50% { box-shadow: 0 0 0 4px #ffd400 inset, 0 0 0 8px rgba(200, 16, 46, .25); } }
.retur-check { display: flex; gap: 12px; align-items: flex-start; padding: 16px; border-radius: 18px; background: #fff4f4; border: 2px solid #c8102e;
  font-size: 1.05rem; color: #7a0016; }
.retur-check input { width: 28px; height: 28px; flex: none; accent-color: #c8102e; }
.retur-check.shake { animation: shake .3s 2; }
@keyframes shake { 25% { transform: translateX(-6px); } 75% { transform: translateX(6px); } }
.drv-btn.locked { opacity: .45; }
.drv-buttons { display: grid; gap: 12px; margin: 0 0 12px; }
.drv-btn { display: flex; flex-direction: column; gap: 4px; padding: 20px 18px; border-radius: 20px; font-size: 1.2rem; font-weight: 700;
  text-decoration: none; cursor: pointer; border: 2px solid transparent; }
.drv-btn small { font-size: .85rem; font-weight: 500; opacity: .85; }
.drv-btn.upload { background: var(--green-700); color: #fff; font-size: 1.35rem; padding: 26px 18px; }
.drv-btn.call { background: var(--gold); color: var(--gold-ink); }
.drv-btn.chat { background: #fff; color: var(--ink); border-color: var(--line); }
.drv-table { width: 100%; border-collapse: collapse; } .drv-table th { text-align: left; font-size: .75rem; color: var(--muted); padding: 4px 6px; }
.drv-table td { padding: 8px 6px; border-top: 1px solid var(--line-2); }
.rcpt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 12px; }
.rcpt-grid.big { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.rcpt { display: flex; flex-direction: column; gap: 6px; text-decoration: none; color: var(--ink); background: var(--card); border: 1px solid var(--line);
  border-radius: 14px; padding: 8px; }
.rcpt img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 10px; background: #eee; }
.rcpt .pdf { display: grid; place-items: center; aspect-ratio: 3 / 4; background: var(--gold-100); border-radius: 10px; font-size: 1.4rem; }
.rcpt small { word-break: break-all; }
.fab-aviz { display: flex; flex-wrap: wrap; gap: 12px 20px; } .fab-aviz label { display: flex; flex-direction: column; gap: 4px; font-size: .9rem; }
.fab-buttons { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin: 18px 0 30px; }
.fab-btn { font-size: 1.1rem; font-weight: 700; padding: 18px 16px; border-radius: 18px; border: 2px solid transparent; cursor: pointer; }
.fab-btn.received { background: var(--gold); color: var(--gold-ink); } .fab-btn.refresh { background: #fff; border-color: var(--line); color: var(--ink); }
.fab-btn.finish { background: var(--green-700); color: #fff; } .fab-btn:disabled { opacity: .45; cursor: default; }
.grid th.grp-fab { background: var(--gold-100); }
.grid td.fabcol { background: #fffaf0; text-align: center; } .grid td.fabcol.short { background: var(--warn-bg); }
.grid td.fabcol small { display: block; }
.factory .grid input.num { width: 96px; }
.factory .grid textarea { width: 190px; font: inherit; font-size: .85rem; border: 1px solid var(--line); border-radius: 10px; padding: 6px; }
.factory .grid tr.done th { box-shadow: inset 4px 0 0 var(--green-600); }
.factory .grid tr.short td { background: var(--warn-bg); }
.factory-actions { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: end; margin: 12px 0; }
.factory-actions label { display: flex; flex-direction: column; font-size: .85rem; gap: 4px; }
.track-banner { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; padding: 12px 18px; margin: 0 0 14px;
  border-radius: 16px; background: var(--gold-100); border: 1px solid var(--gold); color: var(--ink); text-decoration: none; }
.track-banner.ok { background: var(--ok-bg); border-color: #b9dcc4; }
.track-banner.late { background: var(--warn-bg); border-color: #f3b4ad; color: var(--warn); }
.track-banner .go { margin-left: auto; font-weight: 600; text-decoration: underline; }
.docs .ack { font-size: .78rem; padding: 2px 8px; border-radius: 999px; background: #eceae3; white-space: nowrap; }
.docs .ack.ok { background: var(--ok-bg); color: var(--green-700); } .docs .ack.late { background: var(--warn-bg); color: var(--warn); }
.dstat { border: 1px solid var(--line); border-radius: 16px; padding: 12px 14px; margin: 10px 0; background: var(--card-2); overflow-x: auto; }
.dstat-head { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; margin-bottom: 8px; }
.dstat-sum { font-size: .85rem; padding: 3px 10px; border-radius: 999px; background: #eceae3; }
.dstat-sum.ok { background: var(--ok-bg); color: var(--green-700); } .dstat-sum.late { background: var(--warn-bg); color: var(--warn); }
.dstat-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.dstat-table th { text-align: left; font-size: .75rem; color: var(--muted); font-weight: 600; padding: 4px 8px; }
.dstat-table td { padding: 6px 8px; border-top: 1px solid var(--line-2); vertical-align: middle; }
.dstat-table tr.st-confirmat td { background: var(--ok-bg); }
.dstat-table tr.call td { background: var(--warn-bg); }
.call-btn { background: var(--warn); color: #fff !important; border-color: var(--warn); white-space: nowrap; }
.doc-tabs { display: flex; gap: 6px; border-bottom: 1px solid var(--line); margin: 0 0 16px; overflow-x: auto; overflow-y: hidden;
  scrollbar-width: none; }
.doc-tabs a { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; text-decoration: none; color: var(--muted);
  font-weight: 600; border-bottom: 3px solid transparent; margin-bottom: -1px; white-space: nowrap; }
.doc-tabs a:hover { color: var(--ink); }
.doc-tabs a.on { color: var(--green-900); border-bottom-color: var(--gold); }
.doc-tabs .n { font-size: .8rem; background: #eceae3; border-radius: 999px; padding: 0 8px; color: var(--muted); }
.doc-tabs .pending { font-size: .75rem; background: var(--warn); color: #fff; border-radius: 999px; padding: 0 7px; }
.docs.rows { margin-top: 14px; gap: 8px; }
.docs.rows a { grid-template-columns: 92px 1fr auto; align-items: center; padding: 12px 18px; }
.docs.rows .when-col { font-weight: 600; color: var(--green-700); font-size: .9rem; }
.docs.rows .t { grid-column: auto; }
.docs.rows .badge { grid-row: auto; grid-column: auto; }
@media (max-width: 640px) { .docs.rows a { grid-template-columns: 70px 1fr; } .docs.rows .badge { grid-column: 2; justify-self: start; } }
.docs { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.docs a { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; padding: 16px 20px; background: var(--card); border: 1px solid var(--line); border-radius: 18px; text-decoration: none; color: var(--ink); box-shadow: 0 1px 2px rgba(0, 0, 0, .03); }
.docs a:hover { box-shadow: var(--shadow); }
.docs .kind { font-size: .76rem; color: var(--muted); text-transform: uppercase; letter-spacing: .08em; }
.docs .t { font-weight: 600; grid-column: 1; }
.docs .badge { grid-row: 1 / span 2; grid-column: 2; align-self: center; }
.docs .when { font-size: .8rem; color: var(--muted); }
.badge { display: inline-block; padding: 4px 11px; border-radius: 999px; font-size: .8rem; font-weight: 600; background: #eceae3; }
.st-IN_VERIFICARE { background: #fff1c2; color: #6b4e00; }
.st-APROBAT { background: #dbeafe; color: #1e3a8a; }
.st-TRIMIS { background: #e0e7ff; color: #3730a3; }
.st-CONFIRMAT_DEPOZIT { background: #d1fae5; color: #065f46; }
.st-EROARE, .out-eroare { background: var(--warn-bg); color: var(--warn); }
.out-simulat, .out-fara_dispozitiv { background: #fff1c2; color: #6b4e00; }
.out-trimis { background: #d1fae5; color: #065f46; }
.totals { display: flex; gap: 10px; flex-wrap: wrap; margin: 10px 0; }
.tot { background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 10px 14px; min-width: 150px; }
.tot .d { font-size: .8rem; color: var(--muted); } .tot .c { font-weight: 600; } .tot .n { font-variant-numeric: tabular-nums; }
.tot.over { border-color: var(--warn); background: var(--warn-bg); } .tot.over .n { color: var(--warn); font-weight: 700; }
.gridwrap { overflow-x: auto; -webkit-overflow-scrolling: touch; background: var(--card); border: 1px solid var(--line); border-radius: 18px; }
table.grid { border-collapse: collapse; width: 100%; font-variant-numeric: tabular-nums; }
.grid th, .grid td { border-bottom: 1px solid var(--line-2); padding: 7px 9px; text-align: right; white-space: nowrap; vertical-align: middle; }
.grid thead th { background: var(--card-2); font-size: .85rem; text-align: center; }
.grid th.sticky { position: sticky; left: 0; background: var(--card); text-align: left; z-index: 1; font-weight: 500; }
.grid thead th.sticky { background: var(--card-2); }
.grid th.sticky small { display: block; color: var(--muted); font-size: .75rem; }
.grid td.p { background: #f6f5f0; }
.grid input.pal { width: 58px; text-align: center; padding: 6px !important; }
.grid input.qty { width: 92px; text-align: right; padding: 6px 8px !important; }
.grid tr.totrow td { text-align: center; background: var(--green-100); font-size: 1.05rem; }
.grid tr.totrow th { background: var(--green-100); }
.grid tr.totrow td.over { background: var(--warn-bg); color: var(--warn); }
.grid input.num { width: 98px; text-align: right; padding: 6px !important; }
.grid input.txt, input.txt { width: 100%; min-width: 150px; }
.grid .req { display: block; color: var(--muted); font-size: .72rem; }
.grid td.edited, .grid td.edited input { background: var(--edit); }
/* paleți rotunjiți în plus: ultimul palet incomplet (cerință 15.10.2026 — singurul galben din planificare) */
.grid td.partial, .grid td.partial input { background: #ffeb3b; font-weight: 800; }
.own-box .own-tbl select { width: 100%; min-width: 0; max-width: 16em; }
.own-box .own-tbl th, .own-box .own-tbl td { white-space: normal; padding: 6px; }
/* planificarea compactă (21.10.2026): toată săptămâna pe lățimea ecranului, fără bară orizontală */
main:has(table.plan.compact) { max-width: 1800px; }
.grid.plan.compact, .grid.saga-tbl.compact { table-layout: fixed; font-size: .84rem; }
.grid.plan.compact th, .grid.plan.compact td, .grid.saga-tbl.compact th, .grid.saga-tbl.compact td { padding: 4px 3px; white-space: normal; overflow-wrap: anywhere; }
.grid.plan.compact th.sticky, .grid.saga-tbl.compact th.sticky { padding-left: 8px; line-height: 1.2; }
.grid.plan.compact thead th { font-size: .76rem; line-height: 1.2; }
.grid.plan.compact input.qty, .grid.plan.compact input.pal { width: 100%; min-width: 0; font-size: .84rem; padding: 4px 3px !important; }
.grid.plan.compact input.pal { padding: 4px 1px !important; }
.grid.plan.compact .req { font-size: .64rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.grid.plan.compact tr.trow select { width: 100%; min-width: 0; font-size: .78rem; padding: 4px 18px 4px 5px; }
.grid.plan.compact .auto-truck, .grid.plan.compact .shared-note { font-size: .66rem; line-height: 1.2; }
.grid.plan.compact tr.totrow td { font-size: .92rem; }
.grid.saga-tbl.compact td.saga b, .grid.saga-tbl.compact td.saga small { display: block; }
.grid.saga-tbl.compact td.saga small { color: var(--muted); font-size: .7rem; } .grid.saga-tbl.compact small.eps { color: var(--green-700); }
.own-box td.manual select { border: 2px solid #2f6fd6; font-weight: 700; }       /* ales de mână */
.own-box tr.warnrow td.over, .own-box td.over { color: var(--warn); font-weight: 800; }
.grid .auto-truck { display: block; font-size: .75rem; color: var(--green-700); font-weight: 700; white-space: normal; }
.partial-legend { display: inline-flex; align-items: center; gap: 6px; margin-top: 4px; }
.partial-legend i { width: 18px; height: 14px; background: #ffeb3b; border: 1px solid #c9b300; display: inline-block; }
.grid td.diff.pos { background: var(--pos); } .grid td.diff.neg { background: var(--neg); }
.grid tr.dim { opacity: .45; }
.grid.hist td { text-align: left; white-space: normal; }
.detail { color: var(--muted); font-size: .85rem; }
.actions .btns { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.status-line { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.list { list-style: none; padding: 0; margin: 0; }
.list li { padding: 9px 0; border-bottom: 1px solid var(--line-2); }
.msgtext { white-space: pre-wrap; margin: 4px 0; }
.thumb { max-width: 260px; border: 1px solid var(--line); border-radius: 8px; margin-top: 4px; }
.crumb { margin: 0 0 6px; }
.linkbox input { width: min(100%, 520px); }
button.ok-link { color: var(--green-600); margin-right: 10px; }
.login { margin: 8vh auto; text-align: center; }
.login .logo { width: 64px; }
.login form { text-align: left; }
.login input:not([type=hidden]) { width: 100%; }
.login button { width: 100%; margin-top: 8px; }
.devcode { background: var(--gold-100); color: #5c4400; padding: 8px 10px; border-radius: 12px; }

/* ---------------- telefon */
@media (max-width: 980px) {
  .app { grid-template-columns: 1fr; }
  .side { position: fixed; left: 0; top: 0; width: 280px; transform: translateX(-100%); transition: transform .2s; }
  body.side-open .side { transform: none; }
  body.side-open .scrim { display: block; position: fixed; inset: 0; background: rgba(0, 0, 0, .35); z-index: 25; }
  body.side-hidden .side { display: flex; }
  .topbar { padding: 10px 12px; }
  .topbar .brand { display: inline-flex; }
  .menu-btn span { display: none; }
  .badge-user { width: 40px; height: 40px; border-radius: 12px; }
  main { padding: 14px 10px 24px; }
  .hub { grid-template-columns: 1fr; }
  .hub-cats { padding: 14px; }
  .hub-cats nav { flex-direction: row; margin: 10px 0; overflow-x: auto; }
  .hub-cats nav a { padding: 9px 14px; font-size: .95rem; white-space: nowrap; }
  .hub-cats > p, .hub-cats > h2 { display: none; }
  .hub-new { flex-direction: row; } .hub-new .btn { flex: 1; justify-content: center; font-size: .9rem; }
  .hero { padding: 20px; border-radius: 22px; }
  .hero p { font-size: .95rem; }
  .hub-head, .hub-list > .chips { padding-left: 14px; padding-right: 14px; }
  .conv-grid { grid-template-columns: 1fr; padding: 14px; }
  body.room-mode main { padding: 0; }
  .room { height: calc(100dvh - 62px); border-radius: 0; border: 0; margin: 0; }
  .room-head { padding: 10px 12px; gap: 10px; }
  .room-head .conv-ic { display: none; }
  .room-title { min-width: 0; }
  .room-title b { font-size: 1.05rem; }
  .room-title small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .room-tools { width: 100%; }
  .room-tools .search-pill { flex: 1; width: auto; }
  .room-tools .btn { font-size: .85rem; }
  .room-filter { padding: 6px 12px; }
  .msgs { padding: 12px; }
  .msg { max-width: 100%; }
  .msg .av { display: none; }
  .msg-actions { opacity: 1; }
  .msg-actions button { padding: 3px 8px; font-size: .8rem; }
  .composer-wrap { padding: 8px 8px calc(8px + env(safe-area-inset-bottom)); }
  .composer { flex-wrap: wrap; padding: 6px 6px 6px 14px; border-radius: 18px; }
  .composer textarea { flex-basis: 100%; }
  .composer-tools { width: 100%; justify-content: flex-end; }
  .composer-tools .tag-select { margin-right: auto; }
  .tool { width: 38px; height: 38px; }
  .send { width: 44px; height: 44px; }
  .hint { display: none; }
  .side-panel { top: 120px; right: 8px; }
}

/* ---------------- rapoarte timp de reacție */
.hero.slim { padding: 24px 32px; }
.period { display: flex; gap: 8px; flex-wrap: wrap; }
.period .chip { cursor: pointer; background: rgba(255, 255, 255, .1); color: #fff; border-color: rgba(255, 255, 255, .2); }
.period .chip.on { background: var(--gold); color: var(--gold-ink); border-color: var(--gold); }
.chips.tabs { margin: 0 0 10px; }
.legend { margin: 6px 2px 16px; }
.speed { display: inline-block; padding: 2px 9px; border-radius: 999px; font-weight: 600; font-size: .86rem; white-space: nowrap; }
.speed.fast { background: #dcf3e3; color: #11643a; }
.speed.mid { background: #fff1c2; color: #6b4e00; }
.speed.slow { background: var(--warn-bg); color: var(--warn); }
.speed.na { color: var(--muted); }
.card.flush { padding: 0; }
table.report td, table.report th { white-space: nowrap; }
table.report td small.n { display: block; color: var(--muted); font-size: .74rem; }
table.report .pers { display: flex; align-items: center; gap: 10px; }
table.report .pers small { display: block; color: var(--muted); font-weight: 400; }
table.report.mini { margin-top: 10px; }
.empty-cell { text-align: center !important; color: var(--muted); padding: 30px !important; }
.tl-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.tl-head h2 { margin: 2px 0 0; } .tl-head h2 a { color: var(--ink); text-decoration: none; }
.timeline { list-style: none; padding: 0; margin: 16px 0 6px; display: grid; grid-template-columns: repeat(6, minmax(130px, 1fr)); gap: 10px; counter-reset: s; }
.timeline li { position: relative; padding: 12px 12px 12px 14px; border-radius: 16px; background: var(--card-2); border: 1px solid var(--line); display: flex; flex-direction: column; gap: 4px; }
.timeline li b { font-size: .9rem; }
.timeline li span { font-size: .82rem; color: var(--muted); }
.timeline li.done { border-color: #cfe0d6; background: #f4faf6; }
.timeline li.done::before { content: "✓"; position: absolute; right: 10px; top: 8px; color: var(--green-600); font-weight: 700; }
.timeline li .speed { align-self: flex-start; margin-top: 2px; }
details summary { cursor: pointer; color: var(--green-600); font-weight: 600; margin-top: 6px; }
.msg-report .mr-text { margin: 4px 0 0; font-size: 1.02rem; }
.msg-report .mr-text a { color: var(--ink); text-decoration: none; }
.mr-counts { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
/* confirmări în chat */
.ackbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
.ack-btn { display: inline-flex; align-items: center; gap: 6px; border: 0; border-radius: 999px; padding: 7px 14px; background: var(--gold); color: var(--gold-ink); font-weight: 700; cursor: pointer; }
.ack-done { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 5px 12px; background: #dcf3e3; color: #11643a; font-weight: 600; font-size: .86rem; }
.receipts-btn { border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 4px 11px; font-size: .82rem; color: var(--muted); cursor: pointer; }
.receipts-list .person { cursor: default; }
@media (max-width: 980px) {
  .timeline { grid-template-columns: 1fr 1fr; }
  .hero.slim { padding: 18px; }
}

/* ---------------- echipă & obiective */
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; margin-bottom: 18px; }
.kpi { display: flex; flex-direction: column; gap: 6px; margin: 0; }
.kpi-label { font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); font-weight: 700; }
.kpi-value { font-family: var(--serif); font-size: 2.3rem; line-height: 1.1; color: var(--green-800); }
.kpi-sub { font-size: .85rem; color: var(--muted); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.delta { display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border-radius: 999px; font-weight: 700; font-size: .84rem; white-space: nowrap; }
.delta.good { background: #dcf3e3; color: #11643a; }
.delta.bad { background: var(--warn-bg); color: var(--warn); }
.delta small { font-weight: 500; opacity: .8; }
.pctbar { display: inline-block; width: 64px; height: 8px; border-radius: 999px; background: #eceae3; overflow: hidden; vertical-align: middle; }
.pctbar span { display: block; height: 100%; border-radius: 999px; }
.pctbar .fast { background: #2e9b5f; } .pctbar .mid { background: #e0a82e; } .pctbar .slow { background: #d1453b; }
table.score th.grp { background: var(--green-800); color: #fff; border-left: 2px solid #fff; }
table.score tbody td:nth-child(2), table.score tbody td:nth-child(6), table.score tbody td:nth-child(10),
table.score thead tr:nth-child(2) th:nth-child(1), table.score thead tr:nth-child(2) th:nth-child(5), table.score thead tr:nth-child(2) th:nth-child(9) { border-left: 2px solid var(--line); }
table.score .team-row th, table.score .team-row td { background: var(--gold-100); font-weight: 600; }
table.score .team-row th small { display: block; font-weight: 400; color: var(--muted); }
.score-pill { display: inline-block; padding: 3px 10px; border-radius: 999px; font-weight: 700; }
.score-pill.good { background: #dcf3e3; color: #11643a; } .score-pill.mid { background: #fff1c2; color: #6b4e00; } .score-pill.bad { background: var(--warn-bg); color: var(--warn); }
.bad-text { color: var(--warn); font-weight: 600; }
.kpi-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 6px 18px; align-items: end; }
.kpi-form label { margin: 4px 0; font-weight: 500; }
.inline-input { display: flex; align-items: center; gap: 8px; margin-top: 4px; color: var(--muted); }
.inline-input input { width: 110px; }

/* ---------------- ATENȚIE (comenzi noi de preluat) */
.side-nav a.danger-nav { color: #ffb4ab; font-weight: 600; }
.side-nav a.danger-nav.live { background: #7a1a14; color: #fff; animation: dangerGlow 1.6s ease-in-out infinite; }
.side-nav a.danger-nav.on { background: #b42318; color: #fff; }
.pill.red { background: #fff; color: #b42318; }
@keyframes dangerGlow { 50% { box-shadow: 0 0 0 4px rgba(217, 45, 32, .35); } }
.danger-banner { display: block; text-decoration: none; color: #fff; background: repeating-linear-gradient(-45deg, #b42318 0 18px, #c62a1f 18px 36px);
  padding: 12px 22px; font-size: 1.02rem; text-align: center; }
.danger-banner b { text-decoration: underline; }
.danger-hero { display: flex; gap: 22px; align-items: center; border-radius: 28px; padding: 28px 34px; margin-bottom: 22px; color: #fff;
  background: radial-gradient(120% 140% at 85% 20%, #e0483b 0%, #b42318 45%, #6e140e 100%); box-shadow: var(--shadow); }
.danger-hero.calm { background: radial-gradient(120% 140% at 85% 20%, #2a6a4e 0%, var(--green-800) 45%, var(--green-900) 100%); }
.danger-hero h1 { color: #fff; margin: 4px 0 6px; font-size: clamp(1.6rem, 3vw, 2.3rem); }
.danger-hero p { margin: 0; color: #ffe1dd; max-width: 760px; }
.danger-hero.calm p { color: #d4e2d8; }
.danger-hero .eyebrow { color: #ffd9a8; }
.dh-icon { font-size: 3rem; width: 84px; height: 84px; border-radius: 24px; background: rgba(255, 255, 255, .14); display: grid; place-items: center; flex: none; }
.alert-list { display: grid; gap: 14px; margin-bottom: 20px; }
.alert-card { background: #fff; border: 2px solid #f2b8b2; border-left: 10px solid #d92d20; border-radius: 22px; padding: 18px 22px; box-shadow: var(--shadow); }
.alert-card.late { animation: dangerGlow 1.6s ease-in-out infinite; }
.alert-card h2 { font-size: 1.3rem; margin: 8px 0 4px; }
.ac-top { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.ac-badge { background: #fdecea; color: #b42318; font-weight: 700; border-radius: 999px; padding: 4px 12px; }
.ac-wait { color: var(--muted); }
.alert-card.late .ac-wait b { color: #b42318; }
.ac-actions { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.danger-btn { background: #d92d20; color: #fff; border-color: #d92d20; font-weight: 700; font-size: 1.05rem; padding: 12px 22px; }
.danger-btn:hover { background: #b42318; }
.claim-strip { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; border-radius: 16px; padding: 12px 16px; margin: 10px 0 16px; }
.claim-strip.open { background: #fdecea; border: 1px solid #f2b8b2; }
.claim-strip.done { background: #e8f4ec; border: 1px solid #cfe0d6; }
/* comparație inițial → fermă → final */
table.cmp th.grp-plan { background: #eef2f7; } table.cmp th.grp-firm { background: #fff3d6; } table.cmp th.grp-final { background: #e3f2e8; }
table.cmp td.final input { font-weight: 700; }
table.cmp td.changed { background: var(--edit); }
.diff-pill { display: inline-block; min-width: 54px; padding: 2px 8px; border-radius: 999px; font-weight: 700; text-align: center; }
.diff-pill.pos { background: #dcf3e3; color: #11643a; } .diff-pill.neg { background: var(--warn-bg); color: var(--warn); } .diff-pill.zero { color: var(--muted); }
.versions { font-size: .9rem; }
.versions li { padding: 4px 0; }
.email-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 4px 18px; align-items: end; }
.email-form input:not([type=checkbox]) { width: 100%; }
.danger-link { color: var(--warn) !important; }
.sender-form label { flex: 1; min-width: 220px; margin: 0; }
.sender-form input, .sender-form select { width: 100%; }
table.senders td, table.senders th { white-space: normal; text-align: left; }

/* ---------------- program fabrică („CE FACEM AZI?”) */

body.program-mode main { max-width: 1700px; }
.board-tools { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.board-tools .grow { flex: 1; }
.board { background: #fff; border-radius: 22px; padding: 18px; box-shadow: var(--shadow); border: 1px solid var(--line); }
.board-head { display: flex; justify-content: space-between; gap: 16px; align-items: center; background: #23292a; color: #fff;
  border-radius: 18px; padding: 18px 24px; margin-bottom: 14px; }
.board-head h1 { font-family: "Oswald", var(--font); font-size: 2.3rem; margin: 0; letter-spacing: .02em; color: #fff; }
.board-head p { margin: 2px 0 0; color: #cfd6d3; }
.bh-right { text-align: right; display: flex; flex-direction: column; gap: 6px; align-items: flex-end; }
.bh-right .wk { background: #fff; color: #1b1b1b; border-radius: 10px; padding: 4px 12px; font-weight: 700; }
.week { display: grid; grid-template-columns: repeat(7, minmax(150px, 1fr)); gap: 10px; }
.dcol { border: 3px solid #23292a; border-radius: 16px; display: flex; flex-direction: column; overflow: hidden; background: #fff; min-height: 520px; }
.dcol.today { border-color: var(--gold); box-shadow: 0 0 0 4px rgba(230, 190, 92, .45); }
.dhead { background: #23292a; color: #fff; padding: 10px 12px 12px; }
.dhead h2 { font-family: "Oswald", var(--font); font-size: 1.55rem; margin: 0; letter-spacing: .02em; }
.dhead small { display: block; color: #cfd6d3; margin-top: 4px; }
.dtag { display: inline-block; margin-top: 4px; font-size: .75rem; font-weight: 700; border-radius: 6px; padding: 2px 8px; color: #cfd6d3; }
.k-overtime .dtag { background: var(--gold); color: #1b1b1b; }
.k-recovery .dtag { background: #e8ece9; color: #1b1b1b; }
.k-recovery .dhead { background: #4c5755; }
.k-normal .dhead, .k-advance .dhead, .k-loading .dhead { background: #2f3a38; }
.dbody { flex: 1; padding: 10px; display: flex; flex-direction: column; gap: 8px; }
.dbody .grow { flex: 1; min-height: 12px; }
.dbody h3 { font-family: "Oswald", var(--font); font-size: 1rem; margin: 4px 0 0; display: flex; justify-content: space-between; align-items: baseline; }
.dbody h3 small { font-family: var(--font); font-size: .78rem; color: var(--muted); }
.dnote { background: #fbe4e4; border: 2px solid #e8a5a5; border-radius: 10px; padding: 8px; font-size: .85rem; font-weight: 600; color: #7a1d1d; }
.k-normal .dnote { background: #e8ece9; border-color: #cfd6d3; color: #2f3a38; }
.rest { text-align: center; padding: 30px 6px; color: var(--muted); display: flex; flex-direction: column; gap: 4px; font-size: .9rem; }
.rest b { color: var(--ink); font-size: 1.05rem; }
.pchip { display: flex; gap: 8px; align-items: flex-start; background: var(--c); color: var(--ci); border-radius: 12px; padding: 8px; }
.pchip.expected { background: transparent; color: var(--ink); border: 2px dashed var(--c); }
.pchip.done { opacity: .55; }
.pchip.done .pb b { text-decoration: line-through; }
.pl { width: 30px; height: 30px; border-radius: 50%; background: #1b1b1b; color: #fff; display: grid; place-items: center; font-weight: 800; flex: none; font-size: .85rem; }
.pchip.expected .pl { background: var(--c); color: var(--ci); }
.pb { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
.pb b { font-size: .95rem; }
.pb small { font-size: .74rem; opacity: .92; }
.pb .pal { font-weight: 700; }
.pb .tm { font-size: .8rem; }
.pb .warn { background: #fff3cd; color: #6b4e00; border-radius: 4px; padding: 0 4px; margin-top: 2px; }
.pb .who { margin-top: 2px; font-weight: 700; }
.prods summary { cursor: pointer; font-size: .74rem; color: inherit; margin: 2px 0 0; font-weight: 600; }
.prods ul { margin: 4px 0 0; padding-left: 16px; font-size: .74rem; }
.pcheck { width: 30px; height: 30px; flex: none; border-radius: 6px; border: 2px solid #1b1b1b; background: #fff; color: #b42318;
  font-weight: 900; font-size: 1.1rem; cursor: pointer; line-height: 1; }
.dhours { border-top: 2px dashed #cfd6d3; text-align: center; padding: 6px; font-weight: 700; font-size: .85rem; color: var(--muted); }
.board-foot { display: grid; grid-template-columns: 1fr 1.3fr 1.2fr 1fr; gap: 10px; margin-top: 14px; }
.bf { background: #eef1f0; border-radius: 14px; padding: 12px 14px; font-size: .88rem; }
.bf h4 { font-family: "Oswald", var(--font); margin: 0 0 6px; font-size: 1rem; }
.bf p { margin: 4px 0; }
.bf ol { margin: 0; padding-left: 18px; }
.lg { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.lg span { background: var(--c); color: var(--ci); border-radius: 10px; padding: 6px 8px; font-weight: 700; font-size: .8rem; display: flex; gap: 6px; align-items: center; }
.lg i { font-style: normal; width: 20px; height: 20px; border-radius: 50%; background: #1b1b1b; color: #fff; display: inline-grid; place-items: center; font-size: .7rem; }
.program-settings { margin-top: 16px; }
@media (max-width: 1100px) {
  .week { grid-template-columns: 1fr; }
  .dcol { min-height: 0; }
  .board-foot { grid-template-columns: 1fr; }
  .board-head { flex-direction: column; align-items: flex-start; }
  .bh-right { align-items: flex-start; text-align: left; }
}
@media print {
  @page { size: A4 landscape; margin: 8mm; }
  body { background: #fff !important; }
  .side, .topbar, .no-print, .danger-banner, #toast { display: none !important; }
  .app { display: block; }
  main { padding: 0 !important; max-width: none !important; }
  .board { box-shadow: none; border: 0; padding: 0; }
  .week { grid-template-columns: repeat(7, 1fr) !important; gap: 6px; }
  .dcol { min-height: 0; border-width: 2px; break-inside: avoid; }
  .dcol.today { box-shadow: none; border-color: #23292a; }
  .board-head h1 { font-size: 1.8rem; }
  .pchip, .dhead, .board-head, .lg span, .dtag, .bf { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .prods { display: none; }
  .pb small { font-size: .65rem; }
  .board-foot { grid-template-columns: repeat(4, 1fr) !important; }
}
/* program: bifa în colț, textul pe toată lățimea chip-ului */
.pchip { position: relative; padding-right: 40px; }
.pchip .pcheck { position: absolute; top: 7px; right: 7px; width: 26px; height: 26px; }
.pl { width: 26px; height: 26px; font-size: .78rem; }
.pb b { word-break: normal; overflow-wrap: anywhere; }
.dhead h2 { font-size: 1.35rem; }
.dtag { font-size: .68rem; }
@media (min-width: 1101px) and (max-width: 1500px) {
  body.program-mode .week { gap: 6px; }
  body.program-mode .dbody { padding: 7px; }
  body.program-mode .pchip { padding: 7px 36px 7px 7px; gap: 6px; }
  body.program-mode .pl { display: none; }
}
.pb b { overflow-wrap: normal; word-break: normal; hyphens: manual; }
body.program-mode.side-hidden .app { grid-template-columns: 1fr; }
.truck { display: flex; flex-direction: column; margin-top: 5px; background: #fff; color: #1b1b1b; border-radius: 8px; padding: 4px 7px;
  font-weight: 800; font-size: .9rem; border: 2px solid #1b1b1b; }
.truck small { font-weight: 600; font-size: .68rem; color: #3d4a43; }
.pchip.expected .truck { border-style: dashed; }
.ready { margin-top: 5px; background: #fff3cd; color: #6b4e00; border: 2px solid #e0a82e; border-radius: 8px; padding: 3px 7px; font-weight: 800; font-size: .78rem; }
.overflow { background: var(--warn-bg); border: 2px solid #e8a5a5; color: var(--warn); border-radius: 10px; padding: 7px 8px; font-size: .8rem; }
.secload { margin-top: 4px; font-size: .74rem; }
.secload summary { cursor: pointer; font-weight: 700; color: var(--muted); }
.sbar { display: grid; grid-template-columns: 1fr; gap: 1px; margin: 5px 0; }
.sbar span { font-weight: 600; color: #3d4a43; }
.sbar i { display: block; height: 7px; background: #eceae3; border-radius: 999px; overflow: hidden; }
.sbar i b { display: block; height: 100%; background: #2e9b5f; border-radius: 999px; }
.sbar i b.hi { background: #e0a82e; } .sbar i b.full { background: #d1453b; }
.sbar small { color: var(--muted); }
.secfield { border: 1px solid var(--line); border-radius: 12px; padding: 6px 12px; margin: 0; }
.secfield legend { font-weight: 700; padding: 0 4px; }
.span-all { grid-column: 1 / -1; margin: 10px 0 0; }
@media print { .secload { display: none; } }

/* ---------------- pagini de start pe roluri (15.10.2026): fabrică, șoferi, Panoul zilei, raport */
.role-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 20px;
  background: var(--green-900); color: #fff; border-radius: 22px; padding: 20px 24px; margin-bottom: 14px; }
.role-head h1 { color: #fff; margin: 4px 0 4px; font-family: var(--serif); font-weight: 400; font-size: 1.8rem; }
.role-head .eyebrow { font-size: .74rem; letter-spacing: .16em; }
.role-sum { margin: 0; color: #d9e4dc; } .role-sum b { color: var(--gold); }
.role-head .btn { background: #fff; }
.role-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.call-coord { display: flex; flex-direction: column; gap: 2px; background: var(--gold); color: var(--gold-ink); text-decoration: none;
  font-weight: 700; font-size: 1.1rem; padding: 14px 20px; border-radius: 18px; min-width: 210px; }
.call-coord small { font-weight: 500; font-size: .82rem; opacity: .8; }
.call-coord.chat { background: #fff; color: var(--ink); }
.push-banner { display: flex; margin: 0 0 14px; }
.push-banner[hidden] { display: none; }
/* liste lungi: primele 5, restul după „Vezi mai multe” (app.js, data-more) */
.more-hidden { display: none !important; }
.more-btn { display: block; margin: 10px auto 4px; }
@media print { .more-hidden { display: revert !important; } .more-btn { display: none; } }
.plan-ack { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; background: #fff; border: 1px solid var(--gold);
  border-radius: 16px; padding: 12px 16px; margin: 0 0 12px; } .plan-ack > span { flex: 1 1 260px; }
/* „Actualizare planificare” la fabrică: roșu, cu plus verde / minus roșu */
.plan-ack.upd { border: 2px solid #c62828; background: #fff5f5; }
.plan-ack .neg, dialog.plan-upd .neg { color: #c62828; } dialog.plan-upd .pos { color: #1b7f3b; }
.plan-ack button.link { background: none; border: 0; color: #c62828; text-decoration: underline; cursor: pointer; padding: 0 4px; font: inherit; }
/* pop-up-ul fabricii (dublura notificării): tipul scris mare — PLANIFICARE (albastru) / COMANDĂ FERMĂ (roșu) */
dialog.fnotice { width: min(760px, 96vw); border: 3px solid #c62828; }
dialog.fnotice.plan { border-color: #1d4ed8; }
dialog.fnotice .fn-kind { display: inline-block; font-weight: 900; letter-spacing: .04em; font-size: 1.15rem;
  padding: 4px 12px; border-radius: 8px; color: #fff; background: #c62828; }
dialog.fnotice.plan .fn-kind { background: #1d4ed8; }
dialog.fnotice h2 { margin: 10px 0 6px; font-size: 1.4rem; }
/* ACTUALIZARE (planificare sau comandă fermă retrimisă): bandă roșie, titlu mare */
dialog.fnotice.upd { border-color: #b71c1c; padding-top: 0; }
dialog.fnotice.upd .fn-upd-head { background: #c62828; color: #fff; margin: 0 -22px 12px; padding: 16px 22px;
  border-radius: var(--radius) var(--radius) 0 0; text-align: center; }
dialog.fnotice.upd .fn-upd-title { font-size: 2.4rem; font-weight: 900; letter-spacing: .08em; line-height: 1.1; }
dialog.fnotice.upd .fn-upd-sub { font-size: 1rem; font-weight: 700; opacity: .95; margin-top: 4px; }
dialog.fnotice .fn-what { margin: 8px 0 0; font-size: 1.15rem; }
.upd-tbl tr.tr-change td { background: #fff8e1; }
.upd-tbl s { text-decoration-thickness: 2px; }
dialog.fnotice .fn-text { font-size: 1.05rem; margin: 6px 0; }
dialog.fnotice .pos { color: #1b7f3b; } dialog.fnotice .neg { color: #c62828; }
dialog.fnotice .upd-wrap { max-height: 50vh; overflow: auto; margin: 10px 0; }
.fab-sec { margin: 18px 0 8px; font-size: 1.15rem; letter-spacing: .03em; }
.fab-sec small { font-weight: 400; letter-spacing: 0; color: var(--muted); font-size: .85rem; }
.fab-sec.plan { color: #1d4ed8; } .fab-sec.firm { color: #c62828; }
/* Fabrica: două taburi mari sus — Planificare (albastru) / Comenzi ferme (roșu), 20.10.2026 */
.fab-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 6px 0 14px; }
.fab-tab { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; padding: 14px 18px; border-radius: 16px;
  border: 2px solid #e2ddd0; background: #fff; text-decoration: none; font-weight: 700; font-size: 1.1rem; letter-spacing: .03em; }
.fab-tab small { flex-basis: 100%; font-weight: 400; letter-spacing: 0; font-size: .82rem; color: var(--muted); }
.fab-tab b { color: #fff; border-radius: 999px; padding: 1px 9px; font-size: .9rem; }
.fab-tab.plan { color: #1d4ed8; } .fab-tab.firm { color: #c62828; }
.fab-tab.plan b { background: #1d4ed8; } .fab-tab.firm b { background: #c62828; }
.fab-tab.plan.on { border-color: #1d4ed8; background: #eef3ff; } .fab-tab.firm.on { border-color: #c62828; background: #fdeeee; }
@media (max-width: 520px) { .fab-tab { padding: 12px; font-size: .98rem; } }
.plan-ack.done { border-color: #d6dde8; background: #f7f9fc; }
.plan-steps { margin: -4px 0 10px; }
.btn.beta-run { background: #e6be5c; color: #062418; border-color: #e6be5c; font-weight: 800; }
/* Parc auto — căsuțe cu numărul mare (varianta A, 16.10.2026) */
.fl-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; margin: 10px 0; }
.fl-tile { display: flex; flex-direction: column; gap: 3px; background: #fff; border: 1px solid #e3e0d6; border-radius: 14px;
  padding: 12px 14px; color: inherit; text-decoration: none; }
.fl-tile:hover { border-color: #062418; }
.fl-tile.sel { outline: 3px solid #e6be5c; }
.fl-plate { font-size: 1.9rem; font-weight: 800; letter-spacing: .04em; line-height: 1.1; color: #062418; }
.fl-plate.big { font-size: 2.4rem; }
.fl-kind { font-size: .85rem; color: var(--muted); }
.fl-state { font-size: .82rem; font-weight: 700; margin-top: 4px; }
.fl-state i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 6px; vertical-align: 1px; background: currentColor; }
.fl-tile.t-exp { border: 2px solid #c62828; background: #fff5f5; } .fl-tile.t-exp .fl-state { color: #c62828; }
.fl-tile.t-soon .fl-state { color: #c62828; } .fl-tile.t-warn .fl-state { color: #b26a00; }
.fl-tile.t-ok .fl-state { color: #1b7f3b; } .fl-tile.t-none .fl-state { color: var(--muted); font-weight: 400; }
.fl-tile.t-off { opacity: .5; } .fl-tile.t-off .fl-state { color: var(--muted); }
.fl-sheet { margin: 10px 0; border: 2px solid #e6be5c; }
.fl-sheet-h { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.fl-facts { display: grid; grid-template-columns: max-content 1fr; gap: 4px 14px; margin: 12px 0; font-size: .92rem; }
.fl-dl-list { display: flex; flex-direction: column; gap: 6px; margin: 4px 0 8px; }
.fl-dl-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.fl-facts dt { color: var(--muted); } .fl-facts dd { margin: 0; }
/* Raportare ambalaje (ECOREP / eTAX / APM) */
.pk-card { margin: 12px 0; } .pk-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 6px 12px; }
.pk-head h2 { margin: 0; font-size: 1.15rem; } .pk-head h2 small { font-weight: 400; font-size: .8rem; }
.pk-dl { font-size: .85rem; font-weight: 700; padding: 3px 10px; border-radius: 999px; background: #f1efe8; }
.pk-dl.ok { background: #e3f4e6; color: #1b7f3b; } .pk-dl.soon { background: #fff3cd; color: #6b4e00; } .pk-dl.late { background: #fde8e7; color: #c62828; }
.pk-nums { display: flex; flex-wrap: wrap; gap: 10px; margin: 10px 0; }
.pk-nums > div { flex: 1 1 140px; border: 1px solid #e3e0d6; border-radius: 12px; padding: 8px 12px; background: #fff; }
.pk-nums span { display: block; font-size: .8rem; color: var(--muted); } .pk-nums b { font-size: 1.8rem; letter-spacing: .02em; } .pk-nums small { margin-left: 4px; color: var(--muted); }
.pk-tbl td.num { text-align: right; }
.pk-status { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; padding: 8px 10px; border-radius: 10px; background: #f7f6f1; }
.pk-status.ok { background: #e3f4e6; } .pk-status .pk-note { flex: 1 1 200px; }
/* Calendarul raportărilor de mediu */
.env-list { display: grid; gap: 10px; } .env-item { margin: 0; border-left: 5px solid #d6dde8; }
.env-item.st-late { border-left-color: #c62828; } .env-item.st-soon { border-left-color: #e0a82e; }
.env-item.st-nodate { border-left-color: #888780; } .env-item.st-done { border-left-color: #1b7f3b; opacity: .8; }
.env-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; }
.env-name { font-size: 1.05rem; } .env-when { margin-left: auto; font-weight: 700; font-size: .9rem; }
.env-item.st-late .env-when { color: #c62828; }
.env-firm { font-size: .72rem; font-weight: 800; padding: 2px 8px; border-radius: 6px; background: #062418; color: #e6be5c; }
.env-firm.f-TMT { background: #0c447c; color: #e6f1fb; } .env-firm.f-MTK { background: #712b13; color: #faece7; }
.env-edit { margin-top: 6px; }
/* Raport ECOREP */
.eco-tbl td { text-align: left; white-space: normal; } .eco-tbl td.num { text-align: right; white-space: nowrap; }
.eco-tbl tr.st-nelivrat { opacity: .5; } .eco-tbl tr.missing th, .eco-tbl tr.missing td { background: #fff8e1; }
.eco-form { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; } .eco-form .eco-src { flex: 1 1 260px; min-width: 200px; }
.stat-card.warn { border: 2px solid #c62828; }
.beta-sec { margin: 12px 0; } .beta-sec h3 { font-size: 1rem; margin: 10px 0 4px; }
.beta-list { margin: 0 0 6px 18px; } .beta-tbl tr.done { opacity: .5; } .beta-tbl td { text-align: left; }
.fab-feedback { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 8px 0 12px; }
.fab-feedback p { flex-basis: 100%; margin: 2px 0; }
.plan-reply { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start; margin: 0 0 10px; }
.plan-reply textarea { flex: 1 1 320px; }
.plan-replies { list-style: none; padding: 0; margin: 0 0 10px; }
.plan-replies li { background: #fff; border: 1px solid #d6dde8; border-radius: 10px; padding: 6px 10px; margin-bottom: 6px; }
/* planificarea în pagina fabricii: ziua încărcării pe livrare + tabelul */
.fab-plan { margin: -4px 0 14px; border-left: 4px solid #1d4ed8; }
.fab-plan > summary { cursor: pointer; padding: 4px 0; }
.fp-load { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0; }
.fp-col { flex: 1 1 150px; border: 1px solid #d6dde8; border-radius: 12px; padding: 8px 10px; background: #fff; }
.fp-col.rented { background: #f7f9fc; }
.fp-when { color: #1d4ed8; font-size: .85rem; } .fp-client { font-weight: 800; }
.fp-tbl td { text-align: right; } .fp-tbl td.p { background: #f1f1f1; text-align: center; font-weight: 700; }
.fp-tbl td.p.partial { background: #ffeb3b; }
.oc-kind { display: inline-block; font-size: .7rem; font-weight: 900; letter-spacing: .05em; color: #fff;
  background: #c62828; border-radius: 5px; padding: 1px 6px; vertical-align: middle; margin-right: 4px; }
.upd-tbl { width: 100%; border-collapse: collapse; font-size: .95rem; }
.upd-tbl th, .upd-tbl td { border-bottom: 1px solid #eee; padding: 6px 8px; text-align: left; vertical-align: top; }
.upd-tbl td.pos { background: #e3f4e6; color: #1b7f3b; } .upd-tbl td.neg { background: #fde8e7; color: #c62828; }
.upd-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.role-tabs .chip { font-weight: 600; }
.tab-hint { margin: 0 0 10px; }
.day-h { font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin: 22px 0 8px; }
.empty { padding: 18px; background: var(--card-2); border: 1px dashed var(--line); border-radius: 16px; }
.oc-list { display: grid; gap: 10px; }
.oc, .trip { background: var(--card); border: 1px solid var(--line); border-radius: 20px; box-shadow: var(--shadow); overflow: hidden; }
.oc.sel, .trip.sel { border-color: var(--green-600); box-shadow: 0 0 0 2px var(--green-100), var(--shadow); }
.oc.late { border-color: #f2c6c2; }
.oc-main, .trip-main { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; padding: 14px 18px;
  color: inherit; text-decoration: none; }
.oc-badge { display: inline-grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; font-weight: 800; font-size: 1.05rem; }
.oc-badge.sm { width: 28px; height: 28px; border-radius: 9px; font-size: .78rem; vertical-align: middle; margin-right: 6px; }
.oc-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.oc-title { font-size: 1.12rem; } .oc-when { color: var(--ink); } .oc-facts, .oc-obs { color: var(--muted); font-size: .9rem; }
.oc-state { font-size: .82rem; font-weight: 700; padding: 6px 12px; border-radius: 999px; background: #eceae3; white-space: nowrap; }
.s-primire, .s-modificare, .t-fara_comanda { background: #fff1c2; color: #6b4e00; }
.s-procesare, .t-pregatire { background: #e0e7ff; color: #3730a3; }
.s-incarcare, .t-procesata { background: #dbeafe; color: #1e3a8a; }
.s-gata, .t-livrata { background: #d1fae5; color: #065f46; } .t-incarcata { background: var(--green-700); color: #fff; }
.oc-update { background: var(--gold-100); color: var(--gold-ink); padding: 8px 18px; font-size: .9rem; }
.oc-late { background: var(--warn-bg); color: var(--warn); padding: 8px 18px; font-size: .9rem; }
.oc-hist { display: flex; flex-wrap: wrap; gap: 4px 16px; padding: 0 18px 12px 78px; font-size: .88rem; color: var(--muted); }
.oc-steps { display: flex; gap: 6px; list-style: none; margin: 0; padding: 0 18px 14px 78px; }
.oc-steps li { flex: 1; font-size: .78rem; color: var(--muted); border-top: 4px solid var(--line); padding-top: 4px; }
.oc-steps li.ok { border-color: var(--green-600); color: var(--green-700); font-weight: 600; }
.fd, .sd { border-top: 1px solid var(--line); padding: 16px 18px 18px; background: var(--card-2); }
.fd-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin: 0 0 14px; }
.fd-h { font-size: .95rem; margin: 14px 0 8px; } .fd-h small { font-weight: 400; }
.fd-receipts { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 12px 0 0; padding: 8px 12px; border-radius: 10px;
  background: #fff8e6; border: 1px solid #ecd9a4; }
.fd-more { margin: 12px 0 0; } .fd-more summary { cursor: pointer; font-weight: 600; padding: 6px 0; }
.trip.big .trip-main { padding: 20px 20px; } .trip.big .oc-title { font-size: 1.35rem; }
.trip.big .oc-badge { width: 58px; height: 58px; font-size: 1.3rem; }
.retur-alert.compact { padding: 12px 16px; margin: 0 0 12px; } .retur-alert.compact .retur-big { font-size: 1.05rem; }
@media (max-width: 640px) {
  .oc-main, .trip-main { grid-template-columns: auto 1fr; } .oc-state { grid-column: 1 / -1; justify-self: start; }
  .oc-hist, .oc-steps { padding-left: 18px; } .call-coord { width: 100%; } .role-actions { width: 100%; }
}
/* Panoul zilei */
.pill.red-solid { background: var(--warn); color: #fff; vertical-align: middle; }
.todo { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.todo li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; padding: 10px 14px;
  border-radius: 14px; background: var(--card-2); border: 1px solid var(--line-2); }
.todo li.todo-urgent { background: var(--warn-bg); border-color: #f2c6c2; }
.todo-calls { display: flex; gap: 6px; flex-wrap: wrap; }
.stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin: 0 0 18px; }
.stat-card { display: flex; flex-direction: column; gap: 4px; background: var(--card); border: 1px solid var(--line); border-radius: 20px;
  padding: 16px 18px; box-shadow: var(--shadow); color: inherit; text-decoration: none; }
a.stat-card:hover { border-color: var(--green-600); }
.stat-h { font-weight: 700; } .stat-n { font-size: 1.05rem; } .stat-n b { font-size: 1.4rem; }
.card-h { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px; padding: 18px 22px 8px; }
.pad { padding: 0 22px 18px; }
.flow { overflow-x: auto; padding: 0 0 8px; }
.flow-head, .flow-row { display: grid; grid-template-columns: 110px minmax(170px, 1.4fr) repeat(7, minmax(74px, 1fr)) 96px;
  align-items: center; gap: 6px; padding: 8px 22px; min-width: 900px; }
.flow-head { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.flow-row { border-top: 1px solid var(--line-2); } .flow-row.pending { background: #fffbea; }
.flow-day { font-weight: 600; font-size: .9rem; } .flow-client { color: inherit; text-decoration: none; font-weight: 600; }
.flow-step { display: flex; flex-direction: column; align-items: center; gap: 3px; font-size: .74rem; color: #a6aaa4; }
.flow-step i { width: 14px; height: 14px; border-radius: 50%; border: 2px solid #d3d0c6; }
.flow-step.ok { color: var(--green-700); } .flow-step.ok i { background: var(--green-600); border-color: var(--green-600); }
.flow-step.next { color: #6b4e00; font-weight: 700; } .flow-step.next i { border-color: var(--gold); background: var(--gold-100); }
/* raport */
.warn-card { border-color: #f2c6c2; background: #fffaf9; }
.rep-list { list-style: none; margin: 0 0 6px; padding: 0; display: grid; gap: 6px; }
.rep-list li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; padding: 8px 12px;
  background: var(--card-2); border-radius: 12px; }
.rep-order { margin: 0 0 12px; } .drv-table tr.short td { background: var(--warn-bg); }
.badge.fast { background: #d1fae5; color: #065f46; } .badge.mid { background: #fff1c2; color: #6b4e00; } .badge.slow { background: var(--warn-bg); color: var(--warn); }

/* Setări → Utilizatori: editare / eliminare pe fiecare rând */
.users-list { display: grid; gap: 8px; margin: 0 0 14px; }
.user-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 14px;
  padding: 10px 14px; border: 1px solid var(--line-2); border-radius: 14px; background: var(--card-2); }
.user-row.dim { opacity: .6; }
.user-main { display: flex; flex-direction: column; min-width: 0; }
.user-actions { display: flex; flex-wrap: wrap; gap: 6px; } .user-actions form { margin: 0; }
.user-edit { flex-basis: 100%; display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px;
  padding: 12px 0 2px; border-top: 1px dashed var(--line); }
.user-edit label { display: flex; flex-direction: column; gap: 4px; font-size: .88rem; }
.user-edit label.chk { flex-direction: row; align-items: center; gap: 8px; }
.user-edit-btns { display: flex; gap: 8px; align-items: end; }

/* Parc auto (logistică) */
.fleet-add summary { cursor: pointer; font-weight: 700; }
.fleet-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; align-items: end; margin-top: 12px; }
.fleet-form label { display: flex; flex-direction: column; gap: 4px; font-size: .88rem; }
.fleet-form label.wide { grid-column: 1 / -1; }
.fleet-form textarea { font: inherit; border: 1px solid var(--line); border-radius: 12px; padding: 8px; }
.fl-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; background: var(--card); border: 1px solid var(--line);
  border-radius: 16px; padding: 12px 16px; box-shadow: var(--shadow); }
.fl-main { flex: 1 1 220px; }
.fl-days, .fl-chip { font-size: .8rem; font-weight: 700; padding: 6px 12px; border-radius: 999px; white-space: nowrap; }
.fl-chip { display: inline-block; margin: 2px 4px 2px 0; padding: 3px 10px; }
.d-exp { background: var(--warn); color: #fff; } .d-soon { background: var(--warn-bg); color: var(--warn); }
.d-warn { background: #fff1c2; color: #6b4e00; } .d-ok { background: #d1fae5; color: #065f46; }
.fl-edit { flex-basis: 100%; border-top: 1px dashed var(--line); padding-top: 10px; }
.fl-btns { display: flex; gap: 8px; }
.fl-card { background: var(--card); border: 1px solid var(--line); border-radius: 18px; padding: 14px 18px; box-shadow: var(--shadow); }
.fl-card.dim { opacity: .6; } .fl-card.fs-nou { border-color: #f2c6c2; }
.fl-card-h { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; } .fl-card-h .oc-state { margin-left: auto; }
.fl-text { margin: 6px 0; } .fl-res { margin: 6px 0; padding: 8px 12px; background: var(--ok-bg); border-radius: 12px; font-size: .9rem; }
.fl-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; } .fl-actions input { flex: 1 1 200px; }
.df-nou, .pt-cerere { background: var(--warn-bg); color: var(--warn); } .df-in_lucru, .pt-aprobat { background: #fff1c2; color: #6b4e00; }
.df-rezolvat, .pt-primit { background: #d1fae5; color: #065f46; } .pt-comandat { background: #e0e7ff; color: #3730a3; }
.pt-respins { background: #eceae3; color: var(--muted); }
.fl-history { margin-top: 10px; border-top: 1px dashed var(--line); }
/* șofer: semnalare defect */
.defect-box { margin: 0 0 14px; } .defect-box summary { cursor: pointer; font-weight: 700; font-size: 1.05rem; }

/* Planificare: clienții primiți / așteptați, celule modificate nesalvate */
.sup-strip { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 0 0 12px; }
.sup { font-size: .85rem; font-weight: 600; padding: 5px 12px; border-radius: 999px; }
.sup.ok { background: #d1fae5; color: #065f46; } .sup.wait { background: #fff1c2; color: #6b4e00; }
.sup small { font-weight: 400; opacity: .8; }
/* modificare nesalvată: doar un contur albastru (galbenul e rezervat paleților incompleți) */
.grid td.dirty { box-shadow: inset 0 0 0 2px #2f6fd6; }

/* Confirmarea de recepție Kaufland (WE) */
.we-box { margin-top: 18px; }
.we-row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 14px; padding: 10px 0; border-top: 1px solid var(--line-2); }
.we-files { display: flex; flex-wrap: wrap; gap: 6px; }

/* Paleți CHEP */
.chep-load { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 10px 14px; margin: 0 0 12px;
  background: #e8f0fb; border: 1px solid #c7d8f2; border-radius: 14px; }
.chep-load label { display: flex; align-items: center; gap: 6px; font-size: .9rem; }
.chep-load input { width: 80px; }
.chep-ret { margin: 14px 0; padding: 12px 14px; background: #e8f0fb; border: 1px solid #c7d8f2; border-radius: 14px; display: grid; gap: 10px; }
.chep-ret label { display: flex; flex-direction: column; gap: 4px; font-size: .9rem; }
.chep-ret .ret-main input { font-size: 1.2rem; max-width: 140px; }
.ret-diff { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px 12px; }
.ret-diff p, .ret-diff .wide { grid-column: 1 / -1; }
/* retur de marfă (returns.py) */
.retur-box { margin: 14px 0; }
.retur-box .ret-form { margin-top: 10px; display: grid; gap: 10px; }
.retur-box .ret-form > summary { cursor: pointer; font-weight: 600; padding: 10px 12px; background: #fdf3e1; border: 1px solid #ecd3a3; border-radius: 12px; }
.ret-form[open] { display: grid; gap: 10px; }
.ret-lines { display: grid; gap: 10px; }
.ret-line { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 6px 12px; padding: 10px 12px; border: 1px solid #e3dccb; border-radius: 12px; background: #fffdf8; }
.ret-line > b, .ret-line > small, .ret-line .wide { grid-column: 1 / -1; }
.ret-line label, .ret-form > label.wide { display: flex; flex-direction: column; gap: 4px; font-size: .9rem; }
.ret-line input, .ret-line select { min-width: 0; }
.chep-nums { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 8px 0; font-size: .92rem; }
.cs-diferenta, .cs-aprobare { background: var(--warn-bg); color: var(--warn); } .cs-validare, .cs-declarare { background: #fff1c2; color: #6b4e00; }
.cs-tranzit { background: #e0e7ff; color: #3730a3; } .cs-declarat { background: #d1fae5; color: #065f46; }

.chep-stock { display: flex; flex-wrap: wrap; align-items: end; gap: 10px 16px; }
.chep-stock label { display: flex; flex-direction: column; gap: 4px; font-size: .9rem; }
.chep-stock p { flex-basis: 100%; margin: 0; }

/* Lădițe EPS */
.eps-load { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; flex-basis: 100%; }
.eps-load input { width: 80px; }
.eps-confirm { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 8px 12px; margin-top: 10px; align-items: end; }
.eps-confirm label { display: flex; flex-direction: column; gap: 4px; font-size: .88rem; }
.eps-confirm .wide { grid-column: 1 / -1; }

/* Conectorul EPS */
.eps-conn { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 10px 14px; margin: 0 0 14px;
  border-radius: 14px; background: var(--card-2); border: 1px solid var(--line); }
.eps-conn.st-ok { background: var(--ok-bg); border-color: #b9dcc6; }
.eps-conn.st-login_necesar, .eps-conn.st-eroare { background: var(--warn-bg); border-color: #f2c6c2; }
.eps-conn.st-nelogat { background: #fff1c2; border-color: #ecd68a; }
.eps-flows .nowrap { white-space: nowrap; }

.eps-dispute { margin-top: 6px; } .eps-dispute summary { cursor: pointer; font-size: .88rem; color: var(--warn); }
.eps-dispute label { display: flex; flex-direction: column; gap: 3px; font-size: .85rem; margin: 6px 0; }
.eps-dispute input { max-width: 260px; }

/* Transport închiriat — date de la transportator */
.rented-box { border-color: #c7d8f2; background: #f4f8fe; }
.rented-now { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 6px 0; font-size: 1rem; }
.rented-edit summary, .rented-hist summary { cursor: pointer; font-weight: 600; margin-top: 8px; }

/* ---- parc auto: proprietar / folosință, șoferi, PV (15.10.2026) ---- */
.fl-filter { margin: 4px 0 12px; flex-wrap: wrap; }
.badge.us-public { background: #d1fae5; color: #065f46; } .badge.us-ferma { background: #fff1c2; color: #6b4e00; }
.badge.us-nefolosit { background: #e5e7eb; color: #4b5563; } .badge.us-nestabilit { background: var(--warn-bg); color: var(--warn); }
.fl-checks { border: 1px solid var(--line); border-radius: 12px; padding: 6px 10px; display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: .88rem; }
.fl-checks legend { padding: 0 4px; } .fl-checks label { flex-direction: row !important; align-items: center; }
.fl-card .fl-btns { flex-wrap: wrap; margin-top: 8px; }
.pv-form .card { margin-bottom: 14px; }
.pv-item + .pv-item { border-top: 1px dashed var(--line); padding-top: 10px; }
.pv-table { display: grid; gap: 6px; margin-top: 10px; }
.pv-row { display: grid; grid-template-columns: 26px minmax(160px, 1.2fr) 1fr; gap: 8px; align-items: center; font-size: .92rem; }
.pv-table.acc .pv-row { grid-template-columns: minmax(160px, 1.4fr) 80px 90px; }
.pv-row input[type=checkbox] { width: 20px; height: 20px; }
.pv-actions { display: flex; gap: 10px; flex-wrap: wrap; margin: 6px 0 30px; }
.pv-view { width: 100%; border-collapse: collapse; font-size: .92rem; }
.pv-view th, .pv-view td { text-align: left; padding: 8px 14px; border-top: 1px solid var(--line); vertical-align: top; }
.pv-view tr.dim td { opacity: .55; }
.pv-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 14px; }
@media (max-width: 640px) {
  .pv-row { grid-template-columns: 26px 1fr; } .pv-row > input:not([type=checkbox]) { grid-column: 1 / -1; }
  .pv-table.acc .pv-row { grid-template-columns: 1fr 70px 80px; } .pv-table.acc .pv-row > input { grid-column: auto; }
  .pv-view { display: block; overflow-x: auto; }
}

/* Raportare ambalaje — declarația AFM depusă (16.10.2026) */
.pk-afm { margin: 10px 0; padding: 10px 12px; border-radius: 10px; background: #eef6f0; border: 1px solid #b9d8c3; font-size: 14px; line-height: 1.5; }
.pk-card h3 { margin: 14px 0 6px; font-size: 15px; }
.pk-red { color: #b42318; font-weight: 700; }

/* Fabrica — mai multe loturi pe același articol (16.10.2026) */
.lots-cell .lot-row { display: flex; gap: 6px; align-items: center; margin-bottom: 6px; }
.lots-cell .lot-row .txt { width: 8.5em; }
.lots-cell .lot-row .num { width: 6.5em; }
.lots-cell .lot-del { border: 0; background: transparent; color: #b42318; font-size: 18px; cursor: pointer; padding: 4px 6px; min-width: 32px; min-height: 32px; }
.lots-cell .lot-add { display: block; margin-top: 6px; border: 1px dashed #8aa898; background: #f4f8f5; color: #0b3d2a; border-radius: 8px; padding: 6px 10px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.lots-cell .lot-add:hover { background: #e6f0ea; }
.lot-total { font-size: 18px; }
.fab-table .lots-cell .lot-row input.txt { flex: 1 1 8em; min-width: 6em; width: auto; }
.fab-table .lots-cell .lot-row input.num { flex: 0 0 7.5em; min-width: 7.5em; width: 7.5em; display: block; }

/* Comanda fermă — coloanele pentru Saga (UIT / aviz), doar biroul (16.10.2026) */
.grid th.grp-saga { background: #ece6f7; color: #3b2a63; }
.grid td.saga { background: #f7f4fc; text-align: right; white-space: nowrap; }
.grid td.saga.num-b { font-weight: 700; }
.grid tfoot th, .grid tfoot td { border-top: 2px solid #cfc6e3; }
.saga-box > summary { cursor: pointer; list-style: none; display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.saga-box > summary h2 { display: inline; margin: 0; }
.saga-tbl td.saga { min-width: 4.5em; }

/* chat ca pop-up (19.10.2026): balon în colțul din dreapta jos, chatul intern într-un iframe */
.chatbubble { position: fixed; right: 22px; bottom: 22px; z-index: 60; display: flex; align-items: center; gap: 10px;
  border: 0; cursor: pointer; background: var(--green-900); color: var(--gold); border-radius: 999px; padding: 8px 8px 8px 18px;
  box-shadow: 0 10px 28px rgba(6, 36, 24, .35); font: inherit; }
.chatbubble svg { background: var(--gold); color: var(--green-900); border-radius: 50%; padding: 11px; width: 50px; height: 50px; box-sizing: border-box; }
.chatbubble .cb-label { color: #fff; font-weight: 600; }
.chatbubble .cb-badge { position: absolute; top: -6px; right: -4px; background: #b42318; color: #fff; border-radius: 999px;
  min-width: 24px; height: 24px; display: grid; place-items: center; font-size: .8rem; padding: 0 6px; border: 2px solid #fff; }
.chatbubble.ping { animation: cbPing .6s ease-in-out 3; }
@keyframes cbPing { 50% { transform: scale(1.12); } }
body.chatpop-open .chatbubble { display: none; }
.chatpop { position: fixed; right: 22px; bottom: 22px; z-index: 61; width: 420px; height: min(680px, calc(100vh - 44px));
  background: var(--card); border-radius: 22px; overflow: hidden; display: flex; flex-direction: column;
  box-shadow: 0 18px 50px rgba(6, 36, 24, .4); border: 1px solid var(--line); }
.chatpop[hidden] { display: none; }
.chatpop header { display: flex; align-items: center; gap: 8px; padding: 10px 12px 10px 18px; background: var(--green-900); color: #fff; }
.chatpop header b { flex: 1; display: flex; align-items: center; gap: 8px; font-weight: 600; }
.chatpop header a, .chatpop header button { color: #fff; background: rgba(255, 255, 255, .1); border: 0; border-radius: 10px;
  width: 34px; height: 34px; display: grid; place-items: center; text-decoration: none; cursor: pointer; font-size: 1rem; }
.chatpop iframe { flex: 1; border: 0; width: 100%; background: var(--bg, #f6f3ea); }
@media (max-width: 640px) {
  .chatbubble { right: 14px; bottom: 14px; padding: 6px; }
  .chatbubble .cb-label { display: none; }
  .chatpop { inset: 0; width: auto; height: auto; border-radius: 0; border: 0; }
}
@media print { .chatbubble, .chatpop { display: none !important; } }
/* paginile de chat deschise în pop-up: fără meniu și bară de sus */
html.embed .side, html.embed .topbar, html.embed .danger-banner, html.embed .scrim { display: none !important; }
html.embed .app { display: block; }
html.embed main { padding: 10px; }
html.embed .chat-page .hero { padding: 14px 16px; border-radius: 18px; }
html.embed .chat-page .hero p, html.embed .chat-page .hero .eyebrow { display: none; }
html.embed .chat-page .hero h1 { font-size: 1.4rem; margin: 0; }
html.embed body.room-mode main { padding: 0; }
html.embed .room { height: 100vh; min-height: 0; border-radius: 0; border: 0; margin: 0; }
body:has(.chatbubble) main { padding-bottom: 100px; }
html.embed .chat-page .hero { padding: 0; background: none; box-shadow: none; margin-bottom: 10px; }
html.embed .chat-page .hero > div:first-child, html.embed .hub-head { display: none; }
html.embed .chat-page .hero-search { width: 100%; border: 1px solid var(--line); }
html.embed .hub { gap: 10px; }
html.embed .hub-cats { padding: 10px; }
html.embed .hub-cats nav { margin: 0 0 8px; }
html.embed .hub-list > .chips { padding: 10px 12px; }
html.embed .conv-grid { padding: 8px; gap: 8px; }
/* anunțul pentru angajați (jurnalul conversațiilor, 19.10.2026) */
.notice-modal { position: fixed; inset: 0; z-index: 100; background: rgba(6, 36, 24, .6); display: grid; place-items: center; padding: 16px; }
.notice-card { background: var(--card); border-radius: 22px; padding: 26px; max-width: 560px; width: 100%; max-height: calc(100vh - 32px);
  overflow-y: auto; box-shadow: 0 20px 60px rgba(0, 0, 0, .35); }
.notice-card h2 { margin: 4px 0 14px; }
.notice-text, .journal-text { white-space: pre-wrap; line-height: 1.5; }
.notice-card .btn { margin-top: 18px; }
html.embed .notice-modal { display: none; }
.chat-notice { font-size: .85rem; color: var(--muted); padding: 4px 4px 10px; }
.chat-notice a { color: inherit; }
.journal { display: grid; grid-template-columns: 260px 1fr; gap: 18px; align-items: start; }
.journal-days a { display: flex; justify-content: space-between; padding: 8px 12px; border-radius: 12px; text-decoration: none; color: var(--ink); }
.journal-days a.on { background: var(--green-800); color: #fff; }
.journal-text { font-size: .92rem; background: var(--card-2); border-radius: 14px; padding: 14px; max-height: 70vh; overflow-y: auto; }
@media (max-width: 900px) { .journal { grid-template-columns: 1fr; } }
/* livrări anulate și livrări adăugate de mână în planificare (19.10.2026) */
.tot.cancelled { opacity: .6; background: repeating-linear-gradient(135deg, var(--card), var(--card) 8px, #f3e3e1 8px, #f3e3e1 16px); }
.tot.cancelled .n { text-decoration: line-through; }
.tot-act { margin-top: 6px; }
.tot-act .link.danger { color: #b42318; }
.grid th.cancelled, .grid td.cancelled { background: #f6e4e2; }
.cancel-tag { color: #b42318; letter-spacing: .06em; }
/* cardurile livrărilor din planificare, grupate pe zile (19.10.2026) */
.dl-board { margin: 14px 0 18px; }
.dl-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.dl-head h2 { margin: 0; font-size: 1.15rem; }
.dl-days { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; align-items: start; }
.dl-day { display: flex; flex-direction: column; gap: 10px; }
.dl-date { font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); padding: 0 4px; }
.dl-date b { color: var(--ink); }
.dl-card { background: var(--card); border: 1px solid var(--line); border-radius: 18px; padding: 12px 14px; display: flex;
  flex-direction: column; gap: 8px; box-shadow: 0 1px 2px rgba(6, 36, 24, .05); }
.dl-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.dl-client { font-size: 1.02rem; line-height: 1.25; }
.dl-act { border: 1px solid transparent; background: none; color: var(--muted); border-radius: 9px; width: 28px; height: 28px;
  flex: none; cursor: pointer; font-size: .85rem; display: grid; place-items: center; }
.dl-act:hover { color: #b42318; background: #fbecea; border-color: #f2c9c4; }
.dl-act.restore { width: auto; padding: 0 10px; color: var(--green-800); border-color: var(--line); font-size: .8rem; }
.dl-act.restore:hover { color: #fff; background: var(--green-800); border-color: var(--green-800); }
.dl-pal { font-variant-numeric: tabular-nums; } .dl-pal b { font-size: 1.5rem; } .dl-pal span { color: var(--muted); }
.dl-bar { height: 6px; border-radius: 99px; background: var(--card-2, #eef1ec); overflow: hidden; }
.dl-bar i { display: block; height: 100%; background: var(--green-600, #2f7d5b); border-radius: 99px; }
.dl-with { display: flex; align-items: center; justify-content: space-between; gap: 6px; background: var(--card-2, #f3f5f1);
  border-radius: 10px; padding: 4px 4px 4px 10px; font-size: .88rem; }
.dl-with .dl-act { width: 24px; height: 24px; }
.dl-truck { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; }
.dl-truck small { font-size: .75rem; padding-left: 4px; }
.dl-badge { display: inline-block; font-size: .8rem; padding: 4px 10px; border-radius: 99px; background: var(--card-2, #f1f3ef);
  border: 1px solid var(--line); line-height: 1.3; }
.dl-badge.green { background: #e7f2ec; border-color: #c8e2d3; color: #14532d; }
.dl-badge.red { background: #b42318; border-color: #b42318; color: #fff; font-weight: 700; letter-spacing: .08em; align-self: flex-start; }
.dl-note { margin: 0; font-size: .82rem; }
.dl-warn { margin: 0; font-size: .82rem; color: #b42318; font-weight: 600; }
.dl-card.over { border-color: #e9a59c; background: #fff7f5; } .dl-card.over .dl-pal b { color: #b42318; }
.dl-card.over .dl-bar i { background: #b42318; }
.dl-card.cancelled { background: repeating-linear-gradient(135deg, #faf6f5, #faf6f5 10px, #f4ebe9 10px, #f4ebe9 20px); border-style: dashed; }
.dl-card.cancelled .dl-client { color: var(--muted); text-decoration: line-through; }
@media (max-width: 640px) { .dl-days { grid-template-columns: 1fr; } }
.grid td.shared { background: #eef6f1; }
.grid td.shared .shared-note { display: block; margin-top: 4px; color: var(--muted); font-size: .78rem; }
.grid tr.trow td.shared { text-align: center; } .grid tr.trow td.shared .auto-truck { display: block; }
/* /sofer (19.10.2026): tabloul șoferilor pentru birou și săptămâna șoferului */
.drv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; margin-bottom: 8px; }
.drv-card { background: var(--card); border: 1px solid var(--line); border-radius: 18px; padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; }
.drv-card.on-road { border-color: #9cc9ae; box-shadow: inset 4px 0 0 #2f7d5b; }
.drv-card header { display: flex; align-items: center; gap: 10px; }
.drv-card header form { margin: 0; }
.drv-name { flex: 1; display: flex; flex-direction: column; line-height: 1.25; }
.drv-name small a { color: var(--muted); }
.drv-now { background: var(--card-2, #f3f5f1); border-radius: 12px; padding: 10px 12px; display: flex; flex-direction: column; gap: 4px; }
.drv-now small { text-transform: uppercase; letter-spacing: .06em; font-size: .72rem; color: var(--muted); }
.drv-now .oc-state { align-self: flex-start; }
.drv-flag { align-self: flex-start; font-size: .75rem; color: #8a5a00; background: #fff4d6; border-radius: 99px; padding: 2px 8px; }
.drv-stats { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: .85rem; color: var(--muted); }
.drv-stats b { color: var(--ink); }
.drv-card details summary { cursor: pointer; font-size: .9rem; font-weight: 600; }
.drv-docs { margin: 4px 0 8px; padding-left: 18px; font-size: .86rem; display: grid; gap: 3px; }
.drv-week tr.today th, .drv-week tr.today td { background: #fff8e6; }
.week-strip { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; margin-bottom: 8px; }
.wk-day { background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 10px 12px; display: flex;
  flex-direction: column; gap: 3px; color: var(--ink); text-decoration: none; }
.wk-day small { color: var(--muted); } .wk-day span { font-size: .85rem; } .wk-day em { font-style: normal; font-size: .82rem; font-weight: 600; }
.wk-day.today { border-color: var(--gold); box-shadow: 0 0 0 2px var(--gold) inset; }
.wk-day.ts-incarcata { background: #e7f2ec; } .wk-day.ts-livrata { opacity: .7; }
.drv-card.rented { border-style: dashed; }
.drv-card header .oc-state { margin-left: auto; font-size: .78rem; }
.trip-upd { display: grid; grid-template-columns: 1fr; gap: 6px; }
.trip-upd select, .trip-upd input { width: 100%; }
@media (min-width: 700px) { .trip-upd { grid-template-columns: 1fr 1.4fr auto; } }

/* comanda fermă: șofer și mașină, schimbate urgent (20.10.2026) */
.firm-own-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px 14px; margin: 8px 0; }
.firm-own-grid label { display: flex; flex-direction: column; gap: 4px; font-weight: 600; font-size: .9rem; }
.firm-own-grid select, .firm-own-grid input { font-weight: 400; }
.oc-trip { padding: 0 18px 10px 78px; font-size: .9rem; } .oc-trip.changed { color: #b42318; font-weight: 700; }
@media (max-width: 700px) { .oc-trip { padding-left: 18px; } }

/* comanda fermă la birou (20.10.2026): tot tabelul pe ecran, fără bară orizontală */
main:has(table.firm.compact) { max-width: 1800px; }
.firm-wrap:has(table.compact) { overflow-x: visible; }
table.firm.compact { width: 100%; }
table.firm.compact th, table.firm.compact td { padding: 5px 7px; white-space: normal; }
table.firm.compact thead th { font-size: .8rem; line-height: 1.25; }
table.firm.compact thead th small { display: block; font-weight: 400; color: var(--muted); font-size: .72rem; }
table.firm.compact th.sticky { position: static; min-width: 150px; }
table.firm.compact th.sticky small.um { display: inline; font-size: .75rem; }
table.firm.compact input.num { width: 6.2em; min-width: 0; padding: 5px 6px; }
table.firm.compact td.diffs { white-space: nowrap; } table.firm.compact td.diffs .diff-pill { margin: 1px 0; }
table.firm.compact td small { display: block; font-size: .72rem; }
table.firm.compact td.ordered, table.firm.compact td.saga { white-space: nowrap; }
@media (max-width: 900px) { .firm-wrap:has(table.compact) { overflow-x: auto; } table.firm.compact th.sticky { position: sticky; } }
table.firm.compact td.fabcol { min-width: 6.8em; } table.firm.compact td.fabcol small { white-space: nowrap; display: inline-block; margin-right: 4px; }

/* FRAHER (20.10.2026): poza din WhatsApp lângă tabelul pe magazine */
.fraher-layout { display: grid; grid-template-columns: minmax(300px, 38%) 1fr; gap: 14px; align-items: start; margin: 8px 0; }
.fraher-layout.nophoto { grid-template-columns: 1fr; }
.fraher-transport, .fraher-manual h3 { margin: 10px 0 4px; }
.fraher-photos { display: flex; flex-direction: column; gap: 4px; position: sticky; top: 70px; }
.fraher-photos img { width: 100%; border-radius: 12px; border: 1px solid var(--line); background: #fff; }
.fraher-wrap:has(table.fraher-grid) { overflow-x: auto; }
table.fraher-grid { width: 100%; }
table.fraher-grid th, table.fraher-grid td { padding: 4px 5px; white-space: normal; text-align: center; }
table.fraher-grid thead th { font-size: .78rem; } table.fraher-grid thead th small { display: block; font-weight: 400; color: var(--muted); font-size: .68rem; }
table.fraher-grid th.sticky { text-align: left; min-width: 120px; font-size: .85rem; }
table.fraher-grid th.sticky small.um { display: inline; }
table.fraher-grid input.num { width: 3.4em; min-width: 0; padding: 4px; text-align: center; }
table.fraher-grid .e3 { background: #eef3ff; }
table.fraher-grid td.changed input { outline: 2px solid #2f6fdb; }
@media (max-width: 1500px) { .fraher-layout { grid-template-columns: 1fr; } .fraher-photos { position: static; } .fraher-photos img { max-height: 60vh; object-fit: contain; } }
/* anularea unei livrări: doar săptămâna aceasta / permanent (21.10.2026) */
.dlg fieldset.scope { border: 1px solid var(--line); border-radius: 12px; padding: 8px 12px; margin: 10px 0; }
.dlg fieldset.scope legend { font-size: .85rem; color: var(--muted); padding: 0 4px; }
.dlg fieldset.scope label.radio { display: flex; gap: 10px; align-items: flex-start; margin: 6px 0; font-weight: 400; cursor: pointer; }
.dlg fieldset.scope input[type=radio] { width: 18px; height: 18px; margin-top: 3px; flex: none; }
.perm-cancels li { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; }
/* comenzi ferme în același camion (21.10.2026: Nick Activ Total + Kaufland Ploiesti) */
.dl-act.firm { width: auto; padding: 0 8px; color: var(--green-800); border-color: var(--line); font-size: .74rem; text-decoration: none;
  display: inline-flex; align-items: center; white-space: nowrap; }
.dl-act.firm:hover { color: #fff; background: var(--green-800); border-color: var(--green-800); }
.truck-mates { display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; background: var(--green-100); border-radius: 12px;
  padding: 8px 12px; margin: 8px 0; font-size: .9rem; }
.truck-mates .mate.me { font-weight: 600; } .truck-mates small { color: var(--muted); }
/* comenzi ferme de creat pentru clienții fără email (21.10.2026) */
.extra-missing { border: 2px dashed var(--gold); }
.extra-missing .row-like { display: grid; grid-template-columns: 92px 1fr auto; gap: 10px; align-items: center; padding: 10px 14px;
  background: var(--card); border: 1px solid var(--line); border-radius: 14px; }
@media (max-width: 640px) { .extra-missing .row-like { grid-template-columns: 70px 1fr; } .extra-missing .row-like .btn { grid-column: 2; justify-self: start; } }
/* Nick Activ Total: avizul în oglindă (21.10.2026) */
.nick-box h2 { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.nick-box .nick-tbl { max-width: 640px; margin: 6px 0 10px; }
.nick-box tr.warnrow td { background: var(--warn-bg); }
.office-confirm { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 10px 0 0; }