/*
    Adaptations tabulator WP
    Version: 02/09/2026
*/

/* === ELEMENTS === */

/* Details */
.detail1{
    font-size:0.825em;
	color: var(--main-color-detail); 
}
.detail2{
    font-size:0.825em;
	color: #D3D3D3; 
}
.detail3{
    font-size:0.825em;
	color: var(--main-color-opacity-no); 
}

/* Logos */
.flagst{
    position: absolute;
	width: 28px;
	border: 1px solid gray;
	border-radius: 2%;
	margin-bottom: 1px;
}	
.content-graphique, .content-tableau {
    margin: 0;
}
div.logoclub img {
    position: absolute;
    height: 26px;
    background-color: rgba(217,217,217,0.5);
    border-radius: 5px;
    padding-left: 2px;
    padding-right: 2px;
}
.logo_league{
    top:19%;
    height: 16px;
}
.logo_confed{
    position: absolute;
    top:19%;
    width: 15px;
}

/* Texte suivant le logo league*/
div.tabulator-cell .txt-right-league{
    position: absolute;
    left:25px;
}
div.tabulator-cell .txt-right-league-tree{
    position: absolute;
    left: 115px;
    top: 4px;
}

/* Bloc du filtre tabulator */
.filter-item {
    display: inline-flex;
    align-items: center;
    margin-right: 2rem;
}

/* Label des listes */
label {
    font-size: 0.825em;
    font-weight: 600;
    margin: 0 0.5rem 0 0;
}

/* Liste et zone de texte */
select, input[type="text"] {
   font-size: 0.825em !important;
   color: #212529;
   font-size:13.2px;
}

/* Button on */
button.btn {
    color: #FFF;
    font-size: 0.900em;
    border: 2px solid #D50803;
    background: #16212C;
    padding: 0.5rem;
    border-radius:4px 4px;
}
button:focus {
    outline:0;
}

/* Button off */
button.btn_deselect {
    color: #FFF;
    font-size: 0.825em;
    background: #16212C;
    padding: 0.5rem;
    border-radius:4px 4px;
}
div[data-max] {
    height: 12px !important;
    margin-top: 4px;
}

/* Barres dans les cellules */
div.barre_perso1{
    height: 12px;
    background: linear-gradient(
        to right,
        var(--main-color-opacity),
        var(--main-color-detail)
    );
    display: inline-block;
    position: absolute;
    left: 50px;
    margin-top: 4px;
    border-top-right-radius: 1px;
    border-bottom-right-radius: 1px;
}
div.barre_perso2{
    height: 12px;
    background: linear-gradient(
        to right,
        #E8E8E8,
        #D3D3D3
    );
    display: inline-block;
    position: absolute;
    left: 50px;
    margin-top: 4px;
    border-top-right-radius: 1px;
    border-bottom-right-radius: 1px;
}
div.nb_barre{
    left: 36px;
    color: var(--main-color-opacity);
    margin-bottom: 2px;
}
div.barre_perso_pos{
    height: 12px;
    background-color: rgba(0,166,76, 1);
    display: inline-block;
    position: absolute;
    left: 45px;
    margin-top: 4px;
}
div.barre_perso_neg{
    height: 12px;
    background-color: var(--main-color-detail);
    display: inline-block;
    position: absolute;
    right: 50px;
    margin-top: 4px;
}
.div_barre_perc_perso{
    display: flex;
    top: 4px;
    position: relative;
}
.rectangle_val, .rectangle-val, .rectangle-right {
    height: 12px;
}

/* Barre de type jauge */
.progcustom-container {
    display: flex;
    align-items: center;
}
.progcustom-value {
    width: 40px;
    text-align: right;
    margin-right: 5px; 
}
.progcustom-bar-container {
    position: relative;
    flex-grow: 0.8; 
    height: 12px;
    background-color: #f0f0f0;
}
.progcustom-bar {
    position: absolute;
    height: 10px;
    background-color: var(--main-color-opacity);
    top: 1px;
    left: 1px; 
}

/* Cercles */
div.rond_perso1{
    width: 11px;
    height: 11px;
    display: inline-block;
    position: absolute;
    left: 50px;
    top: 9px;
    border-radius: 10px;
    border:1px solid rgb(139,140,139)
}
div.rond_perso2{
    width: 14px;
    height: 14px;
    display: inline-block;
    position: absolute;
    left: 60px;
    top: 7px;
    border-radius: 10px;
    border:1px solid rgb(225,225,225)
}

/* Images dans le tableau */
@media (min-width: 768px) {
    .container-img-tableau {
        margin-right: 1rem;
    }   
}
@media (max-width: 767px) {
    .container-img-tableau {
        margin: 1rem 0;
    }
}

/* === GRILLE === */

/* Defaut */
.tabulator {
    background-color:#FFF;
    border: none; /*contour du tableau 1px solid #D50803*/
    font-size:0.825em;
}
.tabulator .tabulator-header {
    background-color: #FFFFFF;
    color:var(--main-color);
    font-weight: 600;
    border-color: var(--main-color);
}
.tabulator .tabulator-header .tabulator-col {
    background-color: #FFFFFF;
    white-space: normal;
    border: 0px;
    min-height: 27px !important;
    height: auto !important;
}

/* Survol tri */
.tabulator .tabulator-header .tabulator-col.tabulator-sortable:hover {
   background-color: #e6e6e6;
}

/* Espace entre colonne */
.tabulator-row .tabulator-cell {
    border-right: 0px solid;
    border-left: 0px solid; 
    height: 28px ;
    line-height:21px;
}

/* Position des logos */
.tabulator-row .tabulator-cell.logoclub {
    border-right: 0px solid;
    border-left: 0px solid;
    height: 28px;
    line-height: 28px;
    padding-top: 0px;
    padding-bottom: 0px;
}
.tabulator-tableholder {
    max-height: 591px !important;
}
.tabulator .tabulator-tableholder .tabulator-table{
    border-top: 1px solid rgb(189, 189, 189);
}

/* Couleur des colonnes */
.tabulator .tabulator-tableholder .tabulator-table .tabulator-row {
    color:#000;
    background-color: #fff;
    margin-left: 0px;
    border-bottom: 1px solid rgb(189,189,189); /*trait entre les lignes du tableau*/
    height: 28px !important ;
}

/* Couleur des colonnes [even] */
.tabulator-row.tabulator-row-even {
  background-color: #fff;
}

/* Affichage des progress bar type responsive */
.tabulator-row .tabulator-responsive-collapse table tr td {
    display: inline-block;
    height: 30px;
    min-width: 100px;
}

/* Affichage sélection ligne */
.tabulator .tabulator-row.tabulator-selectable:hover .tabulator-cell {
    background-color: #bbb;
    cursor: default;
}

/* === HEADER === */
.tabulator-header-filter input {
    width: 90% !important;
    display: block!important;
    border: 0px solid var(--main-color-opacity);
    border-radius: 2px;
    padding-left: 10px !important;
    }

/* === TRI === */

/* Autres dispositions pour les flèches de tri */
.tabulator .tabulator-header .tabulator-col.tri2 .tabulator-col-content .tabulator-col-sorter {
    right: 10px;
}

/* Autres dispositions pour les flèches de tri [gauche+texte] */
.tabulator .tabulator-header .tabulator-col.tri_left .tabulator-col-content .tabulator-col-title {
    margin-left: 20px;
    text-align: left;
}
.tabulator .tabulator-header .tabulator-col.tri_left .tabulator-col-content .tabulator-col-sorter {
    left: 0px; 

}
/* Autres dispositions pour les flèches de tri [centre] */
.tabulator .tabulator-header .tabulator-col.acent .tabulator-col-content .tabulator-col-title {
    text-align: center;
}

/* === AUTRES === */
/* Répétitions de barres */
.nb_barre{
    font-size: 13px;
    position:absolute;
    bottom:2px;
    left:25px;
}
/* Nul */
.zero{
    position:absolute;
    right:75%;
}
/* Flèches */
.foo{
  display: inline-block;
  vertical-align: middle;

}
.rectangle {
  height: 6px;
  width: 20px;
  background-color: rgba(213,8,3,1);
  margin:-5px;
  margin-left:0px;
}
.triangle-right {
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-left: 10px solid rgba(213,8,3,1);
    border-bottom: 5px solid transparent;
    padding-right: 10px;
}

/* Sucettes */
.trait {
    height: 2px;
    margin:-5px;
    margin-left:10px;
    display:inline-block;
  }
.rond-right {
    width: 10px;
    height: 10px !important;
    border-radius: 5px;
    display:inline-block;
    /*background: rgba(218,145,0,1);*/
}
.poste{
    font-size:10px;

}

/* === PROGRESS BAR === */

/* Barre de progression avec bouton */
.prog{
    display:inline-block;
}

/* Barre de progression */
#progressBar{
    width:200px;
    height:15px;
    border: 1px solid #008000;
}

/* Barre de progression selon le navigateur */
#progressBar::-moz-progress-bar{
    background-color:green;

}
#progressBar::-webkit-progress-bar {
background-color:#16212C;
}
#progressBar::-webkit-progress-value {
  background-color: green;
}

/* Bouton barre de progression */
.btnprog{
    width:27px;
}

/* Barre de progression */
.progressBarMin{
    width:40px;
    height:10px;
    border: 0px solid #008000;
    font-size: 13px;
    position: absolute;
    bottom: 8px;
    left: 40px;
}

/* Chrome rgba(22,33,44,1 )*/
.progressBarMin::-webkit-progress-bar {
  background-color:var(--main-color-opacity);
}
.progressBarMin::-webkit-progress-value {
  background-color:var(--main-color)
}

/* Mozilla */
.progressBarMin::-moz-progress-bar{
    background-color:var(--main-color)
}
progress {
  -webkit-appearance: none;
  -moz-appearance: none;
          appearance: none;
          border: none;
}
#progressBarMin::-ms-fill {
        background-color:var(--main-color)
}


/* Texte */
.titreProgress{
    font-size: 0.825em;
    font-weight: 600;
    margin: 0 0.5rem 0 0;
    display: block;

}

/* === EXCEPTIONS === */

/* Dernière colonne triable */
.tabulator .tabulator-header .tabulator-col.tabulator-sortable.last_sortable .tabulator-col-content .tabulator-col-title{
    display: inline-block;
    width: 125px;
}
.tabulator .tabulator-header .tabulator-col.tabulator-sortable.last_sortable .tabulator-col-content .tabulator-arrow {
    right:auto;
 }
.tabulator .tabulator-header .tabulator-col.tabulator-sortable.last_sortable{
   width:140px !important;
   min-width: 120px !important;
}

/* Evolution négative */
.tabulator-row .tabulator-cell.evol_neg div[data-max]{
    position:absolute !important;
    right:-3px !important;
}

/* Evolution positive */
.tabulator-row .tabulator-cell.evol_pos div[data-max]{
    position:absolute !important;
    left:-2px !important;
}

/* Barre inférieur à 30px */
div.evol_neg_width_min{
        min-width: 10px !important;
}

/* Barre unique */
.tabulator-row .tabulator-cell.barre_unique{
    padding: 2px;
}