/*********************
GLOBAL
*********************/

body{
  background:#000;
  color:#fff;
  font-family: "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  line-height:1.6;
}

h1,h2,h3,h4,h5,h6{
  font-weight:600;
  color:#ffffff;
}

/*********************
WATERMARK
*********************/

html:after{
  font-size:650%;
  color:rgba(255,255,255,.05);
  z-index:9999;
  position:fixed;
  top:35%;
  left:10%;
  right:0;
  text-align:center;

  font-weight:800;
  letter-spacing:8px;
  transform:rotate(-35deg);

  pointer-events:none;
  user-select:none;
}

/*********************
BACKGROUNDS
*********************/

.bg-dark{
  background-color:#000 !important;
}

.bg-light{
  background-color:#000428 !important;
}

.bg-index{
  background:linear-gradient(135deg,#000428,#004e92);
  border-radius:12px;
  padding:20px;
  box-shadow:0 10px 25px rgba(0,0,0,.4);
}

/*********************
COMPETENCES
*********************/

.competence{
  color:#000;
  background:linear-gradient(135deg,#ffffff,#d8d8d8);
  border-radius:12px;
  padding:15px;
  transition:.25s ease;
}

.competence:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 20px rgba(0,0,0,.35);
}

.competenceSearch{
  color:#000;
  background:linear-gradient(135deg,#000428,#004e92);
  border-radius:12px;
}

.competenceCachee{
  color:#000;
  background:linear-gradient(135deg,#e4fa03,#bfbfbf);
  border-radius:12px;
}

/*********************
NAVBAR
*********************/

.navbar{
  background:rgba(0,0,0,.9);
}

.navbar-light .navbar-nav .nav-link{
  color:#fff;
  font-weight:500;
  transition:.25s;
}

.navbar-light .navbar-nav .nav-link:hover{
  color:#004e92;
}

.navbar-light .navbar-nav .nav-link.active{
  color:#004e92;
}

/*********************
LINKS
*********************/

a{
  color:#fff;
  transition:.2s;
}

a:hover{
  color:#004e92;
  text-decoration:none;
}

/*********************
BUTTONS


.btn{
  font-weight:600;
  border-radius:8px;
  transition:.25s;
}

.btn-primary{
  color:#000 !important;
  background-color:#004e92;
  border-color:#004e92;
}

.btn-primary:hover{
  background-color:#5BF05B;
  border-color:#5BF05B;
  transform:translateY(-2px);
}

.btn-secondary{
  background-color:#000428;
  border-color:#000428;
}

.btn-secondary:hover{
  background-color:#5BF05B;
  border-color:#5BF05B;
}
*********************/
/*********************
TABLES
*********************/

.table-striped tbody tr:nth-of-type(odd){
  background:#5C5F5C;
}

/*********************
CARDS / BLOCS
*********************/

.card{
  border:none;
  border-radius:12px;
  overflow:hidden;
  background:#111;
  box-shadow:0 10px 25px rgba(0,0,0,.4);
}

/*********************
IMAGES HOVER
*********************/

.service-item img,
.blog-item img,
.gallery-item img{
  transition:transform .4s;
}

.service-item:hover img,
.blog-item:hover img,
.gallery-item:hover img{
  transform:scale(1.08);
}

/*********************
SPINNER
*********************/

#spinner{
  opacity:0;
  visibility:hidden;
  transition:opacity .6s ease;
  z-index:99999;
}

#spinner.show{
  visibility:visible;
  opacity:1;
}

/*********************
BACK TO TOP
*********************/

.back-to-top{
  position:fixed;
  right:25px;
  bottom:25px;
  width:48px;
  height:48px;
  background:#004e92;
  color:#000;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 10px 20px rgba(0,0,0,.4);
  transition:.25s;
}

.back-to-top:hover{
  background:#5BF05B;
  transform:translateY(-4px);
}

/*********************
FOOTER
*********************/

.footer{
  border-top:1px solid rgba(255,255,255,.1);
  background:#050505;
}

.footer a{
  color:#ccc;
}

.footer a:hover{
  color:#004e92;
}

/*********************
COPYRIGHT
*********************/

.copyright{
  border-top:1px solid rgba(255,255,255,.08);
  background:#050505 !important;
}

/*********************
PAGINATION
*********************/

.paginate_button{
  display:inline-block;
  padding:.375rem .75rem;
  border-radius:6px;
  transition:.2s;
}

.paginate_button:hover{
  background:#000428;
  color:#fff;
}

}
/*** Single Page Hero Header End ***/


/*** About Start ***/
.about .tab-class .nav .nav-item a.active,
.about .tab-class .nav .nav-item a.active span {
    background: var(--bs-primary) !important;
    color: var(--bs-white) !important;
}

/*** About End ***/

/*** SURCHARGE TB DARK ****/
.table-dark thead th {
  background-color: #004e92;
  color: #ffffff;

}
.general-card {
  border: 2px solid var(--ucl-gold);
  /*background: rgba(197, 160, 89, 0.1);*/
width: 100%;
border-radius: 12px;
padding: 20px;
}

.general-card:hover {

}

.general-card.LM {
    /*background: linear-gradient(135deg, #000428, #00d2ff);*/
}
/* logo joueur er clubs classements */
.imgClassement{
      height: 2rem;
      display: block;
      /* margin: auto; */
      border-radius: 50%;
      padding: 1px;
      background: linear-gradient(145deg, #ffffff33, #00000066);
      box-shadow: 0 6px 14px rgba(0, 0, 0, 0.6), inset 0 0 8px rgba(255, 255, 255, 0.3);
}
.imgTopPodium{

      display: block;
      /* margin: auto; */
      border-radius: 50%;
      padding: 1px;
      background: linear-gradient(145deg, #ffffff33, #00000066);
      box-shadow: 0 6px 14px rgba(0, 0, 0, 0.6), inset 0 0 8px rgba(255, 255, 255, 0.3);
}
.imgClubMenu{
      height: 1.5rem;
      display: inline;
      /* margin: auto; */
      border-radius: 50%;
      padding: 1px;
      background: linear-gradient(145deg, #ffffff33, #00000066);
      box-shadow: 0 6px 14px rgba(0, 0, 0, 0.6), inset 0 0 8px rgba(255, 255, 255, 0.3);
}
.col-lg-12 , .col-xl-12{
  padding-left:0 !important;
  padding-right:0 !important
}
.imgMyTeam{
      height: 2.5rem;
      display: inline;
      /* margin: auto; */
      border-radius: 50%;
      padding: 1px;
      background: linear-gradient(145deg, #ffffff33, #00000066);
      box-shadow: 0 6px 14px rgba(0, 0, 0, 0.6), inset 0 0 8px rgba(255, 255, 255, 0.3);
}


/*******************************************************************************/
.gallery-rowManager {
    margin-bottom: 30px;
}

.gallery-itemManager {
    margin-bottom: 20px;
}

.cardManager {
    display: block;
    border-radius: 16px;
    overflow: hidden;
    text-decoration: none;
    background: var(--ucl-gradient);
    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.6), inset 0 0 8px rgba(255, 255, 255, 0.3);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.cardManager:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.15);
}

/* 🔥 IMPORTANT : on enlève le crop */
.img-wrapperManager {
    padding: 10px;
    background: var(--ucl-gradient);
}

.img-wrapperManager img {
    width: 100%;
    height: auto;       /* ✔ image complète */
    object-fit: contain; /* ✔ garde les proportions */
}

/* optionnel : effet léger au hover */
.cardManager:hover img {
    transform: scale(1.03);
    transition: transform 0.3s ease;
}

.cardManager-body {
    padding: 10px;
    text-align: center;
}

.cardManager-body h5 {
    margin: 0;
    font-size: 15px;
    color: #333;
}


/***********************************************/
/* cache le checkbox */
.img-wrapperManager input {
    display: none;
}

/* image normale */
.img-wrapperManager img {
    width: 100%;
    height: auto;
    cursor: zoom-in;
    transition: transform 0.3s ease;
}

/* 🔥 overlay quand zoom */
.img-wrapperManager input:checked + label {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0,0,0,0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

/* image agrandie */
.img-wrapperManager input:checked + label img {
    width: auto;
    height: auto;
    max-width: 90%;
    max-height: 90%;
    cursor: zoom-out;
    transform: scale(1);
}