:root {
    --color-primary: #871326; /* rouge FESP principal */
    --color-secondry: #600e1d; /* rouge foncé adapté */
    --color-hover: #a51830; /* rouge plus clair pour hover */

    --rgba-primary-1: rgba(135, 19, 38, 0.1);
    --rgba-primary-2: rgba(135, 19, 38, 0.2);
    --rgba-primary-3: rgba(135, 19, 38, 0.3);
    --rgba-primary-4: rgba(135, 19, 38, 0.4);
    --rgba-primary-5: rgba(135, 19, 38, 0.5);
    --rgba-primary-6: rgba(135, 19, 38, 0.6);
    --rgba-primary-7: rgba(135, 19, 38, 0.7);
    --rgba-primary-8: rgba(135, 19, 38, 0.8);
    --rgba-primary-9: rgba(135, 19, 38, 0.9);

    --text-sec: #2d3239;
}

@import url('https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i|Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i|Playfair+Display:400,400i,700,700i,900,900i|Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i|Raleway:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i|Roboto+Condensed:300,300i,400,400i,700,700i|Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&display=swap');

body {
	background-color: #f7f9fb;
	font-family: 'Poppins', sans-serif;
	font-size: 12px;
	font-weight: 400;
	color: #6f6f6f;
}

.h4, .h5, .h6, h4, h5, h6, .titre {
	font-weight: 600;
}
h1, h2, h3, h4, h5, h6, .titre {
	color: #232323;
	font-family: "Poppins",sans-serif;
}
h4, .titre {
	font-size: 22px;
	line-height: 28px;
	margin-bottom: 15px;
}
.h4, h4, .titre {
	font-size: 1.5rem;
}
.h4, h4, .titre {
	font-size: calc(1.275rem + .3vw);
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6, .titre {
	margin-top: 0;
	margin-bottom: .5rem;
	font-weight: 500;
	line-height: 1.2;
	color: var(--bs-heading-color);
}
.titre {
	margin-left: 10px;
}

.ticketpublicarea {
    font-family: "Segoe UI", sans-serif;
    color: var(--text-sec);
}

.ticketpublicarea .ticketform {
    display: flex;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
}

#form_create_ticket, 
#form_view_ticket
{
	margin: 0;
	padding-left:1em;
	padding-right:1em;
	padding-top:1.5em;
	padding-bottom:12px;

	background-color: #fff !important;

	border-width: 1px;
	border-style: solid;
	border-color: #ebedf2 !important;
	font-size: 14px;

	box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.1) !important;
	border-radius: 0 !important;
}

.ticketform .index_create,
.ticketform .index_display {
    text-align: center;
    margin: 20px 0 !important;
}

.ticketform .butAction {
    display: block;
    text-align: center;
    text-decoration: none;
    border-radius: 8px;
    background-color: var(--color-primary);
    color: #fff;
    padding: 0px 10px;
    transition: background-color 0.3s ease;
    box-shadow: 0 2px 5px var(--rgba-primary-3);
}

.ticketform .butAction:first-child {
    /*margin-left: 20px;*/
}

.ticketform .butAction:hover {
    background-color: var(--color-hover);
    box-shadow: 0 4px 8px var(--rgba-primary-5);
}

.ticketform .fa,
.ticketform .fas {
    font-size: 28px;
    margin-bottom: 10px;
    color: #fff;
}

form#form_create_ticket table.border {
    width: 100%;
    border-collapse: collapse;
    overflow: hidden;
}

form#form_create_ticket td {
    padding: 15px;
    vertical-align: top;
}

form#form_create_ticket .titlefield {
    font-weight: 600;
    width: 250px;
    color: var(--text-sec);
}

form#form_create_ticket input[type="text"],
form#form_create_ticket input[type="email"],
form#form_create_ticket input[type="file"],
form#form_create_ticket select {
    padding: 10px 12px;
    border-left: none !important;
    border-right: none !important;
    border-top: none !important;
    border-bottom: 1px solid #ccc;
    font-size: 16px;
    transition: border 0.2s;
}
form#form_create_ticket textarea {
    padding: 10px 12px;
    border: 1px solid #ccc;
    font-size: 16px;
    transition: border 0.2s;
}

form#form_create_ticket input:focus,
form#form_create_ticket select:focus,
form#form_create_ticket textarea:focus {
    border-color: var(--color-primary);
    outline: none;
}

form#form_create_ticket .button {
    background-color: var(--color-primary);
    color: #fff;
    border: none;
    padding: 12px 24px;
    font-size: 15px;
    border-radius: 6px;
    cursor: pointer;
    margin-right: 10px;
    transition: background-color 0.3s ease;
}

form#form_create_ticket .button:hover {
    background-color: var(--color-hover);
}

form#form_create_ticket .warning {
    background: var(--rgba-primary-1);
    padding: 10px;
    border-left: 4px solid var(--color-primary);
    margin-bottom: 10px;
    color: var(--text-sec);
    font-size: 14px;
}