/* ===== CSS Variables for Baseball Action Type Colors ===== */
:root {
  /* Pitching colors */
  --baseball-fastball-color: #a51615;
  --baseball-curveball-color: #4eaafd;
  --baseball-changeup-color: #80ae00;
  --baseball-sinker-color: #fa994a;
  --baseball-slider-color: #e6c100;
  /* Hitting colors */
  --baseball-groundball-color: #3498db;
  --baseball-line-drive-color: #2ecc71;
  --baseball-fly-ball-color: #e74c3c;
  --baseball-pop-up-color: #f39c12;
  --baseball-bunt-color: #9b59b6;
  /* Default colors */
  --baseball-default-color: #f5be1c;
  --baseball-other-color: #9e9e9e;
}

/* ===== Horizontal scroll container ===== */
.stat-card-wrapper {
  margin-bottom: 1.5rem;
}

/* ===== Horizontal scroll wrapper ===== */
.stat-scroll-wrapper {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.stat-card-wrapper .row {
  display: flex;
  gap: 1rem;
}

/* Accordion rows: no gap + own horizontal scroll when needed */
.stat-card-wrapper .group-accordion-content .row {
  gap: 0 !important;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.stat-scroll-wrapper .row {
  flex-wrap: nowrap;
}

.stat-card-wrapper .stat-col {
  flex: 1 0 auto; /* Allows cards to grow to fill available space */
}

/* ===== Responsive widths for stat cards (accordion + player profile rows) ===== */
/* Mobile default: very wide with small peek (~1.05–1.1 card) */
.stat-card-wrapper .group-accordion-content .stat-col,
.stat-scroll-wrapper .stat-col {
  flex: 0 0 65%;
}

/* ≥576px: wider cards on small devices (~1.3–1.5 cards per view) */
@media (min-width: 576px) {
  .stat-card-wrapper .group-accordion-content .stat-col,
  .stat-scroll-wrapper .stat-col {
    flex: 0 0 60%;
  }
}

/* ≥768px: wider cards on tablet (~2 cards per view) */
@media (min-width: 768px) {
  .stat-card-wrapper .group-accordion-content .stat-col,
  .stat-scroll-wrapper .stat-col {
    flex: 0 0 40%;
  }
}

/* ≥992px: 4 cards per view (desktop) */
@media (min-width: 992px) {
  .stat-card-wrapper .group-accordion-content .stat-col,
  .stat-scroll-wrapper .stat-col {
    flex: 0 0 25%;
  }
}

/* ===== Card: Fixed height ===== */
.stat-card-wrapper .card.single-stat {
  height: 200px;
  display: flex;
  flex-direction: column;
  padding: 0.75rem;
  position: relative;
}

/* ===== Verified Data Indicator ===== */
.stat-card-wrapper .verified-indicator {
  position: absolute;
  top: 1.2rem;
  right: 0.75rem;
  color: #ffcc00;
  font-size: 1.2rem;
  z-index: 10;
  width: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ===== Verified Organization Logo ===== */
.stat-card-wrapper .verified-org-logo {
  position: absolute;
  top: 1.3rem;
  right: 3rem;
  z-index: 10;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: white;
  display: flex;
  align-items: center;
  justify-content: center;
}

.stat-card-wrapper .verified-org-logo img {
  width: 18px;
  object-fit: contain;
  border-radius: 50%;
}

/* ===== Stat Content Container ===== */
.stat-card-wrapper .stat-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex-grow: 1;
  margin-bottom: 0.5rem;
}

/* ===== Icon ===== */
.stat-card-wrapper .stat-icon {
  height: 24px;
  width: 48px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}

/* ===== Label ===== */
.stat-card-wrapper .stat-label {
  font-size: 0.9rem;
  font-weight: 500;
  margin-top: 0.25rem;
  min-height: 2.2rem;
  display: flex;
  word-wrap: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
  text-align: left;
  padding: 10px !important;
}

/* ===== Value + Unit ===== */
.stat-card-wrapper .card-text {
  font-size: 1.8rem;
  font-weight: bold;
  text-align: left;
  margin: 0;
}
.stat-unit {
  font-size: 1rem;
  margin-left: 0.25rem;
}
.stat-unit-super {
  vertical-align: super;
}
/* ===== Status Row Container (above bottom row) ===== */
.stat-card-wrapper .status-row {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
}

/* ===== Bottom Row Container ===== */
.stat-card-wrapper .bottom-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  width: 100%;
  margin-top: auto;
}

/* ===== More Info Icon ===== */
.stat-card-wrapper .more-info {
  color: #dbdbdb;
  flex-shrink: 0;
  cursor: pointer;
  background: #2f2f2f;
  border-radius: 12px;
  padding: 0.12rem 0.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* ===== Mobile adjustments ===== */
@media (max-width: 576px) {
  .stat-card-wrapper .stat-label {
    font-size: 0.8rem;
  }
  .stat-card-wrapper .card-text {
    font-size: 1.4rem;
  }
  .stat-card-wrapper .stat-unit {
    font-size: 0.85rem;
  }
}

/* ===== Scrollbar style (applies to wrapper and accordion rows) ===== */
.stat-scroll-wrapper::-webkit-scrollbar,
.stat-card-wrapper .group-accordion-content .row::-webkit-scrollbar {
  height: 6px;
}

.stat-scroll-wrapper::-webkit-scrollbar-track,
.stat-card-wrapper .group-accordion-content .row::-webkit-scrollbar-track {
  background: #222;
}

.stat-scroll-wrapper::-webkit-scrollbar-thumb,
.stat-card-wrapper .group-accordion-content .row::-webkit-scrollbar-thumb {
  background-color: #ffcc00;
  border-radius: 3px;
}

/* ===== Bootstrap Modal Customization ===== */
.stat-modal .modal-content {
  background: linear-gradient(180deg, #303030 0%, rgb(0, 0, 0) 100%);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2), 0 5px 5px rgba(0, 0, 0, 0.4);
  border-radius: 9px;
  padding: 0 7px;
  border: none;
  min-height: 400px;
}

.stat-modal .modal-header {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  padding: 1.5rem 1.5rem 1rem;
}

.stat-modal .modal-title {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  color: #dbdbdb;
  font-size: 1.2rem;
  font-weight: 600;
}

.stat-modal .modal-title img {
  height: 32px;
  width: 64px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}

.stat-modal .btn-close {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffcc00'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 1em;
  border: 0;
  border-radius: 0.375rem;
  opacity: 0.5;
  transition: opacity 0.2s;
}

.stat-modal .btn-close:hover {
  opacity: 1;
}

.stat-modal .modal-body {
  color: #dbdbdb;
  flex-grow: 1;
}

/* ===== Time Filter Dropdown Styling ===== */
.stat-modal .time-filter-container {
  padding: 0 36px;
}

.stat-modal .time-filter-container .form-label {
  color: #dbdbdb;
  font-size: 0.9rem;
  font-weight: 500;
  margin-bottom: 0.5rem;
}

.stat-modal .time-filter-container .form-select {
  background: #2f2f2f;
  color: #dbdbdb;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 6px;
  font-size: 0.9rem;
  padding: 0.5rem 0.75rem;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.stat-modal .time-filter-container .form-select:focus {
  background: #2f2f2f;
  color: #dbdbdb;
  border-color: #ffcc00;
  box-shadow: 0 0 0 0.2rem rgba(255, 204, 0, 0.25);
}

.stat-modal .time-filter-container .form-select option {
  background: #2f2f2f;
  color: #dbdbdb;
}

.stat-modal .stat-table-wrapper {
  padding: 0 36px;
}

.stat-modal .table {
  color: #dbdbdb;
  margin-bottom: 0;
  background: transparent;
  box-shadow: none;
}

.stat-modal .table-responsive {
  max-height: 300px;
  overflow-y: auto;
}

.stat-modal .table tbody td {
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  padding: 0.75rem 0.5rem;
  vertical-align: middle;
  background: transparent;
}

.stat-modal .spinner-border {
  width: 2rem;
  height: 2rem;
}

.stat-modal .alert {
  background: rgba(220, 53, 69, 0.1);
  border: 1px solid rgba(220, 53, 69, 0.3);
  color: #f8d7da;
}

.stat-loading-spinner {
  width: 20px;
  height: 20px;
  color: #aaa;
}

/* ===== Card Click Cursor ===== */
.stat-card-wrapper .card.single-stat {
  cursor: pointer;
  transition: transform 0.2s, box-shadow 0.2s;
}

.stat-card-wrapper .card.single-stat:hover {
  transform: translateY(-2px);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2), 0 8px 15px rgba(0, 0, 0, 0.5);
}

/* ===== Inline Status Label (Option 9 Style) ===== */
.stat-card-wrapper .stat-status-label-inline {
  display: inline-block;
  background: rgba(108, 117, 125, 0.4);
  color: #fff;
  padding: 0.1rem 0.35rem;
  border-radius: 3px;
  font-size: 0.65rem;
  font-weight: normal;
  margin-left: 0.5rem;
  text-transform: uppercase;
  line-height: 1.2;
}

/* ===== Status Label Under Metric Name (Option 11 Style) ===== */
.stat-card-wrapper .stat-status-label-below {
  display: block;
  background: rgba(108, 117, 125, 0.4);
  color: #fff;
  padding: 0.1rem 0.35rem;
  border-radius: 3px;
  font-size: 0.65rem;
  font-weight: normal;
  margin-top: 0.5rem;
  text-transform: uppercase;
  line-height: 1.2;
  width: fit-content;
}

/* ===== Status Label in Status Row ===== */
.stat-card-wrapper .status-row .stat-status-label {
  display: inline-block;
  background: #6c757d30;
  color: #8f8f8f;
  padding: 0.1rem 0.35rem;
  border-radius: 3px;
  font-size: 0.65rem;
  font-weight: normal;
  text-transform: uppercase;
  line-height: 1.2;
}

/* ===== Accordion Category Tag (for verified tab) ===== */
.group-accordion-header .accordion-category-tag {
  display: inline-block;
  background: #6c757d30;
  color: #8f8f8f;
  padding: 0.1rem 0.35rem;
  border-radius: 3px;
  font-size: 0.65rem;
  font-weight: normal;
  text-transform: uppercase;
  line-height: 1.2;
  margin-left: 0.5rem;
}

/* Jumbo Header */
.profile-pageName-area {
  position: absolute;
  bottom: 0px;
  right: 0%;
  background: white;
}

/* Event tabs styling */
.event-tabs {
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 10px;
  border-radius: 12px;
  margin-top: 1rem;
  margin-bottom: 2rem;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2), 0 5px 5px rgba(0, 0, 0, 0.4);
  border: none;
}

.event-tabs .nav-link {
  border: none;
  color: #aaa;
  font-weight: normal;
  position: relative;
}

.event-tabs .nav-link.active {
  color: #fff;
  font-weight: bold;
  background: transparent;
}

.event-tabs .nav-link.active::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background-color: #f5be1c;
  border-radius: 2px;
}

/* event cards */
.events-container {
  color: white;
}

.events-title {
  font-weight: bold;
  font-size: 1.25rem;
  margin-bottom: 1rem;
}

.events-title span {
  color: #f5be1c;
  font-size: revert;
}

.event-card {
  background: white;
  color: #000;
  border-radius: 12px;
  padding: 1rem;
  margin-bottom: 1.5rem;
  position: relative;
  border-top: 6px solid #f5be1c;
}

.event-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.eventType-meta {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.event-badge {
  background: #000;
  color: #f5be1c;
  padding: 3px 8px;
  font-size: 0.75rem;
  border-radius: 4px;
  margin-left: 0.5rem;
}

.event-type-icon {
  width: 25px;
  height: 25px;
}

.event-matchup {
  display: flex;
  align-items: start;
  justify-content: space-around;
  margin-bottom: 0.5rem;
  flex-direction: column;
}

.team {
  text-align: center;
}

.team img {
  width: 40px;
  height: auto;
  display: block;
  margin: 0 auto 5px;
}

.vs {
  font-weight: bold;
}

.event-location {
  display: flex;
  align-items: center;
  margin-top: 1rem;
  color: #666;
}

.event-location i {
  color: #2a2c2e;
  font-size: 1.1rem;
  margin-top: 0.15rem;
  flex-shrink: 0;
}

.event-location strong {
  color: #2a2c2e;
  display: block;
}

.event-location span {
  color: #666;
  font-size: 0.9rem;
  line-height: 1.4;
}

.event-location .location-left {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  flex: 1;
}

.event-location .location-right {
  flex-shrink: 0;
  display: flex;
  align-items: center;
}

.location-map-image {
  width: 12rem;
  height: 7rem;
  object-fit: cover;
  border-radius: 12px;
  flex-shrink: 0;
  background: #e0e0e0;
  border: 4px solid #ededed;
  cursor: pointer;
  max-width: 100%;
}

.modal-address {
  font-size: 0.9rem;
  color: #666;
  margin-top: 0.25rem;
  line-height: 1.4;
}

/* Tablet: 50% width */
@media (min-width: 577px) and (max-width: 768px) {
  .event-location {
    flex-direction: column;
    align-items: flex-start;
  }

  .event-location .location-right {
    width: 100%;
    margin-top: 1rem;
    justify-content: flex-start;
  }

  .location-map-image {
    width: 50%;
    max-width: 50%;
    height: auto;
    aspect-ratio: 12 / 7;
  }
}

/* Mobile: 100% width */
@media (max-width: 576px) {
  .event-location {
    flex-direction: column;
    align-items: flex-start;
  }

  .event-location .location-right {
    width: 100%;
    margin-top: 1rem;
    justify-content: flex-start;
  }

  .location-map-image {
    width: 100%;
    max-width: 100%;
    height: auto;
    aspect-ratio: 12 / 7;
  }
}

.event-actions {
  position: absolute;
  bottom: 1rem;
  right: 1rem;
  font-size: 1.4rem;
}

/* NEW vertical matchup layout */
.event-matchup-vertical {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.75rem;
  margin: 1rem 0;
}

.team-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.team-row a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  text-decoration: none;
}

.team-logo-meta {
  text-align: center;
}

.team-logo-meta img {
  width: 3rem; /* Smaller screens default */
  height: auto;
  display: block;
  margin-bottom: 4px;
}

/* Laptop and larger */
@media (min-width: 992px) {
  .team-logo-meta img {
    width: 4rem;
  }
}

.team-role {
  font-size: 0.7rem;
  text-transform: uppercase;
  color: #555;
}

.team-name {
  font-size: 1rem;
  font-weight: 500;
}

/* Team name link styling */
.team-name-link {
  text-decoration: none;
  color: inherit;
  display: inline-block;
  cursor: pointer;
}

.team-name-link:hover,
.team-name-link:visited,
.team-name-link:active,
.team-name-link:focus {
  text-decoration: none;
  color: inherit;
  outline: none;
}

.event-vs {
  font-weight: bold;
  text-align: left;
  width: 100%;
}

/* lineup cards */
.lineup-card {
  background: white;
  color: #000;
  border-radius: 12px;
  padding: 1rem;
  margin-bottom: 1.5rem;
  position: relative;
  border-top: 6px solid #f5be1c;
  margin-top: 2rem;
}

.lineup-date {
  font-weight: bold;
  font-size: 1.1rem;
}

.lineup-location {
  margin-top: 0.5rem;
  font-size: 0.9rem;
}

.lineup-teams {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 1.5rem 0;
  position: relative;
}

.lineup-team {
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
  width: 45%;
  padding: 0.5rem;
  border-radius: 8px;
  transition: background-color 0.2s;
}

.lineup-team:hover {
  background-color: #f0f0f0;
}

.lineup-team img {
  width: 60px;
  height: 60px;
  margin-bottom: 0.5rem;
}

.lineup-team-name {
  font-weight: bold;
  text-align: center;
}

.lineup-team-division {
  font-size: 0.85rem;
  color: #666;
  margin-bottom: 0.5rem;
}

/* Default lineup button (disabled state) */
.lineup-btn {
  border: none;
  padding: 3px 10px;
  font-size: 0.8rem;
  border-radius: 4px;
  cursor: not-allowed;
  font-weight: bold;
  width: 80px;
  text-align: center;
  background-color: #e6e6e6;
  color: #666;
  cursor: not-allowed;
  box-shadow: none;
}

/* Enabled lineup button before selection */
.lineup-btn.has-lineup {
  background-color: white;
  color: #000;
  cursor: pointer;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* Selected lineup button */
.lineup-btn.active {
  background-color: #f5be1c;
  color: #000;
  box-shadow: none;
}

.lineup-vs {
  font-weight: bold;
  font-size: 1.2rem;
}

.lineup-badge {
  position: absolute;
  top: -10px;
  right: 15px;
  background: #000;
  color: #f5be1c;
  padding: 3px 10px;
  font-size: 0.75rem;
  border-radius: 4px;
  cursor: pointer;
}

.lineup-details {
  display: none;
}

table.lineup-table {
  box-shadow: none;
}

.list-group.list-group-flush.d-flex {
  justify-content: space-around;
  flex-direction: row !important;
  /* justify-items: flex-end; */
  align-items: center;
  text-align: center;
  margin-left: 0px;
}

span.vs {
  font-weight: 700;
  font-size: 1rem;
}

.flex-shrink-0 {
  flex-shrink: 0 !important;
}

.list-image-mini {
  max-width: 80px;
}

.list-image-mini2 {
  max-width: 3.5rem; /* Mobile default */
}

/* Tablet sizes */
@media (min-width: 768px) {
  .list-image-mini2 {
    max-width: 4rem;
  }
}

/* Laptop and larger */
@media (min-width: 992px) {
  .list-image-mini2 {
    max-width: 5rem;
  }
}

/* Mobile team logos - shown above team names */
.team-logo-mobile {
  max-width: 65px;
  width: 65px;
  height: auto;
  object-fit: contain;
}

/* Desktop team logos - shown on sides */
.team-logo-desktop {
  max-width: 3.5rem; /* Mobile default */
  width: 3.5rem;
  height: auto;
  object-fit: contain;
}

/* Responsive sizes for team-logo-desktop */
/* Tablet sizes */
@media (min-width: 768px) {
  .team-logo-desktop {
    max-width: 4rem;
    width: 4rem;
  }
}

/* Laptop and larger */
@media (min-width: 992px) {
  .team-logo-desktop {
    max-width: 5rem;
    width: 5rem;
  }
}

/* Team logo and name links - no decoration, clickable */
.team-logo-link,
.team-name-link {
  text-decoration: none !important;
  color: inherit;
  display: inline-block;
  cursor: pointer;
  transition: opacity 0.2s ease;
}

.team-logo-link:hover,
.team-name-link:hover {
  opacity: 0.8;
}

.team-logo-link:visited,
.team-name-link:visited,
.team-logo-link:active,
.team-name-link:active,
.team-logo-link:focus,
.team-name-link:focus {
  text-decoration: none;
  color: inherit;
  outline: none;
}

/* Winning score styling - applies to all screen sizes */
.score-display.score-winner {
  color: #000;
  font-weight: bold;
}

/* Losing score styling - applies to all screen sizes */
.score-display.score-loser {
  color: #000;
  font-weight: normal;
}

/* Score display base styling - applies to all screen sizes */
.list-group.list-group-flush.d-flex .score-display {
  min-height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  width: 100%;
}

/* Ensure proper spacing for mobile layout */
@media (max-width: 767.98px) {
  .list-group.list-group-flush.d-flex {
    align-items: flex-start; /* Align columns from top */
    gap: 0.5rem; /* Consistent gap between columns */
  }

  .list-group.list-group-flush.d-flex .d-flex.flex-column {
    min-width: 0;
    flex: 1 1 0; /* Equal flex basis for consistent widths */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start; /* Align items from top */
    gap: 0; /* Remove default gaps, use specific margins */
  }

  /* Fixed height for mobile logos to ensure consistent sizing */
  .team-logo-mobile {
    width: 50px;
    height: 50px;
    object-fit: contain;
    flex-shrink: 0;
  }

  /* Consistent spacing for team names - set min-height for multi-line names */
  .list-group.list-group-flush.d-flex .d-flex.flex-column > span {
    min-height: 3.5rem; /* Accommodate 2-line team names */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1.2;
    width: 100%;
  }

  /* Score display mobile-specific adjustments (base styles already applied above) */

  /* Consistent spacing for buttons */
  .list-group.list-group-flush.d-flex .boxscore-btn {
    margin-top: 0.25rem;
    flex-shrink: 0;
    width: 80px; /* Fixed width for consistency */
  }

  /* Ensure VS divider is centered */
  .list-group.list-group-flush.d-flex span.vs {
    align-self: center;
    flex-shrink: 0;
    padding: 0 0.5rem;
  }
}

small {
  font-size: 13px;
}

titlefont2 {
  font-size: 12px;
  font-weight: 700;
}

titlefont {
  font-size: 15px;
  font-weight: 800;
}
.card.yellow li.list-group-item {
  border-color: rgba(0, 0, 0, 0.05);
}

.yellow .table {
  --bs-table-border-color: rgba(0, 0, 0, 0.05);
}

.card.multi-stat.yellow {
  background: linear-gradient(180deg, #f3bc1c, #f1d10d);
  border-bottom: 5px solid #efebeb !important;
  border-color: rgba(22, 22, 22, 0.3137254902);
  color: #f5c900;
  border-left: 5px solid #0d6efd;
  background-image: linear-gradient(transparent, #f2d600),
    url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0iTGF5ZXJfMiIgZGF0YS1uYW1lPSJMYXllciAyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgNDgwLjcxIDM5Ny4xNSI+CiAgPGRlZnM+CiAgICA8c3R5bGU+CiAgICAgIC5jbHMtMSB7CiAgICAgICAgY2xpcC1wYXRoOiB1cmwoI2NsaXBwYXRoKTsKICAgICAgfQoKICAgICAgLmNscy0yLCAuY2xzLTMgewogICAgICAgIGZpbGw6ICNmM2RmM2U7CiAgICAgIH0KCiAgICAgIC5jbHMtNCB7CiAgICAgICAgY2xpcC1wYXRoOiB1cmwoI2NsaXBwYXRoLTEpOwogICAgICB9CgogICAgICAuY2xzLTMgewogICAgICAgIHN0cm9rZS13aWR0aDogMHB4OwogICAgICB9CiAgICA8L3N0eWxlPgogICAgPGNsaXBQYXRoIGlkPSJjbGlwcGF0aCI+CiAgICAgIDxwYXRoIGNsYXNzPSJjbHMtMyIgZD0ibTQ2NC42NSwxNjIuMjFMMjIzLjc5LDUuNzNjLTIxLjMyLTEzLjg1LTQ5Ljg1LTEuMjktNTQuMDMsMjMuNzlsLTUyLjEsMzEyLjc4Yy00LjgxLDI4Ljg3LDI1LjU5LDUwLjcsNTEuNDEsMzYuOTNsMjkyLjk2LTE1Ni4zYzIzLjctMTIuNjQsMjUuMTQtNDYuMDgsMi42MS02MC43MlptLTExMS4yNyw1LjMxbC0uMTgsMS4wNGMtMS40MSw4LjAyLTMuOCwxNS4yNy03LjExLDIxLjc0LTEuODksMy43LTQuMDgsNy4xNC02LjU1LDEwLjMyLTEuMjQsMS41OS0yLjU1LDMuMTEtMy45Myw0LjU3LTIuNzYsMi45Mi01LjgsNS41Ny05LjEyLDcuOTUtLjgzLjYtMS42NywxLjE3LTIuNTQsMS43NC0xMi4wNyw3Ljg2LTI3LjQyLDEyLjQxLTQ1LjU1LDEzLjQybDguMjQtNDYuNzdoMTYuNjFsNS0yOC4zOGgtNjEuNTlzLTUsMjguMzgtNSwyOC4zOGgxNi42MXMtMTcuMjYsOTcuOTItMTcuMjYsOTcuOTJsLTQ1Ljg5LTM3LjAxaDBzMjQuMTMtMTM2LjkzLDI0LjEzLTEzNi45M2g3MC41OGM4Ljc0LDAsMTYuNTYuNjcsMjMuNDgsMS45NywyLjUyLjQ3LDQuOTEsMS4wMyw3LjE5LDEuNjgsMS4xNC4zMiwyLjI1LjY2LDMuMzMsMS4wMiwyLjcuOTEsNS4yMiwxLjk0LDcuNTYsMy4xLDEuNC43LDIuNzQsMS40NCw0LjAyLDIuMjIuODUuNTIsMS42NywxLjA3LDIuNDYsMS42My43OS41NiwxLjU1LDEuMTUsMi4yOSwxLjc1LDQuMDQsMy4zMiw3LjIyLDcuMjIsOS41NywxMS42OS42NCwxLjIyLDEuMjIsMi40OCwxLjczLDMuNzguNTIsMS4zLjk3LDIuNjQsMS4zNiw0LjAzLjc4LDIuNzcsMS4zMiw1LjY5LDEuNjIsOC43OC4yLDIuMDYuMjksNC4xOC4yOCw2LjM4LS4wMyw0LjM5LS40OCw5LjA2LTEuMzUsMTMuOTlaIi8+CiAgICA8L2NsaXBQYXRoPgogICAgPGNsaXBQYXRoIGlkPSJjbGlwcGF0aC0xIj4KICAgICAgPHJlY3QgY2xhc3M9ImNscy0zIiB5PSIxMS45OCIgd2lkdGg9IjQzMy4xIiBoZWlnaHQ9IjM2Ni45MSIgcng9IjQ0LjU3IiByeT0iNDQuNTciLz4KICAgIDwvY2xpcFBhdGg+CiAgPC9kZWZzPgogIDxnIGlkPSJMYXllcl8xLTIiIGRhdGEtbmFtZT0iTGF5ZXIgMSI+CiAgICA8Zz4KICAgICAgPHBhdGggY2xhc3M9ImNscy0yIiBkPSJtNDY0LjY1LDE2Mi4yMUwyMjMuNzksNS43M2MtMjEuMzItMTMuODUtNDkuODUtMS4yOS01NC4wMywyMy43OWwtNTIuMSwzMTIuNzhjLTQuODEsMjguODcsMjUuNTksNTAuNyw1MS40MSwzNi45M2wyOTIuOTYtMTU2LjNjMjMuNy0xMi42NCwyNS4xNC00Ni4wOCwyLjYxLTYwLjcyWm0tMTExLjI3LDUuMzFsLS4xOCwxLjA0Yy0xLjQxLDguMDItMy44LDE1LjI3LTcuMTEsMjEuNzQtMS44OSwzLjctNC4wOCw3LjE0LTYuNTUsMTAuMzItMS4yNCwxLjU5LTIuNTUsMy4xMS0zLjkzLDQuNTctMi43NiwyLjkyLTUuOCw1LjU3LTkuMTIsNy45NS0uODMuNi0xLjY3LDEuMTctMi41NCwxLjc0LTEyLjA3LDcuODYtMjcuNDIsMTIuNDEtNDUuNTUsMTMuNDJsOC4yNC00Ni43N2gxNi42MWw1LTI4LjM4aC02MS41OXMtNSwyOC4zOC01LDI4LjM4aDE2LjYxcy0xNy4yNiw5Ny45Mi0xNy4yNiw5Ny45MmwtNDUuODktMzcuMDFoMHMyNC4xMy0xMzYuOTMsMjQuMTMtMTM2LjkzaDcwLjU4YzguNzQsMCwxNi41Ni42NywyMy40OCwxLjk3LDIuNTIuNDcsNC45MSwxLjAzLDcuMTksMS42OCwxLjE0LjMyLDIuMjUuNjYsMy4zMywxLjAyLDIuNy45MSw1LjIyLDEuOTQsNy41NiwzLjEsMS40LjcsMi43NCwxLjQ0LDQuMDIsMi4yMi44NS41MiwxLjY3LDEuMDcsMi40NiwxLjYzLjc5LjU2LDEuNTUsMS4xNSwyLjI5LDEuNzUsNC4wNCwzLjMyLDcuMjIsNy4yMiw5LjU3LDExLjY5LjY0LDEuMjIsMS4yMiwyLjQ4LDEuNzMsMy43OC41MiwxLjMuOTcsMi42NCwxLjM2LDQuMDMuNzgsMi43NywxLjMyLDUuNjksMS42Miw4Ljc4LjIsMi4wNi4yOSw0LjE4LjI4LDYuMzgtLjAzLDQuMzktLjQ4LDkuMDYtMS4zNSwxMy45OVoiLz4KICAgICAgPGcgY2xhc3M9ImNscy0xIj4KICAgICAgICA8Zz4KICAgICAgICAgIDxyZWN0IGNsYXNzPSJjbHMtMiIgeT0iMTEuOTgiIHdpZHRoPSI0MzMuMSIgaGVpZ2h0PSIzNjYuOTEiIHJ4PSI0NC41NyIgcnk9IjQ0LjU3Ii8+CiAgICAgICAgICA8ZyBjbGFzcz0iY2xzLTQiPgogICAgICAgICAgICA8cGF0aCBjbGFzcz0iY2xzLTMiIGQ9Im00MTEuMjQsMjQyLjM2YzQuODYtNi4yNCw5LjE2LTEzLDEyLjg3LTIwLjI2LDYuNDktMTIuNzEsMTEuMTktMjYuOTUsMTMuOTYtNDIuN2wuMzYtMi4wNGMxLjcxLTkuNjgsMi42LTE4Ljg1LDIuNjUtMjcuNDcuMDMtNC4zMS0uMTUtOC40OS0uNTQtMTIuNTMtLjU5LTYuMDYtMS42NS0xMS44MS0zLjE5LTE3LjI0LS43Ny0yLjcyLTEuNjYtNS4zNS0yLjY3LTcuOTEtMS4wMS0yLjU2LTIuMTUtNS4wMy0zLjQtNy40Mi00LjYtOC43Ny0xMC44NS0xNi40NC0xOC43OS0yMi45NS0xLjQ0LTEuMTgtMi45NC0yLjMzLTQuNS0zLjQ0LTEuNTYtMS4xMS0zLjE3LTIuMTctNC44My0zLjItMi41LTEuNTQtNS4xMy0zLTcuODktNC4zNy00LjU5LTIuMjgtOS41NC00LjMxLTE0Ljg1LTYuMDktMi4xMi0uNzEtNC4zLTEuMzgtNi41NC0yLjAxLTQuNDgtMS4yNi05LjE5LTIuMzYtMTQuMTMtMy4yOS0xMy41OS0yLjU2LTI4Ljk1LTMuODctNDYuMTEtMy44N2gtMTM4LjYxbC00Ny4zOSwyNjguOWgwczkwLjEyLDcyLjY4LDkwLjEyLDcyLjY4bDMzLjg5LTE5Mi4yOWgtMzIuNjEsMHM5LjgyLTU1LjczLDkuODItNTUuNzNoMTIwLjk2bC05LjgyLDU1LjczaDBzLTMyLjYxLDAtMzIuNjEsMGwtMTYuMTksOTEuODRjMzUuNjEtMS45OSw2NS43NS0xMC45MSw4OS40NS0yNi4zNSwxLjY5LTEuMSwzLjM1LTIuMjQsNC45OC0zLjQxLDYuNTEtNC42OCwxMi40OC05Ljg4LDE3LjkxLTE1LjYxLDIuNzEtMi44Niw1LjI4LTUuODUsNy43Mi04Ljk4WiIvPgogICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgICAgPC9nPgogICAgPC9nPgogIDwvZz4KPC9zdmc+),
    linear-gradient(#f3bc1c, #f2d600);
  background-repeat: no-repeat;
  background-size: auto, 100%, auto;
  background-position: center, 20px -20px, center;
  color: #161616;
  border: none;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255.5), 0 2px 5px rgba(0, 0, 0, 0.25);
  border-bottom: 5px solid #fff !important;
  color: #131313 !important;
  border-bottom: none !important;
  border-top: none !important;
}

.card.player .card-body .content-header .team-logo img {
  width: 50px;
  vertical-align: top;
}

.card.player.with-footer .card-body,
.card.player.player-stats .right-col ul.stats-list,
.card.player.player-stats .left-col {
  height: 40%;
}

.card.player.player-stats .right-col ul.stats-list.solo-stat {
  justify-content: flex-start;
  padding: 0.5625rem;
}

span.stat-value {
  color: #f8f9fa;
  text-shadow: 0 0 5px rgba(0, 0, 0, 0.8);
}

.card.player .card-body .content-header span.firstline,
.card .content-header span.firstline {
  display: block;
  width: fit-content;
  background-color: #1a1a1a;
  color: #fff;
  line-height: 0.9;
  font-size: 1rem;
  padding: 5px 10px;
  font-weight: bold;
}

.card.player .card-body .content-header span.secondline,
.card .content-header span.secondline {
  display: block;
  width: fit-content;
  background-color: #fff;
  color: #1a1a1a;
  line-height: 0.9;
  font-size: 2.25rem;
  padding: 5px 10px;
  font-weight: bold;
}

.layered-image-cap h2.content-header {
  position: absolute;
  bottom: 0.5rem;
  left: 1rem;
}

.stat-value sup {
  top: -0.25em;
}

.card.player.player-stats .right-col ul.stats-list li {
  border-bottom: 1px solid;
  padding: 0.25rem 0;
  text-align: center;
}

.card.player.player-stats .right-col ul.stats-list li .stat-unit {
  font-size: 0.7rem;
  margin-left: 0;
  color: #fff;
  font-style: italic;
  text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}

.card.player.player-stats.multi-stat.dark .card-footer .list-group-item {
  padding: 0.5rem;
  font-size: 0.9rem;
}

.entry-meta {
  flex-direction: column;
  width: 2rem;
  background: #000;
  color: #fff;
  margin: -5px 0 -5px -26px;
}

.entry-meta span:last-of-type {
  background: #f3bc1c;
  color: #000;
}

.entry-meta span {
  flex-grow: 1;
  text-align: center;
  font-weight: bold;
  font-size: 0.75rem;
  flex-direction: column;
  justify-content: center;
}

stat-info2 {
  font-size: 1.25rem;
}

@media (max-width: 575.98px) {
  .jumbotron.profile[data-contacttype="126840001"] {
    margin-bottom: 1rem;
    overflow: hidden;
    margin-top: 0px !important;
    background-size: cover !important;
    background: url(/bf8944a6dbbaed7c1e8b.jpg) !important;
    width: 100%;
  }
}

.jumbotron.profile > .container {
  height: 100%;
  position: relative;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgNjQyLjEyIDY3NyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtNjExLjQ3IDI4Ni43Ni00MjIuMS0yNzQuMjJjLTM3LjM2LTI0LjI3LTg3LjM2LTIuMjYtOTQuNjggNDEuNjlsLTkxLjMgNTQ4LjE0Yy04LjQzIDUwLjU5IDQ0Ljg1IDg4Ljg1IDkwLjEgNjQuNzFsNTEzLjQxLTI3My45MmM0MS41My0yMi4xNiA0NC4wNi04MC43NiA0LjU4LTEwNi40eiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZjJkNjAwIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS13aWR0aD0iNSIvPjwvc3ZnPg==) !important;
  margin-bottom: 50px;
}

@media (max-width: 575.98px) {
  span.surname {
    font-size: 30px !important;
    margin-right: -250px;
    position: absolute;
    bottom: 0;
  }
}

@media (min-width: 600px) {
  span.surname {
    font-size: 50px !important;
    margin-right: 0px;
  }
}

.card.player.concrete .layered-image-cap .image-cap-inner {
  background: none;
}

.graphic-absolute {
  left: unset;
}

span.stat-value.yellow.large {
  font-size: 2.5rem !important;
}

span.stat-value.yellow {
  color: #f1ca11;
}

span.stat-value.black,
span.stat-unit.black {
  color: #1a1c22 !important;
  text-shadow: none;
}

span.stat-value.large {
  font-size: 2.75rem !important;
}

.row:has(.player-stats) {
  margin-top: 2.5rem;
}

.card.player.player-stats .left-col .card-body .position .team-logo img {
  width: 60px;
}

div#bio-card {
  padding: 1.0625rem;
  border-radius: 9px;
  background: linear-gradient(180deg, #303030 0%, rgb(0, 0, 0) 100%);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2), 0 5px 5px rgba(0, 0, 0, 0.4);
}

.card.multi-stat.grey {
  border-radius: 9px;
  background: linear-gradient(180deg, #303030 0%, rgb(0, 0, 0) 100%);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2), 0 5px 5px rgba(0, 0, 0, 0.4);
  border: none;
}

#bio-card .list-group-item,
.card.multi-stat.grey .list-group-item {
  color: #dbdbdb;
  border-color: rgba(255, 255, 255, 0.1882352941);
}
#bio-card .list-group-item a {
  color: white;
  font-weight: bold;
}

.card li.list-group-item,
.card li.list-group-item span:not(.stat-label) {
  font-weight: bold;
}

span.xl-stat {
  font-size: 1.3rem !important;
}

nav#top-branding {
  display: none;
}

footer.footer,
#sub-footer {
  display: none !important;
}

div.italic2 {
  padding-bottom: 5px;
  padding-top: 5px;
  font-size: 18px;
  font-weight: 800;
  margin-left: 0px;
  font-style: italic;
  border-bottom: 1px;
}

span.light {
  border-bottom: 0px;
}

.media-card-buttons {
  color: #f3bc1c;
}

/* ===== Social Icons Styles ===== */
div#socials {
  color: #f5c900;
  background-image: linear-gradient(transparent, #f2d600),
    url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0iTGF5ZXJfMiIgZGF0YS1uYW1lPSJMYXllciAyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgNDgwLjcxIDM5Ny4xNSI+CiAgPGRlZnM+CiAgICA8c3R5bGU+CiAgICAgIC5jbHMtMSB7CiAgICAgICAgY2xpcC1wYXRoOiB1cmwoI2NsaXBwYXRoKTsKICAgICAgfQoKICAgICAgLmNscy0yLCAuY2xzLTMgewogICAgICAgIGZpbGw6ICNmM2RmM2U7CiAgICAgIH0KCiAgICAgIC5jbHMtNCB7CiAgICAgICAgY2xpcC1wYXRoOiB1cmwoI2NsaXBwYXRoLTEpOwogICAgICB9CgogICAgICAuY2xzLTMgewogICAgICAgIHN0cm9rZS13aWR0aDogMHB4OwogICAgICB9CiAgICA8L3N0eWxlPgogICAgPGNsaXBQYXRoIGlkPSJjbGlwcGF0aCI+CiAgICAgIDxwYXRoIGNsYXNzPSJjbHMtMyIgZD0ibTQ2NC42NSwxNjIuMjFMMjIzLjc5LDUuNzNjLTIxLjMyLTEzLjg1LTQ5Ljg1LTEuMjktNTQuMDMsMjMuNzlsLTUyLjEsMzEyLjc4Yy00LjgxLDI4Ljg3LDI1LjU5LDUwLjcsNTEuNDEsMzYuOTNsMjkyLjk2LTE1Ni4zYzIzLjctMTIuNjQsMjUuMTQtNDYuMDgsMi42MS02MC43MlptLTExMS4yNyw1LjMxbC0uMTgsMS4wNGMtMS40MSw4LjAyLTMuOCwxNS4yNy03LjExLDIxLjc0LTEuODksMy43LTQuMDgsNy4xNC02LjU1LDEwLjMyLTEuMjQsMS41OS0yLjU1LDMuMTEtMy45Myw0LjU3LTIuNzYsMi45Mi01LjgsNS41Ny05LjEyLDcuOTUtLjgzLjYtMS42NywxLjE3LTIuNTQsMS43NC0xMi4wNyw3Ljg2LTI3LjQyLDEyLjQxLTQ1LjU1LDEzLjQybDguMjQtNDYuNzdoMTYuNjFsNS0yOC4zOGgtNjEuNTlzLTUsMjguMzgtNSwyOC4zOGgxNi42MXMtMTcuMjYsOTcuOTItMTcuMjYsOTcuOTJsLTQ1Ljg5LTM3LjAxaDBzMjQuMTMtMTM2LjkzLDI0LjEzLTEzNi45M2g3MC41OGM4Ljc0LDAsMTYuNTYuNjcsMjMuNDgsMS45NywyLjUyLjQ3LDQuOTEsMS4wMyw3LjE5LDEuNjgsMS4xNC4zMiwyLjI1LjY2LDMuMzMsMS4wMiwyLjcuOTEsNS4yMiwxLjk0LDcuNTYsMy4xLDEuNC43LDIuNzQsMS40NCw0LjAyLDIuMjIuODUuNTIsMS42NywxLjA3LDIuNDYsMS42My43OS41NiwxLjU1LDEuMTUsMi4yOSwxLjc1LDQuMDQsMy4zMiw3LjIyLDcuMjIsOS41NywxMS42OS42NCwxLjIyLDEuMjIsMi40OCwxLjczLDMuNzguNTIsMS4zLjk3LDIuNjQsMS4zNiw0LjAzLjc4LDIuNzcsMS4zMiw1LjY5LDEuNjIsOC43OC4yLDIuMDYuMjksNC4xOC4yOCw2LjM4LS4wMyw0LjM5LS40OCw5LjA2LTEuMzUsMTMuOTlaIi8+CiAgICA8L2NsaXBQYXRoPgogICAgPGNsaXBQYXRoIGlkPSJjbGlwcGF0aC0xIj4KICAgICAgPHJlY3QgY2xhc3M9ImNscy0zIiB5PSIxMS45OCIgd2lkdGg9IjQzMy4xIiBoZWlnaHQ9IjM2Ni45MSIgcng9IjQ0LjU3IiByeT0iNDQuNTciLz4KICAgIDwvY2xpcFBhdGg+CiAgPC9kZWZzPgogIDxnIGlkPSJMYXllcl8xLTIiIGRhdGEtbmFtZT0iTGF5ZXIgMSI+CiAgICA8Zz4KICAgICAgPHBhdGggY2xhc3M9ImNscy0yIiBkPSJtNDY0LjY1LDE2Mi4yMUwyMjMuNzksNS43M2MtMjEuMzItMTMuODUtNDkuODUtMS4yOS01NC4wMywyMy43OWwtNTIuMSwzMTIuNzhjLTQuODEsMjguODcsMjUuNTksNTAuNyw1MS40MSwzNi45M2wyOTIuOTYtMTU2LjNjMjMuNy0xMi42NCwyNS4xNC00Ni4wOCwyLjYxLTYwLjcyWm0tMTExLjI3LDUuMzFsLS4xOCwxLjA0Yy0xLjQxLDguMDItMy44LDE1LjI3LTcuMTEsMjEuNzQtMS44OSwzLjctNC4wOCw3LjE0LTYuNTUsMTAuMzItMS4yNCwxLjU5LTIuNTUsMy4xMS0zLjkzLDQuNTctMi43NiwyLjkyLTUuOCw1LjU3LTkuMTIsNy45NS0uODMuNi0xLjY3LDEuMTctMi41NCwxLjc0LTEyLjA3LDcuODYtMjcuNDIsMTIuNDEtNDUuNTUsMTMuNDJsOC4yNC00Ni43N2gxNi42MWw1LTI4LjM4aC02MS41OXMtNSwyOC4zOC01LDI4LjM4aDE2LjYxcy0xNy4yNiw5Ny45Mi0xNy4yNiw5Ny45MmwtNDUuODktMzcuMDFoMHMyNC4xMy0xMzYuOTMsMjQuMTMtMTM2LjkzaDcwLjU4YzguNzQsMCwxNi41Ni42NywyMy40OCwxLjk3LDIuNTIuNDcsNC45MSwxLjAzLDcuMTksMS42OCwxLjE0LjMyLDIuMjUuNjYsMy4zMywxLjAyLDIuNy45MSw1LjIyLDEuOTQsNy41NiwzLjEsMS40LjcsMi43NCwxLjQ0LDQuMDIsMi4yMi44NS41MiwxLjY3LDEuMDcsMi40NiwxLjYzLjc5LjU2LDEuNTUsMS4xNSwyLjI5LDEuNzUsNC4wNCwzLjMyLDcuMjIsNy4yMiw5LjU3LDExLjY5LjY0LDEuMjIsMS4yMiwyLjQ4LDEuNzMsMy43OC41MiwxLjMuOTcsMi42NCwxLjM2LDQuMDMuNzgsMi43NywxLjMyLDUuNjksMS42Miw4Ljc4LjIsMi4wNi4yOSw0LjE4LjI4LDYuMzgtLjAzLDQuMzktLjQ4LDkuMDYtMS4zNSwxMy45OVoiLz4KICAgICAgPGcgY2xhc3M9ImNscy0xIj4KICAgICAgICA8Zz4KICAgICAgICAgIDxyZWN0IGNsYXNzPSJjbHMtMiIgeT0iMTEuOTgiIHdpZHRoPSI0MzMuMSIgaGVpZ2h0PSIzNjYuOTEiIHJ4PSI0NC41NyIgcnk9IjQ0LjU3Ii8+CiAgICAgICAgICA8ZyBjbGFzcz0iY2xzLTQiPgogICAgICAgICAgICA8cGF0aCBjbGFzcz0iY2xzLTMiIGQ9Im00MTEuMjQsMjQyLjM2YzQuODYtNi4yNCw5LjE2LTEzLDEyLjg3LTIwLjI2LDYuNDktMTIuNzEsMTEuMTktMjYuOTUsMTMuOTYtNDIuN2wuMzYtMi4wNGMxLjcxLTkuNjgsMi42LTE4Ljg1LDIuNjUtMjcuNDcuMDMtNC4zMS0uMTUtOC40OS0uNTQtMTIuNTMtLjU5LTYuMDYtMS42NS0xMS44MS0zLjE5LTE3LjI0LS43Ny0yLjcyLTEuNjYtNS4zNS0yLjY3LTcuOTEtMS4wMS0yLjU2LTIuMTUtNS4wMy0zLjQtNy40Mi00LjYtOC43Ny0xMC44NS0xNi40NC0xOC43OS0yMi45NS0xLjQ0LTEuMTgtMi45NC0yLjMzLTQuNS0zLjQ0LTEuNTYtMS4xMS0zLjE3LTIuMTctNC44My0zLjItMi41LTEuNTQtNS4xMy0zLTcuODktNC4zNy00LjU5LTIuMjgtOS41NC00LjMxLTE0Ljg1LTYuMDktMi4xMi0uNzEtNC4zLTEuMzgtNi41NC0yLjAxLTQuNDgtMS4yNi05LjE5LTIuMzYtMTQuMTMtMy4yOS0xMy41OS0yLjU2LTI4Ljk1LTMuODctNDYuMTEtMy44N2gtMTM4LjYxbC00Ny4zOSwyNjguOWgwczkwLjEyLDcyLjY4LDkwLjEyLDcyLjY4bDMzLjg5LTE5Mi4yOWgtMzIuNjEsMHM5LjgyLTU1LjczLDkuODItNTUuNzNoMTIwLjk2bC05LjgyLDU1LjczaDBzLTMyLjYxLDAtMzIuNjEsMGwtMTYuMTksOTEuODRjMzUuNjEtMS45OSw2NS43NS0xMC45MSw4OS40NS0yNi4zNSwxLjY5LTEuMSwzLjM1LTIuMjQsNC45OC0zLjQxLDYuNTEtNC42OCwxMi40OC05Ljg4LDE3LjkxLTE1LjYxLDIuNzEtMi44Niw1LjI4LTUuODUsNy43Mi04Ljk4WiIvPgogICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgICAgPC9nPgogICAgPC9nPgogIDwvZz4KPC9zdmc+),
    linear-gradient(#f3bc1c, #f2d600);
  background-repeat: no-repeat;
  background-size: auto, 100%, auto;
  background-position: center, 20px -20px, center;
  color: #161616;
  border: none;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255.5), 0 2px 5px rgba(0, 0, 0, 0.25);
  border-bottom: 5px solid #fff !important;
  color: #131313 !important;
  border-bottom: none !important;
}

#socials ul {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 1rem 0rem;
  gap: 0.5rem;
}

#socials li {
  display: flex;
  align-items: center;
  justify-content: center;
}

#socials a {
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.2s ease;
  text-decoration: none;
}

#socials a:hover {
  opacity: 0.8;
}

/* Images - no black background, they already have it */
div#socials img.img-fluid {
  width: auto;
  height: 3rem;
  object-fit: contain;
  display: block;
}

/* Icons - need black background container */
#socials i {
  font-size: 2rem;
  color: black;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: transparent;
}

/* YouTube icon specific padding */
#socials a[data-type="youtube"] i {
  font-size: 3.3rem;
}

/* Instagram icon specific padding */
#socials a[data-type="instagram"] i {
  padding: 7px;
  font-size: 2rem;
  background: black;
  color: #f1d006;
}

/* Facebook icon specific padding - match Instagram */
#socials a[data-type="facebook"] i {
  padding: 7px;
  font-size: 2.6rem;
}

/* Remove Facebook positioning override */
.social-link[data-type="facebook"],
#socials a[href*="facebook.com"] {
  position: static;
  top: auto;
}

/* Roster container spacing */
#roster-container {
  margin-top: 7.5rem;
}

/* ===== Generic Event Card Styles ===== */
.generic-event-card {
  position: relative;
}

.generic-event-card .event-more-options {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 1rem;
  margin-bottom: 0;
  color: #000000;
  cursor: pointer;
  background: #f5be1c;
  border-radius: 4px;
  padding: 0.2rem 0.5rem;
  text-decoration: none;
  font-weight: bold;
  gap: 6px;
}

/* ===== Card Quick Navigation Styles ===== */
.card-quick-nav {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  border-bottom: 1px solid rgba(16, 16, 16, 0.2);
  border-radius: 0 0 6px 6px;
  margin-top: -1rem;
  margin-bottom: 0.5rem;
}

.quick-nav-item {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  color: #6c6c6c;
  text-decoration: none !important;
  font-size: 0.875rem;
  font-weight: 500;
  padding: 7px;
  border-radius: 3px;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.quick-nav-item:link,
.quick-nav-item:visited {
  text-decoration: none !important;
}

.quick-nav-item:hover {
  background: #f9ebbf;
  color: black;
  text-decoration: none;
}

.quick-nav-item:active {
  background: #f3bc1c;
  color: black;
  text-decoration: underline !important;
}

.quick-nav-item i {
  font-size: 1rem;
  color: #f5be1c9c;
}

.quick-nav-item:hover i,
.quick-nav-item:active i {
  color: black;
}

.nav-divider {
  color: rgba(42, 44, 46, 0.3);
  font-weight: 300;
}

@media (max-width: 576px) {
  .card-quick-nav {
    gap: 0.5rem;
  }

  .quick-nav-item {
    font-size: 0.65rem;
    padding: 3px 4px;
    gap: 0.15rem;
    flex-shrink: 1;
    min-width: 0;
  }

  .quick-nav-item i {
    font-size: 0.9rem;
    flex-shrink: 0;
  }

  .quick-nav-item span {
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 50px;
  }

  .nav-divider {
    flex-shrink: 0;
    margin: 0 0.05rem;
    font-size: 0.8rem;
  }
}

/* ===== Generic Baseball Game Event Card Styles ===== */
.generic-baseball-game-event-card {
  position: relative;
  background: white;
  color: #000;
  border-radius: 12px;
  padding: 1rem;
  margin-bottom: 1.5rem;
  position: relative;
  border-top: 6px solid #f5be1c;
  margin-top: 2rem;
}

.generic-baseball-game-event-card .event-more-options {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 1rem;
  margin-bottom: 0;
  color: #000000;
  cursor: pointer;
  background: #f5be1c;
  border-radius: 4px;
  padding: 0.2rem 0.5rem;
  text-decoration: none;
  font-weight: bold;
  gap: 6px;
}

/* ===== Event Info Wrapper Styles ===== */
.event-info-wrapper {
  position: relative;
  min-height: 24px; /* Ensure space for 3-dot button even without location */
}

/* ===== Box Score Styles ===== */
.boxscore-section {
  max-height: 75vh;
  overflow-y: auto;
  margin-bottom: 2rem;
  border: 1px solid #ddd;
  border-radius: 6px;
}

.boxscore-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
  background: #fff;
  color: #000;
  table-layout: fixed;
}

.boxscore-table thead th {
  position: sticky;
  top: 0;
  background: #070707;
  z-index: 2;
  padding: 10px 6px;
  font-weight: 600;
  text-align: left;
  border: none;
}

.boxscore-table td {
  padding: 10px 6px;
  border-bottom: 1px solid #eee;
  color: black;
}

.boxscore-table th:first-child,
.boxscore-table td:first-child {
  width: 40%;
  padding-left: 15px;
}

.boxscore-table th:not(:first-child),
.boxscore-table td:not(:first-child) {
  width: 10%;
}

.box-score-container {
  display: none;
  margin-top: 1rem;
}

.box-score-container.show {
  display: block;
}

/* ===== Box Score Button Styles ===== */
/* Default boxscore button (disabled state) */
.boxscore-btn {
  border: none;
  padding: 3px 10px;
  font-size: 0.8rem;
  border-radius: 4px;
  cursor: not-allowed;
  font-weight: bold;
  width: 80px;
  text-align: center;
  background-color: #e6e6e6;
  color: #666;
  box-shadow: none;
}

/* Enabled boxscore button before selection */
.boxscore-btn.has-boxscore {
  background-color: white;
  color: #000;
  cursor: pointer;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* Selected boxscore button */
.boxscore-btn.active {
  background-color: #f5be1c;
  color: #000;
  box-shadow: none;
}

/* ===== Boxscore Card Container Styles ===== */
.boxscore-card-container {
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.boxscore-card-container .score-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
  background: #fff;
  color: #000;
  table-layout: fixed;
  border: 1px solid #ddd;
  border-radius: 6px;
  overflow: hidden;
}

.boxscore-card-container .score-table thead th {
  background: #f8f9fa;
  border-bottom: 1px solid #dee2e6;
  padding: 8px 6px;
  font-weight: 600;
  text-align: center;
  color: #495057;
}

.boxscore-card-container .score-table tbody td {
  padding: 0px 3px;
  border-bottom: 1px solid #e9ecef;
  text-align: center;
  color: #212529;
}

.boxscore-card-container .score-table tbody tr:last-child td {
  border-bottom: none;
}

.boxscore-card-container .score-table th:first-child,
.boxscore-card-container .score-table td:first-child {
  text-align: left;
  padding-left: 12px;
  font-weight: 600;
  background: #f8f9fa;
  width: 15%;
}

.boxscore-card-container .score-table .inning-score {
  font-weight: 500;
}

.boxscore-card-container .score-table .total-score {
  font-weight: 700;
  background: #f8f9fa;
}

/* Mobile responsive adjustments for score table */
@media (max-width: 576px) {
  .boxscore-card-container .score-table {
    font-size: 0.75rem;
  }

  .boxscore-card-container .score-table th,
  .boxscore-card-container .score-table td {
    padding: 6px 4px;
  }

  .boxscore-card-container .score-table th:first-child,
  .boxscore-card-container .score-table td:first-child {
    padding-left: 8px;
  }
}

/* ===== Media Card Buttons Styling ===== */
.media-card-buttons {
  color: #f3bc1c;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.5rem;
  width: 100%;
  padding: 0 1rem;
  box-sizing: border-box;
}

.media-navigation-buttons {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  flex-wrap: wrap;
}

.media-action-buttons {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  align-items: center;
}

.media-player-name,
.media-event-link {
  color: #ffffff;
  border: 1px solid #ffffff33;
  border-radius: 25px;
  padding: 0.5rem 0.75rem;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  transition: all 0.2s ease;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  text-decoration: none !important;
  font-size: 0.9rem;
  font-weight: normal;
}

.media-player-name:hover,
.media-event-link:hover,
.tp-share:hover,
.tp-download:hover {
  text-decoration: none;
  background-color: rgba(243, 188, 28, 0.1);
}

.media-player-name:hover,
.media-event-link:hover {
  color: #ffffff;
}

.tp-share:hover,
.tp-download:hover {
  color: #f5be1c;
}

.media-player-name:active,
.media-event-link:active,
.media-player-name.active,
.media-event-link.active,
.tp-share:active,
.tp-download:active,
.tp-share.active,
.tp-download.active {
  background-color: #f3bc1c !important;
  color: #000 !important;
  border-color: #f3bc1c !important;
  transform: scale(0.95);
}

.media-player-name:focus,
.media-event-link:focus,
.tp-share:focus,
.tp-download:focus {
  outline: none;
}

.media-player-name i,
.media-event-link i {
  color: #f5be1c;
  font-size: 1rem;
  transition: color 0.2s ease;
}

.media-player-name:active i,
.media-event-link:active i,
.media-player-name.active i,
.media-event-link.active i {
  color: #000 !important;
}

/* Ensure normal state is restored after active */
.media-player-name:not(:active):not(.active) i,
.media-event-link:not(:active):not(.active) i {
  color: #f5be1c !important;
}

.media-player-name:not(:active):not(.active),
.media-event-link:not(:active):not(.active) {
  color: #ffffff !important;
}

.tp-share,
.tp-download {
  color: #f5be1c;
  border: 1px solid #ffffff33;
  border-radius: 25px;
  padding: 0.6rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  font-size: 1.1rem;
  font-weight: normal;
  margin-bottom: 0;
}

@media (max-width: 768px) {
  .media-navigation-buttons {
    gap: 0.5rem;
  }

  .media-player-name,
  .media-event-link {
    padding: 0.4rem 0.6rem;
    font-size: 0.85rem;
  }

  .media-player-name i,
  .media-event-link i {
    font-size: 0.9rem;
  }

  .tp-share,
  .tp-download {
    padding: 0.6rem;
    font-size: 1rem;
  }
}

@media (max-width: 768px) {
  .tp-share:active,
  .tp-download:active,
  .tp-share.active,
  .tp-download.active {
    background-color: #f3bc1c !important;
    color: #000 !important;
  }
}

/* ===== Media Card Styles ===== */
.card.single-stat.mid-dark {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.0625rem;
  border-radius: 9px;
  background: linear-gradient(180deg, #303030 0%, rgb(0, 0, 0) 100%);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2), 0 5px 5px rgba(0, 0, 0, 0.4);
}

.card.single-stat,
.card.gauge-stat {
  padding: 0 0 1rem;
}

video {
  max-width: 100%;
  height: auto;
}

.card-header.latest {
  border-bottom: 5px solid #f3bc1c !important;
}

.card-header.latest h5 {
  color: #f3bc1c;
  font-style: italic;
  text-transform: uppercase;
  text-align: right;
  padding: 0 1rem;
}

/* ===== PDF Viewer Styles ===== */
.pdf-viewer-container {
  position: relative;
  width: 100%;
  height: 500px;
  border: 1px solid #dee2e6;
  border-radius: 0.375rem;
  overflow: hidden;
  background-color: #f8f9fa;
}

.pdf-iframe {
  width: 100%;
  height: 100%;
  border: none;
  background-color: #fff;
  opacity: 1;
  transition: opacity 0.3s ease-in-out;
}

.pdf-fallback {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  background-color: rgba(255, 255, 255, 0.95);
  padding: 2rem;
  border-radius: 0.375rem;
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  display: none;
}

/* Show fallback when iframe fails to load */
.pdf-viewer-container:has(.pdf-iframe[src=""]) .pdf-fallback,
.pdf-viewer-container .pdf-iframe:not([src]) + .pdf-fallback {
  display: block;
}

/* Responsive PDF viewer */
@media (max-width: 768px) {
  .pdf-viewer-container {
    height: 400px;
  }
}

@media (max-width: 576px) {
  .pdf-viewer-container {
    height: 300px;
  }

  .pdf-fallback {
    padding: 1rem;
  }

  .pdf-fallback p {
    font-size: 0.9rem;
  }
}

/* PDF card body full width */
.card:has(.pdf-viewer-container) .card-body {
  width: 100% !important;
  padding: 0 !important;
}

/* Mobile PDF fallback styling */
@media (max-width: 768px) {
  .pdf-fallback {
    position: relative !important;
    transform: none !important;
    top: auto !important;
    left: auto !important;
    padding: 1.5rem !important;
    background-color: #f8f9fa !important;
    border-radius: 0.375rem;
  }

  .pdf-viewer-container {
    height: auto !important;
    min-height: 200px;
  }
}

/* ===== Baseball Action Type Color Styles ===== */
/* Pitching types */
.group-accordion-header[data-baseball-type="baseball-fastball"] > span {
  color: var(--baseball-fastball-color) !important;
}

.group-accordion-header[data-baseball-type="baseball-curveball"] > span {
  color: var(--baseball-curveball-color) !important;
}

.group-accordion-header[data-baseball-type="baseball-changeup"] > span {
  color: var(--baseball-changeup-color) !important;
}

.group-accordion-header[data-baseball-type="baseball-sinker"] > span {
  color: var(--baseball-sinker-color) !important;
}

.group-accordion-header[data-baseball-type="baseball-slider"] > span {
  color: var(--baseball-slider-color) !important;
}

/* Hitting types */
.group-accordion-header[data-baseball-type="baseball-groundball"] > span {
  color: var(--baseball-groundball-color) !important;
}

.group-accordion-header[data-baseball-type="baseball-line-drive"] > span {
  color: var(--baseball-line-drive-color) !important;
}

.group-accordion-header[data-baseball-type="baseball-fly-ball"] > span {
  color: var(--baseball-fly-ball-color) !important;
}

.group-accordion-header[data-baseball-type="baseball-pop-up"] > span {
  color: var(--baseball-pop-up-color) !important;
}

/* Default for types without specific colors */
.group-accordion-header:not([data-baseball-type]) > span,
.group-accordion-header[data-baseball-type="baseball-other"] > span {
  color: var(--baseball-default-color) !important;
}

/* ===== Media Gallery Masonry Grid Styles ===== */
.team-history-title {
  font-weight: bold;
  font-size: 1.25rem;
  margin-bottom: 1rem;
  color: #fff;
  margin-top: 1rem;
}

.media-gallery-grid {
  column-count: 3;
  column-gap: 1.5rem;
  margin-bottom: 2rem;
}

.media-gallery-item {
  background: linear-gradient(180deg, #303030 0%, rgb(0, 0, 0) 100%);
  border-radius: 9px;
  overflow: hidden;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, .2), 0 5px 5px rgba(0, 0, 0, .4);
  transition: transform 0.2s, box-shadow 0.2s;
  break-inside: avoid;
  margin-bottom: 1.5rem;
  display: inline-block;
  width: 100%;
}

.media-gallery-item:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 15px rgba(0, 0, 0, .5);
}

.media-gallery-overlay {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: #000;
}

.media-gallery-thumbnail {
  width: 100%;
  height: auto;
  display: block;
  transition: opacity 0.2s;
  transform: translateZ(0);
  backface-visibility: hidden;
  will-change: transform;
}

.media-gallery-thumbnail:hover {
  opacity: 0.9;
}

.media-gallery-item video {
  width: 100%;
  height: auto;
}

.media-gallery-actions {
  display: flex;
  gap: 0.5rem;
  margin-left: auto;
}

.media-gallery-actions i {
  color: white;
  cursor: pointer;
  font-size: 1rem;
  transition: color 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
}

.media-gallery-actions i:hover {
  color: #f3bc1c;
}

.media-gallery-info {
  padding: 1rem;
}

.media-gallery-player-info {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 0.5rem;
  font-size: 0.9rem;
  flex-wrap: wrap;
  justify-content: space-between;
}

.media-gallery-player-info a {
  color: white;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  transition: color 0.2s;
}

.media-gallery-player-info a:hover {
  color: #f3bc1c;
}

/* Expand overlay for videos on desktop - clickable area that doesn't interfere with controls */
.media-gallery-expand-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 80%;
  cursor: pointer;
  z-index: 5;
  display: none;
  background: transparent;
}

/* Show expand overlay on desktop only */
@media (min-width: 769px) {
  .media-gallery-expand-overlay {
    display: block;
  }
  
  .media-gallery-thumbnail {
    cursor: pointer;
  }
  
  .media-gallery-thumbnail img {
    cursor: pointer;
  }
  
  .media-gallery-thumbnail video {
    cursor: pointer;
  }
}

@media (max-width: 992px) {
  .media-gallery-grid {
    column-count: 2;
  }
}

@media (max-width: 576px) {
  .media-gallery-grid {
    column-count: 1;
  }
}

@media (max-width: 768px) {
  .media-gallery-expand-overlay {
    display: none !important;
  }
  
  .media-gallery-thumbnail {
    cursor: default;
  }
}

/* ===== Media Modal/Lightbox Styles ===== */
.media-modal {
  display: none;
  position: fixed;
  z-index: 9999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.9);
  overflow: auto;
  align-items: center;
  justify-content: center;
}

.media-modal.active {
  display: flex;
}

.media-modal-content {
  position: relative;
  margin: auto;
  max-width: 90%;
  max-height: 90vh;
  width: auto;
  height: auto;
}

.media-modal-content img,
.media-modal-content video {
  max-width: 100%;
  max-height: 90vh;
  width: auto;
  height: auto;
  display: block;
  border-radius: 8px;
}

.media-modal-content video {
  width: 100%;
  max-width: 1200px;
}

.media-modal-close {
  position: absolute;
  top: 20px;
  right: 35px;
  color: #f1f1f1;
  font-size: 40px;
  font-weight: bold;
  cursor: pointer;
  z-index: 10000;
  transition: color 0.2s;
}

.media-modal-close:hover,
.media-modal-close:focus {
  color: #f3bc1c;
  text-decoration: none;
}

@media (max-width: 768px) {
  .media-modal {
    display: none !important;
  }
}