/* rifabpp — design system (base comum ao site e ao painel)
   Origem: protótipo do cliente (assets/img/prototipo.png). Claro, cards brancos arredondados,
   Montserrat, botões pílula vermelhos, ícones Tabler em quadrados rosados. */
:root{
  /* primária = roxo das luvas do logo Boxeando pela paz */
  --primaria:#6b2566; --primaria-esc:#4a1545; --primaria-claro:#ecdcea; --primaria-50:#f7eff6;
  --erro:#c62834; --erro-esc:#9b1c27; --erro-50:#fdeeef; --erro-claro:#f8d3d6;
  --fundo:#f2f3f7; --card:#fff; --texto:#1c1e2b; --sub:#5d6275; --suave:#9aa0b2; --linha:#e6e8ee;
  --verde:#1f9d55; --verde-50:#e8f7ee; --ambar:#b7791f; --ambar-50:#fdf3dc; --azul:#2f5fd0; --azul-50:#e9effc;
  --raio:22px; --raio-p:14px; --sombra:0 4px 18px rgba(28,30,43,.07);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;overflow-x:hidden}
body{font-family:Montserrat,system-ui,sans-serif;background:var(--fundo);color:var(--texto);font-size:15px;line-height:1.5;overflow-x:hidden}
a{color:inherit}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
input,select,textarea{font:inherit;color:inherit}
img{max-width:100%}
.ti{line-height:1}
.oculto{display:none!important}
.wrap{max-width:1080px;margin:0 auto;padding:0 16px}

/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--primaria);color:#fff;font-weight:600;font-size:15px;border-radius:999px;padding:12px 26px;box-shadow:0 4px 0 var(--primaria-esc);transition:transform .08s,box-shadow .08s;text-decoration:none;white-space:nowrap}
.btn:active{transform:translateY(3px);box-shadow:0 1px 0 var(--primaria-esc)}
.btn.bloco{width:100%}
.btn.sec{background:#fff;color:var(--texto);border:1px solid var(--linha);box-shadow:none}
.btn.verde{background:var(--verde);box-shadow:0 4px 0 #17783f}
.btn.escuro{background:var(--texto);box-shadow:0 4px 0 #000}
.btn.peq{padding:7px 14px;font-size:13px;box-shadow:none}
.btn.peq:active{transform:none}
.btn[disabled],.btn.carregando{opacity:.55;pointer-events:none}
.btn-icone{width:36px;height:36px;border-radius:50%;display:inline-grid;place-items:center;background:var(--fundo);color:var(--texto);text-decoration:none}
.btn-icone .ti{font-size:18px}

/* cards e títulos */
.card{background:var(--card);border-radius:var(--raio);box-shadow:var(--sombra)}
.titulo{font-size:24px;font-weight:400;color:#23264a}
.titulo b{font-weight:700}
.icone-tile{width:64px;height:64px;border-radius:16px;background:var(--primaria-claro);color:var(--primaria);display:grid;place-items:center;flex:none}
.icone-tile .ti{font-size:32px}
.icone-tile.p{width:44px;height:44px;border-radius:12px}
.icone-tile.p .ti{font-size:22px}

/* formulários */
.campo{margin-bottom:14px}
.campo label,.rotulo{display:block;font-size:13px;font-weight:600;margin-bottom:5px}
.campo input,.campo select,.campo textarea{width:100%;border:1px solid var(--linha);border-radius:var(--raio-p);padding:12px 14px;font-size:16px;outline:0;background:#fafbfc}
.campo textarea{min-height:96px;resize:vertical;line-height:1.45}
.campo input:focus,.campo select:focus,.campo textarea:focus{border-color:var(--primaria);background:#fff}
.campo small{display:block;font-size:12px;color:var(--sub);margin-top:4px}
.linha-campos{display:grid;gap:0 14px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}

/* etiquetas de status */
.tag{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:600;white-space:nowrap}
.tag.pago,.tag.ativa{background:var(--verde-50);color:var(--verde)}
.tag.pendente,.tag.rascunho{background:var(--ambar-50);color:var(--ambar)}
.tag.expirado,.tag.cancelado,.tag.cancelada{background:#eceef2;color:var(--sub)}
.tag.conflito{background:var(--erro-claro);color:var(--erro-esc)}
.tag.encerrada{background:var(--azul-50);color:var(--azul)}
.tag.apurada{background:var(--texto);color:#fff}

/* avisos */
.aviso{display:flex;gap:10px;align-items:flex-start;border-radius:var(--raio-p);padding:12px 14px;font-size:14px;margin-bottom:16px}
.aviso .ti{font-size:20px;margin-top:1px}
.aviso.ok{background:var(--verde-50);color:#156b3b}
.aviso.erro{background:var(--erro-50);color:var(--erro-esc)}
.aviso.info{background:var(--azul-50);color:#244a9e}
.aviso.alerta{background:var(--ambar-50);color:#7a5200}

.toast{position:fixed;left:16px;right:16px;top:16px;margin:0 auto;width:max-content;max-width:calc(100% - 32px);background:var(--texto);color:#fff;padding:10px 18px;border-radius:999px;font-size:13px;z-index:200;display:none;pointer-events:none;text-align:center}
.toast.on{display:block}
.spin{width:18px;height:18px;border:3px solid var(--linha);border-top-color:var(--primaria);border-radius:50%;animation:gira .8s linear infinite;flex:none;display:inline-block}
@keyframes gira{to{transform:rotate(360deg)}}