:root { --ink: #3f2b1f; --brown: #56351f; --brown-deep: #392116; --accent: #c84b2d; --accent-dark: #a83921; --beige: #efe0c9; --paper: #fbf4e9; --line: #e6d7c3; }
body { background: var(--paper); color: var(--ink); font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif; }
.app-navbar { background: linear-gradient(115deg, var(--brown-deep), var(--brown)); box-shadow: 0 4px 22px rgba(57,33,22,.22); }
.navbar-brand { font-weight: 750; letter-spacing: -.02em; }
.brand-logo { width:44px; height:44px; object-fit:contain; }
.brand-title { width:145px; height:36px; object-fit:contain; filter:brightness(0) invert(1); }
.nav-link { border-radius: .5rem; padding-left: .85rem!important; padding-right: .85rem!important; }
.nav-link.active { background: rgba(255,255,255,.13); }
.page-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:2rem; margin-bottom:1.5rem; }
.page-heading.compact { align-items:center; }
.page-heading h1 { margin:.12rem 0 .25rem; font-size:clamp(2rem,4vw,3rem); letter-spacing:-.045em; font-weight:800; }
.page-heading p { margin:0; color:#657086; }
.eyebrow { color:var(--accent); font-size:.75rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.card { border:1px solid var(--line); border-radius:1rem; box-shadow:0 7px 25px rgba(23,33,52,.055); }
.filter-card, .form-card { padding:1.25rem; }
.table-card { overflow:hidden; }
.table > :not(caption) > * > * { padding:1rem 1.1rem; border-bottom-color:var(--line); }
.table thead th { background:#f1e4d3; color:#6f5848; font-size:.72rem; letter-spacing:.07em; text-transform:uppercase; border:0; }
.description-cell { max-width:320px; }
.reference { color:#526078; font-family:ui-monospace, SFMono-Regular, Menlo, monospace; font-size:.87rem; }
.btn { border-radius:.6rem; font-weight:650; }
.btn-primary { background:var(--accent); border-color:var(--accent); }
.btn-primary:hover,.btn-primary:focus { background:var(--accent-dark); border-color:var(--accent-dark); }
.btn-outline-primary { color:var(--accent); border-color:var(--accent); }
.btn-outline-primary:hover { background:var(--accent); border-color:var(--accent); }
.form-control,.form-select,.input-group-text { border-color:#d9e0ea; border-radius:.6rem; min-height:43px; }
.form-label { font-size:.82rem; font-weight:700; color:#49566c; }
.form-actions { display:flex; justify-content:flex-end; align-items:center; gap:.5rem; padding-top:1.5rem; margin-top:1.5rem; border-top:1px solid var(--line); }
.line-row { padding:1rem 0; border-top:1px solid var(--line); }
.line-row:first-child { border-top:0; padding-top:0; }
.status { display:inline-flex; align-items:center; gap:.35rem; border-radius:999px; padding:.3rem .62rem; font-size:.72rem; font-weight:800; letter-spacing:.035em; }
.status-recu,.status-payee { color:#127141; background:#def6e9; }
.status-en_attente { color:#936413; background:#fff1cd; }
.status-annule,.status-annulee { color:#a53e45; background:#fde4e6; }
.status-place,.status-placee { color:#285fa7; background:#e3efff; }
.status-envoyee { color:#6752a4; background:#eee9ff; }
.status-recue { color:#28756f; background:#ddf4f1; }
.status-select { min-width:125px; border:0; font-weight:700; }
.row-recu { box-shadow:inset 4px 0 #32a568; }
.row-en_attente { box-shadow:inset 4px 0 #e0a72c; }
.row-annule,.row-annulee { opacity:.65; box-shadow:inset 4px 0 #d5676d; }
.row-payee { box-shadow:inset 4px 0 #32a568; }
.empty-state { padding:4rem 1rem; text-align:center; color:#758095; }
.metric-card { padding:1.2rem; height:100%; }
.metric-label { color:#758095; font-size:.76rem; font-weight:750; letter-spacing:.06em; text-transform:uppercase; }
.metric-value { font-size:1.8rem; line-height:1.2; font-weight:800; letter-spacing:-.04em; }
.stock-value-card { min-width:270px; padding:1rem 1.2rem; }
.stock-negative { color:#b43a43; font-weight:800; }
.stock-positive { color:#157247; font-weight:800; }
.btn-order { width:2rem; padding:.15rem; border:1px solid var(--line); background:#fff; color:#526078; }
.btn-order:hover { color:var(--accent); border-color:var(--accent); }
.order-column { width:92px; }
.image-dot { color:var(--accent); font-size:.55rem; margin-right:.4rem; vertical-align:middle; }
.item-hover[data-image] { cursor:help; text-decoration:underline dotted #aab4c5; text-underline-offset:3px; }
#item-image-preview { position:fixed; z-index:1100; left:0; top:0; width:220px; height:180px; padding:8px; border-radius:14px; background:#fff; box-shadow:0 15px 45px rgba(16,36,62,.28); opacity:0; visibility:hidden; pointer-events:none; transition:opacity .15s; }
#item-image-preview.visible { opacity:1; visibility:visible; }
#item-image-preview img { width:100%; height:100%; object-fit:contain; border-radius:9px; background:#f2f4f8; }
.current-image { display:flex; align-items:center; }
.current-image img { width:90px; height:70px; object-fit:contain; border:1px solid var(--line); border-radius:.6rem; background:#fff; }
.money-positive { color:#157247; }
.money-negative { color:#b43a43; }
.transaction-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; margin-top:1rem; border:1px solid var(--line); border-radius:.8rem; overflow:hidden; background:var(--line); }
.transaction-summary > div { display:flex; flex-direction:column; padding:1rem; background:#f8fafc; }
.summary-label { color:#758095; font-size:.72rem; font-weight:750; letter-spacing:.06em; text-transform:uppercase; }
.summary-value { margin-top:.2rem; font-size:1.25rem; font-weight:800; }
.category-separator td { padding:.65rem 1.1rem!important; background:#ead7bd!important; color:var(--brown); font-size:.78rem; font-weight:850; letter-spacing:.075em; text-transform:uppercase; border-top:2px solid #d8bea0; }
.category-separator span { margin-left:.45rem; color:#8b7462; font-weight:600; letter-spacing:0; text-transform:none; }
.month-separator td { padding:.72rem 1.1rem!important; background:var(--brown)!important; color:#fff; font-size:.8rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.transaction-category { margin:.35rem 0 .1rem; color:var(--accent); font-size:.66rem; font-weight:850; letter-spacing:.06em; text-transform:uppercase; }
.transaction-category:first-child { margin-top:0; }
.category-badge { color:var(--brown); background:#ead7bd; }
.line-table thead th { padding:.7rem .8rem; }
.line-table td { padding:.75rem .8rem!important; }
.empty-lines { padding:2rem; text-align:center; color:#8b7b70; border:1px dashed var(--line); border-radius:.7rem; }
.modal-content { border:0; border-radius:1rem; box-shadow:0 25px 70px rgba(57,33,22,.25); }
#modal-item-select { min-height:245px; }
#modal-item-select optgroup { color:var(--accent); font-weight:800; }
#modal-item-select option { color:var(--ink); padding:.3rem .5rem; font-weight:500; }
.config-list { display:flex; flex-direction:column; gap:.45rem; }
.config-row { display:flex; align-items:center; gap:.45rem; min-height:46px; padding:.45rem .55rem; border:1px solid var(--line); border-radius:.65rem; background:#fffaf4; }
.config-order { display:grid; place-items:center; width:26px; height:26px; border-radius:50%; background:var(--beige); color:var(--brown); font-size:.75rem; font-weight:800; }
.btn-invoice { color:#fff; background:var(--brown); border-color:var(--brown); white-space:nowrap; }
.btn-invoice:hover { color:#fff; background:var(--accent); border-color:var(--accent); }
.btn-invoice span { display:inline-grid; place-items:center; padding:.05rem .25rem; margin-right:.2rem; border-radius:.2rem; background:#fff; color:var(--accent); font-size:.6rem; font-weight:900; }
.movement-choice { display:grid; grid-template-columns:1fr 1fr; gap:.6rem; }
.movement-choice .btn { padding:.75rem; }
@media (max-width: 600px) { .transaction-summary { grid-template-columns:1fr; } }
@media (max-width: 767px) { .page-heading { align-items:flex-start; flex-direction:column; gap:1rem; } .page-heading .btn { width:100%; } .table > :not(caption) > * > * { padding:.8rem; } .brand-title { width:120px; } }
