/* =========================================================================
   Nova identidade HMP — Índigo / Ciano
   Sobrepõe app.css (carregado depois). Paleta + componentes de coleta.
   ========================================================================= */

/* 1) Paleta ------------------------------------------------------------- */
:root{
  --app-primary:#5cb98c;
  --app-primary-dark:#379469;
  --app-primary-light:#e6f6ee;
  --app-primary-lighter:#f3fbf7;
  --app-accent:#57c6d9;
  --app-accent-dark:#2c94a8;
  --app-accent-light:#e4f6fa;
  --app-accent-lighter:#f1fbfd;
  --app-bg:#eff5f2;
  --app-surface:#ffffff;
  --app-ink:#1e3a30;
  --app-muted:#5f7369;
  --app-border:#dde9e4;
  --app-success:#3fbf87;
  --app-success-light:#e6f8f0;
  --app-warning:#f0b450;
  --app-warning-light:#fdf3e0;
  --app-danger:#ef6b66;
  --app-danger-light:#fdeae9;
  --app-info:#4fb3e8;
  --app-info-light:#e6f4fc;
  --radius:16px;
  --radius-sm:12px;
  --radius-xs:8px;
  --shadow-sm:0 1px 2px rgba(30,58,48,.05);
  --shadow:0 14px 34px -16px rgba(30,58,48,.18);
  --shadow-lg:0 22px 50px -18px rgba(30,58,48,.26);
}

/* 2) Fundo, tipografia e navbar ---------------------------------------- */
body.app-shell{
  color:var(--app-ink);
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  background:
    radial-gradient(1200px 620px at 100% -12%, #eaf7f0, transparent 62%),
    radial-gradient(900px 540px at -10% 0%, #e6f7fb, transparent 55%),
    var(--app-bg);
  background-attachment:fixed;
}

.app-navbar{
  background:linear-gradient(135deg,#2e8b62 0%,#5cb98c 60%,#57c6d9 100%) !important;
  box-shadow:0 2px 18px rgba(92,185,140,.22);
}
.app-navbar.is-scrolled{
  background:linear-gradient(135deg,rgba(46,139,98,.96),rgba(92,185,140,.96)) !important;
}
@media (max-width:991.98px){
  .app-navbar .navbar-collapse{
    background:linear-gradient(180deg,#2e8b62 0%,#1e6b4a 100%) !important;
  }
}
.app-navbar .navbar-brand{ color:#fff !important; }
.app-navbar .app-nav-link{ color:rgba(255,255,255,.88) !important; }
.app-navbar .app-nav-link:hover{ color:#fff !important; }
.app-navbar .app-nav-link.active{
  color:#fff !important;
  background:rgba(255,255,255,.16) !important;
}
.app-navbar .navbar-toggler{ border-color:rgba(255,255,255,.5); filter:invert(1); }

/* 3) Foco, seta do select, scrollbar, skeleton ------------------------- */
.form-control:focus,.form-select:focus{
  border-color:var(--app-primary);
  box-shadow:0 0 0 3px rgba(92,185,140,.15);
}
.btn-select:focus,.btn-select:hover{
  border-color:var(--app-primary);
  box-shadow:0 0 0 3px rgba(92,185,140,.15);
}
.dropdown-indicadores-busca:focus{
  border-color:var(--app-primary);
  box-shadow:0 0 0 2px rgba(92,185,140,.15);
}
select.form-select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%235cb98c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4 6 8 10 12 6'/%3E%3C/svg%3E");
}
*::-webkit-scrollbar-thumb{ background:#cbd5e1; border-radius:8px; }
*::-webkit-scrollbar-thumb:hover{ background:#94a3b8; }
.skeleton{
  background:linear-gradient(90deg,#e4e9f2 25%,#f0f4f8 50%,#e4e9f2 75%);
  background-size:200% 100%;
}
.table-empty svg{ color:#cbd5e1; }

/* 4) Componentes de coleta (censo) ------------------------------------- */
.capture-bar{
  display:flex; gap:18px; align-items:center; flex-wrap:wrap;
  padding:12px 16px; margin-bottom:14px;
  border:1px solid var(--app-border); border-radius:var(--radius);
  background:var(--app-surface); box-shadow:var(--shadow-sm);
}
.capture-bar__main{ display:flex; gap:22px; flex:1 1 auto; min-width:0; flex-wrap:wrap; align-items:center; }
.capture-bar__field{ display:flex; flex-direction:column; gap:3px; min-width:150px; }
.capture-bar__field > label{
  font-size:11px; font-weight:700; letter-spacing:.04em;
  text-transform:uppercase; color:var(--app-muted);
}
.capture-bar__captura{
  display:flex; flex-direction:column; gap:5px;
  align-items:flex-end; min-width:170px;
  padding-left:18px; border-left:1px solid var(--app-border);
}
.capture-bar__captura-label{
  font-size:11px; font-weight:700; letter-spacing:.04em;
  text-transform:uppercase; color:var(--app-muted);
}

.section{
  padding:13px 15px 15px; margin-bottom:12px;
  border:1px solid var(--app-border); border-radius:var(--radius);
  background:var(--app-surface); box-shadow:var(--shadow-sm);
}
.section__head{ display:flex; align-items:center; gap:8px; margin-bottom:10px; }
.section__dot{
  width:9px; height:9px; border-radius:50%;
  background:linear-gradient(135deg,var(--app-primary),var(--app-accent));
  box-shadow:0 0 0 3px rgba(92,185,140,.12);
}
.section__title{ margin:0; font-size:13px; font-weight:700; color:var(--app-ink); }
.section__hint{ margin-left:auto; font-size:11.5px; color:var(--app-muted); }

.field-grid{ display:grid; gap:10px; grid-template-columns:repeat(2, minmax(0,1fr)); }
.field{ display:flex; flex-direction:column; gap:5px; }
.field > label{ font-size:11.5px; font-weight:600; color:var(--app-muted); }
.field--emphasis{ grid-column:auto; }
.field--emphasis > label{ color:var(--app-primary-dark); font-weight:700; }

.input--number,
input.input--number{
  width:100%;
  text-align:center;
  font-size:15px; font-weight:700; color:var(--app-ink);
  padding:6px 9px;
  border:1px solid var(--app-border); border-radius:var(--radius-sm);
  background:#fbfcff;
  transition:border-color .15s, box-shadow .15s, background .15s;
  -moz-appearance:textfield;
}
.input--number::-webkit-outer-spin-button,
.input--number::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.input--number:focus{
  outline:none; background:#fff;
  border-color:var(--app-primary);
  box-shadow:0 0 0 3px rgba(92,185,140,.15);
}
.field--emphasis .input--number,
.input--number--emphasis{
  font-size:17px;
  background:linear-gradient(135deg,var(--app-primary-light),var(--app-accent-light));
  border-color:rgba(92,185,140,.25);
  color:var(--app-primary-dark);
}

.chip{
  display:inline-flex; align-items:center; gap:6px;
  padding:5px 11px; border-radius:999px;
  font-size:12px; font-weight:700; letter-spacing:.02em;
  border:1px solid var(--app-border); background:#fff; color:var(--app-muted);
}
.chip::before{ content:""; width:7px; height:7px; border-radius:50%; background:currentColor; }
.chip--ok{ color:var(--app-success); background:var(--app-success-light); border-color:rgba(63,191,135,.3); }
.chip--pending{ color:#b45309; background:var(--app-warning-light); border-color:rgba(245,158,11,.3); }

.progress{
  position:relative; height:8px; border-radius:999px;
  background:var(--app-border); overflow:hidden;
}
.progress__bar{
  position:absolute; inset:0 auto 0 0; height:100%;
  border-radius:999px; width:0;
  background:linear-gradient(90deg,var(--app-primary),var(--app-accent));
  transition:width .4s ease;
}

.btn--primary{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:11px 20px; border:none; border-radius:var(--radius-sm);
  font-weight:700; color:var(--app-ink); cursor:pointer;
  background:linear-gradient(135deg,var(--app-primary),var(--app-accent));
  box-shadow:0 10px 24px -10px rgba(92,185,140,.6);
  transition:transform .12s, box-shadow .12s;
}
.btn--primary:hover{ transform:translateY(-1px); box-shadow:0 16px 30px -12px rgba(92,185,140,.7); }
.btn--primary:active{ transform:translateY(0); }
.btn--ghost{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:11px 18px; border-radius:var(--radius-sm);
  font-weight:700; color:var(--app-primary-dark); cursor:pointer;
  background:#fff; border:1px solid var(--app-border);
  transition:border-color .12s, color .12s, background .12s;
}
.btn--ghost:hover{ border-color:var(--app-primary); background:var(--app-primary-lighter); }

/* Botão "Escolher arquivo": compacto e alinhado em altura com o botão Importar (.btn--primary) */
.btn--arquivo{
  padding:5px 10px; flex:0 0 auto;
  gap:6px; font-size:12.5px;
}
/* Campo que exibe o nome do arquivo selecionado (entre "Escolher" e "Importar") */
.arquivo-nome{
  display:inline-flex; align-items:center;
  padding:7px 10px; border:1px dashed var(--app-border);
  border-radius:var(--radius-sm); background:#fbfcff;
  color:var(--app-muted); font-size:12px; font-weight:500;
  min-width:130px; flex:1 1 auto;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}

/* Mesma altura para os três controles do formulário de importação LOS */
#los-import-form .btn--arquivo,
#los-import-form .arquivo-nome,
#los-import-form .btn--primary{
  height:36px; box-sizing:border-box;
}
#los-import-form .btn--arquivo,
#los-import-form .arquivo-nome{
  display:inline-flex; align-items:center;
  padding-top:0; padding-bottom:0;
}


/* Spinner puro (feedback de carregamento, ex.: upload) ------------------ */
.spinner{
  display:inline-block; width:16px; height:16px; flex-shrink:0;
  border:2px solid currentColor; border-top-color:transparent;
  border-radius:50%; animation:spinner-rotacao .7s linear infinite;
}
@keyframes spinner-rotacao{ to{ transform:rotate(360deg); } }

/* Botão em estado de carregamento: desabilitado, opaco e com cursor */
.btn--primary.is-loading,
.btn--ghost.is-loading{
  cursor:wait; opacity:.75; transform:none !important;
  box-shadow:none !important; pointer-events:none;
}

/* 5) Painel de captura (lista) ----------------------------------------- */
.board{
  display:grid; gap:20px; align-items:start;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
}
.setor-card{
  display:flex; flex-direction:column; gap:14px; min-width:0;
  padding:18px; border:1px solid var(--app-border);
  border-radius:var(--radius); background:var(--app-surface);
  box-shadow:var(--shadow-sm);
  transition:transform .12s, box-shadow .12s, border-color .12s;
}
.setor-card:hover{ transform:translateY(-2px); box-shadow:var(--shadow); border-color:rgba(92,185,140,.3); }
.setor-card__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.setor-card__name{ font-size:15px; font-weight:700; color:var(--app-ink); line-height:1.25; }
.setor-card__sigla{ font-size:12px; font-weight:700; color:var(--app-accent-dark); letter-spacing:.04em; }
.setor-card__stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.stat{ display:flex; flex-direction:column; gap:2px; padding:8px; border-radius:var(--radius-xs); background:#fbfcff; border:1px solid var(--app-border); }
.stat__num{ font-size:19px; font-weight:800; color:var(--app-ink); line-height:1; }
.stat__label{ font-size:10.5px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; color:var(--app-muted); }
.setor-card__actions{ display:flex; gap:10px; }
.setor-card__actions .btn--primary,
.setor-card__actions .btn--ghost{ flex:1; padding:9px 12px; font-size:13.5px; }

/* Lançamentos dentro de cada card do hub "Dados" */
.lancamentos{ display:flex; flex-direction:column; }
.lancamento{
  display:flex; align-items:center; gap:10px;
  padding:10px 0; border-top:1px solid var(--app-border);
}
.lancamento:first-child{ border-top:none; padding-top:2px; }
.lancamento__nome{ flex:1 1 auto; min-width:0; font-size:13.5px; font-weight:600; color:var(--app-ink); }
.lancamento__status{ flex:0 0 auto; }
.lancamento__acao{ flex:0 0 auto; }
.lancamento__acao .btn--primary,
.lancamento__acao .btn--ghost{ padding:7px 12px; font-size:12.5px; }
.lancamento--censo .lancamento__acao{
  display:flex; flex-direction:column; align-items:flex-end; gap:6px;
}

/* Bloco "Indicadores do setor" no hub "Dados" (catálogo dirigido por banco — Fase 1) */
.lancamento-indicadores{
  display:flex; flex-direction:column; gap:2px;
  border-top:1px solid var(--app-border); padding-top:12px; margin-top:4px;
}
.lancamento-indicadores .lancamento{ padding:8px 0; }
.lancamento--titulo .lancamento__nome{
  font-size:11.5px; font-weight:800; letter-spacing:.04em;
  text-transform:uppercase; color:var(--app-accent-dark);
}
.lancamento--indicador .lancamento__nome{ font-weight:500; }
.lancamento--acao-bloco{ display:flex; justify-content:flex-end; padding-top:10px; border-top:none; }
.lancamento--acao-bloco .btn--primary{ padding:7px 14px; font-size:12.5px; }

.reconcile{
  display:flex; align-items:center; gap:10px;
  padding:9px 12px; border-radius:var(--radius-xs);
  font-size:12.5px; font-weight:600;
  background:var(--app-primary-lighter);
  border:1px solid rgba(92,185,140,.2);
  color:var(--app-primary-dark);
}

/* Filtro de data do hub "Dados" (date picker flatpickr, padrão da aplicação) */
.filtro-data{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
}
.filtro-data__label{
  font-size:12.5px; font-weight:700; letter-spacing:.02em;
  color:var(--app-muted); text-transform:uppercase;
}
.filtro-data__campo{ display:flex; align-items:center; gap:8px; }
.filtro-data .form-control{
  width:auto; min-width:160px; padding:8px 12px;
  border-radius:var(--radius-xs); border:1px solid var(--app-border);
  background:var(--app-surface); color:var(--app-ink); font-size:14px;
}
.filtro-data .form-control:focus{
  outline:none; border-color:var(--app-accent);
  box-shadow:0 0 0 3px rgba(99,102,241,.15);
}
.filtro-data__btn{ padding:8px 16px; }
.filtro-data__hoje{ padding:8px 14px; }

/* Card de Censo Diário no hub "Dados" — exibe os dados sem abrir edição */
.lancamento--censo{ flex-direction:column; align-items:stretch; gap:8px; }
.lancamento__topo{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.lancamento__stats{
  grid-template-columns:repeat(4,1fr); gap:8px;
  padding:10px 0; border-top:1px solid var(--app-border);
  border-bottom:1px solid var(--app-border);
}
.lancamento__stats .stat{ padding:7px 8px; }
.lancamento__stats .stat__num{ font-size:17px; }

/* Detalhe completo do censo no card (todos os campos lançados) */
.censo-detalhe{
  display:flex; flex-direction:column; gap:8px;
  padding:10px 0; border-top:1px solid var(--app-border);
  border-bottom:1px solid var(--app-border);
}
.censo-detalhe__secao{ display:flex; flex-direction:column; gap:4px; }
.censo-detalhe__titulo{
  font-size:10.5px; font-weight:800; letter-spacing:.04em;
  text-transform:uppercase; color:var(--app-accent-dark);
}
.censo-detalhe__grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(78px,1fr)); gap:6px;
}
.censo-detalhe__grid .stat{ padding:6px 8px; }
.censo-detalhe__grid .stat__num{ font-size:15px; }

/* 6) Polimento global — consistência em toda a aplicação ----------------- */
.card, .form-panel, .table-panel, .filter-panel, .workflow-panel, .auth-card, .metric-card{
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}

/* Painel de filtros do dashboard com aparência de card */
.filter-panel{
  padding:18px 20px; border:1px solid var(--app-border);
  border-radius:var(--radius); background:var(--app-surface);
  box-shadow:var(--shadow-sm);
}

/* Cabeçalho de página com barra de accento */
.page-header h1, .dashboard-header h1{
  font-weight:800; letter-spacing:-.02em;
}
.page-header h1::after, .dashboard-header h1::after{
  content:""; display:block; width:54px; height:4px; margin-top:10px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--app-primary),var(--app-accent));
}

/* Tabelas: cabeçalho com leve tom índigo + hover suave */
.table-panel thead th{
  background:var(--app-primary-lighter);
  color:var(--app-primary-dark);
  border-bottom:2px solid rgba(92,185,140,.18);
}
.table-panel tbody tr:hover{ background:var(--app-primary-lighter); }

/* Breadcrumb atual em destaque */
.breadcrumb-custom .current{ color:var(--app-primary-dark); font-weight:700; }
.breadcrumb-custom .sep{ color:var(--app-muted); }

/* Botões: gradiente índigo→ciano (coerente com o censo) */
:root{ --bs-btn-hover-bg:#e6f6ee; }
.btn{
  transition:transform .12s ease, box-shadow .12s ease, background .12s ease, border-color .12s ease;
}
.btn-primary{
  background:linear-gradient(135deg,var(--app-primary),var(--app-accent));
  border-color:transparent; color:#fff;
}
.btn-primary:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 26px -12px rgba(92,185,140,.6);
  color:#fff;
}
.btn-outline-primary{
  color:var(--app-primary-dark); border-color:var(--app-primary-dark);
}
.btn-outline-primary:hover{
  background:var(--app-primary-dark); border-color:var(--app-primary-dark); color:#fff;
}

/* Card de autenticação (login / recuperar / redefinir) com barra de destaque */
.auth-card{
  border:1px solid var(--app-border);
  box-shadow:var(--shadow);
  overflow:hidden; position:relative;
}
.auth-card::before{
  content:""; position:absolute; top:0; left:0; right:0; height:5px;
  background:linear-gradient(90deg,var(--app-primary),var(--app-accent));
}
.auth-card h2{
  font-weight:800; letter-spacing:-.01em;
  background:linear-gradient(135deg,var(--app-primary-dark),var(--app-accent-dark));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.auth-card:hover{ transform:translateY(-2px); box-shadow:var(--shadow-lg); }
.auth-layout{ gap:40px; }

/* Estados vazios */
.table-empty{ padding:40px 20px; }
.table-empty svg{ color:var(--app-primary); opacity:.5; }
.table-empty p{ color:var(--app-muted); }

/* 7) Dashboard ----------------------------------------------------------- */
.dashboard-sub{ margin:6px 0 0; color:var(--app-muted); font-size:13px; }

.chart-card{
  padding:20px 22px 22px; border:1px solid var(--app-border);
  border-radius:var(--radius); background:var(--app-surface);
  box-shadow:var(--shadow-sm); position:relative; overflow:hidden;
}
.chart-card::before{
  content:""; position:absolute; top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg,var(--app-primary),var(--app-accent));
}
.chart-card__head{
  display:flex; align-items:flex-start; justify-content:space-between;
  gap:12px; margin-bottom:14px; flex-wrap:wrap;
}
.chart-card__title{ margin:0; font-size:16px; font-weight:700; color:var(--app-ink); }
.chart-card__sub{ font-size:12.5px; color:var(--app-muted); }
.chart-empty-msg{ text-align:center; padding:12px 0 0; margin:0; color:var(--app-muted); font-size:13.5px; }

/* 8) Páginas institucionais (Privacidade, Termos) ------------------------- */
.legal-page{
  max-width:800px; margin:0 auto; background:var(--app-surface);
  border:1px solid var(--app-border); border-radius:var(--radius);
  box-shadow:var(--shadow-sm); padding:28px 32px;
}
.legal-page h1{ font-size:1.6rem; font-weight:700; color:var(--app-ink); margin-bottom:2px; }
.legal-page h1 + p{ color:var(--app-muted); margin-bottom:18px; }
.legal-page h2{
  font-size:1.08rem; font-weight:600; color:var(--app-primary);
  margin:22px 0 8px; padding-left:12px; border-left:3px solid var(--app-accent);
}
.legal-page ul{ padding-left:1.25rem; }
.legal-page li{ margin-bottom:4px; }
.legal-page p{ color:var(--app-ink); }

/* Páginas de erro (403/404/500) ------------------------------------------- */
.error-page{
  max-width:560px; margin:56px auto; text-align:center;
  background:var(--app-surface); border:1px solid var(--app-border);
  border-radius:var(--radius); box-shadow:var(--shadow-sm); padding:48px 32px;
}
.error-page h1{
  font-size:4.5rem; font-weight:800; line-height:1; margin-bottom:8px;
  background:linear-gradient(90deg,var(--app-primary),var(--app-accent));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.error-page .lead{ color:var(--app-ink); font-weight:600; }
.error-page p{ color:var(--app-muted); }

/* Abas do Hub "Dados" (visualização completa do admin) ------------------- */
.setor-tabs{
  display:flex; flex-wrap:wrap; gap:2px;
  border-bottom:2px solid var(--app-border); margin:4px 0 2px;
}
.setor-tabs .nav-link{
  border:1px solid transparent; border-bottom:none;
  color:var(--app-muted); font-weight:600; font-size:13.5px;
  padding:9px 15px; border-radius:var(--radius-xs) var(--radius-xs) 0 0;
  background:#f6f8fc; margin-bottom:-2px; cursor:pointer;
  transition:background .12s, color .12s, box-shadow .12s;
}
.setor-tabs .nav-link:hover{
  color:var(--app-accent-dark); background:#eef3fb;
}
.setor-tabs .nav-link.active{
  color:var(--app-ink); background:var(--app-surface);
  border-color:var(--app-border); border-bottom-color:var(--app-surface);
  box-shadow:inset 0 3px 0 var(--app-accent);
}
.setor-tabs .nav-link:focus-visible{
  outline:2px solid var(--app-accent); outline-offset:2px;
}

/* Grade de Capacidade Instalada (28/09/2026) ---------------------------- */
.capac-grade{
  border:1px solid var(--app-border);
  border-radius:var(--radius);
  overflow:hidden;
}
.capac-grade thead th{
  background:#f2f5fb;
  font-size:11.5px; font-weight:700;
  letter-spacing:.04em;
  padding:8px 6px 6px;
  border-bottom:2px solid var(--app-border);
  vertical-align:bottom;
  position:relative;
}
.capac-grade tbody th{
  font-size:13px; font-weight:600; color:var(--app-ink);
  background:#fafbfe;
  border-right:1px solid var(--app-border);
}
.capac-grade tbody td{ padding:3px 4px; }
.capac-setor-col{ min-width:170px; }
.capac-mes-col{ min-width:58px; }
.capac-mes-nome{
  display:block; line-height:1.1; margin-bottom:2px;
  color:var(--app-ink);
}
/* Botão copiar do mês anterior — discreto, pequeno */
.btn-copiar-mes{
  border:1px solid var(--app-border);
  background:var(--app-surface);
  color:var(--app-muted);
  border-radius:6px;
  font-size:11px; line-height:1;
  padding:2px 5px;
  cursor:pointer;
  transition:color .12s, border-color .12s, background .12s;
}
.btn-copiar-mes:hover{
  color:var(--app-accent-dark);
  border-color:var(--app-accent);
  background:#eef3fb;
}
.btn-copiar-mes:focus-visible{
  outline:2px solid var(--app-accent); outline-offset:1px;
}
/* Inputs da grade — compactos e centralizados */
.capac-input{
  text-align:center;
  padding:3px 2px;
  font-size:13px;
  min-width:46px;
}
.capac-input:focus{
  box-shadow:0 0 0 .15rem rgba(91,92,230,.18);
  border-color:var(--app-accent);
}