/* ============================================================
   3X3 Sistema - identidade visual azul
   Baseada na logo: marca #028AFD, CTA acessivel #0277D9
   ============================================================ */

:root{
  --tx-azul: #028AFD;
  --tx-action: #0277D9;
  --tx-action-hover: #075A9F;
  --tx-azul-hover: var(--tx-action-hover);
  --tx-azul-dark: #075A9F;
  --tx-navy: #063B66;
  --tx-azul-soft: #3BA7FF;
  --tx-azul-light: #E8F5FF;
  --tx-azul-ice: #F4FAFF;
  --tx-border: #B9E0FF;
  --tx-amber: #FD7502;
  --tx-ok: #08765A;

  --tx-text: #102A43;
  --tx-text-muted: #5E7388;
  --tx-text-light: #8DA4BE;
  --tx-branco: #FFFFFF;
  --tx-preto: #0A0A0A;

  /* Aliases legados para nao quebrar paginas existentes. */
  --tx-amarelo: #EDF910;
  --tx-azul-darker: var(--tx-navy);
  --tx-azul-bg: var(--tx-azul-light);
  --tx-bg: var(--tx-azul-ice);
  --tx-roxo: var(--tx-azul-dark);

  --bs-primary: var(--tx-action);
  --bs-link-color: var(--tx-action);
  --bs-link-hover-color: var(--tx-action-hover);
}

html{ scroll-behavior:smooth; }
html, body{ min-height:100%; }
body{
  color: var(--tx-text);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body.tx-app{
  display:flex;
  flex-direction:column;
  min-height:100vh;
  font-family:-apple-system, "Segoe UI", system-ui, Roboto, "Helvetica Neue", Arial, sans-serif;
  background:
    radial-gradient(circle at 18% 8%, rgba(2,138,253,.12), transparent 28%),
    linear-gradient(180deg, var(--tx-azul-ice) 0%, #fff 45%, var(--tx-azul-light) 100%);
}

/* Navbar */
.tx-navbar{
  background:linear-gradient(135deg, var(--tx-navy) 0%, var(--tx-azul-dark) 100%);
  border-bottom:4px solid var(--tx-azul);
}
.tx-navbar .navbar-brand,
.tx-navbar .nav-link,
.tx-navbar .navbar-toggler-icon{ color:var(--tx-branco) !important; }
.tx-navbar .nav-link{
  border-radius:8px;
  font-weight:500;
  transition:background .15s, color .15s;
}
.tx-navbar .nav-link:hover,
.tx-navbar .nav-link.active{
  color:var(--tx-branco) !important;
  background:rgba(255,255,255,.14);
}
.tx-navbar .nav-link.active{ font-weight:700; }
.tx-navbar .navbar-toggler{ border-color:rgba(255,255,255,.4); }
.tx-navbar .dropdown-menu{
  border-color:var(--tx-border);
  border-radius:8px;
  box-shadow:0 18px 40px rgba(6,59,102,.16);
}

/* Logo */
.tx-logo{
  display:inline-block;
  background:var(--tx-azul-light);
  color:var(--tx-navy);
  font-weight:900;
  padding:2px 10px;
  border-radius:6px;
  letter-spacing:1px;
}
.tx-logo-img{
  background:#fff;
  border-radius:50%;
  padding:3px;
  box-shadow:0 2px 8px rgba(6,59,102,.25), 0 0 0 2px rgba(255,255,255,.36);
  transition:transform .2s ease;
}
.tx-logo-img:hover{ transform:rotate(-8deg) scale(1.05); }

/* Botoes */
.btn-primary,
.btn-tx,
.btn-azul{
  background:var(--tx-action);
  border-color:var(--tx-action);
  color:var(--tx-branco);
  font-weight:600;
  transition:background .15s, border-color .15s, box-shadow .15s, transform .15s;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-tx:hover,
.btn-tx:focus,
.btn-tx:active,
.btn-azul:hover,
.btn-azul:focus,
.btn-azul:active{
  background:var(--tx-action-hover) !important;
  border-color:var(--tx-action-hover) !important;
  color:#fff !important;
  box-shadow:0 4px 12px rgba(2,119,217,.28);
}
.btn-amarelo{
  background:var(--tx-amber);
  border-color:var(--tx-amber);
  color:var(--tx-text);
  font-weight:600;
}
.btn-amarelo:hover,
.btn-amarelo:focus{
  background:#D85F02;
  border-color:#D85F02;
  color:var(--tx-text);
}
.btn-amber{
  background:var(--tx-amber);
  border-color:var(--tx-amber);
  color:var(--tx-text);
  font-weight:600;
}
.btn-amber:hover{ background:#D85F02; border-color:#D85F02; color:var(--tx-text); }
.btn-outline-primary{ color:var(--tx-action); border-color:var(--tx-action); }
.btn-outline-primary:hover,
.btn-outline-primary:focus{
  background:var(--tx-action);
  border-color:var(--tx-action);
  color:#fff;
}
.btn-outline-secondary{ color:var(--tx-navy); border-color:var(--tx-border); }
.btn-outline-secondary:hover,
.btn-outline-secondary:focus{
  background:var(--tx-azul-light);
  border-color:var(--tx-azul-soft);
  color:var(--tx-azul-dark);
}
.btn-outline-danger:hover{ background:#dc3545; color:#fff; }

/* Cards */
.card{
  border:1px solid var(--tx-border);
  border-radius:8px;
  background:#fff;
  box-shadow:0 14px 34px rgba(6,59,102,.08);
}
.card-header{
  background:transparent;
  border-bottom:1px solid var(--tx-border);
  color:var(--tx-azul-dark);
  font-weight:700;
}
.card-footer{
  background:var(--tx-azul-ice);
  border-top:1px solid var(--tx-border);
}

/* Dashboard */
.tx-stat{
  min-height:112px;
  border-radius:8px;
  padding:1.25rem;
  color:var(--tx-branco);
  background:linear-gradient(135deg, var(--tx-action) 0%, var(--tx-azul-dark) 100%);
  box-shadow:0 14px 34px rgba(6,59,102,.13);
}
.tx-stat .num{ font-size:2rem; font-weight:800; line-height:1; }
.tx-stat .lbl{
  margin-top:.45rem;
  font-size:.8rem;
  opacity:.94;
  text-transform:uppercase;
  letter-spacing:0;
  font-weight:600;
}
.tx-stat.amarelo{
  background:linear-gradient(135deg, var(--tx-azul-light), #fff);
  color:var(--tx-navy);
  border:1px solid var(--tx-border);
}
.tx-stat.amber{ background:linear-gradient(135deg, #B64E00, #7A3400); color:#fff; }
.tx-stat.neutral{ background:linear-gradient(135deg, #5E7388, #3F5368); color:#fff; }
.tx-stat.ok{ background:linear-gradient(135deg, var(--tx-ok), #064F3D); color:#fff; }
.tx-stat.azul,
.tx-stat.azul-light{ background:linear-gradient(135deg, var(--tx-action), var(--tx-azul-dark)); }
.tx-stat.azul-dark{ background:linear-gradient(135deg, var(--tx-azul-dark), var(--tx-navy)); }

/* Tabelas */
.table{
  --bs-table-bg:transparent;
  border-color:var(--tx-border);
}
.table thead th{
  background:var(--tx-azul-dark);
  color:var(--tx-branco);
  border:0;
  font-size:.88rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:0;
}
.table tbody tr:hover{ background:var(--tx-azul-light); }
.table tbody td{
  vertical-align:middle;
  border-color:var(--tx-border);
}
/* borda superior de combo agora é setada inline com a cor do grupo */

/* Badges */
.badge-papel{ font-weight:700; letter-spacing:0; padding:.35rem .55rem; }
.badge-participante{ background:var(--tx-action); color:#fff; }
.badge-aluno{ background:var(--tx-azul-dark); color:#fff; }
.badge-anjo{ background:var(--tx-azul-light); color:var(--tx-navy); border:1px solid var(--tx-border); }
.badge-instrutor{ background:var(--tx-navy); color:#fff; }
.badge-equipe{ background:var(--tx-preto); color:#fff; }

/* Checkboxes e Radios — contorno escuro pra ficar visível */
.form-check-input{
  border: 2px solid var(--tx-navy);
  width: 1.15em;
  height: 1.15em;
  margin-top: .2em;
  transition: background-color .15s, border-color .15s, box-shadow .15s;
}
.form-check-input:hover{
  border-color: var(--tx-action);
  cursor: pointer;
}
.form-check-input:focus{
  border-color: var(--tx-action);
  box-shadow: 0 0 0 .2rem rgba(2,138,253,.25);
}
.form-check-input:checked{
  background-color: var(--tx-action);
  border-color: var(--tx-action);
}
.form-check-input:checked:focus{
  border-color: var(--tx-action-hover);
  box-shadow: 0 0 0 .2rem rgba(2,138,253,.30);
}
.form-check-input[type="radio"]:checked{
  background-color: var(--tx-action);
  border-color: var(--tx-action);
}
/* Label do check fica mais legível */
.form-check-label{
  cursor: pointer;
  padding-left: .25rem;
}

/* Login */
.tx-login{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:1rem;
  background:
    radial-gradient(circle at 20% 12%, rgba(2,138,253,.32), transparent 28%),
    linear-gradient(135deg, var(--tx-azul-dark) 0%, var(--tx-navy) 100%);
}
.tx-login-card{
  width:100%;
  max-width:420px;
  padding:2.25rem;
  background:#fff;
  border-radius:8px;
  box-shadow:0 20px 60px rgba(6,59,102,.4);
}
.tx-login-logo{
  display:inline-block;
  background:var(--tx-azul-light);
  color:var(--tx-navy);
  font-weight:900;
  font-size:1.6rem;
  padding:6px 16px;
  border-radius:8px;
}
.tx-login-logo-img{
  width:110px;
  height:110px;
  border-radius:50%;
  background:#fff;
  padding:6px;
  box-shadow:0 8px 24px rgba(6,59,102,.30);
}

/* Footer */
.tx-footer{
  background:var(--tx-navy);
  color:var(--tx-azul-light);
  border-top:4px solid var(--tx-azul);
}
.tx-footer a{ color:var(--tx-azul-light); text-decoration:none; }
.tx-footer a:hover{ color:#fff; }

/* Formularios */
.form-control,
.form-select{
  border-color:var(--tx-border);
  color:var(--tx-text);
  transition:border-color .15s, box-shadow .15s;
}
.form-control:focus,
.form-select:focus{
  border-color:var(--tx-azul-soft);
  box-shadow:0 0 0 .2rem rgba(7,90,159,.18);
}
.form-control::placeholder{ color:var(--tx-text-light); }
.form-label{
  color:var(--tx-azul-dark);
  font-size:.9rem;
  font-weight:600;
}

/* Tabs */
.nav-tabs{ border-bottom-color:var(--tx-border); }
.nav-tabs .nav-link{
  color:var(--tx-text-muted);
  border:0;
  border-bottom:2px solid transparent;
  font-weight:600;
}
.nav-tabs .nav-link.active{
  color:var(--tx-azul-dark);
  border-color:transparent transparent var(--tx-action);
  background:transparent;
  font-weight:700;
}
.nav-tabs .nav-link:hover{
  color:var(--tx-action-hover);
  border-color:transparent transparent var(--tx-azul-soft);
}

/* Alerts */
.alert-success{ background:#E6F7ED; border-color:#B8E3C8; color:#1E6B3A; }
.alert-danger{ background:#FDEAEA; border-color:#F5C0C0; color:#8A1A1A; }
.alert-warning{ background:#FFF4E0; border-color:#FFD99C; color:#8A4A00; }
.alert-info{ background:var(--tx-azul-light); border-color:var(--tx-border); color:var(--tx-azul-dark); }

/* Utilidades */
.tx-text-azul,
.tx-text-roxo{ color:var(--tx-azul-dark) !important; }
.tx-text-navy{ color:var(--tx-navy) !important; }
.tx-text-marca{ color:var(--tx-azul) !important; }
.tx-text-amber{ color:var(--tx-amber) !important; }
.tx-bg-azul{ background:var(--tx-action) !important; color:#fff; }
.tx-bg-navy{ background:var(--tx-navy) !important; color:#fff; }
.tx-bg-roxo{ background:var(--tx-action) !important; color:#fff; }
.tx-bg-amarelo{ background:var(--tx-azul-light) !important; color:var(--tx-navy); }
.tx-bg-ice{ background:var(--tx-azul-ice) !important; }
.tx-bg-light{ background:var(--tx-azul-light) !important; }

/* Acessibilidade */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
.form-control:focus-visible,
.form-select:focus-visible{
  outline:3px solid rgba(7,90,159,.36);
  outline-offset:2px;
}

@media (max-width: 767.98px){
  .tx-stat{ min-height:104px; }
  .table thead th{ font-size:.78rem; }
}