/* html,
body {
    margin:0;
    padding:0;
} */
body {
    background-color: black;
    /* Le fond de la page sera noir */
    color: white;
    /* Le texte de la page sera blanc */
	font-family: sans-serif, Roboto, Verdana;
}

#footer {
    width: 100%;
    text-align: center;
    height: 80px;
    padding-top: 70px;
    margin-bottom: 10px;
    /* float: left; */
}

#main {
    text-align: center;
}

h2.p {
	margin: 0px;
	padding: 0px 0px 0px 0px;
}

div.center {
	text-align: center;
    vertical-align: middle;
}

div.left {
	text-align: left;
    vertical-align: middle;
}

a { color: #ffffff; text-decoration:none; }
/*
a.title {
	color: #ffffff;
	font-weight: bold;
	text-decoration:none;
}
*/

.alert-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
    margin-bottom: 20px;
    font-weight: bold;
}

.alert {
    padding: 15px;
    border: 1px solid transparent;
    border-radius: 10px;
    max-width: 600px; /* Limite la largeur à 600px */
    width: 100%; /* Prend 100% de la largeur du conteneur */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Ajoute une ombre légère */
}

.success {
    background-color: #d4edda;
    border-color: #c3e6cb;
    color: #155724;
}

.alert-danger {
    background-color: #f8d7da;
    border-color: #f5c6cb;
    color: #721c24;
}


table.center {
	margin-left:auto;
    margin-right:auto;
	text-align: center;
	/* vertical-align: middle; */

	/* border-color: #aaa; */
}

/* table.center,th,td,tr {
	border-color: #aaa;
} */


table {
	/*
  	background-color: #fff;
	border: 1px solid #fff;
	padding: 1px 1px 1px 1px;
	margin-bottom: 0px;
	*/
	width: 100%;
	max-width: 1280px;
	background-color: #aaa; /* ffffff */
	/*border-collapse: collapse;*/
	/*border-collapse: separate;*/
	border-collapse: separate;
	border-spacing: 0;
	border-width: 3px;
	border-color: #aaa;
	border-style: solid;
	padding: 1px;
	/*color: #000000;*/


}
th {
	border: 2px solid #aaa;
	background-color: #000000;
	height: 25px;
	text-align: center;
	padding: 5px 5px 5px 5px;
	/*background: #DADBD0;
  	color: #FFFFFF;*/
}

tr.top{
    vertical-align: top;
}

tr.rouge td{
	border-style:solid;
	border-color:#800000;
	border-width: 2px;
}
tr.vert td{
	border-style:solid;
	border-color:#008000;
	border-width: 2px;
}
tr.blanc td{
	border-style:solid;
	border-color:#aaa; /* #fff */
	border-width: 2px;
}

tr.blanctd td{
	/* border-style:solid;
	border-color:#aaa;
	border-width: 2px; */
	border-top: 1px solid #aaa;
	border-bottom: 1px solid #aaa;
}


td.rougetd {
	border-style:solid;
	border-color:#800000;
	border-width: 2px;
	/*
	background-color: #630303;
	text-decoration:none;*/
}
td.verttd {
	border-style:solid;
	border-color:#008000;
	border-width: 2px;
	/*
	background-color: #003300;
	text-decoration:none;*/
}



td {
	border: 2px solid #aaa;
	background-color: #000000;
	height: 25px;
	text-align: center;
	padding: 5px 5px 5px 5px;
	/*background: #DADBD0;
	color: #FFFFFF;*/
}
/* td.max {
	max-width: 835px;
	overflow: hidden;
	text-overflow: ellipsis;
}
td.maxA {
	max-width: 820px;
	overflow: hidden;
	text-overflow: ellipsis;
} */

img.tdimg {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

img.td {
    display: block;
    margin-left: auto;
    margin-right: auto;
	/* vertical-align: top; */
}

img.td:hover {
/* L'image est doublée */
-webkit-transform:scale(3); /* Safari et Chrome */
-moz-transform:scale(3); /* Firefox */
-ms-transform:scale(3); /* Internet Explorer 9 */
-o-transform:scale(3); /* Opera */
transform:scale(3);
}

img.tdedit {
    display: block;
    /* margin-left: auto;
    margin-right: auto; */
	/* vertical-align: top; */
}
img.tdedit:hover {
    /* L'image est doublée */
    -webkit-transform:scale(4); /* Safari et Chrome */
    -moz-transform:scale(4); /* Firefox */
    -ms-transform:scale(4); /* Internet Explorer 9 */
    -o-transform:scale(4); /* Opera */
    transform:scale(4);
}

td.bleu {
  	background-color: #0071c2;
	color: #fff;
	text-decoration:none;
	font-weight: bold;
}
a.lienbleu {
	color: #fff;
	font-weight: bold;
}

td.orange {
  	background-color: #ab5707;
	text-decoration:none;
	font-weight: bold;
}

a.lienorange {
	color: #fff;
	font-weight: bold;
}

td.rouge {
  	background-color: #93171a;
	color: #ffffff;
	text-decoration:none;
	font-weight: bold;
}
a.lienrouge {
	color: #fff;
	font-weight: bold;
}

td.vert {
  	/*background-color: #2e431a;*/
	background-color: #33a396;
	text-decoration:none;
	font-weight: bold;
}
a.lienvert {
	color: #ffd;
	font-weight: bold;
}

td.crouge {
  	background-color: #330000;
  	color: #ffffff;
	/*font-weight: bold;*/
}
td.cvert {
  	background-color: #003300;
	color: #fff;
	font-weight: bold;
}

td.leftvert {
	text-align: left;
  	background-color: #003300;
	color: #fff;
	font-weight: bold;
	padding: 5px;
}

td.leftrouge {
	text-align: left;
  	background-color: #330000;
	color: #fff;
	font-weight: bold;
	padding: 5px;
}

td.left,
th.left {
	padding: 5px;
    text-align: left;
	font-weight: bold;
}

td.top{
    vertical-align: top;
}

td.bottom{
    vertical-align: bottom;
}




table.border0 {
	width: 100%;
	max-width: 720px;
	border: 0px solid #000;
	background-color: #000;
}
td.center2 {
    text-align: center;
	border: 0px solid #000;
}
td.left2 {
    text-align: left;
	border: 0px solid #000;
}
td.right2 {
    text-align: right;
	border: 0px solid #000;
}

table.none, tr, td{
	border:none;
	padding: 5px;
	background-color: #000;
}
td.right{
	text-align: right;
	padding: 5px;
}
td.left{
	text-align: left;
	padding: 5px;
}

table.none_black{
	border:none;
	background-color: #000;
}



/* le Formulaire */
#container{
    width:500px;
    margin:0 auto;
	/* margin-left:auto;
    margin-right:auto;
	text-align: center;
	vertical-align: middle; */
}
/* Bordered form */
form.lg {
    /*width:500px;
    padding: 20px;*/
	padding-top: 0px;
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 20px;
    border: 1px solid #f1f1f1;
    background: #313131;
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
}
#container h1{
    width: 38%;
    margin: 0 auto;
    padding-bottom: 20px;
}

/* Full-width inputs */
input.lg[type=text], input.lg[type=password] {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-sizing: border-box;
}

/* Set a style for all buttons */
input.lg[type=submit] {
	width: 200px;
    padding: 10px;
    color: #fff;
    border-radius: 10px;
    background: #800000;
    font-weight: bold;
	margin: 10px 0;
	cursor: pointer;
	border: 1px solid #800000;
}
input.lg[type=submit]:hover {
    background-color: #000;
	border: 1px solid #800000;
	color: #800000;
	font-weight: bold;
}

.twitch-button-container {
    width: 175px;
    padding: 10px;
    color: #fff;
    border-radius: 10px;
    background: #772ce8;
    font-weight: bold;
    margin: 10px 0;
    cursor: pointer;
	border: 1px solid #772ce8;
}
.twitch-button-container:hover {
	width: 175px;
	color: #fff;
	background: #000;
	font-weight: bold;
	border: 1px solid #772ce8;
}
.a-twitch {
	text-decoration: none;
}

.discord-button-container {
	margin-left:auto;
    margin-right:auto;
	text-align: center;
	vertical-align: middle;

    width: 175px;
    padding: 10px;
    color: #fff;
    border-radius: 10px;
    background: #4752c4;
    font-weight: bold;
    /* margin: 10px 0; */
    cursor: pointer;
	border: 1px solid #4752c4;
}
.discord-button-container:hover {
	width: 175px;
	color: #fff;
	background: #000;
	font-weight: bold;
	border: 1px solid #4752c4;
}
.a-discord {
	text-decoration: none;
	/* margin-left:auto;
    margin-right:auto;
	text-align: center;
	vertical-align: middle; */
}



/* Set a style for V buttons */
input.sv[type=submit] {
    background-color: #008000;
    color: white;
    padding: 5px 5px;
    margin: 2px 0;
    border: none;
    cursor: pointer;
    width: 50%;
	border: 1px solid #008000;
	border-radius: 6px;
}
input.sv[type=submit]:hover {
    background-color: #000;
    color: #008000;
    border: 1px solid #008000;
}




/* Set a style for X buttons */
input.sx[type=submit] {
    background-color: #800000;
    color: white;
    padding: 5px 5px;
    margin: 2px 0;
    border: none;
    cursor: pointer;
    width: 50%;
	border: 1px solid #800000;
	border-radius: 6px;
}
input.sx[type=submit]:hover {
    background-color: #000;
    color: #800000;
    border: 1px solid #800000;
}

/* Set a style for X buttons */
input.sx[type=Reset] {
    background-color: #800000;
    color: white;
    padding: 5px 5px;
    margin: 2px 0;
    border: none;
    cursor: pointer;
    width: 50%;
	border: 1px solid #800000;
	border-radius: 6px;
}
input.sx[type=Reset]:hover {
    background-color: #000;
    color: #800000;
    border: 1px solid #800000;
}



/* Set a style for C buttons */
input.sc[type=submit] {
    background-color: #ffffff;
    color: #000;
    padding: 5px 5px;
    margin: 2px 0;
    border: none;
    cursor: pointer;
    width: 50%;
	border: 1px solid #ffffff;
	border-radius: 6px;
}
input.sc[type=submit]:hover {
    background-color: #000;
    color: #ffffff;
    border: 1px solid #ffffff;
}


input.svo[type=submit] {
	font-size: 16px;
	font-weight: bold;
    background-color: #f76647;
    color: #000;
    padding: 5px 5px;
    margin: 2px 0;
    border: none;
    cursor: pointer;
    width: 50%;
	border: 1px solid #f76647;
	border-radius: 6px;
}
input.svo[type=submit]:hover {
	font-size: 16px;
    font-weight: bold;
    background-color: #000;
    color: #f76647;
    border: 1px solid #f76647;
}


input.sxr[type=submit] {
	font-size: 16px;
	font-weight: bold;
    background-color: #800000;
    color: #fff;
    padding: 5px 5px;
    margin: 2px 0;
    border: none;
    cursor: pointer;
    width: 50%;
	border: 1px solid #800000;
	border-radius: 6px;
}
input.sxr[type=submit]:hover {
	font-size: 16px;
	font-weight: bold;
    background-color: #000;
    color: #800000;
    border: 1px solid #800000;
}

.encadrer_orange {
	font-size: 18px;
	font-weight: bold;
    background-color: #f76647;
    color: #000;
    padding: 5px 5px;
    margin: 2px 0;
    border: none;
    cursor: pointer;
    width: 240px;
	border: 1px solid #f76647;
}


/*#link_noir { color: #333; } */
#link_blanc:hover { color: #fff; }
.awesome.orange:hover {
	font-size: 16px;
    font-weight: bold;
    background-color: #000;
    color: #ce5d29; /* f76647 */
    border: 2px solid #ce5d29;
}

.awesome.red:hover {
	font-size: 16px;
    font-weight: bold;
    background-color: #000;
    color: #800000;
    border: 2px solid #800000;
}

.awesome.orange {
	color: #fff;
    background-color: #ce5d29;
	border: 2px solid #ce5d29;
}

.awesome.red {
	color: #fff;
    background-color: #800000;
	border: 2px solid #800000;
}



.awesome.green:hover {
	font-size: 16px;
    font-weight: bold;
    background-color: #000;
    color: #006600;
    border: 2px solid #006600;
}

.awesome.green {
	color: #fff;
    background-color: #006600;
	border: 2px solid #006600;
}


.awesome {
	/* width: 200px; */
    position: relative;
    padding: .30rem 1.0rem;
    font-weight: 700;
    font-size: 16px;
    border-radius: .5rem;
    white-space: normal;
    /* -webkit-appearance: none; */
}


.fa-times-circle {
	color: #f85124;
}

/* .fa-ban {
	color: red;
	color: #f85124;
} */

.orange_see {
	/* color: red; */
	color: #f85124;
}

.vert_see {
	color: #00ff00; /* b2ed6d*/
}

.black_see {
	color: #3d3d3d;
}


span.surlign1 { font-style: normal; background-color: #ff0; color: #000;}
span.surlign2 { font-style: normal; background-color: #f9f; color: #000;}
span.surlign3 { font-style: normal; background-color: #f99; color: #000;}
span.surlign4 { font-style: normal; background-color: #99f; color: #000;}
span.surlign5 { font-style: normal; background-color: #080; color: #000;}
span.surlign6 { font-style: normal; background-color: #33a396;}


button {
	font-size: 18px;
	width: 	28px;
	height: 28px;
	padding: 0px;
	margin: 2px 0 2px;
	border-radius: 6px;
	cursor: pointer;
}
button.marg {
	margin: 5px 0;
}


button.check {
	background-color: #006600;
	border: 2px solid #006600;
	color: #fff;
}
button.check:hover {
	background-color: #000;
	border: 2px solid #006600;
	color: #fff;
}

button.ban {
	background-color: #800000;
	border: 2px solid #800000;
	color: #fff;
}
button.ban:hover {
	background-color: #000;
	border: 2px solid #800000;
	color: #fff;
}

button.trash {
	background-color: #fff;
	border: 2px solid #fff;
	color: #000;
}
button.trash:hover {
	background-color: #000;
	border: 2px solid #fff;
	color: #fff;
}

button.maj {
    padding-left: 3px;
    padding-right: 3px;
    width: 	max-content;
	background-color: #ff9100;
	border: 2px solid #ff9100;
	color: #000;
}
button.maj:hover {
	background-color: #000;
	border: 2px solid #ff9100;
	color: #fff;
}

button.maj-archive {
    width: 	max-content;
	height: 32px;
    font-size: 16px;
    padding-left: 10px;
    padding-right: 10px;
	background-color: #ff9100;
	border: 2px solid #ff9100;
	color: #333;
    font-weight: bold;
}
button.maj-archive:hover {
	background-color: #000;
	border: 2px solid #ff9100;
	color: #fff;
}

.form-status {
    display: inline;
}





/* New Ag Tab */
.ag-center {
	align-items: center;
	display: flex;
	justify-content: center;
	width: 100%;
	margin-bottom: 100px;
}
.ag-tab-g {
	background-color: #111;
	border: 2px solid #aaaaaa;

	display: flex;
    flex-wrap: nowrap;
    justify-content: center;

	width: 1280px;
}
.ag-tab-g > div {
	text-align: center;
	flex: 1;

	border: 1px solid #aaaaaa;
  }

.ag-tab-g-title {
	width: 100%;
	flex: 1;
}

/* New Ag Tab */



/* New Ag */
.ag-valid-gr {
	background-color: #003300;
	color: white;
}
.ag-nop-red {
	background-color: #330000;
	color: white;
}
.ag-col-yellow {
	background-color: #b7950b;
	color: black;
}
.ag-col-or {
	background-color: #873600;
	color: white;
}
.ag-col-delay {
	background-color: #5b2c6f;
	color: white;
}
.ag-cell-flag {
	background: linear-gradient(45deg, #333333 0%, #333333 50%, #b7950b 50%, #b7950b 100%);
	color: white;
}

.ag-date {
	background-color: #111;
	color: #fff;
	height: 70px;
	font-size: 20px;
	display: flex;
	justify-content: center;
    align-items: center;
	font-weight: bold;
	border: 2px solid #aaaaaa;

	/* max-width: 422px; */
}

.ag-fiche {
	display: flex;
	font-weight: bold;
	flex-direction: column;
	border: 1px solid #aaaaaa;
	/* height: 500px; */
}

.ag-fiche-title {
	font-size: 20px;
	padding: 14px 0px;
	border: 1px solid #aaaaaa;
	padding-left: 10px;
  	padding-right: 10px;
	/* width: 100%; */
	/* flex: 1; */

}

.ag-fiche-flex-col {
	display: flex;
	/* height: 500px; */
}

.ag-fiche-flex-rows {
	display: flex;
	flex-direction: column;
	height: 100%;
}
.ag-fiche-flex-rows > div {
	flex: 1;
}

.ag-fiche-flex-col-1 {
	/* flex: 1;  */
	/* flex-basis: 42%; */
    flex-basis: 10%;
	border: 1px solid #aaaaaa;

}
.ag-fiche-img {
	border-bottom: 2px solid #aaaaaa;
}
.ag-fiche-studio {
	padding: 5px 0;
	display: flex;
    justify-content: center;
    align-items: center;
	flex-direction: column;

	border-bottom: 2px solid #aaaaaa;
}
.ag-fiche-studio > div {
	padding: 5px 0;
}
.ag-fiche-tmdb {
	padding: 10px 0;
	display: flex;
    justify-content: center;
    align-items: center;

	border-bottom: 2px solid #aaaaaa;
}
.ag-fiche-anisch {
	padding: 10px 0;
	display: flex;
    justify-content: center;
    align-items: center;

	/* border-bottom: 1px solid #aaaaaa; */
}


.ag-fiche-flex-col-2 {
	flex: 1;
	border: 1px solid #aaaaaa;
}
.ag-fiche-type {
	padding: 5px 0;
	display: flex;
    justify-content: center;
    align-items: center;

	border-bottom: 2px solid #aaaaaa;
}
.ag-fiche-status {
	padding: 5px 0;
	display: flex;
    justify-content: center;
    align-items: center;

	border-bottom: 2px solid #aaaaaa;
}
.ag-fiche-saison {
	padding: 5px 0;
	display: flex;
    justify-content: center;
    align-items: center;

	border-bottom: 2px solid #aaaaaa;
}
.ag-fiche-ep {
	padding: 5px 0;
	display: flex;
    justify-content: center;
    align-items: center;

	border-bottom: 2px solid #aaaaaa;
}
.ag-fiche-to {
	padding: 5px 0;
	display: flex;
    justify-content: center;
    align-items: center;

	border-bottom: 2px solid #aaaaaa;
}
.ag-fiche-release {
	padding: 5px 0;
	display: flex;
	flex-direction: column;
    justify-content: center;
    align-items: center;

	border-bottom: 2px solid #aaaaaa;
}
.ag-fiche-edit {
	padding: 5px 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
    align-items: center;

	border-bottom: 2px solid #aaaaaa;
}
.ag-fiche-edit > div {
	padding: 5px 0;
}
.ag-fiche-bouton {
	padding: 5px 0;
	display: flex;
	align-items: center;
    justify-content: space-evenly;

	/* border-bottom: 2px solid #aaaaaa; */
}



.ss-tab {
	display: flex;
	border: 2px solid #aaa;
	width: 1280px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;
}

.ss-fiche {
	display: flex;
	flex-direction: column;
	flex: 1;
	/* max-width: 425px; */
}

.ss-fiche-title {
	border: 2px solid #aaa;
}

.ss-fiche-main {
	display: flex;
	border: 1px solid #aaa;
	height: 100%;
}

.ss-fiche-part-1 {
	flex-basis: 35%;
	display: flex;
	flex-direction: column;
}

.ss-fiche-part-1 > div {
	flex: 1;
	display: flex;
	justify-content: center;
  	align-items: center;
	border: 1px solid #aaa;
}

.ss-fiche-img {
	border: 1px solid #aaa;
}

.ss-fiche-part-2 {
	flex: 1;
	display: flex;
	flex-direction: column;
}

.ss-fiche-part-2 > div {
	flex: auto;
	display: flex;
	justify-content: center;
  	align-items: center;
	border: 1px solid #aaa;
}

.ss-fiche-text {
	height: 200px;
	overflow-x: auto;
	text-align: left;
	padding: 5px;
}



.icon-button-home {
    background: none; /* Enlève l'arrière-plan */
    border: none; /* Enlève la bordure */
    padding: 0; /* Enlève le padding */
    cursor: pointer; /* Change le curseur pour indiquer que c'est cliquable */
}

#copy-tooltip {
    position: absolute;
    display: none;
    padding: 5px 10px;  /* Ajouter du padding pour plus de confort visuel */
    background-color: #333;
    color: #fff;
    border-radius: 4px;
    font-size: 12px;
    z-index: 1000;
    pointer-events: none; /* Empêche le tooltip d'interférer avec la souris */
    text-align: center; /* Centre le texte à l'intérieur du tooltip */
    white-space: nowrap; /* Empêche le texte de s'étendre sur plusieurs lignes */
}


.marginB25 {
    margin-bottom: 25px;
}


.pagination-info {
    margin-bottom: 10px;
}

.pagination-controls .page-link {
    margin-right: 10px;
    text-decoration: none;
    padding: 5px 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.page-link.disabled {
    color: #ccc;
    background-color: #666;
    pointer-events: none;
}


.page-link.active {
    color: #ccc;
    background-color: #666;
    pointer-events: none;
}



.travail-form {
    max-width: 600px;
    margin: 20px auto;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 8px;
    background-color: #333;
}

.travail-form .form-group {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
}

.travail-form .form-group label {
    width: 35%;
    font-weight: bold;
    text-align: right;
    margin-right: 10px;
}

.travail-form .form-group input {
    width: 60%;
    padding: 5px 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.travail-form button {
    display: block;
    width: 100%;
    background-color: #4CAF50;
    color: white;
    border: none;
    border-radius: 4px;
    font-size: 16px;
    cursor: pointer;
}

.travail-form button:hover {
    background-color: #45a049;
}


.travailTd {
    border: 1px solid #aaa;
}

td[contenteditable="true"] {
    border: 1px dashed #ddd;
    padding: 5px;
}

td[contenteditable="true"]:focus {
    outline: 2px solid #007bff;
}