:root{
  --bg:#f1f1ef; --ink:#20242b; --steel:#1d2634; --steel2:#2d3849;
  --gold:#c9a44c; --blue:#2075f2; --blueh:#1860d0;
  --line:#d1d4d8; --line2:#cfd2d6; --pill:#f4f5f6;
  --muted:#6f7480; --green:#1b5e20; --warn:#8a6d10; --red:#c53333;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font:13px Arial,system-ui,-apple-system,sans-serif;min-height:100vh}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}

/* ============ shell ============ */
.shell{display:grid;grid-template-columns:190px minmax(0,1fr);min-height:100vh}
.side{position:sticky;top:0;height:100vh;background:var(--steel);color:#e9eef5;border-right:1px solid #0d141d;display:flex;flex-direction:column;z-index:40;overflow:auto}
.side-brand{display:flex;gap:10px;align-items:center;min-height:72px;padding:14px;border-bottom:1px solid rgba(255,255,255,.08)}
.side-brand .mark{display:grid;place-items:center;width:42px;height:42px;border:2px solid #e9eef5;border-radius:5px;font-family:ui-monospace,monospace;font-size:20px;font-weight:900}
.side-brand .txt strong{font-family:ui-monospace,monospace;font-size:12px;line-height:1.1;text-transform:uppercase;letter-spacing:.08em;display:block}
.side-brand .txt small{display:block;margin-top:4px;color:var(--gold);font-size:10px;font-weight:900;letter-spacing:.22em}
.side nav{padding:10px 9px;display:flex;flex-direction:column;gap:3px}
.side nav a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:3px;color:#dbe3ed;font-weight:800;border:1px solid transparent;cursor:pointer;font-size:13px}
.side nav a:hover{background:#283446}
.side nav a.on{background:#344258;color:#fff;border-color:#46546a;box-shadow:inset 3px 0 0 var(--gold)}
.side nav a.on .ico{color:var(--gold)}
.side nav a .ico{width:19px;text-align:center;color:#cbd5e1;font-size:14px}
.side nav .grp{font-family:ui-monospace,monospace;font-size:9px;color:#7a8696;text-transform:uppercase;letter-spacing:.18em;padding:10px 12px 4px}

.body{min-width:0;display:flex;flex-direction:column}
.topbar{height:48px;background:var(--steel);color:#fff;border-bottom:1px solid #0e151d;display:grid;grid-template-columns:minmax(220px,360px) minmax(280px,1fr) auto;align-items:center;gap:16px;padding:0 16px;position:sticky;top:0;z-index:30}
.topbar .ttl small{display:block;color:var(--gold);font-family:ui-monospace,monospace;font-size:10px;letter-spacing:.14em;font-weight:900}
.topbar .ttl strong{display:block;font-size:14px;letter-spacing:.03em}
.topbar .ttl strong.code{font-family:ui-monospace,monospace;font-size:14px;font-weight:900}
.topbar .search input{width:100%;height:30px;border:1px solid #46546a;background:#131c28;color:#fff;border-radius:3px;padding:6px 10px;outline:0}
.topbar .search input::placeholder{color:#9eabba}
.topbar .user{font-size:12px;color:#dce4ee;font-weight:800;white-space:nowrap}

main{padding:14px}

/* ============ banner mockup amarillo ============ */
.mockup-banner{background:#fff7d6;border:1px solid #e8d68b;color:#6c5709;font-size:12px;padding:9px 12px;border-radius:3px;margin:0 0 12px;text-align:center;font-weight:700}
.mockup-banner strong{color:#8a6d10;letter-spacing:.06em}

/* ============ buttons ============ */
.btn{border:1px solid #c8ccd2;background:#fff;color:#1b1f27;padding:7px 13px;border-radius:3px;font-weight:900;font-size:12px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:5px;line-height:1.2;min-height:32px}
.btn.primary{background:var(--blue);border-color:var(--blue);color:#fff}
.btn.dark{background:var(--steel);border-color:var(--steel);color:#fff}
.btn.gold{background:var(--gold);border-color:var(--gold);color:var(--steel)}
.btn.danger{background:#fff;border-color:#e3a8a8;color:var(--red)}
.btn.ghost{background:#fff;color:var(--steel)}
.btn:hover{filter:brightness(.97)}

/* ============ toolbar ============ */
.toolbar{background:#f8f8f7;border:1px solid var(--line2);padding:8px 10px;border-radius:3px;display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.toolbar .docnum{margin-left:auto;color:#444;font-size:11px;letter-spacing:.04em;font-family:ui-monospace,monospace}

/* ============ cards / layout ============ */
.layout{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:12px;align-items:start}
.card{background:#fff;border:1px solid var(--line);border-radius:3px;padding:12px;margin-bottom:12px}
.section-title{font-family:ui-monospace,monospace;font-size:11px;text-transform:uppercase;letter-spacing:.09em;font-weight:900;color:var(--steel);border-bottom:1px solid #e2e5e9;padding-bottom:7px;margin-bottom:10px;display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.section-title small{color:var(--muted);font-size:10px;text-transform:none;letter-spacing:0;font-weight:700;font-family:Arial,sans-serif}
.grid{display:grid;gap:10px}
.grid.c1{grid-template-columns:1.1fr .7fr 1.6fr 1fr}
.grid.c2{grid-template-columns:1fr 1.2fr .55fr;margin-top:10px}
.grid.cped{grid-template-columns:.8fr .65fr 1fr;margin-top:10px}
.grid.c-art2{grid-template-columns:1fr 1fr}
.grid.c-art3{grid-template-columns:1fr 1fr 1fr}
.field{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:900;margin-bottom:4px;font-family:ui-monospace,monospace}
.field small{float:right;color:#9aa0a8;font-weight:800;font-family:Arial,sans-serif;text-transform:lowercase;letter-spacing:0}
input,select,textarea{width:100%;border:1px solid #c8ccd2;border-radius:3px;padding:7px 8px;font-size:13px;background:#fff;color:var(--ink);min-height:34px;outline:0}
input:focus,select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 2px rgba(32,117,242,.15)}
input[readonly]{background:#f4f5f6;color:#636b76}
textarea{min-height:72px;resize:vertical}

/* ============ tablas editables (líneas) ============ */
.lines{width:100%;border-collapse:collapse;table-layout:fixed;font-size:12px}
.lines th{background:#f4f5f6;color:#4c5563;text-transform:uppercase;letter-spacing:.06em;font-size:10px;font-weight:900;padding:6px 5px;border:1px solid #dfe2e6;text-align:left;font-family:ui-monospace,monospace}
.lines td{border:1px solid #e2e5e9;padding:6px 7px;background:#fff;vertical-align:middle}
.lines th.num,.lines td.num{width:34px;text-align:center;color:#6f7480;background:#fafafa;font-family:ui-monospace,monospace}
.lines th.qty,.lines td.qty{width:70px;text-align:right}
.lines th.pri,.lines td.pri{width:86px;text-align:right;font-family:ui-monospace,monospace}
.lines th.tot,.lines td.tot{width:110px;text-align:right;font-weight:900;background:#fbfbfa;color:var(--steel);font-family:ui-monospace,monospace}
.lines th.x,.lines td.x{width:34px;text-align:center;background:#fbfbfa;color:#c53333;font-weight:900;cursor:pointer}
.lines td.code,.lines td.ref{font-family:ui-monospace,monospace}
.picker{display:flex;gap:8px;margin-top:9px;align-items:center}
.picker input{flex:1}
.tag{background:var(--blue);color:#fff;border:1px solid var(--blue);padding:7px 14px;border-radius:3px;font-size:12px;font-weight:900;cursor:pointer;white-space:nowrap}
.hint{font-size:11px;color:var(--muted);margin-top:8px;line-height:1.55}
.hint kbd{background:#f4f5f6;border:1px solid #d6d9dd;border-radius:3px;padding:1px 5px;font-size:10px;font-family:ui-monospace,monospace;color:#3d4652}

/* ============ sidebar derecho ============ */
.side-card{background:#fff;border:1px solid var(--line);padding:11px;margin-bottom:12px;border-radius:3px}
.side-title{margin:0 0 9px;font-size:11px;text-transform:uppercase;letter-spacing:.09em;color:var(--steel);font-family:ui-monospace,monospace;font-weight:900}
.status-badge{display:inline-flex;align-items:center;gap:6px;background:#eef2f8;color:var(--steel);border:1px solid #ccd5e2;padding:5px 9px;border-radius:16px;font-size:11px;font-weight:900}
.status-badge.warn{background:#fff3cd;color:var(--warn);border-color:#ecd06a}
.status-badge.ok{background:#dcfce7;color:#166534;border-color:#bbf7d0}
.breakdown{border:1px solid #e1e4e8;border-radius:3px;overflow:hidden}
.breakdown .row{display:flex;justify-content:space-between;gap:8px;padding:7px 9px;border-bottom:1px solid #edf0f2;font-size:12px}
.breakdown .row:last-child{border-bottom:0}
.breakdown .row strong{font-family:ui-monospace,monospace}
.totalbox{margin-top:8px;background:var(--steel);color:#fff;padding:10px 12px;border-radius:3px;display:flex;align-items:flex-end;justify-content:space-between;gap:8px}
.totalbox small{color:var(--gold);font-size:10px;font-weight:900;letter-spacing:.12em}
.totalbox strong{font-size:20px;font-family:ui-monospace,monospace}
.alert{display:flex;gap:7px;align-items:flex-start;font-size:11px;line-height:1.4;padding:8px 10px;border-radius:3px;margin-bottom:6px}
.alert.ok{background:#ecf7ed;color:var(--green);border:1px solid #c2e6c8}
.alert.warn{background:#fff3cd;color:var(--warn);border:1px solid #f0d97a}
.alert.info{background:#eef2f8;color:#32445c;border:1px solid #c8d3e6}
.alert b{display:block;font-size:12px;margin-bottom:2px}

.stat-row{display:flex;justify-content:space-between;gap:8px;padding:6px 0;font-size:12px;border-bottom:1px solid #eceef1}
.stat-row:last-child{border-bottom:0}
.stat-row.ok{color:var(--green)}
.stat-row.warn{color:var(--warn)}
.stat-row.muted{color:#9aa0a8}
.stat-row strong{font-family:ui-monospace,monospace}

.quick-actions{display:flex;flex-direction:column;gap:5px}
.quick-actions .btn{justify-content:flex-start;width:100%}

/* ============ artículo: head ============ */
.head-art{display:flex;align-items:center;justify-content:space-between;gap:16px;background:#fff;border:1px solid var(--line);border-radius:3px;padding:14px;margin-bottom:12px}
.head-art h1{margin:0;font-size:25px;font-family:ui-monospace,monospace;color:var(--steel);letter-spacing:.02em}
.head-art p{margin:4px 0 0;color:var(--muted);font-size:12px}
.price-box{background:linear-gradient(180deg,#d9bd6a,#c9a44c);color:var(--steel);min-width:160px;padding:10px 13px;border-radius:3px;text-align:right;box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
.price-box small{display:block;font-size:9px;letter-spacing:.14em;font-weight:900}
.price-box strong{font-family:ui-monospace,monospace;font-size:24px}
.tabs{display:flex;align-items:center;gap:4px;margin-bottom:12px;border-bottom:1px solid #d6d9dd;padding-bottom:0}
.tabs .tab{border:0;background:transparent;color:#5b6472;padding:10px 4px;cursor:pointer;font-weight:900;font-size:12px;text-transform:uppercase;letter-spacing:.06em;font-family:ui-monospace,monospace;margin-right:18px;border-bottom:3px solid transparent;margin-bottom:-1px}
.tabs .tab.on{color:var(--steel);border-bottom-color:var(--gold)}
.tabs .acts{margin-left:auto;display:flex;gap:6px;padding-bottom:6px}

.art-body{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:12px;align-items:start}
.art-pane{display:none}
.art-pane.on{display:block}
.big-price{font-weight:900;color:#fff;background:var(--steel);font-size:16px;text-align:right;border-color:var(--steel);font-family:ui-monospace,monospace}
.big-price-label{display:flex;justify-content:space-between;align-items:baseline}
.big-price-label small{color:#9aa0a8;font-weight:800;font-family:Arial,sans-serif;text-transform:lowercase}

/* ============ adjuntos ============ */
.dropzone{border:2px dashed #c6c9cf;border-radius:4px;padding:18px;text-align:center;color:var(--muted);font-size:12px;background:#fbfbfa;cursor:pointer;display:block}
.dropzone:hover{border-color:var(--blue);color:var(--blue);background:#f0f3fa}
.chips{display:flex;gap:5px;flex-wrap:wrap;margin:14px 0 12px}
.chip{padding:5px 12px;border-radius:14px;background:#f4f5f6;color:#4b5563;font-size:11px;font-weight:900;cursor:pointer;border:1px solid transparent;user-select:none;display:inline-flex;align-items:center;gap:6px}
.chip.on{background:var(--steel);color:#fff}
.chip .cnt{background:rgba(0,0,0,.07);padding:1px 7px;border-radius:8px;font-size:10px}
.chip.on .cnt{background:rgba(255,255,255,.2)}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:9px}
.file{background:#fff;border:1px solid var(--line);border-radius:3px;padding:7px;transition:all .15s;position:relative}
.file:hover{border-color:var(--blue)}
.file.primary{border-color:var(--gold);box-shadow:0 0 0 2px rgba(201,164,76,.2)}
.file .thumb{aspect-ratio:1;background:#f4f5f6;border-radius:2px;display:flex;align-items:center;justify-content:center;color:#9aa0a8;font-size:30px;margin-bottom:6px}
.file.planos .thumb{background:#fdecea;color:var(--red)}
.file.cad .thumb{background:#e8f0ff;color:var(--blue)}
.file.fotos .thumb{background:#ecf7ed;color:var(--green)}
.file .name{font-size:11px;font-family:ui-monospace,monospace;color:var(--steel);word-break:break-all;line-height:1.2}
.file .meta{font-size:10px;color:#9aa0a8;margin-top:3px;font-family:ui-monospace,monospace}
.file .badge-primary{display:inline-block;background:var(--gold);color:var(--steel);font-size:9px;padding:1px 6px;border-radius:2px;font-weight:900;margin-top:4px;letter-spacing:.06em}

/* ============ histórico ============ */
.filter-row{display:flex;gap:6px;margin-bottom:10px;flex-wrap:wrap}
.filter-row select,.filter-row input{flex:1;min-width:140px}
.history{width:100%;border-collapse:collapse;font-size:12px}
.history th{font-size:10px;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:var(--muted);padding:7px 8px;text-align:left;border-bottom:1px solid #e2e5e9;background:#f4f5f6;font-family:ui-monospace,monospace}
.history td{padding:8px;border-bottom:1px solid #eef0f2}
.history tr:hover td{background:#fbfbfa}
.history td.code,.history td.doc{font-family:ui-monospace,monospace}
.history th.price,.history td.price{text-align:right;font-family:ui-monospace,monospace;font-weight:900;color:var(--steel)}

/* ============ vista principal artículo ============ */
.preview{min-height:140px;background:#f4f5f6;border:1px solid #e0e3e7;border-radius:3px;display:flex;align-items:center;justify-content:center;color:#9aa0a8;font-size:11px;flex-direction:column;gap:5px;text-align:center;padding:14px;background-image:repeating-linear-gradient(45deg,#eef0f2 0 8px,#f8f9fa 8px 16px)}
.preview .ico{font-size:36px;color:var(--red)}
.preview .file-name{font-family:ui-monospace,monospace;color:var(--steel);font-size:11px}

/* ============ lista (pages para listados) ============ */
.list-head{display:flex;justify-content:space-between;align-items:flex-end;background:#fff;border:1px solid var(--line);border-radius:3px;padding:14px 16px;margin-bottom:12px;gap:14px;flex-wrap:wrap}
.list-head h1{font-family:ui-monospace,monospace;font-size:18px;letter-spacing:-.01em;color:var(--steel);margin:0}
.list-head .eyebrow{font-family:ui-monospace,monospace;font-size:10px;letter-spacing:.14em;color:var(--muted);text-transform:uppercase;margin:0 0 4px;display:block}
.list-head p{margin:2px 0 0;color:#58616e;font-size:12px}
.list-head .acts{display:flex;gap:6px;flex-wrap:wrap}

/* filtros una línea */
.filter-bar{background:#fff;border:1px solid var(--line);border-radius:3px;padding:8px 10px;margin-bottom:8px;display:flex;gap:6px;align-items:center;flex-wrap:nowrap;overflow-x:auto}
.filter-bar input,.filter-bar select{height:32px;min-width:140px;min-height:32px;padding:6px 8px}
.filter-bar input.q{min-width:240px;flex:1}
.filter-bar .sep{width:1px;background:#e2e5e9;align-self:stretch;margin:2px 4px}
.filter-bar .btn{height:32px;min-height:32px}
.filter-bar .small-btn{background:#fff;border:1px solid #c8ccd2;color:var(--steel);padding:5px 10px;border-radius:3px;font-size:11px;font-weight:900;cursor:pointer;height:32px}
.filter-bar .small-btn.on{background:var(--steel);color:#fff;border-color:var(--steel)}
.subtabs{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:10px}
.subtabs a{padding:6px 11px;background:#fff;border:1px solid var(--line);border-radius:3px;color:var(--steel);font-size:11px;font-weight:900;cursor:pointer;font-family:ui-monospace,monospace;text-transform:uppercase;letter-spacing:.04em}
.subtabs a.on{background:var(--steel);color:#fff;border-color:var(--steel)}
.subtabs .count{display:inline-block;margin-left:6px;background:rgba(0,0,0,.08);padding:1px 6px;border-radius:8px;font-size:10px}
.subtabs a.on .count{background:rgba(255,255,255,.2)}

/* tabla densa de listados */
.dense{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:3px;overflow:hidden;font-size:12px}
.dense th{background:#f4f5f6;color:#4b5563;font-family:ui-monospace,monospace;font-size:10px;text-transform:uppercase;letter-spacing:.07em;font-weight:900;padding:8px 10px;text-align:left;border-bottom:1px solid #e2e5e9;white-space:nowrap}
.dense th.r{text-align:right}
.dense td{padding:9px 10px;border-bottom:1px solid #eef0f2;vertical-align:middle}
.dense td.r{text-align:right}
.dense tr{cursor:pointer}
.dense tr:hover td{background:#fbfbfa}
.dense tr.fav td:first-child::before{content:'★';color:var(--gold);margin-right:4px}
.dense td.code{font-family:ui-monospace,monospace;color:var(--steel);font-weight:900}
.dense td.price{font-family:ui-monospace,monospace;font-weight:900;color:var(--steel);text-align:right}
.dense td.muted{color:var(--muted)}
.dense td.client strong{display:block;font-size:12px}
.dense td.client small{color:var(--muted);font-size:11px}
.badge{display:inline-block;padding:3px 7px;border-radius:3px;background:#e5e7eb;font-size:11px;font-weight:900;color:#334155;font-family:ui-monospace,monospace;letter-spacing:.04em;text-transform:uppercase}
.badge.bdraft{background:#eef2f8;color:#1d4ed8}
.badge.bsent{background:#dcfce7;color:#166534}
.badge.bpend{background:#dbeafe;color:#1d4ed8}
.badge.btrans{background:#dcfce7;color:#166534}
.badge.berror{background:#fee2e2;color:#991b1b}
.badge.bcancel{background:#f1f5f9;color:#64748b}
.badge.bfalta{background:#fff0df;color:#c2410c}
.badge.brec{background:#dcfce7;color:#166534}
.badge.bborr{background:#f1f5f9;color:#64748b}
.dense .totalrow td{background:#1d2634;color:#fff;font-family:ui-monospace,monospace;font-weight:900;text-align:right;padding:10px}
.dense .totalrow td:first-child{text-align:left;color:var(--gold);text-transform:uppercase;letter-spacing:.1em;font-size:11px}

/* tabla densa más estrecha (artículos) */
.dense.items td.code{font-size:13px}

/* últimos precios — buscador hero */
.hero-search{background:#fff;border:1px solid var(--line);border-radius:3px;padding:12px;margin-bottom:8px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.hero-search .label{font-family:ui-monospace,monospace;font-size:10px;letter-spacing:.1em;color:var(--muted);text-transform:uppercase;font-weight:900}
.hero-search input{height:42px;min-height:42px;font-size:15px;flex:1;min-width:280px;border:2px solid var(--steel);font-weight:700;font-family:ui-monospace,monospace}
.hero-search input::placeholder{color:#9aa0a8;font-weight:400}

/* nuevo albarán: lista OT abiertas */
.ot-list{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.ot-row{background:#fff;border:1px solid var(--line);border-radius:3px;padding:10px 12px;display:grid;grid-template-columns:auto 110px 1fr 100px 100px 90px;gap:10px;align-items:center;font-size:12px}
.ot-row.warn{border-color:#f0d97a;background:#fffaeb}
.ot-row input[type=checkbox]{width:auto;min-height:auto;height:auto;margin:0}
.ot-row .code{font-family:ui-monospace,monospace;font-weight:900;color:var(--steel)}
.ot-row .desc{color:#3d4550}
.ot-row .qty{font-family:ui-monospace,monospace;text-align:right;color:var(--muted)}
.ot-row .price{font-family:ui-monospace,monospace;text-align:right;font-weight:900;color:var(--steel)}
.ot-row .price.zero{color:var(--red)}
.ot-row .badge{justify-self:end}

/* dashboard chico */
.dash-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-bottom:14px}
.tile{background:#fff;border:1px solid var(--line);border-radius:3px;padding:14px;cursor:pointer;display:flex;flex-direction:column;gap:6px;min-height:90px}
.tile:hover{background:#fbfbfa}
.tile strong{font-size:24px;font-family:ui-monospace,monospace;color:var(--steel)}
.tile small{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-weight:900;font-family:ui-monospace,monospace}
.tile.tile-delivery-pending .tile-subvalue{display:flex;flex-direction:column;gap:2px;margin-top:2px;padding-top:6px;border-top:1px solid #eceef1;color:#5b6472;font-size:11px;font-weight:900;font-family:ui-monospace,monospace;text-transform:uppercase;letter-spacing:.04em;line-height:1.25}
.tile.tile-delivery-pending .tile-subvalue em{font-style:normal;color:var(--muted)}
.tile.tile-delivery-pending .tile-subvalue b{color:var(--steel);font-size:14px;white-space:nowrap}
.tile.primary{box-shadow:inset 0 4px 0 var(--blue)}
.tile.gold{box-shadow:inset 0 4px 0 var(--gold)}
.tile.warn{box-shadow:inset 0 4px 0 #f59e0b}
.tile.steel{box-shadow:inset 0 4px 0 var(--steel)}

/* responsive */
@media (max-width:1100px){
  .layout,.art-body{grid-template-columns:1fr}
  .grid.c1,.grid.c2,.grid.cped,.grid.c-art2,.grid.c-art3{grid-template-columns:1fr}
  .toolbar .docnum{width:100%;margin-left:0}
}
@media (max-width:760px){
  .shell{grid-template-columns:1fr}
  .side{position:static;height:auto}
  .topbar{grid-template-columns:1fr;gap:8px;height:auto;padding:8px 10px}
  .topbar .search,.topbar .user{display:none}
}

/* utilidades */
.hidden{display:none !important}
.muted{color:var(--muted)}
.right{text-align:right}
.row{display:flex;gap:6px;align-items:center}
.divider{height:1px;background:#e2e5e9;margin:8px 0}
.note-link{color:var(--blue);font-weight:900;font-size:12px;text-decoration:underline}
.fav{color:var(--gold)}

/* selector de pantalla mockup (debug bar superior fixed) */
.mockbar{position:fixed;bottom:12px;right:12px;background:var(--steel);color:#fff;padding:9px 12px;border-radius:3px;display:flex;gap:8px;align-items:center;font-size:11px;z-index:100;box-shadow:0 8px 24px rgba(0,0,0,.3)}
.mockbar select{background:#15202e;color:#fff;border:1px solid #46546a;height:auto;min-height:auto;padding:5px 8px;font-size:11px}

/* ============================================================================
 * v0.6.1 — adicional al CSS del mockup
 * ============================================================================ */
.quick-cli { padding:6px 12px; border-radius:3px; font:900 11px/1.2 system-ui; cursor:pointer; text-decoration:none; color:#fff; min-height:32px; display:inline-flex; align-items:center; gap:5px; box-shadow:inset 0 1px 0 rgba(255,255,255,.15); border:1px solid transparent; }
.quick-cli:hover { filter:brightness(.92); text-decoration:none; }
.quick-cli::before { content:"\2605"; opacity:.8; font:11px/1 system-ui; }
.toolbar .doc-state { margin-left:auto; display:flex; align-items:center; gap:10px; padding-left:14px; border-left:1px solid #cfd2d6; flex-wrap:wrap; }
.toolbar .doc-state .docnum { color:#1d2634; font-family:ui-monospace,monospace; font-size:12px; font-weight:900; letter-spacing:.04em; }
.toolbar .doc-state .state-badge { display:inline-flex; align-items:center; gap:5px; padding:5px 9px; border-radius:14px; font:900 11px/1 ui-monospace,monospace; text-transform:uppercase; letter-spacing:.05em; }
.toolbar .doc-state .state-badge.draft { background:#eef2f8; color:#1d2634; border:1px solid #ccd5e2; }
.toolbar .doc-state .state-badge.pend { background:#fff3cd; color:#8a6d10; border:1px solid #ecd06a; }
.toolbar .doc-state .state-badge.ok { background:#dcfce7; color:#166534; border:1px solid #bbf7d0; }
.toolbar .doc-state .state-badge.err { background:#fee2e2; color:#991b1b; border:1px solid #fecaca; }
.toolbar .doc-state .state-badge .dot { width:7px; height:7px; border-radius:50%; }
.toolbar .doc-state .state-badge.draft .dot { background:#1d2634; }
.toolbar .doc-state .state-badge.pend .dot { background:#8a6d10; }
.toolbar .doc-state .state-badge.ok .dot { background:#166534; }
.toolbar .doc-state .state-badge.err .dot { background:#991b1b; }
.pager { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px; background:#f8f8f7; border:1px solid var(--line2); border-top:0; border-radius:0 0 3px 3px; font-size:12px; color:#3e4650; flex-wrap:wrap; }
.pager strong { font-family:ui-monospace,monospace; color:#1d2634; }
.pager .pgs { display:flex; gap:4px; align-items:center; }
.pager .pgs a { padding:5px 10px; border:1px solid var(--line); background:#fff; border-radius:3px; font:900 11px ui-monospace,monospace; color:#1d2634; cursor:pointer; min-height:28px; display:inline-flex; align-items:center; text-decoration:none; }
.pager .pgs a.on { background:#1d2634; color:#fff; border-color:#1d2634; }
.pager .pgs a.disabled { opacity:.4; pointer-events:none; }
.pager select { padding:4px 7px; min-height:28px; height:28px; font-size:11px; }
.bulk-action { background:#fff; border:1px solid var(--line); border-radius:3px; padding:10px 14px; margin-top:10px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.bulk-action .btns { margin-left:auto; display:flex; gap:6px; flex-wrap:wrap; }
.subtabs a.muted { color:#9aa0a8; }
.subtabs a.muted:hover { color:#1d2634; }
.dense tbody tr { cursor:pointer; }
.dense tbody tr:hover { background:#fbfbfa; }
.dense td.muted { color:#9aa0a8; }
.dense td.client small { color:#6f7480; font-family:ui-monospace,monospace; font-size:10px; display:block; }
.badge.berror { background:#fee2e2; color:#991b1b; }
.ot-rows { display:flex; flex-direction:column; gap:6px; margin-top:10px; }
.ot-row { background:#fff; border:1px solid var(--line); border-radius:3px; padding:10px 12px; display:grid; grid-template-columns: auto 110px 1fr 110px 100px 110px; gap:10px; align-items:center; font-size:12px; cursor:pointer; }
.ot-row:hover { background:#fbfbfa; }
.ot-row.warn { border-color:#f0d97a; background:#fffaeb; }
.ot-row.selected { border-color:#1b7e34; background:#ecf7ed; }
.ot-row input[type=checkbox] { width:auto; min-height:auto; height:auto; margin:0; }
.ot-row .code { font-family:ui-monospace,monospace; font-weight:900; color:#1d2634; }
.ot-row .desc { color:#3d4550; }
.ot-row .qty { font-family:ui-monospace,monospace; text-align:right; color:#6f7480; }
.ot-row .price { font-family:ui-monospace,monospace; text-align:right; font-weight:900; color:#1d2634; }
.ot-row .price.zero { color:#c53333; }
.ot-row .badge { justify-self:end; }
.lines td input.ci { border:0; border-radius:0; min-height:30px; padding:5px 7px; font-size:12px; background:transparent; width:100%; box-sizing:border-box; }
.lines td input.ci:focus { outline:2px solid rgba(32,117,242,.25); background:#fff; }
.lines td.tot { padding:6px 7px; text-align:right; font-weight:900; background:#fbfbfa; color:#1d2634; font-family:ui-monospace,monospace; }
.lines td.x { text-align:center; background:#fbfbfa; cursor:pointer; }
.lines td.x .ib { border:0; background:transparent; color:#c53333; font-weight:900; cursor:pointer; font-size:16px; line-height:1; }
.head-art { display:flex; align-items:center; justify-content:space-between; gap:16px; background:#fff; border:1px solid var(--line); border-radius:3px; padding:14px; margin-bottom:12px; }
.head-art h1 { margin:0; font-size:22px; font-family:ui-monospace,monospace; color:var(--steel); letter-spacing:.02em; }
.head-art p { margin:4px 0 0; color:var(--muted); font-size:12px; }
.price-box { background:linear-gradient(180deg,#d9bd6a,#c9a44c); color:var(--steel); min-width:160px; padding:10px 13px; border-radius:3px; text-align:right; box-shadow:inset 0 1px 0 rgba(255,255,255,.35); }
.price-box small { display:block; font-size:9px; letter-spacing:.14em; font-weight:900; }
.price-box strong { font-family:ui-monospace,monospace; font-size:24px; }
.tabs { display:flex; align-items:center; gap:0; margin-bottom:12px; border-bottom:1px solid #d6d9dd; padding-bottom:0; flex-wrap:wrap; }
.tabs .tab { border:0; background:transparent; color:#5b6472; padding:10px 4px; cursor:pointer; font:900 12px/1.2 ui-monospace,monospace; text-transform:uppercase; letter-spacing:.06em; margin-right:18px; border-bottom:3px solid transparent; margin-bottom:-1px; text-decoration:none; }
.tabs .tab.on { color:var(--steel); border-bottom-color:var(--gold); }
.tabs .acts { margin-left:auto; display:flex; gap:6px; padding-bottom:6px; flex-wrap:wrap; }
.art-pane { display:none; }
.art-pane.on { display:block; }
.big-price { font-weight:900; color:#fff; background:var(--steel); font-size:16px; text-align:right; border-color:var(--steel); font-family:ui-monospace,monospace; }
.dropzone { border:2px dashed #c6c9cf; border-radius:4px; padding:18px; text-align:center; color:var(--muted); font-size:12px; background:#fbfbfa; cursor:pointer; display:block; }
.dropzone:hover { border-color:var(--blue); color:var(--blue); background:#f0f3fa; }
.dropzone strong { color:var(--blue); }
.chips { display:flex; gap:5px; flex-wrap:wrap; margin:14px 0 12px; }
.chip { padding:5px 12px; border-radius:14px; background:#f4f5f6; color:#4b5563; font:900 11px system-ui; cursor:pointer; border:1px solid transparent; user-select:none; display:inline-flex; align-items:center; gap:6px; }
.chip.on { background:var(--steel); color:#fff; }
.chip .cnt { background:rgba(0,0,0,.07); padding:1px 7px; border-radius:8px; font-size:10px; }
.chip.on .cnt { background:rgba(255,255,255,.2); }
.gallery { display:grid; grid-template-columns:repeat(auto-fill, minmax(120px, 1fr)); gap:9px; }
.file { background:#fff; border:1px solid var(--line); border-radius:3px; padding:7px; transition:all .15s; position:relative; text-decoration:none; color:inherit; display:block; }
.file:hover { border-color:var(--blue); }
.file.primary { border-color:var(--gold); box-shadow:0 0 0 2px rgba(201,164,76,.2); }
.file .thumb { aspect-ratio:1; background:#f4f5f6; border-radius:2px; display:flex; align-items:center; justify-content:center; color:#9aa0a8; font-size:30px; margin-bottom:6px; }
.file.planos .thumb { background:#fdecea; color:var(--red); }
.file.cad .thumb { background:#e8f0ff; color:var(--blue); }
.file.fotos .thumb { background:#ecf7ed; color:var(--green); }
.file .name { font-size:11px; font-family:ui-monospace,monospace; color:var(--steel); word-break:break-all; line-height:1.2; }
.file .meta { font-size:10px; color:#9aa0a8; margin-top:3px; font-family:ui-monospace,monospace; }
.file .badge-primary { background:var(--gold); color:var(--steel); font-size:9px; padding:1px 6px; border-radius:2px; font-weight:900; margin-top:4px; display:inline-block; letter-spacing:.06em; }
.preview { min-height:140px; background:#f4f5f6; border:1px solid #e0e3e7; border-radius:3px; display:flex; align-items:center; justify-content:center; color:#9aa0a8; font-size:11px; flex-direction:column; gap:5px; text-align:center; padding:14px; background-image: repeating-linear-gradient(45deg,#eef0f2 0 8px,#f8f9fa 8px 16px); }
.preview .ico { font-size:36px; color:var(--red); }
.preview span { font-family:ui-monospace,monospace; color:var(--steel); font-size:11px; }
.history { width:100%; border-collapse:collapse; font-size:12px; }
.history th { font:900 10px/1.2 ui-monospace,monospace; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); padding:7px 8px; text-align:left; border-bottom:1px solid #e2e5e9; background:#f4f5f6; }
.history td { padding:8px; border-bottom:1px solid #eef0f2; }
.history tr:hover td { background:#fbfbfa; }
.history .price { font-family:ui-monospace,monospace; font-weight:900; color:var(--steel); text-align:right; }
.history .source-tag { display:inline-block; padding:2px 7px; border-radius:3px; font:900 10px/1 ui-monospace,monospace; text-transform:uppercase; letter-spacing:.04em; }
.history .source-tag.ot { background:#fff3cd; color:#8a6d10; }
.history .source-tag.alb { background:#dcfce7; color:#166534; }
.history .source-tag.pre { background:#eef2f8; color:#1d4ed8; }
.history .source-tag.pc { background:#f3e8ff; color:#6d28d9; }
.filter-row { display:flex; gap:6px; margin-bottom:10px; flex-wrap:wrap; }
.filter-row select, .filter-row input { flex:1; min-width:140px; }
.dense-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
.topbar .ttl strong.code { font-family:ui-monospace,monospace; font-weight:900; }

@media (max-width: 900px) {
  .shell { display:block; }
  .side { position:relative; height:auto; max-height:none; }
  .side nav { display:grid; grid-template-columns:repeat(3,1fr); gap:4px; padding:8px; }
  .side nav a { font-size:11px; padding:8px 6px; }
  .side nav .grp { grid-column:1/-1; padding:6px 4px 2px; }
  .topbar { height:auto; grid-template-columns:1fr; padding:10px; gap:8px; }
  .topbar .search, .topbar .user { display:none; }
  main { padding:10px; }
  .layout { grid-template-columns:1fr; }
  .grid.c1, .grid.c2, .grid.cped, .grid.c-art2, .grid.c-art3 { grid-template-columns:1fr 1fr; }
  .head-art { flex-direction:column; align-items:stretch; }
  .price-box { text-align:left; }
  .toolbar { flex-wrap:wrap; }
  .toolbar .doc-state { width:100%; margin-left:0; padding-left:0; border-left:0; border-top:1px solid #cfd2d6; padding-top:8px; }
  .list-head { flex-direction:column; align-items:stretch; }
  .list-head .acts { flex-wrap:wrap; }
  .filter-bar { flex-wrap:wrap; gap:6px; }
  .filter-bar input.q { flex:1 1 100%; min-width:0; }
  .filter-bar input, .filter-bar select { min-width:0; flex:1 1 130px; }
  .subtabs { overflow-x:auto; flex-wrap:nowrap; -webkit-overflow-scrolling:touch; }
  .subtabs a { white-space:nowrap; flex-shrink:0; }
  .dense { min-width:780px; }
  .pager { flex-direction:column; align-items:stretch; gap:8px; }
  .pager .pgs { justify-content:center; }
  .bulk-action { flex-direction:column; align-items:stretch; }
  .bulk-action .btns { margin-left:0; }
  .tabs { flex-wrap:wrap; gap:4px; }
  .tabs .tab { white-space:nowrap; }
  .tabs .acts { width:100%; margin-left:0; padding-top:6px; padding-bottom:0; }
  .ot-row { grid-template-columns:auto 1fr; row-gap:4px; }
  .ot-row > .desc, .ot-row > .qty, .ot-row > .price, .ot-row > .badge { grid-column:2; text-align:left; }
}
@media (max-width: 720px) {
  .lines, .lines thead, .lines tbody, .lines tr, .lines td { display:block; }
  .lines thead { display:none; }
  .lines tr { border:1px solid var(--line); border-radius:3px; background:#fff; margin-bottom:8px; padding:8px 10px; position:relative; }
  .lines tr.ar { background:#f7f9fd; padding:11px; text-align:center; color:var(--blue); font-weight:900; cursor:pointer; }
  .lines td { border:0; padding:4px 0; display:flex; align-items:center; gap:10px; }
  .lines td::before { content: attr(data-label); flex:0 0 80px; font:900 10px/1 ui-monospace,monospace; text-transform:uppercase; letter-spacing:.06em; color:#6f7480; }
  .lines td.num { position:absolute; top:6px; right:8px; padding:2px 7px; background:#f4f5f6; color:#6f7480; font:900 10px/1 ui-monospace,monospace; border-radius:10px; }
  .lines td.num::before { display:none; }
  .lines td.tot { background:#fbfbfa; margin:6px -10px -8px; padding:8px 10px; border-top:1px solid #e2e5e9; }
  .lines td.x { background:transparent; padding:0; position:absolute; bottom:6px; right:8px; }
  .lines td.x::before { display:none; }
  .lines td input.ci { padding:5px 7px; border:1px solid #c8ccd2; background:#fff; max-width:140px; flex:1; }
}

/* ============================================================================
 * v0.6.1 — fixes responsive iPhone/Android (tabs, inputs, botones)
 * ============================================================================ */

/* Tabs en móvil: las 3 pestañas siempre visibles en línea, .acts en fila aparte */
@media (max-width: 720px) {
  .tabs { 
    flex-direction: row; 
    flex-wrap: nowrap; 
    overflow-x: auto; 
    -webkit-overflow-scrolling: touch;
    align-items: stretch;
    gap: 0;
    padding-bottom: 0;
    margin-bottom: 8px;
  }
  .tabs .tab {
    margin-right: 0;
    padding: 10px 14px;
    flex-shrink: 0;
    white-space: nowrap;
    border-bottom-width: 3px;
  }
  .tabs .acts {
    display: none; /* ocultamos las acciones contextuales en móvil dentro de tabs · ya están en toolbar */
  }
  /* Si quieres mostrarlas en móvil de todas formas, usa .show-acts-mobile (clase opcional) */
  .tabs.show-acts-mobile .acts { 
    display: flex;
    width: 100%;
    margin: 8px 0 0 0;
    padding: 0;
    flex-direction: column;
    gap: 6px;
  }
  .tabs.show-acts-mobile .acts .btn { width: 100%; text-align: center; }
}

/* Inputs / selects / dates con tamaño consistente en iOS y proporcionados (mínimo 44px alto - touch target) */
@media (max-width: 720px) {
  input[type="text"], input[type="email"], input[type="password"], input[type="search"],
  input[type="tel"], input[type="url"], input[type="number"], input[type="date"],
  input[type="datetime-local"], input[type="time"], select, textarea {
    font-size: 16px !important;  /* iOS evita auto-zoom en focus si fuente >= 16px */
    min-height: 44px;
    padding: 10px 12px;
    box-sizing: border-box;
    -webkit-appearance: none;
    appearance: none;
    border-radius: 4px;
  }
  /* Selects nativos: añadir flecha custom (sin -webkit-appearance pierden la del sistema) */
  select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%231d2634' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 32px;
  }
  /* Inputs dentro de filtros y filas editables: más pequeños */
  .filter-bar input, .filter-bar select, .filter-bar input[type="date"] {
    min-height: 40px;
    font-size: 14px !important;
    padding: 8px 10px;
  }
  .filter-bar select {
    background-position: right 10px center;
    padding-right: 28px;
  }
  /* Inputs editables inline en tabla líneas (override) */
  .lines td input.ci { 
    min-height: 36px; 
    font-size: 14px !important; 
    padding: 6px 8px; 
  }
  /* Inputs en filas de OT abiertas */
  .ot-row input[type=checkbox] {
    min-height: auto;
    width: 22px;
    height: 22px;
  }
}

/* Botones con tamaño touch consistente y proporcionados en móvil */
@media (max-width: 720px) {
  .btn { 
    min-height: 44px;
    padding: 10px 16px;
    font-size: 13px;
    box-sizing: border-box;
  }
  /* Toolbar de creación: botones del mismo tamaño y un click area generoso */
  .toolbar .btn { padding: 10px 14px; }
  .toolbar { gap: 6px; }
  /* Botones de atajo cliente · suficientemente táctiles */
  .quick-cli {
    min-height: 38px;
    padding: 8px 14px;
    font-size: 12px;
  }
  /* Buttons en la cabecera de listado se apilan limpios */
  .list-head .acts { flex-direction: column; align-items: stretch; gap: 6px; }
  .list-head .acts .btn, .list-head .acts .quick-cli { 
    width: 100%; 
    justify-content: center; 
    text-align: center; 
  }
  /* Botones en sidebar derecha */
  .quick-actions .btn { width: 100%; min-height: 44px; }
}

/* Cards y secciones con padding interior cómodo en móvil */
@media (max-width: 720px) {
  .card { padding: 12px; margin-bottom: 10px; }
  .side-card { padding: 12px; }
  .head-art { padding: 12px; gap: 12px; }
  .head-art h1 { font-size: 18px; }
  .price-box { padding: 8px 10px; min-width: auto; }
  .price-box strong { font-size: 20px; }
  /* Toolbar en móvil: scrollable horizontal si tiene muchos botones */
  .toolbar { 
    flex-wrap: wrap; 
    padding: 8px;
  }
  .toolbar .doc-state { 
    width: 100%; 
    margin-left: 0; 
    padding-left: 0; 
    border-left: 0; 
    border-top: 1px solid #cfd2d6; 
    padding-top: 8px; 
    margin-top: 6px;
    justify-content: space-between;
  }
}

/* Filtro bar en móvil: filas claras y el buscador grande */
@media (max-width: 720px) {
  .filter-bar { padding: 8px; }
  .filter-bar input.q { 
    flex: 1 1 100%;
    min-height: 44px;
    font-size: 16px !important;  /* evita zoom iOS */
  }
  .filter-bar > * { flex: 1 1 calc(50% - 4px); }
  .filter-bar .btn { flex: 0 0 auto; min-width: 90px; }
  .filter-bar .sep { display: none; }
}

/* Subtabs (Pendientes albarán / Pendientes traspaso / etc): scroll horizontal claro */
@media (max-width: 720px) {
  .subtabs { 
    padding: 0;
    margin: 0 -10px 12px;
    padding-left: 10px;
  }
  .subtabs a {
    padding: 10px 12px;
    font-size: 12px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
  }
  .subtabs a .count {
    font-size: 11px;
  }
}

/* Inputs dentro del autocomplete (suggestions overlay) tipo touch */
.autocomplete-list, .autocomplete-suggestions {
  font-size: 16px;
}
@media (max-width: 720px) {
  .autocomplete-item, .autocomplete-suggestion { 
    padding: 12px 14px;
    min-height: 44px;
  }
}


/* ==================== v0.6.2 COMERCIAL ==================== */
/* paso 7-9: presupuestos, pedidos de compra, últimos precios */

/* --- columna Plano en líneas de PC: pill toggle Sí/No --- */
.lines th.plano,.lines td.plano{width:70px;text-align:center;background:#fafbfc;padding:6px 4px}
.plano-toggle{display:inline-block;cursor:pointer;user-select:none;position:relative}
.plano-toggle input{position:absolute;opacity:0;pointer-events:none;width:0;height:0}
.pt-pill{display:inline-flex;align-items:center;justify-content:center;gap:4px;padding:5px 10px;border-radius:12px;font:900 11px/1 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;letter-spacing:.04em;border:1px solid #dcdfe3;background:#f4f5f6;color:#6f7480;min-height:24px;transition:background .12s,color .12s,border-color .12s}
.plano-toggle:hover .pt-pill{filter:brightness(.97)}
.pt-icon{font-size:11px;opacity:.7}
.pt-on,.pt-off{display:none}
.plano-toggle input:checked ~ .pt-pill{background:#dcfce7;color:#166534;border-color:#86efac}
.plano-toggle input:checked ~ .pt-pill .pt-icon{opacity:1}
.plano-toggle input:checked ~ .pt-pill .pt-on{display:inline}
.plano-toggle input:not(:checked) ~ .pt-pill .pt-off{display:inline}
.plano-none{color:#c0c4ca;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:13px;font-weight:900}

/* --- chips de tipo de documento (Últimos Precios) --- */
.doc-types{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px;align-items:center}
.doc-types .lbl{font:900 10px/1 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);padding-right:4px}
.doc-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:14px;font:900 11px/1 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;text-transform:uppercase;letter-spacing:.05em;cursor:pointer;border:1px solid transparent;user-select:none;min-height:30px;text-decoration:none}
.doc-chip .dot{width:8px;height:8px;border-radius:50%;background:currentColor;opacity:.5}
.doc-chip.on .dot{opacity:1}
.doc-chip.off{background:#f4f5f6;color:#9aa0a8;border-color:#dcdfe3}
.doc-chip.ot{background:#fff3cd;color:#8a6d10;border-color:#ecd06a}
.doc-chip.alb{background:#dcfce7;color:#166534;border-color:#bbf7d0}
.doc-chip.pre{background:#eef2f8;color:#1d4ed8;border-color:#ccd5e2}
.doc-chip.pc{background:#f3e8ff;color:#6d28d9;border-color:#d9c5f7}
.doc-chip .cnt{background:rgba(0,0,0,.08);padding:1px 7px;border-radius:8px;font-size:10px;font-weight:900}

/* --- tabla histórico de precios --- */
.history{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:3px;overflow:hidden;font-size:12px}
.history th{background:#f4f5f6;color:#4b5563;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:10px;text-transform:uppercase;letter-spacing:.07em;font-weight:900;padding:8px 10px;text-align:left;border-bottom:1px solid #e2e5e9;white-space:nowrap}
.history th.r{text-align:right}
.history td{padding:9px 10px;border-bottom:1px solid #eef0f2;vertical-align:middle}
.history td.r{text-align:right}
.history tr:hover td{background:#fbfbfa}
.history td.code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;color:var(--steel);font-weight:900;white-space:nowrap}
.history td.entity strong{display:block;font-size:12px}
.history td.entity small{color:var(--muted);font-size:11px}
.history td.doc{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;color:var(--blue);font-weight:900;white-space:nowrap}
.history td.doc a{color:inherit;text-decoration:none}
.history td.doc a:hover{text-decoration:underline}
.history td.qty{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;text-align:right;color:var(--steel)}
.history td.price{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-weight:900;text-align:right;color:var(--steel);font-size:13px}
.source-tag{display:inline-block;padding:3px 8px;border-radius:3px;font:900 10px/1 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}
.source-tag.ot{background:#fff3cd;color:#8a6d10}
.source-tag.alb{background:#dcfce7;color:#166534}
.source-tag.pre{background:#eef2f8;color:#1d4ed8}
.source-tag.pc{background:#f3e8ff;color:#6d28d9}
.source-tag.art{background:#fef3c7;color:#92400e}

/* --- empty state --- */
.empty-state{background:#fff;border:1px solid var(--line);border-radius:3px;padding:60px 28px;text-align:center;color:var(--muted)}
.empty-state .icon{font-size:46px;margin-bottom:16px;opacity:.35;line-height:1}
.empty-state h3{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:14px;color:var(--steel);margin:0 0 10px;text-transform:uppercase;letter-spacing:.07em;font-weight:900}
.empty-state p{margin:0 auto 22px;font-size:13px;line-height:1.55;max-width:520px}
.empty-state .examples{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;align-items:center}
.empty-state .examples .lbl{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-weight:900;padding-right:4px}
.empty-state .ex-chip{padding:6px 12px;border:1px solid var(--line);background:#f8f8f7;border-radius:14px;font-size:12px;color:var(--steel);cursor:pointer;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-weight:900;text-decoration:none}
.empty-state .ex-chip:hover{background:var(--steel);color:#fff;border-color:var(--steel)}

/* --- móvil v0.6.2: tarjeta-formulario para .lines + plano + history --- */
@media (max-width:720px){
  /* tarjeta-formulario para líneas de presupuesto y PC (sustituye al patrón cramped anterior) */
  .lines,.lines thead,.lines tbody{display:block}
  .lines thead{display:none}
  .lines tr{display:flex;flex-wrap:wrap;gap:10px;border:1px solid var(--line);border-radius:5px;background:#fff;margin-bottom:10px;padding:14px 12px 12px;position:relative}
  .lines tr.ar,.lines tr.empty-row{display:block;background:#f7f9fd;padding:14px;text-align:center;color:var(--blue);font-weight:900;cursor:pointer;border:1px dashed #b8c8e8}
  .lines tr.ar td,.lines tr.empty-row td{padding:0;border:0;background:transparent}
  .lines tr.ar td::before,.lines tr.empty-row td::before{display:none}
  .lines td{flex:1 1 100%;border:0;padding:0;display:block;background:transparent}
  .lines td::before{content:attr(data-label);display:block;font:900 10px/1 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;text-transform:uppercase;letter-spacing:.07em;color:#6f7480;margin-bottom:5px}
  .lines td.num{position:absolute;top:10px;right:12px;flex:0 0 auto;width:auto;padding:3px 10px;background:#1d2634;color:#fff;font:900 11px/1 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;border-radius:12px}
  .lines td.num::before{display:none}
  .lines td.qty,.lines td.pri,.lines td.tot{flex:1 1 calc(33.33% - 7px);min-width:0}
  .lines td.tot{background:transparent;color:var(--steel);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-weight:900;font-size:15px;padding-top:0}
  .lines td input.ci{width:100%;max-width:none;display:block;border:1px solid #c8ccd2;background:#fff;border-radius:4px;padding:10px 12px;min-height:44px;font-size:16px !important}
  .lines td input.ci.qty,.lines td input.ci.pri{text-align:right}
  .lines td.x{flex:1 1 100%;text-align:right;padding:0;margin-top:2px;border-top:1px dashed #eef0f2;padding-top:8px}
  .lines td.x::before{display:none}
  .lines td.x .ib{background:#fff;color:#c53333;border:1px solid #f4caca;border-radius:4px;padding:8px 16px;font-size:13px;font-weight:900;cursor:pointer;min-height:38px;display:inline-flex;align-items:center;gap:6px}
  .lines td.x .ib::after{content:" Eliminar"}

  /* Plano en móvil: pill full-width tappable */
  .lines td.plano{flex:1 1 100%;background:transparent;padding:0}
  .lines td.plano .plano-toggle{display:block;width:100%}
  .lines td.plano .pt-pill{width:100%;padding:12px 16px;border-radius:6px;font-size:14px;min-height:44px;justify-content:center}
  .lines td.plano .pt-icon{font-size:14px}
  .plano-none{display:block;padding:10px 12px;text-align:left;font-size:13px;border:1px dashed #dcdfe3;border-radius:4px;background:#fafbfc}

  /* tabla histórico en móvil: scroll horizontal (consulta) */
  .history-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .history{min-width:780px}
  .doc-types{padding:0;justify-content:flex-start}
  .doc-chip{min-height:36px;padding:8px 12px}
  .doc-chip .cnt{font-size:11px}

  /* empty state padding reducido */
  .empty-state{padding:40px 18px}
}

/* móvil mediano (≤900): tarjeta-formulario aún no se aplica pero ajustamos toolbars/cabeceras */
@media (max-width:900px) and (min-width:721px){
  .doc-types{padding:6px 0}
}

/* v1.0.1 — ajustes solicitados MICAR */
.badge.status-created{background:#dbeafe!important;color:#1d4ed8!important;border:1px solid #bfdbfe}
.badge.status-shortage{background:#fff0df!important;color:#c2410c!important;border:1px solid #fed7aa}
.badge.status-purchased{background:#fef9c3!important;color:#854d0e!important;border:1px solid #fde68a}
.badge.status-partial-waybilled{background:#e0f2fe!important;color:#075985!important;border:1px solid #bae6fd}
.badge.status-waybilled{background:#dcfce7!important;color:#166534!important;border:1px solid #bbf7d0}
.badge.status-cancelled{background:#f1f5f9!important;color:#475569!important;border:1px solid #cbd5e1}
.badge.status-transfer-pending{background:#e0f2fe!important;color:#075985!important;border:1px solid #bae6fd}
.badge.status-transferred{background:#d1fae5!important;color:#065f46!important;border:1px solid #a7f3d0}
.badge.status-transfer-error{background:#fee2e2!important;color:#991b1b!important;border:1px solid #fecaca}
.badge.status-deleted{background:#f8fafc!important;color:#64748b!important;border:1px dashed #cbd5e1}
.badge.status-draft{background:#eef2f8!important;color:#1d4ed8!important;border:1px solid #cbd5e1}

.ot-btn.ot-nav{min-width:112px;background:#f8fafc;color:#24313f;border-color:#d6dde6}
.ot-btn.disabled,.ot-btn[aria-disabled="true"]{opacity:.45;pointer-events:none;filter:grayscale(.3);cursor:not-allowed}
.ot-bottom-grid input[name="finished_quantity"]{min-width:140px;width:100%}

.suggestions-portal.suggestions-wide{max-height:72vh!important;min-width:min(520px,calc(100vw - 16px));width:min(760px,calc(100vw - 16px))}
.suggestions-portal.suggestions-wide button{white-space:normal;line-height:1.35}
.suggestions-portal.suggestions-wide button strong,.suggestions-portal.suggestions-wide button small{white-space:normal;overflow-wrap:anywhere;word-break:break-word}

.material-shortage-line{display:grid;grid-template-columns:minmax(180px,1fr) minmax(82px,110px) minmax(86px,105px) auto;gap:8px;align-items:center;margin-bottom:8px;min-width:0}
.material-shortage-line input,.material-shortage-line select{min-width:0!important;max-width:100%;width:100%;box-sizing:border-box}
.material-shortage-line button{white-space:nowrap}
@media (max-width:720px){
  .material-shortage-line{grid-template-columns:minmax(0,1fr) minmax(78px,90px) minmax(86px,96px)}
  .material-shortage-line button{grid-column:1/-1;width:100%}
}

/* v1.0.5 · Albaranes: captura directa de OT por número, sin listados largos */
.capture-bar{display:grid;grid-template-columns:minmax(180px,260px) auto minmax(180px,1fr);gap:8px;align-items:center;margin-bottom:10px}
.capture-bar input{min-height:36px;font-weight:900}
.capture-bar-bottom{margin-top:10px;margin-bottom:0}
.capture-message{font-size:11px;color:var(--muted);font-weight:800;line-height:1.35}
.capture-message.ok{color:var(--green)}
.capture-message.warn{color:var(--warn)}
.capture-message.error{color:var(--red)}
.neutral-empty{text-align:center;color:#6f7480;font-weight:900;background:#fbfbfa;cursor:pointer;font-family:ui-monospace,monospace;letter-spacing:.02em}
.compact-lines td input.ci{min-height:32px;padding:5px 7px;font-size:12px!important}
.compact-lines .pending-ot-row td{background:#fffdf5}
.dn-capture-card .section-title small{white-space:normal;text-align:right}
@media (max-width:760px){.capture-bar{grid-template-columns:1fr}.capture-message{min-height:18px}}

/* v1.0.5b · Albaranes: neutralizar filas vacías para evitar franjas azules */
.lines tr.empty-row td.neutral-empty,
.lines tr.ar.empty-row td.neutral-empty,
.lines tr.empty-row.neutral-row td,
.lines tr.ar.empty-row.neutral-row td{
  background:#fbfbfa!important;
  color:#6f7480!important;
  border:1px dashed #d7d9dd!important;
}
.lines tr.empty-row:has(td.neutral-empty),
.lines tr.ar.empty-row:has(td.neutral-empty){
  background:#fbfbfa!important;
  color:#6f7480!important;
  border-color:#d7d9dd!important;
}

/* v1.0.13 — cliente OT: solo una línea de buscador, sin botones rápidos. */
.ot-sheet-screen #client_search{font-weight:800}

/* v1.0.9 — drag & drop de plano principal, usando azul de acción MICAR */
.plano-dropzone.drag-over{
  background:#eaf2ff !important;
  border-color:var(--blue) !important;
  box-shadow:0 0 0 3px rgba(32,117,242,.14);
}

/* v1.0.10 — cabeceras de bloque más fuertes con la paleta MICAR */
.section-title,
.ot-sheet-screen .ot-section-title,
.ot-section-title{
  background:var(--steel);
  color:#ffffff !important;
  border-bottom:0 !important;
  border-radius:3px;
  padding:8px 10px !important;
  align-items:center;
}
.section-title small,
.ot-sheet-screen .ot-section-title small,
.ot-section-title small{
  color:#d9e1ea !important;
}

/* v1.0.10 — compatibilidad con plantillas antiguas que aún usan btn-primary */
.btn.btn-primary,
.btn-primary{
  background:var(--blue);
  border-color:var(--blue);
  color:#fff;
}
.btn.btn-primary:hover,
.btn-primary:hover{
  background:var(--blueh);
  border-color:var(--blueh);
}
.save-toast{
  background:var(--steel);
  border-color:#46546a;
}

/* v1.0.11 — drag & drop directo en la vista principal derecha del artículo */
.side-plano-dropzone{
  border:2px dashed transparent;
  border-radius:8px;
  padding:4px;
  transition:background .15s ease,border-color .15s ease,box-shadow .15s ease;
}
.side-plano-dropzone.drag-over{
  background:#eaf2ff !important;
  border-color:var(--blue) !important;
  box-shadow:0 0 0 3px rgba(32,117,242,.14);
}
.side-drop-hint{
  margin:8px 0 0;
  font-size:11px;
  line-height:1.35;
  color:#5a6470;
}
.side-drop-hint.strong{
  color:var(--blue);
  font-weight:900;
}