@import './color.css';
@import './style-color.css';
@import './style-perso.css';
@import './style-radius.css';
@import './style-border.css';
@import './style-padding.css';
@import './style-margin.css';
@import './style-shadow.css';
@import './style-font-size.css';

html {
    -webkit-text-size-adjust: 100%; /* Empêche Safari de changer l'échelle du texte */
}

body {
	margin: 0;
	font-family: var(--std-font-family);
	font-size: var(--font-size-fluid-1);
	line-height: 1.3;
	color: var(--text-1);
	background-color: var(--std-background);
	/* word-wrap: anywhere; */
	/* background-color: var(--std-card-section-background); */
}
/*
Polices communes à Windows, macOS, Android et iOS
	1.	Arial
	2.	Verdana
	3.	Tahoma
	4.	Trebuchet MS
	5.	Times New Roman
	6.	Georgia
	7.	Courier New
	8.	Impact

Police système pour toutes les plateforme
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

*/
a,
a:visited {
	color: var(--text-1);
}

p {
	margin-block-start: 0px;
	margin-block-end: 0px;
	line-height: 1.2!important;

	font-size: var(--font-size-fluid-1)!important;
}
p+p,
p+input {
	margin-top: 0.3rem;
	/* Ajustez la valeur de la marge comme nécessaire */
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--std-font-family-header)!important;
	color: var(--text-h)!important;
	/* Mise à zéro des paramètres du navigateur */
	margin-block-start: 0px!important;
	margin-block-end: 0px!important;
	word-wrap: anywhere!important;
}

h1 {
	font-size: var(--font-size-fluid-3)!important;
	font-weight: 500!important;
}

h2 {
	font-size: var(--font-size-fluid-2)!important;
	font-weight: 400!important;
	/* color: var(--logo-green); */
}

h3 {
	font-size: var(--font-size-fluid-1)!important;
	margin-block-end: 0.25rem!important;
	font-weight: 400!important;
}

h4 {
	font-size: var(--font-size-fluid-0)!important;
	font-weight: 300!important;
}

button {
	padding: 0px;
}

input,
textarea {
	/* Mise à zéro des paramètres du navigateur */

	font-family: var(--std-font-family);
	margin-block-start: 0px;
	margin-block-end: 0px;
	margin-inline-start: 0px;
	margin-inline-end: 0px;
	word-wrap: anywhere;

	padding: calc(var(--std-gap) / 2);

	background-color: var(--surface-1);
	border: var(--std-input-border);
	border-radius: var(--std-button-radius);
	box-shadow: var(--std-shadow-input);
	border-color: var(--std-item-border);

	box-sizing: border-box;
	color: var(--text-1);
	font-size: var(--font-size-fluid-1);
	
	outline: 0;
	width: 100%; 

	line-height: 150%;
}

input:focus,textarea:focus {
	border-color: var(--std-actioncolor-focus);
}


@media screen and (min-width: 574px) {
	input, textarea {
		width: calc(100% - (var(--std-gap) * 0));
	}
}

input[type='range'] {
	padding: 0;
	margin: 0;
	/* Mise à zéro des paramètres du navigateur */
	margin-block-start: 0px;
	margin-block-end: 0px;
	margin-inline-start: 0px;
	margin-inline-end: 0px;

}



h1+p,
h2+p,
h3+p,
h4+p,
h5+p,
h6+p {
	margin-top: 20px!important;
	/* Ajustez la valeur de la marge comme nécessaire */
}

p+h1,
p+h2,
p+h3,
p+h4,
p+h5,
p+h6 {
	margin-top: 20px!important;
	/* Ajustez la valeur de la marge comme nécessaire */
}

hr {
	border: 0;
	height: 1px;
	background-color: var(--brand);
	width: 100%;
	margin: 0;
}

/* une form DOIT contenir une section ou une div */
form {
	display: flex;
	flex-direction: column;
	align-items: center; 
	justify-items: center; 
	width: 100%; 
	/* bug sur safari iOs */
	margin: 0px;
	padding: 0px;
	/* max-width: 600px; */
	/* Les largeur doivent être ajustées selon les besoins 
	par les contener*/
}

.max-width {
	max-width: 600px;
}

caption {
	font-size: var(--font-size-fluid-00);
	padding: var(--std-gap);
}

table {
	width: 100%;
	border-collapse: collapse;
	margin-top: var(--std-gap);
	margin-bottom: var(--std-gap);
}
table,
th,
td {
	border: 1px solid #ddd;
}
th,
td {
	padding: 8px; /* Réduction du padding pour un tableau plus compact */
	text-align: left;
	font-size: var(--font-size-fluid-1); /* Taille de police réduite pour le tableau */
}
th {
	/* background-color: #f2f2f2; */
	font-weight: bold;
	text-align: center;
}
/* tr:nth-child(even) {
	background-color: #f9f9f9;
} */
tr:hover {
	background-color: #b7b5b5;
}