/* Football Matches Widget - Modern Compact Styles with Company Colors */

.football-matches-container {
  margin: 15px 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.football-section {
  margin-bottom: 25px;
}

.football-section:last-child {
  margin-bottom: 0;
}

.football-matches-header {
  margin-bottom: 12px;
}

.football-matches-header h3 {
  font-size: 1.2em;
  margin: 0 0 12px 0;
  color: #043c7c; /* Company dark blue */
  font-weight: 600;
  padding: 0;
  border: none;
}

.football-table-wrapper {
  overflow-x: auto;
  border-radius: 8px;
  background: white;
  border: 1px solid #043c7c; /* Company dark blue border */
}

.football-matches-table {
  width: 100%;
  border-collapse: collapse;
  margin: 0;
  background: white;
  font-size: 0.9em;
}

.football-matches-table th {
  background: linear-gradient(
    135deg,
    #043c7c 0%,
    #032f63 100%
  ); /* Company dark blue gradient */
  color: white;
  padding: 10px 12px;
  text-align: left;
  font-weight: 600;
  font-size: 0.85em;
  border-bottom: 1px solid #043c7c;
  white-space: nowrap;
}

.football-matches-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #e8f1ff; /* Light blue tint */
  vertical-align: middle;
  color: #043c7c; /* Company dark blue text */
}

.match-row {
  transition: background-color 0.2s ease;
}

.match-row:hover {
  background-color: #f9f4e6; /* Light golden tint */
}

.match-row:last-child td {
  border-bottom: none;
}

/* Date Column - Compact */
.match-date {
  min-width: 80px;
  font-size: 0.85em;
}

.date-display {
  font-weight: 600;
  color: #043c7c; /* Company dark blue */
  line-height: 1.2;
}

.days-until {
  font-size: 0.75em;
  color: #6b7a8c; /* Muted blue-gray */
  margin-top: 2px;
}

/* Teams Column - Compact */
.teams-container {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 180px;
}

.team {
  flex: 1;
  text-align: center;
}

.team-name {
  font-weight: 600;
  color: #043c7c; /* Company dark blue */
  font-size: 0.9em;
  display: block;
}

.team-label {
  font-size: 0.7em;
  color: #6b7a8c; /* Muted blue-gray */
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-top: 1px;
}

.vs-separator {
  min-width: 25px;
  text-align: center;
}

.vs {
  background: #f3b213; /* Company golden yellow */
  color: #043c7c; /* Company dark blue text */
  padding: 2px 6px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.7em;
}

/* Results Column - Compact */
.match-result {
  text-align: center;
  min-width: 60px;
}

.score {
  display: inline-block;
}

.score-numbers {
  font-weight: 700;
  font-size: 1em;
  color: #043c7c; /* Company dark blue */
}

.result-home_win .score-numbers {
  color: #1b8a47; /* Adjusted green to complement company colors */
}

.result-away_win .score-numbers {
  color: #c1272d; /* Adjusted red to complement company colors */
}

.result-draw .score-numbers {
  color: #e69500; /* Adjusted orange closer to company golden */
}

.result-text {
  display: block;
  font-size: 0.7em;
  color: #6b7a8c; /* Muted blue-gray */
  margin-top: 2px;
}

.status {
  font-size: 0.8em;
  color: #043c7c; /* Company dark blue */
  padding: 2px 6px;
  background: #f9f4e6; /* Light golden tint */
  border-radius: 4px;
  border: 1px solid #f3b213; /* Company golden border */
}

/* Time Column - Compact */
.match-time {
  text-align: center;
  min-width: 60px;
}

.time-display {
  font-weight: 600;
  color: #043c7c; /* Company dark blue */
  font-size: 0.9em;
}

.match-status {
  font-size: 0.7em;
  color: #6b7a8c; /* Muted blue-gray */
  margin-top: 2px;
}

/* Venue Column - Compact */
.match-venue {
  color: #6b7a8c; /* Muted blue-gray */
  font-size: 0.8em;
  max-width: 120px;
}

/* Type Column - Compact */
.match-type {
  color: #6b7a8c; /* Muted blue-gray */
  font-size: 0.8em;
  font-weight: 500;
}

/* Error and Empty States */
.no-matches {
  text-align: center;
  padding: 20px;
  margin: 0;
  font-size: 0.9em;
}

.football-matches-error {
  background: #ffe6e6; /* Light red background */
  color: #c1272d; /* Adjusted red */
  padding: 12px;
  border-radius: 8px;
  text-align: center;
  border: 1px solid #e6b3b3; /* Light red border */
  font-size: 0.9em;
}

/* Modern Table Styles with Company Colors */

/* Modern Style */
.football-table-georgian_modern .football-matches-table th {
  background: linear-gradient(
    135deg,
    #043c7c 0%,
    #032f63 100%
  ); /* Company dark blue gradient */
  color: white;
}

.football-table-georgian_modern .match-row:nth-child(even) {
  background: #f9f4e6; /* Light golden tint */
}

/* Classic Style */
.football-table-georgian_classic .football-matches-table th {
  background: #043c7c; /* Company dark blue */
  color: white;
}

.football-table-georgian_classic .match-row:hover {
  background: #f9f4e6; /* Light golden tint */
}

/* Tbilisi Style */
.football-table-tbilisi_style .football-matches-table th {
  background: linear-gradient(
    135deg,
    #f3b213 0%,
    #d89b0f 100%
  ); /* Company golden gradient */
  color: #043c7c; /* Company dark blue text */
}

.football-table-tbilisi_style .match-row:hover {
  background: #e8f1ff; /* Light blue tint */
}

/* Minimalist */
.football-table-minimalist {
  border: none;
}

.football-table-minimalist .football-matches-table th {
  background: transparent;
  color: #043c7c; /* Company dark blue */
  border-bottom: 2px solid #f3b213; /* Company golden border */
}

.football-table-minimalist .football-matches-table td {
  border-bottom: 1px solid #e8f1ff; /* Light blue tint */
}

/* Football Field Style */
.football-table-football_field .football-matches-table th {
  background: #043c7c; /* Company dark blue */
  color: white;
}

.football-table-football_field .match-row:hover {
  background: #f9f4e6; /* Light golden tint */
}

/* Responsive Design */
@media (max-width: 768px) {
  .football-matches-table {
    font-size: 0.8em;
  }

  .football-matches-table th,
  .football-matches-table td {
    padding: 8px 6px;
  }

  .teams-container {
    flex-direction: column;
    gap: 4px;
    min-width: 120px;
  }

  .vs-separator {
    order: 2;
  }

  .home-team {
    order: 1;
  }

  .away-team {
    order: 3;
  }

  .vs {
    padding: 1px 4px;
    font-size: 0.6em;
  }

  .football-matches-header h3 {
    font-size: 1.1em;
  }

  .match-date {
    min-width: 70px;
  }
}

@media (max-width: 480px) {
  .football-table-wrapper {
    margin: 0 -5px;
    border-radius: 6px;
  }

  .football-matches-table th,
  .football-matches-table td {
    padding: 6px 4px;
  }

  .football-matches-table {
    font-size: 0.75em;
  }

  .football-section {
    margin-bottom: 20px;
  }

  .teams-container {
    min-width: 100px;
  }

  .team-name {
    font-size: 0.85em;
  }
}

/* Loading Animation with Company Colors */
.football-matches-loading {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 30px;
}

.football-matches-loading::after {
  content: '';
  width: 20px;
  height: 20px;
  border: 2px solid #f9f4e6; /* Light golden tint */
  border-top: 2px solid #f3b213; /* Company golden yellow */
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* Focus states for accessibility with Company Colors */
.match-row:focus-within {
  outline: 2px solid #f3b213; /* Company golden yellow */
  outline-offset: 1px;
}

/* Print Styles */
@media print {
  .football-matches-container {
    box-shadow: none;
  }

  .football-table-wrapper {
    box-shadow: none;
    border: 1px solid #043c7c; /* Company dark blue */
  }

  .match-row:hover {
    background-color: transparent !important;
  }

  .football-matches-header h3 {
    color: #043c7c !important; /* Company dark blue */
  }
}
