@charset "utf-8";
/* CSS Document */

@font-face
	{
	font-family:'title'; font-style:normal; font-weight:400;
	src:url('fonts/Roboto-Condensed.ttf') format('ttf');
	src:url('fonts/Roboto-Condensed.eot') format('eot');
	src:url('fonts/Roboto-Condensed.svg') format('svg');
	src:url('fonts/Roboto-Condensed.woff') format('woff');
	}

@font-face
	{
	font-family:'title'; font-style:normal; font-weight:700;
	src:url('fonts/Roboto-Condensed-Bold.ttf') format('ttf');
	src:url('fonts/Roboto-Condensed-Bold.eot') format('eot');
	src:url('fonts/Roboto-Condensed-Bold.svg') format('svg');
	src:url('fonts/Roboto-Condensed-Bold.woff') format('woff');
	}

@font-face
	{
	font-family:'text'; font-style:normal; font-weight:400;
	src:url('fonts/Roboto-Condensed.ttf') format('ttf');
	src:url('fonts/Roboto-Condensed.eot') format('eot');
	src:url('fonts/Roboto-Condensed.svg') format('svg');
	src:url('fonts/Roboto-Condensed.woff') format('woff');
	}

:root
	{
	--activebgcolor:#5aa423;
	--activebgcolorover:#4a831c;
	--activefgcolor:#efefef;
	--activefgcolorover:#ffffff;
	--successbgcolor:#5aa423;
	--successbgcolorover:#4a831c;
	--successfgcolor:#efefef;
	--successfgcolorover:#ffffff;
	--alertbgcolor:#c60f13;
	--alertbgcolorover:#9e0c0f;
	--alertfgcolor:#efefef;
	--alertfgcolorover:#ffffff;
	--warningbgcolor:#ffae00;
	--warningbgcolorover:#cc8b00;
	--warningfgcolor:#efefef;
	--warningfgcolorover:#ffffff;

	--texte-attribue-color: #5aa423;
	--texte-selectionne-color: #2a7ae2;
	}

body	{ font-family:'text',Verdanna,sans-serif; overflow-y:scroll; background-color:#e0e0e0ff; }
body * { outline: unset; }

body header .title-bar	{ background:transparent; }
body header .title-bar-title	{ font-size:1.25rem; padding-left:0.2rem; }

body .top-bar ul	{ background-color:transparent; text-transform:uppercase; font-size:0.9rem; }
body .top-bar ul.submenu	{ background-color:#dfdfdf; min-width:20rem; }
body .top-bar li>i	{ font-size:1.1rem; }

main	{ min-height:700px; }

body .centrer	{ max-width:75rem; margin-left:auto; margin-right:auto; }

body .centrer-large {
	max-width: 90rem;
	margin-left: auto;
	margin-right: auto;
}

#topbar	{ background:none; }

body header	{ background-color:#000000; min-width:100%; max-width:100%; }
body header.sticky	{ z-index:200; }

body footer	{ background-color:#252525; font-size:0.8rem; padding:1rem 0; }
body footer p	{ font-size:1rem; color:#dfdfdf; }

#offCanvasLeft	{ background-color:rgba(0,0,0,0.8); color:#e0e0e0; }

body ul.breadcrumbs	{ padding-bottom:0; }
body ul.breadcrumbs li	{ font-family:'text',Arial,sans-serif; font-size:0.9rem; line-height:1.2rem; }

body .menu li	{ font-family:'title',Arial,sans-serif; font-size:1.0rem; text-transform:uppercase; }
body .menu li>a	{ border-radius:4px; }
body .menu li.is-active>a			{ color:var(--activefgcolor); background-color:var(--activebgcolor); }
body .menu li.is-active>a:hover	{ color:var(--activefgcolorover); background-color:var(--activebgcolorover); }
body .menu li>a:hover	{ color:#FFFFFF; background-color:rgba(0,0,0,0.3)!important; }

#offCanvasLeft ul.menu ul	{ background-color:rgba(0,0,0,.15); margin:0; margin-left:1rem; border-left:1px rgba(255,255,255,0.2) solid; }
#offCanvasLeft ul.menu li	{ list-style:none; text-transform:uppercase; font-size:0.9rem; }
#offCanvasLeft ul.menu li.is-submenu-parent-item	{ background-color:rgba(255,255,255,0.2); }
#offCanvasLeft ul.menu li a			{ color:#e0e0e0; }
#offCanvasLeft ul.menu li a:hover	{ color:#ffffff; background-color:rgba(0,0,0,.30); }

body h1, body h2, body h3, body h4, body h5, body h6	{ text-transform:uppercase; font-family:'title',Arial,sans-serif; font-weight:700; line-height:1; margin-bottom:1.0rem; }

body h1	{ font-size:2.5rem; }
body h2	{ font-size:1.5rem; font-weight:400; }
body h3	{ font-size:1.25rem; font-weight:400; }
body h4	{ font-size:1.0rem; }

main p                                             { color:#454545; font-size:1.0rem; line-height:1.1rem; }
main p.callout.secondary {
	color: #454545;
}
main .head, body .head p	{ color:#252525; font-size:1.2rem; line-height:1.6rem; font-family:'text',Arial,sans-serif; font-weight:bold; }
main .head, body .bloc	{ margin-bottom:1.5rem; }
main .centrer	{ padding:0 0 2rem 0; }

body .panel
	{
	padding:1.0rem; margin:1.0rem 0rem 0rem 0rem;
	background-color:rgba(255,255,255,0.8);
	border-radius:8px;
	}
body .panel.shadow	{ box-shadow: 0px 0px 16px 0px #151515; }

body .button, body .menu .button {
	font-family: 'title',Arial,sans-serif;
	text-transform: uppercase;
	font-size: 0.9rem;
	line-height: 1.1;
}
body .button.success	{ color:#ffffff; }

body ul.pagination	{ margin:0; }
body ul.pagination>li	{ min-width:36px; text-align:center; font-family:'title',Arial,sans-serif; }
body ul.pagination .current { padding:0; background:#404040; }
body ul.pagination .current>a	{ color:#ffffff; }

body .handler	{ background:url(handler.png); }

body .breadcrumbs	{ margin:0; padding:1.25rem 1.0rem 1.0rem 1.0rem; }

body .input-group select	{ margin:0; }
body input[required], body select[required]	{ background-color:#d7bbff22; }
body input[required]::placeholder { color:#82799188; }

body input[readonly], body select[readonly]	{ background-color:#ffbbbb22; }
body input[readonly]::placeholder { color:#8f000088; }

.reveal-modal, .reveal-modal-bg { position: fixed; overflow: scroll; }

body i.ico	{ font-size:1.5rem; }
body i.ico.big	{ font-size:3.0rem; }

body .is-at-top	{ margin-top:0!important; }

body .clearfix	{ height:0; line-height:0; float:none; clear:both; }

#AjaxModal		{  }

#AjaxModal	{ padding:0rem; outline:none; border:3px #454545 solid; background-color:#e5e5e5; border-radius:8px; }
#AjaxModal>.content	{ padding:0.5rem; }
#AjaxModal>h2	{ font-size:1.25rem; background-color:#252525; color:#efefef; border:none; padding:0.35rem 1rem; margin:0; }
#AjaxModal>.close-button	{ color:#ffffff; top:0; font-size:1.8rem; }
#AjaxModal>button>i	{ color:#cfcfcf; cursor:pointer; }

#autocompletelist		{ background-color:#efefef; box-shadow: 0px 0px 10px -2px #656565; border:1px #b5b5b5 solid; z-index:1050; position:fixed; display:none; min-height:2rem; }
#autocompletelist>li	{ min-width:30rem; max-width:80%; text-transform:none!important; }
#autocompletelist>li>a,#autocompletelist>li>span { font-size:1rem; padding:0.75rem 0.5rem; }
body ul.ui-autocomplete.ui-menu { z-index: 1511; position:fixed; }

/* GENRE */
body .genre0, body a.genre0, body genre0 a	{ color:#454545; }
body .genre1, body a.genre1, body genre1 a	{ color:#3e7cff; }
body .genre2, body a.genre2, body genre2 a	{ color:#ea0075; }
body .genre3, body a.genre3, body genre3 a	{ color:#a76a43; }
body a.genre0:hover,body a.genre1:hover,body a.genre2:hover,body a.genre3:hover { text-decoration:underline;  }

body .label.genre0	{ background-color:#444444; color:#ffffff; }
body .label.genre1	{ background-color:#3e7cff; color:#ffffff; }
body .label.genre2	{ background-color:#ea0075; color:#ffffff; }
body .label.genre3	{ background-color:#a76a43; color:#ffffff; }

/* FIELDSET */
body fieldset.fieldset	{ padding:0.5rem 0.75rem 0.75rem 0.75rem; background-color:rgba(0,0,0,0.01); border-radius:8px; }
body fieldset.fieldset>legend	{ font-family:'title'; font-size:0.9rem; }

/* TALEAUX */
body th	{ background-color:#a0a0a0; color:#ffffff; font-family:'title',Arial,sans-serif; font-weight:normal; }

/* TABS */
body ul.tabs	{ border:none; }
body ul.tabs>li>a	{ font-family:'title'; text-transform:uppercase; outline:none;  }
body ul.tabs>li.is-active>a	{ background-color:#ffffff; }
body ul.tabs>li>a	{ font-size:1.0rem; line-height:1.5rem; }
body ul.tabs>li>a>.title			{ display:none; }
body ul.tabs>li.is-active>a>.title	{ display:inline; }

body .tabs-content	{ border-radius:8px; border:1px #aaaaaa solid; }
body .tabs-content>.tabs-panel	{ padding:0.5rem; }
body ul.tabs	{ padding:0.5rem 0 0 0.5rem; border:none; background:none; } 
body ul.tabs .tabs-title	{ text-transform:uppercase; font-size:0.9rem; }
body ul.tabs .tabs-title>a
	{
	padding:0.4rem 0.7rem 0.3rem 0.7rem; margin-right:0.7rem; display:flex; align-items:center;
	font-size:1.0rem; line-height:1.2rem; text-transform:uppercase; color:#606060; min-height:2.3rem;
	background:linear-gradient(to top, #a2a2a299 0%,#ffffff88 40%);
	border-top-left-radius:8px; border-top-right-radius:8px; border:1px #aaaaaa solid; border-bottom:none;
	}
body ul.tabs .tabs-title>a:hover	{ background-color:rgba(255,255,255,0.9); color:#000000; }
body ul.tabs .tabs-title>a>i { margin-right:0.25rem; }
body ul.tabs .tabs-title>a>.badge	{ padding-top:0; padding-bottom:0; }
body ul.tabs .tabs-title.is-active a	{ background:#FFF; color:#333; transform: translateY(1px); font-weight:bold;  }

body ul.tabs.vertical	{ padding-left:0; padding-top:1rem; }
body ul.tabs.vertical .tabs-title>a
	{
	background:linear-gradient(to left, #a2a2a266 0%,#ffffff88 16px); margin-right:0; margin-bottom:0.25rem; padding:0.75rem 0.75rem 0.75rem 0.5rem;
	border-radius:0; border-top-left-radius:8px; border-bottom-left-radius:8px; border-right:none;  border:1px #f0f0f0 solid; border-right:none;
	}
body ul.tabs.vertical .tabs-title>a>i	{ font-size:1.5rem; }
body ul.tabs.vertical .tabs-title.is-active>a	{ background:#e7e7e7; border-color:#e7e7e7; padding:0.75rem 0.5rem 0.75rem 0.75rem; }

body .tabs-content.vertical	{ background:linear-gradient(to right, #e7e7e7 0%,#ffffff 100%); border:1px #e7e7e7 solid; border-radius:8px; }


/* SORTABLE */
body ul[data-sortable] { margin:0; }
body ul[data-sortable] li	{ list-style:none; }
body ul[data-sortable] li table	{ margin:0; margin-bottom:5px; }
body ul[data-sortable] li .handler	{ background-color:#CFCFCF; cursor:pointer; }

body .pointer, body [data-pointer]	{ cursor:pointer; }
body .callout.pointer, body .callout[data-pointer]	{ background-color:rgba(0,0,0,0.05); border-color:rgba(0,0,0,0.1); }
body .callout.pointer:hover, body .callout[data-pointer]:hover	{ background-color:rgba(0,0,0,0.5); }
body .callout.pointer:hover a, body .callout[data-pointer]:hover a	{ color:#efefef; }

body .callout.pointer.success a, body .callout.success[data-pointer] a, body .callout.success.pointer	{ color:#efefef; }
body .callout.pointer.success .grey, body .callout.success[data-pointer] .grey	{ color:#cfcfcf; }
body .callout.pointer.success, body .callout.success[data-pointer]	{ background-color:var(--successbgcolor); }
body .callout.pointer.success:hover, body .callout.success[data-pointer]:hover	{ background-color:var(--successbgcolorover); }

body .callout.pointer.warning a, body .callout.warning[data-pointer] a	{ color:#efefef; }
body .callout.pointer.warning .grey, body .callout.warning[data-pointer] .grey	{ color:#cfcfcf; }
body .callout.pointer.warning, body .callout.warning[data-pointer]	{ background-color:var(--warningbgcolor); }
body .callout.pointer.warning:hover, body .callout.warning[data-pointer]:hover	{ background-color:var(--warningbgcolorover); }

body .callout.pointer.alert a, body .callout.alert[data-pointer] a	{ color:#efefef; }
body .callout.pointer.alert .grey, body .callout.alert[data-pointer] .grey	{ color:#cfcfcf; }
body .callout.pointer.alert, body .callout.alert[data-pointer]	{ background-color:var(--alertbgcolor); }
body .callout.pointer.alert:hover, body .callout.alert[data-pointer]:hover	{ background-color:var(--alertbgcolorover); }

body .list>.callout	{ margin-bottom:0.5rem; }

body .callout.success strong	{ color:var(--successbgcolorover); }
body .callout.warning strong	{ color:var(--warningbgcolorover); }
body .callout.alert strong		{ color:var(--alertbgcolorover); }


body .caps	{ text-transform:uppercase; font-family:'text',Arial, sans-serif; }

body .pa0		{ padding:0.0rem!important; }
body .pa2		{ padding:0.25rem!important; }
body .pa5		{ padding:0.5rem!important; }
body .pa10		{ padding:1.0rem!important; }
body .pa15		{ padding:1.5rem!important; }
body .pa20		{ padding:2.0rem!important; }

body .pal0		{ padding-left:0.0rem!important; }
body .pal2		{ padding-left:0.25rem!important; }
body .pal5		{ padding-left:0.5rem!important; }
body .pal10	{ padding-left:1.0rem!important; }
body .pal15	{ padding-left:1.5rem!important; }
body .pal20	{ padding-left:2.0rem!important; }

body .par0		{ padding-right:0.0rem!important; }
body .par2		{ padding-right:0.25rem!important; }
body .par5		{ padding-right:0.5rem!important; }
body .par10	{ padding-right:1.0rem!important; }
body .par15	{ padding-right:1.5rem!important; }
body .par20	{ padding-right:2.0rem!important; }

body .pat0		{ padding-top:0.0rem!important; }
body .pat2		{ padding-top:0.25rem!important; }
body .pat5		{ padding-top:0.5rem!important; }
body .pat10	{ padding-top:1.0rem!important; }
body .pat15	{ padding-top:1.5rem!important; }
body .pat20	{ padding-top:2.0rem!important; }

body .pab0		{ padding-bottom:0.0rem!important; }
body .pab2		{ padding-bottom:0.25rem!important; }
body .pab5		{ padding-bottom:0.5rem!important; }
body .pab10	{ padding-bottom:1.0rem!important; }
body .pab15	{ padding-bottom:1.5rem!important; }
body .pab20	{ padding-bottom:2.0rem!important; }

body .ma0		{ margin:0.0rem!important; }
body .ma2		{ margin:0.25rem!important; }
body .ma5		{ margin:0.5rem!important; }
body .ma10		{ margin:1.0rem!important; }
body .ma15		{ margin:1.5rem!important; }
body .ma20		{ margin:2.0rem!important; }

body .mat0		{ margin-top:0.0rem!important; }
body .mat5		{ margin-top:0.5rem!important; }
body .mat2		{ margin-top:0.25rem!important; }
body .mat10	{ margin-top:1.0rem!important; }
body .mat15	{ margin-top:1.5rem!important; }
body .mat20	{ margin-top:2.0rem!important; }

body .mab0		{ margin-bottom:0.0rem!important; }
body .mab2		{ margin-bottom:0.25rem!important; }
body .mab5		{ margin-bottom:0.5rem!important; }
body .mab10	{ margin-bottom:1.0rem!important; }
body .mab15	{ margin-bottom:1.5rem!important; }
body .mab20	{ margin-bottom:2.0rem!important; }

body .mal0		{ margin-left:0rem!important; }
body .mal2		{ margin-left:0.2rem!important; }
body .mal5		{ margin-left:0.5rem!important; }
body .mal10	{ margin-left:1.0rem!important; }
body .mal15	{ margin-left:1.5rem!important; }
body .mal20	{ margin-left:2.0rem!important; }

body .mar0		{ margin-right:0rem!important; }
body .mar2		{ margin-right:0.2rem!important; }
body .mar5		{ margin-right:0.5rem!important; }
body .mar10	{ margin-right:1.0rem!important; }
body .mar15	{ margin-right:1.5rem!important; }
body .mar20	{ margin-right:2.0rem!important; }

body .cond		{ font-family:'title'; }

body .rot90	{ transform:rotate(90deg); }
body .rot180	{ transform:rotate(180deg); }
body .rot270	{ transform:rotate(270deg); }

body .grey	{ color:#a0a0a0; }

body span.tiny,body p.tiny,body .tiny		{ font-size:0.6rem; line-height:130%; }
body span.small, body p.small, body .small, body .small.button, body .small.button.secondary {
	font-size: 0.8rem;
	line-height: 130%;
}
body span.medium,body p.medium,body .medium	{ font-size:1.0rem; line-height:120%; }
body span.big,body p.big,body .big			{ font-size:1.2rem; line-height:120%; }
body span.large,body p.large,body .large		{ font-size:1.5rem; line-height:120%; }


/* SWITCHES */
body .switch>.switch-paddle>span>i	{ font-size:1.25rem; margin-left:0.15rem; }

body .switch.success>input:not(:checked)~.switch-paddle	{ }
body .switch.success>input:checked~.switch-paddle { background:var(--successbgcolor); }';

body .switch.warning>input:not(:checked)~.switch-paddle	{ }
body .switch.warning>input:checked~.switch-paddle { background:var(--warningbgcolor); }';

body .switch.alert>input:not(:checked)~.switch-paddle	{ }
body .switch.alert>input:checked~.switch-paddle { background:var(--alertbgcolor); }';


body div[data-original]	{ background-size:cover; background-position:center; }

body .sticky.is-anchored	{ position:fixed; }

body [data-marquee]	{ display:none; }
body .marquee	{ white-space: nowrap; overflow: hidden; box-sizing: border-box; }
body .marquee>p	{ font-size:1.25rem; text-transform:uppercase; font-family:'title',sans-serif; display:inline-block; margin:0; padding-left:100%; animation: marquee 25s linear infinite; }
@keyframes marquee
	{
	0%   { transform: translate(0, 0); }
	100% { transform: translate(-100%, 0); }
	}

body tbody>tr:nth-child(even) { background-color:rgba(0,0,0,0.02); }
body tbody>tr:hover	{ background-color:rgba(0,0,0,0.03); }

/* BUTTONS */
body .button.success,
body .button.success.disabled,
body .button.success.disabled:focus,
body .button.success.disabled:hover,
body .button.success[disabled],
body .button.success[disabled]:focus,
body .button.success[disabled]:hover
	{ background-color:var(--successbgcolor); color:var(--successfgcolor); }
body .button.success:focus, body .button.success:hover, body #notifs>div.success { background-color:var(--successbgcolorover); color:var(--successfgcolorover); }

body .button.warning,
body .button.warning.disabled,
body .button.warning.disabled:focus,
body .button.warning.disabled:hover,
body .button.warning[disabled],
body .button.warning[disabled]:focus,
body .button.warning[disabled]:
	{ background-color:var(--warningbgcolor); color:var(--warningfgcolor); }
body .button.warning:focus, body .button.warning:hover,body #notifs>div.warning { background-color:var(--warningbgcolorover); color:var(--warningfgcolorover); }

body .button.alert,
body .button.alert.disabled,
body .button.alert.disabled:focus,
body .button.alert.disabled:hover,
body .button.alert[disabled],
body .button.alert[disabled]:focus,
body .button.alert[disabled]:hover
	{ background-color:var(--alertbgcolor); color:var(--alertfgcolor); }
body .button.alert:focus, body .button.alert:hover, body #notifs>div.alert { background-color:var(--alertbgcolorover); color:var(--alertfgcolorover); }

body .green { color:#339933; }
body .red { color:#993333; }
body .orange { color:#e1ab5b; }
body .gray { color:#989898; }


/* LABELS */
body .label	{ font-family:'title'; font-size:0.9rem; margin:2px 6px 4px 0; padding:0.3rem 0.5rem 0.2rem 0.5rem; }
body .label a			{ color:#cfcfcf; }
body .label a:hover, body a.label:hover	{ color:#ffffff; }

body .label.secondary a		{ color:#888888; }
body .label.secondary a:hover	{ color:#333333; }

.label.success	{ background-color:var(--successbgcolor); color:var(--successfgcolorover); }
body .label.warning	{ background-color:var(--warningbgcolor); color:var(--warningfgcolorover); }
body .label.alert		{ background-color:var(--alertbgcolor); color:var(--alertfgcolorover); }
body a.label, .label>a	{ cursor:pointer; }
body a.label.success:hover	{ background-color:var(--successbgcolorover); color:var(--successfgcolorover); }
body a.label.warning:hover	{ background-color:var(--warningbgcolorover); color:var(--warningfgcolorover); }
body a.label.alert:hover		{ background-color:var(--alertbgcolorover); color:var(--alertfgcolorover); }


/* NOTIFS */
body #notifs	{ position:fixed; bottom:0; padding:0; z-index:800; background-color:#ffffff; right:40px; max-width:50%; min-width:50%; }
body #notifs>div	{ font-family:'title'; font-size:0.85rem; padding:0.25rem; margin:2px; background-color:#f8f8f8; }
body #notifs a.button { padding:0.15rem 0.35rem; margin:0; font-size:0.75rem; background-color:rgba(0,0,0,0.2); }
body [data-notif]	{ display:none; }

body .debug	{ background-color:#dfdfdf; }
body .debug pre,body .debug p	{ font-family:Arial; font-size:10px; min-height:1rem; padding:4px 8px; line-height:1; margin:0; }


/* Small */
@media only screen and (max-width: 40em)
	{
	body #notifs	{ right:0; max-width:100%; min-width:100%; }
	}

/* Medium */
@media only screen and (min-width: 40.063em) and (max-width: 64em)
	{
	}

/* Large */
@media only screen and (min-width: 64.063em)
	{
	}

/* Not small */
@media only screen and (max-width: 63.99em)
	{
	}

/* Not large */
@media only screen and (max-width: 63.99em)
	{
	}

#vos-tailles {
	min-height: 380px;
}

.form-simulation-nom-mesure {
	flex: auto;
}

.form-simulation-valeur-mesure {
	width: 5rem;
	flex: none;
}

.form-simulation-nom-article {
	flex: auto;
}

.form-simulation-nom-taille {
	width: 8rem;
	flex: none;
	background-color: #f5f5f5;
	border-left: 1px #cfcfcf solid;
}

#ListeTaillesAffectees {
	overflow-x: auto;
}

#compte-e-mail {
	overflow-x: auto;
}

#symcad-qr-popup-screen {
	display: flex;
	justify-content: center;
}

#symcad-qr-popup-panel {
	display: flex;
	flex-direction: column;
	row-gap: 1em;
	margin: 0;
}

#symcad-qr-popup-panel-etat-civil {
	display: flex;
	flex-direction: column;
	row-gap: 0.25em;
}

.symcad-qr-popup-panel-etat-civil-value {
	flex: 1;
	text-align: start;
}

.quantite-sel-mod {
	font-weight: bold;
}

.block-decoupe-essayage {
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: center;
	grid-gap: 0.3rem;
}

.block-decoupe-essayage > input {
	margin : auto;
	min-width: 3.5rem;
}

.button-interdit {
	cursor: not-allowed;
}

.login-button {
	width: 100%;
	text-align: left;
	border-radius: 4px;
	padding: .7rem 1rem;
	color: #2ba6cb;
	cursor: pointer;
	text-transform: uppercase;
}

.login-button:hover {
	color: #FFFFFF;
	background-color: rgba(0, 0, 0, 0.3) !important;
}

.login-rapide-button {
	cursor: pointer;
}

.login-rapide-button:hover {
	background-color: var(--successbgcolorover);
	color: var(--successfgcolorover);
}

.form-sso {
	overflow: auto;
}

.form-sso .input-group {
	flex-wrap: wrap;
}
.form-sso .input-group-label {
	flex: 1;
}

.form-sso .input-group-field {
	width: unset;
	min-width: auto;
}

.form-sso button {
	width: 100%;
}

.vente-commentaire {
	overflow-wrap: anywhere;
}

.acquisition-form-boutons-vente {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
}

.acquisition-form-boutons-vente > fieldset {
	flex: 100%;
}

button[data-captcha-recharge] {
	cursor: pointer;
}

.fieldset-grid {
	display: grid;
	grid-template-columns: auto 1fr auto;
}

.fieldset-grid .input-group {
	display: contents;
}

.fieldset-grid .input-group-label {
	grid-column: 1;
}

.fieldset-grid .input-group > :last-child.input-group-field,
.fieldset-grid .input-group > select:last-child {
	grid-column-start: 2;
	grid-column-end: 4;
}

.fieldset-grid .input-group > :last-child:not(select,.input-group-field) {
	grid-column: 3;
}

.texte-attribue {
	color: var(--texte-attribue-color);
}

.texte-selectionne {
	color: var(--texte-selectionne-color);
}

.check-mesure-avertissement .input-group {
	background-color: '#fff4cc';
	border: '2px solid #ff9800';
	padding: '5px';
}

.check-mesure-avertissement input[name="valeur_mesure"] {
	background-color: #fff4cc;
	border-color: #ff9800;
	color: #ff9800;
}

.check-mesure-erreur .input-group {
	background-color: #ffd5d5;
	border: 2px solid #c60f13;
	padding: 5px;
}

.check-mesure-erreur input[name="valeur_mesure"] {
	background-color: #ffd5d5;
	border-color: #c60f13;
	color: #c60f13;
}

.check-mesure-valide .input-group {
	background-color: #e1faea;
	border: 2px solid #1a6f3b;
	padding: 5px;
}

.check-mesure-valide input[name="valeur_mesure"] {
	background-color: #e1faea;
	border-color: #1a6f3b;
	color: #1a6f3b;
}

.btn-checkmesure-afficher-tailles {
	display: block;
	margin: 0 auto;
}

#checkMeasuresStatus {
	margin-top: 3.5rem;
	margin-bottom: 1.25rem;
}

/* CheckMeasures buttons styling */
#checkMeasuresStatus .button {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	margin: 0.5rem;
}

#checkMeasuresStatus .button i {
	margin: 0;
	font-size: 1.25rem;
}
/* Acquisition comment buttons styling */
.acquisition-form-boutons-vente .text-center {
	margin-top: 1rem;
}

.acquisition-form-boutons-vente .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.25rem;
	margin: 0.25rem;
}

.acquisition-form-boutons-vente .button i {
	font-size: 1.25rem;
}
/* Improve checkmeasure appearance */
#checkMeasuresStatus {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin-bottom: 2rem !important;
}

#checkMeasuresStatus .callout {
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    border: 1px solid rgba(0,0,0,0.1);
    padding: 1.5rem;
}

#checkMeasuresStatus .callout.success {
    background-color: #dcedc8; /* Material Green 100 */
    border-left: 6px solid #5aa423;
    color: #1b5e20;
}

#checkMeasuresStatus .callout.warning {
    background-color: #fff3e0; /* Material Orange 100 */
    border-left: 6px solid #ffae00;
    color: #e65100;
}

#checkMeasuresStatus .callout.alert {
    background-color: #ffebee; /* Material Red 100 */
    border-left: 6px solid #c60f13;
    color: #b71c1c;
}

#checkMeasuresStatus h2 {
    font-size: 1.3rem;
    font-weight: bold;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
#checkMeasuresStatus h5 {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.check-measure-line {
    background-color: rgba(255,255,255,0.6);
    padding: 0.75rem 1rem;
    margin-bottom: 0.5rem;
    border-radius: 4px;
    font-family: 'text', sans-serif;
    font-weight: 500;
    border-bottom: 1px solid rgba(0,0,0,0.05);
}

#checkMeasuresStatus .button {
    font-weight: bold;
    letter-spacing: 0.5px;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    margin-top: 1rem;
}


/* Improve checkmeasure appearance */
#checkMeasuresStatus {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin-bottom: 2rem !important;
}

#checkMeasuresStatus .callout {
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    border: 1px solid rgba(0,0,0,0.1);
    padding: 1.5rem;
}

#checkMeasuresStatus .callout.success {
    background-color: #dcedc8; /* Material Green 100 */
    border-left: 6px solid #5aa423;
    color: #1b5e20;
}

#checkMeasuresStatus .callout.warning {
    background-color: #fff3e0; /* Material Orange 100 */
    border-left: 6px solid #ffae00;
    color: #e65100;
}

#checkMeasuresStatus .callout.alert {
    background-color: #ffebee; /* Material Red 100 */
    border-left: 6px solid #c60f13;
    color: #b71c1c;
}

#checkMeasuresStatus h2 {
    font-size: 1.3rem;
    font-weight: bold;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
#checkMeasuresStatus h5 {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.check-measure-line {
    background-color: rgba(255,255,255,0.6);
    padding: 0.75rem 1rem;
    margin-bottom: 0.5rem;
    border-radius: 4px;
    font-family: 'text', sans-serif;
    font-weight: 500;
    border-bottom: 1px solid rgba(0,0,0,0.05);
}

#checkMeasuresStatus .button {
    font-weight: bold;
    letter-spacing: 0.5px;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    margin-top: 1rem;
}


/* CheckMeasure Popup Styles */
.reveal.checkmeasure-popup {
    border-radius: 12px;
    border: none;
    box-shadow: 0 10px 25px rgba(0,0,0,0.2) !important;
    padding: 0 !important;
    overflow: hidden;
    max-width: 600px;
}

.reveal.checkmeasure-popup h3 {
    margin: 0;
    padding: 1.25rem 1.5rem;
    background-color: #f5f5f5;
    font-size: 1.25rem;
    font-weight: 700;
    border-bottom: 1px solid #e0e0e0;
    color: #333;
    display: flex;
    align-items: center;
}

.reveal.checkmeasure-popup h3 i.text-warning { color: #ffae00; }
.reveal.checkmeasure-popup h3 i.text-alert { color: #c60f13; }

.reveal.checkmeasure-popup .close-button {
    font-size: 2rem;
    top: 0.5rem;
    right: 0.75rem;
    color: #999;
}
.reveal.checkmeasure-popup .close-button:hover { color: #333; }

/* Wrapper for content to add padding back */
.reveal.checkmeasure-popup > div:not(.close-button):not(h3),
.reveal.checkmeasure-popup > .button,
.reveal.checkmeasure-popup > .check-measure-line {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
}

.reveal.checkmeasure-popup > .check-measure-line:first-of-type {
    margin-top: 1.5rem;
}

.reveal.checkmeasure-popup > .button.expanded {
    width: calc(100% - 3rem) !important;
    margin: 1.5rem !important;
    border-radius: 6px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    font-size: 1rem;
    padding: 1rem;
}

.reveal.checkmeasure-popup .check-measure-line {
    background-color: #fafafa;
    border: 1px solid #eee;
    padding: 0.85rem 1rem;
    border-radius: 6px;
    margin-bottom: 0.5rem;
    color: #444;
    font-weight: 500;
    display: flex;
    align-items: center;
}
.reveal.checkmeasure-popup .check-measure-line i {
    margin-right: 0.5rem;
    color: #bbb;
    font-size: 1.25rem;
}


/* Support Page Styles */
.support-hero {
    background-color: #f7f7f7;
    padding: 4rem 0;
    margin-bottom: 2rem;
    background-image: linear-gradient(120deg, #fdfbfb 0%, #ebedee 100%);
}
.search-wrapper {
    position: relative;
    max-width: 600px;
    margin: 0 auto;
}
.search-input {
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
    border: 1px solid #e0e0e0;
    padding: 1.5rem;
    padding-left: 3rem;
    font-size: 1.2rem;
    border-radius: 50px;
    transition: all 0.3s ease;
}
.search-input:focus {
    box-shadow: 0 6px 20px rgba(0,0,0,0.12);
    border-color: #1779ba;
}
.search-icon {
    position: absolute;
    top: 50%;
    left: 20px;
    transform: translateY(-50%);
    color: #999;
    font-size: 1.5rem;
}
.accordion {
    border: 1px solid #e1e1e1;
    border-radius: 8px;
    overflow: hidden;
}
.accordion-item:not(:last-child) {
    border-bottom: 1px solid #e1e1e1;
}
.accordion-title {
    font-weight: 600;
    color: #444;
    padding: 1.2rem;
}
.accordion-title:hover, .accordion-title:focus {
    background-color: #f0f4f8;
    color: #1779ba;
}
.video-card {
    border: 1px solid #e1e1e1;
    border-radius: 8px;
    background: #fff;
    transition: transform 0.2s, box-shadow 0.2s;
    height: 100%;
    overflow: hidden;
}
.video-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}
.video-thumbnail-container {
    display: block; /* Force block behavior */
    position: relative;
    background: #000;
    overflow: hidden;
    padding-bottom: 56.25%; /* 16:9 Aspect Ratio */
    height: 0;
    width: 100%;
}
.video-thumbnail-container img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.8;
    transition: opacity 0.3s;
}
.video-thumbnail-container:hover img {
    opacity: 0.6;
}
.play-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    text-shadow: 0 2px 4px rgba(0,0,0,0.5);
    opacity: 0.9;
    font-size: 3rem;
}
.card-content {
    padding: 1.2rem;
}
.card-title {
    font-size: 1.1rem;
    font-weight: bold;
    margin-bottom: 0.5rem;
    color: #333;
}
.card-text {
    color: #666;
    font-size: 0.9rem;
    line-height: 1.5;
}

.support-hero {
    background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
    padding: 3rem 0;
    margin-bottom: 2rem;
}

.support-hero-title {
    color: #2c3e50;
    font-weight: 700;
    margin-bottom: 1rem;
}

.support-accent-icon {
    color: #1779ba;
}

.support-hero-lead {
    color: #666;
    margin-bottom: 2rem;
    font-size: 1.2rem;
}

.support-search-wrapper {
    position: relative;
    max-width: 600px;
    margin: 0 auto;
}

.support-search-icon {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: #999;
    font-size: 1.5rem;
}

.support-search-input {
    padding-left: 45px;
    height: 50px;
    border-radius: 25px;
    border: 1px solid #ddd;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}
.quick-link-card {
    background: white;
    border-radius: 8px;
    padding: 2rem;
    text-align: center;
    transition: all 0.3s ease;
    border: 1px solid #e1e1e1;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.quick-link-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.1);
    border-color: #1779ba;
}
.quick-link-icon {
    font-size: 3rem;
    color: #1779ba;
    margin-bottom: 1rem;
    transition: color 0.3s;
    }
.quick-link-card:hover .quick-link-icon {
    color: #0c4d7e;
}
.quick-link-title {
    font-weight: bold;
    font-size: 1.2rem;
    color: #333;
    margin-bottom: 0.5rem;
}

.support-quick-link-card {
    display: block;
    padding: 1.5rem;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    color: inherit;
}

.support-quick-link-icon {
    font-size: 2.5rem;
    margin-bottom: 0.5rem;
    display: block;
}

.support-quick-link-title {
    font-weight: 600;
    font-size: 1.1rem;
    margin-bottom: 0.25rem;
}

.support-quick-link-text {
    font-size: 0.9rem;
    color: #888;
}

.support-section-divider {
    margin: 2rem 0;
    border-color: #eee;
}

.support-panel-card {
    border: none;
    background: transparent;
}

.support-panel-divider {
    background: transparent;
    padding-left: 0;
    margin-bottom: 1rem;
}

.support-panel-title {
    font-size: 1.8rem;
    color: #333;
}

.support-video-title-icon {
    color: #cc181e;
}

.support-faq-question-icon {
    color: #1779ba;
}

.support-faq-category-badge {
    background: #e6e6e6;
    color: #666;
}

.support-faq-question-title {
    font-size: 1rem;
    color: #444;
    font-weight: 500;
}

.support-faq-answer-panel {
    border-left: 3px solid #1779ba;
    background: #f9f9f9;
    padding: 1rem;
}

.support-faq-answer-text {
    color: #555;
}

.support-video-card {
    cursor: pointer;
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0,0,0,0.08);
    transition: all .25s ease;
}

.support-video-thumbnail {
    position: relative;
    overflow: hidden;
    padding-bottom: 56.25%;
    height: 0;
    background: #000;
}

.support-video-thumbnail-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: .88;
    transition: transform .35s ease, opacity .35s ease;
}

.support-video-thumbnail-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,.15));
}

.support-video-play-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.support-video-play-overlay-inner {
    width: 78px;
    height: 78px;
    border-radius: 50%;
    background: rgba(255,255,255,.15);
    backdrop-filter: blur(6px);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 20px rgba(0,0,0,.25);
    transition: transform .25s ease;
}

.support-video-play-icon {
    font-size: 3rem;
    color: #fff;
    margin-left: 4px;
}

.support-video-duration-badge {
    position: absolute;
    bottom: 12px;
    right: 12px;
    background: rgba(0,0,0,.7);
    color: #fff;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: .8rem;
}

.support-video-card-content {
    padding: 1rem 1rem 1.1rem 1rem;
}

.support-video-card-title {
    font-weight: 700;
    color: #333;
    margin-bottom: .45rem;
    font-size: 1.05rem;
}

.support-video-card-text {
    color: #666;
    font-size: .92rem;
    margin: 0;
    line-height: 1.5;
}

.support-custom-help {
    border-radius: 8px;
    border: 1px solid #ddd;
    scroll-margin-top: 100px;
}

/* Support page video modal styles */

.custom-video-trigger:hover .play-overlay-inner {
    transform: scale(1.08);
}

.custom-video-modal .close-button:hover {
    color: #cc181e !important;
    transform: scale(1.3) !important;
    transition: all .2s;
}

.custom-video-modal {
    padding: 0 !important;
}

.support-video-modal-shell {
    border: none;
    border-radius: 18px;
    overflow: hidden;
    max-width: 1150px;
    background: #111;
    box-shadow: 0 20px 60px rgba(0,0,0,.35);
}

.support-video-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    background: linear-gradient(135deg, #1f2937, #111827);
    color: #fff;
}

.support-video-modal-title {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 700;
}

.support-video-modal-actions {
    display: flex;
    align-items: center;
}

.support-video-download-btn {
    margin: 0;
    margin-right: 20px;
    border-color: rgba(255,255,255,0.4);
    color: #fff;
    border-radius: 4px;
    padding: 8px 16px;
    transition: all .2s;
}

.support-video-download-icon {
    margin-right: 5px;
}

.support-video-modal-close {
    position: static;
    color: #fff;
    transform: scale(1.2);
}

.support-video-modal-body {
    background: #000;
    padding: 0;
}

.support-video-modal-body .plyr {
    width: 100%;
    --plyr-color-main: #0078d4;
    --plyr-video-background: #000;
}

.support-video-frame {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
}

.support-video-frame .support-custom-video-container {
    position: absolute;
    inset: 0;
    border: 1px solid #1f2937;
    background-color: #000;
    overflow: hidden;
}

.support-video-frame .video-thumbnail {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    cursor: pointer;
    z-index: 2;
}

.support-video-frame .video {
    width: 100%;
    height: 100%;
    display: block;
}

.support-video-controls {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
    min-height: 46px;
    background: rgba(0, 0, 0, 0.75);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
    gap: 10px;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

.support-custom-video-container .left {
    width: 96px;
    display: flex;
    justify-content: space-between;
    flex-shrink: 0;
}

.support-custom-video-container .left button,
.support-custom-video-container .mute,
.support-custom-video-container .fullscreen-toggle {
    background: transparent;
    border: none;
    color: #fff;
    cursor: pointer;
    padding: 0;
    display: inline-flex;
    align-items: center;
}

.support-custom-video-container .left i,
.support-custom-video-container .mute i,
.support-custom-video-container .fullscreen-toggle i {
    font-size: 20px;
}

.support-custom-video-container .video-timer {
    display: flex;
    align-items: center;
    color: #efefef;
    font-size: 12px;
    min-width: 84px;
    flex-shrink: 0;
}

.support-custom-video-container .separator {
    margin: 0 5px;
    font-size: 14px;
}

.support-custom-video-container .playback-line {
    position: relative;
    height: 4px;
    background-color: rgba(255,255,255,0.35);
    border-radius: 999px;
    flex: 1;
    cursor: pointer;
}

.support-custom-video-container .progress-bar {
    height: 100%;
    width: 0;
    border-radius: 999px;
    background-color: #0078d4;
    transition: width 0.1s linear;
}

.support-custom-video-container .right {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.support-custom-video-container .volume-container {
    display: flex;
    align-items: center;
    gap: 6px;
}

.support-custom-video-container .volume {
    width: 74px;
    height: 3px;
    cursor: pointer;
}

#videoDownloadBtn:hover {
    background: rgba(255,255,255,0.1);
    border-color: #fff !important;
}

#noResults {
    color: #777;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0;
    transform: translateY(-6px);
    transition: max-height 0.25s ease, opacity 0.2s ease, transform 0.2s ease, padding 0.2s ease;
}

#noResults.is-visible {
    max-height: 160px;
    opacity: 1;
    padding: 20px;
    transform: translateY(0);
}

@media screen and (max-width: 640px) {
    .custom-video-modal {
        width: 95% !important;
        margin: 0 auto;
    }

    .support-video-controls {
        opacity: 1;
        flex-wrap: wrap;
        row-gap: 8px;
    }

    .support-custom-video-container .left {
        width: auto;
        gap: 10px;
    }

    .support-custom-video-container .playback-line {
        order: 4;
        flex-basis: 100%;
    }

    .support-custom-video-container .volume {
        width: 58px;
    }
}