/* NANDA V22.73.00 | tela: Almoxarifado | 2026-07-14
 * Direção: bancada operacional. Categorias funcionam como etiquetas de
 * prateleira; conteúdo privilegia leitura, estado e ação, sem alterar regras.
 */

body[data-active-page="estoque-epi"] #page-estoque {
  gap: 14px;
}

body[data-active-page="estoque-epi"] #page-estoque .almox-toolbar {
  position: sticky;
  top: 0;
  z-index: 18;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(250px, 360px);
  align-items: center;
  gap: 12px !important;
  margin-bottom: 2px !important;
  padding: 8px 10px !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--r) !important;
  background: var(--card) !important;
  box-shadow: inset 3px 0 0 var(--green), var(--sh);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

body[data-active-page="estoque-epi"] .almox-primary-tabs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  min-width: 0;
}

body[data-active-page="estoque-epi"] .almox-primary-tab {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: var(--ui-control-height);
  margin: 0;
  padding: 7px 12px;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--text2);
  font-size: var(--ui-font-control);
  font-weight: 600;
  line-height: 1.2;
}

body[data-active-page="estoque-epi"] .almox-primary-tab svg {
  width: 16px;
  height: 16px;
}

body[data-active-page="estoque-epi"] .almox-primary-tab:hover:not(.active) {
  border-color: var(--border);
  background: var(--bg2);
  color: var(--text);
}

body[data-active-page="estoque-epi"] .almox-primary-tab.active {
  border-color: var(--gbr);
  background: var(--gbg);
  color: var(--text);
  box-shadow: inset 0 -2px 0 var(--green);
}

body[data-active-page="estoque-epi"] #s-est.almox-search {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin-left: 0 !important;
  padding-inline: 12px;
}

body[data-active-page="estoque-epi"] .almox-secondary-tabs {
  display: flex !important;
  flex-wrap: wrap;
  gap: 6px !important;
  margin-bottom: 12px !important;
  padding: 5px;
  border: 1px solid var(--border);
  border-radius: var(--r);
  background: var(--bg2);
}

body[data-active-page="estoque-epi"] .almox-secondary-tabs .tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: var(--ui-control-height);
  margin: 0;
  padding: 7px 12px;
  border: 1px solid transparent;
  border-radius: 5px;
  color: var(--text2);
  font-size: var(--ui-font-control);
  line-height: 1.2;
}

body[data-active-page="estoque-epi"] .almox-secondary-tabs .tab.active {
  border-color: var(--border);
  background: var(--card);
  color: var(--text);
  box-shadow: var(--sh);
}

body[data-active-page="estoque-epi"] #page-estoque .card {
  border-color: var(--border);
  overflow: hidden;
}

body[data-active-page="estoque-epi"] #page-estoque .card-header {
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

body[data-active-page="estoque-epi"] #page-estoque .card-title {
  font-size: var(--ui-font-body) !important;
  font-weight: 700;
  letter-spacing: -.01em;
}

body[data-active-page="estoque-epi"] #page-estoque .card-sub {
  max-width: 68ch;
  margin-top: 3px;
  color: var(--text2);
  font-size: var(--ui-font-caption) !important;
}

body[data-active-page="estoque-epi"] .almox-card-actions {
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px !important;
  min-width: 0;
}

body[data-active-page="estoque-epi"] #page-estoque button {
  min-height: var(--ui-control-height);
  font-size: var(--ui-font-control) !important;
  line-height: 1.2;
}

body[data-active-page="estoque-epi"] #page-estoque input,
body[data-active-page="estoque-epi"] #page-estoque select,
body[data-active-page="estoque-epi"] #page-estoque textarea {
  min-height: var(--ui-control-height);
  font-size: var(--ui-font-control) !important;
}

body[data-active-page="estoque-epi"] #page-estoque .tw {
  overflow-x: auto;
  scrollbar-gutter: stable;
  overscroll-behavior-inline: contain;
}

body[data-active-page="estoque-epi"] #page-estoque .tw table {
  min-width: 720px;
  font-size: var(--ui-font-body) !important;
}

body[data-active-page="estoque-epi"] #page-estoque th {
  padding: var(--ui-row-pad-y) 12px !important;
  font-size: var(--ui-font-caption) !important;
  line-height: 1.25;
}

body[data-active-page="estoque-epi"] #page-estoque td {
  padding: var(--ui-row-pad-y) 12px;
  font-size: var(--ui-font-body) !important;
  line-height: 1.45;
  vertical-align: middle;
}

body[data-active-page="estoque-epi"] #page-estoque td > div:first-child {
  font-size: var(--ui-font-body) !important;
}

body[data-active-page="estoque-epi"] #page-estoque td > div + div {
  font-size: var(--ui-font-caption) !important;
}

body[data-active-page="estoque-epi"] #page-estoque td span[style*="border-radius"] {
  font-size: var(--ui-font-micro) !important;
  line-height: 1.35;
}

/* Mapeia os tamanhos inline legados para a escala real sem tocar na lógica. */
body[data-active-page="estoque-epi"] #page-estoque [style*="font-size:8px"],
body[data-active-page="estoque-epi"] #page-estoque [style*="font-size:8.5px"],
body[data-active-page="estoque-epi"] #page-estoque [style*="font-size:9px"],
body[data-active-page="estoque-epi"] #page-estoque [style*="font-size:9.5px"],
body[data-active-page="estoque-epi"] #page-estoque [style*="font-size:10px"] {
  font-size: var(--ui-font-micro) !important;
}

body[data-active-page="estoque-epi"] #page-estoque [style*="font-size:10.5px"],
body[data-active-page="estoque-epi"] #page-estoque [style*="font-size:11px"] {
  font-size: var(--ui-font-caption) !important;
}

body[data-active-page="estoque-epi"] #page-estoque [style*="font-size:11.5px"],
body[data-active-page="estoque-epi"] #page-estoque [style*="font-size:12px"],
body[data-active-page="estoque-epi"] #page-estoque [style*="font-size:12.5px"] {
  font-size: var(--ui-font-body) !important;
}

/* Os dois formulários próprios de EPI são anexados direto ao body. */
body[data-active-page="estoque-epi"] :is(#modal-cat-epi, #modal-entrega-lote) > div {
  width: min(620px, calc(100vw - 32px)) !important;
  padding: calc(var(--ui-card-pad-y) + 6px) calc(var(--ui-card-pad-x) + 6px) !important;
  font-size: var(--ui-font-body);
}

body[data-active-page="estoque-epi"] :is(#modal-cat-epi, #modal-entrega-lote) > div > div:first-child {
  font-size: var(--ui-font-title) !important;
  line-height: 1.25;
}

body[data-active-page="estoque-epi"] :is(#modal-cat-epi, #modal-entrega-lote) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea, button) {
  min-height: var(--ui-control-height);
  font-size: var(--ui-font-control) !important;
}

body[data-active-page="estoque-epi"] :is(#modal-cat-epi, #modal-entrega-lote) label {
  font-size: var(--ui-font-caption) !important;
  line-height: 1.35;
}

body[data-active-page="estoque-epi"] :is(#modal-cat-epi, #modal-entrega-lote, .modal-overlay) [style*="font-size:9px"],
body[data-active-page="estoque-epi"] :is(#modal-cat-epi, #modal-entrega-lote, .modal-overlay) [style*="font-size:9.5px"],
body[data-active-page="estoque-epi"] :is(#modal-cat-epi, #modal-entrega-lote, .modal-overlay) [style*="font-size:10px"] {
  font-size: var(--ui-font-micro) !important;
}

body[data-active-page="estoque-epi"] :is(#modal-cat-epi, #modal-entrega-lote, .modal-overlay) [style*="font-size:10.5px"],
body[data-active-page="estoque-epi"] :is(#modal-cat-epi, #modal-entrega-lote, .modal-overlay) [style*="font-size:11px"],
body[data-active-page="estoque-epi"] :is(#modal-cat-epi, #modal-entrega-lote, .modal-overlay) [style*="font-size:12px"] {
  font-size: var(--ui-font-caption) !important;
}

body[data-active-page="estoque-epi"] :is(#modal-cat-epi, #modal-entrega-lote, .modal-overlay) [style*="font-size:11.5px"],
body[data-active-page="estoque-epi"] :is(#modal-cat-epi, #modal-entrega-lote, .modal-overlay) [style*="font-size:12.5px"],
body[data-active-page="estoque-epi"] :is(#modal-cat-epi, #modal-entrega-lote, .modal-overlay) [style*="font-size:13px"],
body[data-active-page="estoque-epi"] :is(#modal-cat-epi, #modal-entrega-lote, .modal-overlay) [style*="font-size:14px"] {
  font-size: var(--ui-font-body) !important;
}

/* No Glass, --gd foi desenhado para fundos claros; usa o verde luminoso. */
html:not(.theme-light) body[data-active-page="estoque-epi"] #page-estoque [style*="color:var(--gd)"],
html:not(.theme-light) body[data-active-page="estoque-epi"] :is(#modal-cat-epi, #modal-entrega-lote, .modal-overlay) [style*="color:var(--gd)"] {
  color: var(--green) !important;
}

body[data-active-page="estoque-epi"] #epi-kpi-bar {
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)) !important;
  gap: var(--ui-gap) !important;
  margin-bottom: 14px !important;
}

body[data-active-page="estoque-epi"] #epi-kpi-bar .kpi-card {
  min-height: 96px;
  padding: var(--ui-card-pad-y) var(--ui-card-pad-x);
}

body[data-active-page="estoque-epi"] #epi-kpi-bar .kpi-label {
  font-size: var(--ui-font-caption) !important;
}

body[data-active-page="estoque-epi"] #epi-kpi-bar .kpi-value {
  font-size: var(--ui-font-kpi) !important;
}

body[data-active-page="estoque-epi"] #epi-kpi-bar .kpi-sub {
  font-size: var(--ui-font-caption) !important;
}

body[data-active-page="estoque-epi"] #epi-cat-rows,
body[data-active-page="estoque-epi"] #colab-lista,
body[data-active-page="estoque-epi"] #entregas-epi-lista {
  min-width: 0;
}

html[data-ui-size="large"] body[data-active-page="estoque-epi"] #page-estoque .tw table {
  min-width: 820px;
}

html.theme-light body[data-active-page="estoque-epi"] #page-estoque .almox-toolbar {
  box-shadow: inset 3px 0 0 var(--green), 0 3px 12px rgba(15, 23, 42, .08);
}

@media (max-width: 1200px) {
  body[data-active-page="estoque-epi"] #page-estoque .almox-toolbar {
    grid-template-columns: 1fr;
  }

  body[data-active-page="estoque-epi"] #s-est.almox-search {
    max-width: 100% !important;
  }

  body[data-active-page="estoque-epi"] .almox-card-actions {
    width: 100%;
    justify-content: flex-start;
  }
}

@media (max-width: 1100px) {
  body[data-active-page="estoque-epi"] #epi-kpi-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body[data-active-page="estoque-epi"] #page-estoque .card-header > div:first-child {
    min-width: 0;
  }
}

@media (max-width: 900px) {
  body[data-active-page="estoque-epi"] #page-estoque .almox-toolbar {
    position: static;
  }
}

@media (prefers-reduced-motion: reduce) {
  body[data-active-page="estoque-epi"] .almox-primary-tab,
  body[data-active-page="estoque-epi"] .almox-secondary-tabs .tab {
    transition: none;
  }
}

/* ── V22.98 — Quantidade editável direto na linha do estoque ──────────────
   Sem as setinhas do input number (o Rafael pediu: "deixa clicável apenas").
   Continua sendo type=number para abrir teclado numérico no celular.        */
.qtd-inline{
  -moz-appearance:textfield; appearance:textfield;
  width:74px; padding:4px 8px; text-align:center;
  font-weight:700; font-size:14px; font-family:var(--mono);
  background:var(--card); border:1px solid var(--border); border-radius:6px;
  cursor:pointer; transition:border-color .15s, box-shadow .15s;
}
.qtd-inline::-webkit-outer-spin-button,
.qtd-inline::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0 }
.qtd-inline:hover{ border-color:var(--bd) }
.qtd-inline:focus{ outline:none; cursor:text; border-color:var(--gd); box-shadow:0 0 0 3px rgba(45,106,79,.20) }
.qtd-inline.salvo{ border-color:var(--gd); box-shadow:0 0 0 3px rgba(45,106,79,.28) }