/* ==========================================================================
   AgroControl — Painel administrativo
   Mesma linguagem visual do ClinPlus/AgriFlex: barra utilitária no topo,
   barra de módulos com mega-menu e sidebar contextual do módulo ativo.
   ========================================================================== */

:root{
  /* Paleta do AgriFlex — verde de ação, barra de módulos verde escuro. */
  --ac-primary:#1f9d4c;
  --ac-deep:#0f6b33;
  --ac-light:#5fe08c;
  --ac-soft:#e3f6ea;
  --ac-tint:#f1faf4;

  --ac-utilbar-h:58px;
  --ac-appbar-h:44px;

  --ac-menubar-bg:#0c2415;
  --ac-menubar-fg:#b9d0c1;
  --ac-menubar-border:#1d3b28;
  --ac-menubar-hover:#14331f;
  --ac-menubar-ativo:#133a22;

  --ac-tinta:#16211b;
  --ac-texto:#33443a;
  --ac-suave:#66776d;
  --ac-faint:#8a9a90;
  --ac-linha:#e3e9e5;
  --ac-linha-2:#eef2ef;
  --ac-fundo:#f3f6f4;
  --ac-card:#fff;

  --ac-raio:12px;
  --ac-sombra:0 1px 2px rgba(15,23,42,.04), 0 6px 20px rgba(15,23,42,.06);
  --ac-transicao:.16s cubic-bezier(.4,0,.2,1);
}

[data-bs-theme="dark"]{
  --ac-menubar-bg:#081810;
  --ac-menubar-border:#1632202;
  --ac-menubar-hover:#123020;
  --ac-menubar-ativo:#113420;
  --ac-tinta:#e6efe9;
  --ac-texto:#c3d3c8;
  --ac-suave:#8fa596;
  --ac-faint:#78897f;
  --ac-linha:#22332a;
  --ac-linha-2:#1b2a21;
  --ac-fundo:#0d1811;
  --ac-card:#12201a;
  --ac-soft:#173424;
  --ac-tint:#122019;
}

*,*::before,*::after{box-sizing:border-box}

body.ac-body{
  margin:0;font-family:'Inter',system-ui,-apple-system,sans-serif;font-size:15px;
  background:var(--ac-fundo);color:var(--ac-texto);-webkit-font-smoothing:antialiased;
}
body.ac-body a{color:inherit;text-decoration:none}
/* Só links "de texto" (sem classe) ganham a cor da marca — se pintássemos
   todo <a>, a regra venceria .btn-ac por especificidade e o texto do botão
   sumiria (verde sobre verde). */
body.ac-body a:not([class]){color:var(--ac-primary)}
body.ac-body a:not([class]):hover{text-decoration:underline}
body.ac-body h1,body.ac-body h2,body.ac-body h3,body.ac-body h4{color:var(--ac-tinta);font-weight:700;letter-spacing:-.02em;margin:0}

.ac-app{display:flex;flex-direction:column;min-height:100vh}

/* ══════════════════════════ barra utilitária ═══════════════════════════ */
.ac-utilbar{
  position:sticky;top:0;z-index:1036;display:flex;align-items:center;gap:14px;
  height:var(--ac-utilbar-h);padding:0 16px;
  background:var(--ac-card);border-bottom:1px solid var(--ac-linha);
}
.ac-utilbar__brand{display:inline-flex;align-items:center;flex:none}
.ac-utilbar__brand img{max-height:30px;width:auto;display:block}
.ac-utilbar__brand .ac-logo-dark{display:none}
[data-bs-theme="dark"] .ac-utilbar__brand .ac-logo-light{display:none}
[data-bs-theme="dark"] .ac-utilbar__brand .ac-logo-dark{display:block}

.ac-topsearch{flex:1;max-width:440px;margin:0}
.ac-topsearch__input{
  width:100%;border:1px solid var(--ac-linha);border-radius:9px;padding:7px 13px;
  font-size:13.5px;background:var(--ac-fundo);color:var(--ac-texto);
}
.ac-topsearch__input:focus{outline:0;border-color:var(--ac-primary);background:var(--ac-card)}

.ac-utilbar__dir{margin-left:auto;display:flex;align-items:center;gap:12px}
.ac-data{font-size:12.5px;color:var(--ac-suave);white-space:nowrap}
.ac-icone-btn{
  background:none;border:0;color:var(--ac-suave);font-size:17px;line-height:1;padding:6px;
  border-radius:7px;transition:var(--ac-transicao);
}
.ac-icone-btn:hover{background:var(--ac-fundo);color:var(--ac-primary)}

.ac-usuario{display:flex;align-items:center;gap:9px;color:inherit}
.ac-avatar{
  width:32px;height:32px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--ac-primary);color:#fff;font-weight:700;font-size:13px;
}
.ac-usuario__txt strong{display:block;font-size:13px;color:var(--ac-tinta);line-height:1.25;font-weight:600}
.ac-usuario__txt span{font-size:11.5px;color:var(--ac-suave)}

/* ═══════════════════════════ barra de módulos ══════════════════════════ */
.ac-appbar{
  position:sticky;top:var(--ac-utilbar-h);z-index:1034;display:flex;align-items:center;gap:6px;
  height:var(--ac-appbar-h);padding:0 12px;
  background:var(--ac-menubar-bg);color:var(--ac-menubar-fg);
}
.ac-appbar__burger{display:none;border:0;background:transparent;color:var(--ac-menubar-fg);font-size:19px;padding:4px 8px}
/* nowrap + botão "Mais": o que estoura vai para o dropdown. overflow visível
   para o mega-menu dos itens que cabem não ser recortado. */
.ac-appbar__mods{display:flex;align-items:stretch;flex-wrap:nowrap;gap:1px;min-width:0;flex:1}

.ac-mod{position:relative;flex:none}
.ac-mod--mais{display:none}
.ac-mod--mais .ac-mod__panel{right:0;left:auto;max-height:72vh;overflow-y:auto}

.ac-mod__btn{
  display:inline-flex;align-items:center;gap:7px;height:var(--ac-appbar-h);padding:0 13px;
  color:var(--ac-menubar-fg);font-size:13.5px;font-weight:600;white-space:nowrap;
  border:0;background:transparent;cursor:pointer;border-bottom:3px solid transparent;
  transition:color var(--ac-transicao),background var(--ac-transicao);
}
.ac-mod__btn i:first-child{color:#7fb192;font-size:15px}
.ac-mod__btn:hover,.ac-mod:focus-within > .ac-mod__btn{color:#fff;background:var(--ac-menubar-hover)}
.ac-mod__btn:hover i:first-child{color:var(--ac-light)}
.ac-mod.is-active > .ac-mod__btn{color:#fff;border-bottom-color:var(--ac-light);background:var(--ac-menubar-ativo)}
.ac-mod.is-active > .ac-mod__btn i:first-child{color:var(--ac-light)}
.ac-mod__btn .bi-chevron-down{font-size:9px;opacity:.6;color:inherit}

.ac-mod__panel{
  position:absolute;top:100%;left:0;min-width:300px;z-index:1200;display:none;padding:10px;
  background:var(--ac-card);border:1px solid var(--ac-linha);border-radius:0 0 14px 14px;
  box-shadow:0 22px 48px -18px rgba(8,36,21,.35);
}
.ac-mod:hover > .ac-mod__panel,.ac-mod:focus-within > .ac-mod__panel{display:block}
/* Módulo com muitos itens abre em duas colunas, como no AgriFlex. */
.ac-mod:hover > .ac-mod__panel--2,.ac-mod:focus-within > .ac-mod__panel--2{display:grid}
.ac-mod__panel--2{grid-template-columns:repeat(2,minmax(250px,1fr));gap:2px 6px}
.ac-mod__panel--2 .ac-mod__tit{grid-column:1/-1}
.ac-mod__tit{
  font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ac-faint);padding:4px 10px 8px;
}

/* item de navegação — o MESMO no mega menu, na sidebar e na gaveta */
.ac-nav__i{
  display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:9px;
  color:var(--ac-texto);font-size:13.5px;min-width:0;transition:var(--ac-transicao);
}
.ac-nav__i:hover{background:var(--ac-tint);color:var(--ac-deep)}
.ac-nav__ico{
  width:30px;height:30px;border-radius:8px;flex:none;display:grid;place-items:center;
  background:var(--ac-soft);color:var(--ac-deep);font-size:15px;
}
.ac-nav__txt{display:flex;flex-direction:column;min-width:0}
.ac-nav__txt b{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ac-nav__txt small{font-size:11.5px;color:var(--ac-suave);line-height:1.3}
.ac-nav__i.on{background:var(--ac-soft);color:var(--ac-deep)}
.ac-nav__i.on .ac-nav__ico{background:var(--ac-primary);color:#fff}
.ac-nav__i.breve{color:var(--ac-suave);cursor:default}
.ac-nav__i.breve:hover{background:none}
.ac-nav__i.breve .ac-nav__ico{background:var(--ac-linha-2);color:var(--ac-faint)}
.ac-nav__tag{
  margin-left:auto;font-style:normal;font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;
  background:var(--ac-linha-2);color:var(--ac-faint);padding:2px 6px;border-radius:4px;flex:none;
}
.ac-mod__grupo{
  font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--ac-suave);
  font-weight:700;padding:9px 10px 4px;
}

/* ════════════════════════ corpo: sidebar + conteúdo ════════════════════ */
.ac-app-body{display:flex;flex:1;min-height:0;align-items:flex-start}

.ac-modnav{
  width:236px;flex:none;background:var(--ac-card);border-right:1px solid var(--ac-linha);
  position:sticky;top:calc(var(--ac-utilbar-h) + var(--ac-appbar-h));align-self:stretch;
  height:calc(100vh - var(--ac-utilbar-h) - var(--ac-appbar-h));overflow-y:auto;
  padding:8px 10px;display:flex;flex-direction:column;gap:1px;
}
.ac-modnav__head{
  font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ac-deep);padding:10px 8px 8px;display:flex;align-items:center;gap:7px;
}
.ac-modnav .ac-nav__i{padding:6px 8px}
.ac-modnav .ac-nav__ico{width:26px;height:26px;background:transparent;font-size:14px}
.ac-modnav .ac-nav__i.on .ac-nav__ico{background:var(--ac-primary);color:#fff}
.ac-modnav__foot{
  margin-top:auto;padding:12px 8px 4px;font-size:11.5px;color:var(--ac-faint);
  display:flex;align-items:center;gap:8px;
}
.ac-modnav__foot i{width:8px;height:8px;border-radius:50%;background:#34d399;flex:none}
.ac-modnav__backdrop{display:none}

.ac-content{flex:1;min-width:0;padding:22px 26px 40px}

/* cabeçalho da página */
.ac-page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:20px;flex-wrap:wrap}
.ac-page-head h1{font-size:23px}
.ac-page-head p{margin:4px 0 0;font-size:13.5px;color:var(--ac-suave)}
.ac-page-head__acao{display:flex;gap:9px;flex-wrap:wrap}

/* ═════════════════════════════════ abas ═══════════════════════════════ */
/* Preferimos abas a cards espalhados: a tela fica com um assunto por vez. */
.ac-abas{display:flex;gap:2px;border-bottom:1px solid var(--ac-linha);margin-bottom:18px;overflow-x:auto}
.ac-abas a,.ac-abas button{
  display:inline-flex;align-items:center;gap:7px;padding:10px 15px;white-space:nowrap;
  font-size:13.8px;font-weight:500;color:var(--ac-suave);background:none;border:0;
  border-bottom:2px solid transparent;transition:var(--ac-transicao);cursor:pointer;
}
.ac-abas a:hover,.ac-abas button:hover{color:var(--ac-primary)}
.ac-abas a.active,.ac-abas button.active{color:var(--ac-deep);border-bottom-color:var(--ac-primary);font-weight:700}
.ac-abas .conta{
  background:var(--ac-fundo);color:var(--ac-suave);font-size:11px;font-weight:700;
  padding:1px 7px;border-radius:20px;
}
.ac-aba-painel{display:none}
.ac-aba-painel.active{display:block}

/* ════════════════════════════════ cards ═══════════════════════════════ */
.ac-card{background:var(--ac-card);border:1px solid var(--ac-linha);border-radius:var(--ac-raio);box-shadow:var(--ac-sombra)}
.ac-card + .ac-card{margin-top:16px}
/* Tabela larga rola dentro do card em QUALQUER largura. Limitar isso ao
   celular fazia a última coluna (quase sempre os botões de ação) ser cortada
   em telas médias, sem jeito de alcançar. */
.ac-card--tabela{overflow-x:auto}
.ac-card__topo{
  padding:14px 20px;border-bottom:1px solid var(--ac-linha);
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
}
.ac-card__topo h2{font-size:14.5px}
.ac-card__corpo{padding:20px}

.ac-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;margin-bottom:20px}
.ac-kpi{background:var(--ac-card);border:1px solid var(--ac-linha);border-radius:var(--ac-raio);padding:18px;box-shadow:var(--ac-sombra)}
.ac-kpi__icone{
  width:38px;height:38px;border-radius:10px;display:grid;place-items:center;font-size:18px;margin-bottom:12px;
  background:var(--ac-soft);color:var(--ac-deep);
}
.ac-kpi strong{display:block;font-size:26px;color:var(--ac-tinta);letter-spacing:-.03em;line-height:1}
.ac-kpi span{display:block;margin-top:5px;font-size:12.5px;color:var(--ac-suave)}

/* ═══════════════════════════════ tabelas ══════════════════════════════ */
.ac-card--tabela{overflow:hidden}
.ac-tabela{width:100%;border-collapse:collapse;font-size:13.8px}
.ac-tabela th{
  text-align:left;padding:11px 20px;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--ac-suave);font-weight:700;border-bottom:1px solid var(--ac-linha);background:var(--ac-fundo);
}
.ac-tabela td{padding:12px 20px;border-bottom:1px solid var(--ac-linha);vertical-align:middle}
.ac-tabela tr:last-child td{border-bottom:0}
.ac-tabela tbody tr:hover{background:var(--ac-fundo)}
.ac-tabela .principal{font-weight:600;color:var(--ac-tinta)}
.ac-tabela .sub{font-size:12.5px;color:var(--ac-suave)}

.ac-chip{display:inline-block;font-size:10.5px;font-weight:700;letter-spacing:.03em;padding:4px 9px;border-radius:20px;white-space:nowrap}
.ac-chip--ok{background:#dcfce7;color:#15803d}
.ac-chip--trial{background:#dbeafe;color:#1d4ed8}
.ac-chip--alerta{background:#fef3c7;color:#a16207}
.ac-chip--off{background:#eef1f5;color:#64748b}
.ac-chip--erro{background:#fee2e2;color:#b91c1c}

/* Selo de integridade (auditoria): ícone grande com a cor do estado. */
.ac-selo{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:21px;flex:0 0 auto}
.ac-selo--ok{background:#dcfce7;color:#15803d}
.ac-selo--ruim{background:#fee2e2;color:#b91c1c}
[data-bs-theme="dark"] .ac-selo--ok{background:#14361f;color:#4ade80}
[data-bs-theme="dark"] .ac-selo--ruim{background:#3d1717;color:#f87171}
[data-bs-theme="dark"] .ac-chip--ok{background:#14361f;color:#4ade80}
[data-bs-theme="dark"] .ac-chip--trial{background:#132a4a;color:#7dd3fc}
[data-bs-theme="dark"] .ac-chip--alerta{background:#3a2f0d;color:#fbbf24}
[data-bs-theme="dark"] .ac-chip--off{background:#1d2739;color:#94a3b8}
[data-bs-theme="dark"] .ac-chip--erro{background:#3d1717;color:#f87171}

.ac-vazio{padding:52px 20px;text-align:center;color:var(--ac-suave);font-size:14px}
.ac-vazio i{font-size:32px;color:var(--ac-linha);display:block;margin-bottom:11px}

/* ═══════════════════════════════ formulários ══════════════════════════ */
.ac-form label{display:block;font-size:12.5px;font-weight:600;color:var(--ac-tinta);margin-bottom:5px}
.ac-form .form-control,.ac-form .form-select{
  border:1px solid var(--ac-linha);border-radius:8px;padding:9px 12px;font-size:13.8px;
  background:var(--ac-card);color:var(--ac-texto);
}
.ac-form .form-control:focus,.ac-form .form-select:focus{
  border-color:var(--ac-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--ac-primary) 18%,transparent);
}
.ac-form .ajuda{font-size:12px;color:var(--ac-suave);margin-top:4px;margin-bottom:0}
.ac-form .invalid-feedback{display:block;font-size:12px}

.btn-ac{
  background:var(--ac-primary);border:0;color:#fff;padding:9px 18px;border-radius:8px;
  font-size:13.5px;font-weight:600;display:inline-flex;align-items:center;gap:7px;
  transition:var(--ac-transicao);white-space:nowrap;
}
.btn-ac:hover{filter:brightness(.92);color:#fff}
.btn-ac--claro{background:var(--ac-card);border:1px solid var(--ac-linha);color:var(--ac-tinta)}
.btn-ac--claro:hover{background:var(--ac-card);border-color:var(--ac-primary);color:var(--ac-primary);filter:none}
.btn-ac--perigo{background:var(--ac-card);border:1px solid #fecaca;color:#b91c1c}

/* <a class="btn-ac"> perdia a cor do texto: `body.ac-body a{color:inherit}`
   tem especificidade 0,2,1 e ganha de `.btn-ac` (0,1,0) — o botão saía verde
   sobre verde. Reafirma a cor no mesmo nível de especificidade. */
body.ac-body a.btn-ac{color:#fff}
body.ac-body a.btn-ac:hover{color:#fff}
body.ac-body a.btn-ac--claro{color:var(--ac-tinta)}
body.ac-body a.btn-ac--claro:hover{color:var(--ac-primary)}
body.ac-body a.btn-ac--perigo{color:#b91c1c}
.btn-ac--perigo:hover{background:#b91c1c;color:#fff;filter:none}
.btn-ac--sm{padding:6px 12px;font-size:12.5px}

/* ═════════════════════════════ paginação ══════════════════════════════ */
.ac-paginacao{display:flex;gap:5px;justify-content:center;padding:16px}
.ac-paginacao a,.ac-paginacao span{
  min-width:32px;height:32px;display:grid;place-items:center;border-radius:7px;padding:0 8px;
  border:1px solid var(--ac-linha);background:var(--ac-card);font-size:13px;color:var(--ac-texto);
}
.ac-paginacao .atual{background:var(--ac-primary);border-color:var(--ac-primary);color:#fff;font-weight:600}

/* ═════════════════════════════ assinatura ═════════════════════════════ */
.ac-assinatura{
  border:1px dashed var(--ac-linha);border-radius:10px;padding:16px;text-align:center;background-color:#fff;
  background-image:linear-gradient(45deg,#f1f4f8 25%,transparent 25%,transparent 75%,#f1f4f8 75%),
                   linear-gradient(45deg,#f1f4f8 25%,transparent 25%,transparent 75%,#f1f4f8 75%);
  background-size:16px 16px;background-position:0 0,8px 8px;
}
.ac-assinatura img{max-height:110px;max-width:100%}
.ac-assinatura--vazia{color:var(--ac-suave);font-size:13.5px;padding:32px 16px;background-image:none}
.ac-assinatura--vazia i{display:block;font-size:25px;color:var(--ac-linha);margin-bottom:8px}

/* ═══════════════════════ matriz de permissões ═════════════════════════ */
.ac-matriz__modulo{border:1px solid var(--ac-linha);border-radius:10px;margin-bottom:13px;overflow:hidden}
.ac-matriz__topo{
  background:var(--ac-fundo);padding:10px 15px;border-bottom:1px solid var(--ac-linha);
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.ac-matriz__topo strong{font-size:12.5px;color:var(--ac-tinta)}
.ac-matriz__itens{padding:13px 15px;display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:9px}
.ac-matriz__item{display:flex;gap:9px;align-items:flex-start;font-size:13px}
.ac-matriz__item input{margin-top:2px}

/* ═══════════════════════════ tela de login ════════════════════════════ */
body.ac-auth{
  margin:0;font-family:'Inter',system-ui,sans-serif;display:grid;place-items:center;min-height:100vh;padding:24px;
  background:#0b1710 radial-gradient(1200px 600px at 70% -10%, rgba(36,155,79,.22), transparent 60%);
}
.ac-auth__card{width:100%;max-width:410px;background:#fff;border-radius:16px;padding:36px 32px;box-shadow:0 30px 70px rgba(0,0,0,.35)}
.ac-auth__logo{display:block;height:42px;width:auto;margin:0 auto 8px}
.ac-auth__card h1{font-size:20px;text-align:center;margin:0 0 4px;color:#16211b;font-weight:700}
.ac-auth__card .sub{text-align:center;color:#64748b;font-size:13.5px;margin-bottom:24px}

/* ═══════════════════════════ responsivo ═══════════════════════════════ */
@media (max-width:992px){
  .ac-appbar__burger{display:block}
  .ac-modnav{
    position:fixed;left:0;top:calc(var(--ac-utilbar-h) + var(--ac-appbar-h));bottom:0;z-index:1032;
    height:auto;transform:translateX(-100%);transition:transform .2s ease;box-shadow:0 0 40px rgba(0,0,0,.3);
  }
  .ac-app-body.modnav-aberto .ac-modnav{transform:none}
  .ac-app-body.modnav-aberto .ac-modnav__backdrop{
    display:block;position:fixed;inset:0;background:rgba(8,18,12,.5);z-index:1031;
  }
  .ac-content{padding:18px}
}
@media (max-width:576px){
  .ac-utilbar{gap:10px;padding:0 12px}
  .ac-content{padding:14px}
  /* 2 por linha no celular: empilhados em 1 coluna os 4 indicadores
     empurravam o gráfico para fora da primeira tela. */
  .ac-kpis{grid-template-columns:1fr 1fr;gap:12px}
  .ac-kpi{padding:14px}
  .ac-kpi strong{font-size:22px}
  .ac-page-head h1{font-size:20px}
  .ac-tabela{min-width:620px}
  /* tabela curta (2-3 colunas, ao lado de um gráfico): cabe no celular,
     não precisa do min-width que obriga a rolagem lateral. */
  .ac-tabela--enxuta{min-width:0}
}

/* Leitura automática da foto: aviso de qualidade e sugestão de avaria.
   Fica embaixo da miniatura, nunca por cima — a foto é a prova. */
.ac-foto-aviso{
  margin-top:6px;padding:6px 9px;border-radius:8px;font-size:11.5px;line-height:1.35;
  background:#fef3c7;color:#8a5a06;display:flex;gap:6px;align-items:flex-start;
}
.ac-foto-sug{
  margin-top:6px;padding:8px 9px;border-radius:8px;background:var(--ac-tint);
  border:1px solid var(--ac-linha);font-size:11.5px;
}
.ac-foto-sug__txt b{display:inline;color:var(--ac-tinta)}
.ac-foto-sug__txt span{display:block;color:var(--ac-suave);margin-top:2px}
.ac-foto-sug__acoes{display:flex;gap:6px;margin-top:7px}
.ac-foto-sug__acoes form{margin:0}
[data-bs-theme="dark"] .ac-foto-aviso{background:#3a2f0d;color:#fbbf24}

/* par rótulo → valor das fichas (cliente, equipamento, vistoria) */
.ac-campo{padding:9px 14px 9px 0;border-bottom:1px solid var(--ac-linha)}
.ac-campo span{display:block;font-size:11.5px;color:var(--ac-suave);margin-bottom:2px}
.ac-campo strong{display:block;font-size:13.8px;color:var(--ac-tinta);font-weight:600;word-break:break-word}

/* ─────────────── espaços de foto da vistoria ─────────────── */
.ac-foto-slot{position:relative;border:1px solid var(--ac-linha);border-radius:10px;overflow:hidden;background:var(--ac-card)}
.ac-foto-slot.falta{border-color:#f0c9a8;background:#fffaf4}
.ac-foto-slot.tem{border-color:var(--ac-primary)}
.ac-foto-slot img{width:100%;height:120px;object-fit:cover;display:block}
.ac-foto-slot__vazio{
  height:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  cursor:pointer;color:var(--ac-suave);font-size:11.5px;
}
.ac-foto-slot__vazio i{font-size:22px;color:var(--ac-faint)}
.ac-foto-slot__vazio:hover{background:var(--ac-tint);color:var(--ac-deep)}
.ac-foto-slot__cap{
  padding:6px 8px;font-size:10.5px;font-weight:700;text-transform:uppercase;
  color:var(--ac-tinta);border-top:1px solid var(--ac-linha-2);line-height:1.3;
}
.ac-foto-slot__x{position:absolute;top:5px;right:5px}
.ac-foto-slot__x button{
  border:0;background:rgba(11,23,16,.7);color:#fff;width:24px;height:24px;border-radius:50%;
  font-size:11px;line-height:1;display:grid;place-items:center;
}
.ac-foto-slot__x button:hover{background:#b91c1c}