/*
File Name: 		custom.css
Description:  You can add your custom CSS here and it will overwrite template styles
init.js --> $color_primary = '#1892ed';
*/

/* Organization Color Adjustments */
:root {
  /* use: var(--primary-color)*/
  /* Default */
  --primary-color: #1892ed;
  /* Curremt Theme */
  /* --primary-color: #da191e; */
}

.player-heading {
  background-image: url("../images/soccer/page-heading.jpg");
}

.card__header::before {
  background-color: var(--primary-color);
}

.alc-event-team
  + .alc-event-team.alc-event-team--winner
  .alc-event-team__score::after {
  border-left: 8px solid var(--primary-color);
}

.alc-event-team--winner .alc-event-team__score::after {
  border-right: 8px solid var(--primary-color);
}

.widget-game-result__score-result--winner::before {
  border-left: 8px solid var(--primary-color);
}

.text-primary {
  color: var(--primary-color) !important;
}

.nav-account .nav-account__item > a .highlight {
  color: var(--primary-color) !important;
}

.widget-results__score-winner::before {
  border-left: 4px solid var(--primary-color);
}

.widget-results__score-loser ~ .widget-results__score-winner::after {
  border-right: 4px solid var(--primary-color);
}

.main-nav .main-nav__list > li > a .highlight {
  color: var(--primary-color);
}

.footer-secondary--has-decor .footer-secondary__inner::before,
.footer-secondary--has-decor .footer-secondary__inner::after {
  background-color: var(--primary-color) !important;
}

.btn-action-f90 {
  background-color: var(--primary-color) !important;
  color: #fff;
  border-color: transparent;
}

.btn-action-f90:hover {
  background-color: var(--primary-color) !important;
  filter: brightness(1.2);
}

.a-action-f90 {
  color: var(--primary-color) !important;
}

.a-action-f90:hover {
  color: var(--primary-color) !important;
  filter: brightness(1.2);
}

.content-filter__link::before {
  background-color: var(--primary-color);
}

.featured-carousel .slick-dots li.slick-active button,
.player-info .slick-dots li.slick-active button {
  background-color: var(--primary-color);
}

/* ./END Organization Color Adjustments */

.modal--login .modal-account__item--logo {
  background-image: url("../images/LOGO_F90_c.png"),
    url("../images/soccer/page-heading_red.jpg");
  background-position: center -30px, center;
  background-size: contain, cover;
  background-repeat: no-repeat, no-repeat;
}

.curs-pointer {
  cursor: pointer;
}

@media (max-width: 991px) {
  .modal--login .modal-account__item {
    flex-basis: 100%;
  }
}

.modal-dialog {
  margin-top: 85px;
}

/* Animated Arrows */
.lock-unlock {
  /* display: flex;  */
  align-items: center;
  gap: 8px;
  font-size: 24px;
}

.lock-unlock span {
  animation: fadeMove 1.5s infinite;
}

.simple-arrows {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 24px;
}

.simple-arrows span {
  animation: fadeMove 1.5s infinite;
}

/* Animação das setas */
@keyframes fadeMove {
  0%,
  100% {
    opacity: 0.4;
  }

  50% {
    opacity: 1;
  }
}

/* Estilo para o ícone */
.simple-arrows i {
  font-size: 24px;
}

/* ./END Animated Arrows */

.item-featured {
  border-radius: 50%;
  border: 2px solid var(--primary-color);
  width: inherit;
  height: inherit;
}

.header-title h1 {
  display: block;
  font-size: 0;
  color: transparent;
  height: 0;
}

.header-title h2 {
  display: block;
  font-size: 0;
  color: transparent;
  height: 0;
}

.header-title p {
  display: block;
  font-size: 0;
  color: transparent;
  height: 0;
}

.post-filter__select .post-filter__label {
  top: 28px;
}

.no-link {
  cursor: default !important;
}

.icon-widget-title-24 {
  font-size: 24px;
  vertical-align: middle;
}

/* Navigation */
.header--layout-1 .header__primary-inner::before {
  width: 175px;
}

@media (min-width: 992px) and (max-width: 1345px) {
  .header-search-form {
    width: 200px;
  }
}

.main-nav {
  text-align: left;

  @media (min-width: 992px) {
    margin-left: 150px;
  }
}

.main-nav__list > li > a:hover::before {
  background-color: transparent !important;
  box-shadow: inset 0 -5px 0 0 var(--primary-color);
}

.main-nav__list > li > a {
  padding: 0 15px;
}

.main-nav__list > li.active > a {
  color: var(--primary-color);
  text-decoration: none;
  background-color: transparent;
}

.main-nav__list > li.active > a::before {
  background-color: transparent;
}

.nav-account {
  display: inline-flex;
}

input.header-mobile__search-control {
  @media (min-width: 992px) {
    background-color: #212529;
  }
}

#widget_filter {
  display: none;
}

@media (min-width: 992px) {
  #widget_filter {
    display: block;
  }
}

.card__header--has-btn > h4 {
  margin-bottom: 0;
  font-size: 12px;
}

.card__header--has-checkbox > h4 {
  margin-bottom: 0;
  font-size: 12px;
}

.card__header > h4 {
  margin-bottom: 0;
  font-size: 12px;
}

.card__header > h4 {
  margin-bottom: 0;
  font-size: 12px;
}

@media (min-width: 992px) {
  .card__header--has-btn > h4 {
    font-size: 14px;
  }

  .card__header--has-checkbox > h4 {
    font-size: 14px;
  }

  .card__header > h4 {
    font-size: 14px;
  }

  .card__header > h4 {
    font-size: 14px;
  }
}

@media (max-width: 991px) {
  .shop-filter__result {
    padding: 12px 24px 12px 24px;
  }
}

.widget-tabbed .nav.widget-tabbed__nav .nav-link.fixture-detail.active {
  border-bottom: 5px solid var(--primary-color);
}

.card__header--double::after {
  background-color: var(--primary-color);
}

.header-logo {
  bottom: 0;
}

@media only screen and (max-width: 991px) {
  .header-mobile__inner {
    height: 80px;
  }
}

/* Autocomplete */
.suggestions {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  max-height: 200px;
  overflow-y: auto;
  z-index: 1000;
}

.suggestion-item {
  padding: 10px;
  position: fixed;
  top: 62px;
  z-index: 1000;
  margin: 0;
  padding: 0;
  min-width: 240px;
  background-color: white;
  border: solid 1px #e4e7ed;
  -webkit-transform-origin: 0% 0%;
  transform-origin: 0% 0%;
  -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  transition: opacity 0.3s, -webkit-transform 0.3s;
  transition: transform 0.3s, opacity 0.3s;
  transition: transform 0.3s, opacity 0.3s, -webkit-transform 0.3s;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.suggestion-item:hover {
  background-color: #f0f0f0;
}

/* Coach Profile Search - Specific styles to avoid conflicts with navbar */
.coach-search-suggestions,
.club-search-suggestions {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  max-height: 300px;
  overflow-y: auto;
  z-index: 1000;
  background-color: white;
  border: solid 1px #e4e7ed;
  border-top: none;
  border-radius: 0 0 4px 4px;
}

.coach-search-item,
.club-search-item {
  padding: 10px;
  background-color: white;
  border-bottom: solid 1px #e4e7ed;
  position: relative;
  z-index: 1000;
  margin: 0;
  transition: background-color 0.2s ease;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.coach-search-item:last-child,
.club-search-item:last-child {
  border-bottom: none;
}

.coach-search-item:hover,
.club-search-item:hover {
  background-color: #f8f9fa;
}

.coach-search-item-content,
.club-search-item-content {
  flex: 1;
  cursor: pointer;
}

.coach-search-item-actions,
.club-search-item-actions {
  display: flex;
  gap: 8px;
  margin-left: 15px;
  flex-shrink: 0;
}

/* Responsividade para telas menores */
@media (max-width: 768px) {
  .coach-search-item,
  .club-search-item {
    flex-direction: column;
    align-items: stretch;
  }

  .coach-search-item-actions,
  .club-search-item-actions {
    margin-left: 0;
    margin-top: 10px;
    justify-content: center;
  }

  .coach-search-btn,
  .club-search-btn {
    min-width: 80px;
  }
}

/* Navigation / End */

/* Home */
.widget-tabbed .nav.widget-tabbed__nav .nav-link.active {
  color: var(--primary-color) !important;
}

.calendardate-mob-width {
  width: 40px !important;
}

/* Home / End */

.truncate {
  width: 100px;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.no-icon > span ::after {
  background-image: none !important;
}

.no-icon ::after {
  background-image: none !important;
}

@media only screen and (max-width: 991px) {
  .icon-adjust::before {
    left: 28px !important;
  }
}

.no_color::before {
  background-color: transparent !important;
}

.site-content {
  padding: 30px 0;
}

.hidden {
  display: none;
}

.options-scrollable {
  overflow-y: scroll;
  max-height: 350px;
}

@media (min-width: 992px) {
  .post-filter__submit {
    flex-grow: 0;
  }
}

@media (min-width: 1199px) {
  .widget-game-result__score-result--winner::before {
    left: -10px;
  }

  .widget-game-result__score-dash
    + .widget-game-result__score-result--winner::before {
    right: -10px;
  }
}

/* CLUB Players */
.no_counter::before {
  content: none !important;
}

/* CLUB Players ./End */

/* Player Heading */
.player-info__item--details-vertical .player-info-details {
  display: block;
}

@media (min-width: 480px) {
  .player-info__item--details-vertical .player-info-details {
    width: 80%;
    margin: 0 auto;
  }
}

@media (min-width: 992px) {
  .player-info__item--details-vertical .player-info-details {
    width: 260px;
    float: left;
    margin: 0;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .player-info__item--details-vertical .player-info-details {
    float: none;
  }
}

@media (min-width: 992px) {
  .player-info__item--details-vertical .player-info-details--extra-stats {
    width: 80%;
    float: none;
  }
}

.player-info__item--details-vertical .player-info-details__item {
  display: flex;
  align-items: baseline;
  padding: 8px 0 7px 0;
}

.player-info__item--details-vertical .player-info-details__value {
  margin-left: auto;
  font-size: 12px;
  padding-left: 20px;
  text-align: right;
}

.player-info__item--details-vertical .player-info-stats {
  padding: 20px 0 0 0;
  display: flex;
  justify-content: space-between;
  width: 100%;
}

@media (min-width: 992px) {
  .player-info__item--details-vertical .player-info-stats {
    flex-direction: row;
  }
}

@media (min-width: 1199px) {
  .player-info__item--details-vertical .player-info-stats {
    float: left;
    width: 140px;
    margin-left: 50px;
    flex-direction: column;
    padding-top: 0;
  }
}

.player-info__item--details-vertical
  .player-info-stats
  .player-info-stats__item {
  float: none;
  min-width: 33.3%;
  flex-basis: 33.3%;
}

@media (min-width: 1199px) {
  .player-info__item--details-vertical
    .player-info-stats
    .player-info-stats__item {
    min-width: 100%;
  }
}

.player-info__item--details-vertical
  .player-info-stats
  .player-info-stats__item
  .circular
  .circular__bar {
  width: 52px;
  height: 52px;
  min-width: 0;
}

@media (min-width: 992px) and (max-width: 1199px) {
  .player-info__item--details-vertical
    .player-info-stats
    .player-info-stats__item
    .circular
    .circular__bar {
    width: 44px;
    height: 44px;
  }
}

.player-info__item--details-vertical
  .player-info-stats
  .player-info-stats__item
  .circular
  .circular__bar
  .circular__percents {
  font-size: 12px;
}

.player-info__item--details-vertical
  .player-info-stats
  .player-info-stats__item
  .circular
  .circular__bar
  .circular__percents
  small {
  font-size: 8px;
}

@media (min-width: 992px) and (max-width: 1199px) {
  .player-info__item--details-vertical
    .player-info-stats
    .player-info-stats__item
    .circular
    .circular__bar
    .circular__percents {
    font-size: 12px;
  }
}

.player-info__last-name {
  color: #ffdc11 !important;
}

/* Player Heading /END */

/* Graphs */
.progress__bar-width-1 {
  width: 1%;
}

.progress__bar-width-2 {
  width: 2%;
}

.progress__bar-width-3 {
  width: 3%;
}

.progress__bar-width-4 {
  width: 4%;
}

.progress__bar-width-5 {
  width: 5%;
}

.progress__bar-width-6 {
  width: 6%;
}

.progress__bar-width-7 {
  width: 7%;
}

.progress__bar-width-8 {
  width: 8%;
}

.progress__bar-width-9 {
  width: 9%;
}

.progress__bar-width-10 {
  width: 10%;
}

.progress__bar-width-11 {
  width: 11%;
}

.progress__bar-width-12 {
  width: 12%;
}

.progress__bar-width-13 {
  width: 13%;
}

.progress__bar-width-14 {
  width: 14%;
}

.progress__bar-width-15 {
  width: 15%;
}

.progress__bar-width-16 {
  width: 16%;
}

.progress__bar-width-17 {
  width: 17%;
}

.progress__bar-width-18 {
  width: 18%;
}

.progress__bar-width-19 {
  width: 19%;
}

.progress__bar-width-20 {
  width: 20%;
}

.progress__bar-width-21 {
  width: 21%;
}

.progress__bar-width-22 {
  width: 22%;
}

.progress__bar-width-23 {
  width: 23%;
}

.progress__bar-width-24 {
  width: 24%;
}

.progress__bar-width-25 {
  width: 25%;
}

.progress__bar-width-26 {
  width: 26%;
}

.progress__bar-width-27 {
  width: 27%;
}

.progress__bar-width-28 {
  width: 28%;
}

.progress__bar-width-29 {
  width: 29%;
}

.progress__bar-width-30 {
  width: 30%;
}

.progress__bar-width-31 {
  width: 31%;
}

.progress__bar-width-32 {
  width: 32%;
}

.progress__bar-width-33 {
  width: 33%;
}

.progress__bar-width-34 {
  width: 34%;
}

.progress__bar-width-35 {
  width: 35%;
}

.progress__bar-width-36 {
  width: 36%;
}

.progress__bar-width-37 {
  width: 37%;
}

.progress__bar-width-38 {
  width: 38%;
}

.progress__bar-width-39 {
  width: 39%;
}

.progress__bar-width-40 {
  width: 40%;
}

.progress__bar-width-41 {
  width: 41%;
}

.progress__bar-width-42 {
  width: 42%;
}

.progress__bar-width-43 {
  width: 43%;
}

.progress__bar-width-44 {
  width: 44%;
}

.progress__bar-width-45 {
  width: 45%;
}

.progress__bar-width-46 {
  width: 46%;
}

.progress__bar-width-47 {
  width: 47%;
}

.progress__bar-width-48 {
  width: 48%;
}

.progress__bar-width-49 {
  width: 49%;
}

.progress__bar-width-50 {
  width: 50%;
}

.progress__bar-width-51 {
  width: 51%;
}

.progress__bar-width-52 {
  width: 52%;
}

.progress__bar-width-53 {
  width: 53%;
}

.progress__bar-width-54 {
  width: 54%;
}

.progress__bar-width-55 {
  width: 55%;
}

.progress__bar-width-56 {
  width: 56%;
}

.progress__bar-width-57 {
  width: 57%;
}

.progress__bar-width-58 {
  width: 58%;
}

.progress__bar-width-59 {
  width: 59%;
}

.progress__bar-width-60 {
  width: 60%;
}

.progress__bar-width-61 {
  width: 61%;
}

.progress__bar-width-62 {
  width: 62%;
}

.progress__bar-width-63 {
  width: 63%;
}

.progress__bar-width-64 {
  width: 64%;
}

.progress__bar-width-65 {
  width: 65%;
}

.progress__bar-width-66 {
  width: 66%;
}

.progress__bar-width-67 {
  width: 67%;
}

.progress__bar-width-68 {
  width: 68%;
}

.progress__bar-width-69 {
  width: 69%;
}

.progress__bar-width-70 {
  width: 70%;
}

.progress__bar-width-71 {
  width: 71%;
}

.progress__bar-width-72 {
  width: 72%;
}

.progress__bar-width-73 {
  width: 73%;
}

.progress__bar-width-74 {
  width: 74%;
}

.progress__bar-width-75 {
  width: 75%;
}

.progress__bar-width-76 {
  width: 76%;
}

.progress__bar-width-77 {
  width: 77%;
}

.progress__bar-width-78 {
  width: 78%;
}

.progress__bar-width-79 {
  width: 79%;
}

.progress__bar-width-80 {
  width: 80%;
}

.progress__bar-width-81 {
  width: 81%;
}

.progress__bar-width-82 {
  width: 82%;
}

.progress__bar-width-83 {
  width: 83%;
}

.progress__bar-width-84 {
  width: 84%;
}

.progress__bar-width-85 {
  width: 85%;
}

.progress__bar-width-86 {
  width: 86%;
}

.progress__bar-width-87 {
  width: 87%;
}

.progress__bar-width-88 {
  width: 88%;
}

.progress__bar-width-89 {
  width: 89%;
}

.progress__bar-width-90 {
  width: 90%;
}

.progress__bar-width-91 {
  width: 91%;
}

.progress__bar-width-92 {
  width: 92%;
}

.progress__bar-width-93 {
  width: 93%;
}

.progress__bar-width-94 {
  width: 94%;
}

.progress__bar-width-95 {
  width: 95%;
}

.progress__bar-width-96 {
  width: 96%;
}

.progress__bar-width-97 {
  width: 97%;
}

.progress__bar-width-98 {
  width: 98%;
}

.progress__bar-width-99 {
  width: 99%;
}

.progress__bar-width-100 {
  width: 100%;
}

.player-info-store {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  position: relative;
  width: 100%;
}

/* camera */
.camera-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.camera-container {
  position: relative;
  width: 370px;
  /* largura da silhueta */
  height: 400px;
  /* altura da silhueta */
  margin-right: 20px;
  /* Espaço entre a câmera e a imagem da posição */
}

#videoElement {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}

#canvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}

#silhouette {
  position: absolute;
  top: 0;
  left: 0;
  width: 370px;
  height: 400px;
  background-image: url("/assets/images/soccer/samples/soccer_player-heading-photo-2-silhouette.png");
  /* Caminho da imagem de silhueta */
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 3;
}

.position-image {
  width: 370px;
  /* Largura da imagem ao lado */
  height: 400px;
  /* Altura da imagem ao lado */
}

.position-image img {
  width: 100%;
  /* A imagem ocupará toda a largura disponível */
  height: 100%;
  /* A imagem ocupará toda a altura disponível */
  object-fit: contain;
  /* Garante que a imagem mantenha a proporção */
}

.captured-image {
  width: 370px;
  height: 400px;
  margin-top: 20px;
}

.captured-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.capture-camera {
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 4;
}

/*  */
/*  */
/*  */
/* STORE */

#templateId-3 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  position: relative;
  width: 100%;
  background-image: url(../images/store/8655047655747.png);
  width: 450px;
  /* Largura fixa */
  height: 600px;
  /* Altura fixa */
  background-size: cover;
  /* Ajusta a imagem para cobrir todo o container */
  background-position: center;
  /* Centraliza a imagem */
  background-repeat: no-repeat;
  /* Evita repetição da imagem */
}

#templateId-2 {
  background-color: #1e2024;
  /* background-image: url(/assets/images/soccer/page-heading.jpg); */
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  position: relative;
}

#templateId-2 .player-info-details__title {
  color: #fff;
}

#templateId-1 .player-info-details__title {
  color: #fff;
}

#templateId-1 {
  background-color: #1e2024;
  /* background-image: url(/assets/images/soccer/page-heading.jpg); */
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  position: relative;
}

/* #templateId-3 .player-digital-card-heading {
  background-image: url(../images/store/8655047655747.png);
  width: 450px; 
  height: 600px; 
  background-size: cover; 
  background-position: center; 
  background-repeat: no-repeat; 
} */

#templateId-3 hr {
  width: 25px;
  height: 1px;
  border: none;
  color: #ffff;
  background-color: #ffff;
  margin-top: 6px;
  margin-bottom: 6px;
}

#templateId-3 .hr-name {
  margin-bottom: 8px;
  margin-top: 8px;
  width: 250px;
  height: 0.7px;
  border: none;
  color: #ffff;
  background-color: #ffff;
}

#templateId-3 .countryImg {
  height: 30px;
  padding-top: 8px;
  padding-bottom: 8px;
}

#templateId-3 .clubImg {
  height: 45px;
  padding-top: 8px;
  padding-bottom: 8px;
}

#templateId-3 .sponsorImg {
  height: 50px;
  padding-top: 8px;
  padding-bottom: 8px;
}

#templateId-3 .player-info__number {
  font-size: 50px;
}

#templateId-3 .player-info__name {
  line-height: 16px;
}

#templateId-3 .player-info__first-name {
  font-size: 14px;
}

#templateId-3 .player-info__last-name {
  /* .player-digital-card-store .player-info__last-name { */
  font-size: 29px;
}

/* #templateId-3 {
  width: 210mm; 
  height: 297mm; 
  background: #fff; 
  border: 1px solid #ccc; 
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden; 
} */

/* Estilos para a página inicial */
.home-page {
  font-family: Arial, sans-serif;
  color: #fff;
  background-color: #000;
}

/* Header */
.home-header {
  background-color: transparent;
  padding: 20px 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 10;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.home-header .logo img {
  max-height: 50px;
}

.home-header .language-selector select {
  background-color: #000;
  color: #fff;
  border: 1px solid #fff;
  padding: 5px;
  font-size: 14px;
}

.home-header .login-button a {
  color: #fff;
  border: 1px solid #fff;
  padding: 5px 15px;
  text-decoration: none;
  font-size: 14px;
  border-radius: 4px;
}

.home-header .login-button a:hover {
  background-color: #fff;
  color: #000;
}

/* Hero Section - Home*/
.hero-section {
  position: relative;
  background: url("/assets/images/hero-slide-1.jpg") no-repeat center center;
  background-size: cover;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.hero-section .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  /* Escurece a imagem de fundo */
  z-index: 1;
}

.hero-section .container {
  position: relative;
  z-index: 2;
}

.hero-section h1 {
  font-size: 3rem;
  font-weight: bold;
  margin-bottom: 20px;
}

.hero-section p {
  font-size: 1.25rem;
  margin-bottom: 30px;
}

.hero-section form {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
}

.hero-section input {
  padding: 10px;
  font-size: 1rem;
  border: none;
  border-radius: 4px;
  width: 300px;
  max-width: 100%;
}

.hero-section .btn {
  padding: 10px 20px;
  font-size: 1rem;
  border-radius: 4px;
  background-color: #007bff;
  color: #fff;
  border: none;
  cursor: pointer;
}

.hero-section .btn:hover {
  background-color: #007bff;
  filter: brightness(1.1);
}

/* Hero Section - login*/
.hero-section-login {
  position: relative;
  background: url("/assets/images/hero-slide-1.jpg") no-repeat center center;
  background-size: cover;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.hero-section-login .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  /* Escurece a imagem de fundo */
  z-index: 1;
}

.hero-section-login .container {
  position: relative;
  z-index: 2;
}

/* Tornar o card transparente com opacidade */
.hero-section-login .card {
  background-color: transparent;
  /* Fundo branco com 80% de opacidade */
  border: none;
  /* Remove bordas, se necessário */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  /* Adiciona uma leve sombra */
  border-radius: 8px;
  /* Bordas arredondadas */
  backdrop-filter: blur(10px);
  /* Adiciona um efeito de desfoque ao fundo */
}

/* Features Section */
.features-section {
  background-color: #000;
  color: #fff;
  padding: 40px 20px;
}

.features-section h4 {
  font-weight: bold;
  margin-bottom: 10px;
}

.features-section p {
  color: #ccc;
}

/* FAQ Section */
.faq-section .btn-link {
  color: #000 !important;
  text-decoration: none;
}

.faq-section .btn-link:hover {
  color: #007bff !important;
  text-decoration: underline;
}

/* Footer */
.footer {
  background-color: #141414;
  color: #fff;
  padding: 20px 0;
  text-align: center;
}

.footer p {
  margin: 0;
  font-size: 14px;
  color: #ccc;
}

.contact-section .form-control {
  background-color: #000;
  /* Fundo escuro para os campos */
  color: #ffffff;
  /* Texto branco */
  border: 1px solid #495057;
  /* Borda cinza */
}

.contact-section .form-control::placeholder {
  color: #ced4da;
  /* Cor do placeholder */
}

.contact-section .form-control:focus {
  background-color: #495057;
  /* Fundo mais claro ao focar */
  color: #ffffff;
  border-color: #007bff;
  /* Borda azul ao focar */
}

.contact-section .btn-primary {
  background-color: #007bff;
  border-color: #007bff;
}

.contact-section .btn-primary:hover {
  background-color: #0056b3;
  border-color: #004085;
}

.pac-container {
  z-index: 2050 !important;
  /* maior que o z-index do modal Bootstrap */
}

#slider-range {
  width: 100%;
  min-width: 200px;
  max-width: 100%;
  margin: 0 auto;
}

.fade-figure {
  background: white;
  position: relative;
  overflow: hidden;
}

.fade-in-img {
  opacity: 0;
  transition: opacity 1s ease;
  display: block;
}

.fade-in-img.loaded {
  opacity: 1;
}

::-webkit-scrollbar {
  height: 4px;
  width: 4px;
  background: gray;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #1892ed;
  /* background: #888;  */
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555;
}

::-webkit-scrollbar-thumb:horizontal {
  background: #1892ed;
  border-radius: 10px;
}

/* Remove efeito hover dos botões de tagcloud */
.tagcloud .filter-options .btn.btn-primary.btn-xs.btn-outline.btn-sm:hover,
.tagcloud .filter-options .btn.btn-primary.btn-xs.btn-outline.btn-sm:focus {
  background-color: inherit !important;
  color: inherit !important;
  border-color: inherit !important;
  box-shadow: none !important;
  text-decoration: none !important;
  cursor: default;
}

/* Estilo para número da camisola */
.shirt-number {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-weight: bold;
  font-size: 14px;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
  z-index: 10;
  pointer-events: none;
  /* Para não interferir com cliques na imagem */
}

.lineup-shirt-goalkeeper {
  position: relative;
}

/* Borda inferior de 5px para posição selecionada */
.border-bottom-5 {
  border-bottom: 5px solid #007bff;
  /* 5px de espessura, cor azul primário */
}

/* Coach Certified Badge */
.coach-figure {
  position: relative;
  display: inline-block;
}

.coach-award {
  position: absolute;
  right: 0;
  bottom: 0;
  /* border: 0; */
  background-color: transparent;
  /* amarelo dourado */
  color: #ffc107;
  width: 32px;
  height: 32px;
  border-top-left-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  /* box-shadow: 0 0 5px rgba(0,0,0,0.3); */
}

.coach-award i {
  font-size: 25px;
  pointer-events: none;
}

.btn-social-counter--linkedIn {
  background-color: #0077b5;
  /* cor principal LinkedIn */
}

.btn-social-counter--linkedIn .btn-social-counter__icon {
  background-color: #005582;
  /* tom mais escuro para o ícone */
}

.btn-social-counter--linkedIn:hover {
  background-color: #005582;
  /* cor de hover igual à do ícone */
}

.widget-social--condensed .btn-social-counter--linkedIn {
  background-color: #0077b5;
  /* manter consistência */
}

.widget-social--condensed
  .btn-social-counter--linkedIn
  .btn-social-counter__count {
  background-color: #005582;
  /* destaque no contador */
}

.btn-social-counter--instagram {
  background-color: #c13584;
  /* cor principal Instagram */
}

.btn-social-counter--instagram .btn-social-counter__icon {
  background-color: #833ab4;
  /* tom mais escuro para contraste */
}

.btn-social-counter--instagram:hover {
  background-color: #a32c73;
  /* hover com tom mais escuro */
}

.widget-social--condensed .btn-social-counter--instagram {
  background-color: #c13584;
}

.widget-social--condensed
  .btn-social-counter--instagram
  .btn-social-counter__count {
  background-color: #a32c73;
}

.btn-social-counter--facebook {
  background-color: #1877f2;
  /* azul oficial do Facebook */
}

.btn-social-counter--facebook .btn-social-counter__icon {
  background-color: #145dbf;
  /* tom mais escuro para o ícone */
}

.btn-social-counter--facebook:hover {
  background-color: #145dbf;
  /* hover consistente */
}

.widget-social--condensed .btn-social-counter--facebook {
  background-color: #1877f2;
}

.widget-social--condensed
  .btn-social-counter--facebook
  .btn-social-counter__count {
  background-color: #145dbf;
}

.team-leader__player-position {
  font-weight: 600;
}

.cursor-default {
  cursor: default !important;
}

@media (max-width: 991.98px) {
  .selected-organization-info {
    align-items: flex-start !important;
  }
}

/* Evita o focus nos botoes que perdem visibilidade */

button:focus,
button:focus-visible,
.btn:focus,
.btn:focus-visible {
  outline: none !important;
  box-shadow: none !important;
  background-color: inherit !important;
  color: inherit !important;
  border-color: inherit !important;
}

.btn-outline-primary:focus,
.btn-outline-primary:focus-visible {
  outline: none !important;
  box-shadow: none !important;
  color: inherit !important;
  background-color: inherit !important;
  border-color: inherit !important;
}

.btn-outline-info:focus,
.btn-outline-info:focus-visible {
  background-color: transparent !important;
  color: #17a2b8 !important;
  border-color: #17a2b8 !important;
}
/* Mantém as cores originais dos btn-outline ao receber foco */
.btn-outline-primary:focus,
.btn-outline-primary:focus-visible {
  background-color: transparent !important;
  color: #1892ed !important;
  border-color: #1892ed !important;
}
.btn-outline-secondary:focus,
.btn-outline-secondary:focus-visible {
  background-color: transparent !important;
  color: #6c757d !important;
  border-color: #6c757d !important;
}
.btn-outline-success:focus,
.btn-outline-success:focus-visible {
  background-color: transparent !important;
  color: #28a745 !important;
  border-color: #28a745 !important;
}
.btn-outline-danger:focus,
.btn-outline-danger:focus-visible {
  background-color: transparent !important;
  color: #dc3545 !important;
  border-color: #dc3545 !important;
}
.btn-outline-warning:focus,
.btn-outline-warning:focus-visible {
  background-color: transparent !important;
  color: #ffc107 !important;
  border-color: #ffc107 !important;
}
.btn-outline-light:focus,
.btn-outline-light:focus-visible {
  background-color: transparent !important;
  color: #f8f9fa !important;
  border-color: #f8f9fa !important;
}
.btn-outline-dark:focus,
.btn-outline-dark:focus-visible {
  background-color: transparent !important;
  color: #343a40 !important;
  border-color: #343a40 !important;
}
/* Mantém as cores originais dos btn-primary-inverse e todos os btn-* ao receber foco */
.btn-primary-inverse:focus,
.btn-primary-inverse:focus-visible {
  background-color: #38a9ff !important;
  color: #fff !important;
  border-color: transparent !important;
}
.btn-primary:focus,
.btn-primary:focus-visible {
  background-color: #1892ed !important;
  color: #fff !important;
  border-color: #1892ed !important;
}
.btn-warning:focus,
.btn-warning:focus-visible {
  background-color: #ffc107 !important;
  color: #212529 !important;
  border-color: #ffc107 !important;
}
.btn-success:focus,
.btn-success:focus-visible {
  background-color: #28a745 !important;
  color: #fff !important;
  border-color: #28a745 !important;
}
.btn-danger:focus,
.btn-danger:focus-visible {
  background-color: #dc3545 !important;
  color: #fff !important;
  border-color: #dc3545 !important;
}
.btn-info:focus,
.btn-info:focus-visible {
  background-color: #17a2b8 !important;
  color: #fff !important;
  border-color: #17a2b8 !important;
}

.btn-secondary:focus,
.btn-secondary:focus-visible {
  background-color: #6c757d !important;
  color: #fff !important;
  border-color: #6c757d !important;
}
.btn-default:focus,
.btn-default:focus-visible {
  background-color: #f8f9fa !important;
  color: #212529 !important;
  border-color: #f8f9fa !important;
}

/* .btn-outline-info:focus,
.btn-outline-info:focus-visible {
  outline: none !important;
  box-shadow: none !important;
  color: inherit !important;
  background-color: inherit !important;
  border-color: inherit !important;
} */

.warning-icon {
  position: absolute;
  right: 0.5em;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 16px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23ff7e1f' d='M4.4 5.324h-.8v-2.46h.8zm0 1.42h-.8V5.89h.8zM3.76.63L.04 7.075c-.115.2.016.425.26.426h7.397c.242 0 .372-.226.258-.426C6.726 4.924 5.47 2.79 4.253.63c-.113-.174-.39-.174-.494 0z'/%3E%3C/svg%3E");
  background-size: 20px 16px;
  background-repeat: no-repeat;
  pointer-events: none;
  z-index: 10;
  display: inline-block;
}

.has-warning .form-check-input {
  border-color: #ff7e1f;
  box-shadow: none;
  background-position: center right 0.9em;
  background-repeat: no-repeat;
  background-size: 20px 16px;
  padding-right: 2.2em;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23ff7e1f' d='M4.4 5.324h-.8v-2.46h.8zm0 1.42h-.8V5.89h.8zM3.76.63L.04 7.075c-.115.2.016.425.26.426h7.397c.242 0 .372-.226.258-.426C6.726 4.924 5.47 2.79 4.253.63c-.113-.174-.39-.174-.494 0z'/%3E%3C/svg%3E");
}

.main-nav__sub li a:hover {
  color: #38a9ff;
}

@media (max-width: 1200px) {
  .container-lg,
  .container-md,
  .container-sm,
  .container {
    max-width: 100%;
  }
}

/* Calendar match count badge styles */
/* .match-count-badge {
			position: absolute;
			top: -8px;
			right: -8px;
			background-color: #dc3545;
			color: white;
			border-radius: 50%;
			font-size: 10px;
			font-weight: bold;
			min-width: 16px;
			height: 16px;
			line-height: 16px;
			text-align: center;
			padding: 0 2px;
			z-index: 10;
			border: 2px solid white;
		} */

/* .calendar-cell {
			position: relative;
		} */

/* .calendar-day {
			position: relative;
			display: inline-block;
			padding: 5px;
			text-decoration: none;
			color: #31404b !important;
			background-color: transparent !important;

		} */
.calendar_wrap > table tbody td a {
  margin: -10px;
}

/* .selected-day { */
.today-day {
  border: 2px solid #007bff;
  background-color: transparent !important;
  color: #007bff !important;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  text-align: center;
  line-height: 26px;
  text-decoration: none;
  display: inline-block;
  position: relative;
}

/* .today-day { */
.selected-day {
  background-color: #007bff;
  color: white !important;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  text-align: center;
  line-height: 30px;
  display: inline-block;
  position: relative;
  border: none;
}

.selected-today-day {
  background-color: #007bff;
  border: 1px solid #007bff;
  color: white !important;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  text-align: center;
  line-height: 24px;
  text-decoration: none;
  display: inline-block;
  position: relative;
}

.today-day {
  margin: -10px;
}

/* Calendar day dot indicators
   - Attach modifier classes to the <td> (e.g. <td class="calendar-cell calendar-day-friendly calendar-day-oficial">)
   - .calendar-day-following-* are mutually exclusive per cell and appear in the same place (bottom-right)
   - .calendar-day-friendly (blue) and .calendar-day-oficial (black) can appear together and are placed top-left and top-right
*/
.calendar-cell {
  position: relative; /* container for positioned dots */
}

/* Friendly (blue) - place top-left
   Use ::before for friendly so a second pseudo-element (::after) can be used for the top-right/offical or bottom-right following dot */
.calendar-day-friendly::before,
/* Support the misspelled variant 'calendar-day-firendly' and also when the class is applied to the inner element */
.calendar-day-firendly::before,
.calendar-cell.calendar-day-friendly::before,
.calendar-cell.calendar-day-firendly::before {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #007bff; /* blue */
  top: 6px;
  right: 6px;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) inset;
  pointer-events: none;
  /* Promote above inner content */
  z-index: 10;
  transform: translateZ(0);
}

/* Oficial (black) - place top-right */
.calendar-day-oficial::after,
.calendar-cell.calendar-day-oficial::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #000; /* black */
  top: 6px;
  left: 6px;
  pointer-events: none;
  z-index: 10;
}

/* Following variants (mutually exclusive) - bottom-right, same fixed place */
.calendar-day-following-green::after,
.calendar-cell.calendar-day-following-green::after,
.calendar-day-following-orange::after,
.calendar-cell.calendar-day-following-orange::after,
.calendar-day-following-red::after,
.calendar-cell.calendar-day-following-red::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  bottom: 6px;
  right: 6px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
  pointer-events: none;
}

.calendar-day-following-green::after {
  background: #3ff368;
} /* green */
.calendar-day-following-orange::after {
  background: #ff8c00;
} /* orange */
.calendar-day-following-red::after {
  background: #dc3545;
} /* red */

/* Calendar legend (below the calendar) */
.calendar-legend {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  margin-top: 8px;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

/* Top row: show the first two legend items (oficial + friendly) inline and centered */
.calendar-legend__top {
  display: flex;
  gap: 16px;
  justify-content: center;
  align-items: center;
  margin-top: 4px;
}

.calendar-legend__top .calendar-legend__item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: auto;
}

/* Helper: when not changing HTML, allow selecting the first two items into a virtual top row */
.calendar-legend > .calendar-legend__item:nth-child(1),
.calendar-legend > .calendar-legend__item:nth-child(2) {
  /* ensure they don't stretch full width when parent is column */
  width: auto;
}

.calendar-legend__item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #adb5bd; /* muted label color */
}

/* Column variant: title above and group of items centered below */
.calendar-legend__item--column {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.calendar-legend__group {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  justify-content: center;
  align-items: center;
  margin-top: 0.25rem;
}

.legend-dot {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
}

.legend-dot--friendly {
  background: #007bff;
}
.legend-dot--oficial {
  background: #000;
}

.legend-dot--following.legend-dot--green {
  background: #28a745;
}
.legend-dot--following.legend-dot--orange {
  background: #ff8c00;
}
.legend-dot--following.legend-dot--red {
  background: #dc3545;
}

/* Inline dot used when both following and oficial indicators exist in the same cell.
   This avoids a clash between two ::after pseudo-elements (used for oficial and following).
   The inline span has the same size and visual appearance as the pseudo-element.
*/
.dot-oficial-inline {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #000; /* black - same as oficial */
  position: absolute;
  top: 6px;
  left: 6px;
  pointer-events: none;
  z-index: 11; /* above pseudo-elements but behind other interactive content */
}

@media (max-width: 575px) {
  .calendar-legend {
    gap: 8px 12px;
  }
  .calendar-legend__item {
    font-size: 12px;
  }
}

/* Stacked legend item: dot on top, short label, then descriptive text */
.calendar-legend__item--stacked {
  flex-direction: column;
  align-items: center;
  text-align: center;
  min-width: 64px;
  gap: 0;
}

.calendar-legend__item--stacked .legend-dot {
  width: 12px;
  height: 12px;
  margin-bottom: 2px;
}

.calendar-legend__item--stacked .legend-label {
  font-weight: 600;
  /* color: #ffffff; */
  display: block;
}

/* Match content border colors according to calendar legend */
.match-content--oficial {
  border-bottom: 3px solid #000 !important; /* black for oficial */
}

.match-content--friendly {
  border-bottom: 3px solid #007bff !important; /* blue for friendly */
}

/* Player avatar small team/club badge (overlay) */
.alc-player-info {
  position: relative;
  display: flex;
  align-items: center;
}

.alc-player-avatar {
  position: relative;
  width: 48px;
  height: 48px;
  min-width: 48px;
  min-height: 48px;
}

.alc-player-avatar .player-img {
  width: 48px;
  height: 48px;
  object-fit: cover;
  border-radius: 50%;
  display: block;
}

/* Small club badge overlayed on avatar (bottom-right) */
.alc-player-club-badge {
  position: absolute;
  right: -4px;
  bottom: -4px;
  width: 22px;
  height: 22px;
  object-fit: cover;
  border-radius: 50%;
  border: 2px solid #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  background: #fff;
}

/* Responsive smaller sizes */
@media (max-width: 576px) {
  .alc-player-avatar,
  .alc-player-avatar .player-img {
    width: 40px;
    height: 40px;
    min-width: 40px;
    min-height: 40px;
  }
  .alc-player-club-badge {
    width: 18px;
    height: 18px;
    right: -3px;
    bottom: -3px;
  }
}

/* toast */
.toast {
  color: rgba(0, 0, 0, 0.5);
}

#toast-container {
  left: 50%;
  top: 25%;
  position: fixed;
  transform: translate(-50%, -50%);
  z-index: 9999;
}
