/* Copyright ? laisser : Interface graphique par Thoy et d?coupe par C?cile  */
/*  Pour : http://kits-gratuits.net/ */
/* Les couleurs sont modifiables ? volont?, cependant elles sont choisies en fonctions des tons du kit, mieux vaut les laisser intactes :) */

#nomappli {
    color: red;
    font-weight: bold;
    font-size: 2rem;
    text-decoration: underline;
    background-color:#f0f0f0;  
    width: 100%;             
    text-align: center;     
    padding: 20px 0;
	margin:50px 0;
}

/* Style pour les lignes paires (blanches) */
table tbody tr:nth-child(odd) {
    background-color: #fff;  /* Blanc pour les lignes impaires */
}

/* Style pour les lignes impaires (jaunes) */
table tbody tr:nth-child(even) {
    background-color: #f9f9c5;  /* Jaune pâle pour les lignes paires */
}


img { border: none; }

h2 { 
	font-size: 1.8em;
	color:#F5A200;
}

.btn-supprimer {
    width: 20px;   /* largeur désirée */
    height: 20px;  /* hauteur désirée */
    cursor: pointer; /* optionnel : curseur pointeur */
}
#centre h2 {
	margin: 0 0 20px 0;
	padding: 4px;
	font-weight: normal;
	border-bottom: 2px solid #ccc;
	background-color: #eee;
}

h3 { 
	font-size: 1.2em; 
	color: #0098A0 ;
	border-bottom: 1px solid #ccc;
	padding: 4px 0;
}

a { 
	color: #A00079;
	text-decoration: none;
	/*cursor: pointer;*/
}

a:hover { 
	color: #000; 
	text-decoration: underline;
}

a.bordered {
	margin:1px;
	padding: 1px;
	border:1px solid black;
}

.button.ajouter{
	color:#007D8A;
}


.alignement-gauche { text-align: left;}
.alignement-droite { text-align: right;}
.alignement-centre { text-align: center;}
.alignement-justifie { text-align: justify;}

#preview{
	display:none;
	position:fixed;
	width:800px;
	height:600px;
	top:80px;
	left:50%;
	overflow:auto;
	margin-left:-400px;
	background-color:#eee;
	border: 1px solid #ccc;
	padding: 8px 8px 60px 8px;
}

.frm-buttons {
	position:fixed;
	top:690px;
	left: 50%;
	width: 760px;
	text-align:center;
	margin: 10px 0 10px -388px;
	padding: 8px;
	background-color: #ccc;
	border:1px solid #aaa;
}


#liste {
position:absolute;
margin-left:0;
margin-top:0;
width:308px;
height:385px;
background-color:#FFF;
border: #DDEEFF 1px solid;
display:none;
}

#listecontenu {
height:345px;
}

#bloccentre {
position:absolute;

margin-top:0;
width:475px;
height:285px;
background-color:#FFF;
border: #DDEEFF 1px solid;
display:none;
}

#bloccentrecontenu  {
height:245px;
}

/* Conteneur pour les boutons */
.btn-container {
    display: flex;
    justify-content: flex-start; /* Aligner à gauche */
    gap: 10px; /* Espacement entre les boutons */
}

/* Si tu veux un petit alignement vertical */
.btn-container a {
    display: inline-block;
    vertical-align: middle;
}

.iconemenu{
float:left;
width:70px;
text-align:center;
font-size:9px;
}

.tab, .sous-tab {
	width:100%;
	border-collapse: collapse;
	margin: 20px auto;
}

table.data-table .tab {
	margin: 8px auto;
}

.tab caption {
	background-color: #def;
}

table.tab th {
	color: #444;
	background-color: #eee;
	border: #cde 1px solid;
	font-weight:normal;

}

.tab th a {
	color: #444;
}


.tab td {
	text-align: center;
	border: #cde 1px solid;
	padding: 2px;
}

td.montant {
	text-align: right;
}

tr.montant-total {
	text-align: right;
	font-weight: bold;
}

tr.montant-total td {
	text-align: right;
}

table.data-table tfoot {
	border-top: 1px solid #aaa;
}

table.data-table tfoot tr.montant-total {
	background-color: #ddf;
	color: #000;
}

td.dt-icons {
	text-align:center;
}

tr.dt-obj-ok, tr.dt-obj-nok {
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
}

tr.dt-obj-ok td, tr.dt-obj-nok td {
	font-weight: bold;
}

tr.dt-obj-ok {
	background: #dfd url(../images/success.png) 99% 50% no-repeat;
	color: #0a0;
}

tr.dt-obj-nok {
	background: #fdd url(../images/warning.png) 99% 50% no-repeat;
	color: #f00;
}

tr.dt-obj-ok td.right-aligned, tr.dt-obj-nok td.right-aligned {
	text-align:right;
}


tr.dt-obj-ok td.centered, tr.dt-obj-nok td.centered {
	text-align:center;
}

#navcol
{
    width: 200px;
    background-color: #F4FAFD;
}

#numcol
{
    width: 150px;
}

#tab tfoot
{

    background-color: #f2973a;
    color: #FFF;
    letter-spacing: 1px;
}



/* Elements de formulaires */

form {
}

.champ {
	width:200px;
	margin: 0 0 4px 0;
	border: 1px inset;
}

.montant {
	width:100px;
}


.submit {
	margin: 20px auto;
	text-align: center;
}

.form-search {}
.form-search fieldset {
	display:inline-block;
}

.form-search input[type=submit] {
	margin-left: 8px;
}

input[type=checkbox] {
	vertical-align:middle;
	margin-right: 4px;
}


textarea {
	display:block;
	width: 100%;
	height: 200px;
/*	border: 1px inset;*/
}

select {
	margin:  0 0 4px 0;
}

.bouton{
	width:120px;
	border: #DDEEFF 1px solid;
	background-color: #f2973a;
	font-weight:bold;
	margin: 10px 0;
	padding: 2px;
}

.minilien {
	font-size:0.85em;
}


/* the div that holds the date picker calendar */
.dpDiv {
	}


/* the table (within the div) that holds the date picker calendar */
.dpTable {
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-align: center;
	color: #505050;
	background-color: #ece9d8;
	border: 1px solid #AAAAAA;
	}


/* a table row that holds date numbers (either blank or 1-31) */
.dpTR {
	}


/* the top table row that holds the month, year, and forward/backward buttons */
.dpTitleTR {
	}


/* the second table row, that holds the names of days of the week (Mo, Tu, We, etc.) */
.dpDayTR {
	}


/* the bottom table row, that has the "This Month" and "Close" buttons */
.dpTodayButtonTR {
	}


/* a table cell that holds a date number (either blank or 1-31) */
.dpTD {
	border: 1px solid #ece9d8;
	}


/* a table cell that holds a highlighted day (usually either today's date or the current date field value) */
.dpDayHighlightTD {
	background-color: #CCCCCC;
	border: 1px solid #AAAAAA;
	}


/* the date number table cell that the mouse pointer is currently over (you can use contrasting colors to make it apparent which cell is being hovered over) */
.dpTDHover {
	background-color: #aca998;
	border: 1px solid #888888;
	cursor: pointer;
	color: red;
	}


/* the table cell that holds the name of the month and the year */
.dpTitleTD {
	}


/* a table cell that holds one of the forward/backward buttons */
.dpButtonTD {
	}


/* the table cell that holds the "This Month" or "Close" button at the bottom */
.dpTodayButtonTD {
	}


/* a table cell that holds the names of days of the week (Mo, Tu, We, etc.) */
.dpDayTD {
	background-color: #CCCCCC;
	border: 1px solid #AAAAAA;
	color: white;
	}


/* additional style information for the text that indicates the month and year */
.dpTitleText {
	font-size: 12px;
	color: gray;
	font-weight: bold;
	}


/* additional style information for the cell that holds a highlighted day (usually either today's date or the current date field value) */ 
.dpDayHighlight {
	color: #4060ff;
	font-weight: bold;
	}


/* the forward/backward buttons at the top */
.dpButton {
	font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: gray;
	background: #d8e8ff;
	font-weight: bold;
	padding: 0px;
	}


/* the "This Month" and "Close" buttons at the bottom */
.dpTodayButton {
	font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: gray;
	background: #d8e8ff;
	font-weight: bold;
	}
	
	
/*---------- bubble tooltip -----------*/
div.tt{
    position:relative;
    z-index:24;
    text-decoration:none;
}

div.tt div { display: none; }

/*background:; ie hack, something must be changed in a for ie to execute it*/
div.tt:hover{ z-index:25; color: #aaaaff;}
div.tt:hover div.tooltip {
	display:block;
	position:absolute;
	bottom: 20px; 
	left:0;
	padding: 8px;
	width:300px;
	color:#000;
	border: 2px solid #000;
	-moz-border-radius: 8px;
	background-color: #fff;
    font-weight: normal;
}

.tooltip h4 {
	margin:0;
}


body {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 76%;
	margin: 0;
	padding: 0;
}

p {
	margin: 0 0 10px 0;
}

#conteneur {
	width:1400px;
	position:relative;
	margin:0 auto;
	background: #fff url(../images/bande-1pxl-long_02.jpg) repeat-y;
	background-size: 100% auto;
}


#header {
	width: 100%;
	height: 250px;
	z-index: 100;
	
}

#logo {
 position:absolute;
 margin-left:160px;
 width:474px;
 margin-top:10px;
}

#nomsociete {
	position:absolute;
	right:20px;
	top:150px;
	font-size:2.5em;
	color:red;
	background-color: #eee;
	border: 1px solid #ccc;
	padding: 8px;
	-moz-border-radius: 8px;
	 transform: translateX(-90%);
}

#liens-haut {
	position:absolute;
	right:12px;
	top: 12px;
}
 
#liens-haut img {
	vertical-align: middle;
	margin-right: 4px;
}			

#centre {
	padding-left:10px;
	padding-right:10px;
	margin-left: 160px;
	margin-right: 0px;
	min-height:400px;
}

#gauche {
	position:absolute;
	width: 160px;
	font-size: 0.9em;
	background-color: #fff;
}

#idsessagence {
	width: 160px;
	background-color: #0098A0  ;
	font-weight:bold;
	color:white;
}

#idclient{
	background-color: #a9cce3  ;
	font-weight:bold;
}

#gauche fieldset {
	margin: 10px 0 0 0;
}

ul#menugauche {
	list-style-type: none;
/*	width: 200px;*/
	margin: 0;
	padding:0;
}

ul#menugauche li {
	min-height:25px;
	margin:5px 0;
	background: transparent url(../images/curseur-noir.jpg) 0 0 no-repeat;
}

ul#menugauche li:hover {
	background: transparent url(../images/curseur-orange.jpg) 0 0 no-repeat;
}

ul#menugauche li.selected {
	background: transparent url(../images/curseur-orange.jpg) 0 0 no-repeat;
}

ul#menugauche .bloc {
	display:block;
	margin-left:50px;
	padding: 0 4px;
	height:24px;
	line-height:24px;
	min-height:24px;
}

#menugauche .bloc:hover {
	color: #fff;
	background-color:#f2973a;
}

#menugauche a{
color: #000000;
text-decoration: none;
}

#menugauche a:hover {
	color: #fff;
	background-color:#f2973a;
}

#gauche ul {
	margin:0;
	padding:0;
	list-style-image: none;
	list-style-type: none;
}

#gauche ul li {
	padding: 2px 0;
}

#gauche .ui-accordion .ui-accordion-content {
	padding: 8px;
}


.previous-page {
	padding: 30px 0 0 20px;
}

.previous-page img {
	vertical-align: middle;
	margin-right: 4px;
}

ul.sousmenu {
	list-style-type:none;
	margin:0;
	padding:0;
}

#conteneur ul.sousmenu li { 
	margin:0 0 0 70px;
	padding: 0 0 0 0;
	background: 0 none;
}

#conteneur ul.sousmenu li a {
	display:block;
	padding: 6px 4px;
}

/* Secondary links */
.secondary-links {
	margin: 10px auto;
}

#pied {
	clear:both;
	height:265px;
	background-color: #FFF;
	background: #fff url(../images/bandeau-bas.jpg) no-repeat;
	background-size: 100% auto;
}

#textepied {
	padding-top: 50px;
	text-align:center;
	font-size:0.8em;
	background: transparent url(../images/croix-orange.jpg) 377px 0 no-repeat;
	background-position: center;
}


fieldset {
	border: 0 none;
	padding:0;
	margin: 10px auto;
}

fieldset label {
	display:inline-block;
	min-width: 180px;
	font-weight: bold;
}

fieldset input {
	display:inline-block;
	margin: 0 0 2px 4px;
}

fieldset input.montant {
	width: 80px;
}

fieldset fieldset {
	padding: 8px;
	background-color: #efefef;
	border: 1px solid #ccc;
	-moz-border-radius: 8px;
}

fieldset fieldset legend {
	margin: 0 8px;
	padding: 0 6px;
	color:#800080;
}

/* ----------
	Relances
*/

a.relance {
	display: block;
	width: 16px;
	height: 16px;
	text-decoration: none;
	margin-bottom: 2px;
	outline: none;
}

.relance span {
	display: block;
	width: 16px;
	height: 16px;
	text-indent: -5000px;
}

.relance-telephone span {
	background: transparent url(../../../images/design/relance-t-on.png) 0 0 no-repeat;
}

.relance-1 span {
	background: transparent url(../../../images/design/relance-1-off.png) 0 0 no-repeat;
}

.relance-1-activee span {
	background: transparent url(../../../images/design/relance-1-on.png) 0 0 no-repeat;
}

.relance-2 span {
	background: transparent url(../../../images/design/relance-2-off.png) 0 0 no-repeat;
}

.relance-2-activee span {
	background: transparent url(../../../images/design/relance-2-on.png) 0 0 no-repeat;
}

.relance-3 span {
	background: transparent url(../../../images/design/relance-3-off.png) 0 0 no-repeat;
}

.relance-3-activee span {
	background: transparent url(../../../images/design/relance-3-on.png) 0 0 no-repeat;
}

.relance-a-imprimer {
	background: transparent url(../../../images/design/print.png) 0 0 no-repeat;
}

span.relance-ok {
	background: transparent url(../../../images/design/ok.png) 0 0 no-repeat;
}

span.relance-attente {
	background: transparent url(../../../images/design/sablier.png) 0 0 no-repeat;
}


td.relance-total {
	text-align:right;
	background-color: #eee;
}

td.relance-lister-client {}
td.relance-lister-factures {
	vertical-align: top;
}
td.relance-lister-historique {
	vertical-align: top;
}
td.relance-lister-relance {}

.note {
	margin: 10px auto 20px auto;
	padding: 0 0 20px 0;
	min-height: 60px;
	border-top: 1px solid #ddd;
	border-left: 6px solid #ddd;
	border-right: 1px solid #bbb;
	border-bottom: 1px solid #bbb;
}
.note .entete {
	background-color: #eee;
	border-bottom: 1px solid #ccc;
	padding: 4px;
	overflow:auto;
	color: #555;
	font-size: 0.95em;
}

.note .soumispar, .note .type {
	margin:0;
	padding: 0;
}

.note .soumispar {
	float: left;
}

.note .type {
	float: right;
}


.note .corps {
	padding: 8px 4px 4px 4px;
}

.pagination {
	height: 24px;
	line-height: 24px;
	border: 1px solid #ccc;
	background-color: #ddd;
	margin: 8px 0;
	padding: 2px 8px;
	font-size: 0.9em;
}
.pagination .gauche {
	float: left;
}

.pagination .droite {
	float: right;
}

.pagination .centre {
	text-align:center;
}

.pagination a {
	text-decoration: none;
}

.cke_toolgroup {
    background-color: #f5f5dc; /* Couleur de fond pour un groupe spécifique */
	margin-right: 20px;  
}

/* Messsages */
.error {
	color: #f00;
	background: #fdd url(../images/error.png) 8px 50% no-repeat;
	padding: 10px 10px 10px 32px;
	margin: 10px 0;
	border: 1px solid #c00;
}

.success {
	color: #080;
	background: #dfd url(../images/success.png) 8px 50% no-repeat;
	padding: 10px 10px 10px 32px;
	margin: 10px 0;
	border: 1px solid #0c0;
}

.calendar-image {
	vertical-align:middle;
	margin: 0 4px;
	cursor:pointer;
}

/* Date range */
.form-filter {
	background-color: #eee;
	border: 1px solid #ddd;
	padding: 0 4px;
	-moz-border-radius: 4px;
}

.form-filter fieldset {
	margin:0;
	padding: 4px 0 3px 0;
}


.form-filter fieldset label {
	width:30px;
	min-width: 30px;
}

.form-filter .champ {
	width: 80px;
}

.form-filter select {
	margin-right: 4px;
}

.debug-info {
font-size: 1.3em;
text-align:left;
margin-top: 20px;
padding: 10px 0;
border-top: 2px solid #444;
border-bottom: 2px solid #444;
}

.debug-info h2 {
font-size: 1.2em;
color: #44a;
}

.debug-summary {
background-color: #eee;
padding: 10px;
border: 1px solid #ccc;
font-weight: bold;
margin: 0 0 20px 0;
}

.debug-summary p { 
margin:0; 
}

#destinataire-courrier {
}

#destinataire-courrier td {
vertical-align:top;
}

#destinataire-courrier td select {
width: 180px;
}


.legend { font-size: 0.9em; color: #444;}
.legend ul { list-style-type: none; margin: 10px 0; padding: 0;}
.legend ul li { margin: 4px 0;}

