/* ===== ThisIsFan — Light UI (Bootstrap 5.3) ===== */

/* Palette & tokens (CSS vars) */
:root {
  --tif-bg: #f6f8fb;           /* fond app */
  --tif-card-bg: #ffffff;      /* cartes */
  --tif-border: #e6ebf2;       /* bordures subtiles */
  --tif-text: #1b2636;         /* texte principal */
  --tif-muted: #5e6b7a;        /* texte secondaire */
  --tif-brand: #2962ff;        /* bleu action */
  --tif-brand-weak: #e7efff;   /* bleu clair */
  --tif-live: #ff3b30;         /* LIVE */
  --tif-win: #32d74b;          /* vert */
  --tif-draw: #ffcc00;         /* jaune */
  --tif-lose: #ff453a;         /* rouge */
  --tif-radius: 14px;
  --tif-shadow: 0 6px 18px rgba(15, 23, 42, .06);
}

/* Reset léger */
html, body { background: var(--tif-bg); color: var(--tif-text); }
a { color: var(--tif-brand); text-decoration: none; }
a:hover { text-decoration: underline; }

/* Container un peu plus large que .container-lg */
.container-tif { max-width: 1180px; }

/* Cartes minimalistes */
.card {
  background: var(--tif-card-bg);
  border: 1px solid var(--tif-border);
  border-radius: var(--tif-radius);
  box-shadow: var(--tif-shadow);
}
.card-header { background: transparent; border-bottom: 1px solid var(--tif-border); }
.card-footer { background: transparent; border-top: 1px solid var(--tif-border); }

/* Nav & tabs */
.navbar {
  background: #fff;
  border-bottom: 1px solid var(--tif-border);
}
.nav-tabs { --bs-nav-tabs-border-color: var(--tif-border); }
.nav-tabs .nav-link { color: var(--tif-muted); }
.nav-tabs .nav-link.active {
  color: var(--tif-text);
  border-color: var(--tif-border) var(--tif-border) #fff;
  background: #fff;
  border-top-left-radius: 10px; border-top-right-radius: 10px;
}

/* Boutons */
.btn-primary {
  --bs-btn-bg: var(--tif-brand);
  --bs-btn-border-color: var(--tif-brand);
  --bs-btn-hover-bg: #1f4ddb;
  --bs-btn-hover-border-color: #1f4ddb;
  --bs-btn-active-bg: #1639ad;
}
.btn-outline-primary {
  --bs-btn-color: var(--tif-brand);
  --bs-btn-border-color: var(--tif-brand);
  --bs-btn-hover-bg: var(--tif-brand-weak);
}

/* Badges de statuts */
.badge-live { background: var(--tif-live) !important; }
.badge-ft   { background: #111827 !important; } /* FT/AET/PEN */
.badge-ns   { background: #96a3b6 !important; }

/* Lignes de match (clickable row) */
.match-row {
  display: grid;
  grid-template-columns: 24px 1fr auto 1fr;
  gap: .75rem;
  align-items: center;
  padding: .65rem .9rem;
  border-bottom: 1px dashed var(--tif-border);
  transition: background .15s ease, transform .05s ease;
  cursor: pointer;
}
.match-row:hover { background: #fafcff; }
.match-row:active { transform: translateY(1px); }
.match-row:last-child { border-bottom: 0; }
.match-team { min-width: 0; }
.match-team .name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.match-score { min-width: 56px; text-align: center; font-weight: 700; }
.match-time { color: var(--tif-muted); }

/* Responsive: sur mobile, on passe en 2 lignes */
@media (max-width: 576px) {
  .match-row { grid-template-columns: 24px 1fr auto; grid-auto-rows: auto; }
  .match-row .away { grid-column: 2 / span 2; text-align: right; }
}

/* Indicateur LIVE */
.live-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--tif-live); display: inline-block; margin-left: 6px;
  box-shadow: 0 0 0 0 rgba(255, 59, 48, .6); animation: pulse 1.25s infinite;
}
@keyframes pulse { 0%{box-shadow:0 0 0 0 rgba(255,59,48,.6)} 70%{box-shadow:0 0 0 10px rgba(255,59,48,0)} 100%{box-shadow:0 0 0 0 rgba(255,59,48,0)} }

/* Tables sport (classements, stats) */
.table.tif-table { --bs-table-bg: #fff; --bs-table-border-color: var(--tif-border); }
.table.tif-compact td, .table.tif-compact th { padding: .5rem .65rem; }

/* Drapeaux & logos */
.flag { width: 18px; height: 12px; object-fit: cover; border: 1px solid var(--tif-border); }
.logo-16 { width: 16px; height: 16px; object-fit: contain; background:#fff; border-radius: 4px; padding:1px; }
.logo-24 { width: 24px; height: 24px; object-fit: contain; background:#fff; border-radius: 6px; padding:2px; }
.logo-40 { width: 40px; height: 40px; object-fit: contain; background:#fff; border-radius: 10px; padding:4px; }

/* Petits helpers de mise en forme */
.text-muted-2 { color: var(--tif-muted) !important; }
.section-title { font-weight: 700; color: #0f172a; }
.card + .card { margin-top: .75rem; }

/* Teams.php */																							
.continent-pill{ text-transform: uppercase; letter-spacing:.5px; }
  .country-card img.flag{ width:28px; height:20px; object-fit:cover; border:1px solid #ddd; border-radius:2px; }
  .team-logo{ width:38px; height:38px; object-fit:contain; background:#fff; border:1px solid #eee; border-radius:8px; padding:4px; }
  .team-item{ transition: background .15s; border-radius:12px; }
  .team-item:hover{ background:#f8f9fa; }
  .badge-rounded{ border-radius: 999px; }
  .search-input{ max-width: 420px; }
  .breadcrumb a{ text-decoration: none; }
																							
																							/* Boutons orange TBF */
.btn-tbf{ 
  background: linear-gradient(90deg, var(--tbf-orange,#ff7a00), var(--tbf-orange-700,#ff5a00));
  color:#111; border:none;
}
.btn-tbf:hover{ filter: brightness(0.95); color:#111; }
.btn-tbf-outline{
  background: transparent; 
  border:1px solid var(--tbf-orange,#ff7a00);
  color: var(--tbf-orange,#ff7a00);
}
.btn-tbf-outline:hover{
  background: var(--tbf-orange,#ff7a00);
  color:#111;
}
/* Pastille lisible sur fond clair */
.badge-tbf-contrast{
  background: #fff;
  color:#111;
  border:1px solid rgba(0,0,0,.06);
}