/* CondoClass — complementos ao Tailwind (componentes reutilizados) */
html { scroll-behavior: smooth; }
body { font-family: Inter, system-ui, sans-serif; background: #f7f6f2; color: #0b1b33; -webkit-font-smoothing: antialiased; }
h1, h2, h3, .font-display { font-family: "Plus Jakarta Sans", Inter, sans-serif; letter-spacing: -0.02em; }
:focus-visible { outline: 2px solid #0d9488; outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }

/* botoes */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; font-weight: 600; font-size: .9rem; line-height: 1; padding: .8rem 1.25rem; border-radius: .75rem; transition: all .18s; cursor: pointer; border: 1px solid transparent; min-height: 44px; white-space: nowrap; }
.btn-primary { background: #0d9488; color: #fff; box-shadow: 0 6px 16px -6px rgba(13,148,136,.7); }
.btn-primary:hover { background: #0f766e; transform: translateY(-1px); }
.btn-sun { background: #f59e0b; color: #1c1300; box-shadow: 0 8px 20px -8px rgba(245,158,11,.8); }
.btn-sun:hover { background: #fbbf24; transform: translateY(-1px); }
.btn-ghost { background: #fff; color: #0b1b33; border-color: #e3e0d8; }
.btn-ghost:hover { border-color: #0d9488; color: #0f766e; }
.btn-dark { background: #0b1b33; color: #fff; }
.btn-dark:hover { background: #12284a; }
.btn-danger { background: #fff; color: #b91c1c; border-color: #fecaca; }
.btn-danger:hover { background: #fef2f2; }
.btn-whats { background: #16a34a; color: #fff; }
.btn-whats:hover { background: #15803d; }
.btn-sm { padding: .5rem .85rem; font-size: .8rem; min-height: 36px; border-radius: .6rem; }
.btn[disabled], .btn:disabled { opacity: .5; cursor: not-allowed; transform: none; }

/* formularios */
.field { display: block; width: 100%; background: #fff; border: 1px solid #ddd9cf; border-radius: .75rem; padding: .75rem .95rem; font-size: .95rem; min-height: 46px; transition: border-color .15s, box-shadow .15s; color: #0b1b33; }
.field:focus { outline: none; border-color: #0d9488; box-shadow: 0 0 0 4px rgba(13,148,136,.15); }
.field::placeholder { color: #9a9a92; }
.label { display: block; font-size: .8rem; font-weight: 600; color: #3a4a63; margin-bottom: .4rem; }
.hint { font-size: .75rem; color: #6b778c; margin-top: .35rem; }

/* cartoes e selos */
.card { background: #fff; border: 1px solid #ece9e1; border-radius: 1.1rem; box-shadow: 0 1px 2px rgba(11,27,51,.04), 0 8px 24px -8px rgba(11,27,51,.10); }
.badge { display: inline-flex; align-items: center; gap: .3rem; font-size: .72rem; font-weight: 600; padding: .25rem .6rem; border-radius: 999px; }
.badge-ok { background: #dcfce7; color: #166534; }
.badge-warn { background: #fef3c7; color: #92400e; }
.badge-bad { background: #fee2e2; color: #991b1b; }
.badge-info { background: #dbeafe; color: #1e40af; }
.badge-mute { background: #eceae3; color: #4b5563; }

/* vitrine */
.ad-card { background: #fff; border-radius: 1.25rem; overflow: hidden; border: 1px solid #ece9e1; transition: transform .25s, box-shadow .25s; display: flex; flex-direction: column; }
.ad-card:hover { transform: translateY(-4px); box-shadow: 0 2px 4px rgba(11,27,51,.05), 0 22px 44px -16px rgba(11,27,51,.28); }
.ad-card .thumb { aspect-ratio: 4 / 3; overflow: hidden; background: #e9e6dd; position: relative; }
.ad-card .thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.ad-card:hover .thumb img { transform: scale(1.06); }
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

.hero-overlay { background: linear-gradient(105deg, rgba(7,17,31,.92) 0%, rgba(7,17,31,.78) 38%, rgba(7,17,31,.25) 100%); }
.cat-tile { display: flex; flex-direction: column; align-items: center; gap: .6rem; padding: 1.1rem .75rem; background: #fff; border: 1px solid #ece9e1; border-radius: 1.1rem; text-align: center; transition: all .2s; font-weight: 600; font-size: .85rem; }
.cat-tile:hover { border-color: #0d9488; transform: translateY(-3px); box-shadow: 0 14px 30px -14px rgba(13,148,136,.55); }
.cat-tile .ico { width: 3rem; height: 3rem; border-radius: 1rem; display: grid; place-items: center; background: #effcf9; color: #0f766e; transition: all .2s; }
.cat-tile:hover .ico { background: #0d9488; color: #fff; }

/* animacao de entrada */
@keyframes rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.rise { animation: rise .6s cubic-bezier(.2,.7,.2,1) both; }
.rise-2 { animation-delay: .1s; } .rise-3 { animation-delay: .2s; } .rise-4 { animation-delay: .3s; }

/* painel */
.nav-link { display: flex; align-items: center; gap: .75rem; padding: .7rem .9rem; border-radius: .75rem; font-size: .9rem; font-weight: 500; color: #b8c4d8; transition: all .15s; }
.nav-link:hover { background: rgba(255,255,255,.07); color: #fff; }
.nav-link.ativo { background: rgba(13,148,136,.22); color: #fff; box-shadow: inset 3px 0 0 #2dd4bf; }
.tabela { width: 100%; border-collapse: collapse; font-size: .875rem; }
.tabela th { text-align: left; font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: #6b778c; padding: .7rem 1rem; background: #faf9f5; font-weight: 600; }
.tabela td { padding: .85rem 1rem; border-top: 1px solid #f0ede5; vertical-align: middle; }
.tabela tr:hover td { background: #fcfbf8; }
@media (max-width: 767px) {
  .tabela-cards thead { display: none; }
  .tabela-cards, .tabela-cards tbody, .tabela-cards tr, .tabela-cards td { display: block; width: 100%; }
  .tabela-cards tr { border-top: 1px solid #ece9e1; padding: .6rem 0; }
  .tabela-cards td { border: 0; padding: .3rem 1rem; display: flex; justify-content: space-between; gap: 1rem; text-align: right; }
  .tabela-cards td::before { content: attr(data-l); font-weight: 600; color: #6b778c; font-size: .72rem; text-transform: uppercase; text-align: left; }
}
details > summary { list-style: none; cursor: pointer; }
details > summary::-webkit-details-marker { display: none; }
details[open] .chev { transform: rotate(180deg); }
.chev { transition: transform .2s; }

/* SweetAlert2 no tema do sistema */
.cc-swal { border-radius: 1.25rem !important; font-family: Inter, system-ui, sans-serif !important; padding: 1.5rem !important; }
.cc-swal .swal2-title, .cc-swal-title { font-family: "Plus Jakarta Sans", Inter, sans-serif; letter-spacing: -0.02em; color: #0b1b33; font-size: 1.35rem; }
.cc-swal .swal2-html-container { color: #475569; font-size: .95rem; }
.cc-swal .swal2-actions { gap: .6rem; }
.swal2-toast.cc-swal { padding: .85rem 1rem !important; box-shadow: 0 18px 40px -12px rgba(11,27,51,.35) !important; }
.swal2-toast.cc-swal .swal2-title { font-size: .92rem; font-family: Inter, sans-serif; font-weight: 600; letter-spacing: 0; }
.btn-danger-solid { background: #dc2626; color: #fff; }
.btn-danger-solid:hover { background: #b91c1c; }
/* ================= botoes por funcao (cor = o que o botao faz) =================
   primary = acao principal (salvar, gerar, pagar, entrar)   | sun  = novo / chamada (anunciar, criar conta)
   info    = buscar / filtrar / enviar arquivo               | view = ver, visualizar, abrir
   edit    = editar / trocar                                 | ok   = aprovar, dar baixa, reativar, conversar
   danger  = excluir, cancelar, rejeitar, suspender, remover | copy = copiar
   dark    = acao alternativa (ex.: gerar boleto)            | ghost = neutro (voltar, "todas") */
.btn-info  { background: #0284c7; color: #fff; }
.btn-info:hover { background: #0369a1; transform: translateY(-1px); }
.btn-view  { background: #e0f2fe; color: #075985; border-color: #bae6fd; }
.btn-view:hover { background: #bae6fd; }
.btn-edit  { background: #fef3c7; color: #92400e; border-color: #fde68a; }
.btn-edit:hover { background: #fde68a; }
.btn-ok    { background: #16a34a; color: #fff; }
.btn-ok:hover { background: #15803d; transform: translateY(-1px); }
.btn-copy  { background: #ede9fe; color: #5b21b6; border-color: #ddd6fe; }
.btn-copy:hover { background: #ddd6fe; }
.btn-danger { background: #fee2e2; color: #991b1b; border-color: #fecaca; }
.btn-danger:hover { background: #fecaca; }
.btn-ghost { background: #fff; color: #334155; border-color: #e3e0d8; }

/* alinhamento: todo botao com a mesma altura e centralizado; grupos de acoes alinhados a direita */
.btn { vertical-align: middle; text-align: center; line-height: 1.1; }
form { margin: 0; }
.acoes { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .5rem; }
.acoes form { display: inline-flex; }
.tabela td:last-child .acoes { min-width: 8rem; }
.acoes-col { display: grid; gap: .5rem; }
.acoes-col .btn, .acoes-col form .btn { width: 100%; }
@media (max-width: 767px) { .tabela-cards td .acoes { justify-content: flex-start; } }

/* campos obrigatorios */
label.req::after, .label.req::after { content: " *"; color: #dc2626; font-weight: 700; }
.field.invalido { border-color: #dc2626; box-shadow: 0 0 0 4px rgba(220,38,38,.12); }

/* campo de busca com sugestoes (autocomplete / select pesquisavel) */
.ac-wrap { position: relative; }
.ac-list { position: absolute; z-index: 60; left: 0; right: 0; top: calc(100% + 6px); max-height: 18rem; overflow: auto; background: #fff; border: 1px solid #e3e0d8; border-radius: .9rem; box-shadow: 0 18px 40px -12px rgba(11,27,51,.28); padding: .35rem; }
.ac-item { display: block; width: 100%; text-align: left; padding: .6rem .8rem; border-radius: .6rem; cursor: pointer; }
.ac-item:hover, .ac-item[aria-selected="true"] { background: #effcf9; }
.ac-item .t { font-weight: 600; font-size: .9rem; color: #0b1b33; }
.ac-item .s { font-size: .75rem; color: #64748b; }
.ac-msg { padding: .7rem .9rem; font-size: .85rem; color: #64748b; }
.ac-caret { position: absolute; right: .35rem; top: 50%; transform: translateY(-50%); width: 2.2rem; height: 2.2rem; display: grid; place-items: center; color: #64748b; border-radius: .6rem; }
.ac-caret:hover { background: #f1f5f9; }
.ac-wrap .field { padding-right: 2.6rem; }

/* acoes da tabela sempre em UMA linha, alinhadas pela direita (no celular viram cartao e podem quebrar) */
@media (min-width: 768px) { .tabela .acoes { flex-wrap: nowrap; } .tabela td:last-child { white-space: nowrap; } }
.acoes .btn { flex-shrink: 0; }

/* abas (Helpers::abas + app.js) */
.tabs { display: flex; gap: .25rem; overflow-x: auto; scrollbar-width: none; border-bottom: 1px solid #e8e5dc; margin-bottom: 1.5rem; }
.tabs::-webkit-scrollbar { display: none; }
.tab { display: inline-flex; align-items: center; gap: .45rem; padding: .75rem 1.15rem; margin-bottom: -1px; font-size: .9rem; font-weight: 600; color: #6b778c; white-space: nowrap; border-bottom: 3px solid transparent; border-radius: .6rem .6rem 0 0; transition: color .15s, background .15s; }
.tab:hover { color: #0f766e; background: #f0fdfa; }
.tab[aria-selected="true"] { color: #0f766e; border-bottom-color: #0d9488; }
.tab:focus-visible { outline: 2px solid #0d9488; outline-offset: -2px; }
[data-tab-panel][hidden] { display: none !important; }

/* abas coloridas: cada aba tem sua cor (ciclo de 6); a ativa fica preenchida */
.tabs { gap: .5rem; padding-bottom: .75rem; border-bottom: 1px solid #e8e5dc; }
.tab { --c: #0d9488; --cb: #ccfbf1; --cf: #f0fdfa; margin-bottom: 0; border: 1px solid var(--cb); border-radius: .75rem; background: var(--cf); color: var(--c); padding: .6rem 1.1rem; }
.tab:nth-child(6n+2) { --c: #0369a1; --cb: #bae6fd; --cf: #f0f9ff; }
.tab:nth-child(6n+3) { --c: #7c3aed; --cb: #ddd6fe; --cf: #f5f3ff; }
.tab:nth-child(6n+4) { --c: #b45309; --cb: #fde68a; --cf: #fffbeb; }
.tab:nth-child(6n+5) { --c: #be185d; --cb: #fbcfe8; --cf: #fdf2f8; }
.tab:nth-child(6n+6) { --c: #15803d; --cb: #bbf7d0; --cf: #f0fdf4; }
.tab:hover { background: var(--cb); color: var(--c); }
.tab[aria-selected="true"] { background: var(--c); border-color: var(--c); color: #fff; box-shadow: 0 6px 14px -6px var(--c); }
.tab:focus-visible { outline-color: var(--c); outline-offset: 2px; }

/* filtros de situacao (Faturas): cor por status; o selecionado fica preenchido */
.filtro { --c: #0b1b33; --cb: #cbd5e1; --cf: #f1f5f9; background: var(--cf); color: var(--c); border: 1px solid var(--cb); }
.filtro:hover { background: var(--cb); }
.filtro.ativo { background: var(--c); border-color: var(--c); color: #fff; box-shadow: 0 6px 14px -6px var(--c); }
.filtro-pendente  { --c: #b45309; --cb: #fde68a; --cf: #fffbeb; }
.filtro-paga      { --c: #15803d; --cb: #bbf7d0; --cf: #f0fdf4; }
.filtro-vencida   { --c: #b91c1c; --cb: #fecaca; --cf: #fef2f2; }
.filtro-cancelada { --c: #475569; --cb: #cbd5e1; --cf: #f1f5f9; }

/* atalhos de periodo (Auditoria) */
.filtro-p-hoje    { --c: #0d9488; --cb: #99f6e4; --cf: #f0fdfa; }
.filtro-p-ontem   { --c: #0369a1; --cb: #bae6fd; --cf: #f0f9ff; }
.filtro-p-7d      { --c: #7c3aed; --cb: #ddd6fe; --cf: #f5f3ff; }
.filtro-p-30d     { --c: #b45309; --cb: #fde68a; --cf: #fffbeb; }
.filtro-p-mes     { --c: #be185d; --cb: #fbcfe8; --cf: #fdf2f8; }
.filtro-p-mes_ant { --c: #15803d; --cb: #bbf7d0; --cf: #f0fdf4; }

/* atalhos de periodo extras (Relatorios) */
.filtro-p-ano  { --c: #0e7490; --cb: #a5f3fc; --cf: #ecfeff; }
.filtro-p-tudo { --c: #0b1b33; --cb: #cbd5e1; --cf: #f1f5f9; }

/* hub de relatorios: cartoes coloridos por grupo */
.rel-card { border-left: 4px solid var(--c); }
.rel-ico { background: color-mix(in srgb, var(--c) 14%, white); color: var(--c); }
.rel-link { color: var(--c); }
.rel-card:hover { transform: translateY(-2px); }

/* submenu do menu lateral */
.nav-sub { margin: .15rem 0 .4rem 1.6rem; padding-left: .8rem; border-left: 1px solid rgba(255,255,255,.14); display: grid; gap: .1rem; }
.nav-sub a { display: flex; align-items: center; gap: .5rem; padding: .42rem .7rem; border-radius: .6rem; font-size: .84rem; color: #cbd5e1; }
.nav-sub a:hover { background: rgba(255,255,255,.08); color: #fff; }
.nav-sub a.ativo { background: rgba(255,255,255,.14); color: #fff; font-weight: 600; }
.nav-sub .pt { width: .5rem; height: .5rem; border-radius: 9999px; background: var(--c, #14b8a6); flex-shrink: 0; }

/* modal que se ajusta ao conteudo (CC.janela com largura "auto") */
.swal-ajustado { min-width: min(92vw, 440px); max-width: 96vw; }
