/* =============================================================
   Simple Kardex — hoja de estilos única
   Basada en AC SciComp Design System (tema oscuro).
   Sustituye por completo a Pico CSS: elimina el <link> de Pico
   en base.html antes de usar esta hoja.
   ============================================================= */

:root{
  --bg:#0f1117;
  --surface:#1a1f2e;
  --surface2:#222840;
  --accent:#4f9cf9;
  --accent2:#7ee8a2;
  --text:#e2e8f0;
  --muted:#8892a4;
  --border:rgba(255,255,255,0.08);
  --tag-bg:rgba(79,156,249,0.12);
  --tag-c:#4f9cf9;
  --tag2-bg:rgba(126,232,162,0.12);
  --tag2-c:#7ee8a2;
  --nav-bg:rgba(15,17,23,0.85);
  /* State colors (spec 007): blue = action, green = fine, amber = needs
     attention, red = error. Nothing else uses them. Small text in each one
     keeps >= 4.5:1 contrast; tests/test_css_contrast.py checks it. */
  --ok:#7ee8a2;
  --ok-bg:rgba(126,232,162,0.12);
  --warn:#f5b454;
  --warn-bg:rgba(245,180,84,0.12);
  --danger:#f87171;
  --danger-bg:rgba(248,113,113,0.12);
  --neutral-bg:rgba(255,255,255,0.06);
  --font:'Space Grotesk',system-ui,-apple-system,sans-serif;
}

/* Tema claro: opt-in con <html data-theme="light">.
   Sin ese atributo la app queda en oscuro, que es el tema por defecto del
   design system. Ver README para el conmutador. */
[data-theme="light"]{
  --bg:#e9edf5;
  --surface:#ffffff;
  --surface2:#dde5f3;
  --accent:#2563eb;
  --accent2:#0891b2;
  --text:#1e3a5f;
  --muted:#5b6b85;
  --border:rgba(15,23,42,0.16);
  --tag-bg:rgba(37,99,235,0.10);
  --tag-c:#1d4ed8;
  --tag2-bg:rgba(8,145,178,0.10);
  --tag2-c:#0369a1;
  --nav-bg:rgba(233,237,245,0.92);
  /* Darker than first proposed so small text passes on --bg too: see
     proj_docs/specs/007-ui-ux-responsiva/plan.md, "Colores". */
  --ok:#036b4d;
  --ok-bg:rgba(3,107,77,0.10);
  --warn:#92400e;
  --warn-bg:rgba(146,64,14,0.10);
  --danger:#b91c1c;
  --danger-bg:rgba(185,28,28,0.08);
  --neutral-bg:rgba(15,23,42,0.06);
}

*{box-sizing:border-box}
/* `hidden` must win over any display rule (e.g. .k-btn's inline-flex). */
[hidden]{display:none !important}
html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--text);font-family:var(--font);font-size:16px;line-height:1.7}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent);text-decoration:underline}
::selection{background:var(--accent);color:#fff}
h1,h2,h3{margin:0;font-weight:700;letter-spacing:-0.02em}

/* ---------- Header + navegación ---------- */
.k-header{position:sticky;top:0;z-index:30;background:var(--nav-bg);backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}
.k-header__inner{max-width:1040px;margin:0 auto;padding:0 20px;min-height:56px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.k-brand{display:flex;align-items:center;gap:8px;color:var(--text);white-space:nowrap}
.k-brand__logo{display:block;flex:none}
.k-brand:hover{text-decoration:none;color:var(--text)}
.k-brand__name{font-size:16px;font-weight:700;letter-spacing:-0.02em}
.k-brand__meta{font-size:11px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--muted)}
.k-nav{display:flex;align-items:center;gap:4px}
.k-nav__link{padding:8px 13px;border-radius:8px;font-size:14px;font-weight:500;color:var(--muted)}
.k-nav__link:hover{color:var(--text);text-decoration:none}
.k-nav__link.is-active{background:var(--surface2);color:var(--text)}
.k-user{display:flex;align-items:center;gap:8px;padding:6px 12px 6px 8px;border:1px solid var(--border);border-radius:20px;font-size:13px;color:var(--muted);white-space:nowrap}
.k-user__avatar{width:22px;height:22px;border-radius:50%;background:var(--tag-bg);color:var(--tag-c);font-size:11px;font-weight:700;display:grid;place-items:center}

/* Session menu (spec 007): user, theme and logout grouped in one <details>,
   the same no-JavaScript pattern as the mobile menu below. */
.k-usermenu{position:relative}
.k-usermenu summary{list-style:none;cursor:pointer}
.k-usermenu summary::-webkit-details-marker{display:none}
.k-usermenu summary:hover,.k-usermenu[open] summary,.k-usermenu summary.is-active{color:var(--text);border-color:var(--accent)}
.k-usermenu__panel{position:absolute;right:0;top:calc(100% + 10px);min-width:220px;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:8px;display:flex;flex-direction:column;gap:2px;z-index:40}
.k-usermenu__panel form{margin:0}
.k-usermenu__panel a,.k-usermenu__item{display:flex;align-items:center;gap:8px;width:100%;padding:10px 12px;border:none;border-radius:8px;background:none;font:inherit;font-size:14px;font-weight:500;color:var(--muted);text-align:left;cursor:pointer}
.k-usermenu__panel a:hover,.k-usermenu__item:hover{color:var(--text);background:var(--surface2);text-decoration:none}
.k-usermenu__panel a.is-active{background:var(--surface2);color:var(--text)}
/* Theme button shows the active theme's emoji, chosen by CSS alone. */
.k-theme__icon--light{display:none}
[data-theme="light"] .k-theme__icon--dark{display:none}
[data-theme="light"] .k-theme__icon--light{display:inline}

/* menú móvil: <details>, sin JavaScript */
.k-menu{display:none;position:relative}
.k-menu__toggle{list-style:none;width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--border);border-radius:8px;background:var(--surface2);cursor:pointer;font-size:18px}
.k-menu__toggle::-webkit-details-marker{display:none}
.k-menu__panel{position:absolute;right:0;top:calc(100% + 10px);width:min(280px,calc(100vw - 40px));background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:10px;display:flex;flex-direction:column;gap:4px;z-index:40}
.k-menu__panel a{padding:13px 14px;border-radius:8px;font-size:15px;font-weight:500;color:var(--muted)}
.k-menu__panel a:hover{color:var(--text);text-decoration:none}
.k-menu__panel a.is-active{background:var(--surface2);color:var(--text)}
.k-menu__foot{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:12px;margin-top:10px;padding-top:12px;border-top:1px solid var(--border);font-size:13px;color:var(--muted)}
.k-menu__foot form{margin:0}
.k-menu__foot > span{margin-right:auto}

/* ---------- Estructura de página ---------- */
.k-main{max-width:1040px;margin:0 auto;padding:32px 20px 72px;display:flex;flex-direction:column;gap:24px}
/* One line at the end of every signed-in screen (spec 010): the version and
   "Acerca de". Small and quiet; it comes after the page, so on Pagos the
   fixed pay bar settles above it at the end of the list. */
.k-footer{max-width:1040px;margin:-40px auto 0;padding:14px 20px calc(20px + env(safe-area-inset-bottom));border-top:1px solid var(--border);text-align:center;font-size:12px;color:var(--muted)}
.k-footer a{color:var(--muted);text-decoration:underline}
.k-footer a:hover{color:var(--text)}
/* "Acerca de": centered, like the error pages. */
.k-about{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;padding:40px 0}
.k-about h1{margin:10px 0 4px}
.k-about p{margin:0}
.k-about__version{color:var(--muted);font-variant-numeric:tabular-nums}
.k-about .k-about__help{margin-top:14px}
.k-about .k-about__credit{margin-top:22px;font-size:13px;color:var(--muted)}
.k-page-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px}
.k-eyebrow{margin:0;font-size:11px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--accent)}
.k-page-head h1{margin:8px 0 6px;font-size:32px;letter-spacing:-0.03em}
.k-page-head p{margin:0;color:var(--muted);font-size:15px}
.k-note{margin:0;font-size:14px;color:var(--muted);line-height:1.7}

/* ---------- Botones ---------- */
.k-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 18px;border:1px solid transparent;border-radius:10px;font:inherit;font-size:14px;font-weight:500;cursor:pointer;transition:opacity .2s ease,transform .15s ease,border-color .2s ease,color .2s ease}
.k-btn:hover{text-decoration:none}
.k-btn--primary{background:var(--accent);color:#fff}
.k-btn--primary:hover{opacity:.88;transform:translateY(-1px);color:#fff}
.k-btn--ghost{background:transparent;border-color:var(--border);color:var(--text)}
.k-btn--ghost:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-1px)}
.k-btn--sm{padding:8px 12px;border-radius:8px;font-size:13px}
.k-btn--block{width:100%}
.k-btn--icon{width:38px;height:38px;padding:0;border-radius:8px;font-size:15px;line-height:1;filter:grayscale(0.2)}

/* ---------- Tarjetas y datos ---------- */
.k-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;overflow-x:auto}
.k-card__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 20px;border-bottom:1px solid var(--border)}
.k-card__title{font-size:17px}
.k-card__meta{font-size:13px;color:var(--muted)}

.k-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px}
.k-kpi{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:20px 22px;display:flex;flex-direction:column}
.k-kpi__value{font-size:36px;font-weight:700;line-height:1}
.k-kpi__value--alert{color:var(--warn)}
.k-kpi__label{font-size:12px;color:var(--muted);margin-top:6px}

.k-alert{background:var(--surface);border:1px solid var(--warn);border-radius:14px;padding:22px 24px}
.k-alert .k-eyebrow{color:var(--warn)}
.k-alert__head{display:flex;align-items:baseline;gap:10px;margin-bottom:14px}
.k-alert__icon{font-size:18px;filter:grayscale(0.2)}
.k-alert__text{margin:4px 0 0;font-size:15px;font-weight:500}
/* Inicio's alerts (spec 007, H4-05): when both are present they sit
   together and compact, each button beside its text instead of below it. */
.k-alerts{display:flex;flex-direction:column;gap:24px}
.k-alerts--pair{gap:12px}
.k-alerts--pair .k-alert{display:grid;grid-template-columns:1fr auto;grid-template-areas:"head btn" "chips chips";column-gap:16px;align-items:center;padding:16px 20px}
.k-alerts--pair .k-alert__head{grid-area:head;margin-bottom:0}
.k-alerts--pair .k-alert > .k-btn{grid-area:btn}
.k-alerts--pair .k-chips{grid-area:chips;margin-top:12px}
@media (max-width:479.98px){
  .k-alerts--pair .k-alert{grid-template-columns:1fr;grid-template-areas:"head" "chips" "btn"}
  .k-alerts--pair .k-alert > .k-btn{justify-self:start;margin-top:12px}
}
.k-chips{display:flex;flex-wrap:wrap;gap:10px}
.k-chip{display:flex;align-items:center;gap:10px;background:var(--bg);border:1px solid var(--border);border-radius:20px;padding:7px 14px;font-size:14px;font-weight:500}
.k-chip span{font-size:13px;font-weight:400;color:var(--muted)}
.k-ok{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:18px 22px;display:flex;align-items:center;gap:12px;font-size:15px}
.k-dot{width:8px;height:8px;border-radius:50%;background:var(--ok);flex:none}

.k-tag{display:inline-block;font-size:12px;font-weight:700;letter-spacing:0.02em;padding:4px 12px;border-radius:20px;background:var(--tag-bg);color:var(--tag-c)}
.k-tag--ok{background:var(--ok-bg);color:var(--ok)}
.k-tag--warn{background:var(--warn-bg);color:var(--warn)}
/* No state to convey (Salida, Inactivo): the words say it all. Normal text,
   not --muted: muted on the gray pill falls below 4.5:1 in both themes. */
.k-tag--neutral{background:var(--neutral-bg);color:var(--text)}

/* ---------- Tablas ---------- */
.k-table{width:100%;border-collapse:collapse}
.k-table th{padding:12px 12px;background:var(--bg);border-bottom:1px solid var(--border);text-align:left;font-size:11px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--muted)}
.k-table td{padding:14px 12px;border-bottom:1px solid var(--border);font-size:15px;vertical-align:middle}
.k-table tr:last-child td{border-bottom:none}
.k-table .k-num{text-align:right;font-variant-numeric:tabular-nums}
/* Quantities, amounts, tags and buttons never split across two lines. */
.k-num,.k-tag,.k-btn{white-space:nowrap}
.k-table .k-strong{font-weight:500}
.k-table .k-dim{color:var(--muted);font-size:14px}
.k-table .k-low{color:var(--warn);font-weight:700}
.k-actions{display:flex;gap:8px;justify-content:flex-end}
.k-actions form{margin:0}

/* Menu breakpoint (spec 007): horizontal while it fits on one line. */
@media (max-width:1023.98px){
  .k-nav,.k-usermenu{display:none}
  .k-menu{display:block}
}

@media (max-width:880px){
  .k-page-head h1{font-size:27px}
}

/* ---------- Simple tables as compact cards (spec 007, H1/H4) ---------- */
/* The same <table> is reflowed below 720px: no field labels, the main datum
   on top, the rest in one muted line. Cells only one of the two views needs
   are marked .k-only-table / .k-only-card; an empty cell is .is-empty and
   the card leaves it out instead of printing "-". */
.k-only-card{display:none}
/* Each datum of the line stays whole ("mín. 48", "Bodega 4.990 galón")
   and the line breaks only at the " · " between data, which keeps normal
   wrapping: the templates leave no space between the spans (spec 008,
   task 6). */
.k-meta > span{white-space:nowrap}
.k-meta > span + span::before{content:" · ";white-space:normal}
@media (max-width:719.98px){
  .k-table--cards thead{display:none}
  .k-table--cards tr{display:grid;grid-template-columns:1fr auto;gap:6px 12px;align-items:center;padding:14px 16px;border-bottom:1px solid var(--border)}
  .k-table--cards tr:last-child{border-bottom:none}
  .k-table--cards td{display:block;padding:0;border:none;text-align:left}
  .k-table--cards .k-only-table,.k-table--cards .k-only-wide,.k-table--cards .is-empty{display:none}
  .k-table--cards .k-only-card{display:block}
  .k-table--cards .k-actions{justify-content:flex-start}
  .k-table--cards .k-c-name{grid-area:name}
  .k-table--cards .k-c-state{grid-area:state;justify-self:end}
  .k-table--cards .k-c-role{grid-area:role}
  .k-table--cards .k-c-qty{grid-area:qty;justify-self:end}
  .k-table--cards .k-c-meta,.k-table--cards .k-c-date,.k-table--cards .k-c-note{color:var(--muted);font-size:14px}
  .k-table--cards .k-c-meta{grid-area:meta}
  .k-table--cards .k-c-date{grid-area:date}
  .k-table--cards .k-c-note{grid-area:note}
  .k-table--cards .k-c-actions{grid-area:actions}
  .k-table--balances tr,.k-table--catalog tr{grid-template-areas:"name state" "meta meta" "actions actions"}
  .k-table--users tr{grid-template-columns:1fr auto auto;grid-template-areas:"name role state" "actions actions actions"}
  .k-table--unpriced tr{grid-template-areas:"name qty" "date date" "note note" "actions actions"}
}
/* Artículos (7 columns with its actions) does not fit as a table below
   ~800px (measured on captures, task 9), so its card starts earlier: the
   same card as above, repeated for this one table. */
@media (max-width:799.98px){
  .k-table--catalog thead{display:none}
  .k-table--catalog tr{display:grid;grid-template-columns:1fr auto;gap:6px 12px;align-items:center;padding:14px 16px;border-bottom:1px solid var(--border);grid-template-areas:"name state" "meta meta" "actions actions"}
  .k-table--catalog tr:last-child{border-bottom:none}
  .k-table--catalog td{display:block;padding:0;border:none;text-align:left}
  .k-table--catalog .k-only-table{display:none}
  .k-table--catalog .k-only-card{display:block}
  .k-table--catalog .k-actions{justify-content:flex-start}
  .k-table--catalog .k-c-name{grid-area:name}
  .k-table--catalog .k-c-state{grid-area:state;justify-self:end}
  .k-table--catalog .k-c-meta{grid-area:meta;color:var(--muted);font-size:14px}
  .k-table--catalog .k-c-actions{grid-area:actions}
}

/* ---------- Focus and touch targets (spec 007, H5) ---------- */
/* A visible outline for keyboard focus on everything that can take it. */
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* Fingers need 44x44px; with a mouse the smaller controls stay as they are. */
@media (pointer:coarse){
  .k-seg a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px}
  .k-btn--sm{min-height:44px;min-width:44px}
  .k-btn--icon{width:44px;height:44px}
}

/* ---------- Barra de filtros ---------- */
.k-toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.k-toolbar form{display:contents}
.k-toolbar .k-input,.k-toolbar .k-select{flex:1 1 220px;min-width:0;background:var(--surface)}
/* A search field (spec 010): a gray magnifier inside on the left, only a
   sign, and a "×" on the right while there is a search. WebKit's own clear
   button is hidden so there are never two. */
.k-search{position:relative;display:flex;flex:1 1 220px;min-width:0}
.k-toolbar .k-search .k-input{flex:1 1 auto;padding-left:40px}
.k-search__icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);font-size:15px;line-height:1;filter:grayscale(1);opacity:0.6;pointer-events:none}
.k-toolbar .k-search .k-input--clearable{padding-right:44px}
.k-search__clear{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:36px;height:36px;display:grid;place-items:center;border-radius:6px;font-size:20px;line-height:1;color:var(--muted)}
.k-search__clear:hover{color:var(--text);background:var(--surface2);text-decoration:none}
.k-search input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
@media (pointer:coarse){
  .k-search__clear{width:44px;height:44px;right:0}
  .k-toolbar .k-search .k-input--clearable{padding-right:48px}
}
.k-seg{display:inline-flex;gap:4px;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:4px}
.k-seg a{padding:8px 14px;border-radius:6px;font-size:13px;font-weight:500;color:var(--muted)}
.k-seg a:hover{color:var(--text);text-decoration:none}
.k-seg a.is-active{background:var(--surface2);color:var(--text)}

/* ---------- Paginación ---------- */
.k-pager{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;justify-content:space-between;margin:12px 0}
/* Above a list: only how many rows there are. The controls live below it. */
.k-pager__summary{margin:0}
.k-pager__summary,.k-pager__pos{font-size:13px;color:var(--muted)}
.k-pager__nav,.k-pager__size{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
/* One rule everywhere, one page or many, any device: "Filas por página"
   on the left, paging on the right, under the compact paging above. */
.k-pager__size{order:-1}
.k-pager__nav{margin-left:auto}
/* Phones use the default page size; see _pagination.html. Must come after
   the display:flex above, which would otherwise win. */
@media (max-width:719.98px){.k-pager__size{display:none}}
.k-pager .is-disabled{opacity:0.45;pointer-events:none}

/* ---------- Formularios ---------- */
.k-formcard{width:100%;max-width:480px;margin:0 auto;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:28px}
.k-form{display:flex;flex-direction:column;gap:16px}
.k-form__row{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px}
/* A field whose value is a long line (the Bodega entry: "#4878 · 01/10/2026 · quedan 2 rollo (59 m)") takes the whole row, so it reads whole when closed (spec 011, task 12). */
.k-form__row > .k-field--wide{grid-column:1 / -1}
.k-field{display:flex;flex-direction:column;gap:7px}
.k-label{font-size:11px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--muted)}
.k-input,.k-select,.k-textarea{width:100%;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:11px 13px;font:inherit;font-size:15px}
.k-textarea{resize:vertical;min-height:72px}
.k-input:focus,.k-select:focus,.k-textarea:focus{border-color:var(--accent)}
.k-help{font-size:13px;color:var(--muted)}
.k-help--warn{color:var(--warn)}
/* A group of optional fields inside a form (the alternate unit, spec 008). */
.k-fieldset{border:0;border-top:1px solid var(--border);margin:6px 0 0;padding:16px 0 0;min-width:0;display:flex;flex-direction:column;gap:16px}
.k-fieldset__title{padding:0;font-size:15px;font-weight:700;color:var(--text)}
/* A form in two columns from 1024px (the item form, spec 008; the movement
   form, spec 011): the main data on the left, the rest on the right;
   narrower, it all stacks. A notice above the form spans both. */
.k-form__main{display:flex;flex-direction:column;gap:16px}
@media (min-width:1024px){
  .k-formcard--wide{max-width:880px}
  .k-form--split{display:grid;grid-template-columns:1fr 1fr;column-gap:32px;row-gap:16px;align-items:start}
  .k-form--split .k-fieldset{margin:0;padding:0 0 0 32px;border-top:0;border-left:1px solid var(--border)}
  .k-form--split .k-form__actions,.k-form--split > .k-banner{grid-column:1 / -1}
}
.k-error{font-size:13px;color:var(--danger)}
.k-field--error .k-input,.k-field--error .k-select{border-color:var(--danger)}
.k-form__actions{display:flex;gap:10px;margin-top:6px}
/* Selector de tipo de movimiento: radios reales con apariencia de botón.
   El estado seleccionado lo pinta :checked — no uses estilos inline. */
.k-radio{display:block}
.k-radio input{position:absolute;opacity:0;width:0;height:0}
.k-radio input:checked + .k-btn{border-color:var(--accent);color:var(--text);background:var(--surface2)}
.k-radio input:focus-visible + .k-btn{outline:2px solid var(--accent);outline-offset:2px}
.k-form__actions form{margin:0}
.k-banner{margin:0 0 18px;background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:12px 14px;font-size:14px;color:var(--text)}
/* Every banner states its meaning; a plain .k-banner is not used on its own. */
.k-banner--ok{border-color:var(--ok);background:var(--ok-bg)}
.k-banner--warn{border-color:var(--warn);background:var(--warn-bg)}
.k-banner--danger{border-color:var(--danger);background:var(--danger-bg)}
/* Only informs: not good, not bad, nothing to do. No use yet (ui-ux.md). */
.k-banner--info{border-color:var(--border)}
.k-hint{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:11px 13px;font-size:13px;color:var(--muted);margin:0;line-height:1.5}
.k-readonly{display:flex;align-items:center;gap:8px;border:1px solid var(--border);border-radius:20px;padding:8px 14px;font-size:13px;color:var(--muted)}
.k-readonly .k-dot{background:var(--muted)}

/* ---------- Estados vacíos y páginas de error ---------- */
.k-empty{padding:48px 24px;text-align:center}
.k-empty__icon{font-size:26px;filter:grayscale(0.2)}
.k-empty h3{margin:12px 0 4px;font-size:16px}
.k-empty p{margin:0 auto 18px;max-width:380px;font-size:14px;color:var(--muted);line-height:1.6}
.k-center{min-height:100vh;display:grid;place-items:center;padding:32px 20px}
.k-auth{width:100%;max-width:380px}
.k-auth__head{display:flex;flex-direction:column;gap:4px;margin-bottom:24px}
.k-auth__logo{display:block;margin-bottom:10px}
.k-auth__head h1{font-size:30px;letter-spacing:-0.03em}
.k-auth__head p{margin:0;color:var(--muted);font-size:15px}
.k-errorpage{max-width:520px;margin:0 auto;text-align:center;padding:12vh 0}
.k-errorpage__logo,.k-formcard__logo{display:block;margin:0 auto 16px}
.k-errorpage__code{font-size:64px;font-weight:700;letter-spacing:-0.03em;line-height:1;color:var(--accent)}
.k-errorpage h1{margin:14px 0 8px;font-size:24px}
.k-errorpage p{margin:0 0 26px;color:var(--muted);font-size:15px}

/* ---------- Form headers and page pieces (were inline styles, spec 007) ---------- */
.k-formcard--narrow{max-width:420px}
.k-formhead{margin-bottom:20px}
.k-formhead h1{font-size:22px}
.k-formcard .k-note--lead{margin:0 0 18px}
.k-formcard__foot{margin-top:14px}
.k-auth__foot{margin-top:18px}
.k-seg--split{display:grid;grid-template-columns:1fr 1fr;width:100%}
/* As many equal columns as visible options: one can be hidden (the
   movement form's "Traslado", spec 011) without leaving a gap. */
.k-seg--auto{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:1fr}
/* The automatic transfer to confirm (spec 011): its text, then its button. */
.k-transfer-notice{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.k-transfer-notice p{margin:0}
/* Read-only facts of one record (Corregir cobro): label | value pairs. */
.k-facts{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;padding:16px 20px}
.k-card--spaced{margin-bottom:20px}
/* The fixed line of the reverse screen, above its facts (spec 009). */
.k-reverse__target{padding:16px 20px 0;color:var(--text)}
/* A value shown once that the reader has to copy now (temporary password). */
.k-secret p{margin:0 0 6px}
.k-secret p:last-child{margin:0}
.k-secret__value{font-size:20px;letter-spacing:.1em;font-weight:600}
.k-secret__row{display:flex;flex-wrap:wrap;align-items:center;gap:10px}

/* ---------- Low screens: phone in landscape (spec 007, H8) ---------- */
/* Little height: nothing centered on 100vh, the header scrolls away, and
   menu panels scroll on their own so every link can be reached. */
@media (max-height:499.98px){
  .k-header{position:static}
  .k-menu__panel,.k-usermenu__panel{max-height:calc(100vh - 72px);overflow-y:auto}
  .k-center{min-height:0;place-items:start center;padding:16px 20px}
  .k-errorpage{padding:24px 0}
  .k-auth__head{display:grid;grid-template-columns:40px 1fr;column-gap:12px;row-gap:2px;align-items:center;margin-bottom:14px}
  .k-auth__logo{width:40px;height:40px;margin:0;grid-row:1 / span 3}
}
/* ...and wide enough: forms use the width instead of the height, pairing
   fields. Only .k-field children pair; anything else (rows that already
   hold two fields, notes, actions, the login button) spans both columns. */
@media (max-height:499.98px) and (min-width:600px){
  .k-auth{max-width:640px}
  .k-formcard,.k-formcard--narrow{max-width:720px}
  .k-form{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px}
  .k-form > :not(.k-field),.k-form > .k-form__full{grid-column:1 / -1}
  /* A form already in two blocks puts them side by side. */
  .k-form--split > .k-form__main,.k-form--split > .k-fieldset{grid-column:auto}
  .k-form--split .k-fieldset{margin:0;padding:0 0 0 16px;border-top:0;border-left:1px solid var(--border)}
}

/* ---------- Movimientos: wide table and compact cards (spec 007, H2) ---------- */
/* Desktop keeps its columns (the owner's call). The wide page (Movimientos,
   and Pagos since spec 009) takes all the width the window has, with no cap:
   if there is room, the table uses it instead of squeezing its text. On a
   window too narrow for Movimientos, its first column (number and date)
   stays put while the rest scrolls, with a hint. */
.k-main--wide{max-width:none}
/* Sideways scroll only while the window is narrower than the table needs
   (its 1376px minimum + 42px of page margins and card border, as in Pagos).
   Above that the box is not a scroll box, so the header stays fixed while
   the page scrolls (spec 010). Keep it in step with the minimum width.
   While the box scrolls, the fixed header's 56px offset would be measured
   inside the box, not the page: the header would sit on the first row and
   leave a blank band above it. So no offset there; the first column still
   sticks sideways (sprint 0.11.1, OBS-02). The same goes for Pagos below. */
@media (max-width:1417.98px){
  .k-scroll{overflow-x:auto}
  .k-card--sticky-head .k-scroll .k-table thead th{top:auto}
}
.k-scroll__hint{margin:0;padding:10px 20px;border-bottom:1px solid var(--border);font-size:13px;color:var(--muted)}
/* `separate`, not `collapse`: sticky cells in collapsed tables misbehave in
   Safari. The borders already live on the cells, so it looks the same. */
.k-table--wide{border-collapse:separate;border-spacing:0}
.k-table--wide th:first-child,.k-table--wide td:first-child{position:sticky;left:0;z-index:1}
.k-table--wide td:first-child{background:var(--surface)}
/* Fixed column widths (spec 010): each column keeps its width on every
   page, whatever it holds. What does not fit is cut ("…", 3 lines) or the
   table scrolls sideways; text is never squeezed. Artículo has no width:
   it takes what is left, at least 300px, so min-width is the fixed columns
   (1076px) plus those 300. */
.k-table--wide{table-layout:fixed;min-width:1376px}
.k-table--wide th,.k-table--wide td{box-sizing:border-box}
.k-col--ref{width:104px}
.k-col--qty{width:168px}
.k-col--reason{width:210px}
.k-col--sale{width:170px}
.k-col--user{width:110px}
.k-col--note{width:150px}
.k-col--actions{width:164px}
/* What was reversed ("Reversado 2,25 de 1.250,5") in one line; the reason
   may take two ("Reverso de / devolución #4891"), as the row already does
   (spec 011, task 12), never splitting its link; a long username ends in
   "…" (its title has it whole). */
.k-table--wide .k-c-reason a,.k-table--wide a.k-reversed-note{white-space:nowrap}
.k-table--wide .k-c-user{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Where it happened (spec 011): a small line under the quantity; a
   transfer's two places may take two lines. */
.k-place{display:block;font-size:12px;font-weight:400;color:var(--muted);white-space:normal}
.k-mcard__place{margin:0;text-align:right}
/* A long note: 3 lines, then "…" (its title has it whole). On an inner
   span: line-clamp needs a box of its own, a table cell is not one. */
/* What one alternate unit is worth, in Artículos (spec 010): its own small
   line under the unit in the table; one more item of the card's line. */
.k-unit-alt{display:block;font-size:12px;color:var(--muted);white-space:nowrap}
.k-meta > .k-unit-alt{display:inline;font-size:inherit}
.k-clamp-3{display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* One card per movement on touch screens and below 1024px: item and
   quantity; date · reason · user; the billing line (a sale's amount, and
   the actions: "Corregir cobro", "Reversar"); the note if there is one. No
   field labels. */
.k-mcards{display:none;margin:0;padding:0;list-style:none}
.k-mcard{display:flex;flex-direction:column;gap:6px;padding:14px 16px;border-bottom:1px solid var(--border)}
.k-mcard .k-strong{font-weight:500}
.k-mcard .k-dim{color:var(--muted);font-size:13px}
.k-mcard__main{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.k-mcard__qty{font-weight:500}
.k-mcard__qty--in{color:var(--ok)}
.k-mcard__meta{margin:0;font-size:13px;color:var(--muted)}
/* The amount and its tag stay together; if the button does not fit beside
   them it drops to its own line whole, instead of anything being squeezed. */
.k-mcard__billing{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.k-mcard__amount{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.k-mcard__note{margin:0;font-size:14px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:1023.98px),(pointer:coarse){
  .k-scroll,.k-scroll__hint{display:none}
  .k-mcards{display:grid}
}
@media (min-width:720px){
  .k-mcards{grid-template-columns:1fr 1fr}
  .k-mcard:nth-child(odd){border-right:1px solid var(--border)}
}

/* ---------- Movimientos: folded filters on tablets and phones (spec 007, H10) ---------- */
.k-filters,.k-filter-chips{display:none}
.k-filters__toggle{list-style:none}
.k-filters__toggle::-webkit-details-marker{display:none}
.k-filters__panel{margin-top:10px;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:14px}
.k-filters__types{display:grid;grid-template-columns:repeat(3,1fr);width:100%}
.k-check{display:inline-flex;align-items:center;gap:10px;font-size:14px;cursor:pointer}
.k-check input{width:18px;height:18px;accent-color:var(--accent)}
.k-filter-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid var(--border);border-radius:20px;background:var(--surface2);color:var(--text);font-size:13px;font-weight:500;white-space:nowrap}
.k-filter-chip:hover{text-decoration:none;border-color:var(--accent);color:var(--text)}
@media (max-width:1023.98px){
  .k-toolbar--wide{display:none}
  .k-filters{display:block}
  .k-filter-chips{display:flex;flex-wrap:wrap;gap:8px}
}
@media (pointer:coarse){
  .k-check,.k-filter-chip{min-height:44px}
}
/* The related-movements filter (spec 009) has no control in the desktop
   toolbar, so its removable tag shows at every width. */
.k-filter-chips--always{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}

/* A movement's actions, the same in the table and in its card: "Corregir
   cobro", "Reversar", or why it cannot be reversed yet (spec 009). */
.k-actions{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.k-actions__hint{font-size:13px;color:var(--muted)}
/* A line under a quantity (spec 009): how much was reversed, in one line.
   In the history it is a link to the movement's chain. */
.k-reversed-note{display:block;font-size:13px;color:var(--muted)}
a.k-reversed-note{color:var(--accent)}
/* Two short data in one cell, one per line (the number over the date). */
.k-stack{display:block;white-space:nowrap}
/* In a table, a movement's buttons go one under the other. */
td .k-actions{flex-direction:column;align-items:flex-start}
/* An entrada's quantity in the history table, as in its card. */
.k-qty--in{color:var(--ok)}
/* The "Venta" column of the history (spec 010): the amount, "a $ X c/u"
   and the payment state, one per line, right-aligned like the numbers. */
/* Only the parts of a sale stack; a lone tag ("Sin precio") keeps its size. */
.k-sale__amount,.k-sale__unit,.k-sale__state{display:block}
.k-sale__amount{font-weight:700;color:var(--text);white-space:nowrap}
.k-sale__unit{font-size:13px;color:var(--muted);white-space:nowrap}
.k-sale__state{margin-top:4px;white-space:nowrap}
/* "Reversar" that cannot be used yet (a paid sale): visible, but plainly
   not a button to press; the note underneath says why. */
.k-btn--blocked,.k-btn--blocked:hover{border-style:dashed;opacity:.55;cursor:not-allowed;background:transparent}

/* ---------- Pagos: fixed column widths (spec 010) ---------- */
/* Same idea as Movimientos: each column keeps its width (Artículo takes
   the rest, at least 300px). The columns depend on the role and the tab
   (the admin's pick box and action; "Pago" outside Pendientes, where the
   note gets its width), so each combination (`k-sales--…`, on the box
   around the table) has its own minimum width: 867px of shared columns
   (N.º 104, Artículo 300, Cantidad 160, Precio 139, Monto 164) plus its
   own. "Ventas sin precio" uses the same classes, so both tables line up;
   its extra columns (`k-only-wide`) only show on desktop. */
.k-col--pick{width:44px}
.k-col--pqty{width:160px}
.k-col--price{width:139px}
.k-col--amount{width:164px}
.k-col--pay{width:120px}
.k-col--note-wide{width:210px}
.k-only-wide{display:none}
@media (min-width:1024px){
  th.k-only-wide,td.k-only-wide{display:table-cell}
  span.k-only-wide{display:block}
  .k-table--sales,.k-table--unpriced{table-layout:fixed}
  .k-table--sales th,.k-table--sales td,.k-table--unpriced th,.k-table--unpriced td{box-sizing:border-box}
  .k-sales--operario .k-table{min-width:1077px}
  .k-sales--operario-pay .k-table{min-width:1137px}
  .k-sales--admin .k-table{min-width:1241px}
  .k-sales--admin-pick .k-table{min-width:1285px}
  .k-sales--admin-pay .k-table{min-width:1301px}
  /* While it scrolls, N.º · Fecha stays put (after the pick box, if any). */
  .k-scroll--when-needed th:first-child,.k-scroll--when-needed td:first-child{position:sticky;left:0;z-index:1;background:var(--surface)}
  .k-scroll--when-needed th:first-child{background:var(--bg)}
  .k-sales--admin-pick th:nth-child(2),.k-sales--admin-pick td:nth-child(2){position:sticky;left:44px;z-index:1;background:var(--surface)}
  .k-sales--admin-pick th:nth-child(2){background:var(--bg)}
}
/* Scroll sideways only while the window is narrower than the table needs
   (its minimum width + 42px of page margins and card border). Above that
   the box is not a scroll box, so the header of the table stays fixed while
   the page scrolls (it cannot inside one). Keep these in step with the
   minimum widths above. */
@media (min-width:1024px) and (max-width:1118.98px){
  .k-sales--operario{overflow-x:auto}
  .k-card--sticky-head .k-sales--operario .k-table thead th{top:auto}
}
@media (min-width:1024px) and (max-width:1178.98px){
  .k-sales--operario-pay{overflow-x:auto}
  .k-card--sticky-head .k-sales--operario-pay .k-table thead th{top:auto}
}
@media (min-width:1024px) and (max-width:1282.98px){
  .k-sales--admin{overflow-x:auto}
  .k-card--sticky-head .k-sales--admin .k-table thead th{top:auto}
}
@media (min-width:1024px) and (max-width:1326.98px){
  .k-sales--admin-pick{overflow-x:auto}
  .k-card--sticky-head .k-sales--admin-pick .k-table thead th{top:auto}
}
@media (min-width:1024px) and (max-width:1342.98px){
  .k-sales--admin-pay{overflow-x:auto}
  .k-card--sticky-head .k-sales--admin-pay .k-table thead th{top:auto}
}
/* The counters stop growing: on a wide page they would stretch across it. */
@media (min-width:1024px){
  .k-kpis--compact{grid-template-columns:repeat(auto-fill,minmax(200px,280px))}
}
/* On a phone, the Inicio's three counters share one row: figure on top,
   words below, in two lines at most (spec 010). */
@media (max-width:479.98px){
  .k-kpis--home{grid-template-columns:repeat(3,1fr);gap:8px}
  .k-kpis--home .k-kpi{padding:12px 10px}
  .k-kpis--home .k-kpi__value{font-size:26px}
  .k-kpis--home .k-kpi__label{font-size:12px;margin-top:4px}
}
/* On a phone, Pagos' counters take two rows instead of three: the total
   across, the two counts side by side, each figure beside its words. */
@media (max-width:479.98px){
  .k-kpis--pay{grid-template-columns:1fr 1fr;gap:10px}
  .k-kpis--pay .k-kpi{padding:12px 14px}
  .k-kpis--pay .k-kpi:first-child,.k-kpis--pay .k-kpi:nth-child(2):last-child{grid-column:1 / -1}
  .k-kpis--pay .k-kpi + .k-kpi{flex-direction:row;align-items:baseline;gap:8px}
  .k-kpis--pay .k-kpi + .k-kpi .k-kpi__value{font-size:24px}
  .k-kpis--pay .k-kpi + .k-kpi .k-kpi__label{margin-top:0}
}

/* ---------- Pagos: touch selection and fixed pay bar (spec 007, H3) ---------- */
/* A money KPI shrinks its figure to fit its own card, not the screen: the
   widest screens (tablets, three KPIs a row) have the narrowest cards. The
   plain 36px first is the fallback for browsers without container units. */
.k-kpi{container-type:inline-size}
.k-kpi__value--money{font-size:36px;font-size:clamp(20px,10cqi,36px);white-space:nowrap}
.k-payform{display:flex;flex-direction:column;gap:16px}
.k-paydate{max-width:220px}
/* The label around a checkbox is its touch area; the box itself stays small. */
.k-pick{display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer}
.k-pick input{width:18px;height:18px;margin:0;accent-color:var(--accent);cursor:pointer}
[data-select-row]{cursor:pointer}
.k-pcards{display:none;margin:0;padding:0;list-style:none}
.k-pcard{display:flex;flex-direction:column;gap:6px;padding:14px 16px;border-bottom:1px solid var(--border)}
.k-pcard:last-child{border-bottom:none}
.k-pcard .k-strong{font-weight:500}
.k-pcard__main{display:flex;align-items:center;gap:10px}
/* Spec 010: the amount on a line of its own, under the name, with the state
   (outside Pendientes) on the right; the state drops below if it does not
   fit beside it, rather than squeezing the amount. */
.k-pcard__money{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px}
.k-pcard__state{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);white-space:nowrap}
.k-pcard__meta{margin:0;font-size:13px;color:var(--muted)}
.k-pcard__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px}
.k-pcard__note{margin:0;font-size:14px;color:var(--muted)}
.k-paybar{display:flex;flex-wrap:wrap;gap:12px 16px;align-items:center;justify-content:space-between;padding:14px 20px;background:var(--surface);border:1px solid var(--border);border-radius:14px}
.k-paybar__sum{min-width:0}
.k-paybar .k-dim{color:var(--muted);font-size:13px}
#selected-total{white-space:nowrap}
.k-paybar__all{display:none;font-size:14px}
/* Below 1024px, not 720: with 8-9 columns Pagos does not fit as a table on
   a tablet (measured on captures, task 9). The bar follows the cards. */
@media (max-width:1023.98px){
  .k-table--sales{display:none}
  .k-pcards{display:block}
  /* Always in view while the sales scroll; clear of the phone's gesture bar. */
  .k-paybar{position:sticky;bottom:0;z-index:20;flex-wrap:nowrap;gap:10px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));border-radius:14px 14px 0 0;box-shadow:0 -6px 20px rgba(0,0,0,.25)}
  /* Compact middle block (seen on a 412px-wide phone: it wrapped to four
     lines). The "Seleccionado" caption stays for screen readers only; the
     total never wraps and shrinks a little to fit, and the count goes
     underneath: two lines at most. */
  .k-paybar__sum{flex:1;container-type:inline-size;line-height:1.3}
  .k-paybar__sum .k-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  #selected-total{font-size:15px;font-size:clamp(12px,10cqi,15px)}
  #selected-count{display:block;font-size:12px;white-space:nowrap}
  .k-paybar__all{display:inline-flex}
}
@media (pointer:coarse){
  .k-pick{min-width:44px;min-height:44px}
}

/* ---------- Desktop paging and sticky headers (spec 007, H9-05/06) ---------- */
/* The line above a list: the summary on the left and, on desktop, compact
   paging on the right. Plain small links, not buttons, so the line keeps
   the height it had with the summary alone. */
.k-pager__top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 16px}
.k-pager__compact{display:none;align-items:center;gap:12px;font-size:13px}
.k-pager__link{color:var(--accent);font-weight:500}
.k-pager__link.is-disabled{color:var(--muted);opacity:0.6;pointer-events:none}
/* From 720px, touch screens too (spec 010, H9): tablets have room for it.
   Not on phones, also in landscape (low screens): no room there. On touch
   the links get the 44px target of the controls below. */
@media (min-width:720px) and (min-height:500px){
  .k-pager__compact{display:flex}
}
@media (pointer:coarse){
  .k-pager__link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px}
}
/* Column headers stay under the app header while the page scrolls. The card
   must stop being a scroll container for that: overflow-x:auto makes it one
   (and turns overflow-y into auto too), and a sticky cell inside it cannot
   stick to the page. `clip` still clips the rounded corners without that
   effect; a browser without `clip` keeps `auto` and simply no sticky header.
   Trade-off: a table wider than its card would be cut with no sign of it;
   at 1024px and up these tables fit (checked on captures, task 9), and
   the wide ones (Movimientos, Pagos) scroll inside a box of their own. */
@media (min-width:1024px) and (min-height:500px){
  .k-card--sticky-head{overflow-x:clip}
  .k-card--sticky-head .k-table thead th{position:sticky;top:56px;z-index:2;box-shadow:inset 0 -1px 0 var(--border)}
}
/* The card clips only sideways (overflow-x), and that does not follow its
   round corners: when the table is the first thing in the card, its header
   cells paint over them and the top border looks cut short (Pagos,
   Artículos, Usuarios; spec 010). The corner cells get the card's curve
   (14px minus the 1px border). */
.k-card--sticky-head > .k-table:first-child thead th:first-child,
.k-card--sticky-head > [data-scroll-box] .k-table thead th:first-child{border-top-left-radius:13px}
.k-card--sticky-head > .k-table:first-child thead th:last-child,
.k-card--sticky-head > [data-scroll-box] .k-table thead th:last-child{border-top-right-radius:13px}


/* ---------- Phones: more list, less heading (spec 007, H2-12) ---------- */
/* Below 720px a list page spent ~436px before its first row. The page's
   one-line description goes (the title says what the page is), the title
   shrinks so the main button fits beside it, and cards get a little less
   padding. */
@media (max-width:719.98px){
  .k-main{padding-top:18px;gap:16px}
  .k-page-head{align-items:center;gap:12px}
  .k-page-head > div > p:not(.k-eyebrow){display:none}
  .k-page-head h1{margin:2px 0 0;font-size:24px}
  .k-page-head .k-btn{padding:10px 14px}
  .k-mcard,.k-pcard{padding:12px 14px;gap:4px}
}

/* ---------- Show/hide password (spec 003, H6) ---------- */
/* The button sits inside the field, on the right; the field leaves room for
   it. Edge adds its own reveal button to password fields: hidden, so there
   are never two. */
.k-password{position:relative}
.k-password .k-input{padding-right:48px}
.k-password input::-ms-reveal,.k-password input::-ms-clear{display:none}
.k-password__toggle{position:absolute;top:50%;right:4px;transform:translateY(-50%);width:36px;height:36px;display:grid;place-items:center;border:none;border-radius:6px;background:none;cursor:pointer;font-size:16px;line-height:1;filter:grayscale(0.4);opacity:0.75}
.k-password__toggle:hover,.k-password__toggle[aria-pressed="true"]{opacity:1;filter:none;background:var(--surface2)}
@media (pointer:coarse){
  .k-password__toggle{width:44px;height:44px;right:2px}
  .k-password .k-input{padding-right:52px}
}
