/* Identidad CICSA suministrada por el usuario. Componentes del espacio de trabajo. */
:root {
  --vd:#0F3D2E; --vm:#237B36; --vclaro:#3FAE4C; --naranja:#F57C00;
  --amarillo:#FFC23E; --arena:#E6DBC2; --azul:#164A5F; --do:#82600B;
  --bg:#F5F6F3; --claro:#EDF4EE; --txt:#172F26; --txt2:#52635A;
  --border:#D8E1DA; --radius:14px; --shadow:none;
  --font-ui:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
body,button,input,select,textarea { font-family:var(--font-ui); }
body { line-height:1.5; }
::selection { background:var(--amarillo); color:var(--vd); }
input,textarea { caret-color:var(--vd); }
* { scrollbar-color:#80948A transparent; scrollbar-width:thin; }
:focus-visible { outline:3px solid var(--azul); outline-offset:3px; }
input::placeholder,textarea::placeholder { color:#68746C; opacity:1; }
.container { max-width:1320px; padding:32px; }
.card { border:1px solid var(--border); border-radius:14px; box-shadow:none; padding:24px; }
.card-title,.rs-title,.scard-val { font-family:var(--font-ui); font-weight:650; }
.scard { border-radius:14px; box-shadow:none; border-width:1px; }
.scard-label { text-transform:none; letter-spacing:0; font-size:12px; }
.mobile-corporate-logo { height:44px; width:108px; object-fit:contain; background:#fff; border-radius:4px; display:block; }
.m-topbar .mt-sub { display:none; }
.card-title { border:0; padding-bottom:0; margin-bottom:20px; font-size:17px; }
.rs-title { font-size:28px; letter-spacing:-.025em; }
.rs-sub { font-size:14px; }
.rs-head { margin-bottom:24px; }
.btn { min-height:42px; border-radius:8px; font-weight:600; font-size:14px; }
.btn-green { background:var(--vd); color:#fff; }
.btn-green:hover { background:#18533F; }
.btn-gold { background:#FFC23E; color:#0F3D2E; }
.btn-gold:hover { background:#FFD46F; }
thead th { background:#0F3D2E; color:#fff; }
.btn:disabled { opacity:.55; cursor:not-allowed; }
.btn-light { color:var(--vd); background:var(--claro); }
.btn-light:hover { background:#DCEADD; }
input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea { min-height:44px; border-radius:8px; }
label { color:var(--txt); }
table { font-variant-numeric:tabular-nums; }
th { text-transform:none; letter-spacing:0; font-size:12px; }
td { font-size:13px; }
/* Gastos: conservar la lectura de folio, pago e importe antes de comprimir columnas. */
#page-gastos .gastos-table-wrap { min-width:0; }
#page-gastos .gastos-table { table-layout:fixed; min-width:1192px; }
#page-gastos .gastos-col-respaldo { width:80px; }
#page-gastos .gastos-col-fecha { width:96px; }
#page-gastos .gastos-col-proveedor { width:auto; }
#page-gastos .gastos-col-categoria { width:176px; }
#page-gastos .gastos-col-factura { width:168px; }
#page-gastos .gastos-col-pago { width:176px; }
#page-gastos .gastos-col-importe { width:152px; }
#page-gastos .gastos-col-acciones { width:80px; }
#page-gastos .gastos-table th,
#page-gastos .gastos-table td { padding:12px; vertical-align:middle; }
#page-gastos .gastos-table td { overflow-wrap:anywhere; }
#page-gastos .gastos-heading-importe { text-align:right; }
#page-gastos .gastos-heading-acciones { text-align:center; }
#page-gastos .gastos-table input,
#page-gastos .gastos-table select { box-sizing:border-box; min-width:0; max-width:100%; }
/* La celda compartida trae width:90px inline; el ajuste solo pertenece a Gastos. */
#page-gastos .gastos-table .amount-cell input { width:100% !important; }
#page-gastos .gastos-actions-cell { display:table-cell; }
#page-gastos .gastos-row-actions { display:flex; align-items:center; justify-content:center; gap:4px; }
#page-gastos .gastos-row-actions .del-btn { width:44px; min-width:44px; height:44px; padding:0; display:inline-flex; align-items:center; justify-content:center; }
.side-brand { padding:14px 18px 12px; flex-direction:column; align-items:stretch; gap:0; }
.corporate-logo { display:block; width:100%; max-height:110px; object-fit:contain; background:#fff; border-radius:8px; }
.brand-caption { font-size:12px; text-align:center; color:var(--txt2); margin-top:0; }
/* Logo oficial negativo, sin placa blanca. El modo claro conserva su marca actual. */
.brand-negative { display:none; }
@media screen {
  :root[data-theme=dark] .brand-positive { display:none; }
  :root[data-theme=dark] .brand-negative { display:block; background:transparent; border-radius:0; }
  :root[data-theme=dark] .side-brand { padding:20px 18px 16px; gap:12px; }
  :root[data-theme=dark] .corporate-logo.brand-negative { height:auto; }
}
.nav-btn { min-height:41px; border-radius:8px; }
.nav-btn.active { color:var(--vd); background:#E3EEDF; font-weight:650; }
.sn-group h4 { text-transform:none; letter-spacing:0; color:var(--txt2); font-size:11px; padding-top:8px; }
.workspace-actions { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(0,1fr); gap:18px; margin:0 0 22px; }
.workspace-action { border-radius:14px; padding:28px; min-width:0; }
.workspace-action h2 { margin:0 0 8px; font-size:23px; font-weight:650; line-height:1.25; letter-spacing:-.02em; }
.workspace-action p { margin:0 0 24px; max-width:48ch; font-size:14px; }
.workspace-capture { background:#0F3D2E; color:#fff; }
.workspace-capture p { color:#D6E8DB; }
.workspace-capture .btn { background:#FFC23E; color:#0F3D2E; }
.workspace-capture .btn:hover { background:#FFD46F; }
.workspace-review { background:var(--amarillo); color:#0F3D2E; }
.workspace-review p { color:#435346; }
.workspace-review .btn { background:#fff; color:#0F3D2E; }
.workspace-action .btn { display:inline-flex; align-items:center; gap:10px; border:0; }
.workspace-action svg { width:18px; height:18px; stroke-width:1.8; }
.workspace-action .btn:focus-visible { outline-color:#FFC23E; outline-offset:5px; }
.workspace-capture .btn:focus-visible { outline-color:#fff; }
.workspace-review .btn:focus-visible { outline-color:#0F3D2E; }
.workspace-head { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:22px; }
.workspace-head h1 { font-size:28px; line-height:1.25; letter-spacing:-.025em; margin:0 0 6px; }
.workspace-head p { margin:0; color:var(--txt2); font-size:14px; }
.capture-steps { list-style:none; padding:0; display:flex; flex-wrap:wrap; gap:12px 24px; font-size:13px; color:var(--txt2); margin:0 0 22px; }
.capture-steps li { display:flex; align-items:center; gap:8px; }
.capture-steps span { display:grid; place-items:center; width:26px; height:26px; border-radius:50%; background:#E4EAE3; color:#435346; }
.capture-steps li[aria-current=step] { color:var(--vd); font-weight:650; }
.capture-steps li[aria-current=step] span { background:var(--vd); color:white; }
.capture-bento { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); align-items:start; gap:20px; }
.capture-bento>.card { min-width:0; margin:0; }
.capture-help { padding:26px; background:#E6DBC2; border-radius:14px; color:#0F3D2E; }
.capture-help h2 { margin:0 0 18px; font-size:18px; }
.capture-help ol { padding-left:20px; margin:0; }
.capture-help li { margin-bottom:16px; font-size:14px; }
.capture-help li:last-child { margin:0; }
.capture-help p { font-size:13px; padding-top:20px; border-top:1px solid #B5AF9A; margin:22px 0 0; }
.capture-manual { margin-top:20px; }
.dropzone { background:#F5F8F3; border:1.5px dashed #92A898; border-radius:12px; padding:40px 20px; }
.dropzone:hover,.dropzone:focus-visible { background:#E6F0E2; border-color:#0F3D2E; }
.dropzone-icon { color:#0F3D2E; margin-bottom:12px; }
.dropzone-icon svg { width:36px; height:36px; stroke-width:1.5; }
.dropzone p { font-size:14px; }
.capture-bento.has-document .dropzone { padding:12px 16px; display:flex; align-items:center; gap:14px; text-align:left; }
.capture-bento.has-document .dropzone-icon { margin:0; }
.capture-bento.has-document .dropzone-icon svg { width:24px; height:24px; }
.capture-bento.has-document .dropzone p { margin:0; font-size:12px; }
.capture-bento.has-document .dropzone p:last-child { display:none; }
.capture-bento[hidden],.capture-complete[hidden] { display:none; }
.capture-complete { padding:26px; background:#EDF4EE; border-radius:14px; color:#0F3D2E; margin-bottom:20px; }
.capture-complete h2 { margin:0 0 8px; font-size:22px; }
.capture-complete p { margin:0 0 18px; font-size:14px; }
.spanish-file { display:inline-flex; align-items:center; gap:10px; flex-wrap:wrap; }
.spanish-file small { font-size:12px; overflow-wrap:anywhere; }
#imgPreview { max-height:300px; object-fit:contain; width:100%; }
#extractedCard { scroll-margin-top:24px; }
#extractedCard .grid3 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.capture-sync { font-size:13px; padding:10px 14px; border-radius:8px; background:#EDF4EE; color:#0F3D2E; margin-top:18px; }
.capture-sync[data-pending=true] { background:#FFF0C7; color:#674800; }
.rs-alert { border-left-width:1px; box-shadow:none; border-radius:8px; }
.rs-grid2 { gap:20px; }
.rs-bar,.rs-catfill { background:#3FAE4C; }
.rs-bar.over,.rs-catfill.over { background:#F57C00; }
:root[data-theme=dark] .workspace-head h1 { color:var(--txt); }
:root[data-theme=dark] .brand-caption { color:var(--dk-ink); }
:root[data-theme=dark] .workspace-review { background:var(--amarillo); color:#0F3D2E; }
:root[data-theme=dark] .workspace-capture { background:var(--dk-brand); color:var(--dk-bg); border:1px solid var(--dk-brand); }
:root[data-theme=dark] .workspace-capture p { color:var(--dk-bg); }
:root[data-theme=dark] .workspace-capture .btn:hover { background:var(--dk-gold); outline:2px solid var(--dk-bg); outline-offset:2px; }
:root[data-theme=dark] #page-resumen .workspace-capture .btn:focus-visible { outline-color:var(--dk-bg); }
@media (max-width:1100px) { .container { padding:24px; } .capture-bento { grid-template-columns:1fr; } .capture-help { order:2; } }
@media (max-width:600px) {
  .container { padding:20px 16px 50px; }
  .workspace-actions { grid-template-columns:1fr; gap:14px; }
  .workspace-action { padding:24px; }
  .workspace-action h2 { font-size:22px; }
  .workspace-action p { margin-bottom:18px; }
  .workspace-head { align-items:flex-start; flex-direction:column; }
  .workspace-head h1,.rs-title { font-size:25px; }
  .rs-head { align-items:flex-start; }
  .rs-head>.btn { font-size:12px; }
  .card { padding:20px; }
  .capture-steps { gap:10px; font-size:12px; }
  .capture-steps span { width:22px; height:22px; }
  #extractedCard .grid3 { grid-template-columns:1fr; }
  .capture-bento .btn-row { flex-wrap:wrap; }
}
@media (prefers-reduced-motion:no-preference) {
  #extractedCard { animation:confirmation-ready .2s cubic-bezier(.16,1,.3,1); }
  @keyframes confirmation-ready { from { transform:translateY(8px); } to { transform:translateY(0); } }
}