@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@500&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
    sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

code {
  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
    monospace;
}
/* Applique le padding seulement quand le Header est présent */
body > div:has(> header.header-main) > *:not(header) {
  padding-top: 140px; /* Desktop */
}

@media (max-width: 768px) {
  body > div:has(> header.header-main) > *:not(header) {
    padding-top: 100px; /* Mobile */
  }
}
@charset 'UTF-8';
/* Slider */
.slick-loading .slick-list
{
    background: #fff url(data:image/gif;base64,R0lGODlhIAAgAPUAAP///wAAAPr6+sTExOjo6PDw8NDQ0H5+fpqamvb29ubm5vz8/JKSkoaGhuLi4ri4uKCgoOzs7K6urtzc3D4+PlZWVmBgYHx8fKioqO7u7kpKSmxsbAwMDAAAAM7OzsjIyNjY2CwsLF5eXh4eHkxMTLCwsAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH+GkNyZWF0ZWQgd2l0aCBhamF4bG9hZC5pbmZvACH5BAAKAAAAIf8LTkVUU0NBUEUyLjADAQAAACwAAAAAIAAgAAAG/0CAcEgkFjgcR3HJJE4SxEGnMygKmkwJxRKdVocFBRRLfFAoj6GUOhQoFAVysULRjNdfQFghLxrODEJ4Qm5ifUUXZwQAgwBvEXIGBkUEZxuMXgAJb1dECWMABAcHDEpDEGcTBQMDBQtvcW0RbwuECKMHELEJF5NFCxm1AAt7cH4NuAOdcsURy0QCD7gYfcWgTQUQB6Zkr66HoeDCSwIF5ucFz3IC7O0CC6zx8YuHhW/3CvLyfPX4+OXozKnDssBdu3G/xIHTpGAgOUPrZimAJCfDPYfDin2TQ+xeBnWbHi37SC4YIYkQhdy7FvLdpwWvjA0JyU/ISyIx4xS6sgfkNS4me2rtVKkgw0JCb8YMZdjwqMQ2nIY8BbcUQNVCP7G4MQq1KRivR7tiDEuEFrggACH5BAAKAAEALAAAAAAgACAAAAb/QIBwSCQmNBpCcckkEgREA4ViKA6azM8BEZ1Wh6LOBls0HA5fgJQ6HHQ6InKRcWhA1d5hqMMpyIkOZw9Ca18Qbwd/RRhnfoUABRwdI3IESkQFZxB4bAdvV0YJQwkDAx9+bWcECQYGCQ5vFEQCEQoKC0ILHqUDBncCGA5LBiHCAAsFtgqoQwS8Aw64f8m2EXdFCxO8INPKomQCBgPMWAvL0n/ff+jYAu7vAuxy8O/myvfX8/f7/Arq+v0W0HMnr9zAeE0KJlQkJIGCfE0E+PtDq9qfDMogDkGmrIBCbNQUZIDosNq1kUsEZJBW0dY/b0ZsLViQIMFMW+RKKgjFzp4fNokPIdki+Y8JNVxA79jKwHAI0G9JGw5tCqDWTiFRhVhtmhVA16cMJTJ1OnVIMo1cy1KVI5NhEAAh+QQACgACACwAAAAAIAAgAAAG/0CAcEgkChqNQnHJJCYWRMfh4CgamkzFwBOdVocNCgNbJAwGhKGUOjRQKA1y8XOGAtZfgIWiSciJBWcTQnhCD28Qf0UgZwJ3XgAJGhQVcgKORmdXhRBvV0QMY0ILCgoRmIRnCQIODgIEbxtEJSMdHZ8AGaUKBXYLIEpFExZpAG62HRRFArsKfn8FIsgjiUwJu8FkJLYcB9lMCwUKqFgGHSJ5cnZ/uEULl/CX63/x8KTNu+RkzPj9zc/0/Cl4V0/APDIE6x0csrBJwybX9DFhBhCLgAilIvzRVUriKHGlev0JtyuDvmsZUZlcIiCDnYu7KsZ0UmrBggRP7n1DqcDJEzciOgHwcwTyZEUmIKEMFVIqgyIjpZ4tjdTxqRCMPYVMBYDV6tavUZ8yczpkKwBxHsVWtaqo5tMgACH5BAAKAAMALAAAAAAgACAAAAb/QIBwSCQuBgNBcck0FgvIQtHRZCYUGSJ0IB2WDo9qUaBQKIXbLsBxOJTExUh5mB4iDo0zXEhWJNBRQgZtA3tPZQsAdQINBwxwAnpCC2VSdQNtVEQSEkOUChGSVwoLCwUFpm0QRAMVFBQTQxllCqh0kkIECF0TG68UG2O0foYJDb8VYVa0alUXrxoQf1WmZnsTFA0EhgCJhrFMC5Hjkd57W0jpDsPDuFUDHfHyHRzstNN78PPxHOLk5dwcpBuoaYk5OAfhXHG3hAy+KgLkgNozqwzDbgWYJQyXsUwGXKNA6fnYMIO3iPeIpBwyqlSCBKUqEQk5E6YRmX2UdAT5kEnHKkQ5hXjkNqTPtKAARl1sIrGoxSFNuSEFMNWoVCxEpiqyRlQY165wEHELAgAh+QQACgAEACwAAAAAIAAgAAAG/0CAcEgsKhSLonJJTBIFR0GxwFwmFJlnlAgaTKpFqEIqFJMBhcEABC5GjkPz0KN2tsvHBH4sJKgdd1NHSXILah9tAmdCC0dUcg5qVEQfiIxHEYtXSACKnWoGXAwHBwRDGUcKBXYFi0IJHmQEEKQHEGGpCnp3AiW1DKFWqZNgGKQNA65FCwV8bQQHJcRtds9MC4rZitVgCQbf4AYEubnKTAYU6eoUGuSpu3fo6+ka2NrbgQAE4eCmS9xVAOW7Yq7IgA4Hpi0R8EZBhDshOnTgcOtfM0cAlTigILFDiAFFNjk8k0GZgAxOBozouIHIOyKbFixIkECmIyIHOEiEWbPJTTQ5FxcVOMCgzUVCWwAcyZJvzy45ADYVZNIwTlIAVfNB7XRVDLxEWLQ4E9JsKq+rTdsMyhcEACH5BAAKAAUALAAAAAAgACAAAAb/QIBwSCwqFIuicklMEgVHQVHKVCYUmWeUWFAkqtOtEKqgAsgFcDFyHJLNmbZa6x2Lyd8595h8C48RagJmQgtHaX5XZUYKQ4YKEYSKfVKPaUMZHwMDeQBxh04ABYSFGU4JBpsDBmFHdXMLIKofBEyKCpdgspsOoUsLXaRLCQMgwky+YJ1FC4POg8lVAg7U1Q5drtnHSw4H3t8HDdnZy2Dd4N4Nzc/QeqLW1bnM7rXuV9tEBhQQ5UoCbJDmWKBAQcMDZNhwRVNCYANBChZYEbkVCZOwASEcCDFQ4SEDIq6WTVqQIMECBx06iCACQQPBiSabHDqzRUTKARMhSFCDrc+WNQIcOoRw5+ZIHj8ADqSEQBQAwKKLhIzowEEeGKQ0owIYkPKjHihZoBKi0KFE01b4zg7h4y4IACH5BAAKAAYALAAAAAAgACAAAAb/QIBwSCwqFIuicklMEgVHQVHKVCYUmWeUWFAkqtOtEKqgAsgFcDFyHJLNmbZa6x2Lyd8595h8C48RagJmQgtHaX5XZUUJeQCGChGEin1SkGlubEhDcYdOAAWEhRlOC12HYUd1eqeRokOKCphgrY5MpotqhgWfunqPt4PCg71gpgXIyWSqqq9MBQPR0tHMzM5L0NPSC8PCxVUCyeLX38+/AFfXRA4HA+pjmoFqCAcHDQa3rbxzBRD1BwgcMFIlidMrAxYICHHA4N8DIqpsUWJ3wAEBChQaEBnQoB6RRr0uARjQocMAAA0w4nMz4IOaU0lImkSngYKFc3ZWyTwJAALGK4fnNA3ZOaQCBQ22wPgRQlSIAYwSfkHJMrQkTyEbKFzFydQq15ccOAjUEwQAIfkEAAoABwAsAAAAACAAIAAABv9AgHBILCoUi6JySUwSBUdBUcpUJhSZZ5RYUCSq060QqqACyAVwMXIcks2ZtlrrHYvJ3zn3mHwLjxFqAmZCC0dpfldlRQl5AIYKEYSKfVKQaW5sSENxh04ABYSFGU4LXYdhR3V6p5GiQ4oKmGCtjkymi2qGBZ+6eo+3g8KDvYLDxKrJuXNkys6qr0zNygvHxL/V1sVD29K/AFfRRQUDDt1PmoFqHgPtBLetvMwG7QMes0KxkkIFIQNKDhBgKvCh3gQiqmxt6NDBAAEIEAgUOHCgBBEH9Yg06uWAIQUABihQMACgBEUHTRwoUEOBIcqQI880OIDgm5ABDA8IgUkSwAAyij1/jejAARPPIQwONBCnBAJDCEOOCnFA8cOvEh1CEJEqBMIBEDaLcA3LJIEGDe/0BAEAIfkEAAoACAAsAAAAACAAIAAABv9AgHBILCoUi6JySUwSBUdBUcpUJhSZZ5RYUCSq060QqqACyAVwMXIcks2ZtlrrHYvJ3zn3mHwLjxFqAmZCC0dpfldlRQl5AIYKEYSKfVKQaW5sSENxh04ABYSFGU4LXYdhR3V6p5GiQ4oKmGCtjkymi2qGBZ+6eo+3g8KDvYLDxKrJuXNkys6qr0zNygvHxL/V1sVDDti/BQccA8yrYBAjHR0jc53LRQYU6R0UBnO4RxmiG/IjJUIJFuoVKeCBigBN5QCk43BgFgMKFCYUGDAgFEUQRGIRYbCh2xACEDcAcHDgQDcQFGf9s7VkA0QCI0t2W0DRw68h8ChAEELSJE8xijBvVqCgIU9PjwA+UNzG5AHEB9xkDpk4QMGvARQsEDlKxMCALDeLcA0rqEEDlWCCAAAh+QQACgAJACwAAAAAIAAgAAAG/0CAcEgsKhSLonJJTBIFR0FRylQmFJlnlFhQJKrTrRCqoALIBXAxchySzZm2Wusdi8nfOfeYfAuPEWoCZkILR2l+V2VFCXkAhgoRhIp9UpBpbmxIQ3GHTgAFhIUZTgtdh2FHdXqnkaJDigqYYK2OTKaLaoYFn7p6j0wOA8PEAw6/Z4PKUhwdzs8dEL9kqqrN0M7SetTVCsLFw8d6C8vKvUQEv+dVCRAaBnNQtkwPFRQUFXOduUoTG/cUNkyYg+tIBlEMAFYYMAaBuCekxmhaJeSeBgiOHhw4QECAAwcCLhGJRUQCg3RDCmyUVmBYmlOiGqmBsPGlyz9YkAlxsJEhqCubABS9AsPgQAMqLQfM0oTMwEZ4QpLOwvMLxAEEXIBG5aczqtaut4YNXRIEACH5BAAKAAoALAAAAAAgACAAAAb/QIBwSCwqFIuicklMEgVHQVHKVCYUmWeUWFAkqtOtEKqgAsgFcDFyHJLNmbZa6x2Lyd8595h8C48RahAQRQtHaX5XZUUJeQAGHR0jA0SKfVKGCmlubEhCBSGRHSQOQwVmQwsZTgtdh0UQHKIHm2quChGophuiJHO3jkwOFB2UaoYFTnMGegDKRQQG0tMGBM1nAtnaABoU3t8UD81kR+UK3eDe4nrk5grR1NLWegva9s9czfhVAgMNpWqgBGNigMGBAwzmxBGjhACEgwcgzAPTqlwGXQ8gMgAhZIGHWm5WjelUZ8jBBgPMTBgwIMGCRgsygVSkgMiHByD7DWDmx5WuMkZqDLCU4gfAq2sACrAEWFSRLjUfWDopCqDTNQIsJ1LF0yzDAA90UHV5eo0qUjB8mgUBACH5BAAKAAsALAAAAAAgACAAAAb/QIBwSCwqFIuickk0FIiCo6A4ZSoZnRBUSiwoEtYipNOBDKOKKgD9DBNHHU4brc4c3cUBeSOk949geEQUZA5rXABHEW4PD0UOZBSHaQAJiEMJgQATFBQVBkQHZKACUwtHbX0RR0mVFp0UFwRCBSQDSgsZrQteqEUPGrAQmmG9ChFqRAkMsBd4xsRLBBsUoG6nBa14E4IA2kUFDuLjDql4peilAA0H7e4H1udH8/Ps7+3xbmj0qOTj5mEWpEP3DUq3glYWOBgAcEmUaNI+DBjwAY+dS0USGJg4wABEXMYyJNvE8UOGISKVCNClah4xjg60WUKyINOCUwrMzVRARMGENWQ4n/jpNTKTm15J/CTK2e0MoD+UKmHEs4onVDVVmyqdpAbNR4cKTjqNSots07EjzzJh1S0IADsAAAAAAAAAAAA=) center center no-repeat;
}

/* Icons */
@font-face
{
    font-family: 'slick';
    font-weight: normal;
    font-style: normal;

    src: url(/static/media/slick.a4e97f5a2a64f0ab1323.eot);
    src: url(/static/media/slick.a4e97f5a2a64f0ab1323.eot?#iefix) format('embedded-opentype'), url(/static/media/slick.295183786cd8a1389865.woff) format('woff'), url(/static/media/slick.c94f7671dcc99dce43e2.ttf) format('truetype'), url(/static/media/slick.2630a3e3eab21c607e21.svg#slick) format('svg');
}
/* Arrows */
.slick-prev,
.slick-next
{
    font-size: 0;
    line-height: 0;

    position: absolute;
    top: 50%;

    display: block;

    width: 20px;
    height: 20px;
    padding: 0;
    transform: translate(0, -50%);

    cursor: pointer;

    color: transparent;
    border: none;
    outline: none;
    background: transparent;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus
{
    color: transparent;
    outline: none;
    background: transparent;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
    opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
    opacity: .25;
}

.slick-prev:before,
.slick-next:before
{
    font-family: 'slick';
    font-size: 20px;
    line-height: 1;

    opacity: .75;
    color: white;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-prev
{
    left: -25px;
}
[dir='rtl'] .slick-prev
{
    right: -25px;
    left: auto;
}
.slick-prev:before
{
    content: '←';
}
[dir='rtl'] .slick-prev:before
{
    content: '→';
}

.slick-next
{
    right: -25px;
}
[dir='rtl'] .slick-next
{
    right: auto;
    left: -25px;
}
.slick-next:before
{
    content: '→';
}
[dir='rtl'] .slick-next:before
{
    content: '←';
}

/* Dots */
.slick-dotted.slick-slider
{
    margin-bottom: 30px;
}

.slick-dots
{
    position: absolute;
    bottom: -25px;

    display: block;

    width: 100%;
    padding: 0;
    margin: 0;

    list-style: none;

    text-align: center;
}
.slick-dots li
{
    position: relative;

    display: inline-block;

    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;

    cursor: pointer;
}
.slick-dots li button
{
    font-size: 0;
    line-height: 0;

    display: block;

    width: 20px;
    height: 20px;
    padding: 5px;

    cursor: pointer;

    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
    outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
    opacity: 1;
}
.slick-dots li button:before
{
    font-family: 'slick';
    font-size: 6px;
    line-height: 20px;

    position: absolute;
    top: 0;
    left: 0;

    width: 20px;
    height: 20px;

    content: '•';
    text-align: center;

    opacity: .25;
    color: black;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
    opacity: .75;
    color: black;
}

/* Slider */
.slick-slider
{
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
    margin-left: auto;
    margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}

/* required styles */

.leaflet-pane,
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-tile-container,
.leaflet-pane > svg,
.leaflet-pane > canvas,
.leaflet-zoom-box,
.leaflet-image-layer,
.leaflet-layer {
	position: absolute;
	left: 0;
	top: 0;
	}
.leaflet-container {
	overflow: hidden;
	}
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow {
	-webkit-user-select: none;
	        user-select: none;
	  -webkit-user-drag: none;
	}
/* Prevents IE11 from highlighting tiles in blue */
.leaflet-tile::selection {
	background: transparent;
}
/* Safari renders non-retina tile on retina better with this, but Chrome is worse */
.leaflet-safari .leaflet-tile {
	image-rendering: -webkit-optimize-contrast;
	}
/* hack that prevents hw layers "stretching" when loading new tiles */
.leaflet-safari .leaflet-tile-container {
	width: 1600px;
	height: 1600px;
	-webkit-transform-origin: 0 0;
	}
.leaflet-marker-icon,
.leaflet-marker-shadow {
	display: block;
	}
/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */
/* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */
.leaflet-container .leaflet-overlay-pane svg {
	max-width: none !important;
	max-height: none !important;
	}
.leaflet-container .leaflet-marker-pane img,
.leaflet-container .leaflet-shadow-pane img,
.leaflet-container .leaflet-tile-pane img,
.leaflet-container img.leaflet-image-layer,
.leaflet-container .leaflet-tile {
	max-width: none !important;
	max-height: none !important;
	width: auto;
	padding: 0;
	}

.leaflet-container img.leaflet-tile {
	/* See: https://bugs.chromium.org/p/chromium/issues/detail?id=600120 */
	mix-blend-mode: plus-lighter;
}

.leaflet-container.leaflet-touch-zoom {
	touch-action: pan-x pan-y;
	}
.leaflet-container.leaflet-touch-drag {
	/* Fallback for FF which doesn't support pinch-zoom */
	touch-action: none;
	touch-action: pinch-zoom;
}
.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
	touch-action: none;
}
.leaflet-container {
	-webkit-tap-highlight-color: transparent;
}
.leaflet-container a {
	-webkit-tap-highlight-color: rgba(51, 181, 229, 0.4);
}
.leaflet-tile {
	filter: inherit;
	visibility: hidden;
	}
.leaflet-tile-loaded {
	visibility: inherit;
	}
.leaflet-zoom-box {
	width: 0;
	height: 0;
	box-sizing: border-box;
	z-index: 800;
	}
/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
.leaflet-overlay-pane svg {
	-moz-user-select: none;
	}

.leaflet-pane         { z-index: 400; }

.leaflet-tile-pane    { z-index: 200; }
.leaflet-overlay-pane { z-index: 400; }
.leaflet-shadow-pane  { z-index: 500; }
.leaflet-marker-pane  { z-index: 600; }
.leaflet-tooltip-pane   { z-index: 650; }
.leaflet-popup-pane   { z-index: 700; }

.leaflet-map-pane canvas { z-index: 100; }
.leaflet-map-pane svg    { z-index: 200; }

.leaflet-vml-shape {
	width: 1px;
	height: 1px;
	}
.lvml {
	behavior: url(#default#VML);
	display: inline-block;
	position: absolute;
	}


/* control positioning */

.leaflet-control {
	position: relative;
	z-index: 800;
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}
.leaflet-top,
.leaflet-bottom {
	position: absolute;
	z-index: 1000;
	pointer-events: none;
	}
.leaflet-top {
	top: 0;
	}
.leaflet-right {
	right: 0;
	}
.leaflet-bottom {
	bottom: 0;
	}
.leaflet-left {
	left: 0;
	}
.leaflet-control {
	float: left;
	clear: both;
	}
.leaflet-right .leaflet-control {
	float: right;
	}
.leaflet-top .leaflet-control {
	margin-top: 10px;
	}
.leaflet-bottom .leaflet-control {
	margin-bottom: 10px;
	}
.leaflet-left .leaflet-control {
	margin-left: 10px;
	}
.leaflet-right .leaflet-control {
	margin-right: 10px;
	}


/* zoom and fade animations */

.leaflet-fade-anim .leaflet-popup {
	opacity: 0;
	transition: opacity 0.2s linear;
	}
.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
	opacity: 1;
	}
.leaflet-zoom-animated {
	transform-origin: 0 0;
	}
svg.leaflet-zoom-animated {
	will-change: transform;
}

.leaflet-zoom-anim .leaflet-zoom-animated {
	transition:         transform 0.25s cubic-bezier(0,0,0.25,1);
	}
.leaflet-zoom-anim .leaflet-tile,
.leaflet-pan-anim .leaflet-tile {
	transition: none;
	}

.leaflet-zoom-anim .leaflet-zoom-hide {
	visibility: hidden;
	}


/* cursors */

.leaflet-interactive {
	cursor: pointer;
	}
.leaflet-grab {
	cursor:         grab;
	}
.leaflet-crosshair,
.leaflet-crosshair .leaflet-interactive {
	cursor: crosshair;
	}
.leaflet-popup-pane,
.leaflet-control {
	cursor: auto;
	}
.leaflet-dragging .leaflet-grab,
.leaflet-dragging .leaflet-grab .leaflet-interactive,
.leaflet-dragging .leaflet-marker-draggable {
	cursor: move;
	cursor:         grabbing;
	}

/* marker & overlays interactivity */
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-image-layer,
.leaflet-pane > svg path,
.leaflet-tile-container {
	pointer-events: none;
	}

.leaflet-marker-icon.leaflet-interactive,
.leaflet-image-layer.leaflet-interactive,
.leaflet-pane > svg path.leaflet-interactive,
svg.leaflet-image-layer.leaflet-interactive path {
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}

/* visual tweaks */

.leaflet-container {
	background: #ddd;
	outline-offset: 1px;
	}
.leaflet-container a {
	color: #0078A8;
	}
.leaflet-zoom-box {
	border: 2px dotted #38f;
	background: rgba(255,255,255,0.5);
	}


/* general typography */
.leaflet-container {
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-size: 0.75rem;
	line-height: 1.5;
	}


/* general toolbar styles */

.leaflet-bar {
	box-shadow: 0 1px 5px rgba(0,0,0,0.65);
	border-radius: 4px;
	}
.leaflet-bar a {
	background-color: #fff;
	border-bottom: 1px solid #ccc;
	width: 26px;
	height: 26px;
	line-height: 26px;
	display: block;
	text-align: center;
	text-decoration: none;
	color: black;
	}
.leaflet-bar a,
.leaflet-control-layers-toggle {
	background-position: 50% 50%;
	background-repeat: no-repeat;
	display: block;
	}
.leaflet-bar a:hover,
.leaflet-bar a:focus {
	background-color: #f4f4f4;
	}
.leaflet-bar a:first-child {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	}
.leaflet-bar a:last-child {
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	border-bottom: none;
	}
.leaflet-bar a.leaflet-disabled {
	cursor: default;
	background-color: #f4f4f4;
	color: #bbb;
	}

.leaflet-touch .leaflet-bar a {
	width: 30px;
	height: 30px;
	line-height: 30px;
	}
.leaflet-touch .leaflet-bar a:first-child {
	border-top-left-radius: 2px;
	border-top-right-radius: 2px;
	}
.leaflet-touch .leaflet-bar a:last-child {
	border-bottom-left-radius: 2px;
	border-bottom-right-radius: 2px;
	}

/* zoom control */

.leaflet-control-zoom-in,
.leaflet-control-zoom-out {
	font: bold 18px 'Lucida Console', Monaco, monospace;
	text-indent: 1px;
	}

.leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out  {
	font-size: 22px;
	}


/* layers control */

.leaflet-control-layers {
	box-shadow: 0 1px 5px rgba(0,0,0,0.4);
	background: #fff;
	border-radius: 5px;
	}
.leaflet-control-layers-toggle {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAQAAAADQ4RFAAACf0lEQVR4AY1UM3gkARTePdvdoTxXKc+qTl3aU5U6b2Kbkz3Gtq3Zw6ziLGNPzrYx7946Tr6/ee/XeCQ4D3ykPtL5tHno4n0d/h3+xfuWHGLX81cn7r0iTNzjr7LrlxCqPtkbTQEHeqOrTy4Yyt3VCi/IOB0v7rVC7q45Q3Gr5K6jt+3Gl5nCoDD4MtO+j96Wu8atmhGqcNGHObuf8OM/x3AMx38+4Z2sPqzCxRFK2aF2e5Jol56XTLyggAMTL56XOMoS1W4pOyjUcGGQdZxU6qRh7B9Zp+PfpOFlqt0zyDZckPi1ttmIp03jX8gyJ8a/PG2yutpS/Vol7peZIbZcKBAEEheEIAgFbDkz5H6Zrkm2hVWGiXKiF4Ycw0RWKdtC16Q7qe3X4iOMxruonzegJzWaXFrU9utOSsLUmrc0YjeWYjCW4PDMADElpJSSQ0vQvA1Tm6/JlKnqFs1EGyZiFCqnRZTEJJJiKRYzVYzJck2Rm6P4iH+cmSY0YzimYa8l0EtTODFWhcMIMVqdsI2uiTvKmTisIDHJ3od5GILVhBCarCfVRmo4uTjkhrhzkiBV7SsaqS+TzrzM1qpGGUFt28pIySQHR6h7F6KSwGWm97ay+Z+ZqMcEjEWebE7wxCSQwpkhJqoZA5ivCdZDjJepuJ9IQjGGUmuXJdBFUygxVqVsxFsLMbDe8ZbDYVCGKxs+W080max1hFCarCfV+C1KATwcnvE9gRRuMP2prdbWGowm1KB1y+zwMMENkM755cJ2yPDtqhTI6ED1M/82yIDtC/4j4BijjeObflpO9I9MwXTCsSX8jWAFeHr05WoLTJ5G8IQVS/7vwR6ohirYM7f6HzYpogfS3R2OAAAAAElFTkSuQmCC);
	width: 36px;
	height: 36px;
	}
.leaflet-retina .leaflet-control-layers-toggle {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADQAAAA0CAQAAABvcdNgAAAEsklEQVR4AWL4TydIhpZK1kpWOlg0w3ZXP6D2soBtG42jeI6ZmQTHzAxiTbSJsYLjO9HhP+WOmcuhciVnmHVQcJnp7DFvScowZorad/+V/fVzMdMT2g9Cv9guXGv/7pYOrXh2U+RRR3dSd9JRx6bIFc/ekqHI29JC6pJ5ZEh1yWkhkbcFeSjxgx3L2m1cb1C7bceyxA+CNjT/Ifff+/kDk2u/w/33/IeCMOSaWZ4glosqT3DNnNZQ7Cs58/3Ce5HL78iZH/vKVIaYlqzfdLu8Vi7dnvUbEza5Idt36tquZFldl6N5Z/POLof0XLK61mZCmJSWjVF9tEjUluu74IUXvgttuVIHE7YxSkaYhJZam7yiM9Pv82JYfl9nptxZaxMJE4YSPty+vF0+Y2up9d3wwijfjZbabqm/3bZ9ecKHsiGmRflnn1MW4pjHf9oLufyn2z3y1D6n8g8TZhxyzipLNPnAUpsOiuWimg52psrTZYnOWYNDTMuWBWa0tJb4rgq1UvmutpaYEbZlwU3CLJm/ayYjHW5/h7xWLn9Hh1vepDkyf7dE7MtT5LR4e7yYpHrkhOUpEfssBLq2pPhAqoSWKUkk7EDqkmK6RrCEzqDjhNDWNE+XSMvkJRDWlZTmCW0l0PHQGRZY5t1L83kT0Y3l2SItk5JAWHl2dCOBm+fPu3fo5/3v61RMCO9Jx2EEYYhb0rmNQMX/vm7gqOEJLcXTGw3CAuRNeyaPWwjR8PRqKQ1PDA/dpv+on9Shox52WFnx0KY8onHayrJzm87i5h9xGw/tfkev0jGsQizqezUKjk12hBMKJ4kbCqGPVNXudyyrShovGw5CgxsRICxF6aRmSjlBnHRzg7Gx8fKqEubI2rahQYdR1YgDIRQO7JvQyD52hoIQx0mxa0ODtW2Iozn1le2iIRdzwWewedyZzewidueOGqlsn1MvcnQpuVwLGG3/IR1hIKxCjelIDZ8ldqWz25jWAsnldEnK0Zxro19TGVb2ffIZEsIO89EIEDvKMPrzmBOQcKQ+rroye6NgRRxqR4U8EAkz0CL6uSGOm6KQCdWjvjRiSP1BPalCRS5iQYiEIvxuBMJEWgzSoHADcVMuN7IuqqTeyUPq22qFimFtxDyBBJEwNyt6TM88blFHao/6tWWhuuOM4SAK4EI4QmFHA+SEyWlp4EQoJ13cYGzMu7yszEIBOm2rVmHUNqwAIQabISNMRstmdhNWcFLsSm+0tjJH1MdRxO5Nx0WDMhCtgD6OKgZeljJqJKc9po8juskR9XN0Y1lZ3mWjLR9JCO1jRDMd0fpYC2VnvjBSEFg7wBENc0R9HFlb0xvF1+TBEpF68d+DHR6IOWVv2BECtxo46hOFUBd/APU57WIoEwJhIi2CdpyZX0m93BZicktMj1AS9dClteUFAUNUIEygRZCtik5zSxI9MubTBH1GOiHsiLJ3OCoSZkILa9PxiN0EbvhsAo8tdAf9Seepd36lGWHmtNANTv5Jd0z4QYyeo/UEJqxKRpg5LZx6btLPsOaEmdMyxYdlc8LMaJnikDlhclqmPiQnTEpLUIZEwkRagjYkEibQErwhkTAKCLQEbUgkzJQWc/0PstHHcfEdQ+UAAAAASUVORK5CYII=);
	background-size: 26px 26px;
	}
.leaflet-touch .leaflet-control-layers-toggle {
	width: 44px;
	height: 44px;
	}
.leaflet-control-layers .leaflet-control-layers-list,
.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
	display: none;
	}
.leaflet-control-layers-expanded .leaflet-control-layers-list {
	display: block;
	position: relative;
	}
.leaflet-control-layers-expanded {
	padding: 6px 10px 6px 6px;
	color: #333;
	background: #fff;
	}
.leaflet-control-layers-scrollbar {
	overflow-y: scroll;
	overflow-x: hidden;
	padding-right: 5px;
	}
.leaflet-control-layers-selector {
	margin-top: 2px;
	position: relative;
	top: 1px;
	}
.leaflet-control-layers label {
	display: block;
	font-size: 13px;
	font-size: 1.08333em;
	}
.leaflet-control-layers-separator {
	height: 0;
	border-top: 1px solid #ddd;
	margin: 5px -10px 5px -6px;
	}

/* Default icon URLs */
.leaflet-default-icon-path { /* used only in path-guessing heuristic, see L.Icon.Default */
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAApCAYAAADAk4LOAAAFgUlEQVR4Aa1XA5BjWRTN2oW17d3YaZtr2962HUzbDNpjszW24mRt28p47v7zq/bXZtrp/lWnXr337j3nPCe85NcypgSFdugCpW5YoDAMRaIMqRi6aKq5E3YqDQO3qAwjVWrD8Ncq/RBpykd8oZUb/kaJutow8r1aP9II0WmLKLIsJyv1w/kqw9Ch2MYdB++12Onxee/QMwvf4/Dk/Lfp/i4nxTXtOoQ4pW5Aj7wpici1A9erdAN2OH64x8OSP9j3Ft3b7aWkTg/Fm91siTra0f9on5sQr9INejH6CUUUpavjFNq1B+Oadhxmnfa8RfEmN8VNAsQhPqF55xHkMzz3jSmChWU6f7/XZKNH+9+hBLOHYozuKQPxyMPUKkrX/K0uWnfFaJGS1QPRtZsOPtr3NsW0uyh6NNCOkU3Yz+bXbT3I8G3xE5EXLXtCXbbqwCO9zPQYPRTZ5vIDXD7U+w7rFDEoUUf7ibHIR4y6bLVPXrz8JVZEql13trxwue/uDivd3fkWRbS6/IA2bID4uk0UpF1N8qLlbBlXs4Ee7HLTfV1j54APvODnSfOWBqtKVvjgLKzF5YdEk5ewRkGlK0i33Eofffc7HT56jD7/6U+qH3Cx7SBLNntH5YIPvODnyfIXZYRVDPqgHtLs5ABHD3YzLuespb7t79FY34DjMwrVrcTuwlT55YMPvOBnRrJ4VXTdNnYug5ucHLBjEpt30701A3Ts+HEa73u6dT3FNWwflY86eMHPk+Yu+i6pzUpRrW7SNDg5JHR4KapmM5Wv2E8Tfcb1HoqqHMHU+uWDD7zg54mz5/2BSnizi9T1Dg4QQXLToGNCkb6tb1NU+QAlGr1++eADrzhn/u8Q2YZhQVlZ5+CAOtqfbhmaUCS1ezNFVm2imDbPmPng5wmz+gwh+oHDce0eUtQ6OGDIyR0uUhUsoO3vfDmmgOezH0mZN59x7MBi++WDL1g/eEiU3avlidO671bkLfwbw5XV2P8Pzo0ydy4t2/0eu33xYSOMOD8hTf4CrBtGMSoXfPLchX+J0ruSePw3LZeK0juPJbYzrhkH0io7B3k164hiGvawhOKMLkrQLyVpZg8rHFW7E2uHOL888IBPlNZ1FPzstSJM694fWr6RwpvcJK60+0HCILTBzZLFNdtAzJaohze60T8qBzyh5ZuOg5e7uwQppofEmf2++DYvmySqGBuKaicF1blQjhuHdvCIMvp8whTTfZzI7RldpwtSzL+F1+wkdZ2TBOW2gIF88PBTzD/gpeREAMEbxnJcaJHNHrpzji0gQCS6hdkEeYt9DF/2qPcEC8RM28Hwmr3sdNyht00byAut2k3gufWNtgtOEOFGUwcXWNDbdNbpgBGxEvKkOQsxivJx33iow0Vw5S6SVTrpVq11ysA2Rp7gTfPfktc6zhtXBBC+adRLshf6sG2RfHPZ5EAc4sVZ83yCN00Fk/4kggu40ZTvIEm5g24qtU4KjBrx/BTTH8ifVASAG7gKrnWxJDcU7x8X6Ecczhm3o6YicvsLXWfh3Ch1W0k8x0nXF+0fFxgt4phz8QvypiwCCFKMqXCnqXExjq10beH+UUA7+nG6mdG/Pu0f3LgFcGrl2s0kNNjpmoJ9o4B29CMO8dMT4Q5ox8uitF6fqsrJOr8qnwNbRzv6hSnG5wP+64C7h9lp30hKNtKdWjtdkbuPA19nJ7Tz3zR/ibgARbhb4AlhavcBebmTHcFl2fvYEnW0ox9xMxKBS8btJ+KiEbq9zA4RthQXDhPa0T9TEe69gWupwc6uBUphquXgf+/FrIjweHQS4/pduMe5ERUMHUd9xv8ZR98CxkS4F2n3EUrUZ10EYNw7BWm9x1GiPssi3GgiGRDKWRYZfXlON+dfNbM+GgIwYdwAAAAASUVORK5CYII=);
	}


/* attribution and scale controls */

.leaflet-container .leaflet-control-attribution {
	background: #fff;
	background: rgba(255, 255, 255, 0.8);
	margin: 0;
	}
.leaflet-control-attribution,
.leaflet-control-scale-line {
	padding: 0 5px;
	color: #333;
	line-height: 1.4;
	}
.leaflet-control-attribution a {
	text-decoration: none;
	}
.leaflet-control-attribution a:hover,
.leaflet-control-attribution a:focus {
	text-decoration: underline;
	}
.leaflet-attribution-flag {
	display: inline !important;
	vertical-align: baseline !important;
	width: 1em;
	height: 0.6669em;
	}
.leaflet-left .leaflet-control-scale {
	margin-left: 5px;
	}
.leaflet-bottom .leaflet-control-scale {
	margin-bottom: 5px;
	}
.leaflet-control-scale-line {
	border: 2px solid #777;
	border-top: none;
	line-height: 1.1;
	padding: 2px 5px 1px;
	white-space: nowrap;
	box-sizing: border-box;
	background: rgba(255, 255, 255, 0.8);
	text-shadow: 1px 1px #fff;
	}
.leaflet-control-scale-line:not(:first-child) {
	border-top: 2px solid #777;
	border-bottom: none;
	margin-top: -2px;
	}
.leaflet-control-scale-line:not(:first-child):not(:last-child) {
	border-bottom: 2px solid #777;
	}

.leaflet-touch .leaflet-control-attribution,
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	box-shadow: none;
	}
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	border: 2px solid rgba(0,0,0,0.2);
	background-clip: padding-box;
	}


/* popup */

.leaflet-popup {
	position: absolute;
	text-align: center;
	margin-bottom: 20px;
	}
.leaflet-popup-content-wrapper {
	padding: 1px;
	text-align: left;
	border-radius: 12px;
	}
.leaflet-popup-content {
	margin: 13px 24px 13px 20px;
	line-height: 1.3;
	font-size: 13px;
	font-size: 1.08333em;
	min-height: 1px;
	}
.leaflet-popup-content p {
	margin: 17px 0;
	margin: 1.3em 0;
	}
.leaflet-popup-tip-container {
	width: 40px;
	height: 20px;
	position: absolute;
	left: 50%;
	margin-top: -1px;
	margin-left: -20px;
	overflow: hidden;
	pointer-events: none;
	}
.leaflet-popup-tip {
	width: 17px;
	height: 17px;
	padding: 1px;

	margin: -10px auto 0;
	pointer-events: auto;
	transform: rotate(45deg);
	}
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
	background: white;
	color: #333;
	box-shadow: 0 3px 14px rgba(0,0,0,0.4);
	}
.leaflet-container a.leaflet-popup-close-button {
	position: absolute;
	top: 0;
	right: 0;
	border: none;
	text-align: center;
	width: 24px;
	height: 24px;
	font: 16px/24px Tahoma, Verdana, sans-serif;
	color: #757575;
	text-decoration: none;
	background: transparent;
	}
.leaflet-container a.leaflet-popup-close-button:hover,
.leaflet-container a.leaflet-popup-close-button:focus {
	color: #585858;
	}
.leaflet-popup-scrolled {
	overflow: auto;
	}

.leaflet-oldie .leaflet-popup-content-wrapper {
	-ms-zoom: 1;
	}
.leaflet-oldie .leaflet-popup-tip {
	width: 24px;
	margin: 0 auto;

	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
	filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);
	}

.leaflet-oldie .leaflet-control-zoom,
.leaflet-oldie .leaflet-control-layers,
.leaflet-oldie .leaflet-popup-content-wrapper,
.leaflet-oldie .leaflet-popup-tip {
	border: 1px solid #999;
	}


/* div icon */

.leaflet-div-icon {
	background: #fff;
	border: 1px solid #666;
	}


/* Tooltip */
/* Base styles for the element that has a tooltip */
.leaflet-tooltip {
	position: absolute;
	padding: 6px;
	background-color: #fff;
	border: 1px solid #fff;
	border-radius: 3px;
	color: #222;
	white-space: nowrap;
	-webkit-user-select: none;
	user-select: none;
	pointer-events: none;
	box-shadow: 0 1px 3px rgba(0,0,0,0.4);
	}
.leaflet-tooltip.leaflet-interactive {
	cursor: pointer;
	pointer-events: auto;
	}
.leaflet-tooltip-top:before,
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	position: absolute;
	pointer-events: none;
	border: 6px solid transparent;
	background: transparent;
	content: "";
	}

/* Directions */

.leaflet-tooltip-bottom {
	margin-top: 6px;
}
.leaflet-tooltip-top {
	margin-top: -6px;
}
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-top:before {
	left: 50%;
	margin-left: -6px;
	}
.leaflet-tooltip-top:before {
	bottom: 0;
	margin-bottom: -12px;
	border-top-color: #fff;
	}
.leaflet-tooltip-bottom:before {
	top: 0;
	margin-top: -12px;
	margin-left: -6px;
	border-bottom-color: #fff;
	}
.leaflet-tooltip-left {
	margin-left: -6px;
}
.leaflet-tooltip-right {
	margin-left: 6px;
}
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	top: 50%;
	margin-top: -6px;
	}
.leaflet-tooltip-left:before {
	right: 0;
	margin-right: -12px;
	border-left-color: #fff;
	}
.leaflet-tooltip-right:before {
	left: 0;
	margin-left: -12px;
	border-right-color: #fff;
	}

/* Printing */

@media print {
	/* Prevent printers from removing background-images of controls. */
	.leaflet-control {
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
		}
	}

/*!
 * Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com
 * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
 * Copyright 2024 Fonticons, Inc.
 */
.fa{font-family:"Font Awesome 6 Free";font-family:var(--fa-style-family,"Font Awesome 6 Free");font-weight:900;font-weight:var(--fa-style,900)}.fa,.fa-brands,.fa-regular,.fa-solid,.fab,.far,.fas{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:inline-block;display:var(--fa-display,inline-block);font-style:normal;font-feature-settings:normal;font-variant:normal;line-height:1;text-rendering:auto}.fa-brands:before,.fa-regular:before,.fa-solid:before,.fa:before,.fab:before,.far:before,.fas:before{content:var(--fa)}.fa-classic,.fa-regular,.fa-solid,.far,.fas{font-family:"Font Awesome 6 Free"}.fa-brands,.fab{font-family:"Font Awesome 6 Brands"}.fa-1x{font-size:1em}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-6x{font-size:6em}.fa-7x{font-size:7em}.fa-8x{font-size:8em}.fa-9x{font-size:9em}.fa-10x{font-size:10em}.fa-2xs{font-size:.625em;line-height:.1em;vertical-align:.225em}.fa-xs{font-size:.75em;line-height:.08333em;vertical-align:.125em}.fa-sm{font-size:.875em;line-height:.07143em;vertical-align:.05357em}.fa-lg{font-size:1.25em;line-height:.05em;vertical-align:-.075em}.fa-xl{font-size:1.5em;line-height:.04167em;vertical-align:-.125em}.fa-2xl{font-size:2em;line-height:.03125em;vertical-align:-.1875em}.fa-fw{text-align:center;width:1.25em}.fa-ul{list-style-type:none;margin-left:2.5em;margin-left:var(--fa-li-margin,2.5em);padding-left:0}.fa-ul>li{position:relative}.fa-li{left:calc(2em*-1);left:calc(var(--fa-li-width, 2em)*-1);position:absolute;text-align:center;width:2em;width:var(--fa-li-width,2em);line-height:inherit}.fa-border{border-radius:.1em;border-radius:var(--fa-border-radius,.1em);border:.08em solid #eee;border:var(--fa-border-width,.08em) var(--fa-border-style,solid) var(--fa-border-color,#eee);padding:.2em .25em .15em;padding:var(--fa-border-padding,.2em .25em .15em)}.fa-pull-left{float:left;margin-right:.3em;margin-right:var(--fa-pull-margin,.3em)}.fa-pull-right{float:right;margin-left:.3em;margin-left:var(--fa-pull-margin,.3em)}.fa-beat{animation-name:fa-beat;animation-delay:0s;animation-delay:var(--fa-animation-delay,0s);animation-direction:normal;animation-direction:var(--fa-animation-direction,normal);animation-duration:1s;animation-duration:var(--fa-animation-duration,1s);animation-iteration-count:infinite;animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-timing-function:ease-in-out;animation-timing-function:var(--fa-animation-timing,ease-in-out)}.fa-bounce{animation-name:fa-bounce;animation-delay:0s;animation-delay:var(--fa-animation-delay,0s);animation-direction:normal;animation-direction:var(--fa-animation-direction,normal);animation-duration:1s;animation-duration:var(--fa-animation-duration,1s);animation-iteration-count:infinite;animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-timing-function:cubic-bezier(.28,.84,.42,1);animation-timing-function:var(--fa-animation-timing,cubic-bezier(.28,.84,.42,1))}.fa-fade{animation-name:fa-fade;animation-iteration-count:infinite;animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-timing-function:cubic-bezier(.4,0,.6,1);animation-timing-function:var(--fa-animation-timing,cubic-bezier(.4,0,.6,1))}.fa-beat-fade,.fa-fade{animation-delay:0s;animation-delay:var(--fa-animation-delay,0s);animation-direction:normal;animation-direction:var(--fa-animation-direction,normal);animation-duration:1s;animation-duration:var(--fa-animation-duration,1s)}.fa-beat-fade{animation-name:fa-beat-fade;animation-iteration-count:infinite;animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-timing-function:cubic-bezier(.4,0,.6,1);animation-timing-function:var(--fa-animation-timing,cubic-bezier(.4,0,.6,1))}.fa-flip{animation-name:fa-flip;animation-delay:0s;animation-delay:var(--fa-animation-delay,0s);animation-direction:normal;animation-direction:var(--fa-animation-direction,normal);animation-duration:1s;animation-duration:var(--fa-animation-duration,1s);animation-iteration-count:infinite;animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-timing-function:ease-in-out;animation-timing-function:var(--fa-animation-timing,ease-in-out)}.fa-shake{animation-name:fa-shake;animation-duration:1s;animation-duration:var(--fa-animation-duration,1s);animation-iteration-count:infinite;animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-timing-function:linear;animation-timing-function:var(--fa-animation-timing,linear)}.fa-shake,.fa-spin{animation-delay:0s;animation-delay:var(--fa-animation-delay,0s);animation-direction:normal;animation-direction:var(--fa-animation-direction,normal)}.fa-spin{animation-name:fa-spin;animation-duration:2s;animation-duration:var(--fa-animation-duration,2s);animation-iteration-count:infinite;animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-timing-function:linear;animation-timing-function:var(--fa-animation-timing,linear)}.fa-spin-reverse{--fa-animation-direction:reverse}.fa-pulse,.fa-spin-pulse{animation-name:fa-spin;animation-direction:normal;animation-direction:var(--fa-animation-direction,normal);animation-duration:1s;animation-duration:var(--fa-animation-duration,1s);animation-iteration-count:infinite;animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-timing-function:steps(8);animation-timing-function:var(--fa-animation-timing,steps(8))}@media (prefers-reduced-motion:reduce){.fa-beat,.fa-beat-fade,.fa-bounce,.fa-fade,.fa-flip,.fa-pulse,.fa-shake,.fa-spin,.fa-spin-pulse{animation-delay:-1ms;animation-duration:1ms;animation-iteration-count:1;transition-delay:0s;transition-duration:0s}}@keyframes fa-beat{0%,90%{transform:scale(1)}45%{transform:scale(1.25);transform:scale(var(--fa-beat-scale,1.25))}}@keyframes fa-bounce{0%{transform:scale(1) translateY(0)}10%{transform:scale(1.1,.9) translateY(0);transform:scale(var(--fa-bounce-start-scale-x,1.1),var(--fa-bounce-start-scale-y,.9)) translateY(0)}30%{transform:scale(.9,1.1) translateY(-.5em);transform:scale(var(--fa-bounce-jump-scale-x,.9),var(--fa-bounce-jump-scale-y,1.1)) translateY(var(--fa-bounce-height,-.5em))}50%{transform:scale(1.05,.95) translateY(0);transform:scale(var(--fa-bounce-land-scale-x,1.05),var(--fa-bounce-land-scale-y,.95)) translateY(0)}57%{transform:scale(1) translateY(-.125em);transform:scale(1) translateY(var(--fa-bounce-rebound,-.125em))}64%{transform:scale(1) translateY(0)}to{transform:scale(1) translateY(0)}}@keyframes fa-fade{50%{opacity:.4;opacity:var(--fa-fade-opacity,.4)}}@keyframes fa-beat-fade{0%,to{opacity:.4;opacity:var(--fa-beat-fade-opacity,.4);transform:scale(1)}50%{opacity:1;transform:scale(1.125);transform:scale(var(--fa-beat-fade-scale,1.125))}}@keyframes fa-flip{50%{transform:rotate3d(0,1,0,-180deg);transform:rotate3d(var(--fa-flip-x,0),var(--fa-flip-y,1),var(--fa-flip-z,0),var(--fa-flip-angle,-180deg))}}@keyframes fa-shake{0%{transform:rotate(-15deg)}4%{transform:rotate(15deg)}8%,24%{transform:rotate(-18deg)}12%,28%{transform:rotate(18deg)}16%{transform:rotate(-22deg)}20%{transform:rotate(22deg)}32%{transform:rotate(-12deg)}36%{transform:rotate(12deg)}40%,to{transform:rotate(0deg)}}@keyframes fa-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.fa-rotate-90{transform:rotate(90deg)}.fa-rotate-180{transform:rotate(180deg)}.fa-rotate-270{transform:rotate(270deg)}.fa-flip-horizontal{transform:scaleX(-1)}.fa-flip-vertical{transform:scaleY(-1)}.fa-flip-both,.fa-flip-horizontal.fa-flip-vertical{transform:scale(-1)}.fa-rotate-by{transform:rotate(0);transform:rotate(var(--fa-rotate-angle,0))}.fa-stack{display:inline-block;height:2em;line-height:2em;position:relative;vertical-align:middle;width:2.5em}.fa-stack-1x,.fa-stack-2x{left:0;position:absolute;text-align:center;width:100%;z-index:auto;z-index:var(--fa-stack-z-index,auto)}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff;color:var(--fa-inverse,#fff)}

.fa-0{--fa:"\30"}.fa-1{--fa:"\31"}.fa-2{--fa:"\32"}.fa-3{--fa:"\33"}.fa-4{--fa:"\34"}.fa-5{--fa:"\35"}.fa-6{--fa:"\36"}.fa-7{--fa:"\37"}.fa-8{--fa:"\38"}.fa-9{--fa:"\39"}.fa-fill-drip{--fa:"\f576"}.fa-arrows-to-circle{--fa:"\e4bd"}.fa-chevron-circle-right,.fa-circle-chevron-right{--fa:"\f138"}.fa-at{--fa:"\40"}.fa-trash-alt,.fa-trash-can{--fa:"\f2ed"}.fa-text-height{--fa:"\f034"}.fa-user-times,.fa-user-xmark{--fa:"\f235"}.fa-stethoscope{--fa:"\f0f1"}.fa-comment-alt,.fa-message{--fa:"\f27a"}.fa-info{--fa:"\f129"}.fa-compress-alt,.fa-down-left-and-up-right-to-center{--fa:"\f422"}.fa-explosion{--fa:"\e4e9"}.fa-file-alt,.fa-file-lines,.fa-file-text{--fa:"\f15c"}.fa-wave-square{--fa:"\f83e"}.fa-ring{--fa:"\f70b"}.fa-building-un{--fa:"\e4d9"}.fa-dice-three{--fa:"\f527"}.fa-calendar-alt,.fa-calendar-days{--fa:"\f073"}.fa-anchor-circle-check{--fa:"\e4aa"}.fa-building-circle-arrow-right{--fa:"\e4d1"}.fa-volleyball,.fa-volleyball-ball{--fa:"\f45f"}.fa-arrows-up-to-line{--fa:"\e4c2"}.fa-sort-desc,.fa-sort-down{--fa:"\f0dd"}.fa-circle-minus,.fa-minus-circle{--fa:"\f056"}.fa-door-open{--fa:"\f52b"}.fa-right-from-bracket,.fa-sign-out-alt{--fa:"\f2f5"}.fa-atom{--fa:"\f5d2"}.fa-soap{--fa:"\e06e"}.fa-heart-music-camera-bolt,.fa-icons{--fa:"\f86d"}.fa-microphone-alt-slash,.fa-microphone-lines-slash{--fa:"\f539"}.fa-bridge-circle-check{--fa:"\e4c9"}.fa-pump-medical{--fa:"\e06a"}.fa-fingerprint{--fa:"\f577"}.fa-hand-point-right{--fa:"\f0a4"}.fa-magnifying-glass-location,.fa-search-location{--fa:"\f689"}.fa-forward-step,.fa-step-forward{--fa:"\f051"}.fa-face-smile-beam,.fa-smile-beam{--fa:"\f5b8"}.fa-flag-checkered{--fa:"\f11e"}.fa-football,.fa-football-ball{--fa:"\f44e"}.fa-school-circle-exclamation{--fa:"\e56c"}.fa-crop{--fa:"\f125"}.fa-angle-double-down,.fa-angles-down{--fa:"\f103"}.fa-users-rectangle{--fa:"\e594"}.fa-people-roof{--fa:"\e537"}.fa-people-line{--fa:"\e534"}.fa-beer,.fa-beer-mug-empty{--fa:"\f0fc"}.fa-diagram-predecessor{--fa:"\e477"}.fa-arrow-up-long,.fa-long-arrow-up{--fa:"\f176"}.fa-burn,.fa-fire-flame-simple{--fa:"\f46a"}.fa-male,.fa-person{--fa:"\f183"}.fa-laptop{--fa:"\f109"}.fa-file-csv{--fa:"\f6dd"}.fa-menorah{--fa:"\f676"}.fa-truck-plane{--fa:"\e58f"}.fa-record-vinyl{--fa:"\f8d9"}.fa-face-grin-stars,.fa-grin-stars{--fa:"\f587"}.fa-bong{--fa:"\f55c"}.fa-pastafarianism,.fa-spaghetti-monster-flying{--fa:"\f67b"}.fa-arrow-down-up-across-line{--fa:"\e4af"}.fa-spoon,.fa-utensil-spoon{--fa:"\f2e5"}.fa-jar-wheat{--fa:"\e517"}.fa-envelopes-bulk,.fa-mail-bulk{--fa:"\f674"}.fa-file-circle-exclamation{--fa:"\e4eb"}.fa-circle-h,.fa-hospital-symbol{--fa:"\f47e"}.fa-pager{--fa:"\f815"}.fa-address-book,.fa-contact-book{--fa:"\f2b9"}.fa-strikethrough{--fa:"\f0cc"}.fa-k{--fa:"\4b"}.fa-landmark-flag{--fa:"\e51c"}.fa-pencil,.fa-pencil-alt{--fa:"\f303"}.fa-backward{--fa:"\f04a"}.fa-caret-right{--fa:"\f0da"}.fa-comments{--fa:"\f086"}.fa-file-clipboard,.fa-paste{--fa:"\f0ea"}.fa-code-pull-request{--fa:"\e13c"}.fa-clipboard-list{--fa:"\f46d"}.fa-truck-loading,.fa-truck-ramp-box{--fa:"\f4de"}.fa-user-check{--fa:"\f4fc"}.fa-vial-virus{--fa:"\e597"}.fa-sheet-plastic{--fa:"\e571"}.fa-blog{--fa:"\f781"}.fa-user-ninja{--fa:"\f504"}.fa-person-arrow-up-from-line{--fa:"\e539"}.fa-scroll-torah,.fa-torah{--fa:"\f6a0"}.fa-broom-ball,.fa-quidditch,.fa-quidditch-broom-ball{--fa:"\f458"}.fa-toggle-off{--fa:"\f204"}.fa-archive,.fa-box-archive{--fa:"\f187"}.fa-person-drowning{--fa:"\e545"}.fa-arrow-down-9-1,.fa-sort-numeric-desc,.fa-sort-numeric-down-alt{--fa:"\f886"}.fa-face-grin-tongue-squint,.fa-grin-tongue-squint{--fa:"\f58a"}.fa-spray-can{--fa:"\f5bd"}.fa-truck-monster{--fa:"\f63b"}.fa-w{--fa:"\57"}.fa-earth-africa,.fa-globe-africa{--fa:"\f57c"}.fa-rainbow{--fa:"\f75b"}.fa-circle-notch{--fa:"\f1ce"}.fa-tablet-alt,.fa-tablet-screen-button{--fa:"\f3fa"}.fa-paw{--fa:"\f1b0"}.fa-cloud{--fa:"\f0c2"}.fa-trowel-bricks{--fa:"\e58a"}.fa-face-flushed,.fa-flushed{--fa:"\f579"}.fa-hospital-user{--fa:"\f80d"}.fa-tent-arrow-left-right{--fa:"\e57f"}.fa-gavel,.fa-legal{--fa:"\f0e3"}.fa-binoculars{--fa:"\f1e5"}.fa-microphone-slash{--fa:"\f131"}.fa-box-tissue{--fa:"\e05b"}.fa-motorcycle{--fa:"\f21c"}.fa-bell-concierge,.fa-concierge-bell{--fa:"\f562"}.fa-pen-ruler,.fa-pencil-ruler{--fa:"\f5ae"}.fa-people-arrows,.fa-people-arrows-left-right{--fa:"\e068"}.fa-mars-and-venus-burst{--fa:"\e523"}.fa-caret-square-right,.fa-square-caret-right{--fa:"\f152"}.fa-cut,.fa-scissors{--fa:"\f0c4"}.fa-sun-plant-wilt{--fa:"\e57a"}.fa-toilets-portable{--fa:"\e584"}.fa-hockey-puck{--fa:"\f453"}.fa-table{--fa:"\f0ce"}.fa-magnifying-glass-arrow-right{--fa:"\e521"}.fa-digital-tachograph,.fa-tachograph-digital{--fa:"\f566"}.fa-users-slash{--fa:"\e073"}.fa-clover{--fa:"\e139"}.fa-mail-reply,.fa-reply{--fa:"\f3e5"}.fa-star-and-crescent{--fa:"\f699"}.fa-house-fire{--fa:"\e50c"}.fa-minus-square,.fa-square-minus{--fa:"\f146"}.fa-helicopter{--fa:"\f533"}.fa-compass{--fa:"\f14e"}.fa-caret-square-down,.fa-square-caret-down{--fa:"\f150"}.fa-file-circle-question{--fa:"\e4ef"}.fa-laptop-code{--fa:"\f5fc"}.fa-swatchbook{--fa:"\f5c3"}.fa-prescription-bottle{--fa:"\f485"}.fa-bars,.fa-navicon{--fa:"\f0c9"}.fa-people-group{--fa:"\e533"}.fa-hourglass-3,.fa-hourglass-end{--fa:"\f253"}.fa-heart-broken,.fa-heart-crack{--fa:"\f7a9"}.fa-external-link-square-alt,.fa-square-up-right{--fa:"\f360"}.fa-face-kiss-beam,.fa-kiss-beam{--fa:"\f597"}.fa-film{--fa:"\f008"}.fa-ruler-horizontal{--fa:"\f547"}.fa-people-robbery{--fa:"\e536"}.fa-lightbulb{--fa:"\f0eb"}.fa-caret-left{--fa:"\f0d9"}.fa-circle-exclamation,.fa-exclamation-circle{--fa:"\f06a"}.fa-school-circle-xmark{--fa:"\e56d"}.fa-arrow-right-from-bracket,.fa-sign-out{--fa:"\f08b"}.fa-chevron-circle-down,.fa-circle-chevron-down{--fa:"\f13a"}.fa-unlock-alt,.fa-unlock-keyhole{--fa:"\f13e"}.fa-cloud-showers-heavy{--fa:"\f740"}.fa-headphones-alt,.fa-headphones-simple{--fa:"\f58f"}.fa-sitemap{--fa:"\f0e8"}.fa-circle-dollar-to-slot,.fa-donate{--fa:"\f4b9"}.fa-memory{--fa:"\f538"}.fa-road-spikes{--fa:"\e568"}.fa-fire-burner{--fa:"\e4f1"}.fa-flag{--fa:"\f024"}.fa-hanukiah{--fa:"\f6e6"}.fa-feather{--fa:"\f52d"}.fa-volume-down,.fa-volume-low{--fa:"\f027"}.fa-comment-slash{--fa:"\f4b3"}.fa-cloud-sun-rain{--fa:"\f743"}.fa-compress{--fa:"\f066"}.fa-wheat-alt,.fa-wheat-awn{--fa:"\e2cd"}.fa-ankh{--fa:"\f644"}.fa-hands-holding-child{--fa:"\e4fa"}.fa-asterisk{--fa:"\2a"}.fa-check-square,.fa-square-check{--fa:"\f14a"}.fa-peseta-sign{--fa:"\e221"}.fa-header,.fa-heading{--fa:"\f1dc"}.fa-ghost{--fa:"\f6e2"}.fa-list,.fa-list-squares{--fa:"\f03a"}.fa-phone-square-alt,.fa-square-phone-flip{--fa:"\f87b"}.fa-cart-plus{--fa:"\f217"}.fa-gamepad{--fa:"\f11b"}.fa-circle-dot,.fa-dot-circle{--fa:"\f192"}.fa-dizzy,.fa-face-dizzy{--fa:"\f567"}.fa-egg{--fa:"\f7fb"}.fa-house-medical-circle-xmark{--fa:"\e513"}.fa-campground{--fa:"\f6bb"}.fa-folder-plus{--fa:"\f65e"}.fa-futbol,.fa-futbol-ball,.fa-soccer-ball{--fa:"\f1e3"}.fa-paint-brush,.fa-paintbrush{--fa:"\f1fc"}.fa-lock{--fa:"\f023"}.fa-gas-pump{--fa:"\f52f"}.fa-hot-tub,.fa-hot-tub-person{--fa:"\f593"}.fa-map-location,.fa-map-marked{--fa:"\f59f"}.fa-house-flood-water{--fa:"\e50e"}.fa-tree{--fa:"\f1bb"}.fa-bridge-lock{--fa:"\e4cc"}.fa-sack-dollar{--fa:"\f81d"}.fa-edit,.fa-pen-to-square{--fa:"\f044"}.fa-car-side{--fa:"\f5e4"}.fa-share-alt,.fa-share-nodes{--fa:"\f1e0"}.fa-heart-circle-minus{--fa:"\e4ff"}.fa-hourglass-2,.fa-hourglass-half{--fa:"\f252"}.fa-microscope{--fa:"\f610"}.fa-sink{--fa:"\e06d"}.fa-bag-shopping,.fa-shopping-bag{--fa:"\f290"}.fa-arrow-down-z-a,.fa-sort-alpha-desc,.fa-sort-alpha-down-alt{--fa:"\f881"}.fa-mitten{--fa:"\f7b5"}.fa-person-rays{--fa:"\e54d"}.fa-users{--fa:"\f0c0"}.fa-eye-slash{--fa:"\f070"}.fa-flask-vial{--fa:"\e4f3"}.fa-hand,.fa-hand-paper{--fa:"\f256"}.fa-om{--fa:"\f679"}.fa-worm{--fa:"\e599"}.fa-house-circle-xmark{--fa:"\e50b"}.fa-plug{--fa:"\f1e6"}.fa-chevron-up{--fa:"\f077"}.fa-hand-spock{--fa:"\f259"}.fa-stopwatch{--fa:"\f2f2"}.fa-face-kiss,.fa-kiss{--fa:"\f596"}.fa-bridge-circle-xmark{--fa:"\e4cb"}.fa-face-grin-tongue,.fa-grin-tongue{--fa:"\f589"}.fa-chess-bishop{--fa:"\f43a"}.fa-face-grin-wink,.fa-grin-wink{--fa:"\f58c"}.fa-deaf,.fa-deafness,.fa-ear-deaf,.fa-hard-of-hearing{--fa:"\f2a4"}.fa-road-circle-check{--fa:"\e564"}.fa-dice-five{--fa:"\f523"}.fa-rss-square,.fa-square-rss{--fa:"\f143"}.fa-land-mine-on{--fa:"\e51b"}.fa-i-cursor{--fa:"\f246"}.fa-stamp{--fa:"\f5bf"}.fa-stairs{--fa:"\e289"}.fa-i{--fa:"\49"}.fa-hryvnia,.fa-hryvnia-sign{--fa:"\f6f2"}.fa-pills{--fa:"\f484"}.fa-face-grin-wide,.fa-grin-alt{--fa:"\f581"}.fa-tooth{--fa:"\f5c9"}.fa-v{--fa:"\56"}.fa-bangladeshi-taka-sign{--fa:"\e2e6"}.fa-bicycle{--fa:"\f206"}.fa-rod-asclepius,.fa-rod-snake,.fa-staff-aesculapius,.fa-staff-snake{--fa:"\e579"}.fa-head-side-cough-slash{--fa:"\e062"}.fa-ambulance,.fa-truck-medical{--fa:"\f0f9"}.fa-wheat-awn-circle-exclamation{--fa:"\e598"}.fa-snowman{--fa:"\f7d0"}.fa-mortar-pestle{--fa:"\f5a7"}.fa-road-barrier{--fa:"\e562"}.fa-school{--fa:"\f549"}.fa-igloo{--fa:"\f7ae"}.fa-joint{--fa:"\f595"}.fa-angle-right{--fa:"\f105"}.fa-horse{--fa:"\f6f0"}.fa-q{--fa:"\51"}.fa-g{--fa:"\47"}.fa-notes-medical{--fa:"\f481"}.fa-temperature-2,.fa-temperature-half,.fa-thermometer-2,.fa-thermometer-half{--fa:"\f2c9"}.fa-dong-sign{--fa:"\e169"}.fa-capsules{--fa:"\f46b"}.fa-poo-bolt,.fa-poo-storm{--fa:"\f75a"}.fa-face-frown-open,.fa-frown-open{--fa:"\f57a"}.fa-hand-point-up{--fa:"\f0a6"}.fa-money-bill{--fa:"\f0d6"}.fa-bookmark{--fa:"\f02e"}.fa-align-justify{--fa:"\f039"}.fa-umbrella-beach{--fa:"\f5ca"}.fa-helmet-un{--fa:"\e503"}.fa-bullseye{--fa:"\f140"}.fa-bacon{--fa:"\f7e5"}.fa-hand-point-down{--fa:"\f0a7"}.fa-arrow-up-from-bracket{--fa:"\e09a"}.fa-folder,.fa-folder-blank{--fa:"\f07b"}.fa-file-medical-alt,.fa-file-waveform{--fa:"\f478"}.fa-radiation{--fa:"\f7b9"}.fa-chart-simple{--fa:"\e473"}.fa-mars-stroke{--fa:"\f229"}.fa-vial{--fa:"\f492"}.fa-dashboard,.fa-gauge,.fa-gauge-med,.fa-tachometer-alt-average{--fa:"\f624"}.fa-magic-wand-sparkles,.fa-wand-magic-sparkles{--fa:"\e2ca"}.fa-e{--fa:"\45"}.fa-pen-alt,.fa-pen-clip{--fa:"\f305"}.fa-bridge-circle-exclamation{--fa:"\e4ca"}.fa-user{--fa:"\f007"}.fa-school-circle-check{--fa:"\e56b"}.fa-dumpster{--fa:"\f793"}.fa-shuttle-van,.fa-van-shuttle{--fa:"\f5b6"}.fa-building-user{--fa:"\e4da"}.fa-caret-square-left,.fa-square-caret-left{--fa:"\f191"}.fa-highlighter{--fa:"\f591"}.fa-key{--fa:"\f084"}.fa-bullhorn{--fa:"\f0a1"}.fa-globe{--fa:"\f0ac"}.fa-synagogue{--fa:"\f69b"}.fa-person-half-dress{--fa:"\e548"}.fa-road-bridge{--fa:"\e563"}.fa-location-arrow{--fa:"\f124"}.fa-c{--fa:"\43"}.fa-tablet-button{--fa:"\f10a"}.fa-building-lock{--fa:"\e4d6"}.fa-pizza-slice{--fa:"\f818"}.fa-money-bill-wave{--fa:"\f53a"}.fa-area-chart,.fa-chart-area{--fa:"\f1fe"}.fa-house-flag{--fa:"\e50d"}.fa-person-circle-minus{--fa:"\e540"}.fa-ban,.fa-cancel{--fa:"\f05e"}.fa-camera-rotate{--fa:"\e0d8"}.fa-air-freshener,.fa-spray-can-sparkles{--fa:"\f5d0"}.fa-star{--fa:"\f005"}.fa-repeat{--fa:"\f363"}.fa-cross{--fa:"\f654"}.fa-box{--fa:"\f466"}.fa-venus-mars{--fa:"\f228"}.fa-arrow-pointer,.fa-mouse-pointer{--fa:"\f245"}.fa-expand-arrows-alt,.fa-maximize{--fa:"\f31e"}.fa-charging-station{--fa:"\f5e7"}.fa-shapes,.fa-triangle-circle-square{--fa:"\f61f"}.fa-random,.fa-shuffle{--fa:"\f074"}.fa-person-running,.fa-running{--fa:"\f70c"}.fa-mobile-retro{--fa:"\e527"}.fa-grip-lines-vertical{--fa:"\f7a5"}.fa-spider{--fa:"\f717"}.fa-hands-bound{--fa:"\e4f9"}.fa-file-invoice-dollar{--fa:"\f571"}.fa-plane-circle-exclamation{--fa:"\e556"}.fa-x-ray{--fa:"\f497"}.fa-spell-check{--fa:"\f891"}.fa-slash{--fa:"\f715"}.fa-computer-mouse,.fa-mouse{--fa:"\f8cc"}.fa-arrow-right-to-bracket,.fa-sign-in{--fa:"\f090"}.fa-shop-slash,.fa-store-alt-slash{--fa:"\e070"}.fa-server{--fa:"\f233"}.fa-virus-covid-slash{--fa:"\e4a9"}.fa-shop-lock{--fa:"\e4a5"}.fa-hourglass-1,.fa-hourglass-start{--fa:"\f251"}.fa-blender-phone{--fa:"\f6b6"}.fa-building-wheat{--fa:"\e4db"}.fa-person-breastfeeding{--fa:"\e53a"}.fa-right-to-bracket,.fa-sign-in-alt{--fa:"\f2f6"}.fa-venus{--fa:"\f221"}.fa-passport{--fa:"\f5ab"}.fa-thumb-tack-slash,.fa-thumbtack-slash{--fa:"\e68f"}.fa-heart-pulse,.fa-heartbeat{--fa:"\f21e"}.fa-people-carry,.fa-people-carry-box{--fa:"\f4ce"}.fa-temperature-high{--fa:"\f769"}.fa-microchip{--fa:"\f2db"}.fa-crown{--fa:"\f521"}.fa-weight-hanging{--fa:"\f5cd"}.fa-xmarks-lines{--fa:"\e59a"}.fa-file-prescription{--fa:"\f572"}.fa-weight,.fa-weight-scale{--fa:"\f496"}.fa-user-friends,.fa-user-group{--fa:"\f500"}.fa-arrow-up-a-z,.fa-sort-alpha-up{--fa:"\f15e"}.fa-chess-knight{--fa:"\f441"}.fa-face-laugh-squint,.fa-laugh-squint{--fa:"\f59b"}.fa-wheelchair{--fa:"\f193"}.fa-arrow-circle-up,.fa-circle-arrow-up{--fa:"\f0aa"}.fa-toggle-on{--fa:"\f205"}.fa-person-walking,.fa-walking{--fa:"\f554"}.fa-l{--fa:"\4c"}.fa-fire{--fa:"\f06d"}.fa-bed-pulse,.fa-procedures{--fa:"\f487"}.fa-shuttle-space,.fa-space-shuttle{--fa:"\f197"}.fa-face-laugh,.fa-laugh{--fa:"\f599"}.fa-folder-open{--fa:"\f07c"}.fa-heart-circle-plus{--fa:"\e500"}.fa-code-fork{--fa:"\e13b"}.fa-city{--fa:"\f64f"}.fa-microphone-alt,.fa-microphone-lines{--fa:"\f3c9"}.fa-pepper-hot{--fa:"\f816"}.fa-unlock{--fa:"\f09c"}.fa-colon-sign{--fa:"\e140"}.fa-headset{--fa:"\f590"}.fa-store-slash{--fa:"\e071"}.fa-road-circle-xmark{--fa:"\e566"}.fa-user-minus{--fa:"\f503"}.fa-mars-stroke-up,.fa-mars-stroke-v{--fa:"\f22a"}.fa-champagne-glasses,.fa-glass-cheers{--fa:"\f79f"}.fa-clipboard{--fa:"\f328"}.fa-house-circle-exclamation{--fa:"\e50a"}.fa-file-arrow-up,.fa-file-upload{--fa:"\f574"}.fa-wifi,.fa-wifi-3,.fa-wifi-strong{--fa:"\f1eb"}.fa-bath,.fa-bathtub{--fa:"\f2cd"}.fa-underline{--fa:"\f0cd"}.fa-user-edit,.fa-user-pen{--fa:"\f4ff"}.fa-signature{--fa:"\f5b7"}.fa-stroopwafel{--fa:"\f551"}.fa-bold{--fa:"\f032"}.fa-anchor-lock{--fa:"\e4ad"}.fa-building-ngo{--fa:"\e4d7"}.fa-manat-sign{--fa:"\e1d5"}.fa-not-equal{--fa:"\f53e"}.fa-border-style,.fa-border-top-left{--fa:"\f853"}.fa-map-location-dot,.fa-map-marked-alt{--fa:"\f5a0"}.fa-jedi{--fa:"\f669"}.fa-poll,.fa-square-poll-vertical{--fa:"\f681"}.fa-mug-hot{--fa:"\f7b6"}.fa-battery-car,.fa-car-battery{--fa:"\f5df"}.fa-gift{--fa:"\f06b"}.fa-dice-two{--fa:"\f528"}.fa-chess-queen{--fa:"\f445"}.fa-glasses{--fa:"\f530"}.fa-chess-board{--fa:"\f43c"}.fa-building-circle-check{--fa:"\e4d2"}.fa-person-chalkboard{--fa:"\e53d"}.fa-mars-stroke-h,.fa-mars-stroke-right{--fa:"\f22b"}.fa-hand-back-fist,.fa-hand-rock{--fa:"\f255"}.fa-caret-square-up,.fa-square-caret-up{--fa:"\f151"}.fa-cloud-showers-water{--fa:"\e4e4"}.fa-bar-chart,.fa-chart-bar{--fa:"\f080"}.fa-hands-bubbles,.fa-hands-wash{--fa:"\e05e"}.fa-less-than-equal{--fa:"\f537"}.fa-train{--fa:"\f238"}.fa-eye-low-vision,.fa-low-vision{--fa:"\f2a8"}.fa-crow{--fa:"\f520"}.fa-sailboat{--fa:"\e445"}.fa-window-restore{--fa:"\f2d2"}.fa-plus-square,.fa-square-plus{--fa:"\f0fe"}.fa-torii-gate{--fa:"\f6a1"}.fa-frog{--fa:"\f52e"}.fa-bucket{--fa:"\e4cf"}.fa-image{--fa:"\f03e"}.fa-microphone{--fa:"\f130"}.fa-cow{--fa:"\f6c8"}.fa-caret-up{--fa:"\f0d8"}.fa-screwdriver{--fa:"\f54a"}.fa-folder-closed{--fa:"\e185"}.fa-house-tsunami{--fa:"\e515"}.fa-square-nfi{--fa:"\e576"}.fa-arrow-up-from-ground-water{--fa:"\e4b5"}.fa-glass-martini-alt,.fa-martini-glass{--fa:"\f57b"}.fa-square-binary{--fa:"\e69b"}.fa-rotate-back,.fa-rotate-backward,.fa-rotate-left,.fa-undo-alt{--fa:"\f2ea"}.fa-columns,.fa-table-columns{--fa:"\f0db"}.fa-lemon{--fa:"\f094"}.fa-head-side-mask{--fa:"\e063"}.fa-handshake{--fa:"\f2b5"}.fa-gem{--fa:"\f3a5"}.fa-dolly,.fa-dolly-box{--fa:"\f472"}.fa-smoking{--fa:"\f48d"}.fa-compress-arrows-alt,.fa-minimize{--fa:"\f78c"}.fa-monument{--fa:"\f5a6"}.fa-snowplow{--fa:"\f7d2"}.fa-angle-double-right,.fa-angles-right{--fa:"\f101"}.fa-cannabis{--fa:"\f55f"}.fa-circle-play,.fa-play-circle{--fa:"\f144"}.fa-tablets{--fa:"\f490"}.fa-ethernet{--fa:"\f796"}.fa-eur,.fa-euro,.fa-euro-sign{--fa:"\f153"}.fa-chair{--fa:"\f6c0"}.fa-check-circle,.fa-circle-check{--fa:"\f058"}.fa-circle-stop,.fa-stop-circle{--fa:"\f28d"}.fa-compass-drafting,.fa-drafting-compass{--fa:"\f568"}.fa-plate-wheat{--fa:"\e55a"}.fa-icicles{--fa:"\f7ad"}.fa-person-shelter{--fa:"\e54f"}.fa-neuter{--fa:"\f22c"}.fa-id-badge{--fa:"\f2c1"}.fa-marker{--fa:"\f5a1"}.fa-face-laugh-beam,.fa-laugh-beam{--fa:"\f59a"}.fa-helicopter-symbol{--fa:"\e502"}.fa-universal-access{--fa:"\f29a"}.fa-chevron-circle-up,.fa-circle-chevron-up{--fa:"\f139"}.fa-lari-sign{--fa:"\e1c8"}.fa-volcano{--fa:"\f770"}.fa-person-walking-dashed-line-arrow-right{--fa:"\e553"}.fa-gbp,.fa-pound-sign,.fa-sterling-sign{--fa:"\f154"}.fa-viruses{--fa:"\e076"}.fa-square-person-confined{--fa:"\e577"}.fa-user-tie{--fa:"\f508"}.fa-arrow-down-long,.fa-long-arrow-down{--fa:"\f175"}.fa-tent-arrow-down-to-line{--fa:"\e57e"}.fa-certificate{--fa:"\f0a3"}.fa-mail-reply-all,.fa-reply-all{--fa:"\f122"}.fa-suitcase{--fa:"\f0f2"}.fa-person-skating,.fa-skating{--fa:"\f7c5"}.fa-filter-circle-dollar,.fa-funnel-dollar{--fa:"\f662"}.fa-camera-retro{--fa:"\f083"}.fa-arrow-circle-down,.fa-circle-arrow-down{--fa:"\f0ab"}.fa-arrow-right-to-file,.fa-file-import{--fa:"\f56f"}.fa-external-link-square,.fa-square-arrow-up-right{--fa:"\f14c"}.fa-box-open{--fa:"\f49e"}.fa-scroll{--fa:"\f70e"}.fa-spa{--fa:"\f5bb"}.fa-location-pin-lock{--fa:"\e51f"}.fa-pause{--fa:"\f04c"}.fa-hill-avalanche{--fa:"\e507"}.fa-temperature-0,.fa-temperature-empty,.fa-thermometer-0,.fa-thermometer-empty{--fa:"\f2cb"}.fa-bomb{--fa:"\f1e2"}.fa-registered{--fa:"\f25d"}.fa-address-card,.fa-contact-card,.fa-vcard{--fa:"\f2bb"}.fa-balance-scale-right,.fa-scale-unbalanced-flip{--fa:"\f516"}.fa-subscript{--fa:"\f12c"}.fa-diamond-turn-right,.fa-directions{--fa:"\f5eb"}.fa-burst{--fa:"\e4dc"}.fa-house-laptop,.fa-laptop-house{--fa:"\e066"}.fa-face-tired,.fa-tired{--fa:"\f5c8"}.fa-money-bills{--fa:"\e1f3"}.fa-smog{--fa:"\f75f"}.fa-crutch{--fa:"\f7f7"}.fa-cloud-arrow-up,.fa-cloud-upload,.fa-cloud-upload-alt{--fa:"\f0ee"}.fa-palette{--fa:"\f53f"}.fa-arrows-turn-right{--fa:"\e4c0"}.fa-vest{--fa:"\e085"}.fa-ferry{--fa:"\e4ea"}.fa-arrows-down-to-people{--fa:"\e4b9"}.fa-seedling,.fa-sprout{--fa:"\f4d8"}.fa-arrows-alt-h,.fa-left-right{--fa:"\f337"}.fa-boxes-packing{--fa:"\e4c7"}.fa-arrow-circle-left,.fa-circle-arrow-left{--fa:"\f0a8"}.fa-group-arrows-rotate{--fa:"\e4f6"}.fa-bowl-food{--fa:"\e4c6"}.fa-candy-cane{--fa:"\f786"}.fa-arrow-down-wide-short,.fa-sort-amount-asc,.fa-sort-amount-down{--fa:"\f160"}.fa-cloud-bolt,.fa-thunderstorm{--fa:"\f76c"}.fa-remove-format,.fa-text-slash{--fa:"\f87d"}.fa-face-smile-wink,.fa-smile-wink{--fa:"\f4da"}.fa-file-word{--fa:"\f1c2"}.fa-file-powerpoint{--fa:"\f1c4"}.fa-arrows-h,.fa-arrows-left-right{--fa:"\f07e"}.fa-house-lock{--fa:"\e510"}.fa-cloud-arrow-down,.fa-cloud-download,.fa-cloud-download-alt{--fa:"\f0ed"}.fa-children{--fa:"\e4e1"}.fa-blackboard,.fa-chalkboard{--fa:"\f51b"}.fa-user-alt-slash,.fa-user-large-slash{--fa:"\f4fa"}.fa-envelope-open{--fa:"\f2b6"}.fa-handshake-alt-slash,.fa-handshake-simple-slash{--fa:"\e05f"}.fa-mattress-pillow{--fa:"\e525"}.fa-guarani-sign{--fa:"\e19a"}.fa-arrows-rotate,.fa-refresh,.fa-sync{--fa:"\f021"}.fa-fire-extinguisher{--fa:"\f134"}.fa-cruzeiro-sign{--fa:"\e152"}.fa-greater-than-equal{--fa:"\f532"}.fa-shield-alt,.fa-shield-halved{--fa:"\f3ed"}.fa-atlas,.fa-book-atlas{--fa:"\f558"}.fa-virus{--fa:"\e074"}.fa-envelope-circle-check{--fa:"\e4e8"}.fa-layer-group{--fa:"\f5fd"}.fa-arrows-to-dot{--fa:"\e4be"}.fa-archway{--fa:"\f557"}.fa-heart-circle-check{--fa:"\e4fd"}.fa-house-chimney-crack,.fa-house-damage{--fa:"\f6f1"}.fa-file-archive,.fa-file-zipper{--fa:"\f1c6"}.fa-square{--fa:"\f0c8"}.fa-glass-martini,.fa-martini-glass-empty{--fa:"\f000"}.fa-couch{--fa:"\f4b8"}.fa-cedi-sign{--fa:"\e0df"}.fa-italic{--fa:"\f033"}.fa-table-cells-column-lock{--fa:"\e678"}.fa-church{--fa:"\f51d"}.fa-comments-dollar{--fa:"\f653"}.fa-democrat{--fa:"\f747"}.fa-z{--fa:"\5a"}.fa-person-skiing,.fa-skiing{--fa:"\f7c9"}.fa-road-lock{--fa:"\e567"}.fa-a{--fa:"\41"}.fa-temperature-arrow-down,.fa-temperature-down{--fa:"\e03f"}.fa-feather-alt,.fa-feather-pointed{--fa:"\f56b"}.fa-p{--fa:"\50"}.fa-snowflake{--fa:"\f2dc"}.fa-newspaper{--fa:"\f1ea"}.fa-ad,.fa-rectangle-ad{--fa:"\f641"}.fa-arrow-circle-right,.fa-circle-arrow-right{--fa:"\f0a9"}.fa-filter-circle-xmark{--fa:"\e17b"}.fa-locust{--fa:"\e520"}.fa-sort,.fa-unsorted{--fa:"\f0dc"}.fa-list-1-2,.fa-list-numeric,.fa-list-ol{--fa:"\f0cb"}.fa-person-dress-burst{--fa:"\e544"}.fa-money-check-alt,.fa-money-check-dollar{--fa:"\f53d"}.fa-vector-square{--fa:"\f5cb"}.fa-bread-slice{--fa:"\f7ec"}.fa-language{--fa:"\f1ab"}.fa-face-kiss-wink-heart,.fa-kiss-wink-heart{--fa:"\f598"}.fa-filter{--fa:"\f0b0"}.fa-question{--fa:"\3f"}.fa-file-signature{--fa:"\f573"}.fa-arrows-alt,.fa-up-down-left-right{--fa:"\f0b2"}.fa-house-chimney-user{--fa:"\e065"}.fa-hand-holding-heart{--fa:"\f4be"}.fa-puzzle-piece{--fa:"\f12e"}.fa-money-check{--fa:"\f53c"}.fa-star-half-alt,.fa-star-half-stroke{--fa:"\f5c0"}.fa-code{--fa:"\f121"}.fa-glass-whiskey,.fa-whiskey-glass{--fa:"\f7a0"}.fa-building-circle-exclamation{--fa:"\e4d3"}.fa-magnifying-glass-chart{--fa:"\e522"}.fa-arrow-up-right-from-square,.fa-external-link{--fa:"\f08e"}.fa-cubes-stacked{--fa:"\e4e6"}.fa-krw,.fa-won,.fa-won-sign{--fa:"\f159"}.fa-virus-covid{--fa:"\e4a8"}.fa-austral-sign{--fa:"\e0a9"}.fa-f{--fa:"\46"}.fa-leaf{--fa:"\f06c"}.fa-road{--fa:"\f018"}.fa-cab,.fa-taxi{--fa:"\f1ba"}.fa-person-circle-plus{--fa:"\e541"}.fa-chart-pie,.fa-pie-chart{--fa:"\f200"}.fa-bolt-lightning{--fa:"\e0b7"}.fa-sack-xmark{--fa:"\e56a"}.fa-file-excel{--fa:"\f1c3"}.fa-file-contract{--fa:"\f56c"}.fa-fish-fins{--fa:"\e4f2"}.fa-building-flag{--fa:"\e4d5"}.fa-face-grin-beam,.fa-grin-beam{--fa:"\f582"}.fa-object-ungroup{--fa:"\f248"}.fa-poop{--fa:"\f619"}.fa-location-pin,.fa-map-marker{--fa:"\f041"}.fa-kaaba{--fa:"\f66b"}.fa-toilet-paper{--fa:"\f71e"}.fa-hard-hat,.fa-hat-hard,.fa-helmet-safety{--fa:"\f807"}.fa-eject{--fa:"\f052"}.fa-arrow-alt-circle-right,.fa-circle-right{--fa:"\f35a"}.fa-plane-circle-check{--fa:"\e555"}.fa-face-rolling-eyes,.fa-meh-rolling-eyes{--fa:"\f5a5"}.fa-object-group{--fa:"\f247"}.fa-chart-line,.fa-line-chart{--fa:"\f201"}.fa-mask-ventilator{--fa:"\e524"}.fa-arrow-right{--fa:"\f061"}.fa-map-signs,.fa-signs-post{--fa:"\f277"}.fa-cash-register{--fa:"\f788"}.fa-person-circle-question{--fa:"\e542"}.fa-h{--fa:"\48"}.fa-tarp{--fa:"\e57b"}.fa-screwdriver-wrench,.fa-tools{--fa:"\f7d9"}.fa-arrows-to-eye{--fa:"\e4bf"}.fa-plug-circle-bolt{--fa:"\e55b"}.fa-heart{--fa:"\f004"}.fa-mars-and-venus{--fa:"\f224"}.fa-home-user,.fa-house-user{--fa:"\e1b0"}.fa-dumpster-fire{--fa:"\f794"}.fa-house-crack{--fa:"\e3b1"}.fa-cocktail,.fa-martini-glass-citrus{--fa:"\f561"}.fa-face-surprise,.fa-surprise{--fa:"\f5c2"}.fa-bottle-water{--fa:"\e4c5"}.fa-circle-pause,.fa-pause-circle{--fa:"\f28b"}.fa-toilet-paper-slash{--fa:"\e072"}.fa-apple-alt,.fa-apple-whole{--fa:"\f5d1"}.fa-kitchen-set{--fa:"\e51a"}.fa-r{--fa:"\52"}.fa-temperature-1,.fa-temperature-quarter,.fa-thermometer-1,.fa-thermometer-quarter{--fa:"\f2ca"}.fa-cube{--fa:"\f1b2"}.fa-bitcoin-sign{--fa:"\e0b4"}.fa-shield-dog{--fa:"\e573"}.fa-solar-panel{--fa:"\f5ba"}.fa-lock-open{--fa:"\f3c1"}.fa-elevator{--fa:"\e16d"}.fa-money-bill-transfer{--fa:"\e528"}.fa-money-bill-trend-up{--fa:"\e529"}.fa-house-flood-water-circle-arrow-right{--fa:"\e50f"}.fa-poll-h,.fa-square-poll-horizontal{--fa:"\f682"}.fa-circle{--fa:"\f111"}.fa-backward-fast,.fa-fast-backward{--fa:"\f049"}.fa-recycle{--fa:"\f1b8"}.fa-user-astronaut{--fa:"\f4fb"}.fa-plane-slash{--fa:"\e069"}.fa-trademark{--fa:"\f25c"}.fa-basketball,.fa-basketball-ball{--fa:"\f434"}.fa-satellite-dish{--fa:"\f7c0"}.fa-arrow-alt-circle-up,.fa-circle-up{--fa:"\f35b"}.fa-mobile-alt,.fa-mobile-screen-button{--fa:"\f3cd"}.fa-volume-high,.fa-volume-up{--fa:"\f028"}.fa-users-rays{--fa:"\e593"}.fa-wallet{--fa:"\f555"}.fa-clipboard-check{--fa:"\f46c"}.fa-file-audio{--fa:"\f1c7"}.fa-burger,.fa-hamburger{--fa:"\f805"}.fa-wrench{--fa:"\f0ad"}.fa-bugs{--fa:"\e4d0"}.fa-rupee,.fa-rupee-sign{--fa:"\f156"}.fa-file-image{--fa:"\f1c5"}.fa-circle-question,.fa-question-circle{--fa:"\f059"}.fa-plane-departure{--fa:"\f5b0"}.fa-handshake-slash{--fa:"\e060"}.fa-book-bookmark{--fa:"\e0bb"}.fa-code-branch{--fa:"\f126"}.fa-hat-cowboy{--fa:"\f8c0"}.fa-bridge{--fa:"\e4c8"}.fa-phone-alt,.fa-phone-flip{--fa:"\f879"}.fa-truck-front{--fa:"\e2b7"}.fa-cat{--fa:"\f6be"}.fa-anchor-circle-exclamation{--fa:"\e4ab"}.fa-truck-field{--fa:"\e58d"}.fa-route{--fa:"\f4d7"}.fa-clipboard-question{--fa:"\e4e3"}.fa-panorama{--fa:"\e209"}.fa-comment-medical{--fa:"\f7f5"}.fa-teeth-open{--fa:"\f62f"}.fa-file-circle-minus{--fa:"\e4ed"}.fa-tags{--fa:"\f02c"}.fa-wine-glass{--fa:"\f4e3"}.fa-fast-forward,.fa-forward-fast{--fa:"\f050"}.fa-face-meh-blank,.fa-meh-blank{--fa:"\f5a4"}.fa-parking,.fa-square-parking{--fa:"\f540"}.fa-house-signal{--fa:"\e012"}.fa-bars-progress,.fa-tasks-alt{--fa:"\f828"}.fa-faucet-drip{--fa:"\e006"}.fa-cart-flatbed,.fa-dolly-flatbed{--fa:"\f474"}.fa-ban-smoking,.fa-smoking-ban{--fa:"\f54d"}.fa-terminal{--fa:"\f120"}.fa-mobile-button{--fa:"\f10b"}.fa-house-medical-flag{--fa:"\e514"}.fa-basket-shopping,.fa-shopping-basket{--fa:"\f291"}.fa-tape{--fa:"\f4db"}.fa-bus-alt,.fa-bus-simple{--fa:"\f55e"}.fa-eye{--fa:"\f06e"}.fa-face-sad-cry,.fa-sad-cry{--fa:"\f5b3"}.fa-audio-description{--fa:"\f29e"}.fa-person-military-to-person{--fa:"\e54c"}.fa-file-shield{--fa:"\e4f0"}.fa-user-slash{--fa:"\f506"}.fa-pen{--fa:"\f304"}.fa-tower-observation{--fa:"\e586"}.fa-file-code{--fa:"\f1c9"}.fa-signal,.fa-signal-5,.fa-signal-perfect{--fa:"\f012"}.fa-bus{--fa:"\f207"}.fa-heart-circle-xmark{--fa:"\e501"}.fa-home-lg,.fa-house-chimney{--fa:"\e3af"}.fa-window-maximize{--fa:"\f2d0"}.fa-face-frown,.fa-frown{--fa:"\f119"}.fa-prescription{--fa:"\f5b1"}.fa-shop,.fa-store-alt{--fa:"\f54f"}.fa-floppy-disk,.fa-save{--fa:"\f0c7"}.fa-vihara{--fa:"\f6a7"}.fa-balance-scale-left,.fa-scale-unbalanced{--fa:"\f515"}.fa-sort-asc,.fa-sort-up{--fa:"\f0de"}.fa-comment-dots,.fa-commenting{--fa:"\f4ad"}.fa-plant-wilt{--fa:"\e5aa"}.fa-diamond{--fa:"\f219"}.fa-face-grin-squint,.fa-grin-squint{--fa:"\f585"}.fa-hand-holding-dollar,.fa-hand-holding-usd{--fa:"\f4c0"}.fa-chart-diagram{--fa:"\e695"}.fa-bacterium{--fa:"\e05a"}.fa-hand-pointer{--fa:"\f25a"}.fa-drum-steelpan{--fa:"\f56a"}.fa-hand-scissors{--fa:"\f257"}.fa-hands-praying,.fa-praying-hands{--fa:"\f684"}.fa-arrow-right-rotate,.fa-arrow-rotate-forward,.fa-arrow-rotate-right,.fa-redo{--fa:"\f01e"}.fa-biohazard{--fa:"\f780"}.fa-location,.fa-location-crosshairs{--fa:"\f601"}.fa-mars-double{--fa:"\f227"}.fa-child-dress{--fa:"\e59c"}.fa-users-between-lines{--fa:"\e591"}.fa-lungs-virus{--fa:"\e067"}.fa-face-grin-tears,.fa-grin-tears{--fa:"\f588"}.fa-phone{--fa:"\f095"}.fa-calendar-times,.fa-calendar-xmark{--fa:"\f273"}.fa-child-reaching{--fa:"\e59d"}.fa-head-side-virus{--fa:"\e064"}.fa-user-cog,.fa-user-gear{--fa:"\f4fe"}.fa-arrow-up-1-9,.fa-sort-numeric-up{--fa:"\f163"}.fa-door-closed{--fa:"\f52a"}.fa-shield-virus{--fa:"\e06c"}.fa-dice-six{--fa:"\f526"}.fa-mosquito-net{--fa:"\e52c"}.fa-file-fragment{--fa:"\e697"}.fa-bridge-water{--fa:"\e4ce"}.fa-person-booth{--fa:"\f756"}.fa-text-width{--fa:"\f035"}.fa-hat-wizard{--fa:"\f6e8"}.fa-pen-fancy{--fa:"\f5ac"}.fa-digging,.fa-person-digging{--fa:"\f85e"}.fa-trash{--fa:"\f1f8"}.fa-gauge-simple,.fa-gauge-simple-med,.fa-tachometer-average{--fa:"\f629"}.fa-book-medical{--fa:"\f7e6"}.fa-poo{--fa:"\f2fe"}.fa-quote-right,.fa-quote-right-alt{--fa:"\f10e"}.fa-shirt,.fa-t-shirt,.fa-tshirt{--fa:"\f553"}.fa-cubes{--fa:"\f1b3"}.fa-divide{--fa:"\f529"}.fa-tenge,.fa-tenge-sign{--fa:"\f7d7"}.fa-headphones{--fa:"\f025"}.fa-hands-holding{--fa:"\f4c2"}.fa-hands-clapping{--fa:"\e1a8"}.fa-republican{--fa:"\f75e"}.fa-arrow-left{--fa:"\f060"}.fa-person-circle-xmark{--fa:"\e543"}.fa-ruler{--fa:"\f545"}.fa-align-left{--fa:"\f036"}.fa-dice-d6{--fa:"\f6d1"}.fa-restroom{--fa:"\f7bd"}.fa-j{--fa:"\4a"}.fa-users-viewfinder{--fa:"\e595"}.fa-file-video{--fa:"\f1c8"}.fa-external-link-alt,.fa-up-right-from-square{--fa:"\f35d"}.fa-table-cells,.fa-th{--fa:"\f00a"}.fa-file-pdf{--fa:"\f1c1"}.fa-bible,.fa-book-bible{--fa:"\f647"}.fa-o{--fa:"\4f"}.fa-medkit,.fa-suitcase-medical{--fa:"\f0fa"}.fa-user-secret{--fa:"\f21b"}.fa-otter{--fa:"\f700"}.fa-female,.fa-person-dress{--fa:"\f182"}.fa-comment-dollar{--fa:"\f651"}.fa-briefcase-clock,.fa-business-time{--fa:"\f64a"}.fa-table-cells-large,.fa-th-large{--fa:"\f009"}.fa-book-tanakh,.fa-tanakh{--fa:"\f827"}.fa-phone-volume,.fa-volume-control-phone{--fa:"\f2a0"}.fa-hat-cowboy-side{--fa:"\f8c1"}.fa-clipboard-user{--fa:"\f7f3"}.fa-child{--fa:"\f1ae"}.fa-lira-sign{--fa:"\f195"}.fa-satellite{--fa:"\f7bf"}.fa-plane-lock{--fa:"\e558"}.fa-tag{--fa:"\f02b"}.fa-comment{--fa:"\f075"}.fa-birthday-cake,.fa-cake,.fa-cake-candles{--fa:"\f1fd"}.fa-envelope{--fa:"\f0e0"}.fa-angle-double-up,.fa-angles-up{--fa:"\f102"}.fa-paperclip{--fa:"\f0c6"}.fa-arrow-right-to-city{--fa:"\e4b3"}.fa-ribbon{--fa:"\f4d6"}.fa-lungs{--fa:"\f604"}.fa-arrow-up-9-1,.fa-sort-numeric-up-alt{--fa:"\f887"}.fa-litecoin-sign{--fa:"\e1d3"}.fa-border-none{--fa:"\f850"}.fa-circle-nodes{--fa:"\e4e2"}.fa-parachute-box{--fa:"\f4cd"}.fa-indent{--fa:"\f03c"}.fa-truck-field-un{--fa:"\e58e"}.fa-hourglass,.fa-hourglass-empty{--fa:"\f254"}.fa-mountain{--fa:"\f6fc"}.fa-user-doctor,.fa-user-md{--fa:"\f0f0"}.fa-circle-info,.fa-info-circle{--fa:"\f05a"}.fa-cloud-meatball{--fa:"\f73b"}.fa-camera,.fa-camera-alt{--fa:"\f030"}.fa-square-virus{--fa:"\e578"}.fa-meteor{--fa:"\f753"}.fa-car-on{--fa:"\e4dd"}.fa-sleigh{--fa:"\f7cc"}.fa-arrow-down-1-9,.fa-sort-numeric-asc,.fa-sort-numeric-down{--fa:"\f162"}.fa-hand-holding-droplet,.fa-hand-holding-water{--fa:"\f4c1"}.fa-water{--fa:"\f773"}.fa-calendar-check{--fa:"\f274"}.fa-braille{--fa:"\f2a1"}.fa-prescription-bottle-alt,.fa-prescription-bottle-medical{--fa:"\f486"}.fa-landmark{--fa:"\f66f"}.fa-truck{--fa:"\f0d1"}.fa-crosshairs{--fa:"\f05b"}.fa-person-cane{--fa:"\e53c"}.fa-tent{--fa:"\e57d"}.fa-vest-patches{--fa:"\e086"}.fa-check-double{--fa:"\f560"}.fa-arrow-down-a-z,.fa-sort-alpha-asc,.fa-sort-alpha-down{--fa:"\f15d"}.fa-money-bill-wheat{--fa:"\e52a"}.fa-cookie{--fa:"\f563"}.fa-arrow-left-rotate,.fa-arrow-rotate-back,.fa-arrow-rotate-backward,.fa-arrow-rotate-left,.fa-undo{--fa:"\f0e2"}.fa-hard-drive,.fa-hdd{--fa:"\f0a0"}.fa-face-grin-squint-tears,.fa-grin-squint-tears{--fa:"\f586"}.fa-dumbbell{--fa:"\f44b"}.fa-list-alt,.fa-rectangle-list{--fa:"\f022"}.fa-tarp-droplet{--fa:"\e57c"}.fa-house-medical-circle-check{--fa:"\e511"}.fa-person-skiing-nordic,.fa-skiing-nordic{--fa:"\f7ca"}.fa-calendar-plus{--fa:"\f271"}.fa-plane-arrival{--fa:"\f5af"}.fa-arrow-alt-circle-left,.fa-circle-left{--fa:"\f359"}.fa-subway,.fa-train-subway{--fa:"\f239"}.fa-chart-gantt{--fa:"\e0e4"}.fa-indian-rupee,.fa-indian-rupee-sign,.fa-inr{--fa:"\e1bc"}.fa-crop-alt,.fa-crop-simple{--fa:"\f565"}.fa-money-bill-1,.fa-money-bill-alt{--fa:"\f3d1"}.fa-left-long,.fa-long-arrow-alt-left{--fa:"\f30a"}.fa-dna{--fa:"\f471"}.fa-virus-slash{--fa:"\e075"}.fa-minus,.fa-subtract{--fa:"\f068"}.fa-chess{--fa:"\f439"}.fa-arrow-left-long,.fa-long-arrow-left{--fa:"\f177"}.fa-plug-circle-check{--fa:"\e55c"}.fa-street-view{--fa:"\f21d"}.fa-franc-sign{--fa:"\e18f"}.fa-volume-off{--fa:"\f026"}.fa-american-sign-language-interpreting,.fa-asl-interpreting,.fa-hands-american-sign-language-interpreting,.fa-hands-asl-interpreting{--fa:"\f2a3"}.fa-cog,.fa-gear{--fa:"\f013"}.fa-droplet-slash,.fa-tint-slash{--fa:"\f5c7"}.fa-mosque{--fa:"\f678"}.fa-mosquito{--fa:"\e52b"}.fa-star-of-david{--fa:"\f69a"}.fa-person-military-rifle{--fa:"\e54b"}.fa-cart-shopping,.fa-shopping-cart{--fa:"\f07a"}.fa-vials{--fa:"\f493"}.fa-plug-circle-plus{--fa:"\e55f"}.fa-place-of-worship{--fa:"\f67f"}.fa-grip-vertical{--fa:"\f58e"}.fa-hexagon-nodes{--fa:"\e699"}.fa-arrow-turn-up,.fa-level-up{--fa:"\f148"}.fa-u{--fa:"\55"}.fa-square-root-alt,.fa-square-root-variable{--fa:"\f698"}.fa-clock,.fa-clock-four{--fa:"\f017"}.fa-backward-step,.fa-step-backward{--fa:"\f048"}.fa-pallet{--fa:"\f482"}.fa-faucet{--fa:"\e005"}.fa-baseball-bat-ball{--fa:"\f432"}.fa-s{--fa:"\53"}.fa-timeline{--fa:"\e29c"}.fa-keyboard{--fa:"\f11c"}.fa-caret-down{--fa:"\f0d7"}.fa-clinic-medical,.fa-house-chimney-medical{--fa:"\f7f2"}.fa-temperature-3,.fa-temperature-three-quarters,.fa-thermometer-3,.fa-thermometer-three-quarters{--fa:"\f2c8"}.fa-mobile-android-alt,.fa-mobile-screen{--fa:"\f3cf"}.fa-plane-up{--fa:"\e22d"}.fa-piggy-bank{--fa:"\f4d3"}.fa-battery-3,.fa-battery-half{--fa:"\f242"}.fa-mountain-city{--fa:"\e52e"}.fa-coins{--fa:"\f51e"}.fa-khanda{--fa:"\f66d"}.fa-sliders,.fa-sliders-h{--fa:"\f1de"}.fa-folder-tree{--fa:"\f802"}.fa-network-wired{--fa:"\f6ff"}.fa-map-pin{--fa:"\f276"}.fa-hamsa{--fa:"\f665"}.fa-cent-sign{--fa:"\e3f5"}.fa-flask{--fa:"\f0c3"}.fa-person-pregnant{--fa:"\e31e"}.fa-wand-sparkles{--fa:"\f72b"}.fa-ellipsis-v,.fa-ellipsis-vertical{--fa:"\f142"}.fa-ticket{--fa:"\f145"}.fa-power-off{--fa:"\f011"}.fa-long-arrow-alt-right,.fa-right-long{--fa:"\f30b"}.fa-flag-usa{--fa:"\f74d"}.fa-laptop-file{--fa:"\e51d"}.fa-teletype,.fa-tty{--fa:"\f1e4"}.fa-diagram-next{--fa:"\e476"}.fa-person-rifle{--fa:"\e54e"}.fa-house-medical-circle-exclamation{--fa:"\e512"}.fa-closed-captioning{--fa:"\f20a"}.fa-hiking,.fa-person-hiking{--fa:"\f6ec"}.fa-venus-double{--fa:"\f226"}.fa-images{--fa:"\f302"}.fa-calculator{--fa:"\f1ec"}.fa-people-pulling{--fa:"\e535"}.fa-n{--fa:"\4e"}.fa-cable-car,.fa-tram{--fa:"\f7da"}.fa-cloud-rain{--fa:"\f73d"}.fa-building-circle-xmark{--fa:"\e4d4"}.fa-ship{--fa:"\f21a"}.fa-arrows-down-to-line{--fa:"\e4b8"}.fa-download{--fa:"\f019"}.fa-face-grin,.fa-grin{--fa:"\f580"}.fa-backspace,.fa-delete-left{--fa:"\f55a"}.fa-eye-dropper,.fa-eye-dropper-empty,.fa-eyedropper{--fa:"\f1fb"}.fa-file-circle-check{--fa:"\e5a0"}.fa-forward{--fa:"\f04e"}.fa-mobile,.fa-mobile-android,.fa-mobile-phone{--fa:"\f3ce"}.fa-face-meh,.fa-meh{--fa:"\f11a"}.fa-align-center{--fa:"\f037"}.fa-book-dead,.fa-book-skull{--fa:"\f6b7"}.fa-drivers-license,.fa-id-card{--fa:"\f2c2"}.fa-dedent,.fa-outdent{--fa:"\f03b"}.fa-heart-circle-exclamation{--fa:"\e4fe"}.fa-home,.fa-home-alt,.fa-home-lg-alt,.fa-house{--fa:"\f015"}.fa-calendar-week{--fa:"\f784"}.fa-laptop-medical{--fa:"\f812"}.fa-b{--fa:"\42"}.fa-file-medical{--fa:"\f477"}.fa-dice-one{--fa:"\f525"}.fa-kiwi-bird{--fa:"\f535"}.fa-arrow-right-arrow-left,.fa-exchange{--fa:"\f0ec"}.fa-redo-alt,.fa-rotate-forward,.fa-rotate-right{--fa:"\f2f9"}.fa-cutlery,.fa-utensils{--fa:"\f2e7"}.fa-arrow-up-wide-short,.fa-sort-amount-up{--fa:"\f161"}.fa-mill-sign{--fa:"\e1ed"}.fa-bowl-rice{--fa:"\e2eb"}.fa-skull{--fa:"\f54c"}.fa-broadcast-tower,.fa-tower-broadcast{--fa:"\f519"}.fa-truck-pickup{--fa:"\f63c"}.fa-long-arrow-alt-up,.fa-up-long{--fa:"\f30c"}.fa-stop{--fa:"\f04d"}.fa-code-merge{--fa:"\f387"}.fa-upload{--fa:"\f093"}.fa-hurricane{--fa:"\f751"}.fa-mound{--fa:"\e52d"}.fa-toilet-portable{--fa:"\e583"}.fa-compact-disc{--fa:"\f51f"}.fa-file-arrow-down,.fa-file-download{--fa:"\f56d"}.fa-caravan{--fa:"\f8ff"}.fa-shield-cat{--fa:"\e572"}.fa-bolt,.fa-zap{--fa:"\f0e7"}.fa-glass-water{--fa:"\e4f4"}.fa-oil-well{--fa:"\e532"}.fa-vault{--fa:"\e2c5"}.fa-mars{--fa:"\f222"}.fa-toilet{--fa:"\f7d8"}.fa-plane-circle-xmark{--fa:"\e557"}.fa-cny,.fa-jpy,.fa-rmb,.fa-yen,.fa-yen-sign{--fa:"\f157"}.fa-rouble,.fa-rub,.fa-ruble,.fa-ruble-sign{--fa:"\f158"}.fa-sun{--fa:"\f185"}.fa-guitar{--fa:"\f7a6"}.fa-face-laugh-wink,.fa-laugh-wink{--fa:"\f59c"}.fa-horse-head{--fa:"\f7ab"}.fa-bore-hole{--fa:"\e4c3"}.fa-industry{--fa:"\f275"}.fa-arrow-alt-circle-down,.fa-circle-down{--fa:"\f358"}.fa-arrows-turn-to-dots{--fa:"\e4c1"}.fa-florin-sign{--fa:"\e184"}.fa-arrow-down-short-wide,.fa-sort-amount-desc,.fa-sort-amount-down-alt{--fa:"\f884"}.fa-less-than{--fa:"\3c"}.fa-angle-down{--fa:"\f107"}.fa-car-tunnel{--fa:"\e4de"}.fa-head-side-cough{--fa:"\e061"}.fa-grip-lines{--fa:"\f7a4"}.fa-thumbs-down{--fa:"\f165"}.fa-user-lock{--fa:"\f502"}.fa-arrow-right-long,.fa-long-arrow-right{--fa:"\f178"}.fa-anchor-circle-xmark{--fa:"\e4ac"}.fa-ellipsis,.fa-ellipsis-h{--fa:"\f141"}.fa-chess-pawn{--fa:"\f443"}.fa-first-aid,.fa-kit-medical{--fa:"\f479"}.fa-person-through-window{--fa:"\e5a9"}.fa-toolbox{--fa:"\f552"}.fa-hands-holding-circle{--fa:"\e4fb"}.fa-bug{--fa:"\f188"}.fa-credit-card,.fa-credit-card-alt{--fa:"\f09d"}.fa-automobile,.fa-car{--fa:"\f1b9"}.fa-hand-holding-hand{--fa:"\e4f7"}.fa-book-open-reader,.fa-book-reader{--fa:"\f5da"}.fa-mountain-sun{--fa:"\e52f"}.fa-arrows-left-right-to-line{--fa:"\e4ba"}.fa-dice-d20{--fa:"\f6cf"}.fa-truck-droplet{--fa:"\e58c"}.fa-file-circle-xmark{--fa:"\e5a1"}.fa-temperature-arrow-up,.fa-temperature-up{--fa:"\e040"}.fa-medal{--fa:"\f5a2"}.fa-bed{--fa:"\f236"}.fa-h-square,.fa-square-h{--fa:"\f0fd"}.fa-podcast{--fa:"\f2ce"}.fa-temperature-4,.fa-temperature-full,.fa-thermometer-4,.fa-thermometer-full{--fa:"\f2c7"}.fa-bell{--fa:"\f0f3"}.fa-superscript{--fa:"\f12b"}.fa-plug-circle-xmark{--fa:"\e560"}.fa-star-of-life{--fa:"\f621"}.fa-phone-slash{--fa:"\f3dd"}.fa-paint-roller{--fa:"\f5aa"}.fa-hands-helping,.fa-handshake-angle{--fa:"\f4c4"}.fa-location-dot,.fa-map-marker-alt{--fa:"\f3c5"}.fa-file{--fa:"\f15b"}.fa-greater-than{--fa:"\3e"}.fa-person-swimming,.fa-swimmer{--fa:"\f5c4"}.fa-arrow-down{--fa:"\f063"}.fa-droplet,.fa-tint{--fa:"\f043"}.fa-eraser{--fa:"\f12d"}.fa-earth,.fa-earth-america,.fa-earth-americas,.fa-globe-americas{--fa:"\f57d"}.fa-person-burst{--fa:"\e53b"}.fa-dove{--fa:"\f4ba"}.fa-battery-0,.fa-battery-empty{--fa:"\f244"}.fa-socks{--fa:"\f696"}.fa-inbox{--fa:"\f01c"}.fa-section{--fa:"\e447"}.fa-gauge-high,.fa-tachometer-alt,.fa-tachometer-alt-fast{--fa:"\f625"}.fa-envelope-open-text{--fa:"\f658"}.fa-hospital,.fa-hospital-alt,.fa-hospital-wide{--fa:"\f0f8"}.fa-wine-bottle{--fa:"\f72f"}.fa-chess-rook{--fa:"\f447"}.fa-bars-staggered,.fa-reorder,.fa-stream{--fa:"\f550"}.fa-dharmachakra{--fa:"\f655"}.fa-hotdog{--fa:"\f80f"}.fa-blind,.fa-person-walking-with-cane{--fa:"\f29d"}.fa-drum{--fa:"\f569"}.fa-ice-cream{--fa:"\f810"}.fa-heart-circle-bolt{--fa:"\e4fc"}.fa-fax{--fa:"\f1ac"}.fa-paragraph{--fa:"\f1dd"}.fa-check-to-slot,.fa-vote-yea{--fa:"\f772"}.fa-star-half{--fa:"\f089"}.fa-boxes,.fa-boxes-alt,.fa-boxes-stacked{--fa:"\f468"}.fa-chain,.fa-link{--fa:"\f0c1"}.fa-assistive-listening-systems,.fa-ear-listen{--fa:"\f2a2"}.fa-tree-city{--fa:"\e587"}.fa-play{--fa:"\f04b"}.fa-font{--fa:"\f031"}.fa-table-cells-row-lock{--fa:"\e67a"}.fa-rupiah-sign{--fa:"\e23d"}.fa-magnifying-glass,.fa-search{--fa:"\f002"}.fa-ping-pong-paddle-ball,.fa-table-tennis,.fa-table-tennis-paddle-ball{--fa:"\f45d"}.fa-diagnoses,.fa-person-dots-from-line{--fa:"\f470"}.fa-trash-can-arrow-up,.fa-trash-restore-alt{--fa:"\f82a"}.fa-naira-sign{--fa:"\e1f6"}.fa-cart-arrow-down{--fa:"\f218"}.fa-walkie-talkie{--fa:"\f8ef"}.fa-file-edit,.fa-file-pen{--fa:"\f31c"}.fa-receipt{--fa:"\f543"}.fa-pen-square,.fa-pencil-square,.fa-square-pen{--fa:"\f14b"}.fa-suitcase-rolling{--fa:"\f5c1"}.fa-person-circle-exclamation{--fa:"\e53f"}.fa-chevron-down{--fa:"\f078"}.fa-battery,.fa-battery-5,.fa-battery-full{--fa:"\f240"}.fa-skull-crossbones{--fa:"\f714"}.fa-code-compare{--fa:"\e13a"}.fa-list-dots,.fa-list-ul{--fa:"\f0ca"}.fa-school-lock{--fa:"\e56f"}.fa-tower-cell{--fa:"\e585"}.fa-down-long,.fa-long-arrow-alt-down{--fa:"\f309"}.fa-ranking-star{--fa:"\e561"}.fa-chess-king{--fa:"\f43f"}.fa-person-harassing{--fa:"\e549"}.fa-brazilian-real-sign{--fa:"\e46c"}.fa-landmark-alt,.fa-landmark-dome{--fa:"\f752"}.fa-arrow-up{--fa:"\f062"}.fa-television,.fa-tv,.fa-tv-alt{--fa:"\f26c"}.fa-shrimp{--fa:"\e448"}.fa-list-check,.fa-tasks{--fa:"\f0ae"}.fa-jug-detergent{--fa:"\e519"}.fa-circle-user,.fa-user-circle{--fa:"\f2bd"}.fa-user-shield{--fa:"\f505"}.fa-wind{--fa:"\f72e"}.fa-car-burst,.fa-car-crash{--fa:"\f5e1"}.fa-y{--fa:"\59"}.fa-person-snowboarding,.fa-snowboarding{--fa:"\f7ce"}.fa-shipping-fast,.fa-truck-fast{--fa:"\f48b"}.fa-fish{--fa:"\f578"}.fa-user-graduate{--fa:"\f501"}.fa-adjust,.fa-circle-half-stroke{--fa:"\f042"}.fa-clapperboard{--fa:"\e131"}.fa-circle-radiation,.fa-radiation-alt{--fa:"\f7ba"}.fa-baseball,.fa-baseball-ball{--fa:"\f433"}.fa-jet-fighter-up{--fa:"\e518"}.fa-diagram-project,.fa-project-diagram{--fa:"\f542"}.fa-copy{--fa:"\f0c5"}.fa-volume-mute,.fa-volume-times,.fa-volume-xmark{--fa:"\f6a9"}.fa-hand-sparkles{--fa:"\e05d"}.fa-grip,.fa-grip-horizontal{--fa:"\f58d"}.fa-share-from-square,.fa-share-square{--fa:"\f14d"}.fa-child-combatant,.fa-child-rifle{--fa:"\e4e0"}.fa-gun{--fa:"\e19b"}.fa-phone-square,.fa-square-phone{--fa:"\f098"}.fa-add,.fa-plus{--fa:"\2b"}.fa-expand{--fa:"\f065"}.fa-computer{--fa:"\e4e5"}.fa-close,.fa-multiply,.fa-remove,.fa-times,.fa-xmark{--fa:"\f00d"}.fa-arrows,.fa-arrows-up-down-left-right{--fa:"\f047"}.fa-chalkboard-teacher,.fa-chalkboard-user{--fa:"\f51c"}.fa-peso-sign{--fa:"\e222"}.fa-building-shield{--fa:"\e4d8"}.fa-baby{--fa:"\f77c"}.fa-users-line{--fa:"\e592"}.fa-quote-left,.fa-quote-left-alt{--fa:"\f10d"}.fa-tractor{--fa:"\f722"}.fa-trash-arrow-up,.fa-trash-restore{--fa:"\f829"}.fa-arrow-down-up-lock{--fa:"\e4b0"}.fa-lines-leaning{--fa:"\e51e"}.fa-ruler-combined{--fa:"\f546"}.fa-copyright{--fa:"\f1f9"}.fa-equals{--fa:"\3d"}.fa-blender{--fa:"\f517"}.fa-teeth{--fa:"\f62e"}.fa-ils,.fa-shekel,.fa-shekel-sign,.fa-sheqel,.fa-sheqel-sign{--fa:"\f20b"}.fa-map{--fa:"\f279"}.fa-rocket{--fa:"\f135"}.fa-photo-film,.fa-photo-video{--fa:"\f87c"}.fa-folder-minus{--fa:"\f65d"}.fa-hexagon-nodes-bolt{--fa:"\e69a"}.fa-store{--fa:"\f54e"}.fa-arrow-trend-up{--fa:"\e098"}.fa-plug-circle-minus{--fa:"\e55e"}.fa-sign,.fa-sign-hanging{--fa:"\f4d9"}.fa-bezier-curve{--fa:"\f55b"}.fa-bell-slash{--fa:"\f1f6"}.fa-tablet,.fa-tablet-android{--fa:"\f3fb"}.fa-school-flag{--fa:"\e56e"}.fa-fill{--fa:"\f575"}.fa-angle-up{--fa:"\f106"}.fa-drumstick-bite{--fa:"\f6d7"}.fa-holly-berry{--fa:"\f7aa"}.fa-chevron-left{--fa:"\f053"}.fa-bacteria{--fa:"\e059"}.fa-hand-lizard{--fa:"\f258"}.fa-notdef{--fa:"\e1fe"}.fa-disease{--fa:"\f7fa"}.fa-briefcase-medical{--fa:"\f469"}.fa-genderless{--fa:"\f22d"}.fa-chevron-right{--fa:"\f054"}.fa-retweet{--fa:"\f079"}.fa-car-alt,.fa-car-rear{--fa:"\f5de"}.fa-pump-soap{--fa:"\e06b"}.fa-video-slash{--fa:"\f4e2"}.fa-battery-2,.fa-battery-quarter{--fa:"\f243"}.fa-radio{--fa:"\f8d7"}.fa-baby-carriage,.fa-carriage-baby{--fa:"\f77d"}.fa-traffic-light{--fa:"\f637"}.fa-thermometer{--fa:"\f491"}.fa-vr-cardboard{--fa:"\f729"}.fa-hand-middle-finger{--fa:"\f806"}.fa-percent,.fa-percentage{--fa:"\25"}.fa-truck-moving{--fa:"\f4df"}.fa-glass-water-droplet{--fa:"\e4f5"}.fa-display{--fa:"\e163"}.fa-face-smile,.fa-smile{--fa:"\f118"}.fa-thumb-tack,.fa-thumbtack{--fa:"\f08d"}.fa-trophy{--fa:"\f091"}.fa-person-praying,.fa-pray{--fa:"\f683"}.fa-hammer{--fa:"\f6e3"}.fa-hand-peace{--fa:"\f25b"}.fa-rotate,.fa-sync-alt{--fa:"\f2f1"}.fa-spinner{--fa:"\f110"}.fa-robot{--fa:"\f544"}.fa-peace{--fa:"\f67c"}.fa-cogs,.fa-gears{--fa:"\f085"}.fa-warehouse{--fa:"\f494"}.fa-arrow-up-right-dots{--fa:"\e4b7"}.fa-splotch{--fa:"\f5bc"}.fa-face-grin-hearts,.fa-grin-hearts{--fa:"\f584"}.fa-dice-four{--fa:"\f524"}.fa-sim-card{--fa:"\f7c4"}.fa-transgender,.fa-transgender-alt{--fa:"\f225"}.fa-mercury{--fa:"\f223"}.fa-arrow-turn-down,.fa-level-down{--fa:"\f149"}.fa-person-falling-burst{--fa:"\e547"}.fa-award{--fa:"\f559"}.fa-ticket-alt,.fa-ticket-simple{--fa:"\f3ff"}.fa-building{--fa:"\f1ad"}.fa-angle-double-left,.fa-angles-left{--fa:"\f100"}.fa-qrcode{--fa:"\f029"}.fa-clock-rotate-left,.fa-history{--fa:"\f1da"}.fa-face-grin-beam-sweat,.fa-grin-beam-sweat{--fa:"\f583"}.fa-arrow-right-from-file,.fa-file-export{--fa:"\f56e"}.fa-shield,.fa-shield-blank{--fa:"\f132"}.fa-arrow-up-short-wide,.fa-sort-amount-up-alt{--fa:"\f885"}.fa-comment-nodes{--fa:"\e696"}.fa-house-medical{--fa:"\e3b2"}.fa-golf-ball,.fa-golf-ball-tee{--fa:"\f450"}.fa-chevron-circle-left,.fa-circle-chevron-left{--fa:"\f137"}.fa-house-chimney-window{--fa:"\e00d"}.fa-pen-nib{--fa:"\f5ad"}.fa-tent-arrow-turn-left{--fa:"\e580"}.fa-tents{--fa:"\e582"}.fa-magic,.fa-wand-magic{--fa:"\f0d0"}.fa-dog{--fa:"\f6d3"}.fa-carrot{--fa:"\f787"}.fa-moon{--fa:"\f186"}.fa-wine-glass-alt,.fa-wine-glass-empty{--fa:"\f5ce"}.fa-cheese{--fa:"\f7ef"}.fa-yin-yang{--fa:"\f6ad"}.fa-music{--fa:"\f001"}.fa-code-commit{--fa:"\f386"}.fa-temperature-low{--fa:"\f76b"}.fa-biking,.fa-person-biking{--fa:"\f84a"}.fa-broom{--fa:"\f51a"}.fa-shield-heart{--fa:"\e574"}.fa-gopuram{--fa:"\f664"}.fa-earth-oceania,.fa-globe-oceania{--fa:"\e47b"}.fa-square-xmark,.fa-times-square,.fa-xmark-square{--fa:"\f2d3"}.fa-hashtag{--fa:"\23"}.fa-expand-alt,.fa-up-right-and-down-left-from-center{--fa:"\f424"}.fa-oil-can{--fa:"\f613"}.fa-t{--fa:"\54"}.fa-hippo{--fa:"\f6ed"}.fa-chart-column{--fa:"\e0e3"}.fa-infinity{--fa:"\f534"}.fa-vial-circle-check{--fa:"\e596"}.fa-person-arrow-down-to-line{--fa:"\e538"}.fa-voicemail{--fa:"\f897"}.fa-fan{--fa:"\f863"}.fa-person-walking-luggage{--fa:"\e554"}.fa-arrows-alt-v,.fa-up-down{--fa:"\f338"}.fa-cloud-moon-rain{--fa:"\f73c"}.fa-calendar{--fa:"\f133"}.fa-trailer{--fa:"\e041"}.fa-bahai,.fa-haykal{--fa:"\f666"}.fa-sd-card{--fa:"\f7c2"}.fa-dragon{--fa:"\f6d5"}.fa-shoe-prints{--fa:"\f54b"}.fa-circle-plus,.fa-plus-circle{--fa:"\f055"}.fa-face-grin-tongue-wink,.fa-grin-tongue-wink{--fa:"\f58b"}.fa-hand-holding{--fa:"\f4bd"}.fa-plug-circle-exclamation{--fa:"\e55d"}.fa-chain-broken,.fa-chain-slash,.fa-link-slash,.fa-unlink{--fa:"\f127"}.fa-clone{--fa:"\f24d"}.fa-person-walking-arrow-loop-left{--fa:"\e551"}.fa-arrow-up-z-a,.fa-sort-alpha-up-alt{--fa:"\f882"}.fa-fire-alt,.fa-fire-flame-curved{--fa:"\f7e4"}.fa-tornado{--fa:"\f76f"}.fa-file-circle-plus{--fa:"\e494"}.fa-book-quran,.fa-quran{--fa:"\f687"}.fa-anchor{--fa:"\f13d"}.fa-border-all{--fa:"\f84c"}.fa-angry,.fa-face-angry{--fa:"\f556"}.fa-cookie-bite{--fa:"\f564"}.fa-arrow-trend-down{--fa:"\e097"}.fa-feed,.fa-rss{--fa:"\f09e"}.fa-draw-polygon{--fa:"\f5ee"}.fa-balance-scale,.fa-scale-balanced{--fa:"\f24e"}.fa-gauge-simple-high,.fa-tachometer,.fa-tachometer-fast{--fa:"\f62a"}.fa-shower{--fa:"\f2cc"}.fa-desktop,.fa-desktop-alt{--fa:"\f390"}.fa-m{--fa:"\4d"}.fa-table-list,.fa-th-list{--fa:"\f00b"}.fa-comment-sms,.fa-sms{--fa:"\f7cd"}.fa-book{--fa:"\f02d"}.fa-user-plus{--fa:"\f234"}.fa-check{--fa:"\f00c"}.fa-battery-4,.fa-battery-three-quarters{--fa:"\f241"}.fa-house-circle-check{--fa:"\e509"}.fa-angle-left{--fa:"\f104"}.fa-diagram-successor{--fa:"\e47a"}.fa-truck-arrow-right{--fa:"\e58b"}.fa-arrows-split-up-and-left{--fa:"\e4bc"}.fa-fist-raised,.fa-hand-fist{--fa:"\f6de"}.fa-cloud-moon{--fa:"\f6c3"}.fa-briefcase{--fa:"\f0b1"}.fa-person-falling{--fa:"\e546"}.fa-image-portrait,.fa-portrait{--fa:"\f3e0"}.fa-user-tag{--fa:"\f507"}.fa-rug{--fa:"\e569"}.fa-earth-europe,.fa-globe-europe{--fa:"\f7a2"}.fa-cart-flatbed-suitcase,.fa-luggage-cart{--fa:"\f59d"}.fa-rectangle-times,.fa-rectangle-xmark,.fa-times-rectangle,.fa-window-close{--fa:"\f410"}.fa-baht-sign{--fa:"\e0ac"}.fa-book-open{--fa:"\f518"}.fa-book-journal-whills,.fa-journal-whills{--fa:"\f66a"}.fa-handcuffs{--fa:"\e4f8"}.fa-exclamation-triangle,.fa-triangle-exclamation,.fa-warning{--fa:"\f071"}.fa-database{--fa:"\f1c0"}.fa-mail-forward,.fa-share{--fa:"\f064"}.fa-bottle-droplet{--fa:"\e4c4"}.fa-mask-face{--fa:"\e1d7"}.fa-hill-rockslide{--fa:"\e508"}.fa-exchange-alt,.fa-right-left{--fa:"\f362"}.fa-paper-plane{--fa:"\f1d8"}.fa-road-circle-exclamation{--fa:"\e565"}.fa-dungeon{--fa:"\f6d9"}.fa-align-right{--fa:"\f038"}.fa-money-bill-1-wave,.fa-money-bill-wave-alt{--fa:"\f53b"}.fa-life-ring{--fa:"\f1cd"}.fa-hands,.fa-sign-language,.fa-signing{--fa:"\f2a7"}.fa-calendar-day{--fa:"\f783"}.fa-ladder-water,.fa-swimming-pool,.fa-water-ladder{--fa:"\f5c5"}.fa-arrows-up-down,.fa-arrows-v{--fa:"\f07d"}.fa-face-grimace,.fa-grimace{--fa:"\f57f"}.fa-wheelchair-alt,.fa-wheelchair-move{--fa:"\e2ce"}.fa-level-down-alt,.fa-turn-down{--fa:"\f3be"}.fa-person-walking-arrow-right{--fa:"\e552"}.fa-envelope-square,.fa-square-envelope{--fa:"\f199"}.fa-dice{--fa:"\f522"}.fa-bowling-ball{--fa:"\f436"}.fa-brain{--fa:"\f5dc"}.fa-band-aid,.fa-bandage{--fa:"\f462"}.fa-calendar-minus{--fa:"\f272"}.fa-circle-xmark,.fa-times-circle,.fa-xmark-circle{--fa:"\f057"}.fa-gifts{--fa:"\f79c"}.fa-hotel{--fa:"\f594"}.fa-earth-asia,.fa-globe-asia{--fa:"\f57e"}.fa-id-card-alt,.fa-id-card-clip{--fa:"\f47f"}.fa-magnifying-glass-plus,.fa-search-plus{--fa:"\f00e"}.fa-thumbs-up{--fa:"\f164"}.fa-user-clock{--fa:"\f4fd"}.fa-allergies,.fa-hand-dots{--fa:"\f461"}.fa-file-invoice{--fa:"\f570"}.fa-window-minimize{--fa:"\f2d1"}.fa-coffee,.fa-mug-saucer{--fa:"\f0f4"}.fa-brush{--fa:"\f55d"}.fa-file-half-dashed{--fa:"\e698"}.fa-mask{--fa:"\f6fa"}.fa-magnifying-glass-minus,.fa-search-minus{--fa:"\f010"}.fa-ruler-vertical{--fa:"\f548"}.fa-user-alt,.fa-user-large{--fa:"\f406"}.fa-train-tram{--fa:"\e5b4"}.fa-user-nurse{--fa:"\f82f"}.fa-syringe{--fa:"\f48e"}.fa-cloud-sun{--fa:"\f6c4"}.fa-stopwatch-20{--fa:"\e06f"}.fa-square-full{--fa:"\f45c"}.fa-magnet{--fa:"\f076"}.fa-jar{--fa:"\e516"}.fa-note-sticky,.fa-sticky-note{--fa:"\f249"}.fa-bug-slash{--fa:"\e490"}.fa-arrow-up-from-water-pump{--fa:"\e4b6"}.fa-bone{--fa:"\f5d7"}.fa-table-cells-row-unlock{--fa:"\e691"}.fa-user-injured{--fa:"\f728"}.fa-face-sad-tear,.fa-sad-tear{--fa:"\f5b4"}.fa-plane{--fa:"\f072"}.fa-tent-arrows-down{--fa:"\e581"}.fa-exclamation{--fa:"\21"}.fa-arrows-spin{--fa:"\e4bb"}.fa-print{--fa:"\f02f"}.fa-try,.fa-turkish-lira,.fa-turkish-lira-sign{--fa:"\e2bb"}.fa-dollar,.fa-dollar-sign,.fa-usd{--fa:"\24"}.fa-x{--fa:"\58"}.fa-magnifying-glass-dollar,.fa-search-dollar{--fa:"\f688"}.fa-users-cog,.fa-users-gear{--fa:"\f509"}.fa-person-military-pointing{--fa:"\e54a"}.fa-bank,.fa-building-columns,.fa-institution,.fa-museum,.fa-university{--fa:"\f19c"}.fa-umbrella{--fa:"\f0e9"}.fa-trowel{--fa:"\e589"}.fa-d{--fa:"\44"}.fa-stapler{--fa:"\e5af"}.fa-masks-theater,.fa-theater-masks{--fa:"\f630"}.fa-kip-sign{--fa:"\e1c4"}.fa-hand-point-left{--fa:"\f0a5"}.fa-handshake-alt,.fa-handshake-simple{--fa:"\f4c6"}.fa-fighter-jet,.fa-jet-fighter{--fa:"\f0fb"}.fa-share-alt-square,.fa-square-share-nodes{--fa:"\f1e1"}.fa-barcode{--fa:"\f02a"}.fa-plus-minus{--fa:"\e43c"}.fa-video,.fa-video-camera{--fa:"\f03d"}.fa-graduation-cap,.fa-mortar-board{--fa:"\f19d"}.fa-hand-holding-medical{--fa:"\e05c"}.fa-person-circle-check{--fa:"\e53e"}.fa-level-up-alt,.fa-turn-up{--fa:"\f3bf"}
.fa-sr-only,.fa-sr-only-focusable:not(:focus),.sr-only,.sr-only-focusable:not(:focus){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}:host,:root{--fa-style-family-brands:"Font Awesome 6 Brands";--fa-font-brands:normal 400 1em/1 "Font Awesome 6 Brands"}@font-face{font-family:"Font Awesome 6 Brands";font-style:normal;font-weight:400;font-display:block;src:url(/static/media/fa-brands-400.c210719e60948b211a12.woff2) format("woff2"),url(/static/media/fa-brands-400.1815e00441357e01619e.ttf) format("truetype")}.fa-brands,.fab{font-weight:400}.fa-monero{--fa:"\f3d0"}.fa-hooli{--fa:"\f427"}.fa-yelp{--fa:"\f1e9"}.fa-cc-visa{--fa:"\f1f0"}.fa-lastfm{--fa:"\f202"}.fa-shopware{--fa:"\f5b5"}.fa-creative-commons-nc{--fa:"\f4e8"}.fa-aws{--fa:"\f375"}.fa-redhat{--fa:"\f7bc"}.fa-yoast{--fa:"\f2b1"}.fa-cloudflare{--fa:"\e07d"}.fa-ups{--fa:"\f7e0"}.fa-pixiv{--fa:"\e640"}.fa-wpexplorer{--fa:"\f2de"}.fa-dyalog{--fa:"\f399"}.fa-bity{--fa:"\f37a"}.fa-stackpath{--fa:"\f842"}.fa-buysellads{--fa:"\f20d"}.fa-first-order{--fa:"\f2b0"}.fa-modx{--fa:"\f285"}.fa-guilded{--fa:"\e07e"}.fa-vnv{--fa:"\f40b"}.fa-js-square,.fa-square-js{--fa:"\f3b9"}.fa-microsoft{--fa:"\f3ca"}.fa-qq{--fa:"\f1d6"}.fa-orcid{--fa:"\f8d2"}.fa-java{--fa:"\f4e4"}.fa-invision{--fa:"\f7b0"}.fa-creative-commons-pd-alt{--fa:"\f4ed"}.fa-centercode{--fa:"\f380"}.fa-glide-g{--fa:"\f2a6"}.fa-drupal{--fa:"\f1a9"}.fa-jxl{--fa:"\e67b"}.fa-dart-lang{--fa:"\e693"}.fa-hire-a-helper{--fa:"\f3b0"}.fa-creative-commons-by{--fa:"\f4e7"}.fa-unity{--fa:"\e049"}.fa-whmcs{--fa:"\f40d"}.fa-rocketchat{--fa:"\f3e8"}.fa-vk{--fa:"\f189"}.fa-untappd{--fa:"\f405"}.fa-mailchimp{--fa:"\f59e"}.fa-css3-alt{--fa:"\f38b"}.fa-reddit-square,.fa-square-reddit{--fa:"\f1a2"}.fa-vimeo-v{--fa:"\f27d"}.fa-contao{--fa:"\f26d"}.fa-square-font-awesome{--fa:"\e5ad"}.fa-deskpro{--fa:"\f38f"}.fa-brave{--fa:"\e63c"}.fa-sistrix{--fa:"\f3ee"}.fa-instagram-square,.fa-square-instagram{--fa:"\e055"}.fa-battle-net{--fa:"\f835"}.fa-the-red-yeti{--fa:"\f69d"}.fa-hacker-news-square,.fa-square-hacker-news{--fa:"\f3af"}.fa-edge{--fa:"\f282"}.fa-threads{--fa:"\e618"}.fa-napster{--fa:"\f3d2"}.fa-snapchat-square,.fa-square-snapchat{--fa:"\f2ad"}.fa-google-plus-g{--fa:"\f0d5"}.fa-artstation{--fa:"\f77a"}.fa-markdown{--fa:"\f60f"}.fa-sourcetree{--fa:"\f7d3"}.fa-google-plus{--fa:"\f2b3"}.fa-diaspora{--fa:"\f791"}.fa-foursquare{--fa:"\f180"}.fa-stack-overflow{--fa:"\f16c"}.fa-github-alt{--fa:"\f113"}.fa-phoenix-squadron{--fa:"\f511"}.fa-pagelines{--fa:"\f18c"}.fa-algolia{--fa:"\f36c"}.fa-red-river{--fa:"\f3e3"}.fa-creative-commons-sa{--fa:"\f4ef"}.fa-safari{--fa:"\f267"}.fa-google{--fa:"\f1a0"}.fa-font-awesome-alt,.fa-square-font-awesome-stroke{--fa:"\f35c"}.fa-atlassian{--fa:"\f77b"}.fa-linkedin-in{--fa:"\f0e1"}.fa-digital-ocean{--fa:"\f391"}.fa-nimblr{--fa:"\f5a8"}.fa-chromecast{--fa:"\f838"}.fa-evernote{--fa:"\f839"}.fa-hacker-news{--fa:"\f1d4"}.fa-creative-commons-sampling{--fa:"\f4f0"}.fa-adversal{--fa:"\f36a"}.fa-creative-commons{--fa:"\f25e"}.fa-watchman-monitoring{--fa:"\e087"}.fa-fonticons{--fa:"\f280"}.fa-weixin{--fa:"\f1d7"}.fa-shirtsinbulk{--fa:"\f214"}.fa-codepen{--fa:"\f1cb"}.fa-git-alt{--fa:"\f841"}.fa-lyft{--fa:"\f3c3"}.fa-rev{--fa:"\f5b2"}.fa-windows{--fa:"\f17a"}.fa-wizards-of-the-coast{--fa:"\f730"}.fa-square-viadeo,.fa-viadeo-square{--fa:"\f2aa"}.fa-meetup{--fa:"\f2e0"}.fa-centos{--fa:"\f789"}.fa-adn{--fa:"\f170"}.fa-cloudsmith{--fa:"\f384"}.fa-opensuse{--fa:"\e62b"}.fa-pied-piper-alt{--fa:"\f1a8"}.fa-dribbble-square,.fa-square-dribbble{--fa:"\f397"}.fa-codiepie{--fa:"\f284"}.fa-node{--fa:"\f419"}.fa-mix{--fa:"\f3cb"}.fa-steam{--fa:"\f1b6"}.fa-cc-apple-pay{--fa:"\f416"}.fa-scribd{--fa:"\f28a"}.fa-debian{--fa:"\e60b"}.fa-openid{--fa:"\f19b"}.fa-instalod{--fa:"\e081"}.fa-files-pinwheel{--fa:"\e69f"}.fa-expeditedssl{--fa:"\f23e"}.fa-sellcast{--fa:"\f2da"}.fa-square-twitter,.fa-twitter-square{--fa:"\f081"}.fa-r-project{--fa:"\f4f7"}.fa-delicious{--fa:"\f1a5"}.fa-freebsd{--fa:"\f3a4"}.fa-vuejs{--fa:"\f41f"}.fa-accusoft{--fa:"\f369"}.fa-ioxhost{--fa:"\f208"}.fa-fonticons-fi{--fa:"\f3a2"}.fa-app-store{--fa:"\f36f"}.fa-cc-mastercard{--fa:"\f1f1"}.fa-itunes-note{--fa:"\f3b5"}.fa-golang{--fa:"\e40f"}.fa-kickstarter,.fa-square-kickstarter{--fa:"\f3bb"}.fa-grav{--fa:"\f2d6"}.fa-weibo{--fa:"\f18a"}.fa-uncharted{--fa:"\e084"}.fa-firstdraft{--fa:"\f3a1"}.fa-square-youtube,.fa-youtube-square{--fa:"\f431"}.fa-wikipedia-w{--fa:"\f266"}.fa-rendact,.fa-wpressr{--fa:"\f3e4"}.fa-angellist{--fa:"\f209"}.fa-galactic-republic{--fa:"\f50c"}.fa-nfc-directional{--fa:"\e530"}.fa-skype{--fa:"\f17e"}.fa-joget{--fa:"\f3b7"}.fa-fedora{--fa:"\f798"}.fa-stripe-s{--fa:"\f42a"}.fa-meta{--fa:"\e49b"}.fa-laravel{--fa:"\f3bd"}.fa-hotjar{--fa:"\f3b1"}.fa-bluetooth-b{--fa:"\f294"}.fa-square-letterboxd{--fa:"\e62e"}.fa-sticker-mule{--fa:"\f3f7"}.fa-creative-commons-zero{--fa:"\f4f3"}.fa-hips{--fa:"\f452"}.fa-css{--fa:"\e6a2"}.fa-behance{--fa:"\f1b4"}.fa-reddit{--fa:"\f1a1"}.fa-discord{--fa:"\f392"}.fa-chrome{--fa:"\f268"}.fa-app-store-ios{--fa:"\f370"}.fa-cc-discover{--fa:"\f1f2"}.fa-wpbeginner{--fa:"\f297"}.fa-confluence{--fa:"\f78d"}.fa-shoelace{--fa:"\e60c"}.fa-mdb{--fa:"\f8ca"}.fa-dochub{--fa:"\f394"}.fa-accessible-icon{--fa:"\f368"}.fa-ebay{--fa:"\f4f4"}.fa-amazon{--fa:"\f270"}.fa-unsplash{--fa:"\e07c"}.fa-yarn{--fa:"\f7e3"}.fa-square-steam,.fa-steam-square{--fa:"\f1b7"}.fa-500px{--fa:"\f26e"}.fa-square-vimeo,.fa-vimeo-square{--fa:"\f194"}.fa-asymmetrik{--fa:"\f372"}.fa-font-awesome,.fa-font-awesome-flag,.fa-font-awesome-logo-full{--fa:"\f2b4"}.fa-gratipay{--fa:"\f184"}.fa-apple{--fa:"\f179"}.fa-hive{--fa:"\e07f"}.fa-gitkraken{--fa:"\f3a6"}.fa-keybase{--fa:"\f4f5"}.fa-apple-pay{--fa:"\f415"}.fa-padlet{--fa:"\e4a0"}.fa-amazon-pay{--fa:"\f42c"}.fa-github-square,.fa-square-github{--fa:"\f092"}.fa-stumbleupon{--fa:"\f1a4"}.fa-fedex{--fa:"\f797"}.fa-phoenix-framework{--fa:"\f3dc"}.fa-shopify{--fa:"\e057"}.fa-neos{--fa:"\f612"}.fa-square-threads{--fa:"\e619"}.fa-hackerrank{--fa:"\f5f7"}.fa-researchgate{--fa:"\f4f8"}.fa-swift{--fa:"\f8e1"}.fa-angular{--fa:"\f420"}.fa-speakap{--fa:"\f3f3"}.fa-angrycreative{--fa:"\f36e"}.fa-y-combinator{--fa:"\f23b"}.fa-empire{--fa:"\f1d1"}.fa-envira{--fa:"\f299"}.fa-google-scholar{--fa:"\e63b"}.fa-gitlab-square,.fa-square-gitlab{--fa:"\e5ae"}.fa-studiovinari{--fa:"\f3f8"}.fa-pied-piper{--fa:"\f2ae"}.fa-wordpress{--fa:"\f19a"}.fa-product-hunt{--fa:"\f288"}.fa-firefox{--fa:"\f269"}.fa-linode{--fa:"\f2b8"}.fa-goodreads{--fa:"\f3a8"}.fa-odnoklassniki-square,.fa-square-odnoklassniki{--fa:"\f264"}.fa-jsfiddle{--fa:"\f1cc"}.fa-sith{--fa:"\f512"}.fa-themeisle{--fa:"\f2b2"}.fa-page4{--fa:"\f3d7"}.fa-hashnode{--fa:"\e499"}.fa-react{--fa:"\f41b"}.fa-cc-paypal{--fa:"\f1f4"}.fa-squarespace{--fa:"\f5be"}.fa-cc-stripe{--fa:"\f1f5"}.fa-creative-commons-share{--fa:"\f4f2"}.fa-bitcoin{--fa:"\f379"}.fa-keycdn{--fa:"\f3ba"}.fa-opera{--fa:"\f26a"}.fa-itch-io{--fa:"\f83a"}.fa-umbraco{--fa:"\f8e8"}.fa-galactic-senate{--fa:"\f50d"}.fa-ubuntu{--fa:"\f7df"}.fa-draft2digital{--fa:"\f396"}.fa-stripe{--fa:"\f429"}.fa-houzz{--fa:"\f27c"}.fa-gg{--fa:"\f260"}.fa-dhl{--fa:"\f790"}.fa-pinterest-square,.fa-square-pinterest{--fa:"\f0d3"}.fa-xing{--fa:"\f168"}.fa-blackberry{--fa:"\f37b"}.fa-creative-commons-pd{--fa:"\f4ec"}.fa-playstation{--fa:"\f3df"}.fa-quinscape{--fa:"\f459"}.fa-less{--fa:"\f41d"}.fa-blogger-b{--fa:"\f37d"}.fa-opencart{--fa:"\f23d"}.fa-vine{--fa:"\f1ca"}.fa-signal-messenger{--fa:"\e663"}.fa-paypal{--fa:"\f1ed"}.fa-gitlab{--fa:"\f296"}.fa-typo3{--fa:"\f42b"}.fa-reddit-alien{--fa:"\f281"}.fa-yahoo{--fa:"\f19e"}.fa-dailymotion{--fa:"\e052"}.fa-affiliatetheme{--fa:"\f36b"}.fa-pied-piper-pp{--fa:"\f1a7"}.fa-bootstrap{--fa:"\f836"}.fa-odnoklassniki{--fa:"\f263"}.fa-nfc-symbol{--fa:"\e531"}.fa-mintbit{--fa:"\e62f"}.fa-ethereum{--fa:"\f42e"}.fa-speaker-deck{--fa:"\f83c"}.fa-creative-commons-nc-eu{--fa:"\f4e9"}.fa-patreon{--fa:"\f3d9"}.fa-avianex{--fa:"\f374"}.fa-ello{--fa:"\f5f1"}.fa-gofore{--fa:"\f3a7"}.fa-bimobject{--fa:"\f378"}.fa-brave-reverse{--fa:"\e63d"}.fa-facebook-f{--fa:"\f39e"}.fa-google-plus-square,.fa-square-google-plus{--fa:"\f0d4"}.fa-web-awesome{--fa:"\e682"}.fa-mandalorian{--fa:"\f50f"}.fa-first-order-alt{--fa:"\f50a"}.fa-osi{--fa:"\f41a"}.fa-google-wallet{--fa:"\f1ee"}.fa-d-and-d-beyond{--fa:"\f6ca"}.fa-periscope{--fa:"\f3da"}.fa-fulcrum{--fa:"\f50b"}.fa-cloudscale{--fa:"\f383"}.fa-forumbee{--fa:"\f211"}.fa-mizuni{--fa:"\f3cc"}.fa-schlix{--fa:"\f3ea"}.fa-square-xing,.fa-xing-square{--fa:"\f169"}.fa-bandcamp{--fa:"\f2d5"}.fa-wpforms{--fa:"\f298"}.fa-cloudversify{--fa:"\f385"}.fa-usps{--fa:"\f7e1"}.fa-megaport{--fa:"\f5a3"}.fa-magento{--fa:"\f3c4"}.fa-spotify{--fa:"\f1bc"}.fa-optin-monster{--fa:"\f23c"}.fa-fly{--fa:"\f417"}.fa-square-bluesky{--fa:"\e6a3"}.fa-aviato{--fa:"\f421"}.fa-itunes{--fa:"\f3b4"}.fa-cuttlefish{--fa:"\f38c"}.fa-blogger{--fa:"\f37c"}.fa-flickr{--fa:"\f16e"}.fa-viber{--fa:"\f409"}.fa-soundcloud{--fa:"\f1be"}.fa-digg{--fa:"\f1a6"}.fa-tencent-weibo{--fa:"\f1d5"}.fa-letterboxd{--fa:"\e62d"}.fa-symfony{--fa:"\f83d"}.fa-maxcdn{--fa:"\f136"}.fa-etsy{--fa:"\f2d7"}.fa-facebook-messenger{--fa:"\f39f"}.fa-audible{--fa:"\f373"}.fa-think-peaks{--fa:"\f731"}.fa-bilibili{--fa:"\e3d9"}.fa-erlang{--fa:"\f39d"}.fa-x-twitter{--fa:"\e61b"}.fa-cotton-bureau{--fa:"\f89e"}.fa-dashcube{--fa:"\f210"}.fa-42-group,.fa-innosoft{--fa:"\e080"}.fa-stack-exchange{--fa:"\f18d"}.fa-elementor{--fa:"\f430"}.fa-pied-piper-square,.fa-square-pied-piper{--fa:"\e01e"}.fa-creative-commons-nd{--fa:"\f4eb"}.fa-palfed{--fa:"\f3d8"}.fa-superpowers{--fa:"\f2dd"}.fa-resolving{--fa:"\f3e7"}.fa-xbox{--fa:"\f412"}.fa-square-web-awesome-stroke{--fa:"\e684"}.fa-searchengin{--fa:"\f3eb"}.fa-tiktok{--fa:"\e07b"}.fa-facebook-square,.fa-square-facebook{--fa:"\f082"}.fa-renren{--fa:"\f18b"}.fa-linux{--fa:"\f17c"}.fa-glide{--fa:"\f2a5"}.fa-linkedin{--fa:"\f08c"}.fa-hubspot{--fa:"\f3b2"}.fa-deploydog{--fa:"\f38e"}.fa-twitch{--fa:"\f1e8"}.fa-flutter{--fa:"\e694"}.fa-ravelry{--fa:"\f2d9"}.fa-mixer{--fa:"\e056"}.fa-lastfm-square,.fa-square-lastfm{--fa:"\f203"}.fa-vimeo{--fa:"\f40a"}.fa-mendeley{--fa:"\f7b3"}.fa-uniregistry{--fa:"\f404"}.fa-figma{--fa:"\f799"}.fa-creative-commons-remix{--fa:"\f4ee"}.fa-cc-amazon-pay{--fa:"\f42d"}.fa-dropbox{--fa:"\f16b"}.fa-instagram{--fa:"\f16d"}.fa-cmplid{--fa:"\e360"}.fa-upwork{--fa:"\e641"}.fa-facebook{--fa:"\f09a"}.fa-gripfire{--fa:"\f3ac"}.fa-jedi-order{--fa:"\f50e"}.fa-uikit{--fa:"\f403"}.fa-fort-awesome-alt{--fa:"\f3a3"}.fa-phabricator{--fa:"\f3db"}.fa-ussunnah{--fa:"\f407"}.fa-earlybirds{--fa:"\f39a"}.fa-trade-federation{--fa:"\f513"}.fa-autoprefixer{--fa:"\f41c"}.fa-whatsapp{--fa:"\f232"}.fa-square-upwork{--fa:"\e67c"}.fa-slideshare{--fa:"\f1e7"}.fa-google-play{--fa:"\f3ab"}.fa-viadeo{--fa:"\f2a9"}.fa-line{--fa:"\f3c0"}.fa-google-drive{--fa:"\f3aa"}.fa-servicestack{--fa:"\f3ec"}.fa-simplybuilt{--fa:"\f215"}.fa-bitbucket{--fa:"\f171"}.fa-imdb{--fa:"\f2d8"}.fa-deezer{--fa:"\e077"}.fa-raspberry-pi{--fa:"\f7bb"}.fa-jira{--fa:"\f7b1"}.fa-docker{--fa:"\f395"}.fa-screenpal{--fa:"\e570"}.fa-bluetooth{--fa:"\f293"}.fa-gitter{--fa:"\f426"}.fa-d-and-d{--fa:"\f38d"}.fa-microblog{--fa:"\e01a"}.fa-cc-diners-club{--fa:"\f24c"}.fa-gg-circle{--fa:"\f261"}.fa-pied-piper-hat{--fa:"\f4e5"}.fa-kickstarter-k{--fa:"\f3bc"}.fa-yandex{--fa:"\f413"}.fa-readme{--fa:"\f4d5"}.fa-html5{--fa:"\f13b"}.fa-sellsy{--fa:"\f213"}.fa-square-web-awesome{--fa:"\e683"}.fa-sass{--fa:"\f41e"}.fa-wirsindhandwerk,.fa-wsh{--fa:"\e2d0"}.fa-buromobelexperte{--fa:"\f37f"}.fa-salesforce{--fa:"\f83b"}.fa-octopus-deploy{--fa:"\e082"}.fa-medapps{--fa:"\f3c6"}.fa-ns8{--fa:"\f3d5"}.fa-pinterest-p{--fa:"\f231"}.fa-apper{--fa:"\f371"}.fa-fort-awesome{--fa:"\f286"}.fa-waze{--fa:"\f83f"}.fa-bluesky{--fa:"\e671"}.fa-cc-jcb{--fa:"\f24b"}.fa-snapchat,.fa-snapchat-ghost{--fa:"\f2ab"}.fa-fantasy-flight-games{--fa:"\f6dc"}.fa-rust{--fa:"\e07a"}.fa-wix{--fa:"\f5cf"}.fa-behance-square,.fa-square-behance{--fa:"\f1b5"}.fa-supple{--fa:"\f3f9"}.fa-webflow{--fa:"\e65c"}.fa-rebel{--fa:"\f1d0"}.fa-css3{--fa:"\f13c"}.fa-staylinked{--fa:"\f3f5"}.fa-kaggle{--fa:"\f5fa"}.fa-space-awesome{--fa:"\e5ac"}.fa-deviantart{--fa:"\f1bd"}.fa-cpanel{--fa:"\f388"}.fa-goodreads-g{--fa:"\f3a9"}.fa-git-square,.fa-square-git{--fa:"\f1d2"}.fa-square-tumblr,.fa-tumblr-square{--fa:"\f174"}.fa-trello{--fa:"\f181"}.fa-creative-commons-nc-jp{--fa:"\f4ea"}.fa-get-pocket{--fa:"\f265"}.fa-perbyte{--fa:"\e083"}.fa-grunt{--fa:"\f3ad"}.fa-weebly{--fa:"\f5cc"}.fa-connectdevelop{--fa:"\f20e"}.fa-leanpub{--fa:"\f212"}.fa-black-tie{--fa:"\f27e"}.fa-themeco{--fa:"\f5c6"}.fa-python{--fa:"\f3e2"}.fa-android{--fa:"\f17b"}.fa-bots{--fa:"\e340"}.fa-free-code-camp{--fa:"\f2c5"}.fa-hornbill{--fa:"\f592"}.fa-js{--fa:"\f3b8"}.fa-ideal{--fa:"\e013"}.fa-git{--fa:"\f1d3"}.fa-dev{--fa:"\f6cc"}.fa-sketch{--fa:"\f7c6"}.fa-yandex-international{--fa:"\f414"}.fa-cc-amex{--fa:"\f1f3"}.fa-uber{--fa:"\f402"}.fa-github{--fa:"\f09b"}.fa-php{--fa:"\f457"}.fa-alipay{--fa:"\f642"}.fa-youtube{--fa:"\f167"}.fa-skyatlas{--fa:"\f216"}.fa-firefox-browser{--fa:"\e007"}.fa-replyd{--fa:"\f3e6"}.fa-suse{--fa:"\f7d6"}.fa-jenkins{--fa:"\f3b6"}.fa-twitter{--fa:"\f099"}.fa-rockrms{--fa:"\f3e9"}.fa-pinterest{--fa:"\f0d2"}.fa-buffer{--fa:"\f837"}.fa-npm{--fa:"\f3d4"}.fa-yammer{--fa:"\f840"}.fa-btc{--fa:"\f15a"}.fa-dribbble{--fa:"\f17d"}.fa-stumbleupon-circle{--fa:"\f1a3"}.fa-internet-explorer{--fa:"\f26b"}.fa-stubber{--fa:"\e5c7"}.fa-telegram,.fa-telegram-plane{--fa:"\f2c6"}.fa-old-republic{--fa:"\f510"}.fa-odysee{--fa:"\e5c6"}.fa-square-whatsapp,.fa-whatsapp-square{--fa:"\f40c"}.fa-node-js{--fa:"\f3d3"}.fa-edge-legacy{--fa:"\e078"}.fa-slack,.fa-slack-hash{--fa:"\f198"}.fa-medrt{--fa:"\f3c8"}.fa-usb{--fa:"\f287"}.fa-tumblr{--fa:"\f173"}.fa-vaadin{--fa:"\f408"}.fa-quora{--fa:"\f2c4"}.fa-square-x-twitter{--fa:"\e61a"}.fa-reacteurope{--fa:"\f75d"}.fa-medium,.fa-medium-m{--fa:"\f23a"}.fa-amilia{--fa:"\f36d"}.fa-mixcloud{--fa:"\f289"}.fa-flipboard{--fa:"\f44d"}.fa-viacoin{--fa:"\f237"}.fa-critical-role{--fa:"\f6c9"}.fa-sitrox{--fa:"\e44a"}.fa-discourse{--fa:"\f393"}.fa-joomla{--fa:"\f1aa"}.fa-mastodon{--fa:"\f4f6"}.fa-airbnb{--fa:"\f834"}.fa-wolf-pack-battalion{--fa:"\f514"}.fa-buy-n-large{--fa:"\f8a6"}.fa-gulp{--fa:"\f3ae"}.fa-creative-commons-sampling-plus{--fa:"\f4f1"}.fa-strava{--fa:"\f428"}.fa-ember{--fa:"\f423"}.fa-canadian-maple-leaf{--fa:"\f785"}.fa-teamspeak{--fa:"\f4f9"}.fa-pushed{--fa:"\f3e1"}.fa-wordpress-simple{--fa:"\f411"}.fa-nutritionix{--fa:"\f3d6"}.fa-wodu{--fa:"\e088"}.fa-google-pay{--fa:"\e079"}.fa-intercom{--fa:"\f7af"}.fa-zhihu{--fa:"\f63f"}.fa-korvue{--fa:"\f42f"}.fa-pix{--fa:"\e43a"}.fa-steam-symbol{--fa:"\f3f6"}:host,:root{--fa-font-regular:normal 400 1em/1 "Font Awesome 6 Free"}@font-face{font-family:"Font Awesome 6 Free";font-style:normal;font-weight:400;font-display:block;src:url(/static/media/fa-regular-400.89999bdf5d835c012025.woff2) format("woff2"),url(/static/media/fa-regular-400.914997e1bdfc990d0897.ttf) format("truetype")}.fa-regular,.far{font-weight:400}:host,:root{--fa-style-family-classic:"Font Awesome 6 Free";--fa-font-solid:normal 900 1em/1 "Font Awesome 6 Free"}@font-face{font-family:"Font Awesome 6 Free";font-style:normal;font-weight:900;font-display:block;src:url(/static/media/fa-solid-900.2463b90d9a316e4e5294.woff2) format("woff2"),url(/static/media/fa-solid-900.2582b0e4bcf85eceead0.ttf) format("truetype")}.fa-solid,.fas{font-weight:900}@font-face{font-family:"Font Awesome 5 Brands";font-display:block;font-weight:400;src:url(/static/media/fa-brands-400.c210719e60948b211a12.woff2) format("woff2"),url(/static/media/fa-brands-400.1815e00441357e01619e.ttf) format("truetype")}@font-face{font-family:"Font Awesome 5 Free";font-display:block;font-weight:900;src:url(/static/media/fa-solid-900.2463b90d9a316e4e5294.woff2) format("woff2"),url(/static/media/fa-solid-900.2582b0e4bcf85eceead0.ttf) format("truetype")}@font-face{font-family:"Font Awesome 5 Free";font-display:block;font-weight:400;src:url(/static/media/fa-regular-400.89999bdf5d835c012025.woff2) format("woff2"),url(/static/media/fa-regular-400.914997e1bdfc990d0897.ttf) format("truetype")}@font-face{font-family:"FontAwesome";font-display:block;src:url(/static/media/fa-solid-900.2463b90d9a316e4e5294.woff2) format("woff2"),url(/static/media/fa-solid-900.2582b0e4bcf85eceead0.ttf) format("truetype")}@font-face{font-family:"FontAwesome";font-display:block;src:url(/static/media/fa-brands-400.c210719e60948b211a12.woff2) format("woff2"),url(/static/media/fa-brands-400.1815e00441357e01619e.ttf) format("truetype")}@font-face{font-family:"FontAwesome";font-display:block;src:url(/static/media/fa-regular-400.89999bdf5d835c012025.woff2) format("woff2"),url(/static/media/fa-regular-400.914997e1bdfc990d0897.ttf) format("truetype");unicode-range:u+f003,u+f006,u+f014,u+f016-f017,u+f01a-f01b,u+f01d,u+f022,u+f03e,u+f044,u+f046,u+f05c-f05d,u+f06e,u+f070,u+f087-f088,u+f08a,u+f094,u+f096-f097,u+f09d,u+f0a0,u+f0a2,u+f0a4-f0a7,u+f0c5,u+f0c7,u+f0e5-f0e6,u+f0eb,u+f0f6-f0f8,u+f10c,u+f114-f115,u+f118-f11a,u+f11c-f11d,u+f133,u+f147,u+f14e,u+f150-f152,u+f185-f186,u+f18e,u+f190-f192,u+f196,u+f1c1-f1c9,u+f1d9,u+f1db,u+f1e3,u+f1ea,u+f1f7,u+f1f9,u+f20a,u+f247-f248,u+f24a,u+f24d,u+f255-f25b,u+f25d,u+f271-f274,u+f278,u+f27b,u+f28c,u+f28e,u+f29c,u+f2b5,u+f2b7,u+f2ba,u+f2bc,u+f2be,u+f2c0-f2c1,u+f2c3,u+f2d0,u+f2d2,u+f2d4,u+f2dc}@font-face{font-family:"FontAwesome";font-display:block;src:url(/static/media/fa-v4compatibility.ea8f94e1d22e0d35ccd4.woff2) format("woff2"),url(/static/media/fa-v4compatibility.da94ef451f4969af06e6.ttf) format("truetype");unicode-range:u+f041,u+f047,u+f065-f066,u+f07d-f07e,u+f080,u+f08b,u+f08e,u+f090,u+f09a,u+f0ac,u+f0ae,u+f0b2,u+f0d0,u+f0d6,u+f0e4,u+f0ec,u+f10a-f10b,u+f123,u+f13e,u+f148-f149,u+f14c,u+f156,u+f15e,u+f160-f161,u+f163,u+f175-f178,u+f195,u+f1f8,u+f219,u+f27a}
/* .App {
  text-align: center;
}

.App-logo {
  height: 40vmin;
  pointer-events: none;
}

@media (prefers-reduced-motion: no-preference) {
  .App-logo {
    animation: App-logo-spin infinite 20s linear;
  }
}

.App-header {
  background-color: #282c34;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: calc(10px + 2vmin);
  color: white;
}

.App-link {
  color: #0C447E;
}

@keyframes App-logo-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
} */
/* Applique le padding seulement quand le Header est présent */
body > div:has(> header.header-main) > *:not(header) {
  padding-top: 140px; /* Desktop */
}

@media (max-width: 768px) {
  body > div:has(> header.header-main) > *:not(header) {
    padding-top: 100px; /* Mobile */
  }
}
/* Styles pour le loader circulaire */
.circular-loader-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 60vh;
    width: 100%;
  }
  
  .circular-loader {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  
  .loader-circle {
    width: 80px;
    height: 80px;
    border: 8px solid  #f3f4f6;;
    border-top: 8px solid #0F447E;
    border-radius: 50%;
    animation: spin 1.5s linear infinite;
    margin-bottom: 1rem;
  }
  
  .loader-text {
    color:  #0F447E;
    font-size: 1.1rem;
    font-weight: 500;
    text-align: center;
  }
  
  @keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
  }
  
  /* Styles existants pour le loading et error */
  .loading {
    text-align: center;
    padding: 2rem;
    font-size: 1.2rem;
    color:  #0F447E;
  }
  
  
  /* Media queries pour le responsive */
  @media (max-width: 768px) {
    .loader-circle {
      width: 60px;
      height: 60px;
      border-width: 6px;
    }
    
    .loader-text {
      font-size: 1rem;
    }
  }
  
  @media (max-width: 480px) {
    .loader-circle {
      width: 50px;
      height: 50px;
      border-width: 5px;
    }
    
    .loader-text {
      font-size: 0.9rem;
    }
  }
.loader-wrapper {
  height: 100vh;
  width: 100vw;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  background: white; /* blank page */
}

.dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.2); 
  animation: fade 1.4s infinite ease-in-out both;
}

.dot:nth-child(2) {
  animation-delay: 0.2s;
}

.dot:nth-child(3) {
  animation-delay: 0.4s;
}

@keyframes fade {
  0%, 80%, 100% {
    opacity: 0.2;
  }
  40% {
    opacity: 1;
  }
}

/* PopupAbonnement.css */

.PopupAbonnement-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  padding: 20px;
  animation: PopupAbonnement-fadeIn 0.3s ease-out;
}

@keyframes PopupAbonnement-fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.PopupAbonnement-container {
  background: white;
  border-radius: 24px;
  max-width: 500px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  position: relative;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
  animation: PopupAbonnement-slideUp 0.3s ease-out;
}

@keyframes PopupAbonnement-slideUp {
  from {
    transform: translateY(30px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

.PopupAbonnement-close {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 40px;
  height: 40px;
  border: none;
  background: #ffffff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  z-index: 1001;
}

.PopupAbonnement-close:hover {
  background: #E30613;
  transform: scale(1.1);
}

.PopupAbonnement-header {
  text-align: center;
  padding: 40px 32px 32px;
  background: linear-gradient(135deg, #f8f9ff 0%, #e8f2ff 100%);
  border-radius: 24px 24px 0 0;
}

.PopupAbonnement-icon {
  margin-bottom: 20px;
  display: flex;
  justify-content: center;
}

.PopupAbonnement-title {
  font-size: 28px;
  font-weight: 700;
  color: #0C447E;
  margin: 0 0 16px 0;
  line-height: 1.2;
}

.PopupAbonnement-subtitle {
  font-size: 16px;
  color: #666;
  line-height: 1.5;
  margin: 0;
  max-width: 400px;
  margin-left: auto;
  margin-right: auto;
}

.PopupAbonnement-plans {
  padding: 32px;
  display: flex;
  gap: 20px;
  flex-direction: column;
}

.PopupAbonnement-plan {
  border: 2px solid #e0e7ff;
  border-radius: 16px;
  padding: 24px;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  background: white;
}

.PopupAbonnement-plan:hover {
  border-color: #0C447E;
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(12, 68, 126, 0.15);
}

.PopupAbonnement-plan-selected {
  border-color: #0C447E;
  background: rgba(12, 68, 126, 0.02);
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(12, 68, 126, 0.15);
}

.PopupAbonnement-plan-popular {
  background: linear-gradient(135deg, #0C447E 0%, #1e5a9e 100%);
  border-color: #0C447E;
  color: white;
}

.PopupAbonnement-plan-popular .PopupAbonnement-feature {
  color: white;
}

.PopupAbonnement-popular-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: #E30613;
  color: white;
  padding: 6px 16px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.PopupAbonnement-plan-header {
  margin-bottom: 16px;
}

.PopupAbonnement-plan-name {
  font-size: 16px;
  font-weight: 700;
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #0C447E;
}

.PopupAbonnement-plan-popular .PopupAbonnement-plan-name {
  color: white;
}

.PopupAbonnement-price {
  margin-bottom: 20px;
  display: flex;
  align-items: baseline;
  gap: 4px;
}

.PopupAbonnement-amount {
  font-size: 36px;
  font-weight: 800;
  color: #0C447E;
}

.PopupAbonnement-plan-popular .PopupAbonnement-amount {
  color: white;
}

.PopupAbonnement-currency {
  font-size: 18px;
  font-weight: 600;
  color: #0C447E;
}

.PopupAbonnement-plan-popular .PopupAbonnement-currency {
  color: white;
}

.PopupAbonnement-features {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.PopupAbonnement-feature {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #666;
  font-weight: 500;
}

.PopupAbonnement-actions {
  padding: 0 32px 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.PopupAbonnement-btn {
  width: 100%;
  padding: 16px 24px;
  border: none;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.PopupAbonnement-btn::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transition: left 0.5s;
}

.PopupAbonnement-btn:hover::before {
  left: 100%;
}

.PopupAbonnement-btn-week {
  background: linear-gradient(135deg, #f8f9ff 0%, #e8f2ff 100%);
  color: #0C447E;
  border: 2px solid #0C447E;
}

.PopupAbonnement-btn-week:hover {
  background: #0C447E;
  color: white;
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(12, 68, 126, 0.3);
}

.PopupAbonnement-btn-month {
  background: linear-gradient(135deg, #0C447E 0%, #1e5a9e 100%);
  color: white;
  box-shadow: 0 4px 15px rgba(12, 68, 126, 0.3);
}

.PopupAbonnement-btn-month:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(12, 68, 126, 0.4);
}

.PopupAbonnement-footer {
  text-align: center;
  padding: 0 32px 32px;
  color: #666;
  font-size: 14px;
}

.PopupAbonnement-link {
  color: #0C447E;
  text-decoration: none;
  font-weight: 600;
}

.PopupAbonnement-link:hover {
  text-decoration: underline;
}

/* Responsive Design */

/* Mobile Portrait - Très petit écran */
@media (max-width: 360px) {
  .PopupAbonnement-overlay {
    padding: 8px;
    align-items: flex-start;
    padding-top: 20px;
  }

  .PopupAbonnement-container {
    border-radius: 16px;
    max-height: calc(100vh - 40px);
    width: 100%;
  }

  .PopupAbonnement-close {
    top: 12px;
    right: 12px;
    width: 32px;
    height: 32px;
  }

  .PopupAbonnement-header {
    padding: 20px 16px 16px;
    border-radius: 16px 16px 0 0;
  }

  .PopupAbonnement-title {
    font-size: 20px;
  }

  .PopupAbonnement-subtitle {
    font-size: 13px;
  }

  .PopupAbonnement-plans {
    padding: 16px;
    gap: 12px;
  }

  .PopupAbonnement-plan {
    padding: 14px;
    border-radius: 12px;
  }

  .PopupAbonnement-amount {
    font-size: 24px;
  }

  .PopupAbonnement-currency {
    font-size: 14px;
  }

  .PopupAbonnement-plan-name {
    font-size: 14px;
  }

  .PopupAbonnement-feature {
    font-size: 12px;
  }

  .PopupAbonnement-actions {
    padding: 0 16px 16px;
    gap: 8px;
  }

  .PopupAbonnement-btn {
    padding: 12px 16px;
    font-size: 11px;
    border-radius: 8px;
  }

  .PopupAbonnement-footer {
    padding: 0 16px 16px;
    font-size: 12px;
  }

  .PopupAbonnement-popular-badge {
    font-size: 10px;
    padding: 4px 12px;
  }
}

/* Mobile Portrait */
@media (min-width: 361px) and (max-width: 480px) {
  .PopupAbonnement-overlay {
    padding: 12px;
    align-items: flex-start;
    padding-top: 30px;
  }

  .PopupAbonnement-container {
    border-radius: 18px;
    max-height: calc(100vh - 60px);
  }

  .PopupAbonnement-header {
    padding: 24px 20px 20px;
    border-radius: 18px 18px 0 0;
  }

  .PopupAbonnement-title {
    font-size: 22px;
  }

  .PopupAbonnement-subtitle {
    font-size: 14px;
  }

  .PopupAbonnement-plans {
    padding: 20px;
    gap: 14px;
  }

  .PopupAbonnement-plan {
    padding: 16px;
    border-radius: 14px;
  }

  .PopupAbonnement-amount {
    font-size: 28px;
  }

  .PopupAbonnement-currency {
    font-size: 16px;
  }

  .PopupAbonnement-actions {
    padding: 0 20px 20px;
    gap: 10px;
  }

  .PopupAbonnement-btn {
    padding: 14px 18px;
    font-size: 12px;
    border-radius: 10px;
  }

  .PopupAbonnement-footer {
    padding: 0 20px 20px;
    font-size: 13px;
  }
}

/* Mobile Landscape & Petites tablettes */
@media (min-width: 481px) and (max-width: 768px) {
  .PopupAbonnement-overlay {
    padding: 16px;
  }

  .PopupAbonnement-container {
    border-radius: 20px;
    max-height: 90vh;
    max-width: 450px;
  }

  .PopupAbonnement-header {
    padding: 32px 24px 24px;
    border-radius: 20px 20px 0 0;
  }

  .PopupAbonnement-title {
    font-size: 24px;
  }

  .PopupAbonnement-subtitle {
    font-size: 15px;
  }

  .PopupAbonnement-plans {
    padding: 24px;
    gap: 16px;
  }

  .PopupAbonnement-plan {
    padding: 20px;
  }

  .PopupAbonnement-amount {
    font-size: 32px;
  }

  .PopupAbonnement-actions {
    padding: 0 24px 24px;
    gap: 12px;
  }

  .PopupAbonnement-btn {
    padding: 14px 20px;
    font-size: 13px;
  }

  .PopupAbonnement-footer {
    padding: 0 24px 24px;
  }
}

/* Tablettes */
@media (min-width: 769px) and (max-width: 1024px) {
  .PopupAbonnement-container {
    max-width: 600px;
  }

  .PopupAbonnement-plans {
    flex-direction: row;
    gap: 20px;
  }

  .PopupAbonnement-plan {
    flex: 1 1;
    min-height: 200px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .PopupAbonnement-actions {
    flex-direction: row;
    gap: 16px;
  }

  .PopupAbonnement-btn {
    flex: 1 1;
    padding: 16px 20px;
  }

  .PopupAbonnement-popular-badge {
    font-size: 11px;
  }
}

/* Desktop */
@media (min-width: 1025px) {
  .PopupAbonnement-container {
    max-width: 550px;
  }

  .PopupAbonnement-plans {
    flex-direction: row;
    gap: 24px;
  }

  .PopupAbonnement-plan {
    flex: 1 1;
    min-height: 220px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .PopupAbonnement-plan:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 35px rgba(12, 68, 126, 0.2);
  }

  .PopupAbonnement-actions {
    flex-direction: row;
    gap: 20px;
  }

  .PopupAbonnement-btn {
    flex: 1 1;
    padding: 18px 24px;
    font-size: 14px;
  }

  .PopupAbonnement-btn:hover {
    transform: translateY(-2px);
  }
}

/* Très grand écran */
@media (min-width: 1440px) {
  .PopupAbonnement-container {
    max-width: 600px;
  }

  .PopupAbonnement-header {
    padding: 50px 40px 40px;
  }

  .PopupAbonnement-title {
    font-size: 32px;
  }

  .PopupAbonnement-subtitle {
    font-size: 18px;
  }

  .PopupAbonnement-plans {
    padding: 40px;
  }

  .PopupAbonnement-plan {
    padding: 30px;
    min-height: 240px;
  }

  .PopupAbonnement-amount {
    font-size: 42px;
  }

  .PopupAbonnement-currency {
    font-size: 20px;
  }

  .PopupAbonnement-actions {
    padding: 0 40px 40px;
  }

  .PopupAbonnement-footer {
    padding: 0 40px 40px;
    font-size: 16px;
  }
}

/* Orientation Portrait spécifique */
@media (orientation: portrait) and (max-height: 600px) {
  .PopupAbonnement-overlay {
    align-items: flex-start;
    padding-top: 10px;
  }

  .PopupAbonnement-container {
    max-height: calc(100vh - 20px);
  }

  .PopupAbonnement-header {
    padding: 20px 24px 16px;
  }

  .PopupAbonnement-title {
    font-size: 20px;
  }

  .PopupAbonnement-plans {
    padding: 16px 24px;
  }

  .PopupAbonnement-actions {
    padding: 0 24px 16px;
  }

  .PopupAbonnement-footer {
    padding: 0 24px 16px;
  }
}

/* Orientation Landscape sur mobile */
@media (orientation: landscape) and (max-height: 500px) {
  .PopupAbonnement-overlay {
    align-items: flex-start;
    padding: 8px;
  }

  .PopupAbonnement-container {
    max-height: calc(100vh - 16px);
    max-width: 90vw;
  }

  .PopupAbonnement-plans {
    flex-direction: row;
    gap: 16px;
  }

  .PopupAbonnement-plan {
    flex: 1 1;
    padding: 16px;
  }

  .PopupAbonnement-header {
    padding: 16px 24px 12px;
  }

  .PopupAbonnement-title {
    font-size: 20px;
  }

  .PopupAbonnement-subtitle {
    font-size: 13px;
  }

  .PopupAbonnement-actions {
    flex-direction: row;
    gap: 12px;
  }

  .PopupAbonnement-btn {
    flex: 1 1;
    padding: 12px 16px;
    font-size: 11px;
  }
}
.scroll-to-top-button {
  position: fixed;
  bottom: 25px;
  right: 25px;
  background-color: #0E3E72; 
  color: #FFFFFF;
  border: none;
  border-radius: 50%;
  padding: 12px;
  cursor: pointer;
  z-index: 1000;
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
  transition: background-color 0.3s ease;
}

.scroll-to-top-button:hover {
  background-color: #1A4F8A; 
}

.partners-section {
  width: 100%;
  margin: 0;
  padding: 0;
  background-color: #ffffff;
}

.title-container {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-bottom: 0;
  padding: 20px 0;
}

.title-line2 {
  width: 175px;
  height: 10px;
  background-color: #0F447e;
  border-radius: 19px;
}

.title {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  margin: 0;
  text-align: center;
}

.title-nos {
  font-size: 35px;
  color: #0F447e;
}

.title-partenaires {
  font-size: 35px;
  color: #E30613;
}

.logos-container {
  width: 100%;
  overflow: hidden;
  margin: 0;
}

.logos-background {
  background-color: #F8F8F8;
  padding: 36px 0;
  width: 100%;
}

.logos-grid {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 40px;
  flex-wrap: nowrap;
  width: -webkit-max-content;
  width: max-content;
  animation: scrollRightToLeft 20s linear infinite;
}

@keyframes scrollRightToLeft {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-50%);
  }
}

.logo-wrapper {
  width: 206.64px;
  height: 112px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s ease;
}

.logo-wrapper:hover {
  transform: scale(1.05);
}

.logo-image {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

/* Mobile (< 768px) */
@media (max-width: 768px) {
  .title-container {
    gap: 15px;
    padding: 15px 0;
  }

  .title-line2 {
    width: 50px;
    height: 5px;
  }

  .title-nos {
    font-size: 25px;
    color: #0F447e;
  }

  .title-partenaires {
    font-size: 25px;
    color: #e30613;
  }

  .logos-background {
    padding: 20px 0;
  }

  .logos-grid {
    gap: 20px;
  }

  .logo-wrapper {
    width: 150px;
    height: 80px;
  }
}

/* Très petits écrans (< 480px) */
@media (max-width: 480px) {
  .title-container {
    gap: 10px;
    padding: 10px 0;
  }

  .title-line {
    display: none;
  }

  .title-nos {
    font-size: 18px;
    color: #0F447e;
  }

  .title-partenaires {
    font-size: 18px;
    color: #e30613;
  }

  .logos-background {
    padding: 15px 0;
  }

  .logos-grid {
    gap: 15px;
  }

  .logo-wrapper {
    width: 120px;
    height: 60px;
  }
}
/* === BIBLIOTHÈQUE DE COULEURS === */
:root {
  /* Couleurs principales */
  --thg-primary-blue: #0F447E;
  --thg-primary-red: #E30613;
  --thg-primary-red-hover: #c8050f;
  --thg-error-bg: white; /* Fond pour les erreurs, inspiré de la charte rouge */
  
  /* Couleurs de texte */
  --thg-text-white: white;
  --thg-text-light-gray: white;
  
  /* Couleurs de fond */
  --thg-bg-white: white;
  --thg-bg-overlay: rgba(0, 0, 0, 0.8);
  /* --thg-bg-separator: rgba(255, 255, 255, 0.3); */
  --thg-bg-separator: white;
  
  /* Couleurs transparentes */
  --thg-border-transparent: transparent;
}

/* === RESET DE BASE === */
html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  overflow-x: hidden;
}

/* === STYLES DE FOOTER PRINCIPAUX === */
.thg-footer-container {
  background-color: #0F447E;
  background-color: var(--thg-primary-blue);
  color: white;
  color: var(--thg-text-white);
  font-family: 'Poppins', sans-serif;
  padding: 40px 80px;
  width: 100%;
  box-sizing: border-box;
  position: relative;
  margin: 0;
}

/* === VERSION DESKTOP === */
.thg-footer-desktop-content {
  display: flex;
  flex-direction: column;
  gap: 40px;
  max-width: 1200px;
  margin: 0 auto;
}

.thg-footer-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 40px;
  gap: 40px;
}

.thg-footer-column {
  display: flex;
  flex-direction: column;
}

/* Styles communs */
.thg-company-logo-text {
  font-size: 32px;
  font-weight: 700;
  margin: 0 0 15px 0;
  line-height: 1.2;
}

.thg-footer-heading {
  font-size: 20px;
  font-weight: 600;
  margin: 0 0 15px 0;
}

.thg-red-divider-line {
  width: 50px;
  height: 3px;
  background-color: #E30613;
  background-color: var(--thg-primary-red);
  margin-bottom: 20px;
}

/* Section Entreprise */
.thg-company-description {
  font-size: 16px;
  line-height: 1.6;
  margin: 0 0 25px 0;
  color: white;
  color: var(--thg-text-light-gray);
}

/* Icônes sociales */
.thg-social-icons-row {
  display: flex;
  gap: 10px;
}

.thg-social-icon-wrapper {
  width: 40px;
  height: 40px;
  background: white;
  background: var(--thg-bg-white);
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform 0.2s;
}

.thg-social-icon-wrapper:hover {
  transform: scale(1.1);
}

.thg-social-icon-red {
  color: #E30613;
  color: var(--thg-primary-red);
  font-size: 18px;
}

/* Liens */
.thg-quick-links-list,
.thg-services-list,
.thg-policy-section {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.thg-quick-link,
.thg-service-link,
.thg-policy-link {
  color: white;
  color: var(--thg-text-light-gray);
  text-decoration: none;
  display: flex;
  align-items: center;
  font-size: 16px;
  transition: color 0.2s;
}

.thg-quick-link:hover,
.thg-service-link:hover,
.thg-policy-link:hover {
  color: white;
  color: var(--thg-text-white);
}

.thg-link-arrow {
  margin-right: 8px;
  font-size: 12px;
  color: white;
  color: var(--thg-text-light-gray);
}

/* Newsletter */
.thg-newsletter-description {
  font-size: 16px;
  margin: 0 0 20px 0;
  line-height: 1.5;
  color: white;
  color: var(--thg-text-light-gray);
}

.thg-newsletter-input-group {
  display: flex;
  gap: 0px;
}

.thg-email-input-field {
  flex: 1 1;
  padding: 12px 15px;
  border: none;
  border-radius: 5px 0 0 5px;
  font-size: 14px;
  outline: none;
  box-sizing: border-box;
}

.thg-subscribe-btn {
  background-color: #E30613;
  background-color: var(--thg-primary-red);
  color: white;
  color: var(--thg-text-white);
  border: none;
  border-radius: 0 5px 5px 0;
  padding: 12px 20px;
  cursor: pointer;
  transition: background-color 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
}

.thg-subscribe-btn:hover {
  background-color: #c8050f;
  background-color: var(--thg-primary-red-hover);
}

.thg-newsletter-message {
  font-size: 14px;
  margin-top: 10px;
  text-align: center;
}

/* Popup Newsletter */
.thg-newsletter-popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  background-color: var(--thg-bg-overlay);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  animation: fadeIn 0.3s ease-in-out;
}

.thg-newsletter-popup-content {
  position: relative;
  max-width: 400px;
  width: 90%;
  background: white;
  background: var(--thg-error-bg);
  border-radius: 10px;
  padding: 30px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
  animation: zoomIn 0.3s ease-in-out;
  color: #0F447E;
  color: var(--thg-primary-blue);
  text-align: center;
}

.thg-newsletter-popup-content.thg-newsletter-popup-error {
  background: white;
  background: var(--thg-error-bg);
  color: #0F447E;
  color: var(--thg-primary-blue);
}

.thg-newsletter-popup-title {
  font-size: 20px;
  font-weight: 600;
  margin: 0 0 15px 0;
  color: #0F447E;
  color: var(--thg-primary-blue);
}

.thg-newsletter-popup-content.thg-newsletter-popup-error .thg-newsletter-popup-title {
  color: #0F447E;
  color: var(--thg-primary-blue);
}

/* Nouvelles classes pour la charte graphique des titres du popup */
.thg-popup-title-blue {
  color: #0F447E;
  color: var(--thg-primary-blue);
}

.thg-popup-title-red {
  color: #E30613;
  color: var(--thg-primary-red);
}

.thg-newsletter-popup-message {
  font-size: 16px;
  line-height: 1.5;
  margin: 0 0 20px 0;
  color: #0F447E;
  color: var(--thg-primary-blue);
}

.thg-newsletter-popup-content.thg-newsletter-popup-error .thg-newsletter-popup-message {
  color: #0F447E;
  color: var(--thg-primary-blue);
}

.thg-newsletter-popup-btn {
  background-color: #E30613;
  background-color: var(--thg-primary-red);
  color: white;
  color: var(--thg-text-white);
  border: none;
  border-radius: 5px;
  padding: 12px 20px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  transition: background-color 0.2s;
}

.thg-newsletter-popup-btn:hover {
  background-color: #c8050f;
  background-color: var(--thg-primary-red-hover);
}

/* Galerie */
.thg-gallery-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 5px;
  gap: 5px;
}

.thg-gallery-item {
  width: 100px;
  height: 100px;
  border-radius: 8px;
  overflow: hidden;
  cursor: pointer;
  transition: transform 0.2s;
  border: 2px solid transparent;
  border: 2px solid var(--thg-border-transparent);
}

.thg-gallery-item:hover {
  transform: scale(1.05);
  border-color: #E30613;
  border-color: var(--thg-primary-red);
}

.thg-gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Popup Galerie */
.thg-image-popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  background-color: var(--thg-bg-overlay);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  animation: fadeIn 0.3s ease-in-out;
}

.thg-image-popup-content {
  position: relative;
  max-width: 90%;
  max-height: 90%;
  background: white;
  background: var(--thg-bg-white);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
  animation: zoomIn 0.3s ease-in-out;
}

.thg-image-popup-content img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.thg-popup-close-btn {
  position: absolute;
  top: 15px;
  right: 15px;
  background-color: #E30613;
  background-color: var(--thg-primary-red);
  color: white;
  color: var(--thg-text-white);
  border: none;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 16px;
  transition: background-color 0.2s;
  z-index: 1001;
}

.thg-popup-close-btn:hover {
  background-color: #c8050f;
  background-color: var(--thg-primary-red-hover);
}

/* === VERSION MOBILE === */
.thg-footer-mobile-content {
  display: none;
}

/* Accordéon Mobile */
.thg-accordion-section {
  margin-bottom: 10px;
  border-bottom: 1px solid white;
  border-bottom: 1px solid var(--thg-bg-separator);
}

.thg-accordion-header {
  width: 100%;
  background: none;
  border: none;
  padding: 15px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  color: white;
  color: var(--thg-text-white);
  font-family: inherit;
  transition: color 0.2s;
}

.thg-accordion-header:hover {
  color: white;
  color: var(--thg-text-light-gray);
}

.thg-accordion-title {
  font-size: 18px;
  font-weight: 600;
  margin: 0;
}

.thg-accordion-header svg {
  font-size: 16px;
  color: white;
  color: var(--thg-text-light-gray);
  transition: transform 0.3s ease;
}

.thg-accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease, padding 0.3s ease;
  padding: 0;
}

.thg-accordion-content.thg-accordion-open {
  max-height: 1000px;
  padding-bottom: 20px;
}

/* Copyright */
.thg-footer-horizontal-separator {
  height: 1px;
  background-color: white;
  background-color: var(--thg-bg-separator);
  margin: 30px 0 20px;
  width: 100%;
}

.thg-footer-copyright-section {
  text-align: center;
  font-size: 14px;
  width: 100%;
}

.thg-footer-copyright-section p {
  margin: 0;
  color: white;
  color: var(--thg-text-light-gray);
}

/* Animations */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes zoomIn {
  from { transform: scale(0.5); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}

/* === MEDIA QUERIES === */
@media (max-width: 768px) {
  .thg-footer-container {
    padding: 30px 20px;
  }
  
  .thg-footer-desktop-content {
    display: none;
  }
  
  .thg-footer-mobile-content {
    display: block;
  }
  
  .thg-company-logo-text {
    font-size: 28px;
  }
  
  .thg-newsletter-input-group {
    flex-direction: column;
    gap: 10px;
  }
  
  .thg-email-input-field,
  .thg-subscribe-btn {
    border-radius: 5px;
  }
  
  .thg-gallery-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 3px;
  }
  
  .thg-gallery-item {
    width: 70px;
    height: 70px;
  }
  
  .thg-accordion-title {
    font-size: 16px;
  }

  .thg-newsletter-popup-content {
    padding: 20px;
    max-width: 95%;
  }

  .thg-newsletter-popup-title {
    font-size: 18px;
  }

  .thg-newsletter-popup-message {
    font-size: 14px;
  }

  .thg-newsletter-popup-btn {
    padding: 10px 15px;
    font-size: 13px;
  }
}

@media (max-width: 480px) {
  .thg-footer-container {
    padding: 20px 15px;
  }
  
  .thg-gallery-item {
    width: 60px;
    height: 60px;
  }
  
  .thg-image-popup-content {
    max-width: 95%;
    max-height: 95%;
  }
  
  .thg-gallery-grid {
    gap: 2px;
  }
  
  .thg-accordion-title {
    font-size: 15px;
  }

  .thg-newsletter-popup-content {
    padding: 15px;
    max-width: 95%;
  }

  .thg-newsletter-popup-title {
    font-size: 16px;
  }

  .thg-newsletter-popup-message {
    font-size: 13px;
  }

  .thg-newsletter-popup-btn {
    padding: 8px 12px;
    font-size: 12px;
  }
}
.tahaga-why-choose-section {
  background-color: #0f447e;
  padding: 60px 20px;
  min-height: auto;
  display: flex;
  justify-content: center;
  width: 100%;
  box-sizing: border-box;
  overflow-x: hidden;
}

.tahaga-content-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 40px;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.tahaga-left-content {
  flex: 1 1;
  max-width: 100%;
}

.tahaga-main-heading {
  color: #ffffff;
  font-family: 'Poppins', sans-serif;
  font-size: 35px;
  font-weight: 600;
  margin-bottom: 30px;
}

.tahaga-description-box {
  display: flex;
  align-items: flex-start;
  margin-bottom: 20px;
}

.tahaga-red-vertical-line {
  min-width: 15px;
  height: 66px;
  background-color: #e30613;
  margin-right: 15px;
  margin-top: 5px;
  flex-shrink: 0;
}

.tahaga-main-description {
  color: #ffffff;
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
}

.tahaga-features-list {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.tahaga-feature-item {
  display: flex;
  align-items: flex-start;
  gap: 20px;
}

.tahaga-icon-container {
  min-width: 90px;
  height: 90px;
  background-color: #e30613;
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
}

.tahaga-feature-icon-img {
  width: 52px;
  height: 31.47px;
}

.tahaga-feature-text {
  flex: 1 1;
  display: flex;
  flex-direction: column;
}

.tahaga-feature-heading {
  color: #ffffff;
  font-family: 'Poppins', sans-serif;
  font-size: 20px;
  font-weight: 600;
  margin-top: 0;
  margin-bottom: 10px;
  padding: 0;
  line-height: 1.2;
}

.tahaga-feature-text-description {
  color: #ffffff;
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  margin: 0;
  padding: 0;
}

.tahaga-right-content {
  flex: 1 1;
  max-width: 516px;
  display: flex;
  justify-content: center;
}

.tahaga-image-wrapper {
  background: #0f447e;
  border-radius: 30px;
  padding: 20px;
  width: 100%;
}

.tahaga-agent-photo {
  width: 100%;
  height: auto;
  border-radius: 20px;
  object-fit: cover;
}

/* Media queries pour la responsivité */
@media (max-width: 1024px) {
  .tahaga-content-wrapper {
    gap: 30px;
  }
  
  .tahaga-main-heading {
    font-size: 30px;
  }
  
  .tahaga-feature-heading {
    font-size: 18px;
  }
}

@media (max-width: 768px) {
  .tahaga-content-wrapper {
    flex-direction: column-reverse;
    gap: 40px;
  }
  
  .tahaga-left-content, .tahaga-right-content {
    max-width: 100%;
  }
  
  .tahaga-main-heading {
    font-size: 28px;
  }
  
  .tahaga-icon-container {
    min-width: 70px;
    height: 70px;
  }
  
  .tahaga-feature-icon-img {
    width: 40px;
    height: auto;
  }
}

@media (max-width: 480px) {
  .tahaga-why-choose-section {
    padding: 40px 15px;
  }
  
  .tahaga-main-heading {
    font-size: 24px;
  }
  
  .tahaga-feature-item {
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
  }
  
  .tahaga-icon-container {
    min-width: 60px;
    height: 60px;
  }
  
  .tahaga-feature-icon-img {
    width: 35px;
  }
  
  .tahaga-feature-heading {
    font-size: 16px;
  }
  
  .tahaga-feature-text-description {
    font-size: 14px;
  }
}
@charset "UTF-8";/*!
 * Bootstrap  v5.3.8 (https://getbootstrap.com/)
 * Copyright 2011-2025 The Bootstrap Authors
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */:root,[data-bs-theme=light]{--bs-blue:#0d6efd;--bs-indigo:#6610f2;--bs-purple:#6f42c1;--bs-pink:#d63384;--bs-red:#dc3545;--bs-orange:#fd7e14;--bs-yellow:#ffc107;--bs-green:#198754;--bs-teal:#20c997;--bs-cyan:#0dcaf0;--bs-black:#000;--bs-white:#fff;--bs-gray:#6c757d;--bs-gray-dark:#343a40;--bs-gray-100:#f8f9fa;--bs-gray-200:#e9ecef;--bs-gray-300:#dee2e6;--bs-gray-400:#ced4da;--bs-gray-500:#adb5bd;--bs-gray-600:#6c757d;--bs-gray-700:#495057;--bs-gray-800:#343a40;--bs-gray-900:#212529;--bs-primary:#0d6efd;--bs-secondary:#6c757d;--bs-success:#198754;--bs-info:#0dcaf0;--bs-warning:#ffc107;--bs-danger:#dc3545;--bs-light:#f8f9fa;--bs-dark:#212529;--bs-primary-rgb:13,110,253;--bs-secondary-rgb:108,117,125;--bs-success-rgb:25,135,84;--bs-info-rgb:13,202,240;--bs-warning-rgb:255,193,7;--bs-danger-rgb:220,53,69;--bs-light-rgb:248,249,250;--bs-dark-rgb:33,37,41;--bs-primary-text-emphasis:#052c65;--bs-secondary-text-emphasis:#2b2f32;--bs-success-text-emphasis:#0a3622;--bs-info-text-emphasis:#055160;--bs-warning-text-emphasis:#664d03;--bs-danger-text-emphasis:#58151c;--bs-light-text-emphasis:#495057;--bs-dark-text-emphasis:#495057;--bs-primary-bg-subtle:#cfe2ff;--bs-secondary-bg-subtle:#e2e3e5;--bs-success-bg-subtle:#d1e7dd;--bs-info-bg-subtle:#cff4fc;--bs-warning-bg-subtle:#fff3cd;--bs-danger-bg-subtle:#f8d7da;--bs-light-bg-subtle:#fcfcfd;--bs-dark-bg-subtle:#ced4da;--bs-primary-border-subtle:#9ec5fe;--bs-secondary-border-subtle:#c4c8cb;--bs-success-border-subtle:#a3cfbb;--bs-info-border-subtle:#9eeaf9;--bs-warning-border-subtle:#ffe69c;--bs-danger-border-subtle:#f1aeb5;--bs-light-border-subtle:#e9ecef;--bs-dark-border-subtle:#adb5bd;--bs-white-rgb:255,255,255;--bs-black-rgb:0,0,0;--bs-font-sans-serif:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--bs-font-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--bs-gradient:linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));--bs-body-font-family:var(--bs-font-sans-serif);--bs-body-font-size:1rem;--bs-body-font-weight:400;--bs-body-line-height:1.5;--bs-body-color:#212529;--bs-body-color-rgb:33,37,41;--bs-body-bg:#fff;--bs-body-bg-rgb:255,255,255;--bs-emphasis-color:#000;--bs-emphasis-color-rgb:0,0,0;--bs-secondary-color:rgba(33, 37, 41, 0.75);--bs-secondary-color-rgb:33,37,41;--bs-secondary-bg:#e9ecef;--bs-secondary-bg-rgb:233,236,239;--bs-tertiary-color:rgba(33, 37, 41, 0.5);--bs-tertiary-color-rgb:33,37,41;--bs-tertiary-bg:#f8f9fa;--bs-tertiary-bg-rgb:248,249,250;--bs-heading-color:inherit;--bs-link-color:#0d6efd;--bs-link-color-rgb:13,110,253;--bs-link-decoration:underline;--bs-link-hover-color:#0a58ca;--bs-link-hover-color-rgb:10,88,202;--bs-code-color:#d63384;--bs-highlight-color:#212529;--bs-highlight-bg:#fff3cd;--bs-border-width:1px;--bs-border-style:solid;--bs-border-color:#dee2e6;--bs-border-color-translucent:rgba(0, 0, 0, 0.175);--bs-border-radius:0.375rem;--bs-border-radius-sm:0.25rem;--bs-border-radius-lg:0.5rem;--bs-border-radius-xl:1rem;--bs-border-radius-xxl:2rem;--bs-border-radius-2xl:var(--bs-border-radius-xxl);--bs-border-radius-pill:50rem;--bs-box-shadow:0 0.5rem 1rem rgba(0, 0, 0, 0.15);--bs-box-shadow-sm:0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);--bs-box-shadow-lg:0 1rem 3rem rgba(0, 0, 0, 0.175);--bs-box-shadow-inset:inset 0 1px 2px rgba(0, 0, 0, 0.075);--bs-focus-ring-width:0.25rem;--bs-focus-ring-opacity:0.25;--bs-focus-ring-color:rgba(13, 110, 253, 0.25);--bs-form-valid-color:#198754;--bs-form-valid-border-color:#198754;--bs-form-invalid-color:#dc3545;--bs-form-invalid-border-color:#dc3545}[data-bs-theme=dark]{color-scheme:dark;--bs-body-color:#dee2e6;--bs-body-color-rgb:222,226,230;--bs-body-bg:#212529;--bs-body-bg-rgb:33,37,41;--bs-emphasis-color:#fff;--bs-emphasis-color-rgb:255,255,255;--bs-secondary-color:rgba(222, 226, 230, 0.75);--bs-secondary-color-rgb:222,226,230;--bs-secondary-bg:#343a40;--bs-secondary-bg-rgb:52,58,64;--bs-tertiary-color:rgba(222, 226, 230, 0.5);--bs-tertiary-color-rgb:222,226,230;--bs-tertiary-bg:#2b3035;--bs-tertiary-bg-rgb:43,48,53;--bs-primary-text-emphasis:#6ea8fe;--bs-secondary-text-emphasis:#a7acb1;--bs-success-text-emphasis:#75b798;--bs-info-text-emphasis:#6edff6;--bs-warning-text-emphasis:#ffda6a;--bs-danger-text-emphasis:#ea868f;--bs-light-text-emphasis:#f8f9fa;--bs-dark-text-emphasis:#dee2e6;--bs-primary-bg-subtle:#031633;--bs-secondary-bg-subtle:#161719;--bs-success-bg-subtle:#051b11;--bs-info-bg-subtle:#032830;--bs-warning-bg-subtle:#332701;--bs-danger-bg-subtle:#2c0b0e;--bs-light-bg-subtle:#343a40;--bs-dark-bg-subtle:#1a1d20;--bs-primary-border-subtle:#084298;--bs-secondary-border-subtle:#41464b;--bs-success-border-subtle:#0f5132;--bs-info-border-subtle:#087990;--bs-warning-border-subtle:#997404;--bs-danger-border-subtle:#842029;--bs-light-border-subtle:#495057;--bs-dark-border-subtle:#343a40;--bs-heading-color:inherit;--bs-link-color:#6ea8fe;--bs-link-hover-color:#8bb9fe;--bs-link-color-rgb:110,168,254;--bs-link-hover-color-rgb:139,185,254;--bs-code-color:#e685b5;--bs-highlight-color:#dee2e6;--bs-highlight-bg:#664d03;--bs-border-color:#495057;--bs-border-color-translucent:rgba(255, 255, 255, 0.15);--bs-form-valid-color:#75b798;--bs-form-valid-border-color:#75b798;--bs-form-invalid-color:#ea868f;--bs-form-invalid-border-color:#ea868f}*,::after,::before{box-sizing:border-box}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";font-family:var(--bs-body-font-family);font-size:1rem;font-size:var(--bs-body-font-size);font-weight:400;font-weight:var(--bs-body-font-weight);line-height:1.5;line-height:var(--bs-body-line-height);color:#212529;color:var(--bs-body-color);text-align:var(--bs-body-text-align);background-color:#fff;background-color:var(--bs-body-bg);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}hr{margin:1rem 0;color:inherit;border:0;border-top:1px solid;border-top:var(--bs-border-width) solid;opacity:.25}.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem;font-weight:500;line-height:1.2;color:inherit;color:var(--bs-heading-color)}.h1,h1{font-size:calc(1.375rem + 1.5vw)}@media (min-width:1200px){.h1,h1{font-size:2.5rem}}.h2,h2{font-size:calc(1.325rem + .9vw)}@media (min-width:1200px){.h2,h2{font-size:2rem}}.h3,h3{font-size:calc(1.3rem + .6vw)}@media (min-width:1200px){.h3,h3{font-size:1.75rem}}.h4,h4{font-size:calc(1.275rem + .3vw)}@media (min-width:1200px){.h4,h4{font-size:1.5rem}}.h5,h5{font-size:1.25rem}.h6,h6{font-size:1rem}p{margin-top:0;margin-bottom:1rem}abbr[title]{-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}address{margin-bottom:1rem;font-style:normal;line-height:inherit}ol,ul{padding-left:2rem}dl,ol,ul{margin-top:0;margin-bottom:1rem}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}.small,small{font-size:.875em}.mark,mark{padding:.1875em;color:#212529;color:var(--bs-highlight-color);background-color:#fff3cd;background-color:var(--bs-highlight-bg)}sub,sup{position:relative;font-size:.75em;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{color:rgba(13,110,253,1);color:rgba(var(--bs-link-color-rgb),var(--bs-link-opacity,1));text-decoration:underline}a:hover{--bs-link-color-rgb:var(--bs-link-hover-color-rgb)}a:not([href]):not([class]),a:not([href]):not([class]):hover{color:inherit;text-decoration:none}code,kbd,pre,samp{font-family:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;font-family:var(--bs-font-monospace);font-size:1em}pre{display:block;margin-top:0;margin-bottom:1rem;overflow:auto;font-size:.875em}pre code{font-size:inherit;color:inherit;word-break:normal}code{font-size:.875em;color:#d63384;color:var(--bs-code-color);word-wrap:break-word}a>code{color:inherit}kbd{padding:.1875rem .375rem;font-size:.875em;color:#fff;color:var(--bs-body-bg);background-color:#212529;background-color:var(--bs-body-color);border-radius:.25rem}kbd kbd{padding:0;font-size:1em}figure{margin:0 0 1rem}img,svg{vertical-align:middle}table{caption-side:bottom;border-collapse:collapse}caption{padding-top:.5rem;padding-bottom:.5rem;color:rgba(33, 37, 41, 0.75);color:var(--bs-secondary-color);text-align:left}th{text-align:inherit;text-align:-webkit-match-parent}tbody,td,tfoot,th,thead,tr{border-color:inherit;border-style:solid;border-width:0}label{display:inline-block}button{border-radius:0}button:focus:not(:focus-visible){outline:0}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,select{text-transform:none}[role=button]{cursor:pointer}select{word-wrap:normal}select:disabled{opacity:1}[list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator{display:none!important}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}::-moz-focus-inner{padding:0;border-style:none}textarea{resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{float:left;width:100%;padding:0;margin-bottom:.5rem;line-height:inherit;font-size:calc(1.275rem + .3vw)}@media (min-width:1200px){legend{font-size:1.5rem}}legend+*{clear:left}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-fields-wrapper,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-text,::-webkit-datetime-edit-year-field{padding:0}::-webkit-inner-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button{cursor:pointer;filter:grayscale(1)}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-color-swatch-wrapper{padding:0}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}::file-selector-button{font:inherit;-webkit-appearance:button}output{display:inline-block}iframe{border:0}summary{display:list-item;cursor:pointer}progress{vertical-align:baseline}[hidden]{display:none!important}.lead{font-size:1.25rem;font-weight:300}.display-1{font-weight:300;line-height:1.2;font-size:calc(1.625rem + 4.5vw)}@media (min-width:1200px){.display-1{font-size:5rem}}.display-2{font-weight:300;line-height:1.2;font-size:calc(1.575rem + 3.9vw)}@media (min-width:1200px){.display-2{font-size:4.5rem}}.display-3{font-weight:300;line-height:1.2;font-size:calc(1.525rem + 3.3vw)}@media (min-width:1200px){.display-3{font-size:4rem}}.display-4{font-weight:300;line-height:1.2;font-size:calc(1.475rem + 2.7vw)}@media (min-width:1200px){.display-4{font-size:3.5rem}}.display-5{font-weight:300;line-height:1.2;font-size:calc(1.425rem + 2.1vw)}@media (min-width:1200px){.display-5{font-size:3rem}}.display-6{font-weight:300;line-height:1.2;font-size:calc(1.375rem + 1.5vw)}@media (min-width:1200px){.display-6{font-size:2.5rem}}.list-unstyled{padding-left:0;list-style:none}.list-inline{padding-left:0;list-style:none}.list-inline-item{display:inline-block}.list-inline-item:not(:last-child){margin-right:.5rem}.initialism{font-size:.875em;text-transform:uppercase}.blockquote{margin-bottom:1rem;font-size:1.25rem}.blockquote>:last-child{margin-bottom:0}.blockquote-footer{margin-top:-1rem;margin-bottom:1rem;font-size:.875em;color:#6c757d}.blockquote-footer::before{content:"— "}.img-fluid{max-width:100%;height:auto}.img-thumbnail{padding:.25rem;background-color:#fff;background-color:var(--bs-body-bg);border:1px solid #dee2e6;border:var(--bs-border-width) solid var(--bs-border-color);border-radius:0.375rem;border-radius:var(--bs-border-radius);max-width:100%;height:auto}.figure{display:inline-block}.figure-img{margin-bottom:.5rem;line-height:1}.figure-caption{font-size:.875em;color:rgba(33, 37, 41, 0.75);color:var(--bs-secondary-color)}.container,.container-fluid,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl{--bs-gutter-x:1.5rem;--bs-gutter-y:0;width:100%;padding-right:calc(var(--bs-gutter-x) * .5);padding-left:calc(var(--bs-gutter-x) * .5);margin-right:auto;margin-left:auto}@media (min-width:576px){.container,.container-sm{max-width:540px}}@media (min-width:768px){.container,.container-md,.container-sm{max-width:720px}}@media (min-width:992px){.container,.container-lg,.container-md,.container-sm{max-width:960px}}@media (min-width:1200px){.container,.container-lg,.container-md,.container-sm,.container-xl{max-width:1140px}}@media (min-width:1400px){.container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl{max-width:1320px}}:root{--bs-breakpoint-xs:0;--bs-breakpoint-sm:576px;--bs-breakpoint-md:768px;--bs-breakpoint-lg:992px;--bs-breakpoint-xl:1200px;--bs-breakpoint-xxl:1400px}.row{--bs-gutter-x:1.5rem;--bs-gutter-y:0;display:flex;flex-wrap:wrap;margin-top:calc(-1 * var(--bs-gutter-y));margin-right:calc(-.5 * var(--bs-gutter-x));margin-left:calc(-.5 * var(--bs-gutter-x))}.row>*{flex-shrink:0;width:100%;max-width:100%;padding-right:calc(var(--bs-gutter-x) * .5);padding-left:calc(var(--bs-gutter-x) * .5);margin-top:var(--bs-gutter-y)}.col{flex:1 0}.row-cols-auto>*{flex:0 0 auto;width:auto}.row-cols-1>*{flex:0 0 auto;width:100%}.row-cols-2>*{flex:0 0 auto;width:50%}.row-cols-3>*{flex:0 0 auto;width:33.33333333%}.row-cols-4>*{flex:0 0 auto;width:25%}.row-cols-5>*{flex:0 0 auto;width:20%}.row-cols-6>*{flex:0 0 auto;width:16.66666667%}.col-auto{flex:0 0 auto;width:auto}.col-1{flex:0 0 auto;width:8.33333333%}.col-2{flex:0 0 auto;width:16.66666667%}.col-3{flex:0 0 auto;width:25%}.col-4{flex:0 0 auto;width:33.33333333%}.col-5{flex:0 0 auto;width:41.66666667%}.col-6{flex:0 0 auto;width:50%}.col-7{flex:0 0 auto;width:58.33333333%}.col-8{flex:0 0 auto;width:66.66666667%}.col-9{flex:0 0 auto;width:75%}.col-10{flex:0 0 auto;width:83.33333333%}.col-11{flex:0 0 auto;width:91.66666667%}.col-12{flex:0 0 auto;width:100%}.offset-1{margin-left:8.33333333%}.offset-2{margin-left:16.66666667%}.offset-3{margin-left:25%}.offset-4{margin-left:33.33333333%}.offset-5{margin-left:41.66666667%}.offset-6{margin-left:50%}.offset-7{margin-left:58.33333333%}.offset-8{margin-left:66.66666667%}.offset-9{margin-left:75%}.offset-10{margin-left:83.33333333%}.offset-11{margin-left:91.66666667%}.g-0,.gx-0{--bs-gutter-x:0}.g-0,.gy-0{--bs-gutter-y:0}.g-1,.gx-1{--bs-gutter-x:0.25rem}.g-1,.gy-1{--bs-gutter-y:0.25rem}.g-2,.gx-2{--bs-gutter-x:0.5rem}.g-2,.gy-2{--bs-gutter-y:0.5rem}.g-3,.gx-3{--bs-gutter-x:1rem}.g-3,.gy-3{--bs-gutter-y:1rem}.g-4,.gx-4{--bs-gutter-x:1.5rem}.g-4,.gy-4{--bs-gutter-y:1.5rem}.g-5,.gx-5{--bs-gutter-x:3rem}.g-5,.gy-5{--bs-gutter-y:3rem}@media (min-width:576px){.col-sm{flex:1 0}.row-cols-sm-auto>*{flex:0 0 auto;width:auto}.row-cols-sm-1>*{flex:0 0 auto;width:100%}.row-cols-sm-2>*{flex:0 0 auto;width:50%}.row-cols-sm-3>*{flex:0 0 auto;width:33.33333333%}.row-cols-sm-4>*{flex:0 0 auto;width:25%}.row-cols-sm-5>*{flex:0 0 auto;width:20%}.row-cols-sm-6>*{flex:0 0 auto;width:16.66666667%}.col-sm-auto{flex:0 0 auto;width:auto}.col-sm-1{flex:0 0 auto;width:8.33333333%}.col-sm-2{flex:0 0 auto;width:16.66666667%}.col-sm-3{flex:0 0 auto;width:25%}.col-sm-4{flex:0 0 auto;width:33.33333333%}.col-sm-5{flex:0 0 auto;width:41.66666667%}.col-sm-6{flex:0 0 auto;width:50%}.col-sm-7{flex:0 0 auto;width:58.33333333%}.col-sm-8{flex:0 0 auto;width:66.66666667%}.col-sm-9{flex:0 0 auto;width:75%}.col-sm-10{flex:0 0 auto;width:83.33333333%}.col-sm-11{flex:0 0 auto;width:91.66666667%}.col-sm-12{flex:0 0 auto;width:100%}.offset-sm-0{margin-left:0}.offset-sm-1{margin-left:8.33333333%}.offset-sm-2{margin-left:16.66666667%}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:33.33333333%}.offset-sm-5{margin-left:41.66666667%}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:58.33333333%}.offset-sm-8{margin-left:66.66666667%}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:83.33333333%}.offset-sm-11{margin-left:91.66666667%}.g-sm-0,.gx-sm-0{--bs-gutter-x:0}.g-sm-0,.gy-sm-0{--bs-gutter-y:0}.g-sm-1,.gx-sm-1{--bs-gutter-x:0.25rem}.g-sm-1,.gy-sm-1{--bs-gutter-y:0.25rem}.g-sm-2,.gx-sm-2{--bs-gutter-x:0.5rem}.g-sm-2,.gy-sm-2{--bs-gutter-y:0.5rem}.g-sm-3,.gx-sm-3{--bs-gutter-x:1rem}.g-sm-3,.gy-sm-3{--bs-gutter-y:1rem}.g-sm-4,.gx-sm-4{--bs-gutter-x:1.5rem}.g-sm-4,.gy-sm-4{--bs-gutter-y:1.5rem}.g-sm-5,.gx-sm-5{--bs-gutter-x:3rem}.g-sm-5,.gy-sm-5{--bs-gutter-y:3rem}}@media (min-width:768px){.col-md{flex:1 0}.row-cols-md-auto>*{flex:0 0 auto;width:auto}.row-cols-md-1>*{flex:0 0 auto;width:100%}.row-cols-md-2>*{flex:0 0 auto;width:50%}.row-cols-md-3>*{flex:0 0 auto;width:33.33333333%}.row-cols-md-4>*{flex:0 0 auto;width:25%}.row-cols-md-5>*{flex:0 0 auto;width:20%}.row-cols-md-6>*{flex:0 0 auto;width:16.66666667%}.col-md-auto{flex:0 0 auto;width:auto}.col-md-1{flex:0 0 auto;width:8.33333333%}.col-md-2{flex:0 0 auto;width:16.66666667%}.col-md-3{flex:0 0 auto;width:25%}.col-md-4{flex:0 0 auto;width:33.33333333%}.col-md-5{flex:0 0 auto;width:41.66666667%}.col-md-6{flex:0 0 auto;width:50%}.col-md-7{flex:0 0 auto;width:58.33333333%}.col-md-8{flex:0 0 auto;width:66.66666667%}.col-md-9{flex:0 0 auto;width:75%}.col-md-10{flex:0 0 auto;width:83.33333333%}.col-md-11{flex:0 0 auto;width:91.66666667%}.col-md-12{flex:0 0 auto;width:100%}.offset-md-0{margin-left:0}.offset-md-1{margin-left:8.33333333%}.offset-md-2{margin-left:16.66666667%}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:33.33333333%}.offset-md-5{margin-left:41.66666667%}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:58.33333333%}.offset-md-8{margin-left:66.66666667%}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:83.33333333%}.offset-md-11{margin-left:91.66666667%}.g-md-0,.gx-md-0{--bs-gutter-x:0}.g-md-0,.gy-md-0{--bs-gutter-y:0}.g-md-1,.gx-md-1{--bs-gutter-x:0.25rem}.g-md-1,.gy-md-1{--bs-gutter-y:0.25rem}.g-md-2,.gx-md-2{--bs-gutter-x:0.5rem}.g-md-2,.gy-md-2{--bs-gutter-y:0.5rem}.g-md-3,.gx-md-3{--bs-gutter-x:1rem}.g-md-3,.gy-md-3{--bs-gutter-y:1rem}.g-md-4,.gx-md-4{--bs-gutter-x:1.5rem}.g-md-4,.gy-md-4{--bs-gutter-y:1.5rem}.g-md-5,.gx-md-5{--bs-gutter-x:3rem}.g-md-5,.gy-md-5{--bs-gutter-y:3rem}}@media (min-width:992px){.col-lg{flex:1 0}.row-cols-lg-auto>*{flex:0 0 auto;width:auto}.row-cols-lg-1>*{flex:0 0 auto;width:100%}.row-cols-lg-2>*{flex:0 0 auto;width:50%}.row-cols-lg-3>*{flex:0 0 auto;width:33.33333333%}.row-cols-lg-4>*{flex:0 0 auto;width:25%}.row-cols-lg-5>*{flex:0 0 auto;width:20%}.row-cols-lg-6>*{flex:0 0 auto;width:16.66666667%}.col-lg-auto{flex:0 0 auto;width:auto}.col-lg-1{flex:0 0 auto;width:8.33333333%}.col-lg-2{flex:0 0 auto;width:16.66666667%}.col-lg-3{flex:0 0 auto;width:25%}.col-lg-4{flex:0 0 auto;width:33.33333333%}.col-lg-5{flex:0 0 auto;width:41.66666667%}.col-lg-6{flex:0 0 auto;width:50%}.col-lg-7{flex:0 0 auto;width:58.33333333%}.col-lg-8{flex:0 0 auto;width:66.66666667%}.col-lg-9{flex:0 0 auto;width:75%}.col-lg-10{flex:0 0 auto;width:83.33333333%}.col-lg-11{flex:0 0 auto;width:91.66666667%}.col-lg-12{flex:0 0 auto;width:100%}.offset-lg-0{margin-left:0}.offset-lg-1{margin-left:8.33333333%}.offset-lg-2{margin-left:16.66666667%}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:33.33333333%}.offset-lg-5{margin-left:41.66666667%}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:58.33333333%}.offset-lg-8{margin-left:66.66666667%}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:83.33333333%}.offset-lg-11{margin-left:91.66666667%}.g-lg-0,.gx-lg-0{--bs-gutter-x:0}.g-lg-0,.gy-lg-0{--bs-gutter-y:0}.g-lg-1,.gx-lg-1{--bs-gutter-x:0.25rem}.g-lg-1,.gy-lg-1{--bs-gutter-y:0.25rem}.g-lg-2,.gx-lg-2{--bs-gutter-x:0.5rem}.g-lg-2,.gy-lg-2{--bs-gutter-y:0.5rem}.g-lg-3,.gx-lg-3{--bs-gutter-x:1rem}.g-lg-3,.gy-lg-3{--bs-gutter-y:1rem}.g-lg-4,.gx-lg-4{--bs-gutter-x:1.5rem}.g-lg-4,.gy-lg-4{--bs-gutter-y:1.5rem}.g-lg-5,.gx-lg-5{--bs-gutter-x:3rem}.g-lg-5,.gy-lg-5{--bs-gutter-y:3rem}}@media (min-width:1200px){.col-xl{flex:1 0}.row-cols-xl-auto>*{flex:0 0 auto;width:auto}.row-cols-xl-1>*{flex:0 0 auto;width:100%}.row-cols-xl-2>*{flex:0 0 auto;width:50%}.row-cols-xl-3>*{flex:0 0 auto;width:33.33333333%}.row-cols-xl-4>*{flex:0 0 auto;width:25%}.row-cols-xl-5>*{flex:0 0 auto;width:20%}.row-cols-xl-6>*{flex:0 0 auto;width:16.66666667%}.col-xl-auto{flex:0 0 auto;width:auto}.col-xl-1{flex:0 0 auto;width:8.33333333%}.col-xl-2{flex:0 0 auto;width:16.66666667%}.col-xl-3{flex:0 0 auto;width:25%}.col-xl-4{flex:0 0 auto;width:33.33333333%}.col-xl-5{flex:0 0 auto;width:41.66666667%}.col-xl-6{flex:0 0 auto;width:50%}.col-xl-7{flex:0 0 auto;width:58.33333333%}.col-xl-8{flex:0 0 auto;width:66.66666667%}.col-xl-9{flex:0 0 auto;width:75%}.col-xl-10{flex:0 0 auto;width:83.33333333%}.col-xl-11{flex:0 0 auto;width:91.66666667%}.col-xl-12{flex:0 0 auto;width:100%}.offset-xl-0{margin-left:0}.offset-xl-1{margin-left:8.33333333%}.offset-xl-2{margin-left:16.66666667%}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:33.33333333%}.offset-xl-5{margin-left:41.66666667%}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:58.33333333%}.offset-xl-8{margin-left:66.66666667%}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:83.33333333%}.offset-xl-11{margin-left:91.66666667%}.g-xl-0,.gx-xl-0{--bs-gutter-x:0}.g-xl-0,.gy-xl-0{--bs-gutter-y:0}.g-xl-1,.gx-xl-1{--bs-gutter-x:0.25rem}.g-xl-1,.gy-xl-1{--bs-gutter-y:0.25rem}.g-xl-2,.gx-xl-2{--bs-gutter-x:0.5rem}.g-xl-2,.gy-xl-2{--bs-gutter-y:0.5rem}.g-xl-3,.gx-xl-3{--bs-gutter-x:1rem}.g-xl-3,.gy-xl-3{--bs-gutter-y:1rem}.g-xl-4,.gx-xl-4{--bs-gutter-x:1.5rem}.g-xl-4,.gy-xl-4{--bs-gutter-y:1.5rem}.g-xl-5,.gx-xl-5{--bs-gutter-x:3rem}.g-xl-5,.gy-xl-5{--bs-gutter-y:3rem}}@media (min-width:1400px){.col-xxl{flex:1 0}.row-cols-xxl-auto>*{flex:0 0 auto;width:auto}.row-cols-xxl-1>*{flex:0 0 auto;width:100%}.row-cols-xxl-2>*{flex:0 0 auto;width:50%}.row-cols-xxl-3>*{flex:0 0 auto;width:33.33333333%}.row-cols-xxl-4>*{flex:0 0 auto;width:25%}.row-cols-xxl-5>*{flex:0 0 auto;width:20%}.row-cols-xxl-6>*{flex:0 0 auto;width:16.66666667%}.col-xxl-auto{flex:0 0 auto;width:auto}.col-xxl-1{flex:0 0 auto;width:8.33333333%}.col-xxl-2{flex:0 0 auto;width:16.66666667%}.col-xxl-3{flex:0 0 auto;width:25%}.col-xxl-4{flex:0 0 auto;width:33.33333333%}.col-xxl-5{flex:0 0 auto;width:41.66666667%}.col-xxl-6{flex:0 0 auto;width:50%}.col-xxl-7{flex:0 0 auto;width:58.33333333%}.col-xxl-8{flex:0 0 auto;width:66.66666667%}.col-xxl-9{flex:0 0 auto;width:75%}.col-xxl-10{flex:0 0 auto;width:83.33333333%}.col-xxl-11{flex:0 0 auto;width:91.66666667%}.col-xxl-12{flex:0 0 auto;width:100%}.offset-xxl-0{margin-left:0}.offset-xxl-1{margin-left:8.33333333%}.offset-xxl-2{margin-left:16.66666667%}.offset-xxl-3{margin-left:25%}.offset-xxl-4{margin-left:33.33333333%}.offset-xxl-5{margin-left:41.66666667%}.offset-xxl-6{margin-left:50%}.offset-xxl-7{margin-left:58.33333333%}.offset-xxl-8{margin-left:66.66666667%}.offset-xxl-9{margin-left:75%}.offset-xxl-10{margin-left:83.33333333%}.offset-xxl-11{margin-left:91.66666667%}.g-xxl-0,.gx-xxl-0{--bs-gutter-x:0}.g-xxl-0,.gy-xxl-0{--bs-gutter-y:0}.g-xxl-1,.gx-xxl-1{--bs-gutter-x:0.25rem}.g-xxl-1,.gy-xxl-1{--bs-gutter-y:0.25rem}.g-xxl-2,.gx-xxl-2{--bs-gutter-x:0.5rem}.g-xxl-2,.gy-xxl-2{--bs-gutter-y:0.5rem}.g-xxl-3,.gx-xxl-3{--bs-gutter-x:1rem}.g-xxl-3,.gy-xxl-3{--bs-gutter-y:1rem}.g-xxl-4,.gx-xxl-4{--bs-gutter-x:1.5rem}.g-xxl-4,.gy-xxl-4{--bs-gutter-y:1.5rem}.g-xxl-5,.gx-xxl-5{--bs-gutter-x:3rem}.g-xxl-5,.gy-xxl-5{--bs-gutter-y:3rem}}.table{--bs-table-color-type:initial;--bs-table-bg-type:initial;--bs-table-color-state:initial;--bs-table-bg-state:initial;--bs-table-color:var(--bs-emphasis-color);--bs-table-bg:var(--bs-body-bg);--bs-table-border-color:var(--bs-border-color);--bs-table-accent-bg:transparent;--bs-table-striped-color:var(--bs-emphasis-color);--bs-table-striped-bg:rgba(var(--bs-emphasis-color-rgb), 0.05);--bs-table-active-color:var(--bs-emphasis-color);--bs-table-active-bg:rgba(var(--bs-emphasis-color-rgb), 0.1);--bs-table-hover-color:var(--bs-emphasis-color);--bs-table-hover-bg:rgba(var(--bs-emphasis-color-rgb), 0.075);width:100%;margin-bottom:1rem;vertical-align:top;border-color:var(--bs-table-border-color)}.table>:not(caption)>*>*{padding:.5rem .5rem;color:var(--bs-table-color);color:var(--bs-table-color-state,var(--bs-table-color-type,var(--bs-table-color)));background-color:var(--bs-table-bg);border-bottom-width:1px;border-bottom-width:var(--bs-border-width);box-shadow:inset 0 0 0 9999px var(--bs-table-accent-bg);box-shadow:inset 0 0 0 9999px var(--bs-table-bg-state,var(--bs-table-bg-type,var(--bs-table-accent-bg)))}.table>tbody{vertical-align:inherit}.table>thead{vertical-align:bottom}.table-group-divider{border-top:calc(1px * 2) solid currentcolor;border-top:calc(var(--bs-border-width) * 2) solid currentcolor}.caption-top{caption-side:top}.table-sm>:not(caption)>*>*{padding:.25rem .25rem}.table-bordered>:not(caption)>*{border-width:1px 0;border-width:var(--bs-border-width) 0}.table-bordered>:not(caption)>*>*{border-width:0 1px;border-width:0 var(--bs-border-width)}.table-borderless>:not(caption)>*>*{border-bottom-width:0}.table-borderless>:not(:first-child){border-top-width:0}.table-striped>tbody>tr:nth-of-type(odd)>*{--bs-table-color-type:var(--bs-table-striped-color);--bs-table-bg-type:var(--bs-table-striped-bg)}.table-striped-columns>:not(caption)>tr>:nth-child(2n){--bs-table-color-type:var(--bs-table-striped-color);--bs-table-bg-type:var(--bs-table-striped-bg)}.table-active{--bs-table-color-state:var(--bs-table-active-color);--bs-table-bg-state:var(--bs-table-active-bg)}.table-hover>tbody>tr:hover>*{--bs-table-color-state:var(--bs-table-hover-color);--bs-table-bg-state:var(--bs-table-hover-bg)}.table-primary{--bs-table-color:#000;--bs-table-bg:#cfe2ff;--bs-table-border-color:#a6b5cc;--bs-table-striped-bg:#c5d7f2;--bs-table-striped-color:#000;--bs-table-active-bg:#bacbe6;--bs-table-active-color:#000;--bs-table-hover-bg:#bfd1ec;--bs-table-hover-color:#000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-secondary{--bs-table-color:#000;--bs-table-bg:#e2e3e5;--bs-table-border-color:#b5b6b7;--bs-table-striped-bg:#d7d8da;--bs-table-striped-color:#000;--bs-table-active-bg:#cbccce;--bs-table-active-color:#000;--bs-table-hover-bg:#d1d2d4;--bs-table-hover-color:#000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-success{--bs-table-color:#000;--bs-table-bg:#d1e7dd;--bs-table-border-color:#a7b9b1;--bs-table-striped-bg:#c7dbd2;--bs-table-striped-color:#000;--bs-table-active-bg:#bcd0c7;--bs-table-active-color:#000;--bs-table-hover-bg:#c1d6cc;--bs-table-hover-color:#000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-info{--bs-table-color:#000;--bs-table-bg:#cff4fc;--bs-table-border-color:#a6c3ca;--bs-table-striped-bg:#c5e8ef;--bs-table-striped-color:#000;--bs-table-active-bg:#badce3;--bs-table-active-color:#000;--bs-table-hover-bg:#bfe2e9;--bs-table-hover-color:#000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-warning{--bs-table-color:#000;--bs-table-bg:#fff3cd;--bs-table-border-color:#ccc2a4;--bs-table-striped-bg:#f2e7c3;--bs-table-striped-color:#000;--bs-table-active-bg:#e6dbb9;--bs-table-active-color:#000;--bs-table-hover-bg:#ece1be;--bs-table-hover-color:#000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-danger{--bs-table-color:#000;--bs-table-bg:#f8d7da;--bs-table-border-color:#c6acae;--bs-table-striped-bg:#eccccf;--bs-table-striped-color:#000;--bs-table-active-bg:#dfc2c4;--bs-table-active-color:#000;--bs-table-hover-bg:#e5c7ca;--bs-table-hover-color:#000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-light{--bs-table-color:#000;--bs-table-bg:#f8f9fa;--bs-table-border-color:#c6c7c8;--bs-table-striped-bg:#ecedee;--bs-table-striped-color:#000;--bs-table-active-bg:#dfe0e1;--bs-table-active-color:#000;--bs-table-hover-bg:#e5e6e7;--bs-table-hover-color:#000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-dark{--bs-table-color:#fff;--bs-table-bg:#212529;--bs-table-border-color:#4d5154;--bs-table-striped-bg:#2c3034;--bs-table-striped-color:#fff;--bs-table-active-bg:#373b3e;--bs-table-active-color:#fff;--bs-table-hover-bg:#323539;--bs-table-hover-color:#fff;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}@media (max-width:575.98px){.table-responsive-sm{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media (max-width:767.98px){.table-responsive-md{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media (max-width:991.98px){.table-responsive-lg{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media (max-width:1199.98px){.table-responsive-xl{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media (max-width:1399.98px){.table-responsive-xxl{overflow-x:auto;-webkit-overflow-scrolling:touch}}.form-label{margin-bottom:.5rem}.col-form-label{padding-top:calc(.375rem + 1px);padding-top:calc(.375rem + var(--bs-border-width));padding-bottom:calc(.375rem + 1px);padding-bottom:calc(.375rem + var(--bs-border-width));margin-bottom:0;font-size:inherit;line-height:1.5}.col-form-label-lg{padding-top:calc(.5rem + 1px);padding-top:calc(.5rem + var(--bs-border-width));padding-bottom:calc(.5rem + 1px);padding-bottom:calc(.5rem + var(--bs-border-width));font-size:1.25rem}.col-form-label-sm{padding-top:calc(.25rem + 1px);padding-top:calc(.25rem + var(--bs-border-width));padding-bottom:calc(.25rem + 1px);padding-bottom:calc(.25rem + var(--bs-border-width));font-size:.875rem}.form-text{margin-top:.25rem;font-size:.875em;color:rgba(33, 37, 41, 0.75);color:var(--bs-secondary-color)}.form-control{display:block;width:100%;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:#212529;color:var(--bs-body-color);-webkit-appearance:none;appearance:none;background-color:#fff;background-color:var(--bs-body-bg);background-clip:padding-box;border:1px solid #dee2e6;border:var(--bs-border-width) solid var(--bs-border-color);border-radius:0.375rem;border-radius:var(--bs-border-radius);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.form-control{transition:none}}.form-control[type=file]{overflow:hidden}.form-control[type=file]:not(:disabled):not([readonly]){cursor:pointer}.form-control:focus{color:#212529;color:var(--bs-body-color);background-color:#fff;background-color:var(--bs-body-bg);border-color:#86b7fe;outline:0;box-shadow:0 0 0 .25rem rgba(13,110,253,.25)}.form-control::-webkit-date-and-time-value{min-width:85px;height:1.5em;margin:0}.form-control::-webkit-datetime-edit{display:block;padding:0}.form-control::placeholder{color:rgba(33, 37, 41, 0.75);color:var(--bs-secondary-color);opacity:1}.form-control:disabled{background-color:#e9ecef;background-color:var(--bs-secondary-bg);opacity:1}.form-control::-webkit-file-upload-button{padding:.375rem .75rem;margin:-.375rem -.75rem;-webkit-margin-end:.75rem;margin-inline-end:.75rem;color:#212529;color:var(--bs-body-color);background-color:#f8f9fa;background-color:var(--bs-tertiary-bg);pointer-events:none;border-color:inherit;border-style:solid;border-width:0;border-inline-end-width:1px;border-inline-end-width:var(--bs-border-width);border-radius:0;-webkit-transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}.form-control::file-selector-button{padding:.375rem .75rem;margin:-.375rem -.75rem;-webkit-margin-end:.75rem;margin-inline-end:.75rem;color:#212529;color:var(--bs-body-color);background-color:#f8f9fa;background-color:var(--bs-tertiary-bg);pointer-events:none;border-color:inherit;border-style:solid;border-width:0;border-inline-end-width:1px;border-inline-end-width:var(--bs-border-width);border-radius:0;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.form-control::-webkit-file-upload-button{-webkit-transition:none;transition:none}.form-control::file-selector-button{transition:none}}.form-control:hover:not(:disabled):not([readonly])::-webkit-file-upload-button{background-color:#e9ecef;background-color:var(--bs-secondary-bg)}.form-control:hover:not(:disabled):not([readonly])::file-selector-button{background-color:#e9ecef;background-color:var(--bs-secondary-bg)}.form-control-plaintext{display:block;width:100%;padding:.375rem 0;margin-bottom:0;line-height:1.5;color:#212529;color:var(--bs-body-color);background-color:transparent;border:solid transparent;border-width:1px 0;border-width:var(--bs-border-width) 0}.form-control-plaintext:focus{outline:0}.form-control-plaintext.form-control-lg,.form-control-plaintext.form-control-sm{padding-right:0;padding-left:0}.form-control-sm{min-height:calc(1.5em + .5rem + calc(1px * 2));min-height:calc(1.5em + .5rem + calc(var(--bs-border-width) * 2));padding:.25rem .5rem;font-size:.875rem;border-radius:0.25rem;border-radius:var(--bs-border-radius-sm)}.form-control-sm::-webkit-file-upload-button{padding:.25rem .5rem;margin:-.25rem -.5rem;-webkit-margin-end:.5rem;margin-inline-end:.5rem}.form-control-sm::file-selector-button{padding:.25rem .5rem;margin:-.25rem -.5rem;-webkit-margin-end:.5rem;margin-inline-end:.5rem}.form-control-lg{min-height:calc(1.5em + 1rem + calc(1px * 2));min-height:calc(1.5em + 1rem + calc(var(--bs-border-width) * 2));padding:.5rem 1rem;font-size:1.25rem;border-radius:0.5rem;border-radius:var(--bs-border-radius-lg)}.form-control-lg::-webkit-file-upload-button{padding:.5rem 1rem;margin:-.5rem -1rem;-webkit-margin-end:1rem;margin-inline-end:1rem}.form-control-lg::file-selector-button{padding:.5rem 1rem;margin:-.5rem -1rem;-webkit-margin-end:1rem;margin-inline-end:1rem}textarea.form-control{min-height:calc(1.5em + .75rem + calc(1px * 2));min-height:calc(1.5em + .75rem + calc(var(--bs-border-width) * 2))}textarea.form-control-sm{min-height:calc(1.5em + .5rem + calc(1px * 2));min-height:calc(1.5em + .5rem + calc(var(--bs-border-width) * 2))}textarea.form-control-lg{min-height:calc(1.5em + 1rem + calc(1px * 2));min-height:calc(1.5em + 1rem + calc(var(--bs-border-width) * 2))}.form-control-color{width:3rem;height:calc(1.5em + .75rem + calc(1px * 2));height:calc(1.5em + .75rem + calc(var(--bs-border-width) * 2));padding:.375rem}.form-control-color:not(:disabled):not([readonly]){cursor:pointer}.form-control-color::-moz-color-swatch{border:0!important;border-radius:0.375rem;border-radius:var(--bs-border-radius)}.form-control-color::-webkit-color-swatch{border:0!important;border-radius:0.375rem;border-radius:var(--bs-border-radius)}.form-control-color.form-control-sm{height:calc(1.5em + .5rem + calc(1px * 2));height:calc(1.5em + .5rem + calc(var(--bs-border-width) * 2))}.form-control-color.form-control-lg{height:calc(1.5em + 1rem + calc(1px * 2));height:calc(1.5em + 1rem + calc(var(--bs-border-width) * 2))}.form-select{--bs-form-select-bg-img:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 16 16%27%3e%3cpath fill=%27none%27 stroke=%27%23343a40%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%272%27 d=%27m2 5 6 6 6-6%27/%3e%3c/svg%3e");display:block;width:100%;padding:.375rem 2.25rem .375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:#212529;color:var(--bs-body-color);-webkit-appearance:none;appearance:none;background-color:#fff;background-color:var(--bs-body-bg);background-image:var(--bs-form-select-bg-img),none;background-image:var(--bs-form-select-bg-img),var(--bs-form-select-bg-icon,none);background-repeat:no-repeat;background-position:right .75rem center;background-size:16px 12px;border:1px solid #dee2e6;border:var(--bs-border-width) solid var(--bs-border-color);border-radius:0.375rem;border-radius:var(--bs-border-radius);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.form-select{transition:none}}.form-select:focus{border-color:#86b7fe;outline:0;box-shadow:0 0 0 .25rem rgba(13,110,253,.25)}.form-select[multiple],.form-select[size]:not([size="1"]){padding-right:.75rem;background-image:none}.form-select:disabled{background-color:#e9ecef;background-color:var(--bs-secondary-bg)}.form-select:-moz-focusring{color:transparent;text-shadow:0 0 0 #212529;text-shadow:0 0 0 var(--bs-body-color)}.form-select-sm{padding-top:.25rem;padding-bottom:.25rem;padding-left:.5rem;font-size:.875rem;border-radius:0.25rem;border-radius:var(--bs-border-radius-sm)}.form-select-lg{padding-top:.5rem;padding-bottom:.5rem;padding-left:1rem;font-size:1.25rem;border-radius:0.5rem;border-radius:var(--bs-border-radius-lg)}[data-bs-theme=dark] .form-select{--bs-form-select-bg-img:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 16 16%27%3e%3cpath fill=%27none%27 stroke=%27%23dee2e6%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%272%27 d=%27m2 5 6 6 6-6%27/%3e%3c/svg%3e")}.form-check{display:block;min-height:1.5rem;padding-left:1.5em;margin-bottom:.125rem}.form-check .form-check-input{float:left;margin-left:-1.5em}.form-check-reverse{padding-right:1.5em;padding-left:0;text-align:right}.form-check-reverse .form-check-input{float:right;margin-right:-1.5em;margin-left:0}.form-check-input{--bs-form-check-bg:var(--bs-body-bg);flex-shrink:0;width:1em;height:1em;margin-top:.25em;vertical-align:top;-webkit-appearance:none;appearance:none;background-color:var(--bs-form-check-bg);background-image:var(--bs-form-check-bg-image);background-repeat:no-repeat;background-position:center;background-size:contain;border:1px solid #dee2e6;border:var(--bs-border-width) solid var(--bs-border-color);-webkit-print-color-adjust:exact;print-color-adjust:exact}.form-check-input[type=checkbox]{border-radius:.25em}.form-check-input[type=radio]{border-radius:50%}.form-check-input:active{filter:brightness(90%)}.form-check-input:focus{border-color:#86b7fe;outline:0;box-shadow:0 0 0 .25rem rgba(13,110,253,.25)}.form-check-input:checked{background-color:#0d6efd;border-color:#0d6efd}.form-check-input:checked[type=checkbox]{--bs-form-check-bg-image:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 20 20%27%3e%3cpath fill=%27none%27 stroke=%27%23fff%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%273%27 d=%27m6 10 3 3 6-6%27/%3e%3c/svg%3e")}.form-check-input:checked[type=radio]{--bs-form-check-bg-image:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%27-4 -4 8 8%27%3e%3ccircle r=%272%27 fill=%27%23fff%27/%3e%3c/svg%3e")}.form-check-input[type=checkbox]:indeterminate{background-color:#0d6efd;border-color:#0d6efd;--bs-form-check-bg-image:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 20 20%27%3e%3cpath fill=%27none%27 stroke=%27%23fff%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%273%27 d=%27M6 10h8%27/%3e%3c/svg%3e")}.form-check-input:disabled{pointer-events:none;filter:none;opacity:.5}.form-check-input:disabled~.form-check-label,.form-check-input[disabled]~.form-check-label{cursor:default;opacity:.5}.form-switch{padding-left:2.5em}.form-switch .form-check-input{--bs-form-switch-bg:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%27-4 -4 8 8%27%3e%3ccircle r=%273%27 fill=%27rgba%280, 0, 0, 0.25%29%27/%3e%3c/svg%3e");width:2em;margin-left:-2.5em;background-image:var(--bs-form-switch-bg);background-position:left center;border-radius:2em;transition:background-position .15s ease-in-out}@media (prefers-reduced-motion:reduce){.form-switch .form-check-input{transition:none}}.form-switch .form-check-input:focus{--bs-form-switch-bg:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%27-4 -4 8 8%27%3e%3ccircle r=%273%27 fill=%27%2386b7fe%27/%3e%3c/svg%3e")}.form-switch .form-check-input:checked{background-position:right center;--bs-form-switch-bg:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%27-4 -4 8 8%27%3e%3ccircle r=%273%27 fill=%27%23fff%27/%3e%3c/svg%3e")}.form-switch.form-check-reverse{padding-right:2.5em;padding-left:0}.form-switch.form-check-reverse .form-check-input{margin-right:-2.5em;margin-left:0}.form-check-inline{display:inline-block;margin-right:1rem}.btn-check{position:absolute;clip:rect(0,0,0,0);pointer-events:none}.btn-check:disabled+.btn,.btn-check[disabled]+.btn{pointer-events:none;filter:none;opacity:.65}[data-bs-theme=dark] .form-switch .form-check-input:not(:checked):not(:focus){--bs-form-switch-bg:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%27-4 -4 8 8%27%3e%3ccircle r=%273%27 fill=%27rgba%28255, 255, 255, 0.25%29%27/%3e%3c/svg%3e")}.form-range{width:100%;height:1.5rem;padding:0;-webkit-appearance:none;appearance:none;background-color:transparent}.form-range:focus{outline:0}.form-range:focus::-webkit-slider-thumb{box-shadow:0 0 0 1px #fff,0 0 0 .25rem rgba(13,110,253,.25)}.form-range:focus::-moz-range-thumb{box-shadow:0 0 0 1px #fff,0 0 0 .25rem rgba(13,110,253,.25)}.form-range::-moz-focus-outer{border:0}.form-range::-webkit-slider-thumb{width:1rem;height:1rem;margin-top:-.25rem;-webkit-appearance:none;appearance:none;background-color:#0d6efd;border:0;border-radius:1rem;-webkit-transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.form-range::-webkit-slider-thumb{-webkit-transition:none;transition:none}}.form-range::-webkit-slider-thumb:active{background-color:#b6d4fe}.form-range::-webkit-slider-runnable-track{width:100%;height:.5rem;color:transparent;cursor:pointer;background-color:#e9ecef;background-color:var(--bs-secondary-bg);border-color:transparent;border-radius:1rem}.form-range::-moz-range-thumb{width:1rem;height:1rem;appearance:none;background-color:#0d6efd;border:0;border-radius:1rem;-moz-transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.form-range::-moz-range-thumb{-moz-transition:none;transition:none}}.form-range::-moz-range-thumb:active{background-color:#b6d4fe}.form-range::-moz-range-track{width:100%;height:.5rem;color:transparent;cursor:pointer;background-color:#e9ecef;background-color:var(--bs-secondary-bg);border-color:transparent;border-radius:1rem}.form-range:disabled{pointer-events:none}.form-range:disabled::-webkit-slider-thumb{background-color:rgba(33, 37, 41, 0.75);background-color:var(--bs-secondary-color)}.form-range:disabled::-moz-range-thumb{background-color:rgba(33, 37, 41, 0.75);background-color:var(--bs-secondary-color)}.form-floating{position:relative}.form-floating>.form-control,.form-floating>.form-control-plaintext,.form-floating>.form-select{height:calc(3.5rem + calc(1px * 2));height:calc(3.5rem + calc(var(--bs-border-width) * 2));min-height:calc(3.5rem + calc(1px * 2));min-height:calc(3.5rem + calc(var(--bs-border-width) * 2));line-height:1.25}.form-floating>label{position:absolute;top:0;left:0;z-index:2;max-width:100%;height:100%;padding:1rem .75rem;overflow:hidden;color:rgba(33,37,41,.65);color:rgba(var(--bs-body-color-rgb),.65);text-align:start;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;border:1px solid transparent;border:var(--bs-border-width) solid transparent;transform-origin:0 0;transition:opacity .1s ease-in-out,transform .1s ease-in-out}@media (prefers-reduced-motion:reduce){.form-floating>label{transition:none}}.form-floating>.form-control,.form-floating>.form-control-plaintext{padding:1rem .75rem}.form-floating>.form-control-plaintext::placeholder,.form-floating>.form-control::placeholder{color:transparent}.form-floating>.form-control-plaintext:focus,.form-floating>.form-control-plaintext:not(:placeholder-shown),.form-floating>.form-control:focus,.form-floating>.form-control:not(:placeholder-shown){padding-top:1.625rem;padding-bottom:.625rem}.form-floating>.form-control-plaintext:-webkit-autofill,.form-floating>.form-control:-webkit-autofill{padding-top:1.625rem;padding-bottom:.625rem}.form-floating>.form-select{padding-top:1.625rem;padding-bottom:.625rem;padding-left:.75rem}.form-floating>.form-control-plaintext~label,.form-floating>.form-control:focus~label,.form-floating>.form-control:not(:placeholder-shown)~label,.form-floating>.form-select~label{transform:scale(.85) translateY(-.5rem) translateX(.15rem)}.form-floating>.form-control:-webkit-autofill~label{transform:scale(.85) translateY(-.5rem) translateX(.15rem)}.form-floating>textarea:focus~label::after,.form-floating>textarea:not(:placeholder-shown)~label::after{position:absolute;inset:1rem 0.375rem;z-index:-1;height:1.5em;content:"";background-color:#fff;background-color:var(--bs-body-bg);border-radius:0.375rem;border-radius:var(--bs-border-radius)}.form-floating>textarea:disabled~label::after{background-color:#e9ecef;background-color:var(--bs-secondary-bg)}.form-floating>.form-control-plaintext~label{border-width:1px 0;border-width:var(--bs-border-width) 0}.form-floating>.form-control:disabled~label,.form-floating>:disabled~label{color:#6c757d}.input-group{position:relative;display:flex;flex-wrap:wrap;align-items:stretch;width:100%}.input-group>.form-control,.input-group>.form-floating,.input-group>.form-select{position:relative;flex:1 1 auto;width:1%;min-width:0}.input-group>.form-control:focus,.input-group>.form-floating:focus-within,.input-group>.form-select:focus{z-index:5}.input-group .btn{position:relative;z-index:2}.input-group .btn:focus{z-index:5}.input-group-text{display:flex;align-items:center;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:#212529;color:var(--bs-body-color);text-align:center;white-space:nowrap;background-color:#f8f9fa;background-color:var(--bs-tertiary-bg);border:1px solid #dee2e6;border:var(--bs-border-width) solid var(--bs-border-color);border-radius:0.375rem;border-radius:var(--bs-border-radius)}.input-group-lg>.btn,.input-group-lg>.form-control,.input-group-lg>.form-select,.input-group-lg>.input-group-text{padding:.5rem 1rem;font-size:1.25rem;border-radius:0.5rem;border-radius:var(--bs-border-radius-lg)}.input-group-sm>.btn,.input-group-sm>.form-control,.input-group-sm>.form-select,.input-group-sm>.input-group-text{padding:.25rem .5rem;font-size:.875rem;border-radius:0.25rem;border-radius:var(--bs-border-radius-sm)}.input-group-lg>.form-select,.input-group-sm>.form-select{padding-right:3rem}.input-group:not(.has-validation)>.dropdown-toggle:nth-last-child(n+3),.input-group:not(.has-validation)>.form-floating:not(:last-child)>.form-control,.input-group:not(.has-validation)>.form-floating:not(:last-child)>.form-select,.input-group:not(.has-validation)>:not(:last-child):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating){border-top-right-radius:0;border-bottom-right-radius:0}.input-group.has-validation>.dropdown-toggle:nth-last-child(n+4),.input-group.has-validation>.form-floating:nth-last-child(n+3)>.form-control,.input-group.has-validation>.form-floating:nth-last-child(n+3)>.form-select,.input-group.has-validation>:nth-last-child(n+3):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating){border-top-right-radius:0;border-bottom-right-radius:0}.input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback){margin-left:calc(-1 * 1px);margin-left:calc(-1 * var(--bs-border-width));border-top-left-radius:0;border-bottom-left-radius:0}.input-group>.form-floating:not(:first-child)>.form-control,.input-group>.form-floating:not(:first-child)>.form-select{border-top-left-radius:0;border-bottom-left-radius:0}.valid-feedback{display:none;width:100%;margin-top:.25rem;font-size:.875em;color:#198754;color:var(--bs-form-valid-color)}.valid-tooltip{position:absolute;top:100%;z-index:5;display:none;max-width:100%;padding:.25rem .5rem;margin-top:.1rem;font-size:.875rem;color:#fff;background-color:#198754;background-color:var(--bs-success);border-radius:0.375rem;border-radius:var(--bs-border-radius)}.is-valid~.valid-feedback,.is-valid~.valid-tooltip,.was-validated :valid~.valid-feedback,.was-validated :valid~.valid-tooltip{display:block}.form-control.is-valid,.was-validated .form-control:valid{border-color:#198754;border-color:var(--bs-form-valid-border-color);padding-right:calc(1.5em + .75rem);background-image:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 8 8%27%3e%3cpath fill=%27%23198754%27 d=%27M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1%27/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right calc(.375em + .1875rem) center;background-size:calc(.75em + .375rem) calc(.75em + .375rem)}.form-control.is-valid:focus,.was-validated .form-control:valid:focus{border-color:#198754;border-color:var(--bs-form-valid-border-color);box-shadow:0 0 0 .25rem rgba(25,135,84,.25);box-shadow:0 0 0 .25rem rgba(var(--bs-success-rgb),.25)}.was-validated textarea.form-control:valid,textarea.form-control.is-valid{padding-right:calc(1.5em + .75rem);background-position:top calc(.375em + .1875rem) right calc(.375em + .1875rem)}.form-select.is-valid,.was-validated .form-select:valid{border-color:#198754;border-color:var(--bs-form-valid-border-color)}.form-select.is-valid:not([multiple]):not([size]),.form-select.is-valid:not([multiple])[size="1"],.was-validated .form-select:valid:not([multiple]):not([size]),.was-validated .form-select:valid:not([multiple])[size="1"]{--bs-form-select-bg-icon:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 8 8%27%3e%3cpath fill=%27%23198754%27 d=%27M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1%27/%3e%3c/svg%3e");padding-right:4.125rem;background-position:right .75rem center,center right 2.25rem;background-size:16px 12px,calc(.75em + .375rem) calc(.75em + .375rem)}.form-select.is-valid:focus,.was-validated .form-select:valid:focus{border-color:#198754;border-color:var(--bs-form-valid-border-color);box-shadow:0 0 0 .25rem rgba(25,135,84,.25);box-shadow:0 0 0 .25rem rgba(var(--bs-success-rgb),.25)}.form-control-color.is-valid,.was-validated .form-control-color:valid{width:calc(3rem + calc(1.5em + .75rem))}.form-check-input.is-valid,.was-validated .form-check-input:valid{border-color:#198754;border-color:var(--bs-form-valid-border-color)}.form-check-input.is-valid:checked,.was-validated .form-check-input:valid:checked{background-color:#198754;background-color:var(--bs-form-valid-color)}.form-check-input.is-valid:focus,.was-validated .form-check-input:valid:focus{box-shadow:0 0 0 .25rem rgba(25,135,84,.25);box-shadow:0 0 0 .25rem rgba(var(--bs-success-rgb),.25)}.form-check-input.is-valid~.form-check-label,.was-validated .form-check-input:valid~.form-check-label{color:#198754;color:var(--bs-form-valid-color)}.form-check-inline .form-check-input~.valid-feedback{margin-left:.5em}.input-group>.form-control:not(:focus).is-valid,.input-group>.form-floating:not(:focus-within).is-valid,.input-group>.form-select:not(:focus).is-valid,.was-validated .input-group>.form-control:not(:focus):valid,.was-validated .input-group>.form-floating:not(:focus-within):valid,.was-validated .input-group>.form-select:not(:focus):valid{z-index:3}.invalid-feedback{display:none;width:100%;margin-top:.25rem;font-size:.875em;color:#dc3545;color:var(--bs-form-invalid-color)}.invalid-tooltip{position:absolute;top:100%;z-index:5;display:none;max-width:100%;padding:.25rem .5rem;margin-top:.1rem;font-size:.875rem;color:#fff;background-color:#dc3545;background-color:var(--bs-danger);border-radius:0.375rem;border-radius:var(--bs-border-radius)}.is-invalid~.invalid-feedback,.is-invalid~.invalid-tooltip,.was-validated :invalid~.invalid-feedback,.was-validated :invalid~.invalid-tooltip{display:block}.form-control.is-invalid,.was-validated .form-control:invalid{border-color:#dc3545;border-color:var(--bs-form-invalid-border-color);padding-right:calc(1.5em + .75rem);background-image:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 12 12%27 width=%2712%27 height=%2712%27 fill=%27none%27 stroke=%27%23dc3545%27%3e%3ccircle cx=%276%27 cy=%276%27 r=%274.5%27/%3e%3cpath stroke-linejoin=%27round%27 d=%27M5.8 3.6h.4L6 6.5z%27/%3e%3ccircle cx=%276%27 cy=%278.2%27 r=%27.6%27 fill=%27%23dc3545%27 stroke=%27none%27/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right calc(.375em + .1875rem) center;background-size:calc(.75em + .375rem) calc(.75em + .375rem)}.form-control.is-invalid:focus,.was-validated .form-control:invalid:focus{border-color:#dc3545;border-color:var(--bs-form-invalid-border-color);box-shadow:0 0 0 .25rem rgba(220,53,69,.25);box-shadow:0 0 0 .25rem rgba(var(--bs-danger-rgb),.25)}.was-validated textarea.form-control:invalid,textarea.form-control.is-invalid{padding-right:calc(1.5em + .75rem);background-position:top calc(.375em + .1875rem) right calc(.375em + .1875rem)}.form-select.is-invalid,.was-validated .form-select:invalid{border-color:#dc3545;border-color:var(--bs-form-invalid-border-color)}.form-select.is-invalid:not([multiple]):not([size]),.form-select.is-invalid:not([multiple])[size="1"],.was-validated .form-select:invalid:not([multiple]):not([size]),.was-validated .form-select:invalid:not([multiple])[size="1"]{--bs-form-select-bg-icon:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 12 12%27 width=%2712%27 height=%2712%27 fill=%27none%27 stroke=%27%23dc3545%27%3e%3ccircle cx=%276%27 cy=%276%27 r=%274.5%27/%3e%3cpath stroke-linejoin=%27round%27 d=%27M5.8 3.6h.4L6 6.5z%27/%3e%3ccircle cx=%276%27 cy=%278.2%27 r=%27.6%27 fill=%27%23dc3545%27 stroke=%27none%27/%3e%3c/svg%3e");padding-right:4.125rem;background-position:right .75rem center,center right 2.25rem;background-size:16px 12px,calc(.75em + .375rem) calc(.75em + .375rem)}.form-select.is-invalid:focus,.was-validated .form-select:invalid:focus{border-color:#dc3545;border-color:var(--bs-form-invalid-border-color);box-shadow:0 0 0 .25rem rgba(220,53,69,.25);box-shadow:0 0 0 .25rem rgba(var(--bs-danger-rgb),.25)}.form-control-color.is-invalid,.was-validated .form-control-color:invalid{width:calc(3rem + calc(1.5em + .75rem))}.form-check-input.is-invalid,.was-validated .form-check-input:invalid{border-color:#dc3545;border-color:var(--bs-form-invalid-border-color)}.form-check-input.is-invalid:checked,.was-validated .form-check-input:invalid:checked{background-color:#dc3545;background-color:var(--bs-form-invalid-color)}.form-check-input.is-invalid:focus,.was-validated .form-check-input:invalid:focus{box-shadow:0 0 0 .25rem rgba(220,53,69,.25);box-shadow:0 0 0 .25rem rgba(var(--bs-danger-rgb),.25)}.form-check-input.is-invalid~.form-check-label,.was-validated .form-check-input:invalid~.form-check-label{color:#dc3545;color:var(--bs-form-invalid-color)}.form-check-inline .form-check-input~.invalid-feedback{margin-left:.5em}.input-group>.form-control:not(:focus).is-invalid,.input-group>.form-floating:not(:focus-within).is-invalid,.input-group>.form-select:not(:focus).is-invalid,.was-validated .input-group>.form-control:not(:focus):invalid,.was-validated .input-group>.form-floating:not(:focus-within):invalid,.was-validated .input-group>.form-select:not(:focus):invalid{z-index:4}.btn{--bs-btn-padding-x:0.75rem;--bs-btn-padding-y:0.375rem;--bs-btn-font-family: ;--bs-btn-font-size:1rem;--bs-btn-font-weight:400;--bs-btn-line-height:1.5;--bs-btn-color:var(--bs-body-color);--bs-btn-bg:transparent;--bs-btn-border-width:var(--bs-border-width);--bs-btn-border-color:transparent;--bs-btn-border-radius:var(--bs-border-radius);--bs-btn-hover-border-color:transparent;--bs-btn-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.15),0 1px 1px rgba(0, 0, 0, 0.075);--bs-btn-disabled-opacity:0.65;--bs-btn-focus-box-shadow:0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);display:inline-block;padding:var(--bs-btn-padding-y) var(--bs-btn-padding-x);font-family:var(--bs-btn-font-family);font-size:var(--bs-btn-font-size);font-weight:var(--bs-btn-font-weight);line-height:var(--bs-btn-line-height);color:var(--bs-btn-color);text-align:center;text-decoration:none;vertical-align:middle;cursor:pointer;-webkit-user-select:none;user-select:none;border:var(--bs-btn-border-width) solid var(--bs-btn-border-color);border-radius:var(--bs-btn-border-radius);background-color:var(--bs-btn-bg);transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.btn{transition:none}}.btn:hover{color:var(--bs-btn-hover-color);background-color:var(--bs-btn-hover-bg);border-color:var(--bs-btn-hover-border-color)}.btn-check+.btn:hover{color:var(--bs-btn-color);background-color:var(--bs-btn-bg);border-color:var(--bs-btn-border-color)}.btn:focus-visible{color:var(--bs-btn-hover-color);background-color:var(--bs-btn-hover-bg);border-color:var(--bs-btn-hover-border-color);outline:0;box-shadow:var(--bs-btn-focus-box-shadow)}.btn-check:focus-visible+.btn{border-color:var(--bs-btn-hover-border-color);outline:0;box-shadow:var(--bs-btn-focus-box-shadow)}.btn-check:checked+.btn,.btn.active,.btn.show,.btn:first-child:active,:not(.btn-check)+.btn:active{color:var(--bs-btn-active-color);background-color:var(--bs-btn-active-bg);border-color:var(--bs-btn-active-border-color)}.btn-check:checked+.btn:focus-visible,.btn.active:focus-visible,.btn.show:focus-visible,.btn:first-child:active:focus-visible,:not(.btn-check)+.btn:active:focus-visible{box-shadow:var(--bs-btn-focus-box-shadow)}.btn-check:checked:focus-visible+.btn{box-shadow:var(--bs-btn-focus-box-shadow)}.btn.disabled,.btn:disabled,fieldset:disabled .btn{color:var(--bs-btn-disabled-color);pointer-events:none;background-color:var(--bs-btn-disabled-bg);border-color:var(--bs-btn-disabled-border-color);opacity:var(--bs-btn-disabled-opacity)}.btn-primary{--bs-btn-color:#fff;--bs-btn-bg:#0d6efd;--bs-btn-border-color:#0d6efd;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#0b5ed7;--bs-btn-hover-border-color:#0a58ca;--bs-btn-focus-shadow-rgb:49,132,253;--bs-btn-active-color:#fff;--bs-btn-active-bg:#0a58ca;--bs-btn-active-border-color:#0a53be;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#0d6efd;--bs-btn-disabled-border-color:#0d6efd}.btn-secondary{--bs-btn-color:#fff;--bs-btn-bg:#6c757d;--bs-btn-border-color:#6c757d;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#5c636a;--bs-btn-hover-border-color:#565e64;--bs-btn-focus-shadow-rgb:130,138,145;--bs-btn-active-color:#fff;--bs-btn-active-bg:#565e64;--bs-btn-active-border-color:#51585e;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#6c757d;--bs-btn-disabled-border-color:#6c757d}.btn-success{--bs-btn-color:#fff;--bs-btn-bg:#198754;--bs-btn-border-color:#198754;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#157347;--bs-btn-hover-border-color:#146c43;--bs-btn-focus-shadow-rgb:60,153,110;--bs-btn-active-color:#fff;--bs-btn-active-bg:#146c43;--bs-btn-active-border-color:#13653f;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#198754;--bs-btn-disabled-border-color:#198754}.btn-info{--bs-btn-color:#000;--bs-btn-bg:#0dcaf0;--bs-btn-border-color:#0dcaf0;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#31d2f2;--bs-btn-hover-border-color:#25cff2;--bs-btn-focus-shadow-rgb:11,172,204;--bs-btn-active-color:#000;--bs-btn-active-bg:#3dd5f3;--bs-btn-active-border-color:#25cff2;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#000;--bs-btn-disabled-bg:#0dcaf0;--bs-btn-disabled-border-color:#0dcaf0}.btn-warning{--bs-btn-color:#000;--bs-btn-bg:#ffc107;--bs-btn-border-color:#ffc107;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#ffca2c;--bs-btn-hover-border-color:#ffc720;--bs-btn-focus-shadow-rgb:217,164,6;--bs-btn-active-color:#000;--bs-btn-active-bg:#ffcd39;--bs-btn-active-border-color:#ffc720;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#000;--bs-btn-disabled-bg:#ffc107;--bs-btn-disabled-border-color:#ffc107}.btn-danger{--bs-btn-color:#fff;--bs-btn-bg:#dc3545;--bs-btn-border-color:#dc3545;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#bb2d3b;--bs-btn-hover-border-color:#b02a37;--bs-btn-focus-shadow-rgb:225,83,97;--bs-btn-active-color:#fff;--bs-btn-active-bg:#b02a37;--bs-btn-active-border-color:#a52834;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#dc3545;--bs-btn-disabled-border-color:#dc3545}.btn-light{--bs-btn-color:#000;--bs-btn-bg:#f8f9fa;--bs-btn-border-color:#f8f9fa;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#d3d4d5;--bs-btn-hover-border-color:#c6c7c8;--bs-btn-focus-shadow-rgb:211,212,213;--bs-btn-active-color:#000;--bs-btn-active-bg:#c6c7c8;--bs-btn-active-border-color:#babbbc;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#000;--bs-btn-disabled-bg:#f8f9fa;--bs-btn-disabled-border-color:#f8f9fa}.btn-dark{--bs-btn-color:#fff;--bs-btn-bg:#212529;--bs-btn-border-color:#212529;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#424649;--bs-btn-hover-border-color:#373b3e;--bs-btn-focus-shadow-rgb:66,70,73;--bs-btn-active-color:#fff;--bs-btn-active-bg:#4d5154;--bs-btn-active-border-color:#373b3e;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#212529;--bs-btn-disabled-border-color:#212529}.btn-outline-primary{--bs-btn-color:#0d6efd;--bs-btn-border-color:#0d6efd;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#0d6efd;--bs-btn-hover-border-color:#0d6efd;--bs-btn-focus-shadow-rgb:13,110,253;--bs-btn-active-color:#fff;--bs-btn-active-bg:#0d6efd;--bs-btn-active-border-color:#0d6efd;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#0d6efd;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#0d6efd;--bs-gradient:none}.btn-outline-secondary{--bs-btn-color:#6c757d;--bs-btn-border-color:#6c757d;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#6c757d;--bs-btn-hover-border-color:#6c757d;--bs-btn-focus-shadow-rgb:108,117,125;--bs-btn-active-color:#fff;--bs-btn-active-bg:#6c757d;--bs-btn-active-border-color:#6c757d;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#6c757d;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#6c757d;--bs-gradient:none}.btn-outline-success{--bs-btn-color:#198754;--bs-btn-border-color:#198754;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#198754;--bs-btn-hover-border-color:#198754;--bs-btn-focus-shadow-rgb:25,135,84;--bs-btn-active-color:#fff;--bs-btn-active-bg:#198754;--bs-btn-active-border-color:#198754;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#198754;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#198754;--bs-gradient:none}.btn-outline-info{--bs-btn-color:#0dcaf0;--bs-btn-border-color:#0dcaf0;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#0dcaf0;--bs-btn-hover-border-color:#0dcaf0;--bs-btn-focus-shadow-rgb:13,202,240;--bs-btn-active-color:#000;--bs-btn-active-bg:#0dcaf0;--bs-btn-active-border-color:#0dcaf0;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#0dcaf0;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#0dcaf0;--bs-gradient:none}.btn-outline-warning{--bs-btn-color:#ffc107;--bs-btn-border-color:#ffc107;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#ffc107;--bs-btn-hover-border-color:#ffc107;--bs-btn-focus-shadow-rgb:255,193,7;--bs-btn-active-color:#000;--bs-btn-active-bg:#ffc107;--bs-btn-active-border-color:#ffc107;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#ffc107;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#ffc107;--bs-gradient:none}.btn-outline-danger{--bs-btn-color:#dc3545;--bs-btn-border-color:#dc3545;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#dc3545;--bs-btn-hover-border-color:#dc3545;--bs-btn-focus-shadow-rgb:220,53,69;--bs-btn-active-color:#fff;--bs-btn-active-bg:#dc3545;--bs-btn-active-border-color:#dc3545;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#dc3545;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#dc3545;--bs-gradient:none}.btn-outline-light{--bs-btn-color:#f8f9fa;--bs-btn-border-color:#f8f9fa;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#f8f9fa;--bs-btn-hover-border-color:#f8f9fa;--bs-btn-focus-shadow-rgb:248,249,250;--bs-btn-active-color:#000;--bs-btn-active-bg:#f8f9fa;--bs-btn-active-border-color:#f8f9fa;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#f8f9fa;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#f8f9fa;--bs-gradient:none}.btn-outline-dark{--bs-btn-color:#212529;--bs-btn-border-color:#212529;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#212529;--bs-btn-hover-border-color:#212529;--bs-btn-focus-shadow-rgb:33,37,41;--bs-btn-active-color:#fff;--bs-btn-active-bg:#212529;--bs-btn-active-border-color:#212529;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#212529;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#212529;--bs-gradient:none}.btn-link{--bs-btn-font-weight:400;--bs-btn-color:var(--bs-link-color);--bs-btn-bg:transparent;--bs-btn-border-color:transparent;--bs-btn-hover-color:var(--bs-link-hover-color);--bs-btn-hover-border-color:transparent;--bs-btn-active-color:var(--bs-link-hover-color);--bs-btn-active-border-color:transparent;--bs-btn-disabled-color:#6c757d;--bs-btn-disabled-border-color:transparent;--bs-btn-box-shadow:0 0 0 #000;--bs-btn-focus-shadow-rgb:49,132,253;text-decoration:underline}.btn-link:focus-visible{color:var(--bs-btn-color)}.btn-link:hover{color:var(--bs-btn-hover-color)}.btn-group-lg>.btn,.btn-lg{--bs-btn-padding-y:0.5rem;--bs-btn-padding-x:1rem;--bs-btn-font-size:1.25rem;--bs-btn-border-radius:var(--bs-border-radius-lg)}.btn-group-sm>.btn,.btn-sm{--bs-btn-padding-y:0.25rem;--bs-btn-padding-x:0.5rem;--bs-btn-font-size:0.875rem;--bs-btn-border-radius:var(--bs-border-radius-sm)}.fade{transition:opacity .15s linear}@media (prefers-reduced-motion:reduce){.fade{transition:none}}.fade:not(.show){opacity:0}.collapse:not(.show){display:none}.collapsing{height:0;overflow:hidden;transition:height .35s ease}@media (prefers-reduced-motion:reduce){.collapsing{transition:none}}.collapsing.collapse-horizontal{width:0;height:auto;transition:width .35s ease}@media (prefers-reduced-motion:reduce){.collapsing.collapse-horizontal{transition:none}}.dropdown,.dropdown-center,.dropend,.dropstart,.dropup,.dropup-center{position:relative}.dropdown-toggle{white-space:nowrap}.dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:"";border-top:.3em solid;border-right:.3em solid transparent;border-bottom:0;border-left:.3em solid transparent}.dropdown-toggle:empty::after{margin-left:0}.dropdown-menu{--bs-dropdown-zindex:1000;--bs-dropdown-min-width:10rem;--bs-dropdown-padding-x:0;--bs-dropdown-padding-y:0.5rem;--bs-dropdown-spacer:0.125rem;--bs-dropdown-font-size:1rem;--bs-dropdown-color:var(--bs-body-color);--bs-dropdown-bg:var(--bs-body-bg);--bs-dropdown-border-color:var(--bs-border-color-translucent);--bs-dropdown-border-radius:var(--bs-border-radius);--bs-dropdown-border-width:var(--bs-border-width);--bs-dropdown-inner-border-radius:calc(var(--bs-border-radius) - var(--bs-border-width));--bs-dropdown-divider-bg:var(--bs-border-color-translucent);--bs-dropdown-divider-margin-y:0.5rem;--bs-dropdown-box-shadow:var(--bs-box-shadow);--bs-dropdown-link-color:var(--bs-body-color);--bs-dropdown-link-hover-color:var(--bs-body-color);--bs-dropdown-link-hover-bg:var(--bs-tertiary-bg);--bs-dropdown-link-active-color:#fff;--bs-dropdown-link-active-bg:#0d6efd;--bs-dropdown-link-disabled-color:var(--bs-tertiary-color);--bs-dropdown-item-padding-x:1rem;--bs-dropdown-item-padding-y:0.25rem;--bs-dropdown-header-color:#6c757d;--bs-dropdown-header-padding-x:1rem;--bs-dropdown-header-padding-y:0.5rem;position:absolute;z-index:var(--bs-dropdown-zindex);display:none;min-width:var(--bs-dropdown-min-width);padding:var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x);margin:0;font-size:var(--bs-dropdown-font-size);color:var(--bs-dropdown-color);text-align:left;list-style:none;background-color:var(--bs-dropdown-bg);background-clip:padding-box;border:var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color);border-radius:var(--bs-dropdown-border-radius)}.dropdown-menu[data-bs-popper]{top:100%;left:0;margin-top:var(--bs-dropdown-spacer)}.dropdown-menu-start{--bs-position:start}.dropdown-menu-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-end{--bs-position:end}.dropdown-menu-end[data-bs-popper]{right:0;left:auto}@media (min-width:576px){.dropdown-menu-sm-start{--bs-position:start}.dropdown-menu-sm-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-sm-end{--bs-position:end}.dropdown-menu-sm-end[data-bs-popper]{right:0;left:auto}}@media (min-width:768px){.dropdown-menu-md-start{--bs-position:start}.dropdown-menu-md-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-md-end{--bs-position:end}.dropdown-menu-md-end[data-bs-popper]{right:0;left:auto}}@media (min-width:992px){.dropdown-menu-lg-start{--bs-position:start}.dropdown-menu-lg-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-lg-end{--bs-position:end}.dropdown-menu-lg-end[data-bs-popper]{right:0;left:auto}}@media (min-width:1200px){.dropdown-menu-xl-start{--bs-position:start}.dropdown-menu-xl-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-xl-end{--bs-position:end}.dropdown-menu-xl-end[data-bs-popper]{right:0;left:auto}}@media (min-width:1400px){.dropdown-menu-xxl-start{--bs-position:start}.dropdown-menu-xxl-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-xxl-end{--bs-position:end}.dropdown-menu-xxl-end[data-bs-popper]{right:0;left:auto}}.dropup .dropdown-menu[data-bs-popper]{top:auto;bottom:100%;margin-top:0;margin-bottom:var(--bs-dropdown-spacer)}.dropup .dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:"";border-top:0;border-right:.3em solid transparent;border-bottom:.3em solid;border-left:.3em solid transparent}.dropup .dropdown-toggle:empty::after{margin-left:0}.dropend .dropdown-menu[data-bs-popper]{top:0;right:auto;left:100%;margin-top:0;margin-left:var(--bs-dropdown-spacer)}.dropend .dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:"";border-top:.3em solid transparent;border-right:0;border-bottom:.3em solid transparent;border-left:.3em solid}.dropend .dropdown-toggle:empty::after{margin-left:0}.dropend .dropdown-toggle::after{vertical-align:0}.dropstart .dropdown-menu[data-bs-popper]{top:0;right:100%;left:auto;margin-top:0;margin-right:var(--bs-dropdown-spacer)}.dropstart .dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:""}.dropstart .dropdown-toggle::after{display:none}.dropstart .dropdown-toggle::before{display:inline-block;margin-right:.255em;vertical-align:.255em;content:"";border-top:.3em solid transparent;border-right:.3em solid;border-bottom:.3em solid transparent}.dropstart .dropdown-toggle:empty::after{margin-left:0}.dropstart .dropdown-toggle::before{vertical-align:0}.dropdown-divider{height:0;margin:var(--bs-dropdown-divider-margin-y) 0;overflow:hidden;border-top:1px solid var(--bs-dropdown-divider-bg);opacity:1}.dropdown-item{display:block;width:100%;padding:var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);clear:both;font-weight:400;color:var(--bs-dropdown-link-color);text-align:inherit;text-decoration:none;white-space:nowrap;background-color:transparent;border:0;border-radius:0;border-radius:var(--bs-dropdown-item-border-radius,0)}.dropdown-item:focus,.dropdown-item:hover{color:var(--bs-dropdown-link-hover-color);background-color:var(--bs-dropdown-link-hover-bg)}.dropdown-item.active,.dropdown-item:active{color:var(--bs-dropdown-link-active-color);text-decoration:none;background-color:var(--bs-dropdown-link-active-bg)}.dropdown-item.disabled,.dropdown-item:disabled{color:var(--bs-dropdown-link-disabled-color);pointer-events:none;background-color:transparent}.dropdown-menu.show{display:block}.dropdown-header{display:block;padding:var(--bs-dropdown-header-padding-y) var(--bs-dropdown-header-padding-x);margin-bottom:0;font-size:.875rem;color:var(--bs-dropdown-header-color);white-space:nowrap}.dropdown-item-text{display:block;padding:var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);color:var(--bs-dropdown-link-color)}.dropdown-menu-dark{--bs-dropdown-color:#dee2e6;--bs-dropdown-bg:#343a40;--bs-dropdown-border-color:var(--bs-border-color-translucent);--bs-dropdown-box-shadow: ;--bs-dropdown-link-color:#dee2e6;--bs-dropdown-link-hover-color:#fff;--bs-dropdown-divider-bg:var(--bs-border-color-translucent);--bs-dropdown-link-hover-bg:rgba(255, 255, 255, 0.15);--bs-dropdown-link-active-color:#fff;--bs-dropdown-link-active-bg:#0d6efd;--bs-dropdown-link-disabled-color:#adb5bd;--bs-dropdown-header-color:#adb5bd}.btn-group,.btn-group-vertical{position:relative;display:inline-flex;vertical-align:middle}.btn-group-vertical>.btn,.btn-group>.btn{position:relative;flex:1 1 auto}.btn-group-vertical>.btn-check:checked+.btn,.btn-group-vertical>.btn-check:focus+.btn,.btn-group-vertical>.btn.active,.btn-group-vertical>.btn:active,.btn-group-vertical>.btn:focus,.btn-group-vertical>.btn:hover,.btn-group>.btn-check:checked+.btn,.btn-group>.btn-check:focus+.btn,.btn-group>.btn.active,.btn-group>.btn:active,.btn-group>.btn:focus,.btn-group>.btn:hover{z-index:1}.btn-toolbar{display:flex;flex-wrap:wrap;justify-content:flex-start}.btn-toolbar .input-group{width:auto}.btn-group{border-radius:0.375rem;border-radius:var(--bs-border-radius)}.btn-group>.btn-group:not(:first-child),.btn-group>:not(.btn-check:first-child)+.btn{margin-left:calc(-1 * 1px);margin-left:calc(-1 * var(--bs-border-width))}.btn-group>.btn-group:not(:last-child)>.btn,.btn-group>.btn.dropdown-toggle-split:first-child,.btn-group>.btn:not(:last-child):not(.dropdown-toggle){border-top-right-radius:0;border-bottom-right-radius:0}.btn-group>.btn-group:not(:first-child)>.btn,.btn-group>.btn:nth-child(n+3),.btn-group>:not(.btn-check)+.btn{border-top-left-radius:0;border-bottom-left-radius:0}.dropdown-toggle-split{padding-right:.5625rem;padding-left:.5625rem}.dropdown-toggle-split::after,.dropend .dropdown-toggle-split::after,.dropup .dropdown-toggle-split::after{margin-left:0}.dropstart .dropdown-toggle-split::before{margin-right:0}.btn-group-sm>.btn+.dropdown-toggle-split,.btn-sm+.dropdown-toggle-split{padding-right:.375rem;padding-left:.375rem}.btn-group-lg>.btn+.dropdown-toggle-split,.btn-lg+.dropdown-toggle-split{padding-right:.75rem;padding-left:.75rem}.btn-group-vertical{flex-direction:column;align-items:flex-start;justify-content:center}.btn-group-vertical>.btn,.btn-group-vertical>.btn-group{width:100%}.btn-group-vertical>.btn-group:not(:first-child),.btn-group-vertical>.btn:not(:first-child){margin-top:calc(-1 * 1px);margin-top:calc(-1 * var(--bs-border-width))}.btn-group-vertical>.btn-group:not(:last-child)>.btn,.btn-group-vertical>.btn:not(:last-child):not(.dropdown-toggle){border-bottom-right-radius:0;border-bottom-left-radius:0}.btn-group-vertical>.btn-group:not(:first-child)>.btn,.btn-group-vertical>.btn:nth-child(n+3),.btn-group-vertical>:not(.btn-check)+.btn{border-top-left-radius:0;border-top-right-radius:0}.nav{--bs-nav-link-padding-x:1rem;--bs-nav-link-padding-y:0.5rem;--bs-nav-link-font-weight: ;--bs-nav-link-color:var(--bs-link-color);--bs-nav-link-hover-color:var(--bs-link-hover-color);--bs-nav-link-disabled-color:var(--bs-secondary-color);display:flex;flex-wrap:wrap;padding-left:0;margin-bottom:0;list-style:none}.nav-link{display:block;padding:var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);font-size:var(--bs-nav-link-font-size);font-weight:var(--bs-nav-link-font-weight);color:var(--bs-nav-link-color);text-decoration:none;background:0 0;border:0;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out}@media (prefers-reduced-motion:reduce){.nav-link{transition:none}}.nav-link:focus,.nav-link:hover{color:var(--bs-nav-link-hover-color)}.nav-link:focus-visible{outline:0;box-shadow:0 0 0 .25rem rgba(13,110,253,.25)}.nav-link.disabled,.nav-link:disabled{color:var(--bs-nav-link-disabled-color);pointer-events:none;cursor:default}.nav-tabs{--bs-nav-tabs-border-width:var(--bs-border-width);--bs-nav-tabs-border-color:var(--bs-border-color);--bs-nav-tabs-border-radius:var(--bs-border-radius);--bs-nav-tabs-link-hover-border-color:var(--bs-secondary-bg) var(--bs-secondary-bg) var(--bs-border-color);--bs-nav-tabs-link-active-color:var(--bs-emphasis-color);--bs-nav-tabs-link-active-bg:var(--bs-body-bg);--bs-nav-tabs-link-active-border-color:var(--bs-border-color) var(--bs-border-color) var(--bs-body-bg);border-bottom:var(--bs-nav-tabs-border-width) solid var(--bs-nav-tabs-border-color)}.nav-tabs .nav-link{margin-bottom:calc(-1 * var(--bs-nav-tabs-border-width));border:var(--bs-nav-tabs-border-width) solid transparent;border-top-left-radius:var(--bs-nav-tabs-border-radius);border-top-right-radius:var(--bs-nav-tabs-border-radius)}.nav-tabs .nav-link:focus,.nav-tabs .nav-link:hover{isolation:isolate;border-color:var(--bs-nav-tabs-link-hover-border-color)}.nav-tabs .nav-item.show .nav-link,.nav-tabs .nav-link.active{color:var(--bs-nav-tabs-link-active-color);background-color:var(--bs-nav-tabs-link-active-bg);border-color:var(--bs-nav-tabs-link-active-border-color)}.nav-tabs .dropdown-menu{margin-top:calc(-1 * var(--bs-nav-tabs-border-width));border-top-left-radius:0;border-top-right-radius:0}.nav-pills{--bs-nav-pills-border-radius:var(--bs-border-radius);--bs-nav-pills-link-active-color:#fff;--bs-nav-pills-link-active-bg:#0d6efd}.nav-pills .nav-link{border-radius:var(--bs-nav-pills-border-radius)}.nav-pills .nav-link.active,.nav-pills .show>.nav-link{color:var(--bs-nav-pills-link-active-color);background-color:var(--bs-nav-pills-link-active-bg)}.nav-underline{--bs-nav-underline-gap:1rem;--bs-nav-underline-border-width:0.125rem;--bs-nav-underline-link-active-color:var(--bs-emphasis-color);gap:var(--bs-nav-underline-gap)}.nav-underline .nav-link{padding-right:0;padding-left:0;border-bottom:var(--bs-nav-underline-border-width) solid transparent}.nav-underline .nav-link:focus,.nav-underline .nav-link:hover{border-bottom-color:currentcolor}.nav-underline .nav-link.active,.nav-underline .show>.nav-link{font-weight:700;color:var(--bs-nav-underline-link-active-color);border-bottom-color:currentcolor}.nav-fill .nav-item,.nav-fill>.nav-link{flex:1 1 auto;text-align:center}.nav-justified .nav-item,.nav-justified>.nav-link{flex-grow:1;flex-basis:0;text-align:center}.nav-fill .nav-item .nav-link,.nav-justified .nav-item .nav-link{width:100%}.tab-content>.tab-pane{display:none}.tab-content>.active{display:block}.navbar{--bs-navbar-padding-x:0;--bs-navbar-padding-y:0.5rem;--bs-navbar-color:rgba(var(--bs-emphasis-color-rgb), 0.65);--bs-navbar-hover-color:rgba(var(--bs-emphasis-color-rgb), 0.8);--bs-navbar-disabled-color:rgba(var(--bs-emphasis-color-rgb), 0.3);--bs-navbar-active-color:rgba(var(--bs-emphasis-color-rgb), 1);--bs-navbar-brand-padding-y:0.3125rem;--bs-navbar-brand-margin-end:1rem;--bs-navbar-brand-font-size:1.25rem;--bs-navbar-brand-color:rgba(var(--bs-emphasis-color-rgb), 1);--bs-navbar-brand-hover-color:rgba(var(--bs-emphasis-color-rgb), 1);--bs-navbar-nav-link-padding-x:0.5rem;--bs-navbar-toggler-padding-y:0.25rem;--bs-navbar-toggler-padding-x:0.75rem;--bs-navbar-toggler-font-size:1.25rem;--bs-navbar-toggler-icon-bg:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 30 30%27%3e%3cpath stroke=%27rgba%2833, 37, 41, 0.75%29%27 stroke-linecap=%27round%27 stroke-miterlimit=%2710%27 stroke-width=%272%27 d=%27M4 7h22M4 15h22M4 23h22%27/%3e%3c/svg%3e");--bs-navbar-toggler-border-color:rgba(var(--bs-emphasis-color-rgb), 0.15);--bs-navbar-toggler-border-radius:var(--bs-border-radius);--bs-navbar-toggler-focus-width:0.25rem;--bs-navbar-toggler-transition:box-shadow 0.15s ease-in-out;position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:var(--bs-navbar-padding-y) var(--bs-navbar-padding-x)}.navbar>.container,.navbar>.container-fluid,.navbar>.container-lg,.navbar>.container-md,.navbar>.container-sm,.navbar>.container-xl,.navbar>.container-xxl{display:flex;flex-wrap:inherit;align-items:center;justify-content:space-between}.navbar-brand{padding-top:var(--bs-navbar-brand-padding-y);padding-bottom:var(--bs-navbar-brand-padding-y);margin-right:var(--bs-navbar-brand-margin-end);font-size:var(--bs-navbar-brand-font-size);color:var(--bs-navbar-brand-color);text-decoration:none;white-space:nowrap}.navbar-brand:focus,.navbar-brand:hover{color:var(--bs-navbar-brand-hover-color)}.navbar-nav{--bs-nav-link-padding-x:0;--bs-nav-link-padding-y:0.5rem;--bs-nav-link-font-weight: ;--bs-nav-link-color:var(--bs-navbar-color);--bs-nav-link-hover-color:var(--bs-navbar-hover-color);--bs-nav-link-disabled-color:var(--bs-navbar-disabled-color);display:flex;flex-direction:column;padding-left:0;margin-bottom:0;list-style:none}.navbar-nav .nav-link.active,.navbar-nav .nav-link.show{color:var(--bs-navbar-active-color)}.navbar-nav .dropdown-menu{position:static}.navbar-text{padding-top:.5rem;padding-bottom:.5rem;color:var(--bs-navbar-color)}.navbar-text a,.navbar-text a:focus,.navbar-text a:hover{color:var(--bs-navbar-active-color)}.navbar-collapse{flex-grow:1;flex-basis:100%;align-items:center}.navbar-toggler{padding:var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x);font-size:var(--bs-navbar-toggler-font-size);line-height:1;color:var(--bs-navbar-color);background-color:transparent;border:1px solid var(--bs-navbar-toggler-border-color);border:var(--bs-border-width) solid var(--bs-navbar-toggler-border-color);border-radius:var(--bs-navbar-toggler-border-radius);transition:var(--bs-navbar-toggler-transition)}@media (prefers-reduced-motion:reduce){.navbar-toggler{transition:none}}.navbar-toggler:hover{text-decoration:none}.navbar-toggler:focus{text-decoration:none;outline:0;box-shadow:0 0 0 var(--bs-navbar-toggler-focus-width)}.navbar-toggler-icon{display:inline-block;width:1.5em;height:1.5em;vertical-align:middle;background-image:var(--bs-navbar-toggler-icon-bg);background-repeat:no-repeat;background-position:center;background-size:100%}.navbar-nav-scroll{max-height:75vh;max-height:var(--bs-scroll-height,75vh);overflow-y:auto}@media (min-width:576px){.navbar-expand-sm{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand-sm .navbar-nav{flex-direction:row}.navbar-expand-sm .navbar-nav .dropdown-menu{position:absolute}.navbar-expand-sm .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-sm .navbar-nav-scroll{overflow:visible}.navbar-expand-sm .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-sm .navbar-toggler{display:none}.navbar-expand-sm .offcanvas{position:static;z-index:auto;flex-grow:1;width:auto!important;height:auto!important;visibility:visible!important;background-color:transparent!important;border:0!important;transform:none!important;transition:none}.navbar-expand-sm .offcanvas .offcanvas-header{display:none}.navbar-expand-sm .offcanvas .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible}}@media (min-width:768px){.navbar-expand-md{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand-md .navbar-nav{flex-direction:row}.navbar-expand-md .navbar-nav .dropdown-menu{position:absolute}.navbar-expand-md .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-md .navbar-nav-scroll{overflow:visible}.navbar-expand-md .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-md .navbar-toggler{display:none}.navbar-expand-md .offcanvas{position:static;z-index:auto;flex-grow:1;width:auto!important;height:auto!important;visibility:visible!important;background-color:transparent!important;border:0!important;transform:none!important;transition:none}.navbar-expand-md .offcanvas .offcanvas-header{display:none}.navbar-expand-md .offcanvas .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible}}@media (min-width:992px){.navbar-expand-lg{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand-lg .navbar-nav{flex-direction:row}.navbar-expand-lg .navbar-nav .dropdown-menu{position:absolute}.navbar-expand-lg .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-lg .navbar-nav-scroll{overflow:visible}.navbar-expand-lg .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-lg .navbar-toggler{display:none}.navbar-expand-lg .offcanvas{position:static;z-index:auto;flex-grow:1;width:auto!important;height:auto!important;visibility:visible!important;background-color:transparent!important;border:0!important;transform:none!important;transition:none}.navbar-expand-lg .offcanvas .offcanvas-header{display:none}.navbar-expand-lg .offcanvas .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible}}@media (min-width:1200px){.navbar-expand-xl{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand-xl .navbar-nav{flex-direction:row}.navbar-expand-xl .navbar-nav .dropdown-menu{position:absolute}.navbar-expand-xl .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-xl .navbar-nav-scroll{overflow:visible}.navbar-expand-xl .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-xl .navbar-toggler{display:none}.navbar-expand-xl .offcanvas{position:static;z-index:auto;flex-grow:1;width:auto!important;height:auto!important;visibility:visible!important;background-color:transparent!important;border:0!important;transform:none!important;transition:none}.navbar-expand-xl .offcanvas .offcanvas-header{display:none}.navbar-expand-xl .offcanvas .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible}}@media (min-width:1400px){.navbar-expand-xxl{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand-xxl .navbar-nav{flex-direction:row}.navbar-expand-xxl .navbar-nav .dropdown-menu{position:absolute}.navbar-expand-xxl .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-xxl .navbar-nav-scroll{overflow:visible}.navbar-expand-xxl .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-xxl .navbar-toggler{display:none}.navbar-expand-xxl .offcanvas{position:static;z-index:auto;flex-grow:1;width:auto!important;height:auto!important;visibility:visible!important;background-color:transparent!important;border:0!important;transform:none!important;transition:none}.navbar-expand-xxl .offcanvas .offcanvas-header{display:none}.navbar-expand-xxl .offcanvas .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible}}.navbar-expand{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand .navbar-nav{flex-direction:row}.navbar-expand .navbar-nav .dropdown-menu{position:absolute}.navbar-expand .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand .navbar-nav-scroll{overflow:visible}.navbar-expand .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand .navbar-toggler{display:none}.navbar-expand .offcanvas{position:static;z-index:auto;flex-grow:1;width:auto!important;height:auto!important;visibility:visible!important;background-color:transparent!important;border:0!important;transform:none!important;transition:none}.navbar-expand .offcanvas .offcanvas-header{display:none}.navbar-expand .offcanvas .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible}.navbar-dark,.navbar[data-bs-theme=dark]{--bs-navbar-color:rgba(255, 255, 255, 0.55);--bs-navbar-hover-color:rgba(255, 255, 255, 0.75);--bs-navbar-disabled-color:rgba(255, 255, 255, 0.25);--bs-navbar-active-color:#fff;--bs-navbar-brand-color:#fff;--bs-navbar-brand-hover-color:#fff;--bs-navbar-toggler-border-color:rgba(255, 255, 255, 0.1);--bs-navbar-toggler-icon-bg:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 30 30%27%3e%3cpath stroke=%27rgba%28255, 255, 255, 0.55%29%27 stroke-linecap=%27round%27 stroke-miterlimit=%2710%27 stroke-width=%272%27 d=%27M4 7h22M4 15h22M4 23h22%27/%3e%3c/svg%3e")}[data-bs-theme=dark] .navbar-toggler-icon{--bs-navbar-toggler-icon-bg:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 30 30%27%3e%3cpath stroke=%27rgba%28255, 255, 255, 0.55%29%27 stroke-linecap=%27round%27 stroke-miterlimit=%2710%27 stroke-width=%272%27 d=%27M4 7h22M4 15h22M4 23h22%27/%3e%3c/svg%3e")}.card{--bs-card-spacer-y:1rem;--bs-card-spacer-x:1rem;--bs-card-title-spacer-y:0.5rem;--bs-card-title-color: ;--bs-card-subtitle-color: ;--bs-card-border-width:var(--bs-border-width);--bs-card-border-color:var(--bs-border-color-translucent);--bs-card-border-radius:var(--bs-border-radius);--bs-card-box-shadow: ;--bs-card-inner-border-radius:calc(var(--bs-border-radius) - (var(--bs-border-width)));--bs-card-cap-padding-y:0.5rem;--bs-card-cap-padding-x:1rem;--bs-card-cap-bg:rgba(var(--bs-body-color-rgb), 0.03);--bs-card-cap-color: ;--bs-card-height: ;--bs-card-color: ;--bs-card-bg:var(--bs-body-bg);--bs-card-img-overlay-padding:1rem;--bs-card-group-margin:0.75rem;position:relative;display:flex;flex-direction:column;min-width:0;height:var(--bs-card-height);color:#212529;color:var(--bs-body-color);word-wrap:break-word;background-color:var(--bs-card-bg);background-clip:border-box;border:var(--bs-card-border-width) solid var(--bs-card-border-color);border-radius:var(--bs-card-border-radius)}.card>hr{margin-right:0;margin-left:0}.card>.list-group{border-top:inherit;border-bottom:inherit}.card>.list-group:first-child{border-top-width:0;border-top-left-radius:var(--bs-card-inner-border-radius);border-top-right-radius:var(--bs-card-inner-border-radius)}.card>.list-group:last-child{border-bottom-width:0;border-bottom-right-radius:var(--bs-card-inner-border-radius);border-bottom-left-radius:var(--bs-card-inner-border-radius)}.card>.card-header+.list-group,.card>.list-group+.card-footer{border-top:0}.card-body{flex:1 1 auto;padding:var(--bs-card-spacer-y) var(--bs-card-spacer-x);color:var(--bs-card-color)}.card-title{margin-bottom:var(--bs-card-title-spacer-y);color:var(--bs-card-title-color)}.card-subtitle{margin-top:calc(-.5 * var(--bs-card-title-spacer-y));margin-bottom:0;color:var(--bs-card-subtitle-color)}.card-text:last-child{margin-bottom:0}.card-link+.card-link{margin-left:var(--bs-card-spacer-x)}.card-header{padding:var(--bs-card-cap-padding-y) var(--bs-card-cap-padding-x);margin-bottom:0;color:var(--bs-card-cap-color);background-color:var(--bs-card-cap-bg);border-bottom:var(--bs-card-border-width) solid var(--bs-card-border-color)}.card-header:first-child{border-radius:var(--bs-card-inner-border-radius) var(--bs-card-inner-border-radius) 0 0}.card-footer{padding:var(--bs-card-cap-padding-y) var(--bs-card-cap-padding-x);color:var(--bs-card-cap-color);background-color:var(--bs-card-cap-bg);border-top:var(--bs-card-border-width) solid var(--bs-card-border-color)}.card-footer:last-child{border-radius:0 0 var(--bs-card-inner-border-radius) var(--bs-card-inner-border-radius)}.card-header-tabs{margin-right:calc(-.5 * var(--bs-card-cap-padding-x));margin-bottom:calc(-1 * var(--bs-card-cap-padding-y));margin-left:calc(-.5 * var(--bs-card-cap-padding-x));border-bottom:0}.card-header-tabs .nav-link.active{background-color:var(--bs-card-bg);border-bottom-color:var(--bs-card-bg)}.card-header-pills{margin-right:calc(-.5 * var(--bs-card-cap-padding-x));margin-left:calc(-.5 * var(--bs-card-cap-padding-x))}.card-img-overlay{position:absolute;top:0;right:0;bottom:0;left:0;padding:var(--bs-card-img-overlay-padding);border-radius:var(--bs-card-inner-border-radius)}.card-img,.card-img-bottom,.card-img-top{width:100%}.card-img,.card-img-top{border-top-left-radius:var(--bs-card-inner-border-radius);border-top-right-radius:var(--bs-card-inner-border-radius)}.card-img,.card-img-bottom{border-bottom-right-radius:var(--bs-card-inner-border-radius);border-bottom-left-radius:var(--bs-card-inner-border-radius)}.card-group>.card{margin-bottom:var(--bs-card-group-margin)}@media (min-width:576px){.card-group{display:flex;flex-flow:row wrap}.card-group>.card{flex:1 0;margin-bottom:0}.card-group>.card+.card{margin-left:0;border-left:0}.card-group>.card:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.card-group>.card:not(:last-child)>.card-header,.card-group>.card:not(:last-child)>.card-img-top{border-top-right-radius:0}.card-group>.card:not(:last-child)>.card-footer,.card-group>.card:not(:last-child)>.card-img-bottom{border-bottom-right-radius:0}.card-group>.card:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.card-group>.card:not(:first-child)>.card-header,.card-group>.card:not(:first-child)>.card-img-top{border-top-left-radius:0}.card-group>.card:not(:first-child)>.card-footer,.card-group>.card:not(:first-child)>.card-img-bottom{border-bottom-left-radius:0}}.accordion{--bs-accordion-color:var(--bs-body-color);--bs-accordion-bg:var(--bs-body-bg);--bs-accordion-transition:color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out,border-radius 0.15s ease;--bs-accordion-border-color:var(--bs-border-color);--bs-accordion-border-width:var(--bs-border-width);--bs-accordion-border-radius:var(--bs-border-radius);--bs-accordion-inner-border-radius:calc(var(--bs-border-radius) - (var(--bs-border-width)));--bs-accordion-btn-padding-x:1.25rem;--bs-accordion-btn-padding-y:1rem;--bs-accordion-btn-color:var(--bs-body-color);--bs-accordion-btn-bg:var(--bs-accordion-bg);--bs-accordion-btn-icon:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 16 16%27 fill=%27none%27 stroke=%27%23212529%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3e%3cpath d=%27m2 5 6 6 6-6%27/%3e%3c/svg%3e");--bs-accordion-btn-icon-width:1.25rem;--bs-accordion-btn-icon-transform:rotate(-180deg);--bs-accordion-btn-icon-transition:transform 0.2s ease-in-out;--bs-accordion-btn-active-icon:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 16 16%27 fill=%27none%27 stroke=%27%23052c65%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3e%3cpath d=%27m2 5 6 6 6-6%27/%3e%3c/svg%3e");--bs-accordion-btn-focus-box-shadow:0 0 0 0.25rem rgba(13, 110, 253, 0.25);--bs-accordion-body-padding-x:1.25rem;--bs-accordion-body-padding-y:1rem;--bs-accordion-active-color:var(--bs-primary-text-emphasis);--bs-accordion-active-bg:var(--bs-primary-bg-subtle)}.accordion-button{position:relative;display:flex;align-items:center;width:100%;padding:var(--bs-accordion-btn-padding-y) var(--bs-accordion-btn-padding-x);font-size:1rem;color:var(--bs-accordion-btn-color);text-align:left;background-color:var(--bs-accordion-btn-bg);border:0;border-radius:0;overflow-anchor:none;transition:var(--bs-accordion-transition)}@media (prefers-reduced-motion:reduce){.accordion-button{transition:none}}.accordion-button:not(.collapsed){color:var(--bs-accordion-active-color);background-color:var(--bs-accordion-active-bg);box-shadow:inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color)}.accordion-button:not(.collapsed)::after{background-image:var(--bs-accordion-btn-active-icon);transform:var(--bs-accordion-btn-icon-transform)}.accordion-button::after{flex-shrink:0;width:var(--bs-accordion-btn-icon-width);height:var(--bs-accordion-btn-icon-width);margin-left:auto;content:"";background-image:var(--bs-accordion-btn-icon);background-repeat:no-repeat;background-size:var(--bs-accordion-btn-icon-width);transition:var(--bs-accordion-btn-icon-transition)}@media (prefers-reduced-motion:reduce){.accordion-button::after{transition:none}}.accordion-button:hover{z-index:2}.accordion-button:focus{z-index:3;outline:0;box-shadow:var(--bs-accordion-btn-focus-box-shadow)}.accordion-header{margin-bottom:0}.accordion-item{color:var(--bs-accordion-color);background-color:var(--bs-accordion-bg);border:var(--bs-accordion-border-width) solid var(--bs-accordion-border-color)}.accordion-item:first-of-type{border-top-left-radius:var(--bs-accordion-border-radius);border-top-right-radius:var(--bs-accordion-border-radius)}.accordion-item:first-of-type>.accordion-header .accordion-button{border-top-left-radius:var(--bs-accordion-inner-border-radius);border-top-right-radius:var(--bs-accordion-inner-border-radius)}.accordion-item:not(:first-of-type){border-top:0}.accordion-item:last-of-type{border-bottom-right-radius:var(--bs-accordion-border-radius);border-bottom-left-radius:var(--bs-accordion-border-radius)}.accordion-item:last-of-type>.accordion-header .accordion-button.collapsed{border-bottom-right-radius:var(--bs-accordion-inner-border-radius);border-bottom-left-radius:var(--bs-accordion-inner-border-radius)}.accordion-item:last-of-type>.accordion-collapse{border-bottom-right-radius:var(--bs-accordion-border-radius);border-bottom-left-radius:var(--bs-accordion-border-radius)}.accordion-body{padding:var(--bs-accordion-body-padding-y) var(--bs-accordion-body-padding-x)}.accordion-flush>.accordion-item{border-right:0;border-left:0;border-radius:0}.accordion-flush>.accordion-item:first-child{border-top:0}.accordion-flush>.accordion-item:last-child{border-bottom:0}.accordion-flush>.accordion-item>.accordion-collapse,.accordion-flush>.accordion-item>.accordion-header .accordion-button,.accordion-flush>.accordion-item>.accordion-header .accordion-button.collapsed{border-radius:0}[data-bs-theme=dark] .accordion-button::after{--bs-accordion-btn-icon:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 16 16%27 fill=%27%236ea8fe%27%3e%3cpath fill-rule=%27evenodd%27 d=%27M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708%27/%3e%3c/svg%3e");--bs-accordion-btn-active-icon:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 16 16%27 fill=%27%236ea8fe%27%3e%3cpath fill-rule=%27evenodd%27 d=%27M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708%27/%3e%3c/svg%3e")}.breadcrumb{--bs-breadcrumb-padding-x:0;--bs-breadcrumb-padding-y:0;--bs-breadcrumb-margin-bottom:1rem;--bs-breadcrumb-bg: ;--bs-breadcrumb-border-radius: ;--bs-breadcrumb-divider-color:var(--bs-secondary-color);--bs-breadcrumb-item-padding-x:0.5rem;--bs-breadcrumb-item-active-color:var(--bs-secondary-color);display:flex;flex-wrap:wrap;padding:var(--bs-breadcrumb-padding-y) var(--bs-breadcrumb-padding-x);margin-bottom:var(--bs-breadcrumb-margin-bottom);font-size:var(--bs-breadcrumb-font-size);list-style:none;background-color:var(--bs-breadcrumb-bg);border-radius:var(--bs-breadcrumb-border-radius)}.breadcrumb-item+.breadcrumb-item{padding-left:var(--bs-breadcrumb-item-padding-x)}.breadcrumb-item+.breadcrumb-item::before{float:left;padding-right:var(--bs-breadcrumb-item-padding-x);color:var(--bs-breadcrumb-divider-color);content:"/";content:var(--bs-breadcrumb-divider, "/")}.breadcrumb-item.active{color:var(--bs-breadcrumb-item-active-color)}.pagination{--bs-pagination-padding-x:0.75rem;--bs-pagination-padding-y:0.375rem;--bs-pagination-font-size:1rem;--bs-pagination-color:var(--bs-link-color);--bs-pagination-bg:var(--bs-body-bg);--bs-pagination-border-width:var(--bs-border-width);--bs-pagination-border-color:var(--bs-border-color);--bs-pagination-border-radius:var(--bs-border-radius);--bs-pagination-hover-color:var(--bs-link-hover-color);--bs-pagination-hover-bg:var(--bs-tertiary-bg);--bs-pagination-hover-border-color:var(--bs-border-color);--bs-pagination-focus-color:var(--bs-link-hover-color);--bs-pagination-focus-bg:var(--bs-secondary-bg);--bs-pagination-focus-box-shadow:0 0 0 0.25rem rgba(13, 110, 253, 0.25);--bs-pagination-active-color:#fff;--bs-pagination-active-bg:#0d6efd;--bs-pagination-active-border-color:#0d6efd;--bs-pagination-disabled-color:var(--bs-secondary-color);--bs-pagination-disabled-bg:var(--bs-secondary-bg);--bs-pagination-disabled-border-color:var(--bs-border-color);display:flex;padding-left:0;list-style:none}.page-link{position:relative;display:block;padding:var(--bs-pagination-padding-y) var(--bs-pagination-padding-x);font-size:var(--bs-pagination-font-size);color:var(--bs-pagination-color);text-decoration:none;background-color:var(--bs-pagination-bg);border:var(--bs-pagination-border-width) solid var(--bs-pagination-border-color);transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.page-link{transition:none}}.page-link:hover{z-index:2;color:var(--bs-pagination-hover-color);background-color:var(--bs-pagination-hover-bg);border-color:var(--bs-pagination-hover-border-color)}.page-link:focus{z-index:3;color:var(--bs-pagination-focus-color);background-color:var(--bs-pagination-focus-bg);outline:0;box-shadow:var(--bs-pagination-focus-box-shadow)}.active>.page-link,.page-link.active{z-index:3;color:var(--bs-pagination-active-color);background-color:var(--bs-pagination-active-bg);border-color:var(--bs-pagination-active-border-color)}.disabled>.page-link,.page-link.disabled{color:var(--bs-pagination-disabled-color);pointer-events:none;background-color:var(--bs-pagination-disabled-bg);border-color:var(--bs-pagination-disabled-border-color)}.page-item:not(:first-child) .page-link{margin-left:calc(-1 * 1px);margin-left:calc(-1 * var(--bs-border-width))}.page-item:first-child .page-link{border-top-left-radius:var(--bs-pagination-border-radius);border-bottom-left-radius:var(--bs-pagination-border-radius)}.page-item:last-child .page-link{border-top-right-radius:var(--bs-pagination-border-radius);border-bottom-right-radius:var(--bs-pagination-border-radius)}.pagination-lg{--bs-pagination-padding-x:1.5rem;--bs-pagination-padding-y:0.75rem;--bs-pagination-font-size:1.25rem;--bs-pagination-border-radius:var(--bs-border-radius-lg)}.pagination-sm{--bs-pagination-padding-x:0.5rem;--bs-pagination-padding-y:0.25rem;--bs-pagination-font-size:0.875rem;--bs-pagination-border-radius:var(--bs-border-radius-sm)}.badge{--bs-badge-padding-x:0.65em;--bs-badge-padding-y:0.35em;--bs-badge-font-size:0.75em;--bs-badge-font-weight:700;--bs-badge-color:#fff;--bs-badge-border-radius:var(--bs-border-radius);display:inline-block;padding:var(--bs-badge-padding-y) var(--bs-badge-padding-x);font-size:var(--bs-badge-font-size);font-weight:var(--bs-badge-font-weight);line-height:1;color:var(--bs-badge-color);text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:var(--bs-badge-border-radius)}.badge:empty{display:none}.btn .badge{position:relative;top:-1px}.alert{--bs-alert-bg:transparent;--bs-alert-padding-x:1rem;--bs-alert-padding-y:1rem;--bs-alert-margin-bottom:1rem;--bs-alert-color:inherit;--bs-alert-border-color:transparent;--bs-alert-border:var(--bs-border-width) solid var(--bs-alert-border-color);--bs-alert-border-radius:var(--bs-border-radius);--bs-alert-link-color:inherit;position:relative;padding:var(--bs-alert-padding-y) var(--bs-alert-padding-x);margin-bottom:var(--bs-alert-margin-bottom);color:var(--bs-alert-color);background-color:var(--bs-alert-bg);border:var(--bs-alert-border);border-radius:var(--bs-alert-border-radius)}.alert-heading{color:inherit}.alert-link{font-weight:700;color:var(--bs-alert-link-color)}.alert-dismissible{padding-right:3rem}.alert-dismissible .btn-close{position:absolute;top:0;right:0;z-index:2;padding:1.25rem 1rem}.alert-primary{--bs-alert-color:var(--bs-primary-text-emphasis);--bs-alert-bg:var(--bs-primary-bg-subtle);--bs-alert-border-color:var(--bs-primary-border-subtle);--bs-alert-link-color:var(--bs-primary-text-emphasis)}.alert-secondary{--bs-alert-color:var(--bs-secondary-text-emphasis);--bs-alert-bg:var(--bs-secondary-bg-subtle);--bs-alert-border-color:var(--bs-secondary-border-subtle);--bs-alert-link-color:var(--bs-secondary-text-emphasis)}.alert-success{--bs-alert-color:var(--bs-success-text-emphasis);--bs-alert-bg:var(--bs-success-bg-subtle);--bs-alert-border-color:var(--bs-success-border-subtle);--bs-alert-link-color:var(--bs-success-text-emphasis)}.alert-info{--bs-alert-color:var(--bs-info-text-emphasis);--bs-alert-bg:var(--bs-info-bg-subtle);--bs-alert-border-color:var(--bs-info-border-subtle);--bs-alert-link-color:var(--bs-info-text-emphasis)}.alert-warning{--bs-alert-color:var(--bs-warning-text-emphasis);--bs-alert-bg:var(--bs-warning-bg-subtle);--bs-alert-border-color:var(--bs-warning-border-subtle);--bs-alert-link-color:var(--bs-warning-text-emphasis)}.alert-danger{--bs-alert-color:var(--bs-danger-text-emphasis);--bs-alert-bg:var(--bs-danger-bg-subtle);--bs-alert-border-color:var(--bs-danger-border-subtle);--bs-alert-link-color:var(--bs-danger-text-emphasis)}.alert-light{--bs-alert-color:var(--bs-light-text-emphasis);--bs-alert-bg:var(--bs-light-bg-subtle);--bs-alert-border-color:var(--bs-light-border-subtle);--bs-alert-link-color:var(--bs-light-text-emphasis)}.alert-dark{--bs-alert-color:var(--bs-dark-text-emphasis);--bs-alert-bg:var(--bs-dark-bg-subtle);--bs-alert-border-color:var(--bs-dark-border-subtle);--bs-alert-link-color:var(--bs-dark-text-emphasis)}@keyframes progress-bar-stripes{0%{background-position-x:var(--bs-progress-height)}}.progress,.progress-stacked{--bs-progress-height:1rem;--bs-progress-font-size:0.75rem;--bs-progress-bg:var(--bs-secondary-bg);--bs-progress-border-radius:var(--bs-border-radius);--bs-progress-box-shadow:var(--bs-box-shadow-inset);--bs-progress-bar-color:#fff;--bs-progress-bar-bg:#0d6efd;--bs-progress-bar-transition:width 0.6s ease;display:flex;height:var(--bs-progress-height);overflow:hidden;font-size:var(--bs-progress-font-size);background-color:var(--bs-progress-bg);border-radius:var(--bs-progress-border-radius)}.progress-bar{display:flex;flex-direction:column;justify-content:center;overflow:hidden;color:var(--bs-progress-bar-color);text-align:center;white-space:nowrap;background-color:var(--bs-progress-bar-bg);transition:var(--bs-progress-bar-transition)}@media (prefers-reduced-motion:reduce){.progress-bar{transition:none}}.progress-bar-striped{background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-size:var(--bs-progress-height) var(--bs-progress-height)}.progress-stacked>.progress{overflow:visible}.progress-stacked>.progress>.progress-bar{width:100%}.progress-bar-animated{animation:1s linear infinite progress-bar-stripes}@media (prefers-reduced-motion:reduce){.progress-bar-animated{animation:none}}.list-group{--bs-list-group-color:var(--bs-body-color);--bs-list-group-bg:var(--bs-body-bg);--bs-list-group-border-color:var(--bs-border-color);--bs-list-group-border-width:var(--bs-border-width);--bs-list-group-border-radius:var(--bs-border-radius);--bs-list-group-item-padding-x:1rem;--bs-list-group-item-padding-y:0.5rem;--bs-list-group-action-color:var(--bs-secondary-color);--bs-list-group-action-hover-color:var(--bs-emphasis-color);--bs-list-group-action-hover-bg:var(--bs-tertiary-bg);--bs-list-group-action-active-color:var(--bs-body-color);--bs-list-group-action-active-bg:var(--bs-secondary-bg);--bs-list-group-disabled-color:var(--bs-secondary-color);--bs-list-group-disabled-bg:var(--bs-body-bg);--bs-list-group-active-color:#fff;--bs-list-group-active-bg:#0d6efd;--bs-list-group-active-border-color:#0d6efd;display:flex;flex-direction:column;padding-left:0;margin-bottom:0;border-radius:var(--bs-list-group-border-radius)}.list-group-numbered{list-style-type:none;counter-reset:section}.list-group-numbered>.list-group-item::before{content:counters(section, ".") ". ";counter-increment:section}.list-group-item{position:relative;display:block;padding:var(--bs-list-group-item-padding-y) var(--bs-list-group-item-padding-x);color:var(--bs-list-group-color);text-decoration:none;background-color:var(--bs-list-group-bg);border:var(--bs-list-group-border-width) solid var(--bs-list-group-border-color)}.list-group-item:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}.list-group-item:last-child{border-bottom-right-radius:inherit;border-bottom-left-radius:inherit}.list-group-item.disabled,.list-group-item:disabled{color:var(--bs-list-group-disabled-color);pointer-events:none;background-color:var(--bs-list-group-disabled-bg)}.list-group-item.active{z-index:2;color:var(--bs-list-group-active-color);background-color:var(--bs-list-group-active-bg);border-color:var(--bs-list-group-active-border-color)}.list-group-item+.list-group-item{border-top-width:0}.list-group-item+.list-group-item.active{margin-top:calc(-1 * var(--bs-list-group-border-width));border-top-width:var(--bs-list-group-border-width)}.list-group-item-action{width:100%;color:var(--bs-list-group-action-color);text-align:inherit}.list-group-item-action:not(.active):focus,.list-group-item-action:not(.active):hover{z-index:1;color:var(--bs-list-group-action-hover-color);text-decoration:none;background-color:var(--bs-list-group-action-hover-bg)}.list-group-item-action:not(.active):active{color:var(--bs-list-group-action-active-color);background-color:var(--bs-list-group-action-active-bg)}.list-group-horizontal{flex-direction:row}.list-group-horizontal>.list-group-item:first-child:not(:last-child){border-bottom-left-radius:var(--bs-list-group-border-radius);border-top-right-radius:0}.list-group-horizontal>.list-group-item:last-child:not(:first-child){border-top-right-radius:var(--bs-list-group-border-radius);border-bottom-left-radius:0}.list-group-horizontal>.list-group-item.active{margin-top:0}.list-group-horizontal>.list-group-item+.list-group-item{border-top-width:var(--bs-list-group-border-width);border-left-width:0}.list-group-horizontal>.list-group-item+.list-group-item.active{margin-left:calc(-1 * var(--bs-list-group-border-width));border-left-width:var(--bs-list-group-border-width)}@media (min-width:576px){.list-group-horizontal-sm{flex-direction:row}.list-group-horizontal-sm>.list-group-item:first-child:not(:last-child){border-bottom-left-radius:var(--bs-list-group-border-radius);border-top-right-radius:0}.list-group-horizontal-sm>.list-group-item:last-child:not(:first-child){border-top-right-radius:var(--bs-list-group-border-radius);border-bottom-left-radius:0}.list-group-horizontal-sm>.list-group-item.active{margin-top:0}.list-group-horizontal-sm>.list-group-item+.list-group-item{border-top-width:var(--bs-list-group-border-width);border-left-width:0}.list-group-horizontal-sm>.list-group-item+.list-group-item.active{margin-left:calc(-1 * var(--bs-list-group-border-width));border-left-width:var(--bs-list-group-border-width)}}@media (min-width:768px){.list-group-horizontal-md{flex-direction:row}.list-group-horizontal-md>.list-group-item:first-child:not(:last-child){border-bottom-left-radius:var(--bs-list-group-border-radius);border-top-right-radius:0}.list-group-horizontal-md>.list-group-item:last-child:not(:first-child){border-top-right-radius:var(--bs-list-group-border-radius);border-bottom-left-radius:0}.list-group-horizontal-md>.list-group-item.active{margin-top:0}.list-group-horizontal-md>.list-group-item+.list-group-item{border-top-width:var(--bs-list-group-border-width);border-left-width:0}.list-group-horizontal-md>.list-group-item+.list-group-item.active{margin-left:calc(-1 * var(--bs-list-group-border-width));border-left-width:var(--bs-list-group-border-width)}}@media (min-width:992px){.list-group-horizontal-lg{flex-direction:row}.list-group-horizontal-lg>.list-group-item:first-child:not(:last-child){border-bottom-left-radius:var(--bs-list-group-border-radius);border-top-right-radius:0}.list-group-horizontal-lg>.list-group-item:last-child:not(:first-child){border-top-right-radius:var(--bs-list-group-border-radius);border-bottom-left-radius:0}.list-group-horizontal-lg>.list-group-item.active{margin-top:0}.list-group-horizontal-lg>.list-group-item+.list-group-item{border-top-width:var(--bs-list-group-border-width);border-left-width:0}.list-group-horizontal-lg>.list-group-item+.list-group-item.active{margin-left:calc(-1 * var(--bs-list-group-border-width));border-left-width:var(--bs-list-group-border-width)}}@media (min-width:1200px){.list-group-horizontal-xl{flex-direction:row}.list-group-horizontal-xl>.list-group-item:first-child:not(:last-child){border-bottom-left-radius:var(--bs-list-group-border-radius);border-top-right-radius:0}.list-group-horizontal-xl>.list-group-item:last-child:not(:first-child){border-top-right-radius:var(--bs-list-group-border-radius);border-bottom-left-radius:0}.list-group-horizontal-xl>.list-group-item.active{margin-top:0}.list-group-horizontal-xl>.list-group-item+.list-group-item{border-top-width:var(--bs-list-group-border-width);border-left-width:0}.list-group-horizontal-xl>.list-group-item+.list-group-item.active{margin-left:calc(-1 * var(--bs-list-group-border-width));border-left-width:var(--bs-list-group-border-width)}}@media (min-width:1400px){.list-group-horizontal-xxl{flex-direction:row}.list-group-horizontal-xxl>.list-group-item:first-child:not(:last-child){border-bottom-left-radius:var(--bs-list-group-border-radius);border-top-right-radius:0}.list-group-horizontal-xxl>.list-group-item:last-child:not(:first-child){border-top-right-radius:var(--bs-list-group-border-radius);border-bottom-left-radius:0}.list-group-horizontal-xxl>.list-group-item.active{margin-top:0}.list-group-horizontal-xxl>.list-group-item+.list-group-item{border-top-width:var(--bs-list-group-border-width);border-left-width:0}.list-group-horizontal-xxl>.list-group-item+.list-group-item.active{margin-left:calc(-1 * var(--bs-list-group-border-width));border-left-width:var(--bs-list-group-border-width)}}.list-group-flush{border-radius:0}.list-group-flush>.list-group-item{border-width:0 0 var(--bs-list-group-border-width)}.list-group-flush>.list-group-item:last-child{border-bottom-width:0}.list-group-item-primary{--bs-list-group-color:var(--bs-primary-text-emphasis);--bs-list-group-bg:var(--bs-primary-bg-subtle);--bs-list-group-border-color:var(--bs-primary-border-subtle);--bs-list-group-action-hover-color:var(--bs-emphasis-color);--bs-list-group-action-hover-bg:var(--bs-primary-border-subtle);--bs-list-group-action-active-color:var(--bs-emphasis-color);--bs-list-group-action-active-bg:var(--bs-primary-border-subtle);--bs-list-group-active-color:var(--bs-primary-bg-subtle);--bs-list-group-active-bg:var(--bs-primary-text-emphasis);--bs-list-group-active-border-color:var(--bs-primary-text-emphasis)}.list-group-item-secondary{--bs-list-group-color:var(--bs-secondary-text-emphasis);--bs-list-group-bg:var(--bs-secondary-bg-subtle);--bs-list-group-border-color:var(--bs-secondary-border-subtle);--bs-list-group-action-hover-color:var(--bs-emphasis-color);--bs-list-group-action-hover-bg:var(--bs-secondary-border-subtle);--bs-list-group-action-active-color:var(--bs-emphasis-color);--bs-list-group-action-active-bg:var(--bs-secondary-border-subtle);--bs-list-group-active-color:var(--bs-secondary-bg-subtle);--bs-list-group-active-bg:var(--bs-secondary-text-emphasis);--bs-list-group-active-border-color:var(--bs-secondary-text-emphasis)}.list-group-item-success{--bs-list-group-color:var(--bs-success-text-emphasis);--bs-list-group-bg:var(--bs-success-bg-subtle);--bs-list-group-border-color:var(--bs-success-border-subtle);--bs-list-group-action-hover-color:var(--bs-emphasis-color);--bs-list-group-action-hover-bg:var(--bs-success-border-subtle);--bs-list-group-action-active-color:var(--bs-emphasis-color);--bs-list-group-action-active-bg:var(--bs-success-border-subtle);--bs-list-group-active-color:var(--bs-success-bg-subtle);--bs-list-group-active-bg:var(--bs-success-text-emphasis);--bs-list-group-active-border-color:var(--bs-success-text-emphasis)}.list-group-item-info{--bs-list-group-color:var(--bs-info-text-emphasis);--bs-list-group-bg:var(--bs-info-bg-subtle);--bs-list-group-border-color:var(--bs-info-border-subtle);--bs-list-group-action-hover-color:var(--bs-emphasis-color);--bs-list-group-action-hover-bg:var(--bs-info-border-subtle);--bs-list-group-action-active-color:var(--bs-emphasis-color);--bs-list-group-action-active-bg:var(--bs-info-border-subtle);--bs-list-group-active-color:var(--bs-info-bg-subtle);--bs-list-group-active-bg:var(--bs-info-text-emphasis);--bs-list-group-active-border-color:var(--bs-info-text-emphasis)}.list-group-item-warning{--bs-list-group-color:var(--bs-warning-text-emphasis);--bs-list-group-bg:var(--bs-warning-bg-subtle);--bs-list-group-border-color:var(--bs-warning-border-subtle);--bs-list-group-action-hover-color:var(--bs-emphasis-color);--bs-list-group-action-hover-bg:var(--bs-warning-border-subtle);--bs-list-group-action-active-color:var(--bs-emphasis-color);--bs-list-group-action-active-bg:var(--bs-warning-border-subtle);--bs-list-group-active-color:var(--bs-warning-bg-subtle);--bs-list-group-active-bg:var(--bs-warning-text-emphasis);--bs-list-group-active-border-color:var(--bs-warning-text-emphasis)}.list-group-item-danger{--bs-list-group-color:var(--bs-danger-text-emphasis);--bs-list-group-bg:var(--bs-danger-bg-subtle);--bs-list-group-border-color:var(--bs-danger-border-subtle);--bs-list-group-action-hover-color:var(--bs-emphasis-color);--bs-list-group-action-hover-bg:var(--bs-danger-border-subtle);--bs-list-group-action-active-color:var(--bs-emphasis-color);--bs-list-group-action-active-bg:var(--bs-danger-border-subtle);--bs-list-group-active-color:var(--bs-danger-bg-subtle);--bs-list-group-active-bg:var(--bs-danger-text-emphasis);--bs-list-group-active-border-color:var(--bs-danger-text-emphasis)}.list-group-item-light{--bs-list-group-color:var(--bs-light-text-emphasis);--bs-list-group-bg:var(--bs-light-bg-subtle);--bs-list-group-border-color:var(--bs-light-border-subtle);--bs-list-group-action-hover-color:var(--bs-emphasis-color);--bs-list-group-action-hover-bg:var(--bs-light-border-subtle);--bs-list-group-action-active-color:var(--bs-emphasis-color);--bs-list-group-action-active-bg:var(--bs-light-border-subtle);--bs-list-group-active-color:var(--bs-light-bg-subtle);--bs-list-group-active-bg:var(--bs-light-text-emphasis);--bs-list-group-active-border-color:var(--bs-light-text-emphasis)}.list-group-item-dark{--bs-list-group-color:var(--bs-dark-text-emphasis);--bs-list-group-bg:var(--bs-dark-bg-subtle);--bs-list-group-border-color:var(--bs-dark-border-subtle);--bs-list-group-action-hover-color:var(--bs-emphasis-color);--bs-list-group-action-hover-bg:var(--bs-dark-border-subtle);--bs-list-group-action-active-color:var(--bs-emphasis-color);--bs-list-group-action-active-bg:var(--bs-dark-border-subtle);--bs-list-group-active-color:var(--bs-dark-bg-subtle);--bs-list-group-active-bg:var(--bs-dark-text-emphasis);--bs-list-group-active-border-color:var(--bs-dark-text-emphasis)}.btn-close{--bs-btn-close-color:#000;--bs-btn-close-bg:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 16 16%27 fill=%27%23000%27%3e%3cpath d=%27M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414%27/%3e%3c/svg%3e");--bs-btn-close-opacity:0.5;--bs-btn-close-hover-opacity:0.75;--bs-btn-close-focus-shadow:0 0 0 0.25rem rgba(13, 110, 253, 0.25);--bs-btn-close-focus-opacity:1;--bs-btn-close-disabled-opacity:0.25;box-sizing:content-box;width:1em;height:1em;padding:.25em .25em;color:var(--bs-btn-close-color);background:transparent var(--bs-btn-close-bg) center/1em auto no-repeat;filter: ;filter:var(--bs-btn-close-filter);border:0;border-radius:.375rem;opacity:var(--bs-btn-close-opacity)}.btn-close:hover{color:var(--bs-btn-close-color);text-decoration:none;opacity:var(--bs-btn-close-hover-opacity)}.btn-close:focus{outline:0;box-shadow:var(--bs-btn-close-focus-shadow);opacity:var(--bs-btn-close-focus-opacity)}.btn-close.disabled,.btn-close:disabled{pointer-events:none;-webkit-user-select:none;user-select:none;opacity:var(--bs-btn-close-disabled-opacity)}.btn-close-white{--bs-btn-close-filter:invert(1) grayscale(100%) brightness(200%)}:root,[data-bs-theme=light]{--bs-btn-close-filter: }[data-bs-theme=dark]{--bs-btn-close-filter:invert(1) grayscale(100%) brightness(200%)}.toast{--bs-toast-zindex:1090;--bs-toast-padding-x:0.75rem;--bs-toast-padding-y:0.5rem;--bs-toast-spacing:1.5rem;--bs-toast-max-width:350px;--bs-toast-font-size:0.875rem;--bs-toast-color: ;--bs-toast-bg:rgba(var(--bs-body-bg-rgb), 0.85);--bs-toast-border-width:var(--bs-border-width);--bs-toast-border-color:var(--bs-border-color-translucent);--bs-toast-border-radius:var(--bs-border-radius);--bs-toast-box-shadow:var(--bs-box-shadow);--bs-toast-header-color:var(--bs-secondary-color);--bs-toast-header-bg:rgba(var(--bs-body-bg-rgb), 0.85);--bs-toast-header-border-color:var(--bs-border-color-translucent);width:var(--bs-toast-max-width);max-width:100%;font-size:var(--bs-toast-font-size);color:var(--bs-toast-color);pointer-events:auto;background-color:var(--bs-toast-bg);background-clip:padding-box;border:var(--bs-toast-border-width) solid var(--bs-toast-border-color);box-shadow:var(--bs-toast-box-shadow);border-radius:var(--bs-toast-border-radius)}.toast.showing{opacity:0}.toast:not(.show){display:none}.toast-container{--bs-toast-zindex:1090;position:absolute;z-index:var(--bs-toast-zindex);width:-webkit-max-content;width:max-content;max-width:100%;pointer-events:none}.toast-container>:not(:last-child){margin-bottom:var(--bs-toast-spacing)}.toast-header{display:flex;align-items:center;padding:var(--bs-toast-padding-y) var(--bs-toast-padding-x);color:var(--bs-toast-header-color);background-color:var(--bs-toast-header-bg);background-clip:padding-box;border-bottom:var(--bs-toast-border-width) solid var(--bs-toast-header-border-color);border-top-left-radius:calc(var(--bs-toast-border-radius) - var(--bs-toast-border-width));border-top-right-radius:calc(var(--bs-toast-border-radius) - var(--bs-toast-border-width))}.toast-header .btn-close{margin-right:calc(-.5 * var(--bs-toast-padding-x));margin-left:var(--bs-toast-padding-x)}.toast-body{padding:var(--bs-toast-padding-x);word-wrap:break-word}.modal{--bs-modal-zindex:1055;--bs-modal-width:500px;--bs-modal-padding:1rem;--bs-modal-margin:0.5rem;--bs-modal-color:var(--bs-body-color);--bs-modal-bg:var(--bs-body-bg);--bs-modal-border-color:var(--bs-border-color-translucent);--bs-modal-border-width:var(--bs-border-width);--bs-modal-border-radius:var(--bs-border-radius-lg);--bs-modal-box-shadow:var(--bs-box-shadow-sm);--bs-modal-inner-border-radius:calc(var(--bs-border-radius-lg) - (var(--bs-border-width)));--bs-modal-header-padding-x:1rem;--bs-modal-header-padding-y:1rem;--bs-modal-header-padding:1rem 1rem;--bs-modal-header-border-color:var(--bs-border-color);--bs-modal-header-border-width:var(--bs-border-width);--bs-modal-title-line-height:1.5;--bs-modal-footer-gap:0.5rem;--bs-modal-footer-bg: ;--bs-modal-footer-border-color:var(--bs-border-color);--bs-modal-footer-border-width:var(--bs-border-width);position:fixed;top:0;left:0;z-index:var(--bs-modal-zindex);display:none;width:100%;height:100%;overflow-x:hidden;overflow-y:auto;outline:0}.modal-dialog{position:relative;width:auto;margin:var(--bs-modal-margin);pointer-events:none}.modal.fade .modal-dialog{transform:translate(0,-50px);transition:transform .3s ease-out}@media (prefers-reduced-motion:reduce){.modal.fade .modal-dialog{transition:none}}.modal.show .modal-dialog{transform:none}.modal.modal-static .modal-dialog{transform:scale(1.02)}.modal-dialog-scrollable{height:calc(100% - var(--bs-modal-margin) * 2)}.modal-dialog-scrollable .modal-content{max-height:100%;overflow:hidden}.modal-dialog-scrollable .modal-body{overflow-y:auto}.modal-dialog-centered{display:flex;align-items:center;min-height:calc(100% - var(--bs-modal-margin) * 2)}.modal-content{position:relative;display:flex;flex-direction:column;width:100%;color:var(--bs-modal-color);pointer-events:auto;background-color:var(--bs-modal-bg);background-clip:padding-box;border:var(--bs-modal-border-width) solid var(--bs-modal-border-color);border-radius:var(--bs-modal-border-radius);outline:0}.modal-backdrop{--bs-backdrop-zindex:1050;--bs-backdrop-bg:#000;--bs-backdrop-opacity:0.5;position:fixed;top:0;left:0;z-index:var(--bs-backdrop-zindex);width:100vw;height:100vh;background-color:var(--bs-backdrop-bg)}.modal-backdrop.fade{opacity:0}.modal-backdrop.show{opacity:var(--bs-backdrop-opacity)}.modal-header{display:flex;flex-shrink:0;align-items:center;padding:var(--bs-modal-header-padding);border-bottom:var(--bs-modal-header-border-width) solid var(--bs-modal-header-border-color);border-top-left-radius:var(--bs-modal-inner-border-radius);border-top-right-radius:var(--bs-modal-inner-border-radius)}.modal-header .btn-close{padding:calc(var(--bs-modal-header-padding-y) * .5) calc(var(--bs-modal-header-padding-x) * .5);margin-top:calc(-.5 * var(--bs-modal-header-padding-y));margin-right:calc(-.5 * var(--bs-modal-header-padding-x));margin-bottom:calc(-.5 * var(--bs-modal-header-padding-y));margin-left:auto}.modal-title{margin-bottom:0;line-height:var(--bs-modal-title-line-height)}.modal-body{position:relative;flex:1 1 auto;padding:var(--bs-modal-padding)}.modal-footer{display:flex;flex-shrink:0;flex-wrap:wrap;align-items:center;justify-content:flex-end;padding:calc(var(--bs-modal-padding) - var(--bs-modal-footer-gap) * .5);background-color:var(--bs-modal-footer-bg);border-top:var(--bs-modal-footer-border-width) solid var(--bs-modal-footer-border-color);border-bottom-right-radius:var(--bs-modal-inner-border-radius);border-bottom-left-radius:var(--bs-modal-inner-border-radius)}.modal-footer>*{margin:calc(var(--bs-modal-footer-gap) * .5)}@media (min-width:576px){.modal{--bs-modal-margin:1.75rem;--bs-modal-box-shadow:var(--bs-box-shadow)}.modal-dialog{max-width:var(--bs-modal-width);margin-right:auto;margin-left:auto}.modal-sm{--bs-modal-width:300px}}@media (min-width:992px){.modal-lg,.modal-xl{--bs-modal-width:800px}}@media (min-width:1200px){.modal-xl{--bs-modal-width:1140px}}.modal-fullscreen{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen .modal-footer,.modal-fullscreen .modal-header{border-radius:0}.modal-fullscreen .modal-body{overflow-y:auto}@media (max-width:575.98px){.modal-fullscreen-sm-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-sm-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-sm-down .modal-footer,.modal-fullscreen-sm-down .modal-header{border-radius:0}.modal-fullscreen-sm-down .modal-body{overflow-y:auto}}@media (max-width:767.98px){.modal-fullscreen-md-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-md-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-md-down .modal-footer,.modal-fullscreen-md-down .modal-header{border-radius:0}.modal-fullscreen-md-down .modal-body{overflow-y:auto}}@media (max-width:991.98px){.modal-fullscreen-lg-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-lg-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-lg-down .modal-footer,.modal-fullscreen-lg-down .modal-header{border-radius:0}.modal-fullscreen-lg-down .modal-body{overflow-y:auto}}@media (max-width:1199.98px){.modal-fullscreen-xl-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-xl-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-xl-down .modal-footer,.modal-fullscreen-xl-down .modal-header{border-radius:0}.modal-fullscreen-xl-down .modal-body{overflow-y:auto}}@media (max-width:1399.98px){.modal-fullscreen-xxl-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-xxl-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-xxl-down .modal-footer,.modal-fullscreen-xxl-down .modal-header{border-radius:0}.modal-fullscreen-xxl-down .modal-body{overflow-y:auto}}.tooltip{--bs-tooltip-zindex:1080;--bs-tooltip-max-width:200px;--bs-tooltip-padding-x:0.5rem;--bs-tooltip-padding-y:0.25rem;--bs-tooltip-margin: ;--bs-tooltip-font-size:0.875rem;--bs-tooltip-color:var(--bs-body-bg);--bs-tooltip-bg:var(--bs-emphasis-color);--bs-tooltip-border-radius:var(--bs-border-radius);--bs-tooltip-opacity:0.9;--bs-tooltip-arrow-width:0.8rem;--bs-tooltip-arrow-height:0.4rem;z-index:var(--bs-tooltip-zindex);display:block;margin:var(--bs-tooltip-margin);font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";font-family:var(--bs-font-sans-serif);font-style:normal;font-weight:400;line-height:1.5;text-align:left;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;letter-spacing:normal;word-break:normal;white-space:normal;word-spacing:normal;line-break:auto;font-size:var(--bs-tooltip-font-size);word-wrap:break-word;opacity:0}.tooltip.show{opacity:var(--bs-tooltip-opacity)}.tooltip .tooltip-arrow{display:block;width:var(--bs-tooltip-arrow-width);height:var(--bs-tooltip-arrow-height)}.tooltip .tooltip-arrow::before{position:absolute;content:"";border-color:transparent;border-style:solid}.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow,.bs-tooltip-top .tooltip-arrow{bottom:calc(-1 * var(--bs-tooltip-arrow-height))}.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow::before,.bs-tooltip-top .tooltip-arrow::before{top:-1px;border-width:var(--bs-tooltip-arrow-height) calc(var(--bs-tooltip-arrow-width) * .5) 0;border-top-color:var(--bs-tooltip-bg)}.bs-tooltip-auto[data-popper-placement^=right] .tooltip-arrow,.bs-tooltip-end .tooltip-arrow{left:calc(-1 * var(--bs-tooltip-arrow-height));width:var(--bs-tooltip-arrow-height);height:var(--bs-tooltip-arrow-width)}.bs-tooltip-auto[data-popper-placement^=right] .tooltip-arrow::before,.bs-tooltip-end .tooltip-arrow::before{right:-1px;border-width:calc(var(--bs-tooltip-arrow-width) * .5) var(--bs-tooltip-arrow-height) calc(var(--bs-tooltip-arrow-width) * .5) 0;border-right-color:var(--bs-tooltip-bg)}.bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow,.bs-tooltip-bottom .tooltip-arrow{top:calc(-1 * var(--bs-tooltip-arrow-height))}.bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow::before,.bs-tooltip-bottom .tooltip-arrow::before{bottom:-1px;border-width:0 calc(var(--bs-tooltip-arrow-width) * .5) var(--bs-tooltip-arrow-height);border-bottom-color:var(--bs-tooltip-bg)}.bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow,.bs-tooltip-start .tooltip-arrow{right:calc(-1 * var(--bs-tooltip-arrow-height));width:var(--bs-tooltip-arrow-height);height:var(--bs-tooltip-arrow-width)}.bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow::before,.bs-tooltip-start .tooltip-arrow::before{left:-1px;border-width:calc(var(--bs-tooltip-arrow-width) * .5) 0 calc(var(--bs-tooltip-arrow-width) * .5) var(--bs-tooltip-arrow-height);border-left-color:var(--bs-tooltip-bg)}.tooltip-inner{max-width:var(--bs-tooltip-max-width);padding:var(--bs-tooltip-padding-y) var(--bs-tooltip-padding-x);color:var(--bs-tooltip-color);text-align:center;background-color:var(--bs-tooltip-bg);border-radius:var(--bs-tooltip-border-radius)}.popover{--bs-popover-zindex:1070;--bs-popover-max-width:276px;--bs-popover-font-size:0.875rem;--bs-popover-bg:var(--bs-body-bg);--bs-popover-border-width:var(--bs-border-width);--bs-popover-border-color:var(--bs-border-color-translucent);--bs-popover-border-radius:var(--bs-border-radius-lg);--bs-popover-inner-border-radius:calc(var(--bs-border-radius-lg) - var(--bs-border-width));--bs-popover-box-shadow:var(--bs-box-shadow);--bs-popover-header-padding-x:1rem;--bs-popover-header-padding-y:0.5rem;--bs-popover-header-font-size:1rem;--bs-popover-header-color:inherit;--bs-popover-header-bg:var(--bs-secondary-bg);--bs-popover-body-padding-x:1rem;--bs-popover-body-padding-y:1rem;--bs-popover-body-color:var(--bs-body-color);--bs-popover-arrow-width:1rem;--bs-popover-arrow-height:0.5rem;--bs-popover-arrow-border:var(--bs-popover-border-color);z-index:var(--bs-popover-zindex);display:block;max-width:var(--bs-popover-max-width);font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";font-family:var(--bs-font-sans-serif);font-style:normal;font-weight:400;line-height:1.5;text-align:left;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;letter-spacing:normal;word-break:normal;white-space:normal;word-spacing:normal;line-break:auto;font-size:var(--bs-popover-font-size);word-wrap:break-word;background-color:var(--bs-popover-bg);background-clip:padding-box;border:var(--bs-popover-border-width) solid var(--bs-popover-border-color);border-radius:var(--bs-popover-border-radius)}.popover .popover-arrow{display:block;width:var(--bs-popover-arrow-width);height:var(--bs-popover-arrow-height)}.popover .popover-arrow::after,.popover .popover-arrow::before{position:absolute;display:block;content:"";border-color:transparent;border-style:solid;border-width:0}.bs-popover-auto[data-popper-placement^=top]>.popover-arrow,.bs-popover-top>.popover-arrow{bottom:calc(-1 * (var(--bs-popover-arrow-height)) - var(--bs-popover-border-width))}.bs-popover-auto[data-popper-placement^=top]>.popover-arrow::after,.bs-popover-auto[data-popper-placement^=top]>.popover-arrow::before,.bs-popover-top>.popover-arrow::after,.bs-popover-top>.popover-arrow::before{border-width:var(--bs-popover-arrow-height) calc(var(--bs-popover-arrow-width) * .5) 0}.bs-popover-auto[data-popper-placement^=top]>.popover-arrow::before,.bs-popover-top>.popover-arrow::before{bottom:0;border-top-color:var(--bs-popover-arrow-border)}.bs-popover-auto[data-popper-placement^=top]>.popover-arrow::after,.bs-popover-top>.popover-arrow::after{bottom:var(--bs-popover-border-width);border-top-color:var(--bs-popover-bg)}.bs-popover-auto[data-popper-placement^=right]>.popover-arrow,.bs-popover-end>.popover-arrow{left:calc(-1 * (var(--bs-popover-arrow-height)) - var(--bs-popover-border-width));width:var(--bs-popover-arrow-height);height:var(--bs-popover-arrow-width)}.bs-popover-auto[data-popper-placement^=right]>.popover-arrow::after,.bs-popover-auto[data-popper-placement^=right]>.popover-arrow::before,.bs-popover-end>.popover-arrow::after,.bs-popover-end>.popover-arrow::before{border-width:calc(var(--bs-popover-arrow-width) * .5) var(--bs-popover-arrow-height) calc(var(--bs-popover-arrow-width) * .5) 0}.bs-popover-auto[data-popper-placement^=right]>.popover-arrow::before,.bs-popover-end>.popover-arrow::before{left:0;border-right-color:var(--bs-popover-arrow-border)}.bs-popover-auto[data-popper-placement^=right]>.popover-arrow::after,.bs-popover-end>.popover-arrow::after{left:var(--bs-popover-border-width);border-right-color:var(--bs-popover-bg)}.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow,.bs-popover-bottom>.popover-arrow{top:calc(-1 * (var(--bs-popover-arrow-height)) - var(--bs-popover-border-width))}.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::after,.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::before,.bs-popover-bottom>.popover-arrow::after,.bs-popover-bottom>.popover-arrow::before{border-width:0 calc(var(--bs-popover-arrow-width) * .5) var(--bs-popover-arrow-height)}.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::before,.bs-popover-bottom>.popover-arrow::before{top:0;border-bottom-color:var(--bs-popover-arrow-border)}.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::after,.bs-popover-bottom>.popover-arrow::after{top:var(--bs-popover-border-width);border-bottom-color:var(--bs-popover-bg)}.bs-popover-auto[data-popper-placement^=bottom] .popover-header::before,.bs-popover-bottom .popover-header::before{position:absolute;top:0;left:50%;display:block;width:var(--bs-popover-arrow-width);margin-left:calc(-.5 * var(--bs-popover-arrow-width));content:"";border-bottom:var(--bs-popover-border-width) solid var(--bs-popover-header-bg)}.bs-popover-auto[data-popper-placement^=left]>.popover-arrow,.bs-popover-start>.popover-arrow{right:calc(-1 * (var(--bs-popover-arrow-height)) - var(--bs-popover-border-width));width:var(--bs-popover-arrow-height);height:var(--bs-popover-arrow-width)}.bs-popover-auto[data-popper-placement^=left]>.popover-arrow::after,.bs-popover-auto[data-popper-placement^=left]>.popover-arrow::before,.bs-popover-start>.popover-arrow::after,.bs-popover-start>.popover-arrow::before{border-width:calc(var(--bs-popover-arrow-width) * .5) 0 calc(var(--bs-popover-arrow-width) * .5) var(--bs-popover-arrow-height)}.bs-popover-auto[data-popper-placement^=left]>.popover-arrow::before,.bs-popover-start>.popover-arrow::before{right:0;border-left-color:var(--bs-popover-arrow-border)}.bs-popover-auto[data-popper-placement^=left]>.popover-arrow::after,.bs-popover-start>.popover-arrow::after{right:var(--bs-popover-border-width);border-left-color:var(--bs-popover-bg)}.popover-header{padding:var(--bs-popover-header-padding-y) var(--bs-popover-header-padding-x);margin-bottom:0;font-size:var(--bs-popover-header-font-size);color:var(--bs-popover-header-color);background-color:var(--bs-popover-header-bg);border-bottom:var(--bs-popover-border-width) solid var(--bs-popover-border-color);border-top-left-radius:var(--bs-popover-inner-border-radius);border-top-right-radius:var(--bs-popover-inner-border-radius)}.popover-header:empty{display:none}.popover-body{padding:var(--bs-popover-body-padding-y) var(--bs-popover-body-padding-x);color:var(--bs-popover-body-color)}.carousel{position:relative}.carousel.pointer-event{touch-action:pan-y}.carousel-inner{position:relative;width:100%;overflow:hidden}.carousel-inner::after{display:block;clear:both;content:""}.carousel-item{position:relative;display:none;float:left;width:100%;margin-right:-100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:transform .6s ease-in-out}@media (prefers-reduced-motion:reduce){.carousel-item{transition:none}}.carousel-item-next,.carousel-item-prev,.carousel-item.active{display:block}.active.carousel-item-end,.carousel-item-next:not(.carousel-item-start){transform:translateX(100%)}.active.carousel-item-start,.carousel-item-prev:not(.carousel-item-end){transform:translateX(-100%)}.carousel-fade .carousel-item{opacity:0;transition-property:opacity;transform:none}.carousel-fade .carousel-item-next.carousel-item-start,.carousel-fade .carousel-item-prev.carousel-item-end,.carousel-fade .carousel-item.active{z-index:1;opacity:1}.carousel-fade .active.carousel-item-end,.carousel-fade .active.carousel-item-start{z-index:0;opacity:0;transition:opacity 0s .6s}@media (prefers-reduced-motion:reduce){.carousel-fade .active.carousel-item-end,.carousel-fade .active.carousel-item-start{transition:none}}.carousel-control-next,.carousel-control-prev{position:absolute;top:0;bottom:0;z-index:1;display:flex;align-items:center;justify-content:center;width:15%;padding:0;color:#fff;text-align:center;background:0 0;filter: ;filter:var(--bs-carousel-control-icon-filter);border:0;opacity:.5;transition:opacity .15s ease}@media (prefers-reduced-motion:reduce){.carousel-control-next,.carousel-control-prev{transition:none}}.carousel-control-next:focus,.carousel-control-next:hover,.carousel-control-prev:focus,.carousel-control-prev:hover{color:#fff;text-decoration:none;outline:0;opacity:.9}.carousel-control-prev{left:0}.carousel-control-next{right:0}.carousel-control-next-icon,.carousel-control-prev-icon{display:inline-block;width:2rem;height:2rem;background-repeat:no-repeat;background-position:50%;background-size:100% 100%}.carousel-control-prev-icon{background-image:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 16 16%27 fill=%27%23fff%27%3e%3cpath d=%27M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0%27/%3e%3c/svg%3e")}.carousel-control-next-icon{background-image:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 16 16%27 fill=%27%23fff%27%3e%3cpath d=%27M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708%27/%3e%3c/svg%3e")}.carousel-indicators{position:absolute;right:0;bottom:0;left:0;z-index:2;display:flex;justify-content:center;padding:0;margin-right:15%;margin-bottom:1rem;margin-left:15%}.carousel-indicators [data-bs-target]{box-sizing:content-box;flex:0 1 auto;width:30px;height:3px;padding:0;margin-right:3px;margin-left:3px;text-indent:-999px;cursor:pointer;background-color:#fff;background-color:var(--bs-carousel-indicator-active-bg);background-clip:padding-box;border:0;border-top:10px solid transparent;border-bottom:10px solid transparent;opacity:.5;transition:opacity .6s ease}@media (prefers-reduced-motion:reduce){.carousel-indicators [data-bs-target]{transition:none}}.carousel-indicators .active{opacity:1}.carousel-caption{position:absolute;right:15%;bottom:1.25rem;left:15%;padding-top:1.25rem;padding-bottom:1.25rem;color:#fff;color:var(--bs-carousel-caption-color);text-align:center}.carousel-dark{--bs-carousel-indicator-active-bg:#000;--bs-carousel-caption-color:#000;--bs-carousel-control-icon-filter:invert(1) grayscale(100)}:root,[data-bs-theme=light]{--bs-carousel-indicator-active-bg:#fff;--bs-carousel-caption-color:#fff;--bs-carousel-control-icon-filter: }[data-bs-theme=dark]{--bs-carousel-indicator-active-bg:#000;--bs-carousel-caption-color:#000;--bs-carousel-control-icon-filter:invert(1) grayscale(100)}.spinner-border,.spinner-grow{display:inline-block;flex-shrink:0;width:var(--bs-spinner-width);height:var(--bs-spinner-height);vertical-align:var(--bs-spinner-vertical-align);border-radius:50%;animation:var(--bs-spinner-animation-speed) linear infinite var(--bs-spinner-animation-name)}@keyframes spinner-border{to{transform:rotate(360deg)}}.spinner-border{--bs-spinner-width:2rem;--bs-spinner-height:2rem;--bs-spinner-vertical-align:-0.125em;--bs-spinner-border-width:0.25em;--bs-spinner-animation-speed:0.75s;--bs-spinner-animation-name:spinner-border;border:var(--bs-spinner-border-width) solid currentcolor;border-right-color:transparent}.spinner-border-sm{--bs-spinner-width:1rem;--bs-spinner-height:1rem;--bs-spinner-border-width:0.2em}@keyframes spinner-grow{0%{transform:scale(0)}50%{opacity:1;transform:none}}.spinner-grow{--bs-spinner-width:2rem;--bs-spinner-height:2rem;--bs-spinner-vertical-align:-0.125em;--bs-spinner-animation-speed:0.75s;--bs-spinner-animation-name:spinner-grow;background-color:currentcolor;opacity:0}.spinner-grow-sm{--bs-spinner-width:1rem;--bs-spinner-height:1rem}@media (prefers-reduced-motion:reduce){.spinner-border,.spinner-grow{--bs-spinner-animation-speed:1.5s}}.offcanvas,.offcanvas-lg,.offcanvas-md,.offcanvas-sm,.offcanvas-xl,.offcanvas-xxl{--bs-offcanvas-zindex:1045;--bs-offcanvas-width:400px;--bs-offcanvas-height:30vh;--bs-offcanvas-padding-x:1rem;--bs-offcanvas-padding-y:1rem;--bs-offcanvas-color:var(--bs-body-color);--bs-offcanvas-bg:var(--bs-body-bg);--bs-offcanvas-border-width:var(--bs-border-width);--bs-offcanvas-border-color:var(--bs-border-color-translucent);--bs-offcanvas-box-shadow:var(--bs-box-shadow-sm);--bs-offcanvas-transition:transform 0.3s ease-in-out;--bs-offcanvas-title-line-height:1.5}@media (max-width:575.98px){.offcanvas-sm{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:var(--bs-offcanvas-transition)}}@media (max-width:575.98px) and (prefers-reduced-motion:reduce){.offcanvas-sm{transition:none}}@media (max-width:575.98px){.offcanvas-sm.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}.offcanvas-sm.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}.offcanvas-sm.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}.offcanvas-sm.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}.offcanvas-sm.show:not(.hiding),.offcanvas-sm.showing{transform:none}.offcanvas-sm.hiding,.offcanvas-sm.show,.offcanvas-sm.showing{visibility:visible}}@media (min-width:576px){.offcanvas-sm{--bs-offcanvas-height:auto;--bs-offcanvas-border-width:0;background-color:transparent!important}.offcanvas-sm .offcanvas-header{display:none}.offcanvas-sm .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:transparent!important}}@media (max-width:767.98px){.offcanvas-md{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:var(--bs-offcanvas-transition)}}@media (max-width:767.98px) and (prefers-reduced-motion:reduce){.offcanvas-md{transition:none}}@media (max-width:767.98px){.offcanvas-md.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}.offcanvas-md.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}.offcanvas-md.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}.offcanvas-md.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}.offcanvas-md.show:not(.hiding),.offcanvas-md.showing{transform:none}.offcanvas-md.hiding,.offcanvas-md.show,.offcanvas-md.showing{visibility:visible}}@media (min-width:768px){.offcanvas-md{--bs-offcanvas-height:auto;--bs-offcanvas-border-width:0;background-color:transparent!important}.offcanvas-md .offcanvas-header{display:none}.offcanvas-md .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:transparent!important}}@media (max-width:991.98px){.offcanvas-lg{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:var(--bs-offcanvas-transition)}}@media (max-width:991.98px) and (prefers-reduced-motion:reduce){.offcanvas-lg{transition:none}}@media (max-width:991.98px){.offcanvas-lg.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}.offcanvas-lg.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}.offcanvas-lg.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}.offcanvas-lg.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}.offcanvas-lg.show:not(.hiding),.offcanvas-lg.showing{transform:none}.offcanvas-lg.hiding,.offcanvas-lg.show,.offcanvas-lg.showing{visibility:visible}}@media (min-width:992px){.offcanvas-lg{--bs-offcanvas-height:auto;--bs-offcanvas-border-width:0;background-color:transparent!important}.offcanvas-lg .offcanvas-header{display:none}.offcanvas-lg .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:transparent!important}}@media (max-width:1199.98px){.offcanvas-xl{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:var(--bs-offcanvas-transition)}}@media (max-width:1199.98px) and (prefers-reduced-motion:reduce){.offcanvas-xl{transition:none}}@media (max-width:1199.98px){.offcanvas-xl.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}.offcanvas-xl.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}.offcanvas-xl.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}.offcanvas-xl.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}.offcanvas-xl.show:not(.hiding),.offcanvas-xl.showing{transform:none}.offcanvas-xl.hiding,.offcanvas-xl.show,.offcanvas-xl.showing{visibility:visible}}@media (min-width:1200px){.offcanvas-xl{--bs-offcanvas-height:auto;--bs-offcanvas-border-width:0;background-color:transparent!important}.offcanvas-xl .offcanvas-header{display:none}.offcanvas-xl .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:transparent!important}}@media (max-width:1399.98px){.offcanvas-xxl{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:var(--bs-offcanvas-transition)}}@media (max-width:1399.98px) and (prefers-reduced-motion:reduce){.offcanvas-xxl{transition:none}}@media (max-width:1399.98px){.offcanvas-xxl.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}.offcanvas-xxl.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}.offcanvas-xxl.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}.offcanvas-xxl.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}.offcanvas-xxl.show:not(.hiding),.offcanvas-xxl.showing{transform:none}.offcanvas-xxl.hiding,.offcanvas-xxl.show,.offcanvas-xxl.showing{visibility:visible}}@media (min-width:1400px){.offcanvas-xxl{--bs-offcanvas-height:auto;--bs-offcanvas-border-width:0;background-color:transparent!important}.offcanvas-xxl .offcanvas-header{display:none}.offcanvas-xxl .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:transparent!important}}.offcanvas{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:var(--bs-offcanvas-transition)}@media (prefers-reduced-motion:reduce){.offcanvas{transition:none}}.offcanvas.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}.offcanvas.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}.offcanvas.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}.offcanvas.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}.offcanvas.show:not(.hiding),.offcanvas.showing{transform:none}.offcanvas.hiding,.offcanvas.show,.offcanvas.showing{visibility:visible}.offcanvas-backdrop{position:fixed;top:0;left:0;z-index:1040;width:100vw;height:100vh;background-color:#000}.offcanvas-backdrop.fade{opacity:0}.offcanvas-backdrop.show{opacity:.5}.offcanvas-header{display:flex;align-items:center;padding:var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x)}.offcanvas-header .btn-close{padding:calc(var(--bs-offcanvas-padding-y) * .5) calc(var(--bs-offcanvas-padding-x) * .5);margin-top:calc(-.5 * var(--bs-offcanvas-padding-y));margin-right:calc(-.5 * var(--bs-offcanvas-padding-x));margin-bottom:calc(-.5 * var(--bs-offcanvas-padding-y));margin-left:auto}.offcanvas-title{margin-bottom:0;line-height:var(--bs-offcanvas-title-line-height)}.offcanvas-body{flex-grow:1;padding:var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x);overflow-y:auto}.placeholder{display:inline-block;min-height:1em;vertical-align:middle;cursor:wait;background-color:currentcolor;opacity:.5}.placeholder.btn::before{display:inline-block;content:""}.placeholder-xs{min-height:.6em}.placeholder-sm{min-height:.8em}.placeholder-lg{min-height:1.2em}.placeholder-glow .placeholder{animation:placeholder-glow 2s ease-in-out infinite}@keyframes placeholder-glow{50%{opacity:.2}}.placeholder-wave{-webkit-mask-image:linear-gradient(130deg,#000 55%,rgba(0,0,0,0.8) 75%,#000 95%);mask-image:linear-gradient(130deg,#000 55%,rgba(0,0,0,0.8) 75%,#000 95%);-webkit-mask-size:200% 100%;mask-size:200% 100%;animation:placeholder-wave 2s linear infinite}@keyframes placeholder-wave{100%{-webkit-mask-position:-200% 0%;mask-position:-200% 0%}}.clearfix::after{display:block;clear:both;content:""}.text-bg-primary{color:#fff!important;background-color:RGBA(13,110,253,1)!important;background-color:RGBA(var(--bs-primary-rgb),var(--bs-bg-opacity,1))!important}.text-bg-secondary{color:#fff!important;background-color:RGBA(108,117,125,1)!important;background-color:RGBA(var(--bs-secondary-rgb),var(--bs-bg-opacity,1))!important}.text-bg-success{color:#fff!important;background-color:RGBA(25,135,84,1)!important;background-color:RGBA(var(--bs-success-rgb),var(--bs-bg-opacity,1))!important}.text-bg-info{color:#000!important;background-color:RGBA(13,202,240,1)!important;background-color:RGBA(var(--bs-info-rgb),var(--bs-bg-opacity,1))!important}.text-bg-warning{color:#000!important;background-color:RGBA(255,193,7,1)!important;background-color:RGBA(var(--bs-warning-rgb),var(--bs-bg-opacity,1))!important}.text-bg-danger{color:#fff!important;background-color:RGBA(220,53,69,1)!important;background-color:RGBA(var(--bs-danger-rgb),var(--bs-bg-opacity,1))!important}.text-bg-light{color:#000!important;background-color:RGBA(248,249,250,1)!important;background-color:RGBA(var(--bs-light-rgb),var(--bs-bg-opacity,1))!important}.text-bg-dark{color:#fff!important;background-color:RGBA(33,37,41,1)!important;background-color:RGBA(var(--bs-dark-rgb),var(--bs-bg-opacity,1))!important}.link-primary{color:RGBA(13,110,253,1)!important;color:RGBA(var(--bs-primary-rgb),var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(13,110,253,1)!important;-webkit-text-decoration-color:RGBA(var(--bs-primary-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(13,110,253,1)!important;text-decoration-color:RGBA(var(--bs-primary-rgb),var(--bs-link-underline-opacity,1))!important}.link-primary:focus,.link-primary:hover{color:RGBA(10,88,202,1)!important;color:RGBA(10,88,202,var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(10,88,202,1)!important;-webkit-text-decoration-color:RGBA(10,88,202,var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(10,88,202,1)!important;text-decoration-color:RGBA(10,88,202,var(--bs-link-underline-opacity,1))!important}.link-secondary{color:RGBA(108,117,125,1)!important;color:RGBA(var(--bs-secondary-rgb),var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(108,117,125,1)!important;-webkit-text-decoration-color:RGBA(var(--bs-secondary-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(108,117,125,1)!important;text-decoration-color:RGBA(var(--bs-secondary-rgb),var(--bs-link-underline-opacity,1))!important}.link-secondary:focus,.link-secondary:hover{color:RGBA(86,94,100,1)!important;color:RGBA(86,94,100,var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(86,94,100,1)!important;-webkit-text-decoration-color:RGBA(86,94,100,var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(86,94,100,1)!important;text-decoration-color:RGBA(86,94,100,var(--bs-link-underline-opacity,1))!important}.link-success{color:RGBA(25,135,84,1)!important;color:RGBA(var(--bs-success-rgb),var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(25,135,84,1)!important;-webkit-text-decoration-color:RGBA(var(--bs-success-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(25,135,84,1)!important;text-decoration-color:RGBA(var(--bs-success-rgb),var(--bs-link-underline-opacity,1))!important}.link-success:focus,.link-success:hover{color:RGBA(20,108,67,1)!important;color:RGBA(20,108,67,var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(20,108,67,1)!important;-webkit-text-decoration-color:RGBA(20,108,67,var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(20,108,67,1)!important;text-decoration-color:RGBA(20,108,67,var(--bs-link-underline-opacity,1))!important}.link-info{color:RGBA(13,202,240,1)!important;color:RGBA(var(--bs-info-rgb),var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(13,202,240,1)!important;-webkit-text-decoration-color:RGBA(var(--bs-info-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(13,202,240,1)!important;text-decoration-color:RGBA(var(--bs-info-rgb),var(--bs-link-underline-opacity,1))!important}.link-info:focus,.link-info:hover{color:RGBA(61,213,243,1)!important;color:RGBA(61,213,243,var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(61,213,243,1)!important;-webkit-text-decoration-color:RGBA(61,213,243,var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(61,213,243,1)!important;text-decoration-color:RGBA(61,213,243,var(--bs-link-underline-opacity,1))!important}.link-warning{color:RGBA(255,193,7,1)!important;color:RGBA(var(--bs-warning-rgb),var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(255,193,7,1)!important;-webkit-text-decoration-color:RGBA(var(--bs-warning-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(255,193,7,1)!important;text-decoration-color:RGBA(var(--bs-warning-rgb),var(--bs-link-underline-opacity,1))!important}.link-warning:focus,.link-warning:hover{color:RGBA(255,205,57,1)!important;color:RGBA(255,205,57,var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(255,205,57,1)!important;-webkit-text-decoration-color:RGBA(255,205,57,var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(255,205,57,1)!important;text-decoration-color:RGBA(255,205,57,var(--bs-link-underline-opacity,1))!important}.link-danger{color:RGBA(220,53,69,1)!important;color:RGBA(var(--bs-danger-rgb),var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(220,53,69,1)!important;-webkit-text-decoration-color:RGBA(var(--bs-danger-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(220,53,69,1)!important;text-decoration-color:RGBA(var(--bs-danger-rgb),var(--bs-link-underline-opacity,1))!important}.link-danger:focus,.link-danger:hover{color:RGBA(176,42,55,1)!important;color:RGBA(176,42,55,var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(176,42,55,1)!important;-webkit-text-decoration-color:RGBA(176,42,55,var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(176,42,55,1)!important;text-decoration-color:RGBA(176,42,55,var(--bs-link-underline-opacity,1))!important}.link-light{color:RGBA(248,249,250,1)!important;color:RGBA(var(--bs-light-rgb),var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(248,249,250,1)!important;-webkit-text-decoration-color:RGBA(var(--bs-light-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(248,249,250,1)!important;text-decoration-color:RGBA(var(--bs-light-rgb),var(--bs-link-underline-opacity,1))!important}.link-light:focus,.link-light:hover{color:RGBA(249,250,251,1)!important;color:RGBA(249,250,251,var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(249,250,251,1)!important;-webkit-text-decoration-color:RGBA(249,250,251,var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(249,250,251,1)!important;text-decoration-color:RGBA(249,250,251,var(--bs-link-underline-opacity,1))!important}.link-dark{color:RGBA(33,37,41,1)!important;color:RGBA(var(--bs-dark-rgb),var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(33,37,41,1)!important;-webkit-text-decoration-color:RGBA(var(--bs-dark-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(33,37,41,1)!important;text-decoration-color:RGBA(var(--bs-dark-rgb),var(--bs-link-underline-opacity,1))!important}.link-dark:focus,.link-dark:hover{color:RGBA(26,30,33,1)!important;color:RGBA(26,30,33,var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(26,30,33,1)!important;-webkit-text-decoration-color:RGBA(26,30,33,var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(26,30,33,1)!important;text-decoration-color:RGBA(26,30,33,var(--bs-link-underline-opacity,1))!important}.link-body-emphasis{color:RGBA(0,0,0,1)!important;color:RGBA(var(--bs-emphasis-color-rgb),var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(0,0,0,1)!important;-webkit-text-decoration-color:RGBA(var(--bs-emphasis-color-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(0,0,0,1)!important;text-decoration-color:RGBA(var(--bs-emphasis-color-rgb),var(--bs-link-underline-opacity,1))!important}.link-body-emphasis:focus,.link-body-emphasis:hover{color:RGBA(0,0,0,.75)!important;color:RGBA(var(--bs-emphasis-color-rgb),var(--bs-link-opacity,.75))!important;-webkit-text-decoration-color:RGBA(0,0,0,0.75)!important;-webkit-text-decoration-color:RGBA(var(--bs-emphasis-color-rgb),var(--bs-link-underline-opacity,0.75))!important;text-decoration-color:RGBA(0,0,0,0.75)!important;text-decoration-color:RGBA(var(--bs-emphasis-color-rgb),var(--bs-link-underline-opacity,0.75))!important}.focus-ring:focus{outline:0;box-shadow:0 0 0 0.25rem rgba(13, 110, 253, 0.25);box-shadow:var(--bs-focus-ring-x,0) var(--bs-focus-ring-y,0) var(--bs-focus-ring-blur,0) var(--bs-focus-ring-width) var(--bs-focus-ring-color)}.icon-link{display:inline-flex;gap:.375rem;align-items:center;-webkit-text-decoration-color:rgba(13,110,253,0.5);-webkit-text-decoration-color:rgba(var(--bs-link-color-rgb),var(--bs-link-opacity,0.5));text-decoration-color:rgba(13,110,253,0.5);text-decoration-color:rgba(var(--bs-link-color-rgb),var(--bs-link-opacity,0.5));text-underline-offset:0.25em;-webkit-backface-visibility:hidden;backface-visibility:hidden}.icon-link>.bi{flex-shrink:0;width:1em;height:1em;fill:currentcolor;transition:.2s ease-in-out transform}@media (prefers-reduced-motion:reduce){.icon-link>.bi{transition:none}}.icon-link-hover:focus-visible>.bi,.icon-link-hover:hover>.bi{transform:translate3d(.25em,0,0);transform:var(--bs-icon-link-transform,translate3d(.25em,0,0))}.ratio{position:relative;width:100%}.ratio::before{display:block;padding-top:var(--bs-aspect-ratio);content:""}.ratio>*{position:absolute;top:0;left:0;width:100%;height:100%}.ratio-1x1{--bs-aspect-ratio:100%}.ratio-4x3{--bs-aspect-ratio:75%}.ratio-16x9{--bs-aspect-ratio:56.25%}.ratio-21x9{--bs-aspect-ratio:42.8571428571%}.fixed-top{position:fixed;top:0;right:0;left:0;z-index:1030}.fixed-bottom{position:fixed;right:0;bottom:0;left:0;z-index:1030}.sticky-top{position:-webkit-sticky;position:sticky;top:0;z-index:1020}.sticky-bottom{position:-webkit-sticky;position:sticky;bottom:0;z-index:1020}@media (min-width:576px){.sticky-sm-top{position:-webkit-sticky;position:sticky;top:0;z-index:1020}.sticky-sm-bottom{position:-webkit-sticky;position:sticky;bottom:0;z-index:1020}}@media (min-width:768px){.sticky-md-top{position:-webkit-sticky;position:sticky;top:0;z-index:1020}.sticky-md-bottom{position:-webkit-sticky;position:sticky;bottom:0;z-index:1020}}@media (min-width:992px){.sticky-lg-top{position:-webkit-sticky;position:sticky;top:0;z-index:1020}.sticky-lg-bottom{position:-webkit-sticky;position:sticky;bottom:0;z-index:1020}}@media (min-width:1200px){.sticky-xl-top{position:-webkit-sticky;position:sticky;top:0;z-index:1020}.sticky-xl-bottom{position:-webkit-sticky;position:sticky;bottom:0;z-index:1020}}@media (min-width:1400px){.sticky-xxl-top{position:-webkit-sticky;position:sticky;top:0;z-index:1020}.sticky-xxl-bottom{position:-webkit-sticky;position:sticky;bottom:0;z-index:1020}}.hstack{display:flex;flex-direction:row;align-items:center;align-self:stretch}.vstack{display:flex;flex:1 1 auto;flex-direction:column;align-self:stretch}.visually-hidden,.visually-hidden-focusable:not(:focus):not(:focus-within){width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.visually-hidden-focusable:not(:focus):not(:focus-within):not(caption),.visually-hidden:not(caption){position:absolute!important}.visually-hidden *,.visually-hidden-focusable:not(:focus):not(:focus-within) *{overflow:hidden!important}.stretched-link::after{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;content:""}.text-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vr{display:inline-block;align-self:stretch;width:1px;width:var(--bs-border-width);min-height:1em;background-color:currentcolor;opacity:.25}.align-baseline{vertical-align:baseline!important}.align-top{vertical-align:top!important}.align-middle{vertical-align:middle!important}.align-bottom{vertical-align:bottom!important}.align-text-bottom{vertical-align:text-bottom!important}.align-text-top{vertical-align:text-top!important}.float-start{float:left!important}.float-end{float:right!important}.float-none{float:none!important}.object-fit-contain{object-fit:contain!important}.object-fit-cover{object-fit:cover!important}.object-fit-fill{object-fit:fill!important}.object-fit-scale{object-fit:scale-down!important}.object-fit-none{object-fit:none!important}.opacity-0{opacity:0!important}.opacity-25{opacity:.25!important}.opacity-50{opacity:.5!important}.opacity-75{opacity:.75!important}.opacity-100{opacity:1!important}.overflow-auto{overflow:auto!important}.overflow-hidden{overflow:hidden!important}.overflow-visible{overflow:visible!important}.overflow-scroll{overflow:scroll!important}.overflow-x-auto{overflow-x:auto!important}.overflow-x-hidden{overflow-x:hidden!important}.overflow-x-visible{overflow-x:visible!important}.overflow-x-scroll{overflow-x:scroll!important}.overflow-y-auto{overflow-y:auto!important}.overflow-y-hidden{overflow-y:hidden!important}.overflow-y-visible{overflow-y:visible!important}.overflow-y-scroll{overflow-y:scroll!important}.d-inline{display:inline!important}.d-inline-block{display:inline-block!important}.d-block{display:block!important}.d-grid{display:grid!important}.d-inline-grid{display:inline-grid!important}.d-table{display:table!important}.d-table-row{display:table-row!important}.d-table-cell{display:table-cell!important}.d-flex{display:flex!important}.d-inline-flex{display:inline-flex!important}.d-none{display:none!important}.shadow{box-shadow:0 0.5rem 1rem rgba(0, 0, 0, 0.15)!important;box-shadow:var(--bs-box-shadow)!important}.shadow-sm{box-shadow:0 0.125rem 0.25rem rgba(0, 0, 0, 0.075)!important;box-shadow:var(--bs-box-shadow-sm)!important}.shadow-lg{box-shadow:0 1rem 3rem rgba(0, 0, 0, 0.175)!important;box-shadow:var(--bs-box-shadow-lg)!important}.shadow-none{box-shadow:none!important}.focus-ring-primary{--bs-focus-ring-color:rgba(var(--bs-primary-rgb), var(--bs-focus-ring-opacity))}.focus-ring-secondary{--bs-focus-ring-color:rgba(var(--bs-secondary-rgb), var(--bs-focus-ring-opacity))}.focus-ring-success{--bs-focus-ring-color:rgba(var(--bs-success-rgb), var(--bs-focus-ring-opacity))}.focus-ring-info{--bs-focus-ring-color:rgba(var(--bs-info-rgb), var(--bs-focus-ring-opacity))}.focus-ring-warning{--bs-focus-ring-color:rgba(var(--bs-warning-rgb), var(--bs-focus-ring-opacity))}.focus-ring-danger{--bs-focus-ring-color:rgba(var(--bs-danger-rgb), var(--bs-focus-ring-opacity))}.focus-ring-light{--bs-focus-ring-color:rgba(var(--bs-light-rgb), var(--bs-focus-ring-opacity))}.focus-ring-dark{--bs-focus-ring-color:rgba(var(--bs-dark-rgb), var(--bs-focus-ring-opacity))}.position-static{position:static!important}.position-relative{position:relative!important}.position-absolute{position:absolute!important}.position-fixed{position:fixed!important}.position-sticky{position:-webkit-sticky!important;position:sticky!important}.top-0{top:0!important}.top-50{top:50%!important}.top-100{top:100%!important}.bottom-0{bottom:0!important}.bottom-50{bottom:50%!important}.bottom-100{bottom:100%!important}.start-0{left:0!important}.start-50{left:50%!important}.start-100{left:100%!important}.end-0{right:0!important}.end-50{right:50%!important}.end-100{right:100%!important}.translate-middle{transform:translate(-50%,-50%)!important}.translate-middle-x{transform:translateX(-50%)!important}.translate-middle-y{transform:translateY(-50%)!important}.border{border:1px solid #dee2e6!important;border:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important}.border-0{border:0!important}.border-top{border-top:1px solid #dee2e6!important;border-top:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important}.border-top-0{border-top:0!important}.border-end{border-right:1px solid #dee2e6!important;border-right:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important}.border-end-0{border-right:0!important}.border-bottom{border-bottom:1px solid #dee2e6!important;border-bottom:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important}.border-bottom-0{border-bottom:0!important}.border-start{border-left:1px solid #dee2e6!important;border-left:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important}.border-start-0{border-left:0!important}.border-primary{--bs-border-opacity:1;border-color:rgba(13,110,253,var(--bs-border-opacity))!important;border-color:rgba(var(--bs-primary-rgb),var(--bs-border-opacity))!important}.border-secondary{--bs-border-opacity:1;border-color:rgba(108,117,125,var(--bs-border-opacity))!important;border-color:rgba(var(--bs-secondary-rgb),var(--bs-border-opacity))!important}.border-success{--bs-border-opacity:1;border-color:rgba(25,135,84,var(--bs-border-opacity))!important;border-color:rgba(var(--bs-success-rgb),var(--bs-border-opacity))!important}.border-info{--bs-border-opacity:1;border-color:rgba(13,202,240,var(--bs-border-opacity))!important;border-color:rgba(var(--bs-info-rgb),var(--bs-border-opacity))!important}.border-warning{--bs-border-opacity:1;border-color:rgba(255,193,7,var(--bs-border-opacity))!important;border-color:rgba(var(--bs-warning-rgb),var(--bs-border-opacity))!important}.border-danger{--bs-border-opacity:1;border-color:rgba(220,53,69,var(--bs-border-opacity))!important;border-color:rgba(var(--bs-danger-rgb),var(--bs-border-opacity))!important}.border-light{--bs-border-opacity:1;border-color:rgba(248,249,250,var(--bs-border-opacity))!important;border-color:rgba(var(--bs-light-rgb),var(--bs-border-opacity))!important}.border-dark{--bs-border-opacity:1;border-color:rgba(33,37,41,var(--bs-border-opacity))!important;border-color:rgba(var(--bs-dark-rgb),var(--bs-border-opacity))!important}.border-black{--bs-border-opacity:1;border-color:rgba(0,0,0,var(--bs-border-opacity))!important;border-color:rgba(var(--bs-black-rgb),var(--bs-border-opacity))!important}.border-white{--bs-border-opacity:1;border-color:rgba(255,255,255,var(--bs-border-opacity))!important;border-color:rgba(var(--bs-white-rgb),var(--bs-border-opacity))!important}.border-primary-subtle{border-color:#9ec5fe!important;border-color:var(--bs-primary-border-subtle)!important}.border-secondary-subtle{border-color:#c4c8cb!important;border-color:var(--bs-secondary-border-subtle)!important}.border-success-subtle{border-color:#a3cfbb!important;border-color:var(--bs-success-border-subtle)!important}.border-info-subtle{border-color:#9eeaf9!important;border-color:var(--bs-info-border-subtle)!important}.border-warning-subtle{border-color:#ffe69c!important;border-color:var(--bs-warning-border-subtle)!important}.border-danger-subtle{border-color:#f1aeb5!important;border-color:var(--bs-danger-border-subtle)!important}.border-light-subtle{border-color:#e9ecef!important;border-color:var(--bs-light-border-subtle)!important}.border-dark-subtle{border-color:#adb5bd!important;border-color:var(--bs-dark-border-subtle)!important}.border-1{border-width:1px!important}.border-2{border-width:2px!important}.border-3{border-width:3px!important}.border-4{border-width:4px!important}.border-5{border-width:5px!important}.border-opacity-10{--bs-border-opacity:0.1}.border-opacity-25{--bs-border-opacity:0.25}.border-opacity-50{--bs-border-opacity:0.5}.border-opacity-75{--bs-border-opacity:0.75}.border-opacity-100{--bs-border-opacity:1}.w-25{width:25%!important}.w-50{width:50%!important}.w-75{width:75%!important}.w-100{width:100%!important}.w-auto{width:auto!important}.mw-100{max-width:100%!important}.vw-100{width:100vw!important}.min-vw-100{min-width:100vw!important}.h-25{height:25%!important}.h-50{height:50%!important}.h-75{height:75%!important}.h-100{height:100%!important}.h-auto{height:auto!important}.mh-100{max-height:100%!important}.vh-100{height:100vh!important}.min-vh-100{min-height:100vh!important}.flex-fill{flex:1 1 auto!important}.flex-row{flex-direction:row!important}.flex-column{flex-direction:column!important}.flex-row-reverse{flex-direction:row-reverse!important}.flex-column-reverse{flex-direction:column-reverse!important}.flex-grow-0{flex-grow:0!important}.flex-grow-1{flex-grow:1!important}.flex-shrink-0{flex-shrink:0!important}.flex-shrink-1{flex-shrink:1!important}.flex-wrap{flex-wrap:wrap!important}.flex-nowrap{flex-wrap:nowrap!important}.flex-wrap-reverse{flex-wrap:wrap-reverse!important}.justify-content-start{justify-content:flex-start!important}.justify-content-end{justify-content:flex-end!important}.justify-content-center{justify-content:center!important}.justify-content-between{justify-content:space-between!important}.justify-content-around{justify-content:space-around!important}.justify-content-evenly{justify-content:space-evenly!important}.align-items-start{align-items:flex-start!important}.align-items-end{align-items:flex-end!important}.align-items-center{align-items:center!important}.align-items-baseline{align-items:baseline!important}.align-items-stretch{align-items:stretch!important}.align-content-start{align-content:flex-start!important}.align-content-end{align-content:flex-end!important}.align-content-center{align-content:center!important}.align-content-between{align-content:space-between!important}.align-content-around{align-content:space-around!important}.align-content-stretch{align-content:stretch!important}.align-self-auto{align-self:auto!important}.align-self-start{align-self:flex-start!important}.align-self-end{align-self:flex-end!important}.align-self-center{align-self:center!important}.align-self-baseline{align-self:baseline!important}.align-self-stretch{align-self:stretch!important}.order-first{order:-1!important}.order-0{order:0!important}.order-1{order:1!important}.order-2{order:2!important}.order-3{order:3!important}.order-4{order:4!important}.order-5{order:5!important}.order-last{order:6!important}.m-0{margin:0!important}.m-1{margin:.25rem!important}.m-2{margin:.5rem!important}.m-3{margin:1rem!important}.m-4{margin:1.5rem!important}.m-5{margin:3rem!important}.m-auto{margin:auto!important}.mx-0{margin-right:0!important;margin-left:0!important}.mx-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-3{margin-right:1rem!important;margin-left:1rem!important}.mx-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-5{margin-right:3rem!important;margin-left:3rem!important}.mx-auto{margin-right:auto!important;margin-left:auto!important}.my-0{margin-top:0!important;margin-bottom:0!important}.my-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-0{margin-top:0!important}.mt-1{margin-top:.25rem!important}.mt-2{margin-top:.5rem!important}.mt-3{margin-top:1rem!important}.mt-4{margin-top:1.5rem!important}.mt-5{margin-top:3rem!important}.mt-auto{margin-top:auto!important}.me-0{margin-right:0!important}.me-1{margin-right:.25rem!important}.me-2{margin-right:.5rem!important}.me-3{margin-right:1rem!important}.me-4{margin-right:1.5rem!important}.me-5{margin-right:3rem!important}.me-auto{margin-right:auto!important}.mb-0{margin-bottom:0!important}.mb-1{margin-bottom:.25rem!important}.mb-2{margin-bottom:.5rem!important}.mb-3{margin-bottom:1rem!important}.mb-4{margin-bottom:1.5rem!important}.mb-5{margin-bottom:3rem!important}.mb-auto{margin-bottom:auto!important}.ms-0{margin-left:0!important}.ms-1{margin-left:.25rem!important}.ms-2{margin-left:.5rem!important}.ms-3{margin-left:1rem!important}.ms-4{margin-left:1.5rem!important}.ms-5{margin-left:3rem!important}.ms-auto{margin-left:auto!important}.p-0{padding:0!important}.p-1{padding:.25rem!important}.p-2{padding:.5rem!important}.p-3{padding:1rem!important}.p-4{padding:1.5rem!important}.p-5{padding:3rem!important}.px-0{padding-right:0!important;padding-left:0!important}.px-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-3{padding-right:1rem!important;padding-left:1rem!important}.px-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-5{padding-right:3rem!important;padding-left:3rem!important}.py-0{padding-top:0!important;padding-bottom:0!important}.py-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-0{padding-top:0!important}.pt-1{padding-top:.25rem!important}.pt-2{padding-top:.5rem!important}.pt-3{padding-top:1rem!important}.pt-4{padding-top:1.5rem!important}.pt-5{padding-top:3rem!important}.pe-0{padding-right:0!important}.pe-1{padding-right:.25rem!important}.pe-2{padding-right:.5rem!important}.pe-3{padding-right:1rem!important}.pe-4{padding-right:1.5rem!important}.pe-5{padding-right:3rem!important}.pb-0{padding-bottom:0!important}.pb-1{padding-bottom:.25rem!important}.pb-2{padding-bottom:.5rem!important}.pb-3{padding-bottom:1rem!important}.pb-4{padding-bottom:1.5rem!important}.pb-5{padding-bottom:3rem!important}.ps-0{padding-left:0!important}.ps-1{padding-left:.25rem!important}.ps-2{padding-left:.5rem!important}.ps-3{padding-left:1rem!important}.ps-4{padding-left:1.5rem!important}.ps-5{padding-left:3rem!important}.gap-0{gap:0!important}.gap-1{gap:.25rem!important}.gap-2{gap:.5rem!important}.gap-3{gap:1rem!important}.gap-4{gap:1.5rem!important}.gap-5{gap:3rem!important}.row-gap-0{row-gap:0!important}.row-gap-1{row-gap:.25rem!important}.row-gap-2{row-gap:.5rem!important}.row-gap-3{row-gap:1rem!important}.row-gap-4{row-gap:1.5rem!important}.row-gap-5{row-gap:3rem!important}.column-gap-0{column-gap:0!important}.column-gap-1{column-gap:.25rem!important}.column-gap-2{column-gap:.5rem!important}.column-gap-3{column-gap:1rem!important}.column-gap-4{column-gap:1.5rem!important}.column-gap-5{column-gap:3rem!important}.font-monospace{font-family:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace!important;font-family:var(--bs-font-monospace)!important}.fs-1{font-size:calc(1.375rem + 1.5vw)!important}.fs-2{font-size:calc(1.325rem + .9vw)!important}.fs-3{font-size:calc(1.3rem + .6vw)!important}.fs-4{font-size:calc(1.275rem + .3vw)!important}.fs-5{font-size:1.25rem!important}.fs-6{font-size:1rem!important}.fst-italic{font-style:italic!important}.fst-normal{font-style:normal!important}.fw-lighter{font-weight:lighter!important}.fw-light{font-weight:300!important}.fw-normal{font-weight:400!important}.fw-medium{font-weight:500!important}.fw-semibold{font-weight:600!important}.fw-bold{font-weight:700!important}.fw-bolder{font-weight:bolder!important}.lh-1{line-height:1!important}.lh-sm{line-height:1.25!important}.lh-base{line-height:1.5!important}.lh-lg{line-height:2!important}.text-start{text-align:left!important}.text-end{text-align:right!important}.text-center{text-align:center!important}.text-decoration-none{text-decoration:none!important}.text-decoration-underline{text-decoration:underline!important}.text-decoration-line-through{text-decoration:line-through!important}.text-lowercase{text-transform:lowercase!important}.text-uppercase{text-transform:uppercase!important}.text-capitalize{text-transform:capitalize!important}.text-wrap{white-space:normal!important}.text-nowrap{white-space:nowrap!important}.text-break{word-wrap:break-word!important;word-break:break-word!important}.text-primary{--bs-text-opacity:1;color:rgba(13,110,253,var(--bs-text-opacity))!important;color:rgba(var(--bs-primary-rgb),var(--bs-text-opacity))!important}.text-secondary{--bs-text-opacity:1;color:rgba(108,117,125,var(--bs-text-opacity))!important;color:rgba(var(--bs-secondary-rgb),var(--bs-text-opacity))!important}.text-success{--bs-text-opacity:1;color:rgba(25,135,84,var(--bs-text-opacity))!important;color:rgba(var(--bs-success-rgb),var(--bs-text-opacity))!important}.text-info{--bs-text-opacity:1;color:rgba(13,202,240,var(--bs-text-opacity))!important;color:rgba(var(--bs-info-rgb),var(--bs-text-opacity))!important}.text-warning{--bs-text-opacity:1;color:rgba(255,193,7,var(--bs-text-opacity))!important;color:rgba(var(--bs-warning-rgb),var(--bs-text-opacity))!important}.text-danger{--bs-text-opacity:1;color:rgba(220,53,69,var(--bs-text-opacity))!important;color:rgba(var(--bs-danger-rgb),var(--bs-text-opacity))!important}.text-light{--bs-text-opacity:1;color:rgba(248,249,250,var(--bs-text-opacity))!important;color:rgba(var(--bs-light-rgb),var(--bs-text-opacity))!important}.text-dark{--bs-text-opacity:1;color:rgba(33,37,41,var(--bs-text-opacity))!important;color:rgba(var(--bs-dark-rgb),var(--bs-text-opacity))!important}.text-black{--bs-text-opacity:1;color:rgba(0,0,0,var(--bs-text-opacity))!important;color:rgba(var(--bs-black-rgb),var(--bs-text-opacity))!important}.text-white{--bs-text-opacity:1;color:rgba(255,255,255,var(--bs-text-opacity))!important;color:rgba(var(--bs-white-rgb),var(--bs-text-opacity))!important}.text-body{--bs-text-opacity:1;color:rgba(33,37,41,var(--bs-text-opacity))!important;color:rgba(var(--bs-body-color-rgb),var(--bs-text-opacity))!important}.text-muted{--bs-text-opacity:1;color:rgba(33, 37, 41, 0.75)!important;color:var(--bs-secondary-color)!important}.text-black-50{--bs-text-opacity:1;color:rgba(0,0,0,.5)!important}.text-white-50{--bs-text-opacity:1;color:rgba(255,255,255,.5)!important}.text-body-secondary{--bs-text-opacity:1;color:rgba(33, 37, 41, 0.75)!important;color:var(--bs-secondary-color)!important}.text-body-tertiary{--bs-text-opacity:1;color:rgba(33, 37, 41, 0.5)!important;color:var(--bs-tertiary-color)!important}.text-body-emphasis{--bs-text-opacity:1;color:#000!important;color:var(--bs-emphasis-color)!important}.text-reset{--bs-text-opacity:1;color:inherit!important}.text-opacity-25{--bs-text-opacity:0.25}.text-opacity-50{--bs-text-opacity:0.5}.text-opacity-75{--bs-text-opacity:0.75}.text-opacity-100{--bs-text-opacity:1}.text-primary-emphasis{color:#052c65!important;color:var(--bs-primary-text-emphasis)!important}.text-secondary-emphasis{color:#2b2f32!important;color:var(--bs-secondary-text-emphasis)!important}.text-success-emphasis{color:#0a3622!important;color:var(--bs-success-text-emphasis)!important}.text-info-emphasis{color:#055160!important;color:var(--bs-info-text-emphasis)!important}.text-warning-emphasis{color:#664d03!important;color:var(--bs-warning-text-emphasis)!important}.text-danger-emphasis{color:#58151c!important;color:var(--bs-danger-text-emphasis)!important}.text-light-emphasis{color:#495057!important;color:var(--bs-light-text-emphasis)!important}.text-dark-emphasis{color:#495057!important;color:var(--bs-dark-text-emphasis)!important}.link-opacity-10{--bs-link-opacity:0.1}.link-opacity-10-hover:hover{--bs-link-opacity:0.1}.link-opacity-25{--bs-link-opacity:0.25}.link-opacity-25-hover:hover{--bs-link-opacity:0.25}.link-opacity-50{--bs-link-opacity:0.5}.link-opacity-50-hover:hover{--bs-link-opacity:0.5}.link-opacity-75{--bs-link-opacity:0.75}.link-opacity-75-hover:hover{--bs-link-opacity:0.75}.link-opacity-100{--bs-link-opacity:1}.link-opacity-100-hover:hover{--bs-link-opacity:1}.link-offset-1{text-underline-offset:0.125em!important}.link-offset-1-hover:hover{text-underline-offset:0.125em!important}.link-offset-2{text-underline-offset:0.25em!important}.link-offset-2-hover:hover{text-underline-offset:0.25em!important}.link-offset-3{text-underline-offset:0.375em!important}.link-offset-3-hover:hover{text-underline-offset:0.375em!important}.link-underline-primary{--bs-link-underline-opacity:1;-webkit-text-decoration-color:rgba(13,110,253,var(--bs-link-underline-opacity))!important;-webkit-text-decoration-color:rgba(var(--bs-primary-rgb),var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(13,110,253,var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(var(--bs-primary-rgb),var(--bs-link-underline-opacity))!important}.link-underline-secondary{--bs-link-underline-opacity:1;-webkit-text-decoration-color:rgba(108,117,125,var(--bs-link-underline-opacity))!important;-webkit-text-decoration-color:rgba(var(--bs-secondary-rgb),var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(108,117,125,var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(var(--bs-secondary-rgb),var(--bs-link-underline-opacity))!important}.link-underline-success{--bs-link-underline-opacity:1;-webkit-text-decoration-color:rgba(25,135,84,var(--bs-link-underline-opacity))!important;-webkit-text-decoration-color:rgba(var(--bs-success-rgb),var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(25,135,84,var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(var(--bs-success-rgb),var(--bs-link-underline-opacity))!important}.link-underline-info{--bs-link-underline-opacity:1;-webkit-text-decoration-color:rgba(13,202,240,var(--bs-link-underline-opacity))!important;-webkit-text-decoration-color:rgba(var(--bs-info-rgb),var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(13,202,240,var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(var(--bs-info-rgb),var(--bs-link-underline-opacity))!important}.link-underline-warning{--bs-link-underline-opacity:1;-webkit-text-decoration-color:rgba(255,193,7,var(--bs-link-underline-opacity))!important;-webkit-text-decoration-color:rgba(var(--bs-warning-rgb),var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(255,193,7,var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(var(--bs-warning-rgb),var(--bs-link-underline-opacity))!important}.link-underline-danger{--bs-link-underline-opacity:1;-webkit-text-decoration-color:rgba(220,53,69,var(--bs-link-underline-opacity))!important;-webkit-text-decoration-color:rgba(var(--bs-danger-rgb),var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(220,53,69,var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(var(--bs-danger-rgb),var(--bs-link-underline-opacity))!important}.link-underline-light{--bs-link-underline-opacity:1;-webkit-text-decoration-color:rgba(248,249,250,var(--bs-link-underline-opacity))!important;-webkit-text-decoration-color:rgba(var(--bs-light-rgb),var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(248,249,250,var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(var(--bs-light-rgb),var(--bs-link-underline-opacity))!important}.link-underline-dark{--bs-link-underline-opacity:1;-webkit-text-decoration-color:rgba(33,37,41,var(--bs-link-underline-opacity))!important;-webkit-text-decoration-color:rgba(var(--bs-dark-rgb),var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(33,37,41,var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(var(--bs-dark-rgb),var(--bs-link-underline-opacity))!important}.link-underline{--bs-link-underline-opacity:1;-webkit-text-decoration-color:rgba(13,110,253,1)!important;-webkit-text-decoration-color:rgba(var(--bs-link-color-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:rgba(13,110,253,1)!important;text-decoration-color:rgba(var(--bs-link-color-rgb),var(--bs-link-underline-opacity,1))!important}.link-underline-opacity-0{--bs-link-underline-opacity:0}.link-underline-opacity-0-hover:hover{--bs-link-underline-opacity:0}.link-underline-opacity-10{--bs-link-underline-opacity:0.1}.link-underline-opacity-10-hover:hover{--bs-link-underline-opacity:0.1}.link-underline-opacity-25{--bs-link-underline-opacity:0.25}.link-underline-opacity-25-hover:hover{--bs-link-underline-opacity:0.25}.link-underline-opacity-50{--bs-link-underline-opacity:0.5}.link-underline-opacity-50-hover:hover{--bs-link-underline-opacity:0.5}.link-underline-opacity-75{--bs-link-underline-opacity:0.75}.link-underline-opacity-75-hover:hover{--bs-link-underline-opacity:0.75}.link-underline-opacity-100{--bs-link-underline-opacity:1}.link-underline-opacity-100-hover:hover{--bs-link-underline-opacity:1}.bg-primary{--bs-bg-opacity:1;background-color:rgba(13,110,253,var(--bs-bg-opacity))!important;background-color:rgba(var(--bs-primary-rgb),var(--bs-bg-opacity))!important}.bg-secondary{--bs-bg-opacity:1;background-color:rgba(108,117,125,var(--bs-bg-opacity))!important;background-color:rgba(var(--bs-secondary-rgb),var(--bs-bg-opacity))!important}.bg-success{--bs-bg-opacity:1;background-color:rgba(25,135,84,var(--bs-bg-opacity))!important;background-color:rgba(var(--bs-success-rgb),var(--bs-bg-opacity))!important}.bg-info{--bs-bg-opacity:1;background-color:rgba(13,202,240,var(--bs-bg-opacity))!important;background-color:rgba(var(--bs-info-rgb),var(--bs-bg-opacity))!important}.bg-warning{--bs-bg-opacity:1;background-color:rgba(255,193,7,var(--bs-bg-opacity))!important;background-color:rgba(var(--bs-warning-rgb),var(--bs-bg-opacity))!important}.bg-danger{--bs-bg-opacity:1;background-color:rgba(220,53,69,var(--bs-bg-opacity))!important;background-color:rgba(var(--bs-danger-rgb),var(--bs-bg-opacity))!important}.bg-light{--bs-bg-opacity:1;background-color:rgba(248,249,250,var(--bs-bg-opacity))!important;background-color:rgba(var(--bs-light-rgb),var(--bs-bg-opacity))!important}.bg-dark{--bs-bg-opacity:1;background-color:rgba(33,37,41,var(--bs-bg-opacity))!important;background-color:rgba(var(--bs-dark-rgb),var(--bs-bg-opacity))!important}.bg-black{--bs-bg-opacity:1;background-color:rgba(0,0,0,var(--bs-bg-opacity))!important;background-color:rgba(var(--bs-black-rgb),var(--bs-bg-opacity))!important}.bg-white{--bs-bg-opacity:1;background-color:rgba(255,255,255,var(--bs-bg-opacity))!important;background-color:rgba(var(--bs-white-rgb),var(--bs-bg-opacity))!important}.bg-body{--bs-bg-opacity:1;background-color:rgba(255,255,255,var(--bs-bg-opacity))!important;background-color:rgba(var(--bs-body-bg-rgb),var(--bs-bg-opacity))!important}.bg-transparent{--bs-bg-opacity:1;background-color:transparent!important}.bg-body-secondary{--bs-bg-opacity:1;background-color:rgba(233,236,239,var(--bs-bg-opacity))!important;background-color:rgba(var(--bs-secondary-bg-rgb),var(--bs-bg-opacity))!important}.bg-body-tertiary{--bs-bg-opacity:1;background-color:rgba(248,249,250,var(--bs-bg-opacity))!important;background-color:rgba(var(--bs-tertiary-bg-rgb),var(--bs-bg-opacity))!important}.bg-opacity-10{--bs-bg-opacity:0.1}.bg-opacity-25{--bs-bg-opacity:0.25}.bg-opacity-50{--bs-bg-opacity:0.5}.bg-opacity-75{--bs-bg-opacity:0.75}.bg-opacity-100{--bs-bg-opacity:1}.bg-primary-subtle{background-color:#cfe2ff!important;background-color:var(--bs-primary-bg-subtle)!important}.bg-secondary-subtle{background-color:#e2e3e5!important;background-color:var(--bs-secondary-bg-subtle)!important}.bg-success-subtle{background-color:#d1e7dd!important;background-color:var(--bs-success-bg-subtle)!important}.bg-info-subtle{background-color:#cff4fc!important;background-color:var(--bs-info-bg-subtle)!important}.bg-warning-subtle{background-color:#fff3cd!important;background-color:var(--bs-warning-bg-subtle)!important}.bg-danger-subtle{background-color:#f8d7da!important;background-color:var(--bs-danger-bg-subtle)!important}.bg-light-subtle{background-color:#fcfcfd!important;background-color:var(--bs-light-bg-subtle)!important}.bg-dark-subtle{background-color:#ced4da!important;background-color:var(--bs-dark-bg-subtle)!important}.bg-gradient{background-image:linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0))!important;background-image:var(--bs-gradient)!important}.user-select-all{-webkit-user-select:all!important;user-select:all!important}.user-select-auto{-webkit-user-select:auto!important;user-select:auto!important}.user-select-none{-webkit-user-select:none!important;user-select:none!important}.pe-none{pointer-events:none!important}.pe-auto{pointer-events:auto!important}.rounded{border-radius:0.375rem!important;border-radius:var(--bs-border-radius)!important}.rounded-0{border-radius:0!important}.rounded-1{border-radius:0.25rem!important;border-radius:var(--bs-border-radius-sm)!important}.rounded-2{border-radius:0.375rem!important;border-radius:var(--bs-border-radius)!important}.rounded-3{border-radius:0.5rem!important;border-radius:var(--bs-border-radius-lg)!important}.rounded-4{border-radius:1rem!important;border-radius:var(--bs-border-radius-xl)!important}.rounded-5{border-radius:2rem!important;border-radius:var(--bs-border-radius-xxl)!important}.rounded-circle{border-radius:50%!important}.rounded-pill{border-radius:50rem!important;border-radius:var(--bs-border-radius-pill)!important}.rounded-top{border-top-left-radius:0.375rem!important;border-top-left-radius:var(--bs-border-radius)!important;border-top-right-radius:0.375rem!important;border-top-right-radius:var(--bs-border-radius)!important}.rounded-top-0{border-top-left-radius:0!important;border-top-right-radius:0!important}.rounded-top-1{border-top-left-radius:0.25rem!important;border-top-left-radius:var(--bs-border-radius-sm)!important;border-top-right-radius:0.25rem!important;border-top-right-radius:var(--bs-border-radius-sm)!important}.rounded-top-2{border-top-left-radius:0.375rem!important;border-top-left-radius:var(--bs-border-radius)!important;border-top-right-radius:0.375rem!important;border-top-right-radius:var(--bs-border-radius)!important}.rounded-top-3{border-top-left-radius:0.5rem!important;border-top-left-radius:var(--bs-border-radius-lg)!important;border-top-right-radius:0.5rem!important;border-top-right-radius:var(--bs-border-radius-lg)!important}.rounded-top-4{border-top-left-radius:1rem!important;border-top-left-radius:var(--bs-border-radius-xl)!important;border-top-right-radius:1rem!important;border-top-right-radius:var(--bs-border-radius-xl)!important}.rounded-top-5{border-top-left-radius:2rem!important;border-top-left-radius:var(--bs-border-radius-xxl)!important;border-top-right-radius:2rem!important;border-top-right-radius:var(--bs-border-radius-xxl)!important}.rounded-top-circle{border-top-left-radius:50%!important;border-top-right-radius:50%!important}.rounded-top-pill{border-top-left-radius:50rem!important;border-top-left-radius:var(--bs-border-radius-pill)!important;border-top-right-radius:50rem!important;border-top-right-radius:var(--bs-border-radius-pill)!important}.rounded-end{border-top-right-radius:0.375rem!important;border-top-right-radius:var(--bs-border-radius)!important;border-bottom-right-radius:0.375rem!important;border-bottom-right-radius:var(--bs-border-radius)!important}.rounded-end-0{border-top-right-radius:0!important;border-bottom-right-radius:0!important}.rounded-end-1{border-top-right-radius:0.25rem!important;border-top-right-radius:var(--bs-border-radius-sm)!important;border-bottom-right-radius:0.25rem!important;border-bottom-right-radius:var(--bs-border-radius-sm)!important}.rounded-end-2{border-top-right-radius:0.375rem!important;border-top-right-radius:var(--bs-border-radius)!important;border-bottom-right-radius:0.375rem!important;border-bottom-right-radius:var(--bs-border-radius)!important}.rounded-end-3{border-top-right-radius:0.5rem!important;border-top-right-radius:var(--bs-border-radius-lg)!important;border-bottom-right-radius:0.5rem!important;border-bottom-right-radius:var(--bs-border-radius-lg)!important}.rounded-end-4{border-top-right-radius:1rem!important;border-top-right-radius:var(--bs-border-radius-xl)!important;border-bottom-right-radius:1rem!important;border-bottom-right-radius:var(--bs-border-radius-xl)!important}.rounded-end-5{border-top-right-radius:2rem!important;border-top-right-radius:var(--bs-border-radius-xxl)!important;border-bottom-right-radius:2rem!important;border-bottom-right-radius:var(--bs-border-radius-xxl)!important}.rounded-end-circle{border-top-right-radius:50%!important;border-bottom-right-radius:50%!important}.rounded-end-pill{border-top-right-radius:50rem!important;border-top-right-radius:var(--bs-border-radius-pill)!important;border-bottom-right-radius:50rem!important;border-bottom-right-radius:var(--bs-border-radius-pill)!important}.rounded-bottom{border-bottom-right-radius:0.375rem!important;border-bottom-right-radius:var(--bs-border-radius)!important;border-bottom-left-radius:0.375rem!important;border-bottom-left-radius:var(--bs-border-radius)!important}.rounded-bottom-0{border-bottom-right-radius:0!important;border-bottom-left-radius:0!important}.rounded-bottom-1{border-bottom-right-radius:0.25rem!important;border-bottom-right-radius:var(--bs-border-radius-sm)!important;border-bottom-left-radius:0.25rem!important;border-bottom-left-radius:var(--bs-border-radius-sm)!important}.rounded-bottom-2{border-bottom-right-radius:0.375rem!important;border-bottom-right-radius:var(--bs-border-radius)!important;border-bottom-left-radius:0.375rem!important;border-bottom-left-radius:var(--bs-border-radius)!important}.rounded-bottom-3{border-bottom-right-radius:0.5rem!important;border-bottom-right-radius:var(--bs-border-radius-lg)!important;border-bottom-left-radius:0.5rem!important;border-bottom-left-radius:var(--bs-border-radius-lg)!important}.rounded-bottom-4{border-bottom-right-radius:1rem!important;border-bottom-right-radius:var(--bs-border-radius-xl)!important;border-bottom-left-radius:1rem!important;border-bottom-left-radius:var(--bs-border-radius-xl)!important}.rounded-bottom-5{border-bottom-right-radius:2rem!important;border-bottom-right-radius:var(--bs-border-radius-xxl)!important;border-bottom-left-radius:2rem!important;border-bottom-left-radius:var(--bs-border-radius-xxl)!important}.rounded-bottom-circle{border-bottom-right-radius:50%!important;border-bottom-left-radius:50%!important}.rounded-bottom-pill{border-bottom-right-radius:50rem!important;border-bottom-right-radius:var(--bs-border-radius-pill)!important;border-bottom-left-radius:50rem!important;border-bottom-left-radius:var(--bs-border-radius-pill)!important}.rounded-start{border-bottom-left-radius:0.375rem!important;border-bottom-left-radius:var(--bs-border-radius)!important;border-top-left-radius:0.375rem!important;border-top-left-radius:var(--bs-border-radius)!important}.rounded-start-0{border-bottom-left-radius:0!important;border-top-left-radius:0!important}.rounded-start-1{border-bottom-left-radius:0.25rem!important;border-bottom-left-radius:var(--bs-border-radius-sm)!important;border-top-left-radius:0.25rem!important;border-top-left-radius:var(--bs-border-radius-sm)!important}.rounded-start-2{border-bottom-left-radius:0.375rem!important;border-bottom-left-radius:var(--bs-border-radius)!important;border-top-left-radius:0.375rem!important;border-top-left-radius:var(--bs-border-radius)!important}.rounded-start-3{border-bottom-left-radius:0.5rem!important;border-bottom-left-radius:var(--bs-border-radius-lg)!important;border-top-left-radius:0.5rem!important;border-top-left-radius:var(--bs-border-radius-lg)!important}.rounded-start-4{border-bottom-left-radius:1rem!important;border-bottom-left-radius:var(--bs-border-radius-xl)!important;border-top-left-radius:1rem!important;border-top-left-radius:var(--bs-border-radius-xl)!important}.rounded-start-5{border-bottom-left-radius:2rem!important;border-bottom-left-radius:var(--bs-border-radius-xxl)!important;border-top-left-radius:2rem!important;border-top-left-radius:var(--bs-border-radius-xxl)!important}.rounded-start-circle{border-bottom-left-radius:50%!important;border-top-left-radius:50%!important}.rounded-start-pill{border-bottom-left-radius:50rem!important;border-bottom-left-radius:var(--bs-border-radius-pill)!important;border-top-left-radius:50rem!important;border-top-left-radius:var(--bs-border-radius-pill)!important}.visible{visibility:visible!important}.invisible{visibility:hidden!important}.z-n1{z-index:-1!important}.z-0{z-index:0!important}.z-1{z-index:1!important}.z-2{z-index:2!important}.z-3{z-index:3!important}@media (min-width:576px){.float-sm-start{float:left!important}.float-sm-end{float:right!important}.float-sm-none{float:none!important}.object-fit-sm-contain{object-fit:contain!important}.object-fit-sm-cover{object-fit:cover!important}.object-fit-sm-fill{object-fit:fill!important}.object-fit-sm-scale{object-fit:scale-down!important}.object-fit-sm-none{object-fit:none!important}.d-sm-inline{display:inline!important}.d-sm-inline-block{display:inline-block!important}.d-sm-block{display:block!important}.d-sm-grid{display:grid!important}.d-sm-inline-grid{display:inline-grid!important}.d-sm-table{display:table!important}.d-sm-table-row{display:table-row!important}.d-sm-table-cell{display:table-cell!important}.d-sm-flex{display:flex!important}.d-sm-inline-flex{display:inline-flex!important}.d-sm-none{display:none!important}.flex-sm-fill{flex:1 1 auto!important}.flex-sm-row{flex-direction:row!important}.flex-sm-column{flex-direction:column!important}.flex-sm-row-reverse{flex-direction:row-reverse!important}.flex-sm-column-reverse{flex-direction:column-reverse!important}.flex-sm-grow-0{flex-grow:0!important}.flex-sm-grow-1{flex-grow:1!important}.flex-sm-shrink-0{flex-shrink:0!important}.flex-sm-shrink-1{flex-shrink:1!important}.flex-sm-wrap{flex-wrap:wrap!important}.flex-sm-nowrap{flex-wrap:nowrap!important}.flex-sm-wrap-reverse{flex-wrap:wrap-reverse!important}.justify-content-sm-start{justify-content:flex-start!important}.justify-content-sm-end{justify-content:flex-end!important}.justify-content-sm-center{justify-content:center!important}.justify-content-sm-between{justify-content:space-between!important}.justify-content-sm-around{justify-content:space-around!important}.justify-content-sm-evenly{justify-content:space-evenly!important}.align-items-sm-start{align-items:flex-start!important}.align-items-sm-end{align-items:flex-end!important}.align-items-sm-center{align-items:center!important}.align-items-sm-baseline{align-items:baseline!important}.align-items-sm-stretch{align-items:stretch!important}.align-content-sm-start{align-content:flex-start!important}.align-content-sm-end{align-content:flex-end!important}.align-content-sm-center{align-content:center!important}.align-content-sm-between{align-content:space-between!important}.align-content-sm-around{align-content:space-around!important}.align-content-sm-stretch{align-content:stretch!important}.align-self-sm-auto{align-self:auto!important}.align-self-sm-start{align-self:flex-start!important}.align-self-sm-end{align-self:flex-end!important}.align-self-sm-center{align-self:center!important}.align-self-sm-baseline{align-self:baseline!important}.align-self-sm-stretch{align-self:stretch!important}.order-sm-first{order:-1!important}.order-sm-0{order:0!important}.order-sm-1{order:1!important}.order-sm-2{order:2!important}.order-sm-3{order:3!important}.order-sm-4{order:4!important}.order-sm-5{order:5!important}.order-sm-last{order:6!important}.m-sm-0{margin:0!important}.m-sm-1{margin:.25rem!important}.m-sm-2{margin:.5rem!important}.m-sm-3{margin:1rem!important}.m-sm-4{margin:1.5rem!important}.m-sm-5{margin:3rem!important}.m-sm-auto{margin:auto!important}.mx-sm-0{margin-right:0!important;margin-left:0!important}.mx-sm-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-sm-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-sm-3{margin-right:1rem!important;margin-left:1rem!important}.mx-sm-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-sm-5{margin-right:3rem!important;margin-left:3rem!important}.mx-sm-auto{margin-right:auto!important;margin-left:auto!important}.my-sm-0{margin-top:0!important;margin-bottom:0!important}.my-sm-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-sm-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-sm-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-sm-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-sm-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-sm-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-sm-0{margin-top:0!important}.mt-sm-1{margin-top:.25rem!important}.mt-sm-2{margin-top:.5rem!important}.mt-sm-3{margin-top:1rem!important}.mt-sm-4{margin-top:1.5rem!important}.mt-sm-5{margin-top:3rem!important}.mt-sm-auto{margin-top:auto!important}.me-sm-0{margin-right:0!important}.me-sm-1{margin-right:.25rem!important}.me-sm-2{margin-right:.5rem!important}.me-sm-3{margin-right:1rem!important}.me-sm-4{margin-right:1.5rem!important}.me-sm-5{margin-right:3rem!important}.me-sm-auto{margin-right:auto!important}.mb-sm-0{margin-bottom:0!important}.mb-sm-1{margin-bottom:.25rem!important}.mb-sm-2{margin-bottom:.5rem!important}.mb-sm-3{margin-bottom:1rem!important}.mb-sm-4{margin-bottom:1.5rem!important}.mb-sm-5{margin-bottom:3rem!important}.mb-sm-auto{margin-bottom:auto!important}.ms-sm-0{margin-left:0!important}.ms-sm-1{margin-left:.25rem!important}.ms-sm-2{margin-left:.5rem!important}.ms-sm-3{margin-left:1rem!important}.ms-sm-4{margin-left:1.5rem!important}.ms-sm-5{margin-left:3rem!important}.ms-sm-auto{margin-left:auto!important}.p-sm-0{padding:0!important}.p-sm-1{padding:.25rem!important}.p-sm-2{padding:.5rem!important}.p-sm-3{padding:1rem!important}.p-sm-4{padding:1.5rem!important}.p-sm-5{padding:3rem!important}.px-sm-0{padding-right:0!important;padding-left:0!important}.px-sm-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-sm-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-sm-3{padding-right:1rem!important;padding-left:1rem!important}.px-sm-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-sm-5{padding-right:3rem!important;padding-left:3rem!important}.py-sm-0{padding-top:0!important;padding-bottom:0!important}.py-sm-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-sm-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-sm-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-sm-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-sm-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-sm-0{padding-top:0!important}.pt-sm-1{padding-top:.25rem!important}.pt-sm-2{padding-top:.5rem!important}.pt-sm-3{padding-top:1rem!important}.pt-sm-4{padding-top:1.5rem!important}.pt-sm-5{padding-top:3rem!important}.pe-sm-0{padding-right:0!important}.pe-sm-1{padding-right:.25rem!important}.pe-sm-2{padding-right:.5rem!important}.pe-sm-3{padding-right:1rem!important}.pe-sm-4{padding-right:1.5rem!important}.pe-sm-5{padding-right:3rem!important}.pb-sm-0{padding-bottom:0!important}.pb-sm-1{padding-bottom:.25rem!important}.pb-sm-2{padding-bottom:.5rem!important}.pb-sm-3{padding-bottom:1rem!important}.pb-sm-4{padding-bottom:1.5rem!important}.pb-sm-5{padding-bottom:3rem!important}.ps-sm-0{padding-left:0!important}.ps-sm-1{padding-left:.25rem!important}.ps-sm-2{padding-left:.5rem!important}.ps-sm-3{padding-left:1rem!important}.ps-sm-4{padding-left:1.5rem!important}.ps-sm-5{padding-left:3rem!important}.gap-sm-0{gap:0!important}.gap-sm-1{gap:.25rem!important}.gap-sm-2{gap:.5rem!important}.gap-sm-3{gap:1rem!important}.gap-sm-4{gap:1.5rem!important}.gap-sm-5{gap:3rem!important}.row-gap-sm-0{row-gap:0!important}.row-gap-sm-1{row-gap:.25rem!important}.row-gap-sm-2{row-gap:.5rem!important}.row-gap-sm-3{row-gap:1rem!important}.row-gap-sm-4{row-gap:1.5rem!important}.row-gap-sm-5{row-gap:3rem!important}.column-gap-sm-0{column-gap:0!important}.column-gap-sm-1{column-gap:.25rem!important}.column-gap-sm-2{column-gap:.5rem!important}.column-gap-sm-3{column-gap:1rem!important}.column-gap-sm-4{column-gap:1.5rem!important}.column-gap-sm-5{column-gap:3rem!important}.text-sm-start{text-align:left!important}.text-sm-end{text-align:right!important}.text-sm-center{text-align:center!important}}@media (min-width:768px){.float-md-start{float:left!important}.float-md-end{float:right!important}.float-md-none{float:none!important}.object-fit-md-contain{object-fit:contain!important}.object-fit-md-cover{object-fit:cover!important}.object-fit-md-fill{object-fit:fill!important}.object-fit-md-scale{object-fit:scale-down!important}.object-fit-md-none{object-fit:none!important}.d-md-inline{display:inline!important}.d-md-inline-block{display:inline-block!important}.d-md-block{display:block!important}.d-md-grid{display:grid!important}.d-md-inline-grid{display:inline-grid!important}.d-md-table{display:table!important}.d-md-table-row{display:table-row!important}.d-md-table-cell{display:table-cell!important}.d-md-flex{display:flex!important}.d-md-inline-flex{display:inline-flex!important}.d-md-none{display:none!important}.flex-md-fill{flex:1 1 auto!important}.flex-md-row{flex-direction:row!important}.flex-md-column{flex-direction:column!important}.flex-md-row-reverse{flex-direction:row-reverse!important}.flex-md-column-reverse{flex-direction:column-reverse!important}.flex-md-grow-0{flex-grow:0!important}.flex-md-grow-1{flex-grow:1!important}.flex-md-shrink-0{flex-shrink:0!important}.flex-md-shrink-1{flex-shrink:1!important}.flex-md-wrap{flex-wrap:wrap!important}.flex-md-nowrap{flex-wrap:nowrap!important}.flex-md-wrap-reverse{flex-wrap:wrap-reverse!important}.justify-content-md-start{justify-content:flex-start!important}.justify-content-md-end{justify-content:flex-end!important}.justify-content-md-center{justify-content:center!important}.justify-content-md-between{justify-content:space-between!important}.justify-content-md-around{justify-content:space-around!important}.justify-content-md-evenly{justify-content:space-evenly!important}.align-items-md-start{align-items:flex-start!important}.align-items-md-end{align-items:flex-end!important}.align-items-md-center{align-items:center!important}.align-items-md-baseline{align-items:baseline!important}.align-items-md-stretch{align-items:stretch!important}.align-content-md-start{align-content:flex-start!important}.align-content-md-end{align-content:flex-end!important}.align-content-md-center{align-content:center!important}.align-content-md-between{align-content:space-between!important}.align-content-md-around{align-content:space-around!important}.align-content-md-stretch{align-content:stretch!important}.align-self-md-auto{align-self:auto!important}.align-self-md-start{align-self:flex-start!important}.align-self-md-end{align-self:flex-end!important}.align-self-md-center{align-self:center!important}.align-self-md-baseline{align-self:baseline!important}.align-self-md-stretch{align-self:stretch!important}.order-md-first{order:-1!important}.order-md-0{order:0!important}.order-md-1{order:1!important}.order-md-2{order:2!important}.order-md-3{order:3!important}.order-md-4{order:4!important}.order-md-5{order:5!important}.order-md-last{order:6!important}.m-md-0{margin:0!important}.m-md-1{margin:.25rem!important}.m-md-2{margin:.5rem!important}.m-md-3{margin:1rem!important}.m-md-4{margin:1.5rem!important}.m-md-5{margin:3rem!important}.m-md-auto{margin:auto!important}.mx-md-0{margin-right:0!important;margin-left:0!important}.mx-md-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-md-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-md-3{margin-right:1rem!important;margin-left:1rem!important}.mx-md-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-md-5{margin-right:3rem!important;margin-left:3rem!important}.mx-md-auto{margin-right:auto!important;margin-left:auto!important}.my-md-0{margin-top:0!important;margin-bottom:0!important}.my-md-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-md-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-md-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-md-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-md-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-md-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-md-0{margin-top:0!important}.mt-md-1{margin-top:.25rem!important}.mt-md-2{margin-top:.5rem!important}.mt-md-3{margin-top:1rem!important}.mt-md-4{margin-top:1.5rem!important}.mt-md-5{margin-top:3rem!important}.mt-md-auto{margin-top:auto!important}.me-md-0{margin-right:0!important}.me-md-1{margin-right:.25rem!important}.me-md-2{margin-right:.5rem!important}.me-md-3{margin-right:1rem!important}.me-md-4{margin-right:1.5rem!important}.me-md-5{margin-right:3rem!important}.me-md-auto{margin-right:auto!important}.mb-md-0{margin-bottom:0!important}.mb-md-1{margin-bottom:.25rem!important}.mb-md-2{margin-bottom:.5rem!important}.mb-md-3{margin-bottom:1rem!important}.mb-md-4{margin-bottom:1.5rem!important}.mb-md-5{margin-bottom:3rem!important}.mb-md-auto{margin-bottom:auto!important}.ms-md-0{margin-left:0!important}.ms-md-1{margin-left:.25rem!important}.ms-md-2{margin-left:.5rem!important}.ms-md-3{margin-left:1rem!important}.ms-md-4{margin-left:1.5rem!important}.ms-md-5{margin-left:3rem!important}.ms-md-auto{margin-left:auto!important}.p-md-0{padding:0!important}.p-md-1{padding:.25rem!important}.p-md-2{padding:.5rem!important}.p-md-3{padding:1rem!important}.p-md-4{padding:1.5rem!important}.p-md-5{padding:3rem!important}.px-md-0{padding-right:0!important;padding-left:0!important}.px-md-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-md-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-md-3{padding-right:1rem!important;padding-left:1rem!important}.px-md-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-md-5{padding-right:3rem!important;padding-left:3rem!important}.py-md-0{padding-top:0!important;padding-bottom:0!important}.py-md-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-md-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-md-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-md-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-md-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-md-0{padding-top:0!important}.pt-md-1{padding-top:.25rem!important}.pt-md-2{padding-top:.5rem!important}.pt-md-3{padding-top:1rem!important}.pt-md-4{padding-top:1.5rem!important}.pt-md-5{padding-top:3rem!important}.pe-md-0{padding-right:0!important}.pe-md-1{padding-right:.25rem!important}.pe-md-2{padding-right:.5rem!important}.pe-md-3{padding-right:1rem!important}.pe-md-4{padding-right:1.5rem!important}.pe-md-5{padding-right:3rem!important}.pb-md-0{padding-bottom:0!important}.pb-md-1{padding-bottom:.25rem!important}.pb-md-2{padding-bottom:.5rem!important}.pb-md-3{padding-bottom:1rem!important}.pb-md-4{padding-bottom:1.5rem!important}.pb-md-5{padding-bottom:3rem!important}.ps-md-0{padding-left:0!important}.ps-md-1{padding-left:.25rem!important}.ps-md-2{padding-left:.5rem!important}.ps-md-3{padding-left:1rem!important}.ps-md-4{padding-left:1.5rem!important}.ps-md-5{padding-left:3rem!important}.gap-md-0{gap:0!important}.gap-md-1{gap:.25rem!important}.gap-md-2{gap:.5rem!important}.gap-md-3{gap:1rem!important}.gap-md-4{gap:1.5rem!important}.gap-md-5{gap:3rem!important}.row-gap-md-0{row-gap:0!important}.row-gap-md-1{row-gap:.25rem!important}.row-gap-md-2{row-gap:.5rem!important}.row-gap-md-3{row-gap:1rem!important}.row-gap-md-4{row-gap:1.5rem!important}.row-gap-md-5{row-gap:3rem!important}.column-gap-md-0{column-gap:0!important}.column-gap-md-1{column-gap:.25rem!important}.column-gap-md-2{column-gap:.5rem!important}.column-gap-md-3{column-gap:1rem!important}.column-gap-md-4{column-gap:1.5rem!important}.column-gap-md-5{column-gap:3rem!important}.text-md-start{text-align:left!important}.text-md-end{text-align:right!important}.text-md-center{text-align:center!important}}@media (min-width:992px){.float-lg-start{float:left!important}.float-lg-end{float:right!important}.float-lg-none{float:none!important}.object-fit-lg-contain{object-fit:contain!important}.object-fit-lg-cover{object-fit:cover!important}.object-fit-lg-fill{object-fit:fill!important}.object-fit-lg-scale{object-fit:scale-down!important}.object-fit-lg-none{object-fit:none!important}.d-lg-inline{display:inline!important}.d-lg-inline-block{display:inline-block!important}.d-lg-block{display:block!important}.d-lg-grid{display:grid!important}.d-lg-inline-grid{display:inline-grid!important}.d-lg-table{display:table!important}.d-lg-table-row{display:table-row!important}.d-lg-table-cell{display:table-cell!important}.d-lg-flex{display:flex!important}.d-lg-inline-flex{display:inline-flex!important}.d-lg-none{display:none!important}.flex-lg-fill{flex:1 1 auto!important}.flex-lg-row{flex-direction:row!important}.flex-lg-column{flex-direction:column!important}.flex-lg-row-reverse{flex-direction:row-reverse!important}.flex-lg-column-reverse{flex-direction:column-reverse!important}.flex-lg-grow-0{flex-grow:0!important}.flex-lg-grow-1{flex-grow:1!important}.flex-lg-shrink-0{flex-shrink:0!important}.flex-lg-shrink-1{flex-shrink:1!important}.flex-lg-wrap{flex-wrap:wrap!important}.flex-lg-nowrap{flex-wrap:nowrap!important}.flex-lg-wrap-reverse{flex-wrap:wrap-reverse!important}.justify-content-lg-start{justify-content:flex-start!important}.justify-content-lg-end{justify-content:flex-end!important}.justify-content-lg-center{justify-content:center!important}.justify-content-lg-between{justify-content:space-between!important}.justify-content-lg-around{justify-content:space-around!important}.justify-content-lg-evenly{justify-content:space-evenly!important}.align-items-lg-start{align-items:flex-start!important}.align-items-lg-end{align-items:flex-end!important}.align-items-lg-center{align-items:center!important}.align-items-lg-baseline{align-items:baseline!important}.align-items-lg-stretch{align-items:stretch!important}.align-content-lg-start{align-content:flex-start!important}.align-content-lg-end{align-content:flex-end!important}.align-content-lg-center{align-content:center!important}.align-content-lg-between{align-content:space-between!important}.align-content-lg-around{align-content:space-around!important}.align-content-lg-stretch{align-content:stretch!important}.align-self-lg-auto{align-self:auto!important}.align-self-lg-start{align-self:flex-start!important}.align-self-lg-end{align-self:flex-end!important}.align-self-lg-center{align-self:center!important}.align-self-lg-baseline{align-self:baseline!important}.align-self-lg-stretch{align-self:stretch!important}.order-lg-first{order:-1!important}.order-lg-0{order:0!important}.order-lg-1{order:1!important}.order-lg-2{order:2!important}.order-lg-3{order:3!important}.order-lg-4{order:4!important}.order-lg-5{order:5!important}.order-lg-last{order:6!important}.m-lg-0{margin:0!important}.m-lg-1{margin:.25rem!important}.m-lg-2{margin:.5rem!important}.m-lg-3{margin:1rem!important}.m-lg-4{margin:1.5rem!important}.m-lg-5{margin:3rem!important}.m-lg-auto{margin:auto!important}.mx-lg-0{margin-right:0!important;margin-left:0!important}.mx-lg-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-lg-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-lg-3{margin-right:1rem!important;margin-left:1rem!important}.mx-lg-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-lg-5{margin-right:3rem!important;margin-left:3rem!important}.mx-lg-auto{margin-right:auto!important;margin-left:auto!important}.my-lg-0{margin-top:0!important;margin-bottom:0!important}.my-lg-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-lg-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-lg-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-lg-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-lg-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-lg-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-lg-0{margin-top:0!important}.mt-lg-1{margin-top:.25rem!important}.mt-lg-2{margin-top:.5rem!important}.mt-lg-3{margin-top:1rem!important}.mt-lg-4{margin-top:1.5rem!important}.mt-lg-5{margin-top:3rem!important}.mt-lg-auto{margin-top:auto!important}.me-lg-0{margin-right:0!important}.me-lg-1{margin-right:.25rem!important}.me-lg-2{margin-right:.5rem!important}.me-lg-3{margin-right:1rem!important}.me-lg-4{margin-right:1.5rem!important}.me-lg-5{margin-right:3rem!important}.me-lg-auto{margin-right:auto!important}.mb-lg-0{margin-bottom:0!important}.mb-lg-1{margin-bottom:.25rem!important}.mb-lg-2{margin-bottom:.5rem!important}.mb-lg-3{margin-bottom:1rem!important}.mb-lg-4{margin-bottom:1.5rem!important}.mb-lg-5{margin-bottom:3rem!important}.mb-lg-auto{margin-bottom:auto!important}.ms-lg-0{margin-left:0!important}.ms-lg-1{margin-left:.25rem!important}.ms-lg-2{margin-left:.5rem!important}.ms-lg-3{margin-left:1rem!important}.ms-lg-4{margin-left:1.5rem!important}.ms-lg-5{margin-left:3rem!important}.ms-lg-auto{margin-left:auto!important}.p-lg-0{padding:0!important}.p-lg-1{padding:.25rem!important}.p-lg-2{padding:.5rem!important}.p-lg-3{padding:1rem!important}.p-lg-4{padding:1.5rem!important}.p-lg-5{padding:3rem!important}.px-lg-0{padding-right:0!important;padding-left:0!important}.px-lg-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-lg-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-lg-3{padding-right:1rem!important;padding-left:1rem!important}.px-lg-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-lg-5{padding-right:3rem!important;padding-left:3rem!important}.py-lg-0{padding-top:0!important;padding-bottom:0!important}.py-lg-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-lg-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-lg-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-lg-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-lg-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-lg-0{padding-top:0!important}.pt-lg-1{padding-top:.25rem!important}.pt-lg-2{padding-top:.5rem!important}.pt-lg-3{padding-top:1rem!important}.pt-lg-4{padding-top:1.5rem!important}.pt-lg-5{padding-top:3rem!important}.pe-lg-0{padding-right:0!important}.pe-lg-1{padding-right:.25rem!important}.pe-lg-2{padding-right:.5rem!important}.pe-lg-3{padding-right:1rem!important}.pe-lg-4{padding-right:1.5rem!important}.pe-lg-5{padding-right:3rem!important}.pb-lg-0{padding-bottom:0!important}.pb-lg-1{padding-bottom:.25rem!important}.pb-lg-2{padding-bottom:.5rem!important}.pb-lg-3{padding-bottom:1rem!important}.pb-lg-4{padding-bottom:1.5rem!important}.pb-lg-5{padding-bottom:3rem!important}.ps-lg-0{padding-left:0!important}.ps-lg-1{padding-left:.25rem!important}.ps-lg-2{padding-left:.5rem!important}.ps-lg-3{padding-left:1rem!important}.ps-lg-4{padding-left:1.5rem!important}.ps-lg-5{padding-left:3rem!important}.gap-lg-0{gap:0!important}.gap-lg-1{gap:.25rem!important}.gap-lg-2{gap:.5rem!important}.gap-lg-3{gap:1rem!important}.gap-lg-4{gap:1.5rem!important}.gap-lg-5{gap:3rem!important}.row-gap-lg-0{row-gap:0!important}.row-gap-lg-1{row-gap:.25rem!important}.row-gap-lg-2{row-gap:.5rem!important}.row-gap-lg-3{row-gap:1rem!important}.row-gap-lg-4{row-gap:1.5rem!important}.row-gap-lg-5{row-gap:3rem!important}.column-gap-lg-0{column-gap:0!important}.column-gap-lg-1{column-gap:.25rem!important}.column-gap-lg-2{column-gap:.5rem!important}.column-gap-lg-3{column-gap:1rem!important}.column-gap-lg-4{column-gap:1.5rem!important}.column-gap-lg-5{column-gap:3rem!important}.text-lg-start{text-align:left!important}.text-lg-end{text-align:right!important}.text-lg-center{text-align:center!important}}@media (min-width:1200px){.float-xl-start{float:left!important}.float-xl-end{float:right!important}.float-xl-none{float:none!important}.object-fit-xl-contain{object-fit:contain!important}.object-fit-xl-cover{object-fit:cover!important}.object-fit-xl-fill{object-fit:fill!important}.object-fit-xl-scale{object-fit:scale-down!important}.object-fit-xl-none{object-fit:none!important}.d-xl-inline{display:inline!important}.d-xl-inline-block{display:inline-block!important}.d-xl-block{display:block!important}.d-xl-grid{display:grid!important}.d-xl-inline-grid{display:inline-grid!important}.d-xl-table{display:table!important}.d-xl-table-row{display:table-row!important}.d-xl-table-cell{display:table-cell!important}.d-xl-flex{display:flex!important}.d-xl-inline-flex{display:inline-flex!important}.d-xl-none{display:none!important}.flex-xl-fill{flex:1 1 auto!important}.flex-xl-row{flex-direction:row!important}.flex-xl-column{flex-direction:column!important}.flex-xl-row-reverse{flex-direction:row-reverse!important}.flex-xl-column-reverse{flex-direction:column-reverse!important}.flex-xl-grow-0{flex-grow:0!important}.flex-xl-grow-1{flex-grow:1!important}.flex-xl-shrink-0{flex-shrink:0!important}.flex-xl-shrink-1{flex-shrink:1!important}.flex-xl-wrap{flex-wrap:wrap!important}.flex-xl-nowrap{flex-wrap:nowrap!important}.flex-xl-wrap-reverse{flex-wrap:wrap-reverse!important}.justify-content-xl-start{justify-content:flex-start!important}.justify-content-xl-end{justify-content:flex-end!important}.justify-content-xl-center{justify-content:center!important}.justify-content-xl-between{justify-content:space-between!important}.justify-content-xl-around{justify-content:space-around!important}.justify-content-xl-evenly{justify-content:space-evenly!important}.align-items-xl-start{align-items:flex-start!important}.align-items-xl-end{align-items:flex-end!important}.align-items-xl-center{align-items:center!important}.align-items-xl-baseline{align-items:baseline!important}.align-items-xl-stretch{align-items:stretch!important}.align-content-xl-start{align-content:flex-start!important}.align-content-xl-end{align-content:flex-end!important}.align-content-xl-center{align-content:center!important}.align-content-xl-between{align-content:space-between!important}.align-content-xl-around{align-content:space-around!important}.align-content-xl-stretch{align-content:stretch!important}.align-self-xl-auto{align-self:auto!important}.align-self-xl-start{align-self:flex-start!important}.align-self-xl-end{align-self:flex-end!important}.align-self-xl-center{align-self:center!important}.align-self-xl-baseline{align-self:baseline!important}.align-self-xl-stretch{align-self:stretch!important}.order-xl-first{order:-1!important}.order-xl-0{order:0!important}.order-xl-1{order:1!important}.order-xl-2{order:2!important}.order-xl-3{order:3!important}.order-xl-4{order:4!important}.order-xl-5{order:5!important}.order-xl-last{order:6!important}.m-xl-0{margin:0!important}.m-xl-1{margin:.25rem!important}.m-xl-2{margin:.5rem!important}.m-xl-3{margin:1rem!important}.m-xl-4{margin:1.5rem!important}.m-xl-5{margin:3rem!important}.m-xl-auto{margin:auto!important}.mx-xl-0{margin-right:0!important;margin-left:0!important}.mx-xl-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-xl-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-xl-3{margin-right:1rem!important;margin-left:1rem!important}.mx-xl-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-xl-5{margin-right:3rem!important;margin-left:3rem!important}.mx-xl-auto{margin-right:auto!important;margin-left:auto!important}.my-xl-0{margin-top:0!important;margin-bottom:0!important}.my-xl-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-xl-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-xl-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-xl-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-xl-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-xl-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-xl-0{margin-top:0!important}.mt-xl-1{margin-top:.25rem!important}.mt-xl-2{margin-top:.5rem!important}.mt-xl-3{margin-top:1rem!important}.mt-xl-4{margin-top:1.5rem!important}.mt-xl-5{margin-top:3rem!important}.mt-xl-auto{margin-top:auto!important}.me-xl-0{margin-right:0!important}.me-xl-1{margin-right:.25rem!important}.me-xl-2{margin-right:.5rem!important}.me-xl-3{margin-right:1rem!important}.me-xl-4{margin-right:1.5rem!important}.me-xl-5{margin-right:3rem!important}.me-xl-auto{margin-right:auto!important}.mb-xl-0{margin-bottom:0!important}.mb-xl-1{margin-bottom:.25rem!important}.mb-xl-2{margin-bottom:.5rem!important}.mb-xl-3{margin-bottom:1rem!important}.mb-xl-4{margin-bottom:1.5rem!important}.mb-xl-5{margin-bottom:3rem!important}.mb-xl-auto{margin-bottom:auto!important}.ms-xl-0{margin-left:0!important}.ms-xl-1{margin-left:.25rem!important}.ms-xl-2{margin-left:.5rem!important}.ms-xl-3{margin-left:1rem!important}.ms-xl-4{margin-left:1.5rem!important}.ms-xl-5{margin-left:3rem!important}.ms-xl-auto{margin-left:auto!important}.p-xl-0{padding:0!important}.p-xl-1{padding:.25rem!important}.p-xl-2{padding:.5rem!important}.p-xl-3{padding:1rem!important}.p-xl-4{padding:1.5rem!important}.p-xl-5{padding:3rem!important}.px-xl-0{padding-right:0!important;padding-left:0!important}.px-xl-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-xl-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-xl-3{padding-right:1rem!important;padding-left:1rem!important}.px-xl-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-xl-5{padding-right:3rem!important;padding-left:3rem!important}.py-xl-0{padding-top:0!important;padding-bottom:0!important}.py-xl-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-xl-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-xl-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-xl-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-xl-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-xl-0{padding-top:0!important}.pt-xl-1{padding-top:.25rem!important}.pt-xl-2{padding-top:.5rem!important}.pt-xl-3{padding-top:1rem!important}.pt-xl-4{padding-top:1.5rem!important}.pt-xl-5{padding-top:3rem!important}.pe-xl-0{padding-right:0!important}.pe-xl-1{padding-right:.25rem!important}.pe-xl-2{padding-right:.5rem!important}.pe-xl-3{padding-right:1rem!important}.pe-xl-4{padding-right:1.5rem!important}.pe-xl-5{padding-right:3rem!important}.pb-xl-0{padding-bottom:0!important}.pb-xl-1{padding-bottom:.25rem!important}.pb-xl-2{padding-bottom:.5rem!important}.pb-xl-3{padding-bottom:1rem!important}.pb-xl-4{padding-bottom:1.5rem!important}.pb-xl-5{padding-bottom:3rem!important}.ps-xl-0{padding-left:0!important}.ps-xl-1{padding-left:.25rem!important}.ps-xl-2{padding-left:.5rem!important}.ps-xl-3{padding-left:1rem!important}.ps-xl-4{padding-left:1.5rem!important}.ps-xl-5{padding-left:3rem!important}.gap-xl-0{gap:0!important}.gap-xl-1{gap:.25rem!important}.gap-xl-2{gap:.5rem!important}.gap-xl-3{gap:1rem!important}.gap-xl-4{gap:1.5rem!important}.gap-xl-5{gap:3rem!important}.row-gap-xl-0{row-gap:0!important}.row-gap-xl-1{row-gap:.25rem!important}.row-gap-xl-2{row-gap:.5rem!important}.row-gap-xl-3{row-gap:1rem!important}.row-gap-xl-4{row-gap:1.5rem!important}.row-gap-xl-5{row-gap:3rem!important}.column-gap-xl-0{column-gap:0!important}.column-gap-xl-1{column-gap:.25rem!important}.column-gap-xl-2{column-gap:.5rem!important}.column-gap-xl-3{column-gap:1rem!important}.column-gap-xl-4{column-gap:1.5rem!important}.column-gap-xl-5{column-gap:3rem!important}.text-xl-start{text-align:left!important}.text-xl-end{text-align:right!important}.text-xl-center{text-align:center!important}}@media (min-width:1400px){.float-xxl-start{float:left!important}.float-xxl-end{float:right!important}.float-xxl-none{float:none!important}.object-fit-xxl-contain{object-fit:contain!important}.object-fit-xxl-cover{object-fit:cover!important}.object-fit-xxl-fill{object-fit:fill!important}.object-fit-xxl-scale{object-fit:scale-down!important}.object-fit-xxl-none{object-fit:none!important}.d-xxl-inline{display:inline!important}.d-xxl-inline-block{display:inline-block!important}.d-xxl-block{display:block!important}.d-xxl-grid{display:grid!important}.d-xxl-inline-grid{display:inline-grid!important}.d-xxl-table{display:table!important}.d-xxl-table-row{display:table-row!important}.d-xxl-table-cell{display:table-cell!important}.d-xxl-flex{display:flex!important}.d-xxl-inline-flex{display:inline-flex!important}.d-xxl-none{display:none!important}.flex-xxl-fill{flex:1 1 auto!important}.flex-xxl-row{flex-direction:row!important}.flex-xxl-column{flex-direction:column!important}.flex-xxl-row-reverse{flex-direction:row-reverse!important}.flex-xxl-column-reverse{flex-direction:column-reverse!important}.flex-xxl-grow-0{flex-grow:0!important}.flex-xxl-grow-1{flex-grow:1!important}.flex-xxl-shrink-0{flex-shrink:0!important}.flex-xxl-shrink-1{flex-shrink:1!important}.flex-xxl-wrap{flex-wrap:wrap!important}.flex-xxl-nowrap{flex-wrap:nowrap!important}.flex-xxl-wrap-reverse{flex-wrap:wrap-reverse!important}.justify-content-xxl-start{justify-content:flex-start!important}.justify-content-xxl-end{justify-content:flex-end!important}.justify-content-xxl-center{justify-content:center!important}.justify-content-xxl-between{justify-content:space-between!important}.justify-content-xxl-around{justify-content:space-around!important}.justify-content-xxl-evenly{justify-content:space-evenly!important}.align-items-xxl-start{align-items:flex-start!important}.align-items-xxl-end{align-items:flex-end!important}.align-items-xxl-center{align-items:center!important}.align-items-xxl-baseline{align-items:baseline!important}.align-items-xxl-stretch{align-items:stretch!important}.align-content-xxl-start{align-content:flex-start!important}.align-content-xxl-end{align-content:flex-end!important}.align-content-xxl-center{align-content:center!important}.align-content-xxl-between{align-content:space-between!important}.align-content-xxl-around{align-content:space-around!important}.align-content-xxl-stretch{align-content:stretch!important}.align-self-xxl-auto{align-self:auto!important}.align-self-xxl-start{align-self:flex-start!important}.align-self-xxl-end{align-self:flex-end!important}.align-self-xxl-center{align-self:center!important}.align-self-xxl-baseline{align-self:baseline!important}.align-self-xxl-stretch{align-self:stretch!important}.order-xxl-first{order:-1!important}.order-xxl-0{order:0!important}.order-xxl-1{order:1!important}.order-xxl-2{order:2!important}.order-xxl-3{order:3!important}.order-xxl-4{order:4!important}.order-xxl-5{order:5!important}.order-xxl-last{order:6!important}.m-xxl-0{margin:0!important}.m-xxl-1{margin:.25rem!important}.m-xxl-2{margin:.5rem!important}.m-xxl-3{margin:1rem!important}.m-xxl-4{margin:1.5rem!important}.m-xxl-5{margin:3rem!important}.m-xxl-auto{margin:auto!important}.mx-xxl-0{margin-right:0!important;margin-left:0!important}.mx-xxl-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-xxl-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-xxl-3{margin-right:1rem!important;margin-left:1rem!important}.mx-xxl-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-xxl-5{margin-right:3rem!important;margin-left:3rem!important}.mx-xxl-auto{margin-right:auto!important;margin-left:auto!important}.my-xxl-0{margin-top:0!important;margin-bottom:0!important}.my-xxl-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-xxl-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-xxl-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-xxl-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-xxl-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-xxl-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-xxl-0{margin-top:0!important}.mt-xxl-1{margin-top:.25rem!important}.mt-xxl-2{margin-top:.5rem!important}.mt-xxl-3{margin-top:1rem!important}.mt-xxl-4{margin-top:1.5rem!important}.mt-xxl-5{margin-top:3rem!important}.mt-xxl-auto{margin-top:auto!important}.me-xxl-0{margin-right:0!important}.me-xxl-1{margin-right:.25rem!important}.me-xxl-2{margin-right:.5rem!important}.me-xxl-3{margin-right:1rem!important}.me-xxl-4{margin-right:1.5rem!important}.me-xxl-5{margin-right:3rem!important}.me-xxl-auto{margin-right:auto!important}.mb-xxl-0{margin-bottom:0!important}.mb-xxl-1{margin-bottom:.25rem!important}.mb-xxl-2{margin-bottom:.5rem!important}.mb-xxl-3{margin-bottom:1rem!important}.mb-xxl-4{margin-bottom:1.5rem!important}.mb-xxl-5{margin-bottom:3rem!important}.mb-xxl-auto{margin-bottom:auto!important}.ms-xxl-0{margin-left:0!important}.ms-xxl-1{margin-left:.25rem!important}.ms-xxl-2{margin-left:.5rem!important}.ms-xxl-3{margin-left:1rem!important}.ms-xxl-4{margin-left:1.5rem!important}.ms-xxl-5{margin-left:3rem!important}.ms-xxl-auto{margin-left:auto!important}.p-xxl-0{padding:0!important}.p-xxl-1{padding:.25rem!important}.p-xxl-2{padding:.5rem!important}.p-xxl-3{padding:1rem!important}.p-xxl-4{padding:1.5rem!important}.p-xxl-5{padding:3rem!important}.px-xxl-0{padding-right:0!important;padding-left:0!important}.px-xxl-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-xxl-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-xxl-3{padding-right:1rem!important;padding-left:1rem!important}.px-xxl-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-xxl-5{padding-right:3rem!important;padding-left:3rem!important}.py-xxl-0{padding-top:0!important;padding-bottom:0!important}.py-xxl-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-xxl-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-xxl-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-xxl-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-xxl-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-xxl-0{padding-top:0!important}.pt-xxl-1{padding-top:.25rem!important}.pt-xxl-2{padding-top:.5rem!important}.pt-xxl-3{padding-top:1rem!important}.pt-xxl-4{padding-top:1.5rem!important}.pt-xxl-5{padding-top:3rem!important}.pe-xxl-0{padding-right:0!important}.pe-xxl-1{padding-right:.25rem!important}.pe-xxl-2{padding-right:.5rem!important}.pe-xxl-3{padding-right:1rem!important}.pe-xxl-4{padding-right:1.5rem!important}.pe-xxl-5{padding-right:3rem!important}.pb-xxl-0{padding-bottom:0!important}.pb-xxl-1{padding-bottom:.25rem!important}.pb-xxl-2{padding-bottom:.5rem!important}.pb-xxl-3{padding-bottom:1rem!important}.pb-xxl-4{padding-bottom:1.5rem!important}.pb-xxl-5{padding-bottom:3rem!important}.ps-xxl-0{padding-left:0!important}.ps-xxl-1{padding-left:.25rem!important}.ps-xxl-2{padding-left:.5rem!important}.ps-xxl-3{padding-left:1rem!important}.ps-xxl-4{padding-left:1.5rem!important}.ps-xxl-5{padding-left:3rem!important}.gap-xxl-0{gap:0!important}.gap-xxl-1{gap:.25rem!important}.gap-xxl-2{gap:.5rem!important}.gap-xxl-3{gap:1rem!important}.gap-xxl-4{gap:1.5rem!important}.gap-xxl-5{gap:3rem!important}.row-gap-xxl-0{row-gap:0!important}.row-gap-xxl-1{row-gap:.25rem!important}.row-gap-xxl-2{row-gap:.5rem!important}.row-gap-xxl-3{row-gap:1rem!important}.row-gap-xxl-4{row-gap:1.5rem!important}.row-gap-xxl-5{row-gap:3rem!important}.column-gap-xxl-0{column-gap:0!important}.column-gap-xxl-1{column-gap:.25rem!important}.column-gap-xxl-2{column-gap:.5rem!important}.column-gap-xxl-3{column-gap:1rem!important}.column-gap-xxl-4{column-gap:1.5rem!important}.column-gap-xxl-5{column-gap:3rem!important}.text-xxl-start{text-align:left!important}.text-xxl-end{text-align:right!important}.text-xxl-center{text-align:center!important}}@media (min-width:1200px){.fs-1{font-size:2.5rem!important}.fs-2{font-size:2rem!important}.fs-3{font-size:1.75rem!important}.fs-4{font-size:1.5rem!important}}@media print{.d-print-inline{display:inline!important}.d-print-inline-block{display:inline-block!important}.d-print-block{display:block!important}.d-print-grid{display:grid!important}.d-print-inline-grid{display:inline-grid!important}.d-print-table{display:table!important}.d-print-table-row{display:table-row!important}.d-print-table-cell{display:table-cell!important}.d-print-flex{display:flex!important}.d-print-inline-flex{display:inline-flex!important}.d-print-none{display:none!important}}

/* Base styling */
.SearchSectionN_searchOverlay__fm2j3 {
  position: relative;
  left: 50%;
  transform: translateX(-50%) translateY(-20px); /* Réduit de -40px à -20px */
  width: 90%;
  max-width: 1200px;
  z-index: 10;
  margin-bottom: 1px; /* Ajout d'une marge en bas réduite */
}

/* Search Container */
.SearchSectionN_searchContainer__\+BJ7T {
  background-color: #DFE7EE;
  border-radius: 12px;
  padding: 12px; /* Réduit de 14px à 12px */
  width: 100%;
  margin: 0;
}

/* Radio Buttons */
.SearchSectionN_radioContainer__fdNlb {
  display: flex;
  gap: 30px;
  margin-bottom: 8px; /* Réduit de 10px à 8px */
  justify-content: center;
  flex-wrap: wrap;
}

.SearchSectionN_radioLabel__Q5LXE {
  display: flex;
  align-items: center;
  cursor: pointer;
  font-size: 16px;
  font-weight: 500;
  color: #555;
  position: relative;
  padding: 5px 0;
}

.SearchSectionN_radioInput__mxHvJ {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.SearchSectionN_radioCustom__M8qXW {
  position: relative;
  display: inline-block;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  margin-right: 10px;
  background-color: #FFFFFF;
}

.SearchSectionN_radioLabel__Q5LXE input:checked + .SearchSectionN_radioCustom__M8qXW {
  background-color: #0F447E;
}

/* Search Inputs */
.SearchSectionN_searchInputs__IQzjA {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 0; /* Supprime l'espacement en bas */
}

/* .searchInputs {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr auto;
  gap: 10px;
  align-items: center;
} */

.SearchSectionN_inputGroup__j\+3fm {
  display: flex;
  align-items: center;
  background-color: white;
  border-radius: 8px;
  padding: 12px 15px;
  flex: 1 1;
  min-width: 200px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  position: relative;
}

.SearchSectionN_icon__Lh8Or {
  color: #0F447E;
  margin-right: 10px;
  flex-shrink: 0;
  cursor: pointer;
}

.SearchSectionN_inputRecherche1__HU5wS {
  border: none;
  background: transparent;
  width: 100%;
  outline: none;
  border-radius: 0%;
  font-size: 14px;
  cursor: pointer;
}

.SearchSectionN_inputRecherche1__HU5wS:focus {
  outline: none;
  border: none;
}

/* Zone Dropdown */
.SearchSectionN_zoneDropdown__AMxyQ {
  position: absolute;
  top: 100%;
  left: 0;
  background-color: white;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
  z-index: 100;
  margin-top: 5px;
  width: 100%;
  padding: 0;
  list-style: none;
  max-height: 220px;
  overflow-y: auto;
  box-sizing: border-box;
  display: block;
}

.SearchSectionN_zoneDropdownItem__ZofpN {
  padding: 10px 15px;
  cursor: pointer;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  border-bottom: 1px solid #f0f0f0;
}

.SearchSectionN_zoneDropdownItem__ZofpN:last-child {
  border-bottom: none;
}

/* Occupancy Info */
.SearchSectionN_occupancyInfo__XRlax {
  font-size: 14px;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

/* Room Counter */
.SearchSectionN_counterDisplay__kE7pF {
  flex: 1 1;
  font-size: 14px;
  white-space: nowrap;
}

.SearchSectionN_counterButtons__FB\+nr {
  display: flex;
  align-items: center;
  gap: 8px;
}

.SearchSectionN_counterButton__T88RL {
  width: 26px;
  height: 26px;
  background-color: #0F447E;
  color: white;
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  flex-shrink: 0;
}

.SearchSectionN_counterButton__T88RL:disabled {
  background-color: #ccc;
  cursor: not-allowed;
}

/* Search Button */
.SearchSectionN_searchButton__8nPK- {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background-color: #0F447E;
  color: white;
  border: none;
  padding: 12px 20px;
  border-radius: 8px;
  cursor: pointer;
  transition: background-color 0.3s ease;
  white-space: nowrap;
  font-weight: 500;
  min-width: 120px;
}

.SearchSectionN_searchButton__8nPK-:hover {
  background-color: #0F447E;
}

.SearchSectionN_searchIcon__Zrri7 {
  color: white;
}

/* Calendar styles */
.SearchSectionN_calendarNavigation__z0Gpv {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px;
  margin-bottom: 15px;
}

.SearchSectionN_calendarNavButton__hlnaH {
  background: none;
  border: none;
  color: #0F447E;
  cursor: pointer;
  padding: 5px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.2s;
  flex-shrink: 0;
}

.SearchSectionN_calendarNavButton__hlnaH:hover {
  background-color: rgba(12, 68, 126, 0.1);
}

.SearchSectionN_calendarNavButton__hlnaH:disabled {
  color: #ccc;
  cursor: not-allowed;
}

.SearchSectionN_calendarCurrentPeriod__SB6ey {
  font-weight: 500;
  color: #333;
  text-transform: capitalize;
}

/* Calendar dropdown */
.SearchSectionN_calendarDropdown__iJe7w {
  position: absolute;
  top: 100%;
  left: 0;
  background-color: white;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
  z-index: 100;
  margin-top: 10px;
  width: 620px;
  padding: 20px;
  max-width: 95vw;
}

.SearchSectionN_calendarDualContainer__mBZNQ {
  display: flex;
  gap: 15px;
}

.SearchSectionN_calendarSide__M74r5 {
  flex: 1 1;
  min-width: 0; /* Pour permettre le rétrécissement */
}

/* Sélecteurs année et mois */
.SearchSectionN_yearMonthSelectors__a3GSO {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.SearchSectionN_monthSelector__lzQQj,
.SearchSectionN_yearSelector__5\+1C1 {
  padding: 5px 10px;
  border-radius: 4px;
  border: 1px solid #ddd;
  background-color: white;
  color: #333;
  font-size: 14px;
  cursor: pointer;
  outline: none;
}

.SearchSectionN_monthSelector__lzQQj:focus,
.SearchSectionN_yearSelector__5\+1C1:focus {
  border-color: #0F447E;
}

.SearchSectionN_yearSelector__5\+1C1 {
  min-width: 70px;
  flex: 0 1 auto;
}

.SearchSectionN_monthSelector__lzQQj {
  min-width: 100px;
  flex: 1 1 auto;
}

/* Month year header */
.SearchSectionN_monthYearHeader__lvnGj {
  font-weight: 500;
  text-align: center;
  margin-bottom: 10px;
  color: #333;
}

/* Occupancy Dropdown */
.SearchSectionN_occupancyDropdown__8pPjZ {
  position: absolute;
  top: 100%;
  right: 0;
  background-color: white;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
  z-index: 100;
  margin-top: 10px;
  width: 300px;
  padding: 20px;
  max-width: 95vw;
}

.SearchSectionN_occupancyItem__Fg29N {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px solid #eee;
}

.SearchSectionN_occupancyItem__Fg29N:last-child {
  border-bottom: none;
}

.SearchSectionN_occupancyLabel__TlyjN {
  font-weight: 500;
  color: #333;
}

.SearchSectionN_occupancyControls__xEpF3 {
  display: flex;
  align-items: center;
  gap: 15px;
}

.SearchSectionN_counterValue__KG7Ha {
  font-weight: 500;
  width: 20px;
  text-align: center;
}

.SearchSectionN_applyButton__3Jh7G {
  display: block;
  width: 100%;
  background-color: #0F447E;
  color: white;
  border: none;
  padding: 12px;
  border-radius: 8px;
  margin-top: 15px;
  cursor: pointer;
  font-weight: 500;
  transition: background-color 0.3s ease;
}

.SearchSectionN_applyButton__3Jh7G:hover {
  background-color: #0F447E;
}

/* Calendar styling */
.SearchSectionN_calendarMonth__H8Y8z {
  flex: 1 1;
  min-width: 0;
}

.SearchSectionN_calendarHeader__7TPdY {
  font-weight: 600;
  text-align: center;
  margin-bottom: 10px;
  font-size: 14px;
}

.SearchSectionN_calendarWeekdays__3S\+jM {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  text-align: center;
  font-weight: 500;
  color: #666;
  margin-bottom: 5px;
  font-size: 12px;
}

.SearchSectionN_calendarDays__0TgmY {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  grid-gap: 2px;
  gap: 2px;
}

.SearchSectionN_calendarDay__oc1oB {
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 50%;
  font-size: 14px;
}

.SearchSectionN_calendarDay__oc1oB:hover {
  background-color: #f0f0f0;
}

.SearchSectionN_today__d4kvd {
  border: 2px solid #0F447E;
  font-weight: 600;
}

.SearchSectionN_startDate__PFcdZ, .SearchSectionN_endDate__6zoVN {
  background-color: #0F447E;
  color: white;
}

.SearchSectionN_inRange__nP7vm {
  background-color: rgba(12, 68, 126, 0.1);
}

.SearchSectionN_pastDate__bFslN {
  color: #ccc;
  cursor: not-allowed;
}

.SearchSectionN_calendarActions__wXQMi {
  margin-top: 15px;
}

/* Search Results Styles */
.SearchSectionN_searchResults__wvbi- {
  margin-top: 2rem;
  padding: 1rem;
}

.SearchSectionN_searchResults__wvbi- h2 {
  font-size: 1.5rem;
  margin-bottom: 1.5rem;
  color: #333;
}

.SearchSectionN_resultsGrid__u32Kw {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  grid-gap: 2rem;
  gap: 2rem;
  padding: 1rem;
}

.SearchSectionN_apartmentCard__8iqYb {
  background: white;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transition: transform 0.2s ease-in-out;
}

.SearchSectionN_apartmentCard__8iqYb:hover {
  transform: translateY(-4px);
}

.SearchSectionN_apartmentImage__\+4FsI {
  width: 100%;
  height: 200px;
  object-fit: cover;
}

.SearchSectionN_apartmentInfo__IWs21 {
  padding: 1.5rem;
}

.SearchSectionN_apartmentInfo__IWs21 h3 {
  font-size: 1.2rem;
  margin-bottom: 0.5rem;
  color: #333;
}

.SearchSectionN_location__qXGoc {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: #666;
  margin-bottom: 0.5rem;
}

.SearchSectionN_price__v1R-- {
  font-size: 1.25rem;
  font-weight: 600;
  color: #0F447E;
  margin-bottom: 1rem;
}

.SearchSectionN_apartmentDetails__OTOJM {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  font-size: 0.9rem;
  color: #666;
}

.SearchSectionN_apartmentDetails__OTOJM span {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.SearchSectionN_errorMessage__c4CWP {
  margin-top: 1rem;
  padding: 1rem;
  background-color: #fff5f5;
  color: #e30613;
  border-radius: 8px;
  text-align: center;
}

/* Loading state for search button */
.SearchSectionN_searchButton__8nPK-:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

/* Responsive Design - Tablette */
@media (max-width: 1024px) {
  .SearchSectionN_searchOverlay__fm2j3 {
    width: 95%;
    /* transform: translateX(-50%) translateY(-30px);  */
    margin-top: 160px;
  }

  .SearchSectionN_searchInputs__IQzjA {
    flex-wrap: wrap;
    gap: 15px;
  }

  .SearchSectionN_inputGroup__j\+3fm {
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: calc(50% - 15px);
    min-width: 200px;
  }

  .SearchSectionN_searchButton__8nPK- {
    margin-top: 5px;
    min-width: 150px;
    flex: 0 1 auto;
  }

  .SearchSectionN_calendarDualContainer__mBZNQ {
    flex-direction: column;
    gap: 20px;
  }

  .SearchSectionN_calendarDropdown__iJe7w {
    width: 350px;
    left: 50%;
    transform: translateX(-50%);
  }
}

/* Responsive Design - Mobile */
@media (max-width: 768px) {
  .SearchSectionN_searchOverlay__fm2j3 {
    /* transform: translateX(50%) translateY(40px);  */
    width: 92%;
    margin-top: 160px;
    margin-bottom: 5px; 
  }

  .SearchSectionN_searchContainer__\+BJ7T {
    padding: 12px;
  }

  .SearchSectionN_searchInputs__IQzjA {
    flex-direction: column;
    gap: 8px;
  }

  /* Modification clé pour harmoniser les tailles */
  .SearchSectionN_inputGroup__j\+3fm {
    width: 100%;
    flex: none;
    min-width: 0;
    padding: 12px 15px;
    box-sizing: border-box;
    margin-bottom: 0;
  }

  /* Conteneur pour le champ de destination */
  .SearchSectionN_searchInputs__IQzjA > div {
    width: 100%;
  }

  /* Dropdown des zones */
  .SearchSectionN_zoneDropdown__AMxyQ {
    width: 100%;
    max-width: none;
    left: 0;
    right: 0;
    margin-top: 5px;
    box-sizing: border-box;
  }

  /* Bouton de recherche */
  .SearchSectionN_searchButton__8nPK- {
    width: 100%;
    min-width: 100%;
    flex: none;
    margin-top: 3px; /* Réduit de 5px à 3px */
  }

  /* Calendrier et dropdown d'occupation */
  .SearchSectionN_calendarDropdown__iJe7w,
  .SearchSectionN_occupancyDropdown__8pPjZ {
    width: calc(100vw - 30px);
    max-width: 350px;
    left: 50%;
    transform: translateX(-50%);
    padding: 15px;
  }

  /* Ajustements pour les éléments internes */
  .SearchSectionN_calendarDay__oc1oB {
    height: 32px;
    font-size: 13px;
  }

  .SearchSectionN_radioContainer__fdNlb {
    gap: 15px;
  }

  .SearchSectionN_calendarHeader__7TPdY,
  .SearchSectionN_monthYearHeader__lvnGj {
    font-size: 13px;
  }

  /* Texte dans les champs */
  .SearchSectionN_input__wgqU2,
  .SearchSectionN_occupancyInfo__XRlax,
  .SearchSectionN_counterDisplay__kE7pF {
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

@media (max-width: 480px) {
  .SearchSectionN_searchOverlay__fm2j3 {
    /* transform: translateX(-50%) translateY(-30px);  */
    margin-top: 160px;
  }

  .SearchSectionN_calendarDay__oc1oB {
    height: 28px;
    font-size: 12px;
  }

  .SearchSectionN_yearMonthSelectors__a3GSO {
    flex-direction: column;
    align-items: stretch;
    gap: 5px;
  }

  .SearchSectionN_monthSelector__lzQQj,
  .SearchSectionN_yearSelector__5\+1C1 {
    width: 100%;
  }

  .SearchSectionN_radioLabel__Q5LXE {
    font-size: 14px;
  }

  .SearchSectionN_calendarWeekdays__3S\+jM div {
    font-size: 11px;
  }

  .SearchSectionN_calendarNavigation__z0Gpv {
    padding: 0 5px;
  }

  /* Ajustement final pour l'alignement parfait */
  .SearchSectionN_inputGroup__j\+3fm {
    padding: 10px 12px;
  }
}

:root {
  /* Bibliothèque de couleurs */
  --color-primary-blue: #0f447e;
  --color-primary-red: #E30613;
  --color-dark-red: #E30613;
  --color-gray-dark: rgba(30, 30, 30, 0.66);
  --color-gray-light: #D9D9D9;
  --color-gray-light-hover: #c4c4c4;
  --color-white: white;
  --color-black: #000;
  --color-modal-bg: rgba(0, 0, 0, 0.8);
}

/* ---------- Section ---------- */
.DemoN_DemoNmodule-virtualTourDemo__xK5cR {
  margin: 0 auto;
  padding: 80px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: 'Poppins', sans-serif;
  width: 100%;
  position: relative;
  overflow: visible;
}

.DemoN_DemoNmodule-content__9Cy7p {
  max-width: 1000px;
  width: 100%;
  margin: 0 auto;
  text-align: center;
}

.DemoN_DemoNmodule-titleContainer__oqh8h {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
  font-family: 'Poppins', sans-serif;
}

.DemoN_DemoNmodule-title__uMzmQ {
  margin: 0;
  font-size: clamp(28px, 5vw, 40px);
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
}

.DemoN_DemoNmodule-description__8ceN4 {
  font-size: clamp(16px, 3vw, 20px);
  font-weight: 500;
  color: rgba(30, 30, 30, 0.66);
  color: var(--color-gray-dark);
  text-align: center;
  margin: 0 auto 40px;
  line-height: 1.5;
  max-width: 981px;
  padding: 0 15px;
}

/* ---------- Aperçu ---------- */
.DemoN_DemoNmodule-tourContainer__lf3ec {
  position: relative;
  margin-top: 30px;
  width: 100%;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  touch-action: manipulation;
}

.DemoN_DemoNmodule-iframe__wIM2L {
  width: 100%;
  height: 600px;
  border-radius: 10px;
  /* background-color: var(--color-black); */
  pointer-events: none;
}

/* Play button */
.DemoN_DemoNmodule-playButton__EmrGE {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background-color: #d50606;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.3s ease, transform 0.2s ease;
  z-index: 10;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
  -webkit-tap-highlight-color: transparent;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
}

.DemoN_DemoNmodule-playButton__EmrGE:hover {
  background-color: #0f447e;
  transform: translate(-50%, -50%) scale(1.05);
}

.DemoN_DemoNmodule-playIcon__KgG2Q {
  font-size: 32px;
  color: #fff;
  margin-left: 4px;
}

/* ---------- Modal ---------- */
.DemoN_DemoNmodule-modal__xh6NM {
  position: fixed;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.7);
  -webkit-backdrop-filter: blur(30px);
          backdrop-filter: blur(30px);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  overflow: hidden;
  touch-action: none;
  -webkit-overflow-scrolling: touch;
}

.DemoN_DemoNmodule-modalContent__ByRZG {
  position: relative;
  width: 90%;
  max-width: 1000px;
  max-height: 90vh;
  border-radius: 10px;
  overflow: hidden;
  touch-action: manipulation;
}

.DemoN_DemoNmodule-modalContent__ByRZG .DemoN_DemoNmodule-iframe__wIM2L {
  pointer-events: auto;
  height: 80vh;
  max-height: 600px;
}

/* Close button */
.DemoN_DemoNmodule-closeButton__rUwI9 {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #d50606;
  color: #fff;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10001;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
  transition: background-color 0.3s ease, transform 0.2s ease;
  margin-top: 50px;
}

.DemoN_DemoNmodule-closeButton__rUwI9:hover {
  background-color: #0f447e;
  transform: scale(1.05);
}

/* Couleurs utilitaires */
.DemoN_DemoNmodule-blueText__ctCGV { 
  color: #0f447e; 
  color: var(--color-primary-blue); 
}

.DemoN_DemoNmodule-redText__jEN7m { 
  color: #E30613; 
  color: var(--color-primary-red); 
}

/* ---------- Media queries ---------- */

/* <= 768px (tablette) */
@media (max-width: 768px) {
  .DemoN_DemoNmodule-virtualTourDemo__xK5cR {
    padding: 60px 20px;
  }

  .DemoN_DemoNmodule-title__uMzmQ { 
    font-size: clamp(22px, 5vw, 28px);
    line-height: 1.3;
  }

  .DemoN_DemoNmodule-description__8ceN4 {
    font-size: clamp(14px, 2.5vw, 18px);
    margin-bottom: 30px;
    padding: 0 10px;
  }

  .DemoN_DemoNmodule-iframe__wIM2L { 
    height: 400px; 
  }

  .DemoN_DemoNmodule-modal__xh6NM {
    background-color: #000;
    background-color: var(--color-black);
    -webkit-backdrop-filter: none;
            backdrop-filter: none;
  }

  .DemoN_DemoNmodule-modalContent__ByRZG {
    width: 100%;
    max-width: 100%;
    max-height: 100vh;
    height: 100vh;
    border-radius: 0;
  }

  .DemoN_DemoNmodule-modalContent__ByRZG .DemoN_DemoNmodule-iframe__wIM2L {
    height: 70vh;
    max-height: 500px;
  }

  .DemoN_DemoNmodule-playButton__EmrGE { 
    width: 70px; 
    height: 70px; 
  }
  
  .DemoN_DemoNmodule-playIcon__KgG2Q { 
    font-size: 28px;
    margin-left: 3px;
  }

  .DemoN_DemoNmodule-closeButton__rUwI9 {
    width: 36px;
    height: 36px;
    top: 15px;
    right: 15px;
  }
}

/* <= 480px (mobile) */
@media (max-width: 480px) {
  .DemoN_DemoNmodule-virtualTourDemo__xK5cR { 
    padding: 40px 15px;
  }

  .DemoN_DemoNmodule-title__uMzmQ { 
    font-size: clamp(20px, 5.5vw, 26px);
    line-height: 1.2;
    padding: 0 5px;
  }

  .DemoN_DemoNmodule-titleContainer__oqh8h { 
    flex-direction: column;
    gap: 8px;
  }

  .DemoN_DemoNmodule-description__8ceN4 { 
    font-size: clamp(13px, 3.5vw, 16px);
    line-height: 1.7;
    padding: 0 10px;
    margin-bottom: 25px;
  }

  .DemoN_DemoNmodule-iframe__wIM2L { 
    height: 280px; 
  }

  .DemoN_DemoNmodule-modal__xh6NM {
    background-color: #000;
    background-color: var(--color-black);
    -webkit-backdrop-filter: none;
            backdrop-filter: none;
  }

  .DemoN_DemoNmodule-modalContent__ByRZG {
    width: 100%;
    max-width: 100%;
    max-height: 100vh;
    height: 100vh;
    border-radius: 0;
  }

  .DemoN_DemoNmodule-modalContent__ByRZG .DemoN_DemoNmodule-iframe__wIM2L {
    height: 100vh !important;
    max-height: 100vh !important;
    border-radius: 0;
  }

  .DemoN_DemoNmodule-playButton__EmrGE { 
    width: 60px; 
    height: 60px; 
  }
  
  .DemoN_DemoNmodule-playIcon__KgG2Q { 
    font-size: 24px;
    margin-left: 3px;
  }

  .DemoN_DemoNmodule-closeButton__rUwI9 {
    top: 12px;
    right: 12px;
    width: 32px;
    height: 32px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.22);
  }

  .DemoN_DemoNmodule-closeButton__rUwI9:active {
    background-color: #0f447e;
  }

  .DemoN_DemoNmodule-closeButton__rUwI9:focus-visible {
    outline: 2px solid #0f447e;
    outline-offset: 2px;
  }
}

/* <= 380px (très petit mobile) */
@media (max-width: 380px) {
  .DemoN_DemoNmodule-title__uMzmQ { 
    font-size: clamp(18px, 6vw, 22px);
    line-height: 1.2;
  }

  .DemoN_DemoNmodule-description__8ceN4 { 
    font-size: clamp(12px, 4vw, 14px);
  }

  .DemoN_DemoNmodule-iframe__wIM2L { 
    height: 250px; 
  }
}

/* Classe utilitaire pour prévenir le scroll sur mobile */
.DemoN_DemoNmodule-noScroll__O5EVg {
  overflow: hidden !important;
  position: fixed !important;
  width: 100% !important;
}
.apartment-tags {
  position: absolute;
  bottom: 8px;
  left: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  z-index: 5;
}

.apartment-tag {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  border-radius: 12px;
  /* background: #0f447e; */
  background-color: rgba(0, 0, 0, 0.5);
  color: #fff;
  font-size: 12px;
  font-weight: 500;
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.apartment-tag:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

.apartment-tag__icon {
  font-size: 14px;
}

.apartment-tag__value {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0px;
}

.virtual-tag {
  position: absolute;
  top: 10px;
  left: 10px;
  background: #0f447e;
  color: #fff;
  font-size: 0.55rem;
  font-weight: 600;
  padding: 4px 8px;
  border-radius: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.virtual-tag:hover {
  cursor: pointer;
  transform: scale(1.1);
  transition: transform 0.4s ease-in-out;
}

:root {
  /* Couleurs principales */
  --primary-color: #0f447e;
  --primary-hover: #0d3a6b;

  /* Couleurs de texte */
  --text-primary: #111827;
  --text-secondary: #6b7280;
  --text-light: #9ca3af;
  --text-on-primary: rgb(255, 255, 255);

  /* Couleurs de fond */
  --bg-white: white;
  --bg-light: #f3f4f6;
  --bg-lighter: #f9fafb;
  --bg-hover: #e5e7eb;

  /* Bordures */
  --border-color: #e0e0e0;
  --border-dark: #a3a9ae;

  /* Ombres */
  --shadow-light: 0 2px 10px rgba(0, 0, 0, 0.05);
  --shadow-medium: 0 4px 20px rgba(0, 0, 0, 0.2);

  /* Etats */
  --color: #e30613;
  --error-color: #e30613;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: 'Poppins', sans-serif;
}

.property-description {
  min-height: 2.8em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  max-height: 3em;
}

.highlights {
  color: #e30613;
  color: var(--color);
}

.property-item {
  width: 100%;
  max-width: 390px;
  border: 1px solid #a3a9ae;
  border: 1px solid var(--border-dark);
  border-radius: 0.8rem;
  overflow: hidden;
  background: white;
  background: var(--bg-white);
  transition: transform 0.2s ease;
}

.property-item:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.property-image-container {
  position: relative;
  height: 200px;
  width: 100%;
}

.property-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.favorite-btn {
  position: absolute;
  top: 0.8rem;
  right: 0.8rem;
  background: white;
  background: var(--bg-white);
  border: none;
  border-radius: 50%;
  width: 2.2rem;
  height: 2.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transition: all 0.2s ease;
}

.favorite-btn:hover {
  transform: scale(1.1);
  background: #f8f8f8;
}

.property-details {
  padding: 1rem;
  padding-top: 0.8rem;
  display: flex;
  flex-direction: column;
  height: calc(100% - 200px);
}

.property-type {
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 0.5rem;
  color: #111827;
  color: var(--text-primary);
}

.property-description {
  color: #6b7280;
  color: var(--text-secondary);
  font-size: 0.92rem;
  margin-bottom: 0.6rem;
  line-height: 1.4;
}

.property-price {
  font-weight: 700;
  color: #0f447e;
  color: var(--primary-color);
  margin-bottom: 0.5rem;
  font-size: 1rem;
}

.property-features {
  display: flex;
  flex-wrap: wrap;
  gap: 0.37rem;
  padding-top: 8px;
  margin-bottom: 1rem;
}

.property-feature-tag {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 500;
  background-color: #f0f4f9;
  color: #686668;
}

.feature-tag {
  background: #f3f4f6;
  background: var(--bg-light);
  padding: 0.4rem 0.8rem;
  border-radius: 1rem;
  font-size: 0.8rem;
  color: #6b7280;
  color: var(--text-secondary);
  border: 1px solid #e0e0e0;
  border: 1px solid var(--border-color);
}

.visit-btn-container {
  margin-top: auto;
  padding-top: 1rem;
}

.visit-btn {
  width: 100%;
  background: #0f447e;
  background: var(--primary-color);
  color: white;
  border: none;
  padding: 0.55rem 0.8rem;
  border-radius: 0.5rem;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s ease;
  font-size: 0.9rem;
}

.visit-btn:hover {
  background: #0d3a6b;
  background: var(--primary-hover);
}

/* Responsive Design */
@media (max-width: 768px) {
  .property-container {
    padding: 1.5rem 1rem;
  }

  .property-title {
    font-size: 1.5rem;
    text-align: center;
  }

  .filter-container {
    justify-content: flex-start;
    padding-bottom: 0.5rem;
  }

  .filter-spacer {
    display: none;
  }

  .view-all-btn {
    margin-left: 0;
    width: 100%;
    margin-top: 0.5rem;
  }
}

@media (max-width: 480px) {
  .property-title {
    font-size: 1.4rem;
  }

  .property-item {
    max-width: 100%;
  }
}

/* Styles pour les filtres actifs */
.filter-btn.active {
  background-color: #0f447e;
  background-color: var(--primary-color);
  color: rgb(255, 255, 255);
  color: var(--text-on-primary);
  border-color: #0f447e;
  border-color: var(--primary-color);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(15, 68, 126, 0.3);
}

.filter-btn.active:hover {
  background-color: #0d3a6b;
  background-color: var(--primary-hover);
  border-color: #0d3a6b;
  border-color: var(--primary-hover);
}

/* Animation pour les transitions de filtres */
.filter-btn {
  transition: all 0.3s ease;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Responsive pour les filtres sur mobile */
@media (max-width: 768px) {
  .filter-container {
    flex-wrap: wrap;
    gap: 0.5rem;
  }

  .filter-btn {
    font-size: 0.85rem;
    padding: 0.5rem 0.8rem;
  }

  .filter-btn.active {
    transform: none;
    box-shadow: 0 2px 8px rgba(15, 68, 126, 0.3);
  }
}

@media (max-width: 480px) {
  .filter-btn {
    font-size: 0.8rem;
    padding: 0.4rem 0.6rem;
  }

  .filter-btn .icon {
    width: 14px;
    height: 14px;
  }
}

:root{
  --t-blue:#0F223A;
  --t-red:#e30613;
  --t-border:#E6E9F0;
  --t-shadow:0 8px 24px rgba(15,34,58,.06);
  --t-chip:#eef2f7;

  --gap:24px;
  --radius:16px;
  --card-w:360px;
  --img-h:220px;
}

/* Conteneur global centré */
.apt-sec{
  padding:24px 24px 8px;
  padding:24px var(--gap) 8px;
  display:flex;
  justify-content:center;
}
.apt-sec-inner{
  width:100%;
  max-width: calc(360px * 3 + 24px * 2);
  max-width: calc(var(--card-w) * 3 + var(--gap) * 2); /* 3 colonnes + 2 gaps */
}

/* Même largeur pour entête + tags + grille */
.apt-head-top{
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  margin-bottom:12px;
}
.title-line{ height:32px; width: min(440px, 70vw); border-radius:12px; }
.see-all-pill{ height:40px; width:110px; border-radius:999px; }

/* Tags pills en skeleton */
.apt-tags-skel{
  display:flex; flex-wrap:wrap; gap:12px; margin-bottom:16px; overflow-x:auto; padding-bottom:4px;
  scrollbar-width:none;
}
.apt-tags-skel::-webkit-scrollbar{ display:none; }
.tag-pill{ height:36px; border-radius:999px; }

/* Grille responsive — même largeur que l'entête via apt-sec-inner */
.apt-skel-grid{
  display:grid; gap:24px; grid-gap:24px; grid-gap:var(--gap); gap:var(--gap);
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width:1024px){
  .apt-sec-inner{ max-width: calc(360px * 2 + 24px * 1); max-width: calc(var(--card-w) * 2 + var(--gap) * 1); }
  .apt-skel-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width:640px){
  .apt-sec-inner{ max-width: min(100%, 360px); max-width: min(100%, var(--card-w)); }
  .apt-skel-grid{ grid-template-columns: 1fr; }
}

/* Carte */
.apt-card-skel{
  width:100%;
  background:#fff; border:1px solid #E6E9F0; border:1px solid var(--t-border);
  border-radius:16px;
  border-radius:var(--radius); box-shadow:0 8px 24px rgba(15,34,58,.06); box-shadow:var(--t-shadow);
  overflow:hidden; display:flex; flex-direction:column; color:#0F223A; color:var(--t-blue);
}
.apt-card-img{ position:relative; }
.skel-img{
  display:block; width:100%; height:220px; height:var(--img-h);
  background:#eef2f7; border-radius:16px 16px 0 0; border-radius:var(--radius) var(--radius) 0 0;
}
.skel-like{
  position:absolute; top:12px; right:12px;
  width:38px; height:38px; border-radius:50%;
  background:#fff; border:1px solid #E6E9F0; border:1px solid var(--t-border);
  box-shadow:0 2px 8px rgba(0,0,0,.08); z-index:5; display:none;
}
.apt-card-body{ padding:18px 20px 20px; display:flex; flex-direction:column; gap:12px; }

/* Skeleton + shimmer */
.skel{ position:relative; overflow:hidden; background:#eef2f7; border-radius:10px; }
.skel::after{
  content:""; position:absolute; inset:0; transform:translateX(-100%);
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent);
  animation:skel-shimmer 1.3s infinite;
}
@keyframes skel-shimmer{ 100%{ transform:translateX(100%); } }

/* Lignes internes */
.skel-title{ height:22px; width:72%; border-radius:8px; }
.skel-desc{  height:14px; width:96%; border-radius:8px; }
.skel-desc.short{ width:78%; }
.skel-price{ height:20px; width:62%; border-radius:8px; margin-top:2px; }

/* Faux chips dans la carte */
.apt-card-chips{ display:flex; gap:10px; margin-top:2px; }
.skel-chip{ width:70px; height:26px; border-radius:999px; background:#eef2f7; background:var(--t-chip); }

/* CTA */
.skel-cta{ height:48px; border-radius:12px; margin-top:8px; }

/* Réduction des animations */
@media (prefers-reduced-motion: reduce){ .skel::after{ animation:none; } }

.error {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 60vh;
  width: 100%;
  padding: 1.5rem;
  text-align: center;
  color: #e30613;
  background:
    radial-gradient(1000px 600px at 10% -10%, rgba(15,68,126,0.06), transparent 60%),
    radial-gradient(800px 500px at 110% 110%, rgba(227,6,19,0.06), transparent 60%);
}

.message {
  font-size: 1.1rem;
  line-height: 1.5;
  color: #0F223A;
}

.error-card {
  width: min(680px, 100%);
  background: rgba(255,255,255,0.72);
  -webkit-backdrop-filter: saturate(120%) blur(8px);
          backdrop-filter: saturate(120%) blur(8px);
  border: 1px solid rgba(15,68,126,0.08);
  box-shadow:
    0 8px 20px rgba(15, 34, 58, 0.06),
    0 2px 6px rgba(0,0,0,0.04);
  border-radius: 16px;
  padding: 1.25rem 1.25rem 1rem;
  display: grid;
  grid-gap: 0.9rem;
  gap: 0.9rem;
}

/* Regroupe les deux boutons */
.actions {
  display: flex;
  gap: 0.6rem;
  justify-content: center;
  flex-wrap: wrap;
}

/* Même design pour Actualiser et Accueil */
.actualiser,
.accueil {
  margin: 0.25rem auto 0;
  padding: 0.55rem 0.85rem;
  border-radius: 10px;
  background: #0F447E;
  color: #fff;
  border: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.98rem;
  line-height: 1;
  transition: transform 160ms ease, box-shadow 180ms ease, background 180ms ease;
  box-shadow: 0 6px 14px rgba(15,68,126,0.18);
}
.actualiser:hover,
.accueil:hover { background: #0c3665; }
.actualiser:active,
.accueil:active { transform: translateY(1px); }
.actualiser:focus-visible,
.accueil:focus-visible {
  outline: 3px solid rgba(15,68,126,0.4);
  outline-offset: 2px;
}

/* Icônes alignées */
.actualiser-icon,
.accueil-icon { margin-right: 0.15rem; }

.error-tools {
  display: grid;
  grid-gap: 0.6rem;
  gap: 0.6rem;
  justify-items: center;
}

.toggle-detail {
  background: transparent;
  border: 1px solid rgba(15,68,126,0.18);
  color: #0F223A;
  padding: 0.4rem 0.7rem;
  border-radius: 10px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.92rem;
  transition: background 180ms ease, border-color 180ms ease;
}
.toggle-detail:hover {
  background: rgba(15,68,126,0.06);
  border-color: rgba(15,68,126,0.35);
}

.chevron {
  transition: transform 180ms ease;
}
.chevron.open {
  transform: rotate(180deg);
}

.error-detail {
  width: 100%;
  max-height: 0;
  overflow: hidden;
  border-radius: 12px;
  background: #fbfbfc;
  border: 1px dashed rgba(0,0,0,0.12);
  transition: max-height 220ms ease, padding 220ms ease, border-color 220ms ease;
  padding: 0 0.75rem;
}
.error-detail.open {
  max-height: 280px;
  padding: 0.75rem;
  border-color: rgba(15,68,126,0.25);
}

.error-pre {
  margin: 0;
  text-align: left;
  color: #364152;
  font-size: 0.9rem;
  line-height: 1.35;
  white-space: pre-wrap;
  word-break: break-word;
}

@media (max-width: 480px) {
  .error-card { padding: 1rem; border-radius: 14px; }
  .message { font-size: 1rem; }
  .actualiser,
  .accueil { width: 100%; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
  .actualiser, .chevron, .error-detail, .accueil {
    transition: none;
  }
}

:root {
  /* Couleurs principales */
  --primary-color: #0f447e;
  --primary-hover: #0d3a6b;

  /* Couleurs de texte */
  --text-primary: #111827;
  --text-secondary: #6b7280;
  --text-light: #9ca3af;
  --text-on-primary: rgb(255, 255, 255);

  /* Couleurs de fond */
  --bg-white: white;
  --bg-light: #f3f4f6;
  --bg-lighter: #f9fafb;
  --bg-hover: #e5e7eb;

  /* Bordures */
  --border-color: #e0e0e0;
  --border-dark: #a3a9ae;

  /* Ombres */
  --shadow-light: 0 2px 10px rgba(0, 0, 0, 0.05);
  --shadow-medium: 0 4px 20px rgba(0, 0, 0, 0.2);

  /* Etats */
  --color: #e30613;
  --error-color: #e30613;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: 'Poppins', sans-serif;
}

.highlights {
  color: #e30613;
  color: var(--color);
}

.filter-container {
  display: flex;
  gap: 0.8rem;
  margin-bottom: 2rem;
  overflow-x: auto;
  padding-bottom: 0.5rem;
  scrollbar-width: none;
  align-items: center;
  flex-wrap: wrap;
}

.filter-container::-webkit-scrollbar {
  display: none;
}

.filter-btn {
  display: flex;
  align-items: center;
  background-color: #f3f4f6;
  background-color: var(--bg-light);
  padding: 0.6rem 1.2rem;
  border-radius: 2rem;
  border: 1px solid #e0e0e0;
  border: 1px solid var(--border-color);
  cursor: pointer;
  font-size: 0.9rem;
  color: #6b7280;
  color: var(--text-secondary);
  white-space: nowrap;
  transition: all 0.2s ease;
  flex-shrink: 0;
}

.filter-btn:hover {
  background-color: #e5e7eb;
  background-color: var(--bg-hover);
}

.filter-spacer {
  flex-grow: 1;
  min-width: 1rem;
}

.view-all-btn {
  border: 1px solid #0f447e;
  border: 1px solid var(--primary-color);
  background: white;
  background: var(--bg-white);
  padding: 0.6rem 1.2rem;
  border-radius: 2rem;
  cursor: pointer;
  font-size: 0.9rem;
  color: #0f447e;
  color: var(--primary-color);
  white-space: nowrap;
  flex-shrink: 0;
  margin-left: auto;
  transition: all 0.2s ease;
}

.view-all-btn:hover {
  background-color: #0f447e;
  background-color: var(--primary-color);
  color: #ffff;
}

.icon {
  margin-right: 0.5rem;
}

.properties-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  grid-gap: 1.5rem;
  gap: 1.5rem;
  justify-items: center;
}

.property-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 2rem 1.5rem;
}

.property-title {
  font-size: 1.8rem;
  font-weight: 600;
  color: #0f447e;
  color: var(--primary-color);
  margin-bottom: 2rem;
  text-align: left;
}

/* Nouveaux styles pour le popup */
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.modal-content {
  background: white;
  background: var(--bg-white);
  padding: 1.5rem;
  border-radius: 0.8rem;
  max-width: 400px;
  width: 90%;
  text-align: center;
  border: 1px solid #a3a9ae;
  border: 1px solid var(--border-dark);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
  box-shadow: var(--shadow-medium);
}

.modal-title {
  font-size: 1.5rem;
  font-weight: 600;
  color: #111827;
  color: var(--text-primary);
  margin-bottom: 1rem;
}

.modal-message {
  font-size: 1rem;
  color: #6b7280;
  color: var(--text-secondary);
  margin-bottom: 1.5rem;
}

.modal-buttons {
  display: flex;
  justify-content: center;
  gap: 1rem;
}

.modal-login-btn {
  background: #0f447e;
  background: var(--primary-color);
  color: rgb(255, 255, 255);
  color: var(--text-on-primary);
  border: none;
  padding: 0.6rem 1.2rem;
  border-radius: 2rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
}

.modal-login-btn:hover {
  background: #0d3a6b;
  background: var(--primary-hover);
}

.modal-cancel-btn {
  background: #f3f4f6;
  background: var(--bg-light);
  color: #6b7280;
  color: var(--text-secondary);
  border: 1px solid #e0e0e0;
  border: 1px solid var(--border-color);
  padding: 0.6rem 1.2rem;
  border-radius: 2rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
}

.modal-cancel-btn:hover {
  background: #e5e7eb;
  background: var(--bg-hover);
}

/* Nouveaux styles pour le message "Aucun appartement disponible" */
.no-properties {
  text-align: center;
  padding: 2rem;
  /* background: var(--bg-lighter); */
  border: 1px solid #e0e0e0;
  border: 1px solid var(--border-color);
  border-radius: 0.8rem;
  color: #6b7280;
  color: var(--text-secondary);
  max-width: 600px;
  margin: 0 auto;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  box-shadow: var(--shadow-light);
}

.no-properties p {
  font-size: 1.1rem;
  margin-bottom: 0.5rem;
}

.no-properties p:first-child {
  font-weight: 600;
  font-size: 1.25rem;
  color: #111827;
  color: var(--text-primary);
}

.no-properties p:last-child {
  font-size: 0.95rem;
  font-style: italic;
  /* color: var(--text-light); */
}

/* Responsive Design */
@media (max-width: 768px) {
  .filter-container {
    justify-content: flex-start;
    padding-bottom: 0.5rem;
  }

  .filter-spacer {
    display: none;
  }

  .view-all-btn {
    margin-left: 0;
    width: 100%;
    margin-top: 0.5rem;
  }

  .properties-grid {
    grid-template-columns: 1fr;
    max-width: 400px;
    margin: 0 auto;
  }

  .no-properties {
    padding: 1.5rem;
    max-width: 100%;
  }

  .no-properties p {
    font-size: 1rem;
  }
}

@media (max-width: 480px) {
  .filter-btn,
  .view-all-btn {
    font-size: 0.8rem;
    padding: 0.5rem 1rem;
  }

  .no-properties {
    padding: 1rem;
  }

  .no-properties p {
    font-size: 0.9rem;
  }
}

/* Styles pour les filtres actifs */
.filter-btn.active {
  background-color: #0f447e;
  background-color: var(--primary-color);
  color: rgb(255, 255, 255);
  color: var(--text-on-primary);
  border-color: #0f447e;
  border-color: var(--primary-color);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(15, 68, 126, 0.3);
}

.filter-btn.active:hover {
  background-color: #0d3a6b;
  background-color: var(--primary-hover);
  border-color: #0d3a6b;
  border-color: var(--primary-hover);
}

/* Animation pour les transitions de filtres */
.filter-btn {
  transition: all 0.3s ease;
}

.properties-grid {
  transition: opacity 0.3s ease;
}

/* Style pour le message "aucun résultat" après filtrage */
.no-properties {
  animation: fadeIn 0.3s ease-in;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Responsive pour les filtres sur mobile */
@media (max-width: 768px) {
  .filter-container {
    flex-wrap: wrap;
    gap: 0.5rem;
  }

  .filter-btn {
    font-size: 0.85rem;
    padding: 0.5rem 0.8rem;
  }

  .filter-btn.active {
    transform: none;
    box-shadow: 0 2px 8px rgba(15, 68, 126, 0.3);
  }
}

@media (max-width: 480px) {
  .filter-btn {
    font-size: 0.8rem;
    padding: 0.4rem 0.6rem;
  }

  .filter-btn .icon {
    width: 14px;
    height: 14px;
  }
}
/* Conteneur : on enlève la largeur fixe ! */
.view-all-container {
  display: flex;
  justify-content: center;
  width: 100%;                    /* ← plein largeur */
  max-width: 1200px;              /* ← limite max sur grand écran */
  margin: 0 auto;                 /* ← centre le conteneur lui-même */
  padding: 2rem 1.5rem;
  box-sizing: border-box;
}

/* Bouton unique et propre */
.view-all-btn-end {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #0f447e;
  border: 1px solid var(--primary-color);

  background: white;

  background: var(--bg-white);
  color: #0f447e;
  color: var(--primary-color);
  padding: 0.6rem 1.5rem;
  border-radius: 2rem;
  font-size: 0.9rem;
  font-weight: 500;
  white-space: nowrap;
  cursor: pointer;
  transition: all 0.25s ease;
  min-height: 44px;               /* ← bonne zone de tap sur mobile */
}

/* Hover + focus */
.view-all-btn-end:hover,
.view-all-btn-end:focus {
  background-color: #0f447e;
  background-color: var(--primary-color);
  color: #ffffff;
  outline: none;
}

/* Responsive mobile */
@media (max-width: 800px) {
  .view-all-container {
    padding: 2rem 1rem;
  }

  .view-all-btn-end {
    width: 100%;                  /* ← prend toute la largeur disponible */
    max-width: 100%;              /* ← sécurité */
    font-size: 0.95rem;
    padding: 0.85rem 1.5rem;
  }
}

/* Optionnel : encore plus petit sur très petits écrans */
@media (max-width: 480px) {
  .view-all-btn-end {
    font-size: 1rem;
    padding: 1rem 1.5rem;
  }
}


/* StatsComponentN.css */

.StatsComponent-container {
  display: flex;
  height: 210px;
  width: 100%;
  background-color: #f9f9f9;
  font-family: 'Poppins', sans-serif;
  /* margin-bottom: 105px;  */
  border-bottom: 1px solid #e2e2e2; 
}

.StatsComponent-card {
  flex: 1 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.StatsComponent-card:not(:last-child) {
  border-right: 1px solid #e2e2e2;
}

.StatsComponent-icon-container {
  background-color: #e30613;
  width: 60px;
  height: 60px;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 20px;
}

.StatsComponent-icon-container svg {
  width: 35px;
  height: 35px;
}

.StatsComponent-text-container {
  display: flex;
  flex-direction: column;
}

.StatsComponent-stat-number {
  color: #0F447E;
  font-weight: 700;
  font-size: 30px;
  line-height: 1.2;
}

.StatsComponent-stat-description {
  color: #0F447E;
  font-size: 16px;
  font-weight: 400;
}

/* Media queries pour la responsivité */
@media (max-width: 768px) {
  .StatsComponent-container {
    flex-direction: column;
    height: auto;
    border-bottom: none; 
  }
  
  .StatsComponent-card {
    flex-direction: row;
    justify-content: flex-start;
    padding: 25px 20px;
    border-bottom: 1px solid #e2e2e2; 
  }
  
  .StatsComponent-card:not(:last-child) {
    border-right: none;
  }
  
  /* Alignement vertical amélioré des icônes et du texte sur mobile */
  .StatsComponent-icon-container {
    flex-shrink: 0; /* Empêche l'icône de rétrécir */
  }
  
  .StatsComponent-text-container {
    justify-content: center; /* Centre le texte verticalement */
  }
}

/* Responsivité pour tablette */
@media (max-width: 1024px) and (min-width: 769px) {
  .StatsComponent-container {
    height: 180px;
  }
  
  .StatsComponent-icon-container {
    width: 55px;
    height: 55px;
  }
  
  .StatsComponent-stat-number {
    font-size: 28px;
  }
  
  .StatsComponent-stat-description {
    font-size: 15px;
  }
}
 :root {
   --LouerAppartementSection-primary-blue: #0F447E;
   --LouerAppartementSection-secondary-blue: #0F447E;
   --LouerAppartementSection-text-primary: #1f2937;
   --LouerAppartementSection-text-secondary: #6b7280;
   --LouerAppartementSection-background: #f8fafc;
   --LouerAppartementSection-white: #ffffff;
   --LouerAppartementSection-border: #e5e7eb;
   --LouerAppartementSection-error: #E30613;
   --LouerAppartementSection-success: #10b981;
 }

 .LouerAppartementSection-section {
   font-family: 'Poppins', sans-serif;
   background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%);
   background: linear-gradient(135deg, var(--LouerAppartementSection-background) 0%, #ffffff 100%);
   padding: 120px 20px;
   position: relative;
   overflow: hidden;
   min-height: 100vh;
   display: flex;
   align-items: center;
 }

 .LouerAppartementSection-container {
   max-width: 1400px;
   margin: 0 auto;
   position: relative;
   z-index: 2;
   width: 100%;
 }

 .LouerAppartementSection-content-wrapper {
   display: grid;
   grid-template-columns: 1fr 1fr;
   align-items: center;
   grid-gap: 80px;
   gap: 80px;
   min-height: 600px;
 }

 /* Phone Container */
 .LouerAppartementSection-phone-container {
   display: flex;
   justify-content: center;
   align-items: center;
   position: relative;
   padding: 40px;
 }

 .LouerAppartementSection-phone {
   width: 320px;
   height: 640px;
   background: linear-gradient(145deg, #0F447E, #0F447E);
   background: linear-gradient(145deg, var(--LouerAppartementSection-primary-blue), var(--LouerAppartementSection-secondary-blue));
   border-radius: 50px;
   padding: 25px;
   box-shadow: 0 30px 60px rgba(12, 68, 126, 0.3);
   position: relative;
   transform: rotate(-8deg);
   transition: all 0.4s ease;
 }

 .LouerAppartementSection-phone:hover {
   transform: rotate(-3deg) scale(1.05);
   box-shadow: 0 40px 80px rgba(12, 68, 126, 0.4);
 }

 .LouerAppartementSection-phone-screen {
   width: 100%;
   height: 100%;
   background: #ffffff;
   background: var(--LouerAppartementSection-white);
   border-radius: 35px;
   padding: 25px;
   overflow: hidden;
   position: relative;
 }

 .LouerAppartementSection-app-header {
   margin-bottom: 30px;
 }

 .LouerAppartementSection-status-bar {
   height: 6px;
   background: #e5e7eb;
   background: var(--LouerAppartementSection-border);
   border-radius: 3px;
   margin-bottom: 20px;
   position: relative;
 }

 .LouerAppartementSection-status-bar::after {
   content: '';
   position: absolute;
   left: 0;
   top: 0;
   height: 100%;
   width: 60%;
   background: #10b981;
   background: var(--LouerAppartementSection-success);
   border-radius: 3px;
 }

 .LouerAppartementSection-app-title {
   font-weight: 800;
   font-size: 20px;
   color: #0F447E;
   color: var(--LouerAppartementSection-primary-blue);
   text-align: center;
   letter-spacing: 1px;
 }

 .LouerAppartementSection-logo {
   max-width: 100px;
   height: auto;
   display: block;
   margin: 0 auto;
 }

 .LouerAppartementSection-chat-messages {
   display: flex;
   flex-direction: column;
   gap: 20px;
 }

 .LouerAppartementSection-message {
   display: flex;
   animation: fadeInUp 0.8s ease forwards;
 }

 .LouerAppartementSection-message.LouerAppartementSection-received {
   justify-content: flex-start;
 }

 .LouerAppartementSection-message.LouerAppartementSection-sent {
   justify-content: flex-end;
 }

 .LouerAppartementSection-message-bubble {
   max-width: 75%;
   padding: 16px 20px;
   border-radius: 25px;
   font-size: 15px;
   line-height: 1.5;
   font-weight: 500;
   position: relative;
 }

 .LouerAppartementSection-message.LouerAppartementSection-received .LouerAppartementSection-message-bubble {
   background: #f1f5f9;
   color: #475569;
   border-bottom-left-radius: 8px;
 }

 .LouerAppartementSection-message.LouerAppartementSection-sent .LouerAppartementSection-message-bubble {
   background: linear-gradient(135deg, #0F447E, #0F447E);
   background: linear-gradient(135deg, var(--LouerAppartementSection-primary-blue), var(--LouerAppartementSection-secondary-blue));
   color: white;
   border-bottom-right-radius: 8px;
 }

 .LouerAppartementSection-hand {
   position: absolute;
   bottom: -20px;
   left: -50px;
   width: 140px;
   height: 100px;
   z-index: 3;
 }

 .LouerAppartementSection-thumb {
   position: absolute;
   bottom: 10px;
   left: 30px;
   width: 35px;
   height: 50px;
   background: linear-gradient(145deg, #fbbf24, #f59e0b);
   border-radius: 20px 20px 10px 10px;
   transform: rotate(25deg);
   box-shadow: 0 4px 15px rgba(251, 191, 36, 0.3);
 }

 .LouerAppartementSection-fingers {
   position: absolute;
   bottom: 20px;
   left: 0;
   width: 90px;
   height: 45px;
   background: linear-gradient(145deg, #fbbf24, #f59e0b);
   border-radius: 50px 50px 15px 15px;
   box-shadow: 0 4px 15px rgba(251, 191, 36, 0.3);
 }

 /* Content */
 .LouerAppartementSection-content {
   max-width: 600px;
   padding: 40px;
 }

 .LouerAppartementSection-title {
   font-size: 3.5rem;
   font-weight: 800;
   margin-bottom: 30px;
   line-height: 1.1;
 }

 .LouerAppartementSection-title-part1 {
   color: #0F447E;
   color: var(--LouerAppartementSection-primary-blue);
 }

 .LouerAppartementSection-title-part2 {
   color: #E30613;
   color: var(--LouerAppartementSection-error);
 }

 .LouerAppartementSection-description {
   font-size: 20px;
   color: #6b7280;
   color: var(--LouerAppartementSection-text-secondary);
   margin-bottom: 50px;
   line-height: 1.7;
   font-weight: 400;
 }

 .LouerAppartementSection-cta-button {
   display: inline-flex;
   align-items: center;
   gap: 15px;
   background: linear-gradient(135deg, #0F447E, #0F447E);
   background: linear-gradient(135deg, var(--LouerAppartementSection-primary-blue), var(--LouerAppartementSection-secondary-blue));
   color: white;
   padding: 20px 40px;
   border: none;
   border-radius: 10px;
   font-size: 18px;
   font-weight: 600;
   font-family: 'Poppins', sans-serif;
   cursor: pointer;
   transition: all 0.4s ease;
   box-shadow: 0 15px 35px rgba(12, 68, 126, 0.3);
   position: relative;
   overflow: hidden;
 }

 /* .LouerAppartementSection-cta-button::before {
   content: '';
   position: absolute;
   top: 0;
   left: -100%;
   width: 100%;
   height: 100%;
   background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
   transition: left 0.6s ease;
 }

 .LouerAppartementSection-cta-button:hover {
   transform: translateY(-4px);
   box-shadow: 0 25px 50px rgba(12, 68, 126, 0.4);
   background: linear-gradient(135deg, var(--LouerAppartementSection-secondary-blue), var(--LouerAppartementSection-primary-blue));
 } */

 .LouerAppartementSection-cta-button:hover::before {
   left: 100%;
 }

 .LouerAppartementSection-button-icon {
   transition: transform 0.3s ease;
 }

 .LouerAppartementSection-cta-button:hover .LouerAppartementSection-button-icon {
   transform: scale(1.2);
 }

 /* Background decorative elements */
 .LouerAppartementSection-bg-dots {
   position: absolute;
   inset: 0;
   z-index: 1;
 }

 .LouerAppartementSection-dot {
   position: absolute;
   border-radius: 50%;
   opacity: 0.7;
 }

 .LouerAppartementSection-dot-1 {
   width: 12px;
   height: 12px;
   background: #60a5fa;
   top: 15%;
   right: 20%;
   animation: float 6s ease-in-out infinite;
 }

 .LouerAppartementSection-dot-2 {
   width: 16px;
   height: 16px;
   background: #34d399;
   top: 25%;
   right: 10%;
   animation: float 8s ease-in-out infinite reverse;
 }

 .LouerAppartementSection-dot-3 {
   width: 10px;
   height: 10px;
   background: #f472b6;
   bottom: 30%;
   right: 15%;
   animation: float 7s ease-in-out infinite;
 }

 .LouerAppartementSection-dot-4 {
   width: 14px;
   height: 14px;
   background: #fbbf24;
   top: 60%;
   left: 10%;
   animation: float 9s ease-in-out infinite reverse;
 }

 .LouerAppartementSection-dot-5 {
   width: 12px;
   height: 12px;
   background: #a78bfa;
   bottom: 20%;
   left: 5%;
   animation: float 5s ease-in-out infinite;
 }

 @keyframes float {

   0%,
   100% {
     transform: translateY(0);
   }

   50% {
     transform: translateY(-30px);
   }
 }

 @keyframes fadeInUp {
   from {
     opacity: 0;
     transform: translateY(20px);
   }

   to {
     opacity: 1;
     transform: translateY(0);
   }
 }

 /* Responsive Design */
 @media (max-width: 1200px) {
   .LouerAppartementSection-content-wrapper {
     gap: 60px;
   }

   .LouerAppartementSection-phone {
     width: 280px;
     height: 560px;
   }

   .LouerAppartementSection-title {
     font-size: 3rem;
   }
 }

 @media (max-width: 968px) {
   .LouerAppartementSection-section {
     padding: 80px 20px;
     min-height: auto;
   }

   .LouerAppartementSection-content-wrapper {
     grid-template-columns: 1fr;
     gap: 60px;
   }

   .LouerAppartementSection-phone {
     width: 280px;
     height: 560px;
     transform: rotate(0deg);
   }

   .LouerAppartementSection-phone:hover {
     transform: rotate(0deg) scale(1.02);
   }

   .LouerAppartementSection-hand {
     display: none;
   }

   .LouerAppartementSection-content {
     padding: 20px;
     text-align: left;
   }

   .LouerAppartementSection-title {
     font-size: 2.8rem;
   }

   .LouerAppartementSection-description {
     font-size: 18px;
   }

   .LouerAppartementSection-cta-button {
     align-self: flex-start;
   }
 }

 @media (max-width: 640px) {
   .LouerAppartementSection-section {
     padding: 60px 15px;
   }

   .LouerAppartementSection-phone {
     width: 240px;
     height: 480px;
     padding: 18px;
   }

   .LouerAppartementSection-phone-screen {
     padding: 18px;
   }

   .LouerAppartementSection-app-title {
     font-size: 18px;
   }

   .LouerAppartementSection-message-bubble {
     font-size: 13px;
     padding: 12px 16px;
     max-width: 85%;
   }

   .LouerAppartementSection-title {
     font-size: 2.2rem;
     margin-bottom: 20px;
   }

   .LouerAppartementSection-description {
     font-size: 16px;
     margin-bottom: 40px;
   }

   .LouerAppartementSection-cta-button {
     padding: 16px 30px;
     font-size: 16px;
     gap: 12px;
     border-radius: 8px;
   }

   .LouerAppartementSection-content {
     padding: 15px;
   }
 }

 @media (max-width: 480px) {
   .LouerAppartementSection-phone {
     width: 220px;
     height: 440px;
     padding: 15px;
   }

   .LouerAppartementSection-phone-screen {
     padding: 15px;
   }

   .LouerAppartementSection-app-title {
     font-size: 16px;
   }

   .LouerAppartementSection-message-bubble {
     font-size: 12px;
     padding: 10px 14px;
   }

   .LouerAppartementSection-title {
     font-size: 1.9rem;
   }

   .LouerAppartementSection-cta-button {
     padding: 14px 25px;
     font-size: 15px;
     border-radius: 6px;
     width: 100%;
     justify-content: center;
   }
 }

 /* Ajoutez ceci à votre fichier LouerAppartementSection.css */

/* .popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.popup-content {
  background-color: white;
  padding: 2rem;
  border-radius: 8px;
  max-width: 500px;
  width: 90%;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.close-popup-btn {
  margin-top: 1rem;
  padding: 0.5rem 1rem;
  background-color: #f0f0f0;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

.close-popup-btn:hover {
  background-color: #e0e0e0;
}


.popup-open {
    filter: blur(4px);
    transition: filter 0.3s ease;
    overflow: hidden;
    height: 100vh;
}

.popup-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 999;
    backdrop-filter: blur(2px);
}

.AjoutAppartementPopup {
    position: fixed;
    z-index: 1000;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
} */

/* Styles pour le flou d'arrière-plan */
.popup-open {
    position: relative;
    overflow: hidden;
    height: 100vh;
}

.popup-open::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 999;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    pointer-events: none;
}

/* Style du popup */
.AjoutAppartementPopup {
    position: fixed;
    z-index: 1000;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    filter: none !important;
    width: 90%;
    max-width: 600px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    padding: 2rem;
    animation: fadeIn 0.3s ease-out;
}

.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content {
    background: white;
    padding: 20px;
    border-radius: 8px;
    text-align: center;
    max-width: 400px;
    width: 90%;
}

.modal-title {
    font-size: 1.5rem;
    margin-bottom: 10px;
}

.modal-message {
    margin-bottom: 20px;
}

.modal-buttons {
    display: flex;
    justify-content: space-around;
}

.modal-login-btn {
    background: #0F447E;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

.modal-cancel-btn {
    background: #6c757d;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translate(-50%, -45%); }
    to { opacity: 1; transform: translate(-50%, -50%); }
}

.react-tel-input{font-family:'Roboto',sans-serif;font-size:15px;position:relative;width:100%}.react-tel-input :disabled{cursor:not-allowed}.react-tel-input .flag{width:16px;height:11px;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAACmCAMAAAACnqETAAADAFBMVEUAAAD30gQCKn0GJJ4MP4kMlD43WGf9/f329vcBAQHhAADx8vHvAwL8AQL7UlL4RUUzqDP2MjLp6un2Jyj0Ghn2PTr9fHvi5OJYuln7Xl75+UPpNzXUAQH29jH6cXC+AAIAJwBNtE/23Ff5aGdDr0TJAQHsZV3qR0IAOQB3x3fdRD/Z2NvuWFLkcG7fVlH4kI4AAlXO0M8BATsdS6MCagIBfQEASgPoKSc4VKL442q4xeQAigD46eetAABYd9jvf3nZMiwAAoD30zz55X5ng9tPbKZnwGXz8x77+lY7OTjzzikABGsenh72pKNPldEAWgHgGBgAACH88/Gqt95JR0OWAwP3uLd/qdr53kMBBJJ3d3XMPTpWer8NnAwABKPH1O1VVFIuLSz13NtZnlf2kEh9keLn7vfZ4vNkZGHzvwJIXZRfZLuDwfv4y8tvk79LlUblzsxorGcCBusFKuYCCcdmfq5jqvlxt/tzktEABLb8/HL2tlTAw8SLlMFpj/ZlpNhBZ81BYbQcGxuToN9SYdjXY2Lz7lD0dCQ6S9Dm0EUCYPdDlvWWvd2AnviXqc11eMZTqPc3cPMCRev16ZrRUE0Hf/tNT7HIJyTptDVTffSsTkvhtgQ0T4jigoFUx/g+hsX9/QUHzQY1dbJ7sHV02Pduvd0leiK1XmaTrfpCQPgELrrdsrY1NamgyPrh03iPxosvX92ysbCgoZzk5kP1YD7t6AILnu+45LykNS40qvXDdHnR6tBennz6u3TSxU1Or9Swz6wqzCsPZKzglJbIqEY8hDhyAgFzbJxuOC+Li4d9sJLFsnhwbvH2d1A3kzAqPZQITsN76nq2dzaZdKJf4F6RJkb078YFiM+tnWZGh2F+dDibykYoMcsnekdI1UhCAwWb25qVkEq43km9yBrclQMGwfyZ3/zZ2QK9gJxsJWCBUk32QwqOSYKRxh6Xdm3B4oMW22EPZzawnR72kgZltCqPxrdH1dkBkqDdWwwMwMO9O2sqKXHvipPGJkzlRVLhJjVIs9KrAAAAB3RSTlMA/v3+/Pn9Fk05qAAAUU9JREFUeNp0nAlYVNcVxzHazoroGBkXhAgCCjMsroDoKIgKdFABBwQUnSAoCqLRFBfcCBIM4kbqShO1hlSrCJqQQmNssVFqjBarsdjFJWlMTOLXJDZt8/X7+j/n3pk3vNq/bb8+3nbP79137/+dd954qTVt8uTJL73OMhqNer03ady4cWOhWbNmjV+0FfKGjMb36Y9/1fXUst9cb2y8/lpb797z5k2dOjXVD9Ljn59fcHBwQEDAgGch3l9on6feeeedn0r9kvT222+/sErRgvcDArwV8f5tN/rcvPnMZ22pqVFRSVGjR38k9Rsp9fLql/MXLj20VGjt2rVeak2Og/auI/kHBQ3We/tCo0ZNhwYNGj58/NaWlpbOyMhIX1//2/jTrICvckhXruQsWbJw4cL3tzhPORynSk5lZWVtglL9IkmdDQ05NqvVGhLwbKSUL+Tvb9yH/2sj+eN0IZZ3fvq3Hnp71ZtCOyofdnTYSzq9xX7UtsF9+/Y1FpeZT54sc2aUlq6Jy89YM/qj2oZaoeOkMR8dV/Tee++NWb04rrA5MRYKDAyc/NKCpwDIyKhE9LEzZ/r4DLQAAE6EyEeM6AcNH7m1pTMnB+fHX7tG9Bs0Xt+GwM/frqm5tz950aKDk6rsiA0xbUrbRAii/BDeV9bGhQsPRlyOCAuZ9GykZwT++n2RHPnVYQU+oaFDPQD8jEQAPiDdaLPaHGVXbn/O7YHQuIH9B/gYgzts1iqrtSopKWlNRkzS6I8arFaOFvTfew8AfiYil/rN6sWTKwtbArOzExISUl7+vwCuQNt8Bg71AQCcTwNpWeFbW3IIQEmJr08XgIzX2xDcvZrs7Jru5EWXwwKSwh2RkQ77w7Q0bXp6YRoDaKO+kZl8MCwsYpJ3pEf8liAAoPhDhqUMQ/wAkF+oqKiosJYA7HxotdnTtVe6Pr/S0h+AI90QffU3T9obGuwdD5PqkmJiMtbM+ajWI/60TX0COhoarAAE1dfXV80FgMmLi1oSKP7/B6ASAGyBV4YM7D/Bx8/bF7g5fgmgEwCCSiJtJQRgxEi9zZqVdYUu9pW0tLCIgOvxdR0dpxx5aWl7EzV7CYDV+tXnCzMzkzMvE4AFlTuhZaSf/OQny1L32RC+JcHikzJ06NAJoe+YNKRbsbG3xPlWZTxssNmdOP/J27ffudLJ60V7DAaT1lxRVvfwYe3Jlrq4uJiKjAwAcIWP+BkAhV/i7HA0uAG8BAIUf8qfzvwvgJcQf+XMK4GWi8OGTpgQ6uftzwC0LIM2WgcASwaXOBwlA7v6/YgAhFRt2pRGeu0/UyImbal77eHDo2kVAJAeKwE0fl6P63/5nSlTAKBCiR8AovbZEL9lf8I5AMD5booAE7OzY8X5fhGJi0/nTzTcMh+80iIBaF0APqvIu3EjqfRGcV3S4aSKYk8AaW4ADU4gOFlfn8sAXnoJBDpTCMDL87zU2kwATl+x1Nw+P2HChKHBBMDHFT8DwGjX11FSYu/f/aMf9XtOjwAacf2hmxRg7ywXDrr30kb7NVhDquo/z0y+nJs7ZUoYA5DxM4BFmcnJyV93PzjbvQhK3urqAYF7xflWVT5ssDaU4Ox7T9+6Ei4BaN0AUkvXJEExMTGHD9cdFgA2yfgZQAP1f0dJw0lrfS4BmIb4z5yZBgL/H8DibbehGROenQ0AQRhvZPwQAGDQ8wlqsFkmdP9ofr/n/OgK2ml1xxQECAAy/tdee++91wCA1mfWJy/KXUTr536T+O67764X2r9//T+3JkPdDx50f7qItDXfff+zeAxY1lYV0VCmPV1Ts5fGAGUYDbHpo0qT6vKTignAtWvXiuf0StwGZZPQybMPAYC8/xF/bj0AUPwvvzytKCdl6dMAvJxRuXjxkCHnL86YMXs2A8B4m4yWQTrdIp0uByMajcATJrwzXwCIiIjAFSrbJwGI+FlH00YH8/rQy5enQPsYgBK/BLCI1c0Afonhn/XjH8MNLP9o1Y4Pfg795N9hYQ23bt1q4fb07z+A/ITR2J8AFJnqOP7iuj7Fc35TK+9/bkPaM+NGiSnsB6wRIwGA4n/5T5Pzc5aeeAqAP1VCM4niWRqVgr1p1sEYlskNJQC4BQZbLJi0MAgCgBUKqYo3VEVEhIWFTZqXtYmVxiIAtB4QeDUAvMuSFBgAJCkwAKHlLAKw4wMIFG5URVgdLdwedEq6BuCgj1qzpi4uiVScYa6I0fWKJQVC2aRDY0eNWrlyECwMMIDDc2vZ6UF0F7z8tB5w4kTvtZ+ygklGkk4lvZ6sne45SDg8aJIQ2z+4Mmg0qcfauXPnfvPNN9XV/1S0VSWyf1Ls4FZ5aIHu/blGKb2UOM0ckq4PmsZ2b8yYMb2l4FbhX8ePHwmhuSPXkhaQ5q0tXzBvntdUUq9eSyFu9njXxpA74Leg198yktRWVI4OkAkymw2Q3WO90+nnN3u2H0QkHI6JpHHj2GvTYdsupd68GfVZ4yTJqJeUaNKhQ+rzCUvOMXEr//4vD3333XdLe+rRJx4iqumDnT2O5zW1HII1hPLy8pJGjz9GWgk9D61Al4fWkWay9VRbUa1GEVCYDRoonu0dr++n0ZQ0dMCNdDRYHVrtuImjWHQ80lvfl4WfhJetw1CFm6h+rkazd28iJHvyIe/IHt7ZOBY7o4GPH4smPqf7nRwz/sH6bmmi2HtvYiBUYPxEcZakt701PdsPAIhb3DBbYmIIAOK+F9HXJ6z7t799AwDI48+cOQRi66m2ogoAYVwIQEkQb8DrJza1azRWq9NpjUjXtg+aNXHU9EEQHW/YsGFD3toHMFZbgzUsDNPkPgAgpScG1vA4TgB8PZATAAoc6IasWPHhhwCQkyNCdwMIJCVqDabA8+cAAJFLYVD92dvpjvQe7ZcA7p0/350dEzNmy+iRAHBPrO9+AwB41Of4h2HoFdZYhsfL7ej7QmbSBdED/GkDXv+ju9Pv4i9mM+g09Rs1duKoQSQR/4whb7msbFhufHy8M2xup6AZ3sHzWOChaveIWQCtn00A7s/84MDuD4bd+fBDcYEukrVna5fwMQPAsqnQZOqqLtBzezysvHd6z/YLANndUELMGAmgXqzPfeON3+IE8PHbuL2YegYCAO+/fz/io2VMM+5HpR/BGXIPGCzix3oAaBo13aApK9Mahg8fNAo9ANsPGi7iB4BLZRUPH9advJGb6zx+3Jk7FwFtCNekNzQUabW3cAv0Ek9uUA0U+PGsY4NmzrxQVBS3e82wGQDA7bvI8SsAsgNP7y26HV4GALyeJzGaY5J18fZ4GT+3DwBK8/K2ZF/s7v46ZYwEsMJHrJ/gApBJ8QPAs9gh2BYBnT077OwUnvcBwB0/nCEAQPFBdADefv5dPEu3p2u18e39Bg2aPou2h9wNmP3wi7bGL9qsuVOcizoBgM/X0BBtamggK2wGABn+WSLw8awm9P4Du3ecys+aMWPGt6J9medF/EsBIBbxJxSFm4vM5moJAOGL+AHAO90jfglgy5bshO7uFAIQM2fkyhUr6sX6fW+MJQDYX1wvWI/+uOIc79mziJec4ESxDPGy6AF9RfzYHgBw02s7yswNhf1GDJ8+lvcfPgKrxfoAa0S9uP9HTV95LHdur8TzuF7W5OSqDdEGAFiaiIjk9U8hAMdw+1Ts3r37VPOMGR/K9l3k+CUA9P9b4c6y8LKC6upqAiDj3wpxD1Dix/m9Uku3KAD6xMx5DgC6xfrLYwnAEuw/jOJnAMHjpnvECwA8aK5YseK3EA2aogf0pQNIAIOaXI8S0/sBAPaHaLUEIOJHPmjUsWACACN7/qLVmoz2Zjabv3x8X+oBdP/DWeih94d9sHv3BzO+fOOND6l9C93xL00BgOy97dHo/ZHm6EcAwM8OHlZ+YLpFtF9eQAGA9+81pg8DQCzdU3D9Ef/YN3AC8OP4Z5D1DBg7XYmfAKitqYl7AA8AvDxxVLtGW1VVVhYRZjC0jhg/Tuzv3j6gCuEjfghGYd/cXrFk5BNqai4K633k938h/Zp15C8Tx68E7X7Dtm2b8QZEAH743j8gYQQwC8TGlp08Z7ZWC+k/4eFf6pc//Sje3+TZ/pFeqXkQ7hoIhhoAnve8ogRgCQZBMQsgTgBgXykpAoDKmpoIuJP/wMvzwaOKHkisVfUnDYZZ2J/k3n4ST/94UiHt2/d+Lx7yttFAXnP+60W6+X9ggQFzGDdeOJT791fQNAgAv/qHFFMAAJou7AWQBCAkKXzknW71bD96APnWQ4c+hthRsv1Ty2WNA4InwYYpzhJSW1MT+lmkxx9awyfNhQVmvf9+c9M4kVt1by8tsmuLub3I/in6er7URGkh1SZ1znfk/xR9o2oP7F8Pax1vbO8RgJcwhYp8BvpMcD1t+0GffPJ7xUo+CA54Yc+DPXv2vGA0vkBavfqIW+xeH3kr8iJ9QxJegQNpu/TMzZupnzXOkQ7+OkumeCCOU+Si2Sr7kR6RkQZ/iA0y62PWVKlUiLy8fsz1MSd6s+YhLz1vu0t7ILS4T1Rqn2cU9fF6YQdpMZIAG6dNmzZ5bX+7PZKGsXi0CM9xwZ+0DmuVnejxsHMDJu3Zu24vkrT+QTtYq4/8nvWHPzyeCa2HUySRbzMKAO9CGhZ15Pku67uGlaS7frzoeFat26uY2CpzijiIrbKfLdH2buy7eKLkR8oAaXWhQNLH8+qEKirKy0tLS6O8bXVZQpvg8dPmbV/O+jH0IvRClLY06hkPAcBGqLa19ckBzC0HVg+0R9rQFpqFtWER1oBPhr3+eutPocevPzIaBwTseTORAu/rQ7sd2AgA4g69T1PlfmGVsX9fn8ESALk4ER5Gsb/Mny2tbzGkPQwASH1s2iTDBwC2yhYeVdgq+yXODAwpCCzAozT7Dml12fqR8VGcOMtk9A0pkUvsI7YvR+DQrl2vQLtWpdbFPAVAq8lgMrcygKEEoKQsJKTMYQgLDQn4ZN3r60T43ngSrH5g1rBcWaINAoCMX1plXq8GoBUAXNYX4RcfPqzVXa8tqk3bpATAVtnCVpytsp8tsCBifcJVil8BoFhfu7OE5RCyGn0HWxweQLYvf/HF2tp1T568IgD0Gf2MJilKBSCrPf5Cc3h76e4zuwmAv8ZqQ5cLMwwNA4DWn+IfwoeqX3/8kQvAQC2rGQCU+NkqywuiAqAVACa6rO/hYsR/uBi3wKZd7wGA1gPAcEvfhAQAmEEA4DwLEgo4/tmzwyYdYqurWF+9zWKxhCKlTjnV2WEBxkhHX5/G8jSZEZoKALWJWbuyYgWBVRgA6vqk9hgDNh54YtI2t2jbn5wBgAl2m1XTYAmxhFoNU5DG/uRnHuG/d/yjEa0X7kID+99tgu6OxTytxK8A0KoAaCGexz+rWHPpUtKaG4e1hwnAhhNZlLtMhwyG+HhDGVvl0PXZ2fv7w3oMe8vPijuf4of2AQCyutDmzWdI1zcv0Psr8SOFF2As0Th8Qr84CiEzcjSKni09b4l5C+al4r9uAcCBA1nthuYKc3spA4i0hWgNdFazgbK8n3iEjzct380S1rd/f+mkAECJH87O21/2v76eALQM4MiRX0+MKqXsFXSYAei8/d3WXLHaoQNTUga4AYSGiesPTSEASvwEwCrin4D4GYAv4m9MS5M5yalGX1uixccntCDwKqf5n5FSboGNBw4caG03m1tbz5zZs3v1bAAAKvtJDAuzAeD1c0r4DEBY4f4DKH4C8AclfgYQxFl0etRWAAj+RwjA6DUyfuoC3xt02F6JnwDQ8UNpeQAB+DTY6op/HxJLU+au3jj5JYRPwvR5ZoFN3v12oVxjkE+oXbG+4o71WH5dJa9VALD7wBPMArvP7AEAfaTVgm3NZkzcszHoBCvhM4BvhTcfMOCB8OZH/sDxp0hrCwA8PvKjNqkaAPaL80sAyvU3fF+sU1tptspDaRkA3gKAEIoforwaAPhZ3f2de4RWeUvAARqDKH65ZDKE7/nxriexm17ZtO0JxvhXX1n1Q5UAYCMQTCsvn7ybEuYL9JE2q9jfZJoSBgADEP5xt757MJM0xMcHUUOfzr9Pywlua+vtThhJAOvdPYDc/LjRayC+CxiDTm2l2SpbeJmPHywzyhLDXH1ICI96wEAcAlIr4ABKSThuXt4c75ByyJ2Zj9qDWbD2SSJmAdaqBSp5CdPoB5frx9LDdEVDG6C5cKnB/xz1kdB3rAcP2Bb7+X0q9GtOXirWU7HGEgBSwI/CoehosrIT2f7pFKmtNFvlYF4W/jvAI6kMoX2y1kBIZKBHu1PDwfNI7A1ZbP+UIgPMAn08hFnAIOROal3P6pnlzSQlK8pHf4F2s+AwjSRNvDsCadl76bQif9tbqDBdNvzPfxcy8+nCw1OULDDrOukEi7PXnngo+IDLY8UZZMmGOmsMn09yPTI8VwjhWEUkXIY4mYVu2/7qq9tJXuqsLoxJj+XMZqEWUmdnskabf8olWOI9Rl9Ik07vqeh1id/EpqZRUGKOhksqxveuZGm0Idx3g//+BPrd734n793wXnuFEoUOXc+ClJcrC4wiI8rv0On4GNUbbh8TBRtwDOPVWerxv2P9SuiPukKcBwd0xRPusuLSH+/xUmd1r9dm5XsuZzZ35kBLxCt+ANBoihA5CY6YAODEmnS8KRpIr7cBgJp2uyDkahcmi+EAUE7SpvPQFRrw9yfcvk5nPHUyApDokQWPBQCOXN7DafPo+ABH1RN8fL0t6OrVq1X3eC7C8dVZ6vHu2P/4xz//WQDAQ44rnmhXFlrYYxeAW+mJ6bcSEyUAEFCyqJdPfkX6HLp8+fJXBEBTyAR2uAD0tWjSfbh9BGAUxX/1zi8HVXcpAHZq03m9BNBptXY4ET8DUOKXANJk/AxAFETYbO/ayJ3aACAwcH3gep/Qru4PUZ8w/nW8X9gWOMSdZR7bRG81jkOU1XjeDUArFOey4i++WFW1vr4NAMTLaFjLvekuAJvylYKIXIcvFcQItzLB9o5G44CzylcA+Pe1+GjS+fojwGDO4hbcOfuXX35bnZ0deIgB7Nyp1QqrygB+1Wb9lbOBAUQTAOV1XuwhdRZXI7Q3UVplfSKS45aEc0MH9p/yTveKkQCw7WrIXneWmYDMrD3++Mnx47x8Iqt8GiTs4+bJ8y6V3Xj4sOLkjV27qjA9AYCBvGJsQkLgXraKBAAEOsCdZPfLdbjjRwQAUOJvxy7t/BK+NKuPhqVYTX6PEHJ101+qq8MWLcrUqdf/ne5Pa+OvMLPRPB3dBw+ychaDSkers7gaFiAliv31sSHr14euv0o8n322XoeAHXhwOyuydsMYwJDax0+ePD5OywCA8NM4fAIwdWfdtIqKvKyMXbuKDPWFRS8wAG3r3lvtF0RBAveANuqv7K2Dc+3K9Z/g7gGtlKRja9sjPjSQF6/eqc7+9ttztKz3Z6uarl22BcqL+jvdo1URvyqzGbSUpOTX6XlkW0mvpaqzuBLA6dOxOD4DKMA7koRzaMyUf3+xczUCvlVgic+m+CWAIUNqjz95vEkBwJdfAniVhj6+/xuRjGyTAO42XRjVxJMfACjxE4CuveRlC2SO7d13NJD59yJFSQD0QRj+tPHu7flhpqv6y+pv/9lF7wn0QexZ4g1bBIBZBCAnIsJaEm+QAJT4f/Naqrmndd2wCFMPhuHTp3OWQDk6vS1hfcL+6v6I/iU8vgPAkAs1+5vPIn62zt6+56AsdNChjx49OqcvwsEQPx2OjwcAIv5d+YW5hfkSgNZ814wNGADHP0HEo58Q8PXe2Fjx/JkCxd7T8uXn+CUA3P4AILcPFu8NuqrDziF+lND4hfCjigAQsywKozQN0Esc8eJ89LTHLk8+7ZmV+LnBnJX2KNAA8KvVQ//9xWTYkDNnJq9VW2m5XF8vl2lSx/X3AMDhU35kee7yXS94mfh8St78RNZDOetAEwBAmaRjoS6t4a7M0TKFcWxNtfE+cvvgsWKCjs3U8jwFAGxd0w150DIAkHO0QSjaSPM3Pa6BI+RnVtojAPAErBRo6AeHtN1YDP8uRra1aiutXgYALTZ1H287pn+SxAAA0pFB0aQT7wuzKbOQwV93kfC/Qt13j/TI0k5kg2Yqox1YY0VBwlKdWXgx6VvLzKlRrPEjRU53Q7QQdpenE/bW7G7JBpZOpUmfLVi9arXQWkhtpdXLZP8WzFsQFx3Hh2vm/CjrBZaX9UbvmzenotZWWmpZ3AOJUgvCtkq/2u2Vy0lmbiOfZhxLqSWuyC/FpS5qbCyiW/6LUm/om2rv6mrvR9VGyCRkNErs6uOprS2bcpaZ91Bbd0CTmsTiPd/i8gtuzxGVPpoIebTY61qJ+aT9pJOytEnQ6NfiSBlxcbWsMTRG7LBtdFvJ8nxI9FAyKEhgkJRa4jqHpigjQxMZqamry/fV1Hk3eWRx198zmjTpmEZovSbe7tRGq4+ntraGnlY9nJfT47Wu5YAGVIKSZIEF7y8KOrg9R5C++r2iI6/W9myvF2p3/YNwyqQYcl/Fc14TkcNAk+r60AkPhBzg0wkA4GNi2fyDCMAg5VURKkfz4uwOzWJN0GBNuR0Qrnk3jTrrqlh68O1wvDlyNCBp6R+k0Tqq7ACgOp7K2koA6b7xSgFGeuTgvkElWBYAEDgidxVY8P5c0DGMrbLTgx908tVTPdo73uumw+4baW94WByTlp+fFuMCkJGhBqD1ACCeFP2pTg/WVzkgTpiXUV6GtCCeD4Li82N29vYGoDs1/Lrvy379ngcADaWtg0JwMAe8ufp46gIM+brdYnEKL4/lSF5fItqjFE6ms6/g/UVBB18Qb1xgeno4x7qqf/XUKdr81i2ZIfJaU1LR0YEsbUxMWmnFUQEgP5/sYFxceXlWn1XIGR6w0JzDWosGZ2SIBgeFwJvDeBBvtxWVz5Ior2Xle486i4KIO1fP3aEXkiv0QQ47pa9CQoTTnP304227d08ejwMsszRaylwAZIGDvwCw/RQ8ObRRaBUXcIiCDpwPAN6NvQoN5vgHngOA5XT7NDVJa+31WUXSjRsxa27EXEuLawGAo3HU/+OysnBjlpdmPeNnExkYV16+HO3NEKMQJjgrGizjl1a0MTLI4xL2vek9KrBg+IiuhBRUFhMAfrojiae74Kcf715m8j0+ngDgj/vBR9QOAyArUmj2njc5cJmkOLCKa5u5PTO4YMM7cR0REPELAMtxxA0bpDX3SsXYFwNdu5bWmZN0bc7RjNraOMSPHpBRCgCrKWcYKq//njNrp4kGmyCQCQlGg5X40WDZA3z6u3vAnUEjRtw5d+5LAJi/Qm9xcOstFht9JxHp9/TjDeteKJyd7AFhuVPKhFX39vcXXd4hssjbuQO4IGxkAD6iPZy1Rg9Yj/g5/IGPAGD58kJ42Q0bwnE8AUDG39mZl5eToyMAiL62Fok2AkD34O7QM26jlIcG14oui6sYEjymrpxeyuUJlaZuqViWnz5Y0x8AQpt7J6V6Hxs+4k4N2chD386f/6EeRseB9lso89oBY6I+3lhVAQYDSHfud5qEkUEWGftj574ii2xWUqJyPTqfKOjg/WlQ5P7v4wJwSguhoJEV7hW1huOHKO1xDQD45aJWWyoAUAPOhBEAgwtAbZ2YhC2haDA/bbkfNvKmxmRobJF5mgEDNL/Q2EPKU72nD7rPPhq5rwf9CIDdageAUK2hod4GAKrj/U8BRiQ/ju8/R/7UJ4Ssbl9HutbpL63uUws2RH/k5bKe1vrKq8td1nsflDsXAES5OXQY9da639SS6uQswAC0ByyTlR6QAQkbEgIBQNbicggY8qCpdRpb3M6dNAguS4rTWC4ZjwVCXIABCitgdZ2RGNBDMAs4bSUAoDre/xRgsCFYvx5hkbkVVjfIv6/L6j61YIMLOs7ysuvttdSRV+vcnqEecycAiFpbFtUbiEpbzpiy6NKsDlhL/pS1ZQuq6TZwkjCYJOtuSVNJpZ8nIQeaf/NmPlKyz9R+b4T++cj46JF+9iM9JK2un5+0uurjkX2T5Qsso5Df/7O6smCj5/a93oI+5eUjKu0JVpLMJK/r18PDZRaWq4i3k0ykcHbLKmcqaoVlCvcQtGjEjyZ6emF1Fre3CpDa6vKZhbHn8wdLueytnqU8n7CTFSllugeMik0WaJd6CrUZDTfmwep/cY3S5M/hmqjP73V9Mj0uKjnA7ZQtFebiRWiVt8x/yrHW6GE1SYf8Hraa2psUa2m0QWRlQ0QWd8FiUrkrL5XK+ytm13iiUog3mzZtQbANsrpL7CfpySCz+G8BXEChYRVAxj1vSsmCDVUBxTfFTq3zpDO+Li5/Q9OFlrg6tdX2MovZCn6MtXM7PS8LAPQ+HQA48IcPeardqFesJtf6HvL2bby97tat9unCCQIAz/ORkWKeBwB3PgafKWxOFVYXCYvjwuqe4NAlnpcIgIhcFkQAAAfOfwwNIwAALR4IkKEpMJp6ZrWj1QUUgx2Yde32G/hIB+VVx6LUVlsCcF2Dyt4MQBzvFQgAKP62pvA2CUBaTZmF/RjLEV+dn7nuVvuo4fQRFQBYoHRH31DKAgdX5EMSb0ZGXIy0uiU+JcLqEoBprvgZgBK/BKDEHxYBAIMEAG16NQDoJYAdO7QCQAKnL043N5+mbpB4qNEZ77CXlFRk5FMJfFOd/OyOxJ/deZ1A99+8Weue5gjALphFLL+yezcB2AhZmy5Y2Wnh9feSCGE1ET8DAM2D3WeHDKFuMGi80R/hl+CjqvgSBsBlc5V0vMpCqigRF4viN7AVXV252B3+S8jaKtdTZoH5q7IIaUUjJnEBhYHWxysA3ty4482Nb2r5+KyMuvw64fQqnBknT2aU7aQe0PX8MqoXaKUsaCvivWvQmiQA7qHQ5t7bkSt5RctWYzcD2MEAwsNDJICvFi7sewf6knRnIltPn8vdxGNYvGkcAPj42OPt9hJfTqpyAws1GRnaImRBXQAQf4mBG7i2snwnaxlp51R1FjnEYRfqgBo69nHO0YD1ngAKNxbiP7S9BFAXV1EhnN7D8KLw5riiirq4lXUHK47VIf6mC63tTU3trU3T78IJilJSpQcAwK5XeLlQAXCg6oMbVYife8DCep8RSqkpACD+e0hL70UPGD5S70/pLXQ6pyhY4BzfYi20uNDgBoD4Bxi4gQyQZnVZPK3OMquXOecIdgQA0vMGuPwbD+yg9RIA4o8T20+tAFvxlV59Te6y0Vh5wWQytLYaTOgBAFCp3KNiEPzxrldUADD8VV06/wUWfw4AZDUVqzoSy2GXHwyZiTGgHwGhLHGoj7Mk0jmUAVS4D54BxcVcr90E5fUfkJTGb36ox4gSDwg9hkthP4RQCDtu3Ic6dYEDF1CYPAHweowBwgqPbVoJyXJXfFCxrCgjDv8Jr4urO51bk1GBLDOUQ+IssxesKKlSqveeH7+iBnAAqo/YTTogsq49rOfB7m23brUOp2UGQNH4DJ1gEVnledP47pKvfLdEqd/9occo8TMAJX4CoFXilwBg+lQA5HoFAIcvviiZWsHXH4q5nVDzk9HqLLNXUaFLJlORqahuz4uQOCDPAkblUYvkx1bTw3oGt3Xi4ivLsoDBnVWeygNc3mYSsoQA4PnyFwDIMCglD8EjXc3/kAQAPbPE4Wx9PW6BF6RDkW1ci2+K+JsngQE9AB2QOwEudGNdRoU6y+zl/ohMmjWyf6uiyfduWEVSnJ0wZLw4UvkMTaebCCuqLOtVFQxKGasQdwSYZdcZPWweSykFFuKwlZxoOBdQXIiGmvUkVxJ5g5TaSivnHs3SqeQ1UZUl7Q1p9Bp3kQWvFicXNvvQfGX7cR8fmqs6oPozOp1KAqgClSyw1AKSnqVA/PbTXj3E7RWnn/81jrcb4loHme7+n/Pz5krWuu3GM5+hVnmOfAICAFVWtzdVE9g05VApHvNTPawnW8fLiYmPeXvofmCNztv2lRxRuG/p1AUXOl6rrDd6WFGyyqsXQ4oXnKe3sRIT2f5YAsY2PV4nNJPUS2nv/a9wQJ3yewPiW2OcP3wDN8LQvIHP3zO+7/kXJ8IvrYGuJBUDgEhqyruaAJSXa0I0eaSjRwGA1otw2DrqOs8HBt6hzb+tSbi4RAdn17jE/UI7UwJw+Po6xLOFjmsroj//fEMmr+eCCovl6lUfeqHu47d2scsG0WA5eSqMj1AovM/QiAB8JXZnnRvBul6u9k4/v9Ccmbzwn8ZIgROwwDPET6sxdeaEa5xOTfiSnHA+//OeWetce0cDVAzl5BwGgNb29lb570L73fZ+AFCqsWg4fgCIYuspLidbVxzwNgggzZOQ0o2AyNpG2JWHKQZgJ6sdycvR3CGdDbYyE6kFABD/+uyEgoFcUBHQEAHVV1XxZyNhcwUAy/r1FP+UiIBZo0zmY+2etcQc//3uzE5T54P1evSokvj4SB/w7I/jAUB4Z3N6ZF8f3/TmJRsYwMILraQLUOvwz8ocHR2ODlSo5V65sg8ANKx0B7IsJGGtLaraXXF+Nir0/r77fPb58wkXM1HAAACUpbZjvQJAfJY00EnLRt8gdPXPIyIuiwoRLqi4mlBQkFI9gQFQUWpDhNNZbwWAXADg+AMD9w8dOmVKaMAsg2FQ+3BYFs/2TL+/EIN4Z8qjgXqjf4kdpoP7kwCgMWkdMGNDI03hOD+11+xhrWWt8uHiwyfbGk+6AdjtjkhhPV3Fx2F0/tnyszixP9cCy8/UshP2y8/Q7Brg9sHeImvLX42JlLADy+E4HrxxZlhY8gSuEGGrjOrnagAg4wMA9RH4lCu+w5lLADpQ+mlxxm8LvFUytKTEcnCWofV5fOVzzAmVlDk7yAneP4/4M79GcSoBcJb4l8SHIH4+Hj8oNoeGLtv8kNojASjWGlnwS5eK16BMM6eidMlhFwBtpK/Bw3qGqqyn2J+SkASAPtM6fz7l62QG4O8RvwQQL95qOGnZDeCyLGaGVeYesL8ayxKANl6Lt125+/DV2CVTZZGzcrHZPDmvbPLm8O/RA4a39+uux+WQF2T6/ZZMxJ/yDbcHPcBGPYDjFwBM2lPL8jafyTCF4/zUXrOHlY7iStXDEDlUAPCNdzgdeHqz8z9Hwzx8SQoAR4/S6/yYo1FsPbUKADipewnZeMvxZcrS7q2LuNY3TMYPAQAUSfHbeDma/1xmtdIYYMYYQE5yYEFKyjdoLwMIC4sHAPzHSQAqKovi8L5w2uT8yrz8uPLiWStN7Su60COnkADg8fkWU2dmZkr/ZwWAoCCMAUEU/7M4np9BE57TrM3avLm8sHnhBkM0ffbX4S4mdoSNXiPiv3b7ypIlt2/rvNjaYnwXFQb99QRAO5QB4Fvio6PZeor4OAury7mYXfMtWeFvD/X6OpNqfbtkXpYLIkTBhX1w30gDA6D9Mfp2d/cTn6kZg7gQoLpaFlQsKH/J9Sj6p1/8Yktq76LFIDAtP39yXn5dXv4zs5DFqFB06Us8jYZn7v/GVRCBW4qrC4aKMQA9wJyzJFqbn2+IXrgkmgHkDqRV8nwE4DDU53DO7dt0C6gLCqZi+tdatHlyGhjN1lPL4vVbAwPvu2aVOyn7dd4h92ReVhREqAsuxk6XqyFplT0LMILXyklQUpiaVJlfWRkXt7g8P6M8I2Na1KyVpTt2vPjiRgjO/MAq3RKopsDd3lNFbuVDWTj/hmYTj3ctzQYCEIFRVzkfirUheRdcAwB1lpXsnyHAFOVyj2w9hdPk9UsPjVM+Oxv/9cdzx49VliF1wcVY1S84eBg9JavMLlyqeOrhw6mpl4qjooqfiSruM+sErLmHYP7++sijvduVYgfa7gX1+XV6Y48TzoF6WOFPDilfxZHUWWB1VlY+Fe12qTe0wCOIQKkE+SaAQcp6E1JvlZRSYaH+AyCPn1sTnxMqmq2SOsurXl5L6vUWnYFb4KXWJ3v39viFBXXWVFpT/EFY0wOiSjg//03Wmd5ZdRcSL9SJdyN4MRK4cuX69bHvtjWyLn4claHNqFCssfN/ACSSlF+MGKC8+fSFjHPbWOJ4Bw/+1VsldXvVy2sXQ+ug2Fgy108DwIHXPr4gfmHhs4fQDegL0g2dPhI20/2ISwA4B52fv5EeQncAwGk0/HReHj/u5qUGrny+oCBWNPhg48GuKK3GcMkKcR2DddI8IfQYIffvA8hfjEDBBklG4A8AHDj0DnTwr656mAApdZZXvcxWe+bM27e3bQujn/J6CoDH/FFkQs1dBnCiklL4izERbebSUmEMTE3HzOIzOQaw42+dnX/bCBGAFjS/heNXADQ27u+6eLHrIABkGOouKVmdsgyhiooMoU/58/ga1vnzNV/j9beUqB94v02JnwDopFxPzOqCCvUyAZi8rQa/d5f9fwAkcg/APXteApgGFWq0hZM9ANx9fkWTJ4CizOQiAWDBYnR8cf1BYHNq4PMAEAgACfsPgkBXVMWlS+gBso6lapJGqKVFI6T+BQpTz6ywuSzeKVVG6tCxtrZsdQPgeLu65C9W8LLyCxEAgFlm2+2IiHsAMOWpAKgHXKAe8AQE3j5BxMrp/NO4tJQBtFOKpp2sJAPYsTwuOTnuRQbwfcWNG5eEMLdc0kkABxMu7t+f0nWzK75nlrdMxpe8SAGgxA8fYVJlhf+nFpkVvUSn6RQAOCtd39WVi3gJQKS4f0R9bxAATAaAewUFADDlqQD+W9y1hkVRRmGyy+6ygrYleMVCM4sQoRvQKiFSBlG56CZiYYigEIgFlcJWhIJ0YUuUCLMbT1mhS4ClaRJPEQRElhbhpRD1qSyhInvq6f6e832zMzta/arebm4zOzvnnW9n3j3fOe9H8f/gev6HH57vpPZyMAbK0pESpAfz/YKA5YuWvb9skdnMBGCq6PO2lpbMz6l19pWhUZdg8h1ljvLHSOCiZUxASxyw/eM9F7Cbn1LHNGWugYHyv3pJgIcDhSRAla5B/zQCZNvdnj2y7U73/lAiYFVJ3/33980jJXkqAsDA84e+aaorq5MEYCaLlBjiVwgw73z//eadZgAEIAV3O6YB9qN4CASQ1t/KMkP82BEE4Mu/5+ieoyDA6pnVzd3G6Ni3r0P8aVqwNA94nJDcetfnWyRuB7Z80rqDvv8MPA+36y1M9W13escIEACVNW9eX9+8vyIghr0Fnq/r/IEdFnq/xP1fwbHjprFqZyYCvHDaYzRXGBkHJAoCArby5qtJa4KAGctAwIzqTR9/vP3j7Xu20whQ69gwAs7UgbPIfGyRRUYxs1LMCzy6tnWTGj8R8CkDnUfyDyc5WOiyxCtmQmTOGxcXd20cm7mdTIALI4DwvHBYGOopjceO9czaggDcA0TBA+4BIGCSsp1mr8YIAgKrqqs/BrbvOWr1lMa5egJ0WWQQAIhqXgAEqE9BQu+3OuilvL7W+FZKOAmHvYuBkwl4rV81WCB4CmNtgncag+XfKyr0bWyiq7kK2MDQdb2dPALUtzPWywznWolWoFcD/fv1Ul6pE1DKjVmkiloGPgMvPTh/qpGOWjsGoPeZUlF9+ypv//pVTspyLe5S3n/paR5YynvfweDt+qzzEAn5CWhkdySGR2NKMD4+1oH/c5WAsv9lO9qSqJZ5k5LbNgukKuerrxUmKrSXzyTQ2moSuJEgiiouIKBfAPBTpWO0IzJS9rAsWNAWPLR0ZQw9VyIisH1UQcnXnJVdSYjg/U/Twcdvl5/fewzejv0ZSlZ2SDmhsLs7t5w+I2yIozwjwwGxjFcZkflh+iz1L7VBtW+jzc3pzM8CwoyGUM7hBcjz5YIKqTSBaWrWWbTxcVZ6IHhgYNMAZ6Vv7ADEk4J9jgUBE1TpiConQzls5WJji2IHStN+8vErCEzzpSqlEVtnVG0dylnZEioQmMf7y7jnzXMTEDjBF/aHAG/n/YHD54us8xDE7WjurLVXuPDDlAjIiUzPyTcY8ImRKSBAZH0PHJAFF4+/jfDwd2wl5c5jw8xB9cSAzVeeL0tleZ8gpYik6yRlQp0KMSkrXb3uq2EXvpv8LmWluWNFEIAqBDcBqnSMTiQCEH7R/D2lu1ItkJZdBWm+aWkj0qq2YjtnZbkKawbvf4TQ39/d3d/Pf/TZFVjg+xID22l/jv6aiyYOP4DECBNQX9HgKMx3VRAB0Q5k9nNiiYCUICaA4p84ejTCp/25zQ21zCCgvHxmJUZAoYEJkOcLLzQMDE5fsRcaLDQ+BA5to8IwImCA4qcn7cePX6cSAG8zI0nj8WJ6fJQqHeMdiZH5dPk3IXyjOf/rkC5fhF9QUFp69jkoNOSsLBdIzOD9ScGcf+gio/GiQ+dfjxcYMV2SAN6O/YGJzcaJQuoSARXfFDkiwztiYjPzw8opNZcSaTBGRpYnwhwT+59/WEijfux/heI4URk+8+aamZWzzTKNPUyebxKZwRURwskLbSqatCj+nTsPCQJ8/Dyn35kAY27nV7VaAiZdDAjT03gUfdLl79rVbcxw5M+mvjykMEePSyutikPpKkvXEtkxzwQA2wzANv6jT0RBYJcggLfT/ofroKK2NSOi4ZOHOEBAaE650VEUkwkC+LGNf5SkJRFwzWiaGm08QbW+xxxZe/dWOvdmhs901EzP1BAgpO9UR74U4sBZbSYm4KNtOz8iIAlLSlGVSgoB/vUDQWb+bSAIGMnnTlL0ivgcXP62Tbu6zZE54bDW+toPI6CrNC6utPQcGgEsXRE/CGDlxe1Tt8Ay8NAtz9KffWBmtpXCv/NO1RFip9G80+hfh+MTAfmFFbGO0AUdMZnhsbPLUzLSMQjQ05kY5J8YGUv7L2scfaB/XOMLtH+8MysWU9tAT0tfX7gkwGgdIaWvvlZZEPAhj4DPQIDOoYIJ2GdsQFkiDDLcBJyvFjzE5+Dmtys7qDwW1ZIgAFJza0HaCIRf+v3XisMD1+IKAoRIsaRmp2/nP/pEzPAkgM3TcAecOFwc35Gf73C5CuubY9rDQQCMkVPgCms04kVkfvhs3v/9/nHj+hE/E1CE+LmYt69vtyQAOWSY1UkCZPyybQ7KkupCP9yG+ImAG2vUyXYyiLyCCfBvaPDXEGA8Xy14iM9v67Tj4u++dPduJiCgYF7p2WdXVZ177tenfT9CODzw58Wx9OQMlq/9ppvsvufSn/EVmAECKEGnOkIMP7TN/9A1fHwiIL+jor4+ph7FuUxAeUo+EwBvcBDA+7//Pp8PEyDiZ4AAPl8iQErfE4cPc8GSBNr4hDK/Wrb9ieOp8YGAffvEF078NmDpeI1a4DC1vjYxJ5YQDuArMCuwC4MItjaY7Kq6lmtz5VOApScr2DE3QcvjP4APPZ9fYpyyljdetMkWFnJ2lghIsVgc+UYjnoL+QeGz9ftP5cd/bCxYIJhk1tn6F7XC+qzzeP32K94ABAEXAyCApOONkwGRtT1rSLxaPQzAP4qwdKk34wvOEn/xKnDUmzBGB9477w4gj7frfX01hg8MvMbfYRZLmHAX4/35DfyOydjbo5pZJn1zvSXUUmEBVb4L6D+f/yMKQKYRvPKSBgeTUKp7gdT0c3XSNSlaZqzjo4upse0DAVFcDHytgmt3rwDqLNQXbekwAaLAwky1x3w8ofRVua/P4iImwwcGNQ198OBBLy2mMlQSnQGLF/vOnD5scyCjTPEpVnZhFjRtdkrbHX8U4JVUUVFfUeF4z2wjWHN9NtZ5SNFop8PBZXzF6dmjID0/ePjh4vLyYsXn4davd0mI/uKh8CWm2Wwz5uN2ki8xS1tRsMDHQy2ytnfzTn3tMLLQhocNAcETpOPEwaHeBz0IQLM5Q5ixzX4iIzVjZUZ2yr0ls8gQvEw6RNCdZm8+vmLjbXZjsGfbnTGdunBEgYa31/6KehdKS9dMkVlfH79JfdousCSnK7ANPviRlgBIz4TmDx7+xlUyq6T+vpkzUeM0EwSkKSil2l2y2AQBNTWoxiSLTZa2ggA+HipRAf65DxABOBN3HpMImGS42cClc+w4sXmoNfVlDwI4cDm7Ezt7UmpMQkRIRMLqEkYZHCJYOmeGH99xfDcISDWkTvHwPU7npplhskADBDhcaE5fY7EycimrmqvxCU5yBoIAZ0YqbEKH5W678VgFcsz7R4/u3MsIy7ZZFaQCtZMFAYsWGY3bXmACRgoCjGaWtg8h06Ma3N3+4Dlau/xRAd6CAJmCIQJsqanW0zUE5GjihxvdsOyYkEC/iLensB98SZl0iNiLG+bx3cczZ4832g1TZPxyBKRsYTM04XiBr0CM0+VyrrmYSwKmjB+6o2CS77qFC5WSl2hnW1tloiUE99yQoIuoDW3WrP19eAYMGwY16uuN2IDsXbtkSQwREGrYtuydDiLgHZNa22tmKawYQsRUiIIFs2cWOMgA3Ky+tuy2W63eY4d4jgCKX5qxPZFhD5oVaX9xeiPiBwGKQ0T4pszdxzcdnz0+WG2rpPoD5fMofiYgz4HLDygjYKhrfqDvsGTFwQEEVGbh8o84e5h950RuQ5vVtx8MjEP8RIA4YEJX6S7hQEG+xKGGmnfeWW5sJgLU2l4LZX0VApo3SkcIszZ+aeCw+D5gJq8Qcesv3t6bdyN9oBCwocKloKmpyTW4KmHx4mGLnVOyED9QdmxvZlvbk20gYNPu3cfDmQAZPxOwfosYfTTbRZ4kXhdQ/z6AEUfCYLz3QGDwsGS+/A8IAootCfh2+gUdIqlMI2B0H+KfQfFTZ6c6AjgLS77Eoc3L33lnUUcz+RKrtb0Wer86AmKE9jfrsrj06j5NQcMvYzdu5OsvQStKuGd3z8g0Bc7CzY/RyASobYAQckPCTdK3mJukqP6A70G4Aymf52W1EZRvsTWXtHM20hUSndEZVrQt4vKPFFJ58jdNfXPm9I07wZnJfaZt8maxU6D5PCKgbhkufkcz+RKTtJUE8PvlPeD55/kxcPfa0++RM/EA2d9ByRnuY8cV4RU2NSo1dcpULQHlhoxYEf4ZggAZ/jyE31g1NV+N/9iQ3aZp5Fs8nCDOn9sBRDl0SBSyxl5jgy/RZnWnQfunwdWcgPRG3NEgKviZkNs8XErJyW8coJo4jh+pWZNH29pVw88jX2I00eBGENRMvsQsRQUB/H4qxmasB2BuFp0jg+dmrefCxk4iAjhLTO5x08JgTD9pWpibAHiRWSIRvyDgSRDA8SN8ip8IcMdfXX0MBJBvscZHGN5iiJ8IyL5wTDYISLUB6n28FtpftrkxC0d98JCy+9e5peR57FEk8SkI0ElN8iVGaVxNjdFcCF9isV0QwNvXqklvgAjIkUOAAQImGW82KlVaIOACOKmOBwMqATnKUwA8yBEgKWACshQdn3kcbYDsW6w5v7UYeQSaqU6lEUBunLUCbxOGfr90A5qtjiqAYuqsu0yVkqjj9YBeatLmGmRlC4NCF7m3hwbR/zmPtq8FtPZm0bpaXsg/88sWNcuJ/81QGFCW01DA8k+iCsD+HrtwOhonqIh9pZgCYpghfIXF1RcNegLu1rVeb0+p2pDkmTcmWenO4QI2BXJIXRYVdUWS5h1508aqWXZAX2sszNDUz1uvgvXzKZf40MwX6R0puCXvVeC009T0uSZGL5aimlrgsbq2NdPARqFSAgp4++juYqdmsawwesRrpbPNs1Y4NcpiycbuLqcLv7OzKqfe8d6XG0UWF4Djg77WGFIaULPU6kQJpm0efXTtqZf4GFD8vkx6RwquRdYsEeI9aRSyppw2JYwHATiQphZ4rK5tDVnV6kt8gbQZcVuxHQEmInBgMyAIuIZqd6Ujg00bPhPgb8/KaiqrbGrLbNkNApAvp/dI5OprjSGllx9oKiiQWV8QgMB/+OabH14ngIBTLfGB0IXXGQjQOVLk0WSvcJTg/b1HjRmT3NWVfDWDCcDxNLXAcqkrV0y3UGKUVv4KS06k4a5IvsFGg82W4pTxny4IQPzI+E1sngil5yZABvhCtr2msrKsrL2sJbNpSWwYCHjpvQx1u77WGAQ0lXVtLaiSWV8i4BCmYcYJBtby8ckugn1ozf5iBHD8TIDekSKPJns1S4SMRU3pxStXagkAnZpaYNGuHjElLcIqCVhY2DCnetjWrajuRUbI2L1ypc3s3Mzxn75ZElDnP3L4yJ3NUHoKAcoVDsKZVFa2tcMvP65lScvUOx5JwdpRe1ezozwmS30CRslaY5WArtTcLrmEBxMw7hmgkVYgen2tCDg1JCRVU5w9wPEzAXpHCnah1SwRMgQP3ITkZDseusBz8V6cNVVrgQUBFYGrdwRWSHO0woVz6ue8m3z2OaVLUZxs6541q9uwsuH4McJxk5l+506sI9P+kcNJKofILyjPWI7CXB0IaI/tmUEE7G8JuyPSkIFs0XEpTVuJAG2tsSAgI7iKs54gAN/9ZwjjBAHpQnnWObOF9BZKEvFLAvSOFAoBSOLheIIAFDFnX6olQK4mp86vm8v37i2HYwET0DBnznx8P7efc24ptmMEVNhsIe4sKxFw/sSLzIdkgYM+CxtKBLS0NM3vw11uMBNfgUhaNkuugLYaI0CNX0rpAy1dUWVx4v0g4NFHrxUj4DUQcKcgIDUqCgSYFQIGZPyt75r0jhRUIHF/ibpECBEA45mNl3KPPAgQq8npCDBmwARItKlRre2cBvpl0Ps4B2zrtmVPkPFJApBTbTbX1TWPBAH6goWhWI+wMhMFUC0tRwaXbAYBuP4Z6nS5rtaYf0scaKqqKsX7FQLoHnBtx2uCAGVPbvNKZwKMRhl+77smvSPFipmo9OD4BQFGIDk7N5mPgQssaoU1tcB6H18QUN9O8QNzh3LACcPUggQmgB4AdTv9rxl+1clLbnh3pq3bvHl+S8sgsGTzbBCwyuJu6zHX6muNJ9MSH+/jAPx+IgC3vh8OH0b8TADf1QFaLg1marcyAQNMQG8rCNA7UqygUieO/1U+Ht+YduzINQv4i1phtRYYBEzx8PFFbW77EqXN7N2rva/tDtEvqWH+uyU3QMDqrErG5vDNRMBe7ZoarfpaY7HEh/r+9fT4B15nEAGA6LYGmACcungMAia9IwXXInMWex4fz6wWTwgChhJyGd6EC7QqDTB5ojVNV5BAVN+od3AANJP0c8NUeTo7r3U8jqsuqaGrNZZaW33/ep37WR5B02amb03TO1LQXis2cIGEPF8mxw0vo4TSO6lRngycm8f6c3mL895Tz2D7IGRuUvQR8i6Tvr46qXoGgAINLomYCgz19qw/GeMMv2l8uPNxxQhZ3/ZmtCkwQ1pbLM+6cQvDKODuHLuccBrjlFL6KkDbR6f3Fc5YzwVaAi7X3WshTRmyE9NUbFxsSHwPwJewweXaHw2dW78SSBPS9Ko6T6l6BrLHqATOEXg6zDvbZseyvAEy6zu2MiElISTFnuh0kt1g1lSeKFXPx6Jvw4MpitYW5Rb9+bO5GytfIX3VeISPsFqwIXyJ9b7C/kgZKVnrzrIyFwhwNyPj7rTMlFecQrGvATrLmpYhY5SV5YLUTGNpSgURNVqpCgJycvCDTVr0gQCbPcAOF6ULpZMUChsnTAAdYoa/CATgt4Z6PhabgWtm+bUgQLPuDlas0J0/CEBgmtXx1HiEj7BnBsq80+slt0cwrW35yB14g7L/fU1N5SBgUd225prmZvzT8QIIWJyBq4/w9zaVHXiBCWgX8Z+tFEQs12QYckHADcgv5CN+SUDqJVi2WcQPAi5IwHjxi9pRVNQCFE2FoUIGtxKuIkxPeiUxalSq36jixYziFZ9tOwQoo+DDZyUBLpdRIQAXViN9RTx3bdnyKKUh7lrrE8J1pAUFUqh54bHEEBO6L92xXsaP3ekNdxIBzc11zXUdy5mANcZVxmJx+V9A3osIcLnjv8SeS1ng5WrbSOhS/ZIYdlsCHtDSIv/C8UUJiVEbEzc6isKZgLAVM+1m+xrCQWBNdN4jAci8+zqJEJTu3qp+PTRSuK4C+dHl/BoE0Fp2Bw4I6QsCEM2WlIwMUPDoQyCACyZm4IRYamsJoCzFS3dgvh1QZpxLvkCWt3lnc0dH3aLlNcsQcF7kquJVuPxNB16QBLTL+M+eYIew4CzwIqVSDwREqPETAUNxBTTl9xfMjSzescNZviM8fMCR4ggHAZhtUOJ/GQQsDh6VGuI7cxURsMZNgHL8IL5gD3f+8ENPA7JMd93Jnz8aNSaHxep44oLiB3IK4gcBomAibdy4UsSvJ+AOEKAvOJisLqbGAa/A+HfSt5/iv4wIcHH8IwKy3W12y/3l+TEBFL+6GpzNMwucixHEX38QMLBsERGAG4wHAaHOmc7a6Rw/E6B9vyRgeWddTc+yh4gAWcDR3y+lr/ARvj09/faHeLuQ3jNQyS1Xm5u28WfCbwI/t+oLDkiaNjMKmwUBaxo6cfk5fiKggeIfRj/OcEtpvhxZ4EWaR23hkJynn0b80qP0uTAmQOMHEO1E/JVU4VS0bFlReNjcL38W+Jjwc+/4jW/nTg/FuuF8fuvmHpSOQwC7zrBP8H03d7bcdwNPtbEZm0b6Ch9h3Ai2KFNxbqXGaX0vvXRFAB7L0REBYt21ukV0xfPqcfkXyfiR9Y12pQ3zTbCiBubQRcOx/+XXLJqjdWgAAc/h+iN+JmC2TY2fgBGgVHjtxlK54WGn8AkOsEepr1es4tEB5AEHo0Wef0ts7O0iQM5Sq6vjgQB1KpK2mw3ysy2M0JPa5k7K8roNKd4hmOZ0lnVqV6ML2+Vn99/ZXDdyotj/suWeDg1UEIG7AB4CjNlmXe1wvJPL3ABRkPFPPsG3riIo3xEQIGcZRZhEgPoUoP312y93t/HJ1eZOMifTFRwAJi2ODr7g8frdd9+/6jLs7y5AMHmC5B+yzO4SB5Jz0gwil0ACkHPCEv/kE6zvslOFsgCXVyAHitU5dFJabscO2iy211kmT4zXFUioApyxoiF4UrCKKVfrs7TwRvFwJt7Rdvqxj4cc26Skvrm0gl0hNrAWlu+9SpGm+uONB7T11nkEFvj4B2jV7T958uPT5k4+7zvluumPZxZQzdSefEVncRHlKRXvhLXMI8WPKHeeFfWpU66+2I2bxuuztDeopjkPA2+dIWt9xSIwsWFsniYW1SA5PFYWSLg/T18wofcN5l+D5JPlqidtkGTq3OXx+ZM7MLkB++7QDp7BMZ3sU5zqB6td5TUIeH29RyelT9QkjfEuCPDw+gIBWEYZi2lLPL5dn6X9vkK7uvqun0St78bg2KL89vZYIgB5e9EoCCFABCRkB4waFSgelWVy9ThVCut9gykfkJ7TiQVPmnqK1tyfZJrfE9ilfj4I2LFxdce+jn3+b/ASG3x+2Zj/svtJn+JRtByesj8IwK+kyFSLgoU+fl1pJcDoRrqTNvanpKutuUBxvXVXdwgYUAjQL2xMxcvrqhcutNqruc3tmFzSIraoKbCqpWg2ETBTNEqyEPLB9Ugd5et2f6tkSyMH4AQc0eK5H1NREWHj43OOL316J9DUfpAIWNJXUqDWOk/uwFjZV7gv1PLGp5IAX7vdzzfAHjJB+BRnj4Kxsbrw8hkPbXvo0ewQBe9CKnaljR5dMoj4B68dfcTgqbUt9fVL2g3Z5yhfKzYsMDaT+dghiyQgrQWPgVBrbkvuu9W9+bLWt6ioottNADu9BUIOEwF2q93X94QEapI4feLOOhs5/u6KCmuMQkBDw/T0+9e0d7b3HLw/2tQQtHB/ybw0WTsMAlZvWr3vDf+gjn1MAElfu1+C1c8vdQJtlxdMXXj5jIefKXxw/c8+Er1QSl1bYex73eC4/bcNjpMEpNTUpIiChvr65x21BssxBXRArK6N+M+/iKRv647OzoUNDXMKl7TX7tmDEeBYwKvLhYe3NLWAAG7MdHG36BgmIISywr7utrloJ8evpt0pfuSpkaN2kfSFUnQ1dC5Ys6aop70FvxVMFqyEg4qVNFkLfB4TsG/fGxQ/pu9J+dl9rX7D7NZRtF1XOwwCHq149MEv8UoABPAIaBwcd+2rg9cyAXyNm2XBQkPnlztiUqBZBIbwCGCLjzp/MxPgKK+GCij0r9/elrO9N56qLlnptBw4MBg+m5e8cFH8IECt5j7BGH7iininev1PT9osa4PxiypGSGsQ0NlQ1g4CsEY6pDKPgMZ5aUoW+rw3Vg+sw7y1nL4XBASEWBP8Un1puz5r7XXWaw8+mNJtVbDQZ8LWNEUJv/pqY3+k+v0X94DumApHtLpiob5NjdvcPr7utsJaavOSBIQTAZktLWeFzz6dZmpcFH8ZF0EtjaCeYVmQgIWTk4o1M4+VWVPNuuODgPbOpibcAfct20cEzJ+zv0TMoigEVK/m+CUByDonJEwYAWfJS2i7LmsNAh5c/60GV/gEY4EkjVsc33SgvbDEHdTXqlvxFFgQPUSF3pzse9z+GVWEgp9AgIj/0ieBcNPp90xfsMDF/cJXEgEbIsoA8l0mxA3qzdN4Ieh3VOmNLG9WT1N7T0/PvmUvEwFL+maUqtIZBLy9eqMIXxKAeO2pVmvCKN6ul9pev6z/9lktAd471BwtcF6e6vIEHkBAyu54TfzxenMyOFMzygWGTOXHP0HU+t56j3ITdF0IoJbX8/N88MiWE0sEb/1C0LfiPJwNrsCypvY3yHHC1FMwSiOVQQAeg7J8AzD9g7TGCPiOcYWCabqCB9XxVqAt3mPR1l9MOkD+aZ2Jz9CW+tL205OAQV43mBPQemmql776haClFI6Pjxbo1e1vMs31qDn4J2ntpZeKVgzkB6y+7tetEr2M7b0vM2B6JrerWdbLTxzBB+qzynqCshT4BfAMvX7JjPjElKypUxMdiZI3xV3CIrPEdDlOkyDmXj1yhMsfFOxou/XYx0mQ3sBUQH98fbxeeql4jq1h/vwGm1153bpDwaZO16ae3pdp4QG4aSvb3W1uFzWW9KHAAQUNgFrQYFINHAmmLMMW+sv4ovimN5htFVjj62HCzcDp8UYkiOm2K+6Cs3k1OpRVKlnhvPe43oHTvlSQ8X7UykPyNWFpkpDexe4CjgqrrbvCUIG/u7u7K1z6eEWBREKC6sBgt7UvXDjfliBf66XpyzcXw4UX5dlyu2JudrgR1lq37R+k6WwOXRY0cIpN9SF+NWuLdCDBrDD8xqZYUHpbwfe8dEJkfEa6IyMyIzIofDM1SIAAIRttstY3773pq5TjkTna+4unf6M5/lLZZrfaXcBRERGD6CNKbLaIwLLGTindu7oUKcxS0Wq1qw4MCWBgznxriHgNy1as2vQmgMLNuI4hgoDp0y9Us8Bk7tXYuB/3wMHGfhCgncpae5pYKFlK3XlHs7YYHzM+Zn5sPY3LWeZCEFCyEi1jW7bwyh5vtX6ptAF+DFSblMXYbObuzs5uKwhYtQrF2qNJqpOP8WlEsOpzvEFI7417Kzcvwn0QBEBDlJQsdux9zzXuSFl3EMULFMxQpDCEiJ/Nb1jACOswxYEhwTZ/DjHAr/F+Q4qM/+mON0EA1ieFR+aFQkoyAbj8TXPQlHek8dAHTMBTMn5MZgqhk91gtIv9s7Y8Rlj/li8oP8dvndkaE2M1SpdReIzqsr6FICCCYMzo6Ww6UiEIOHzg8OETh6+l2uM8nqVIxwDiLHJSFknv4tq9mzfvq2letjnMaQx1BZY4sVNZo6sisZDPZ96M0aPj4s5mKQxlZLdhPCOppUhFMICCgCXWEHptaG7GIBDxPx3XEX36zewRugBnL9vi6PL34RnY19j45utrP3n4ecKbEpdCGAHGhiVGaoDfjnsALr/lQf8P+L6UXm+hiSCcvkShrna4cKkwWcFPIXNPj9koCDgwsbFxeP+1JJ3xGvEXrzlYnIEs2ZqkY85KVHdnEQF1ze+AgIxIgyHCFpy7uqy5OAMEsI0vjZcROH8mAPEGQCj5ZZ/rlooh1iW33bbEGoXXMRUx3Rkcf08cLWV98kLJB+jyX4fLX0fT16d5ZpVp/UASxsaL68XqcTwCHnzrg5eZQb/qG1J4+Ct4K10bv4YAY4WrtrY+NHSFGAEnTvQfuZZylnjN8R8EA5QjjHZL6X3LQMDs4sgUw7JAIqAx0uEPAvj8S5EWl1KYpKEd9Xw0Ia9KRTDwwAMLU6PO9jZ0d3P4lOmJewME6KTkVa6SPmigvsbDb74mCFDjJwIGXU3AEQX70Umi+qQGpba/fLNqsksE97KUdsO0IUa47GCuqbbWbAmlgFHwcWI4jk6lt71uvwdRshOfpfyU6Ozra9rMXWaNByqaWppccUGQ0uL8x20dgaSxJIDiDaH4tVIxxLrwgQfmpIZ466WpXkp+4VooLj8qWCQBavyvjtvwjOfrL/yy/ahVW3yDfAKqM/j+z4Crr6VQ5yvMBAQCZloMGgFQVrgEXYX9OBoRoD8fECB/SvUAggBzs6UszlVcaGYCeK0KavbD/kzAqaUixsB1ty1J9e5Vbsp7qvYgw3GStCQp3NdY8vzrDBCgPvUIG3y6BLYKeAepbFrS/f27XlZshm9gRF/h6SsMAuRTgN7DBOArII7feKqCjHihH+QwYAL487qRpmMC9FL4r6Virgmo7WVAYP7Ue0ppif+1/4sTH7izrm5jsA0C+v2nELhEpJrhr1teTilEUCCOcvRortxpxYqkJOXopyrI0LflWdxrTwicJIUf2GCaq5WGSTC4nzZtndvyIgzgo2G7B2SNw1VXjQw9R/N+/epzQZM1OWZgnhszGJfq8MckTbGtbdIfXv82TD0xAzs00jDJiaxncIIsY1s3Nyy/PMgRCTsouR0ODVF+qpPt2P66ukOWBPX9l9cp6CkoaEk7z2io+YaADlfCVaNHqEBKqErGHa4QkD3l92xeZZWqAX+fku31b8M0vy8QpbCKFGYCVq97e906tvYhAiLb2spRmy+2gwBEfoni4njJ2MGYi5ZftDNhgnw/CLhIunuPXJ6WVjMZN9FOrRSeN8LdIgkwAUVFOQtynAvuKSrCC4Ph1z9+tRm6ugw2/MFg8Pq3QVnVsq+q3VlSImAdCEhel2tMTU5uRYNCZnkbehPk9pBsuwLy6LzQ1BlxzfKROy3yfweDAMR/jSwrWT7ZuDLBMCBvgj/9tHU8CKDoq6q8CRczAU6MAAyBBQvwgi/879lRUfRvw39BgCuwqa9MWeh4jkkSkJycm1yLv0BAZmI59WZI6asvUKC8PFWLi6zGyCtAgDR3H3PObQ+keUfFzAqJql5XnZzMbnCt80Yg/LRzq6puSsPEEAgQGOjJFH8wEH4dExx8MS7/f0JA55KyOftlv8WGsj3JYi2L5GRj7eNvm0FAW2Ybxf+LlL46qUq+vX2B15xPFilw9Zl43uV1irm9IMAeMmuW3Sj5hRIUBFS99VZV2lg3AZkopJQMSJ/jm25KMPxHBPS0NO0vk+eHE5wWLK29UpPffhwjQC999W1uuIeU1cD1REwlnT8ZBMjhf+W5D4AAc8isAnM1H5L79ogA79KqHxdV/aQSgPjBQLgkgG8D+Ps/ImAJrv+c990LKU9bLU82udZci2puvfRtL9Sux19/namzERUFO/3FdGBklljiYqRKAHyWv8Is4k8//cQNGCDAG6iqajmGphVJQHgPCBhQRkAqf/v/s3vAEjV+QQDHT0DG7vFWvdTEkFduGDxiBiOoXWLxGqVgQV3i4qZzHzCVggBzzziNFJ43huMvrfqpCk07IICR2TMwHwNAfQoA/9VToM+15HzNQspz8fgHkiUNraeQvu48MGDqp6fgYnfFQrS6xMWFY667rdTbaK45wBBGF5fNGKN1uU0GAYz5bh1wCS484T/TAUdNk7ULKSuFvK0SJ0lfHS677MzyFZrV1NQlLi6Aj9dYb3+T55IXM9CxogAcV/3vSvC/Bj1utPD6n/EnnaQbrf6BCX0AAAAASUVORK5CYII=)}.react-tel-input .ad{background-position:-16px 0}.react-tel-input .ae{background-position:-32px 0}.react-tel-input .af{background-position:-48px 0}.react-tel-input .ag{background-position:-64px 0}.react-tel-input .ai{background-position:-80px 0}.react-tel-input .al{background-position:-96px 0}.react-tel-input .am{background-position:-112px 0}.react-tel-input .ao{background-position:-128px 0}.react-tel-input .ar{background-position:-144px 0}.react-tel-input .as{background-position:-160px 0}.react-tel-input .at{background-position:-176px 0}.react-tel-input .au{background-position:-192px 0}.react-tel-input .aw{background-position:-208px 0}.react-tel-input .az{background-position:-224px 0}.react-tel-input .ba{background-position:-240px 0}.react-tel-input .bb{background-position:0 -11px}.react-tel-input .bd{background-position:-16px -11px}.react-tel-input .be{background-position:-32px -11px}.react-tel-input .bf{background-position:-48px -11px}.react-tel-input .bg{background-position:-64px -11px}.react-tel-input .bh{background-position:-80px -11px}.react-tel-input .bi{background-position:-96px -11px}.react-tel-input .bj{background-position:-112px -11px}.react-tel-input .bm{background-position:-128px -11px}.react-tel-input .bn{background-position:-144px -11px}.react-tel-input .bo{background-position:-160px -11px}.react-tel-input .br{background-position:-176px -11px}.react-tel-input .bs{background-position:-192px -11px}.react-tel-input .bt{background-position:-208px -11px}.react-tel-input .bw{background-position:-224px -11px}.react-tel-input .by{background-position:-240px -11px}.react-tel-input .bz{background-position:0 -22px}.react-tel-input .ca{background-position:-16px -22px}.react-tel-input .cd{background-position:-32px -22px}.react-tel-input .cf{background-position:-48px -22px}.react-tel-input .cg{background-position:-64px -22px}.react-tel-input .ch{background-position:-80px -22px}.react-tel-input .ci{background-position:-96px -22px}.react-tel-input .ck{background-position:-112px -22px}.react-tel-input .cl{background-position:-128px -22px}.react-tel-input .cm{background-position:-144px -22px}.react-tel-input .cn{background-position:-160px -22px}.react-tel-input .co{background-position:-176px -22px}.react-tel-input .cr{background-position:-192px -22px}.react-tel-input .cu{background-position:-208px -22px}.react-tel-input .cv{background-position:-224px -22px}.react-tel-input .cw{background-position:-240px -22px}.react-tel-input .cy{background-position:0 -33px}.react-tel-input .cz{background-position:-16px -33px}.react-tel-input .de{background-position:-32px -33px}.react-tel-input .dj{background-position:-48px -33px}.react-tel-input .dk{background-position:-64px -33px}.react-tel-input .dm{background-position:-80px -33px}.react-tel-input .do{background-position:-96px -33px}.react-tel-input .dz{background-position:-112px -33px}.react-tel-input .ec{background-position:-128px -33px}.react-tel-input .ee{background-position:-144px -33px}.react-tel-input .eg{background-position:-160px -33px}.react-tel-input .er{background-position:-176px -33px}.react-tel-input .es{background-position:-192px -33px}.react-tel-input .et{background-position:-208px -33px}.react-tel-input .fi{background-position:-224px -33px}.react-tel-input .fj{background-position:-240px -33px}.react-tel-input .fk{background-position:0 -44px}.react-tel-input .fm{background-position:-16px -44px}.react-tel-input .fo{background-position:-32px -44px}.react-tel-input .fr,.react-tel-input .bl,.react-tel-input .mf{background-position:-48px -44px}.react-tel-input .ga{background-position:-64px -44px}.react-tel-input .gb{background-position:-80px -44px}.react-tel-input .gd{background-position:-96px -44px}.react-tel-input .ge{background-position:-112px -44px}.react-tel-input .gf{background-position:-128px -44px}.react-tel-input .gh{background-position:-144px -44px}.react-tel-input .gi{background-position:-160px -44px}.react-tel-input .gl{background-position:-176px -44px}.react-tel-input .gm{background-position:-192px -44px}.react-tel-input .gn{background-position:-208px -44px}.react-tel-input .gp{background-position:-224px -44px}.react-tel-input .gq{background-position:-240px -44px}.react-tel-input .gr{background-position:0 -55px}.react-tel-input .gt{background-position:-16px -55px}.react-tel-input .gu{background-position:-32px -55px}.react-tel-input .gw{background-position:-48px -55px}.react-tel-input .gy{background-position:-64px -55px}.react-tel-input .hk{background-position:-80px -55px}.react-tel-input .hn{background-position:-96px -55px}.react-tel-input .hr{background-position:-112px -55px}.react-tel-input .ht{background-position:-128px -55px}.react-tel-input .hu{background-position:-144px -55px}.react-tel-input .id{background-position:-160px -55px}.react-tel-input .ie{background-position:-176px -55px}.react-tel-input .il{background-position:-192px -55px}.react-tel-input .in{background-position:-208px -55px}.react-tel-input .io{background-position:-224px -55px}.react-tel-input .iq{background-position:-240px -55px}.react-tel-input .ir{background-position:0 -66px}.react-tel-input .is{background-position:-16px -66px}.react-tel-input .it{background-position:-32px -66px}.react-tel-input .je{background-position:-144px -154px}.react-tel-input .jm{background-position:-48px -66px}.react-tel-input .jo{background-position:-64px -66px}.react-tel-input .jp{background-position:-80px -66px}.react-tel-input .ke{background-position:-96px -66px}.react-tel-input .kg{background-position:-112px -66px}.react-tel-input .kh{background-position:-128px -66px}.react-tel-input .ki{background-position:-144px -66px}.react-tel-input .xk{background-position:-128px -154px}.react-tel-input .km{background-position:-160px -66px}.react-tel-input .kn{background-position:-176px -66px}.react-tel-input .kp{background-position:-192px -66px}.react-tel-input .kr{background-position:-208px -66px}.react-tel-input .kw{background-position:-224px -66px}.react-tel-input .ky{background-position:-240px -66px}.react-tel-input .kz{background-position:0 -77px}.react-tel-input .la{background-position:-16px -77px}.react-tel-input .lb{background-position:-32px -77px}.react-tel-input .lc{background-position:-48px -77px}.react-tel-input .li{background-position:-64px -77px}.react-tel-input .lk{background-position:-80px -77px}.react-tel-input .lr{background-position:-96px -77px}.react-tel-input .ls{background-position:-112px -77px}.react-tel-input .lt{background-position:-128px -77px}.react-tel-input .lu{background-position:-144px -77px}.react-tel-input .lv{background-position:-160px -77px}.react-tel-input .ly{background-position:-176px -77px}.react-tel-input .ma{background-position:-192px -77px}.react-tel-input .mc{background-position:-208px -77px}.react-tel-input .md{background-position:-224px -77px}.react-tel-input .me{background-position:-112px -154px;height:12px}.react-tel-input .mg{background-position:0 -88px}.react-tel-input .mh{background-position:-16px -88px}.react-tel-input .mk{background-position:-32px -88px}.react-tel-input .ml{background-position:-48px -88px}.react-tel-input .mm{background-position:-64px -88px}.react-tel-input .mn{background-position:-80px -88px}.react-tel-input .mo{background-position:-96px -88px}.react-tel-input .mp{background-position:-112px -88px}.react-tel-input .mq{background-position:-128px -88px}.react-tel-input .mr{background-position:-144px -88px}.react-tel-input .ms{background-position:-160px -88px}.react-tel-input .mt{background-position:-176px -88px}.react-tel-input .mu{background-position:-192px -88px}.react-tel-input .mv{background-position:-208px -88px}.react-tel-input .mw{background-position:-224px -88px}.react-tel-input .mx{background-position:-240px -88px}.react-tel-input .my{background-position:0 -99px}.react-tel-input .mz{background-position:-16px -99px}.react-tel-input .na{background-position:-32px -99px}.react-tel-input .nc{background-position:-48px -99px}.react-tel-input .ne{background-position:-64px -99px}.react-tel-input .nf{background-position:-80px -99px}.react-tel-input .ng{background-position:-96px -99px}.react-tel-input .ni{background-position:-112px -99px}.react-tel-input .nl,.react-tel-input .bq{background-position:-128px -99px}.react-tel-input .no{background-position:-144px -99px}.react-tel-input .np{background-position:-160px -99px}.react-tel-input .nr{background-position:-176px -99px}.react-tel-input .nu{background-position:-192px -99px}.react-tel-input .nz{background-position:-208px -99px}.react-tel-input .om{background-position:-224px -99px}.react-tel-input .pa{background-position:-240px -99px}.react-tel-input .pe{background-position:0 -110px}.react-tel-input .pf{background-position:-16px -110px}.react-tel-input .pg{background-position:-32px -110px}.react-tel-input .ph{background-position:-48px -110px}.react-tel-input .pk{background-position:-64px -110px}.react-tel-input .pl{background-position:-80px -110px}.react-tel-input .pm{background-position:-96px -110px}.react-tel-input .pr{background-position:-112px -110px}.react-tel-input .ps{background-position:-128px -110px}.react-tel-input .pt{background-position:-144px -110px}.react-tel-input .pw{background-position:-160px -110px}.react-tel-input .py{background-position:-176px -110px}.react-tel-input .qa{background-position:-192px -110px}.react-tel-input .re{background-position:-208px -110px}.react-tel-input .ro{background-position:-224px -110px}.react-tel-input .rs{background-position:-240px -110px}.react-tel-input .ru{background-position:0 -121px}.react-tel-input .rw{background-position:-16px -121px}.react-tel-input .sa{background-position:-32px -121px}.react-tel-input .sb{background-position:-48px -121px}.react-tel-input .sc{background-position:-64px -121px}.react-tel-input .sd{background-position:-80px -121px}.react-tel-input .se{background-position:-96px -121px}.react-tel-input .sg{background-position:-112px -121px}.react-tel-input .sh{background-position:-128px -121px}.react-tel-input .si{background-position:-144px -121px}.react-tel-input .sk{background-position:-160px -121px}.react-tel-input .sl{background-position:-176px -121px}.react-tel-input .sm{background-position:-192px -121px}.react-tel-input .sn{background-position:-208px -121px}.react-tel-input .so{background-position:-224px -121px}.react-tel-input .sr{background-position:-240px -121px}.react-tel-input .ss{background-position:0 -132px}.react-tel-input .st{background-position:-16px -132px}.react-tel-input .sv{background-position:-32px -132px}.react-tel-input .sx{background-position:-48px -132px}.react-tel-input .sy{background-position:-64px -132px}.react-tel-input .sz{background-position:-80px -132px}.react-tel-input .tc{background-position:-96px -132px}.react-tel-input .td{background-position:-112px -132px}.react-tel-input .tg{background-position:-128px -132px}.react-tel-input .th{background-position:-144px -132px}.react-tel-input .tj{background-position:-160px -132px}.react-tel-input .tk{background-position:-176px -132px}.react-tel-input .tl{background-position:-192px -132px}.react-tel-input .tm{background-position:-208px -132px}.react-tel-input .tn{background-position:-224px -132px}.react-tel-input .to{background-position:-240px -132px}.react-tel-input .tr{background-position:0 -143px}.react-tel-input .tt{background-position:-16px -143px}.react-tel-input .tv{background-position:-32px -143px}.react-tel-input .tw{background-position:-48px -143px}.react-tel-input .tz{background-position:-64px -143px}.react-tel-input .ua{background-position:-80px -143px}.react-tel-input .ug{background-position:-96px -143px}.react-tel-input .us{background-position:-112px -143px}.react-tel-input .uy{background-position:-128px -143px}.react-tel-input .uz{background-position:-144px -143px}.react-tel-input .va{background-position:-160px -143px}.react-tel-input .vc{background-position:-176px -143px}.react-tel-input .ve{background-position:-192px -143px}.react-tel-input .vg{background-position:-208px -143px}.react-tel-input .vi{background-position:-224px -143px}.react-tel-input .vn{background-position:-240px -143px}.react-tel-input .vu{background-position:0 -154px}.react-tel-input .wf{background-position:-16px -154px}.react-tel-input .ws{background-position:-32px -154px}.react-tel-input .ye{background-position:-48px -154px}.react-tel-input .za{background-position:-64px -154px}.react-tel-input .zm{background-position:-80px -154px}.react-tel-input .zw{background-position:-96px -154px}.react-tel-input *{box-sizing:border-box;-moz-box-sizing:border-box}.react-tel-input .hide{display:none}.react-tel-input .v-hide{visibility:hidden}.react-tel-input .form-control{position:relative;font-size:14px;letter-spacing:.01rem;margin-top:0 !important;margin-bottom:0 !important;padding-left:48px;margin-left:0;background:#FFFFFF;border:1px solid #CACACA;border-radius:5px;line-height:25px;height:35px;width:300px;outline:none}.react-tel-input .form-control.invalid-number{border:1px solid #d79f9f;background-color:#FAF0F0;border-left-color:#cacaca}.react-tel-input .form-control.invalid-number:focus{border:1px solid #d79f9f;border-left-color:#cacaca;background-color:#FAF0F0}.react-tel-input .flag-dropdown{position:absolute;top:0;bottom:0;padding:0;background-color:#f5f5f5;border:1px solid #cacaca;border-radius:3px 0 0 3px}.react-tel-input .flag-dropdown:hover,.react-tel-input .flag-dropdown:focus{cursor:pointer}.react-tel-input .flag-dropdown.invalid-number{border-color:#d79f9f}.react-tel-input .flag-dropdown.open{z-index:2;background:#fff;border-radius:3px 0 0 0}.react-tel-input .flag-dropdown.open .selected-flag{background:#fff;border-radius:3px 0 0 0}.react-tel-input input[disabled]+.flag-dropdown:hover{cursor:default}.react-tel-input input[disabled]+.flag-dropdown:hover .selected-flag{background-color:transparent}.react-tel-input .selected-flag{outline:none;position:relative;width:38px;height:100%;padding:0 0 0 8px;border-radius:3px 0 0 3px}.react-tel-input .selected-flag:hover,.react-tel-input .selected-flag:focus{background-color:#fff}.react-tel-input .selected-flag .flag{position:absolute;top:50%;margin-top:-5px}.react-tel-input .selected-flag .arrow{position:relative;top:50%;margin-top:-2px;left:20px;width:0;height:0;border-left:3px solid transparent;border-right:3px solid transparent;border-top:4px solid #555}.react-tel-input .selected-flag .arrow.up{border-top:none;border-bottom:4px solid #555}.react-tel-input .country-list{outline:none;z-index:1;list-style:none;position:absolute;padding:0;margin:10px 0 10px -1px;box-shadow:1px 2px 10px rgba(0,0,0,0.35);background-color:white;width:300px;max-height:200px;overflow-y:scroll;border-radius:0 0 3px 3px}.react-tel-input .country-list .flag{display:inline-block}.react-tel-input .country-list .divider{padding-bottom:5px;margin-bottom:5px;border-bottom:1px solid #ccc}.react-tel-input .country-list .country{padding:7px 9px}.react-tel-input .country-list .country .dial-code{color:#6b6b6b}.react-tel-input .country-list .country:hover{background-color:#f1f1f1}.react-tel-input .country-list .country.highlight{background-color:#f1f1f1}.react-tel-input .country-list .flag{margin-right:7px;margin-top:2px}.react-tel-input .country-list .country-name{margin-right:6px}.react-tel-input .country-list .search{position:-webkit-sticky;position:sticky;top:0;background-color:#fff;padding:10px 0 6px 10px}.react-tel-input .country-list .search-emoji{font-size:15px}.react-tel-input .country-list .search-box{border:1px solid #cacaca;border-radius:3px;font-size:15px;line-height:15px;margin-left:6px;padding:3px 8px 5px;outline:none}.react-tel-input .country-list .no-entries-message{padding:7px 10px 11px;opacity:.7}.react-tel-input .invalid-number-message{position:absolute;z-index:1;font-size:13px;left:46px;top:-8px;background:#fff;padding:0 2px;color:#de0000}.react-tel-input .special-label{display:none;position:absolute;z-index:1;font-size:13px;left:46px;top:-8px;background:#fff;padding:0 2px;white-space:nowrap}
/* =========================
   SELECT "CUSTOM" (sans JSX)
   ========================= */

/* Gabarit unifié */
.add-AjoutAppartementPopup-form-group select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 100%;
  height: 45px;
  min-height: 45px;
  border-radius: 8px;
  border: 1px solid #d1d5db;
  background: #fff;
  color: #111827;
  font-size: 14px;
  line-height: 1.2;
  padding: 10px 40px 10px 12px; /* place pour la flèche */
  box-sizing: border-box;
  transition: border-color .2s, box-shadow .2s, background-color .2s;
  cursor: pointer;
  background-image: url("data:image/svg+xml;utf8,<svg fill=%27none%27 stroke=%27%236b7280%27 stroke-width=%272%27 viewBox=%270 0 24 24%27 xmlns=%27http://www.w3.org/2000/svg%27><path stroke-linecap=%27round%27 stroke-linejoin=%27round%27 d=%27M19 9l-7 7-7-7%27/></svg>");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px 16px;
}

/* Hover / Focus */
.add-AjoutAppartementPopup-form-group select:hover { border-color: #bfc5cf; }
.add-AjoutAppartementPopup-form-group select:focus {
  outline: none;
  border-color: #0C447E;
  box-shadow: 0 0 0 4px rgba(12, 68, 126, 0.12);
}

/* Placeholder & état disabled */
.add-AjoutAppartementPopup-form-group select option[value=""],
.add-AjoutAppartementPopup-form-group select option:disabled { color: #9ca3af; }
.add-AjoutAppartementPopup-form-group select:disabled {
  background-color: #f9fafb;
  color: #9ca3af;
  cursor: not-allowed;
}

/* Harmonisation des <option> (moteurs compatibles) */
@supports selector(option:checked) {
  .add-AjoutAppartementPopup-form-group select option {
    font-size: 14px;
    line-height: 1.4;
    padding: 10px 12px;
    background: #fff;
    color: #111827;
  }
}

/* Ajustements legacy / Firefox */
.add-AjoutAppartementPopup-form-group select::-ms-expand { display: none; }
@supports (-moz-appearance:none) {
  .add-AjoutAppartementPopup-form-group select { text-indent: 0.01px; text-overflow: ''; }
}

/* Alignement visuel proche “Ville/Quartier” */
.add-AjoutAppartementPopup-form-group label + select {
  box-shadow: 0 1px 0 rgba(0,0,0,.01);
}

/* Variante d’erreur (optionnelle) */
.add-AjoutAppartementPopup-form-group select.add-AjoutAppartementPopup-invalid,
.add-AjoutAppartementPopup-form-group select.add-AjoutAppartementPopup-invalid:focus {
  border-color: #ef4444 !important;
  box-shadow: 0 0 0 4px rgba(239,68,68,.15) !important;
}


/* =========================
   Styles généraux / Popup
   ========================= */

.add-AjoutAppartementPopup-app {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #f5f5f5;
  padding: 20px;
}

.add-AjoutAppartementPopup-open-popup-btn {
  background-color: #1a56db;
  color: white;
  border: none;
  padding: 12px 24px;
  border-radius: 8px;
  font-size: 16px;
  cursor: pointer;
  transition: background-color 0.2s;
}
.add-AjoutAppartementPopup-open-popup-btn:hover { background-color: #1e429f; }

.add-AjoutAppartementPopup-overlay {
  position: fixed;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  padding: 20px;
}

.add-AjoutAppartementPopup-container {
  background: white;
  border-radius: 12px;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
  width: 100%;
  max-width: 800px;
  max-height: 90vh;
  overflow-y: auto;
  position: relative;
  overflow-x: hidden; /* éviter le scroll horizontal */
}

.add-AjoutAppartementPopup-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 24px 32px;
  border-bottom: 1px solid #e5e7eb;
}
.add-AjoutAppartementPopup-header h2 {
  font-size: 24px;
  font-weight: 600;
  color: #0C447E;
  margin: 0;
}
.add-AjoutAppartementPopup-text-red { color: #ef4444; }

.add-AjoutAppartementPopup-close-btn {
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  border-radius: 6px;
  transition: background-color 0.2s;
  color: #6b7280;
}
.add-AjoutAppartementPopup-close-btn:hover { background-color: #f3f4f6; color: #374151; }

.add-AjoutAppartementPopup-content {
  padding: 32px;
  width: auto;
  max-width: 100%;
}

.add-AjoutAppartementPopup-required { color: red; }

.add-AjoutAppartementPopup-step-content {
  min-height: 400px;
  width: 100%;
}

.add-AjoutAppartementPopup-form-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 24px;
  gap: 24px;
  width: 100%;
  max-width: 100%;
  align-items: start;
}

.add-AjoutAppartementPopup-form-group {
  display: flex;
  flex-direction: column;
  min-width: 0;
  width: 100%;
}
.add-AjoutAppartementPopup-full-width { grid-column: 1 / -1; }

.add-AjoutAppartementPopup-form-group label {
  font-weight: 500;
  color: #374151;
  margin-bottom: 8px;
  font-size: 14px;
}

.add-AjoutAppartementPopup-form-group input,
.add-AjoutAppartementPopup-form-group textarea {
  padding: 12px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font-size: 14px;
  transition: border-color 0.2s, box-shadow 0.2s;
  background-color: white;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.add-AjoutAppartementPopup-form-group input:focus,
.add-AjoutAppartementPopup-form-group textarea:focus {
  outline: none;
  border-color: #1a56db;
  box-shadow: 0 0 0 3px rgba(26, 86, 219, 0.1);
}
.add-AjoutAppartementPopup-form-group input::placeholder,
.add-AjoutAppartementPopup-form-group textarea::placeholder { color: #9ca3af; }


/* =========================
   Options / Listes / Tags
   ========================= */

.add-AjoutAppartementPopup-options-container { display: flex; flex-direction: column; gap: 16px; }

.add-AjoutAppartementPopup-amenities-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 12px;
  gap: 12px;
  padding: 12px;
  border-radius: 8px;
}



.add-AjoutAppartementPopup-options-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 8px;
  gap: 8px;
  margin-top: 8px;
}

.add-AjoutAppartementPopup-option-item {
  display: flex; align-items: center; gap: 6px;
  background-color: #f3f4f6; padding: 4px 8px; border-radius: 4px; font-size: 14px;
}
.add-AjoutAppartementPopup-option-item span { color: #374151; }

.add-AjoutAppartementPopup-remove-option {
  display: flex; align-items: center; justify-content: center;
  background: none; border: none; padding: 2px; cursor: pointer; color: #6b7280; border-radius: 50%; transition: all 0.2s;
}
.add-AjoutAppartementPopup-remove-option:hover { background-color: #e5e7eb; color: #ef4444; }

.add-AjoutAppartementPopup-add-option-container { position: relative; width: 32px; }

.add-AjoutAppartementPopup-add-option-btn {
  width: 32px; height: 32px; border-radius: 50%;
  background-color: #0C447E; color: white; border: none;
  display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background-color 0.2s;
}
.add-AjoutAppartementPopup-add-option-btn:hover { background-color: #1e429f; }

.add-AjoutAppartementPopup-add-option-input {
  display: flex; align-items: center; gap: 8px;
  position: absolute; top: 0; left: 0; background: white; padding: 8px; border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); z-index: 1001; width: 200px;
}
.add-AjoutAppartementPopup-add-option-input input {
  flex: 1 1; padding: 6px 8px; border: 1px solid #d1d5db; border-radius: 6px; font-size: 14px; min-width: 0; width: 120px;
}
.add-AjoutAppartementPopup-confirm-add-option {
  width: 32px; height: 32px; border-radius: 50%;
  background-color: #10b981; color: white; border: none;
  display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background-color 0.2s;
}
.add-AjoutAppartementPopup-confirm-add-option:hover { background-color: #059669; }


/* =========================
   Téléphone
   ========================= */

.add-AjoutAppartementPopup-phone-input { display: flex; gap: 8px; }
.add-AjoutAppartementPopup-country-code { min-width: 100px; flex-shrink: 0; }
.react-tel-input .flag-dropdown { border-radius: 8px 0 0 8px; }
.react-tel-input .selected-flag { padding-left: 28px !important; }
.react-tel-input .selected-flag .flag { left: 6px; }
.react-tel-input .form-control { padding-left: 50px !important; }


/* =========================
   Langues
   ========================= */

.add-AjoutAppartementPopup-languages-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 12px;
  gap: 12px;
  margin-top: 8px;
}


/* =========================
   Images
   ========================= */

.add-AjoutAppartementPopup-images-section { margin-bottom: 32px; }

.add-AjoutAppartementPopup-image-upload {
  display: flex; align-items: center; gap: 12px; margin-bottom: 16px;
}

.add-AjoutAppartementPopup-upload-btn {
  background-color: #f3f4f6; border: 1px solid #d1d5db; padding: 8px 16px; border-radius: 6px; font-size: 14px; cursor: pointer; transition: background-color 0.2s;
}
.add-AjoutAppartementPopup-upload-btn:hover { background-color: #e5e7eb; }
.add-AjoutAppartementPopup-upload-btn:disabled { opacity: 0.6; cursor: not-allowed; }

.add-AjoutAppartementPopup-image-upload span { color: #6b7280; font-size: 14px; }

.add-AjoutAppartementPopup-image-preview-container { position: relative; display: inline-block; margin-top: 10px; transition: all 0.3s ease; cursor: move; }
.add-AjoutAppartementPopup-image-preview-container:hover { transform: scale(1.02); }

.add-AjoutAppartementPopup-image-preview {
  width: 120px; height: 120px; border: 2px dashed #d1d5db; border-radius: 8px; overflow: hidden; display: flex; align-items: center; justify-content: center; position: relative;
}
.add-AjoutAppartementPopup-image-preview img { width: 100%; height: 100%; object-fit: cover; }

.add-AjoutAppartementPopup-image-controls {
  position: absolute; top: 4px; left: 4px; right: 4px; display: flex; justify-content: space-between; align-items: flex-start; opacity: 0; transition: opacity 0.3s ease;
}
.add-AjoutAppartementPopup-image-preview-container:hover .add-AjoutAppartementPopup-image-controls { opacity: 1; }

.add-AjoutAppartementPopup-move-btn {
  background-color: rgba(59, 130, 246, 0.9); border: none; width: 24px; height: 24px; border-radius: 4px;
  display: flex; align-items: center; justify-content: center; color: white; cursor: pointer; transition: background-color 0.2s; font-size: 12px; font-weight: bold;
}
.add-AjoutAppartementPopup-move-btn:hover:not(:disabled) { background-color: rgba(37, 99, 235, 0.9); }
.add-AjoutAppartementPopup-move-btn:disabled { background-color: rgba(156, 163, 175, 0.7); cursor: not-allowed; }

.add-AjoutAppartementPopup-remove-image-btn {
  position: absolute; top: 4px; right: 4px; background-color: rgba(239, 68, 68, 0.9); border: none; width: 24px; height: 24px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; color: white; cursor: pointer; transition: background-color 0.2s; opacity: 0;
}
.add-AjoutAppartementPopup-image-preview-container:hover .add-AjoutAppartementPopup-remove-image-btn { opacity: 1; }
.add-AjoutAppartementPopup-remove-image-btn:hover { background-color: rgba(220, 38, 38, 0.9); }

.add-AjoutAppartementPopup-empty-slot {
  width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;
  font-size: 24px; color: #9ca3af; background-color: #f3f4f6;
}

.add-AjoutAppartementPopup-images-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  grid-gap: 12px;
  gap: 12px;
}

@media (max-width: 768px) {
  .add-AjoutAppartementPopup-images-grid { grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 8px; }
  .add-AjoutAppartementPopup-image-preview { width: 100px; height: 100px; }
  .add-AjoutAppartementPopup-move-btn, .add-AjoutAppartementPopup-remove-image-btn { width: 20px; height: 20px; font-size: 10px; }
  .add-AjoutAppartementPopup-images-grid-container { max-height: 300px; }
}


/* =========================
   Tarification
   ========================= */

.add-AjoutAppartementPopup-tarification-container {
  border: 1px solid #e5e7eb; border-radius: 8px; padding: 20px; background-color: #f9fafb; margin-top: 16px;
}

.add-AjoutAppartementPopup-tarif-row { margin-bottom: 20px; }
.add-AjoutAppartementPopup-tarif-inputs {
  display: grid; grid-template-columns: 1fr 1fr; grid-gap: 20px; gap: 20px; align-items: start;
}
.add-AjoutAppartementPopup-periode-group,
.add-AjoutAppartementPopup-prix-group { display: flex; flex-direction: column; gap: 8px; }

.add-AjoutAppartementPopup-label { font-weight: 500; color: #374151; font-size: 14px; }

.add-AjoutAppartementPopup-periode-inputs { display: flex; align-items: center; gap: 8px; }
.add-AjoutAppartementPopup-periode-inputs input {
  width: 60px; padding: 8px; border: 1px solid #d1d5db; border-radius: 6px; text-align: center;
}
.add-AjoutAppartementPopup-periode-inputs span { font-size: 14px; color: #6b7280; }

.add-AjoutAppartementPopup-prix-inputs { display: flex; align-items: center; gap: 8px; }
.add-AjoutAppartementPopup-prix-inputs input { flex: 1 1; padding: 8px; border: 1px solid #d1d5db; border-radius: 6px; }
.add-AjoutAppartementPopup-prix-inputs span { font-size: 14px; color: #6b7280; font-weight: 500; }

.add-AjoutAppartementPopup-delete-tarif {
  background-color: #ef4444; border: none; padding: 6px; border-radius: 4px; color: white; cursor: pointer; transition: background-color 0.2s;
}
.add-AjoutAppartementPopup-delete-tarif:hover { background-color: #dc2626; }

.add-AjoutAppartementPopup-ajouter-tarif {
  display: flex; align-items: center; gap: 8px; background-color: #0C447E;
  border: 1px solid #6b7280; padding: 10px 16px; border-radius: 6px; color: #ffffff; font-size: 14px; cursor: pointer; transition: all 0.2s; margin-top: 16px; width: -webkit-max-content; width: max-content;
}
.add-AjoutAppartementPopup-ajouter-tarif:hover { border-color: #0C447E; color: #0C447E; background-color: white; }

@media (max-width: 768px) {
  .add-AjoutAppartementPopup-tarif-inputs { grid-template-columns: 1fr; gap: 16px; }
  .add-AjoutAppartementPopup-periode-inputs { flex-wrap: wrap; }
  .add-AjoutAppartementPopup-periode-inputs input { width: 50px; }
}


/* =========================
   Footer & Pagination
   ========================= */

.add-AjoutAppartementPopup-footer {
  padding: 20px 32px; border-top: 1px solid #e5e7eb;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
}

.add-AjoutAppartementPopup-pagination { display: flex; align-items: center; justify-content: center; gap: 8px; }

.add-AjoutAppartementPopup-nav-btn {
  background-color: #f3f4f6; border: 1px solid #e5e7eb; border-radius: 8px;
  min-width: 120px; padding: 10px 16px; display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all 0.2s;
}
.add-AjoutAppartementPopup-nav-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.add-AjoutAppartementPopup-nav-btn:not(:disabled):hover { background-color: #e5e7eb; }

.add-AjoutAppartementPopup-page-btn {
  width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;
  border-radius: 8px; background-color: #f3f4f6; border: 1px solid #e5e7eb; font-weight: 600; cursor: pointer; transition: all 0.2s;
}
.add-AjoutAppartementPopup-page-btn:hover { background-color: #e5e7eb; }
.add-AjoutAppartementPopup-page-btn.add-AjoutAppartementPopup-active { background-color: #0C447E; color: white; border-color: #0C447E; }

.add-AjoutAppartementPopup-form-actions { display: flex; justify-content: flex-end; gap: 16px; margin-top: 32px; }

.add-AjoutAppartementPopup-btn-annuler {
  padding: 12px 24px; border-radius: 9px; font-weight: 500; cursor: pointer; transition: all 0.2s;
  background-color: #ee5b65; border: 1px solid #d1d5db; color: #ffff;
}
.add-AjoutAppartementPopup-btn-annuler:hover { background-color: #ff1625; }

.add-AjoutAppartementPopup-btn-enregistrer {
  padding: 12px 24px; border-radius: 8px; font-weight: 500; cursor: pointer; transition: all 0.2s;
  background-color: #0C447E; border: 1px solid #0C447E; color: white;
}

.add-AjoutAppartementPopup-btn-save-draft {
  padding: 8px 16px; background-color: #0C447E; border: 2px solid #d1d5db; border-radius: 8px;
  color: white; font-weight: 500; cursor: pointer; transition: all 0.2s ease; text-align: center; font-size: 14px; display: block; margin-left: auto;
}
.add-AjoutAppartementPopup-btn-save-draft:hover { background-color: #0c3a69; border-color: #9ca3af; transform: translateY(-1px); }

.add-AjoutAppartementPopup-btn-enregistrer:hover { background-color: #21b104; color: #ffff; border: none; }


/* =========================
   Responsive global
   ========================= */

@media (max-width: 768px) {
  .add-AjoutAppartementPopup-form-grid { grid-template-columns: 1fr; }
  .add-AjoutAppartementPopup-options-grid,
  .add-AjoutAppartementPopup-languages-grid { grid-template-columns: repeat(2, 1fr); }
  .add-AjoutAppartementPopup-form-actions { flex-direction: column; }
  .add-AjoutAppartementPopup-btn-annuler,
  .add-AjoutAppartementPopup-btn-enregistrer { width: 100%; }
}


/* =========================
   Search / Dropdown commun
   ========================= */

.add-AjoutAppartementPopup-search-container { position: relative; width: 100%; z-index: 10; }
.add-AjoutAppartementPopup-search-input { position: relative; width: 100%; }
.add-AjoutAppartementPopup-search-input input {
  width: 100%; padding: 10px 35px 10px 15px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 14px; height: 45px;
}
.add-AjoutAppartementPopup-search-input input:focus {
  outline: none; border-color: #2563eb; box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.1);
}
.add-AjoutAppartementPopup-search-icon {
  position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: #6b7280; pointer-events: none;
}

.add-AjoutAppartementPopup-dropdown {
  position: absolute; top: 100%; left: 0; right: 0; max-height: 200px; overflow-y: auto;
  background-color: white; border: 1px solid #e5e7eb; border-radius: 8px; margin-top: 4px;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  z-index: 1000; width: 100%;
}
.add-AjoutAppartementPopup-dropdown-item {
  padding: 10px 15px; cursor: pointer; transition: background-color 0.2s;
}
.add-AjoutAppartementPopup-dropdown-item:hover { background-color: #f3f4f6; }
.add-AjoutAppartementPopup-dropdown-item.add-AjoutAppartementPopup-no-results { color: #6b7280; cursor: default; }
.add-AjoutAppartementPopup-dropdown-item.add-AjoutAppartementPopup-no-results:hover { background-color: transparent; }


/* =========================
   Messages
   ========================= */

.add-AjoutAppartementPopup-message {
  padding: 12px 32px; margin: 0 32px 30px 32px; border-radius: 8px; font-size: 14px; font-weight: 500; text-align: center; animation: slideIn 0.3s ease-out;
}
.add-AjoutAppartementPopup-message-success { background-color: #d1fae5; color: #065f46; border: 1px solid #a7f3d0; }
.add-AjoutAppartementPopup-message-error { background-color: #fee2e2; color: #991b1b; border: 1px solid #fecaca; }

@keyframes slideIn {
  from { opacity: 0; transform: translateY(-10px); }
  to   { opacity: 1; transform: translateY(0); }
}
/* ================================
   SELECTS MODERNES — HARMONISÉS
   (aucune modif JSX requise)
   ================================ */

/* Gabarit commun (même look que les inputs) */
.add-AjoutAppartementPopup-form-group select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  display: block;
  width: 100%;
  height: 45px;
  min-height: 45px;
  padding: 10px 40px 10px 12px;     /* espace pour la flèche */
  border: 1px solid #d1d5db;
  border-radius: 8px;
  background-color: #fff;
  color: #111827;
  font-size: 14px;
  line-height: 1.2;
  box-sizing: border-box;
  transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease, transform .05s ease;
  cursor: pointer;

  /* Flèche vectorielle (remplace la native) */
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2720%27 height=%2720%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%236b7280%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3e%3cpolyline points=%276 9 12 15 18 9%27/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px 16px;
}

/* Hover / focus (alignés sur tes inputs) */
.add-AjoutAppartementPopup-form-group select:hover {
  border-color: #bfc5cf;
}
.add-AjoutAppartementPopup-form-group select:focus {
  outline: none;
  border-color: #0C447E;
  box-shadow: 0 0 0 4px rgba(12, 68, 126, 0.12);
}

/* Placeholder (première option vide) */
.add-AjoutAppartementPopup-form-group select option[value=""],
.add-AjoutAppartementPopup-form-group select option:disabled {
  color: #9ca3af;
}

/* État disabled */
.add-AjoutAppartementPopup-form-group select:disabled {
  background-color: #f9fafb;
  color: #9ca3af;
  cursor: not-allowed;
}

/* Harmonisation des <option> quand supporté */
@supports selector(option:checked) {
  .add-AjoutAppartementPopup-form-group select option {
    font-size: 14px;
    line-height: 1.4;
    padding: 10px 12px;
    background: #fff;
    color: #111827;
  }
}

/* Variante erreur (si tu ajoutes la classe depuis le JS) */
.add-AjoutAppartementPopup-form-group select.add-AjoutAppartementPopup-invalid,
.add-AjoutAppartementPopup-form-group select.add-AjoutAppartementPopup-invalid:focus {
  border-color: #ef4444 !important;
  box-shadow: 0 0 0 4px rgba(239,68,68,.15) !important;
}

/* Petits ajustements multi-navigateurs */
.add-AjoutAppartementPopup-form-group select::-ms-expand { display: none; }  /* IE legacy */
@supports (-moz-appearance: none) {
  .add-AjoutAppartementPopup-form-group select { text-indent: .01px; text-overflow: ''; } /* Firefox */
}

/* Espacement visuel aligné aux champs de recherche */
.add-AjoutAppartementPopup-form-group label + select {
  box-shadow: 0 1px 0 rgba(0,0,0,.01);
}
/* Le conteneur de recherche ne doit pas survoler les selects ouverts */
.add-AjoutAppartementPopup-search-container {
  position: relative;
  z-index: auto;           /* ou 0 */
}

/* Le dropdown de recherche, lui, doit rester au-dessus quand il est ouvert */
.add-AjoutAppartementPopup-dropdown {
  z-index: 1100;           /* > header sticky (2) et > popup */
}

/* Le <select> reste au-dessus des blocs voisins (dont la recherche) */
.add-AjoutAppartementPopup-form-group select {
  position: relative;
  z-index: 5;              /* local, suffisant pour battre le conteneur de recherche */
}

/* L’icône de loupe ne capte jamais les clics (sécurité) */
.add-AjoutAppartementPopup-search-icon {
  pointer-events: none;
}


/* =========================
   CHECKBOXES CUSTOM (sans JSX)
   ========================= */
/* Masquer la checkbox native */
.add-AjoutAppartementPopup-checkbox-label input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  margin: 0;
  pointer-events: none;
}

/* Style personnalisé de la case à cocher */
.add-AjoutAppartementPopup-checkbox-custom {
  width: 20px;
  height: 20px;
  border: 2px solid #d1d5db;
  border-radius: 4px;
  background-color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: all 0.2s ease;
  position: relative;
  cursor: pointer;
}

/* État coché : fond bleu + coche blanche */
.add-AjoutAppartementPopup-checkbox-label input[type="checkbox"]:checked + .add-AjoutAppartementPopup-checkbox-custom {
  background-color: #0C447E;
  border-color: #0C447E;
}

/* Style de la coche */
.add-AjoutAppartementPopup-checkbox-label input[type="checkbox"]:checked + .add-AjoutAppartementPopup-checkbox-custom::after {
  content: "✓";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  line-height: 1;
}



/* Le label aligne texte + case custom sur une seule ligne */
.add-AjoutAppartementPopup-checkbox-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
  padding: 4px 0;
}



/* --- Grille des amenities (exemple d'application) --- */
.add-AjoutAppartementPopup-amenities-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 12px;
  gap: 12px;
  padding: 12px;
  border-radius: 8px;
}

.add-AjoutAppartementPopup-amenities-grid .add-AjoutAppartementPopup-checkbox-label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
  border-radius: 6px;
}

.add-AjoutAppartementPopup-amenities-grid .add-AjoutAppartementPopup-checkbox-label:hover {
  background-color: #f7fbff;
}

/* --- Options/Items (exemple pour les tags) --- */
.add-AjoutAppartementPopup-option-item {
  display: flex;
  align-items: center;
  gap: 6px;
  background-color: #f3f4f6;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 14px;
}

/* --- Responsive --- */
@media (max-width: 768px) {
  .add-AjoutAppartementPopup-amenities-grid {
    grid-template-columns: 1fr;
  }
}

/* Top Contact Bar */
.header-top-bar {
  background: #0F447E;
  color: white;
  padding: 0.5rem 0;
  font-size: 0.875rem;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 101;
  margin: 0;
  height: auto;
  border: none;
  transform: translateZ(0);
}

.header-top-bar-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1900px;
  margin: 0 auto;
  padding: 0 2rem;
}

.header-contact-info,
.header-social-info {
  display: flex;
  align-items: center;
  gap: 2rem;
}

/* Top bar language/currency controls */
.header-topbar-control {
  position: relative;
}

.header-topbar-button {
  padding: 0.35rem 0.6rem;
  border-radius: 9999px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  background: transparent;
  color: #fff;
  font-weight: 600;
  font-size: 0.7rem;
  cursor: pointer;
  transition: all 0.2s ease;
}

.header-topbar-button:hover {
  background: rgba(255, 255, 255, 0.15);
}

.header-topbar-popover {
  position: absolute;
  right: 0;
  top: 120%;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  z-index: 30;
  min-width: 180px;
  overflow: hidden;
}

.header-topbar-option {
  display: block;
  width: 100%;
  text-align: left;
  padding: 8px 12px;
  background: #fff;
  border: none;
  cursor: pointer;
  color: #111827;
}

.header-topbar-option.is-active {
  background: #f3f4f6;
}

.header-contact-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: rgba(255, 255, 255, 0.9);
}

.header-social-links {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-left: 1rem;
}

.header-social-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 4px;
  color: white;
  text-decoration: none;
  transition: all 0.3s ease;
}

.header-social-link:hover {
  background: rgba(255, 255, 255, 0.2);
  transform: translateY(-1px);
}

/* Header Styles */
.header-main {
  position: fixed;
  top: 43px;
  left: 0;
  right: 0;
  z-index: 100;
  background: rgba(255, 255, 255, 0.95);
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  margin: 0;
  border: none;
  transform: translateZ(0);
  will-change: transform;
}

.header-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 2rem;
  max-width: 1900px;
  margin: 0 auto;
  gap: 1.5rem;
}

.header-logo-image {
  height: 65px;
  width: auto;
  transition: transform 0.3s ease;
}

.header-logo-image:hover {
  transform: scale(1.05);
}

.header-nav-desktop {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.header-nav-button {
  padding: 0.75rem 1.5rem;
  border: 2px solid #0F447E;
  background: transparent;
  color: #0F447E;
  border-radius: 50px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
  white-space: nowrap;
  font-size: 0.9rem;
}

/* .header-nav-button:hover {
  background: #0F447E;
  color: white;
  transform: translateY(-1px);
} */

.header-nav-button-primary {
  padding: 0.75rem 1.5rem;
  background-color: #0F447E;
  color: white;
  border: none;
  border-radius: 50px;
  font-weight: 600;
  cursor: pointer;
  font-size: 0.9rem;
}

/* .header-nav-button-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 25px rgba(30, 58, 138, 0.3);
} */

.header-mobile-menu-button {
  display: none;
  background: transparent;
  border: none;
  color: #64748b;
  cursor: pointer;
  padding: 0.5rem;
  border-radius: 8px;
  transition: all 0.3s ease;
}

.header-mobile-menu-button:hover {
  background: #f1f5f9;
  color: #0F447E;
}

.header-mobile-menu {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: white;
  border-top: 1px solid #e2e8f0;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  padding: 1.5rem 2rem;
  animation: slideDown 0.3s ease;
  display: none;
  margin: 0;
}

.header-mobile-nav-buttons {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.header-mobile-nav-buttons .header-nav-button,
.header-mobile-nav-buttons .header-nav-button-primary {
  width: 100%;
  text-align: center;
  padding: 1rem 1.5rem;
  font-size: 0.95rem;
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Responsive Design */
@media (max-width: 1024px) {
  .header-top-bar-content {
    padding: 0 1.5rem;
  }
  .header-contact-info,
  .header-social-info {
    gap: 1rem;
  }
}

@media (max-width: 768px) {
  .header-top-bar {
    position: fixed;
    top: 0;
    padding: 0.4rem 0;
    margin: 0;
    left: 0;
    right: 0;
    z-index: 101;
    transform: translateZ(0);
  }
  .header-top-bar-content {
    padding: 0 1rem;
    flex-direction: row;
    justify-content: center;
    gap: 1.5rem;
  }
  .header-contact-info {
    display: flex;
    align-items: center;
    gap: 1.5rem;
  }
  .header-social-info {
    display: flex;
    align-items: center;
    gap: 12px;
  }
  .header-email {
    display: none;
  }
  .header-social-links {
    display: none;
  }
  .header-main {
    top: 35px;
    margin: 0;
    transform: translateZ(0);
    will-change: transform;
  }
  .header-nav {
    padding: 0.8rem 1rem;
  }
  .header-nav-desktop {
    display: none;
  }
  .header-mobile-menu-button {
    display: block;
  }
  .header-mobile-menu {
    display: block;
    padding: 1rem;
    margin: 0;
  }
  .header-logo-image {
    height: 40px;
  }
}

@media (max-width: 480px) {
  .header-top-bar {
    margin: 0;
    padding: 0.3rem 0;
  }
  .header-top-bar-content {
    padding: 0 0.5rem;
    gap: 1rem;
  }
  .header-contact-info {
    gap: 1rem;
  }
  .header-contact-item {
    font-size: 0.6rem;
  }
  .header-nav {
    padding: 0.8rem 0.5rem;
  }
  .header-main {
    top: 30px;
    margin: 0;
  }
  .header-logo-image {
    height: 50px;
  }
  .header-nav-button,
  .header-nav-button-primary {
    padding: 0.9rem 1.25rem;
    font-size: 0.9rem;
  }
  .header-mobile-menu {
    padding: 1rem 0.5rem;
    margin: 0;
  }
  .header-mobile-nav-buttons {
    gap: 0.8rem;
  }
}

@media (max-width: 375px) {
  .header-top-bar {
    margin: 0;
    padding: 0.25rem 0;
  }
  .header-contact-info {
    gap: 0.8rem;
  }
  .header-contact-item {
    font-size: 0.65rem;
  }
  .header-main {
    top: 25px;
    margin: 0;
  }
}

/* Profile Styles */
.header-profile-container {
  position: relative;
  margin-left: 1rem;
}

.header-avatar {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background-color: #0F447E;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
  border: 2px solid transparent;
}

.header-avatar:hover {
  background-color: #0a305b;
  border-color: #1e3a8a;
}

.header-mobile-avatar {
  width: 35px;
  height: 35px;
  font-size: 14px;
}

.header-mobile-right {
  display: flex;
  align-items: center;
  gap: 15px;
}

.header-profile-dropdown {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  background-color: white;
  border-radius: 12px;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
  min-width: 200px;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  transition: all 0.3s ease;
  z-index: 1000;
  border: 1px solid #e5e7eb;
}

.header-mobile-dropdown {
  position: fixed;
  top: 65px;
  right: 15px;
  left: auto;
  min-width: 180px;
}

.header-profile-container:hover .header-profile-dropdown,
.header-profile-dropdown:hover {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.header-profile-dropdown::before {
  content: '';
  position: absolute;
  top: -8px;
  right: 20px;
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid white;
  filter: drop-shadow(0 -2px 2px rgba(0, 0, 0, 0.1));
}

.header-mobile-dropdown::before {
  right: 30px;
}

.header-dropdown-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 15px 20px;
  font-size: 14px;
  color: #374151;
  text-decoration: none;
  transition: all 0.2s ease;
  border: none;
  background: none;
  width: 100%;
  cursor: pointer;
  border-bottom: 1px solid #f3f4f6;
}

.header-dropdown-item:last-child {
  border-bottom: none;
}

.header-dropdown-item:hover {
  background-color: #f9fafb;
  color: #1e3a8a;
}

.header-dropdown-item.header-logout-item:hover {
  background-color: #fef2f2;
  color: #e30613;
}

.header-dropdown-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

/* Scrolled state */
.header-scrolled {
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.header-main + *:not(header) {
  padding-top: 170px;
  padding-bottom: 100px; /* Augmenté pour inclure l'espace pour le widget Brevo et le bouton de défilement */
}

@media (max-width: 768px) {
  .header-main + *:not(header) {
    padding-top: 130px;
    padding-bottom: 100px;
  }
}

/* Surcharge des styles du widget Brevo */
#brevo-conversations-widget,
.brevo-conversations-iframe,
[id*="brevo-conversations"] {
  position: fixed !important;
  bottom: 80px !important; /* Positionné au-dessus du bouton de défilement */
  right: 20px !important; /* Aligné horizontalement avec le bouton de défilement */
  top: auto !important; /* Supprime tout positionnement en haut */
  transform: none !important; /* Supprime toute transformation par défaut */
  z-index: 998 !important; /* Inférieur au z-index du bouton de défilement (999) */
}

/* Styles pour le widget Chatwoot */

/* #chatwoot-live-chat,
.chatwoot--widget,
[id*="chatwoot"] {
  position: fixed !important;
  bottom: 80px !important; 
  right: 20px !important;
  top: auto !important;
  transform: none !important;
  z-index: 1000 !important; 
} */



/* Styles pour le widget Chatwoot */
#chatwoot-app,
.chatwoot--bubble,
.chatwoot--widget,
[class*="chatwoot"] {
  position: fixed !important;
  bottom: 120px !important; /* Augmenté pour être clairement au-dessus du bouton Scroll to Top */
  right: 20px !important; /* Alignement horizontal */
  top: auto !important; /* Supprime tout positionnement en haut */
  transform: none !important; /* Supprime les transformations par défaut */
  z-index: 900 !important; /* Inférieur au header (z-index: 100 et 101) et au bouton Scroll to Top (z-index: 999) */
}

/* S'assurer que le widget ouvert ne masque pas les éléments interactifs */
.chatwoot--widget-container,
.chatwoot--chat-container,
[class*="chatwoot"][style*="position"] {
  z-index: 900 !important; /* Maintient le widget ouvert en dessous du header */
  max-height: calc(100vh - 150px) !important; /* Limite la hauteur pour éviter de masquer le header */
  margin-top: 150px !important; /* Laisse de l'espace pour le header fixe */
}

/* Surcharge pour éviter les conflits avec le header mobile */
@media (max-width: 768px) {
  #chatwoot-app,
  .chatwoot--bubble,
  .chatwoot--widget,
  [class*="chatwoot"] {
    bottom: 90px !important; /* Ajusté pour mobile, au-dessus du bouton Scroll to Top */
  }
  .chatwoot--widget-container,
  .chatwoot--chat-container,
  [class*="chatwoot"][style*="position"] {
    max-height: calc(100vh - 130px) !important; /* Adapté pour le header mobile plus petit */
    margin-top: 130px !important; /* Espace pour le header mobile */
  }
} 
.hero-container {
  min-height: 65vh;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  position: relative;
  overflow: hidden;
  background-size: cover;
  color: white;
  margin: 0;
  padding: 0;
  padding-top: 123px;

  /* Ajout pour le centrage parfait */
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Nouvelle classe pour le main */
.hero-main {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero-title {
  font-size: 2.5rem;
  font-weight: 800;
  color: white;
  line-height: 1.2;
  margin: 0;
  animation: fadeInUp 0.8s ease;
}

.hero-content {
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  align-items: center;
  position: relative;
  z-index: 2;
  /* Suppression du padding-top car le centrage est fait par flexbox */
}

/* Améliorer l'overlay avec un dégradé plus complexe */
.hero-container::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background:
    linear-gradient(135deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.3) 50%, rgba(0, 0, 0, 0.6) 100%),
    radial-gradient(circle at 30% 70%, rgba(0, 0, 0, 0.4) 0%, transparent 70%);
  pointer-events: none;
  z-index: 1;
}

/* Version alternative avec un fond plus contrasté pour le texte uniquement */
.hero-title-with-bg {
  font-size: 2.5rem;
  font-weight: 800;
  color: white;
  line-height: 1.2;
  margin: 0;
  animation: fadeInUp 0.8s ease;

  /* Fond semi-transparent uniquement pour le titre */
  background: linear-gradient(135deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.4));
  padding: 1.5rem 2rem;
  border-radius: 15px;
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.2);

  /* Ombre portée pour plus de profondeur */
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

/* Grands écrans (32 pouces et plus) */
@media (min-width: 1920px) {
  .hero-title {
    font-size: 4rem; /* Plus grand pour les très grands écrans */
  }

  .hero-content {
    max-width: 1200px; /* Plus de largeur disponible */
    gap: 3rem;
  }
}

/* Écrans très larges (2K et 4K) */
@media (min-width: 2560px) {
  .hero-title {
    font-size: 5rem; /* Encore plus grand pour 4K */
  }

  .hero-content {
    max-width: 1400px;
    gap: 4rem;
  }
}

/* Écrans larges standard (24-32 pouces) */
@media (min-width: 1440px) and (max-width: 1919px) {
  .hero-title {
    font-size: 3.2rem; /* Légèrement plus grand */
  }

  .hero-content {
    max-width: 1000px;
    gap: 2.5rem;
  }
}

/* Cacher le hero sur mobile */
/* Cacher le hero sur mobile */
@media (max-width: 768px) {
  .hero-hidden-mobile {
    display: none !important;
  }
}

/* Responsive adjustments pour tablettes */
@media (min-width: 769px) and (max-width: 1024px) {
  .hero-hidden-mobile {
    display: none !important;
  }
}

/* Responsive adjustments pour tablettes */
@media (min-width: 769px) and (max-width: 1024px) {
  .hero-container {
    min-height: 55vh;
    min-height: 55vh;
  }

  .hero-title {
    font-size: 2rem;
    font-size: 2rem;
  }

  .hero-content {
    padding: 2rem;
    padding: 2rem;
  }
}

@media (max-width: 480px) {
  .hero-hidden-mobile {
    display: none !important;
  }
  .hero-hidden-mobile {
    display: none !important;
  }
}

@media (min-width: 414px) and (max-width: 896px) {
  .hero-hidden-mobile {
    display: none !important;
  }
  }
.testimonial-section {
  font-family: 'Poppins', sans-serif;
  padding: 100px 20px;
  /* background: linear-gradient(135deg, #f8fafc 0%, #ffffff 50%, #f1f5f9 100%);s */
  overflow: hidden;
  max-width: 1900px;
  margin: 0 auto;
}

.section-header {
  text-align: center;
  margin-bottom: 80px;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}

.header-title {
  font-size: 42px;
  font-weight: 700;
  color: #0f447e;
  margin: 0 0 16px;
  line-height: 1.2;
}

.highlight {
  color: #E30613;
  position: relative;
  display: inline-block;
}

.section-description {
  font-size: 18px;
  font-weight: 400;
  color: rgba(30, 30, 30, 0.8);
  line-height: 1.6;
  margin: 0;
}

.testimonials-row {
  margin-bottom: 40px;
  overflow: hidden;
}

.testimonials-container {
  display: flex;
  gap: 30px;
  overflow-x: hidden;
  scroll-behavior: auto;
}

.bottom-stats {
  display: flex;
  justify-content: center;
  margin-top: 60px;
}

.stats-container {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 24px;
  /* background: rgba(255, 255, 255, 0.8); */
  border-radius: 50px;
  border: 1px solid rgba(12, 68, 126, 0.1);
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
}

.user-avatars {
  display: flex;
  position: relative;
  width: 80px;
  height: 32px;
}

.user-avatar {
  position: absolute;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: linear-gradient(135deg, #0F447e, #1e40af);
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 12px;
  font-weight: 600;
  border: 2px solid white;
  box-shadow: 0 4px 12px rgba(15, 68, 126, 0.2);
}

.stats-text {
  font-size: 14px;
  color: rgba(12, 68, 126, 0.7);
  font-weight: 500;
}

.testimonial-card {
  background: #fff;
  border-radius: 16px;
  padding: 30px;
  min-width: 350px;
  max-width: 350px;
  box-shadow: 0 10px 30px rgba(12, 68, 126, 0.1);
  transition: all 0.3s ease;
  position: relative;
  border: 1px solid rgba(12, 68, 126, 0.05);
  flex-shrink: 0;
}

.testimonial-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 40px rgba(12, 68, 126, 0.15);
}

.card-content {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 20px;
}

.quote-icon {
  color: rgba(12, 68, 126, 0.2);
}

.rating {
  display: flex;
  gap: 2px;
}

.star {
  font-size: 16px;
}

.star.filled {
  color: #ebc438;
}

.star.empty {
  color: #dfe7ee;
}

.testimonial-text {
  font-size: 15px;
  font-weight: 400;
  color: #374151;
  line-height: 1.7;
  margin-bottom: 24px;
  flex-grow: 1;
  font-style: italic;
}

.author-info {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: auto;
}

.avatar-container {
  width: 44px;
  height: 44px;
  background: #0F447e;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.avatar {
  color: white;
}

.author-details {
  display: flex;
  flex-direction: column;
}

.author-name {
  font-size: 16px;
  font-weight: 600;
  color: #0F447e;
  margin: 0 0 2px;
}

.author-role {
  font-size: 13px;
  font-weight: 400;
  color: rgba(12, 68, 126, 0.7);
  margin: 0;
}

@media (max-width: 768px) {
  .testimonial-card {
    min-width: 280px;
    max-width: 280px;
    padding: 24px;
  }
  
  .testimonial-text {
    font-size: 14px;
  }
  
  .author-name {
    font-size: 15px;
  }
  
  .author-role {
    font-size: 12px;
  }
}
:root {
  --TahagaSection-primary-blue: #0F447E;
  --TahagaSection-secondary-blue: #0F447E;
  --TahagaSection-accent-blue: #3b82f6;
  --TahagaSection-accent-light: #93c5fd;
  --TahagaSection-text-primary: #1f2937;
  --TahagaSection-text-secondary: #6b7280;
  --TahagaSection-text-muted: #9ca3af;
  --TahagaSection-background: #f8fafc;
  --TahagaSection-background-secondary: #f1f5f9;
  --TahagaSection-primary-red: #e30613;
  --TahagaSection-white: #ffffff;
  --TahagaSection-border: #e5e7eb;
  --TahagaSection-border-light: #f3f4f6;
  --TahagaSection-gradient: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  --TahagaSection-gradient-light: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
  --TahagaSection-gradient-card: linear-gradient(135deg, rgba(12, 68, 126, 0.1) 0%, rgba(16, 79, 146, 0.1) 100%);
  --TahagaSection-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
  --TahagaSection-shadow-md: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  --TahagaSection-shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
  --TahagaSection-shadow-xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  --TahagaSection-shadow-blue: 0 10px 15px -3px rgba(12, 68, 126, 0.3);
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.TahagaSection-container {
  font-family: 'Inter', sans-serif;
  background-color: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
  background-color: var(--TahagaSection-gradient-light);
  min-height: 90vh;
  overflow-x: hidden;
  color: #1f2937;
  color: var(--TahagaSection-text-primary);
  line-height: 1.6;
  margin-top: 0;
  padding-top: 0;
}

/* Hero Section - Version améliorée */
.TahagaSection-hero {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
  background: var(--TahagaSection-gradient-light);
  position: relative;
  padding: 2rem;
  overflow: hidden;
  margin-top: -30px; 
}

.TahagaSection-hero::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url("data:image/svg+xml,<svg width=\"60\" height=\"60\" viewBox=\"0 0 60 60\" xmlns=\"http://www.w3.org/2000/svg\"><g fill=\"none\" fill-rule=\"evenodd\"><g fill=\"%23f1f5f9\" fill-opacity=\"0.3\"><circle cx=\"7\" cy=\"7\" r=\"7\"/></g></g></svg>") repeat;
  opacity: 0.4;
}

.TahagaSection-hero-content {
  max-width: 1400px;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 4rem;
  gap: 4rem;
  align-items: center;
  position: relative;
  z-index: 2;
}

.TahagaSection-hero-text {
  max-width: 600px;
}

.TahagaSection-main-title {
  font-size: 4rem;
  font-weight: 900;
  margin-bottom: 1.5rem;
  position: relative;
  line-height: 1.2;
}

.N-Vison{
  color: #e30613;
  color: var(--TahagaSection-primary-red);
}

.TahagaSection-brand {
  background: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  background: var(--TahagaSection-gradient);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  position: relative;
  display: block;
  margin-bottom: 0.5rem;
}

.TahagaSection-subtitle {
  font-size: 1.5rem;
  font-weight: 500;
  color: #0F447E;
  color: var(--TahagaSection-secondary-blue);
  display: block;
  margin-bottom: 2rem;
}

.TahagaSection-hero-description {
  font-size: 1.25rem;
  line-height: 1.7;
  color: #6b7280;
  color: var(--TahagaSection-text-secondary);
  font-weight: 400;
  margin-bottom: 2.5rem;
}

.TahagaSection-hero-cta {
  display: flex;
  gap: 1.5rem;
}

.TahagaSection-primary-button {
  background: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  background: var(--TahagaSection-gradient);
  color: #ffffff;
  color: var(--TahagaSection-white);
  border: none;
  padding: 1rem 2rem;
  border-radius: 0.75rem;
  font-size: 1.1rem;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  transition: all 0.3s ease;
  box-shadow: 0 10px 15px -3px rgba(12, 68, 126, 0.3);
  box-shadow: var(--TahagaSection-shadow-blue);
}

.TahagaSection-primary-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
  box-shadow: var(--TahagaSection-shadow-lg);
}

.TahagaSection-primary-button svg {
  transition: transform 0.3s ease;
}

.TahagaSection-primary-button:hover svg {
  transform: translate(4px, -4px);
}

.TahagaSection-secondary-button {
  background: transparent;
  color: #0F447E;
  color: var(--TahagaSection-primary-blue);
  border: 2px solid #0F447E;
  border: 2px solid var(--TahagaSection-primary-blue);
  padding: 1rem 2rem;
  border-radius: 0.75rem;
  font-size: 1.1rem;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  text-decoration: none;
  transition: all 0.3s ease;
}

.TahagaSection-secondary-button:hover {
  background: rgba(12, 68, 126, 0.05);
  transform: translateY(-2px);
}

.TahagaSection-hero-visual {
  position: relative;
  height: 600px;
}

.TahagaSection-floating-cards {
  position: relative;
  width: 100%;
  height: 100%;
}

.TahagaSection-floating-card {
  background: #ffffff;
  background: var(--TahagaSection-white);
  padding: 2rem;
  border-radius: 1.5rem;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  box-shadow: var(--TahagaSection-shadow-xl);
  text-align: center;
  max-width: 280px;
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  position: absolute;
  transition: all 0.5s ease;
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.TahagaSection-floating-card.card-1 {
  top: 10%;
  left: 0;
  animation: float 6s ease-in-out infinite;
  z-index: 3;
}

.TahagaSection-floating-card.card-2 {
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  animation: float 6s ease-in-out 1s infinite;
  z-index: 2;
}

.TahagaSection-floating-card.card-3 {
  bottom: 10%;
  left: 20%;
  animation: float 6s ease-in-out 2s infinite;
  z-index: 1;
}

@keyframes float {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-20px); }
}

.TahagaSection-card-icon {
  width: 80px;
  height: 80px;
  margin: 0 auto 1.5rem;
  background: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  background: var(--TahagaSection-gradient);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  color: var(--TahagaSection-white);
}

.TahagaSection-floating-card h3 {
  font-size: 1.25rem;
  font-weight: 700;
  color: #1f2937;
  color: var(--TahagaSection-text-primary);
  margin-bottom: 0.75rem;
}

.TahagaSection-floating-card p {
  font-size: 1rem;
  color: #6b7280;
  color: var(--TahagaSection-text-secondary);
  line-height: 1.5;
}

.TahagaSection-scroll-indicator {
  position: absolute;
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  color: #0F447E;
  color: var(--TahagaSection-primary-blue);
  font-size: 0.875rem;
  font-weight: 500;
  z-index: 10;
}

.TahagaSection-scroll-line {
  width: 2px;
  height: 50px;
  background: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  background: var(--TahagaSection-gradient);
  animation: scrollLine 2s ease infinite;
}

@keyframes scrollLine {
  0%, 100% { transform: translateY(0); opacity: 1; }
  50% { transform: translateY(10px); opacity: 0.5; }
}

/* About Section - Version améliorée */
.TahagaSection-about {
  padding: 8rem 2rem;
  background: #ffffff;
  background: var(--TahagaSection-white);
  position: relative;
  overflow: hidden;
}

.TahagaSection-about::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("data:image/svg+xml,<svg width=\"120\" height=\"120\" viewBox=\"0 0 120 120\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M60 60V0H0v60h60zm0 0v60h60V60H60z\" fill=\"%23f1f5f9\" fill-opacity=\"0.1\"/></svg>");
  opacity: 0.3;
}

.TahagaSection-about-content {
  max-width: 1400px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 4rem;
  gap: 4rem;
  align-items: center;
  position: relative;
  z-index: 2;
}

.TahagaSection-about-text {
  max-width: 600px;
}

.TahagaSection-section-heading {
  font-size: 2rem;
  font-weight: 700;
  color: #0F447E;
  color: var(--TahagaSection-primary-blue);
  margin-bottom: 2rem;
  position: relative;
  display: flex;
  align-items: center;
  gap: 1rem;
}

.TahagaSection-section-heading-line {
  width: 60px;
  height: 4px;
  background: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  background: var(--TahagaSection-gradient);
  border-radius: 2px;
}

.TahagaSection-description {
  font-size: 1.125rem;
  line-height: 1.8;
  color: #6b7280;
  color: var(--TahagaSection-text-secondary);
  margin-bottom: 1.5rem;
  text-align: justify;
}

.TahagaSection-stats {
  display: flex;
  gap: 2rem;
  margin-top: 3rem;
}

.TahagaSection-stat {
  text-align: center;
}

.TahagaSection-stat-number {
  font-size: 2.5rem;
  font-weight: 700;
  color: #0F447E;
  color: var(--TahagaSection-primary-blue);
  display: block;
  line-height: 1;
  margin-bottom: 0.5rem;
}

.TahagaSection-stat-label {
  font-size: 1rem;
  color: #6b7280;
  color: var(--TahagaSection-text-secondary);
  font-weight: 500;
}

.TahagaSection-about-visual {
  position: relative;
  height: 500px;
  border-radius: 1.5rem;
  overflow: hidden;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  box-shadow: var(--TahagaSection-shadow-xl);
}

.TahagaSection-about-image {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, rgba(12, 68, 126, 0.1) 0%, rgba(16, 79, 146, 0.1) 100%);
  background: var(--TahagaSection-gradient-card);
  position: relative;
}

.TahagaSection-about-image::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url('https://images.unsplash.com/photo-1564013799919-ab600027ffc6?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80') center/cover;
  opacity: 0.8;
}

.TahagaSection-about-highlight {
  position: absolute;
  bottom: 2rem;
  left: 2rem;
  background: rgba(255, 255, 255, 0.9);
  padding: 1rem 1.5rem;
  border-radius: 0.75rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-weight: 600;
  color: #0F447E;
  color: var(--TahagaSection-primary-blue);
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  box-shadow: var(--TahagaSection-shadow-md);
}

.TahagaSection-about-highlight:hover {
  transform: translateY(-3px);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
  box-shadow: var(--TahagaSection-shadow-lg);
}

.TahagaSection-about-highlight svg {
  width: 24px;
  height: 24px;
}

/* Vision & Mission - Version améliorée */
.TahagaSection-vision-mission {
  padding: 8rem 2rem;
  background: #f1f5f9;
  background: var(--TahagaSection-background-secondary);
  position: relative;
}
.N-mission{
  color: #e30613;
  color: var(--TahagaSection-primary-red);
}

.TahagaSection-vm-container {
  max-width: 1400px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 3rem;
  gap: 3rem;
}

.TahagaSection-vision,
.TahagaSection-mission {
  background: #ffffff;
  background: var(--TahagaSection-white);
  padding: 3rem;
  border-radius: 1.5rem;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  box-shadow: var(--TahagaSection-shadow-md);
  position: relative;
  overflow: hidden;
  transition: all 0.3s ease;
}

.TahagaSection-vision:hover,
.TahagaSection-mission:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
  box-shadow: var(--TahagaSection-shadow-lg);
}

.TahagaSection-vision::before,
.TahagaSection-mission::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 6px;
  background: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  background: var(--TahagaSection-gradient);
}

.TahagaSection-vm-header {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 2rem;
}

.TahagaSection-vm-icon {
  width: 60px;
  height: 60px;
  background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
  background: var(--TahagaSection-gradient-light);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #0F447E;
  color: var(--TahagaSection-primary-blue);
  flex-shrink: 0;
  border: 2px solid #e5e7eb;
  border: 2px solid var(--TahagaSection-border);
}

.TahagaSection-vm-title {
  font-size: 1.75rem;
  font-weight: 700;
  color: #0F447E;
  color: var(--TahagaSection-primary-blue);
}

.TahagaSection-vm-content {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #6b7280;
  color: var(--TahagaSection-text-secondary);
  margin-bottom: 2rem;
}

.TahagaSection-vm-footer {
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.TahagaSection-vm-tag {
  background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
  background: var(--TahagaSection-gradient-light);
  color: #0F447E;
  color: var(--TahagaSection-primary-blue);
  padding: 0.5rem 1rem;
  border-radius: 2rem;
  font-size: 0.875rem;
  font-weight: 600;
}

/* Values Section - Version améliorée */
.TahagaSection-values {
  padding: 8rem 2rem;
  background: #ffffff;
  background: var(--TahagaSection-white);
  position: relative;
}

.TahagaSection-values::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("data:image/svg+xml,<svg width=\"120\" height=\"120\" viewBox=\"0 0 120 120\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M60 60V0H0v60h60zm0 0v60h60V60H60z\" fill=\"%23f1f5f9\" fill-opacity=\"0.1\"/></svg>");
  opacity: 0.3;
}

.TahagaSection-values-header {
  text-align: center;
  max-width: 800px;
  margin: 0 auto 6rem;
  position: relative;
  z-index: 2;
}

.TahagaSection-values-title {
  font-size: 2.5rem;
  font-weight: 800;
  color: #0F447E;
  color: var(--TahagaSection-primary-blue);
  margin-bottom: 1.5rem;
  position: relative;
  display: inline-block;
}
.TahagaSection-values-title-fondMental{
  color: #e30613;
  color: var(--TahagaSection-primary-red);
}

.TahagaSection-values-title span {
  position: relative;
}

.TahagaSection-values-title span::after {
  content: '';
  position: absolute;
  bottom: -10px;
  left: 0;
  width: 100%;
  /* height: 4px; */
  background: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  background: var(--TahagaSection-gradient);
  border-radius: 2px;
}

/* .TahagaSection-values-subtitle {
  font-size: 1.125rem;
  line-height: 1.7;
  color: var(--TahagaSection-text-secondary);
} */

.TahagaSection-values-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
  grid-gap: 2rem;
  gap: 2rem;
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.TahagaSection-value-card {
  background: #ffffff;
  background: var(--TahagaSection-white);
  padding: 2.5rem;
  border-radius: 1.5rem;
  border: 1px solid #f3f4f6;
  border: 1px solid var(--TahagaSection-border-light);
  text-align: center;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
  box-shadow: var(--TahagaSection-shadow);
}

.TahagaSection-value-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  background: var(--TahagaSection-gradient);
  transform: scaleX(0);
  transition: transform 0.3s ease;
  transform-origin: left;
}

.TahagaSection-value-card:hover::before {
  transform: scaleX(1);
}

.TahagaSection-value-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
  box-shadow: var(--TahagaSection-shadow-lg);
}

.TahagaSection-value-icon {
  width: 80px;
  height: 80px;
  margin: 0 auto 1.5rem;
  background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
  background: var(--TahagaSection-gradient-light);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #0F447E;
  color: var(--TahagaSection-primary-blue);
  transition: all 0.3s ease;
}

.TahagaSection-value-card:hover .TahagaSection-value-icon {
  background: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  background: var(--TahagaSection-gradient);
  color: #ffffff;
  color: var(--TahagaSection-white);
  transform: scale(1.1);
}

.TahagaSection-value-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: #1f2937;
  color: var(--TahagaSection-text-primary);
  margin-bottom: 1rem;
}

.TahagaSection-value-description {
  font-size: 1rem;
  line-height: 1.6;
  color: #6b7280;
  color: var(--TahagaSection-text-secondary);
  margin-bottom: 1.5rem;
}

.TahagaSection-value-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  color: #0F447E;
  color: var(--TahagaSection-primary-blue);
  font-weight: 600;
  transition: all 0.3s ease;
}

.TahagaSection-value-card:hover .TahagaSection-value-link {
  color: #0F447E;
  color: var(--TahagaSection-secondary-blue);
}

.TahagaSection-value-link svg {
  transition: transform 0.3s ease;
}

.TahagaSection-value-card:hover .TahagaSection-value-link svg {
  transform: translateX(4px);
}

/* Join Us Section - Version améliorée */
.TahagaSection-join {
  padding: 8rem 2rem;
  background: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  background: var(--TahagaSection-gradient);
  position: relative;
  overflow: hidden;
}

.TahagaSection-join::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("data:image/svg+xml,<svg width=\"120\" height=\"120\" viewBox=\"0 0 120 120\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M60 60V0H0v60h60zm0 0v60h60V60H60z\" fill=\"%23ffffff\" fill-opacity=\"0.05\"/></svg>");
}

.TahagaSection-join-container {
  max-width: 1400px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 4rem;
  gap: 4rem;
  align-items: center;
  position: relative;
  z-index: 2;
}

.TahagaSection-join-content {
  max-width: 600px;
}

.TahagaSection-join-title {
  font-size: 2.5rem;
  font-weight: 800;
  color: #ffffff;
  color: var(--TahagaSection-white);
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.TahagaSection-join-description {
  font-size: 1.25rem;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.9);
  margin-bottom: 2.5rem;
}

.TahagaSection-join-buttons {
  display: flex;
  gap: 1.5rem;
}

.TahagaSection-join-primary {
  background: #ffffff;
  background: var(--TahagaSection-white);
  color: #0F447E;
  color: var(--TahagaSection-primary-blue);
  border: none;
  padding: 1rem 2rem;
  border-radius: 0.75rem;
  font-size: 1.1rem;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  transition: all 0.3s ease;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  box-shadow: var(--TahagaSection-shadow-md);
}

.TahagaSection-join-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
  box-shadow: var(--TahagaSection-shadow-lg);
}

.TahagaSection-join-primary svg {
  transition: transform 0.3s ease;
}

.TahagaSection-join-primary:hover svg {
  transform: translate(4px, -4px);
}

.TahagaSection-join-secondary {
  background: transparent;
  color: #ffffff;
  color: var(--TahagaSection-white);
  border: 2px solid #ffffff;
  border: 2px solid var(--TahagaSection-white);
  padding: 1rem 2rem;
  border-radius: 0.75rem;
  font-size: 1.1rem;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  transition: all 0.3s ease;
}

.TahagaSection-join-secondary:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: translateY(-2px);
}

.TahagaSection-join-visual {
  position: relative;
  height: 400px;
}

.TahagaSection-join-pattern {
  width: 100%;
  height: 100%;
  background: url("data:image/svg+xml,<svg width=\"60\" height=\"60\" viewBox=\"0 0 60 60\" xmlns=\"http://www.w3.org/2000/svg\"><g fill=\"none\" fill-rule=\"evenodd\"><g fill=\"%23ffffff\" fill-opacity=\"0.1\"><circle cx=\"7\" cy=\"7\" r=\"7\"/></g></g></svg>") repeat;
  border-radius: 1.5rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
}

/* Responsive Design */
@media (max-width: 1200px) {
  .TahagaSection-hero-content {
    grid-template-columns: 1fr;
    gap: 3rem;
  }
  
  .TahagaSection-hero-text {
    max-width: 100%;
    text-align: center;
  }
  
  .TahagaSection-hero-cta {
    justify-content: center;
  }
  
  .TahagaSection-hero-visual {
    height: 500px;
    margin: 0 auto;
    max-width: 800px;
  }
  
  .TahagaSection-floating-card.card-1 {
    top: 5%;
    left: 5%;
  }
  
  .TahagaSection-floating-card.card-2 {
    top: 50%;
    right: 5%;
    transform: translateY(-50%);
  }
  
  .TahagaSection-floating-card.card-3 {
    bottom: 5%;
    left: 30%;
  }
  
  .TahagaSection-about-content {
    grid-template-columns: 1fr;
  }
  
  .TahagaSection-about-text {
    max-width: 100%;
    text-align: center;
  }
  
  .TahagaSection-stats {
    justify-content: center;
  }
  
  .TahagaSection-about-visual {
    height: 400px;
    max-width: 800px;
    margin: 0 auto;
  }
  
  .TahagaSection-join-container {
    grid-template-columns: 1fr;
    text-align: center;
  }
  
  .TahagaSection-join-content {
    max-width: 100%;
  }
  
  .TahagaSection-join-buttons {
    justify-content: center;
  }
  
  .TahagaSection-join-visual {
    display: none;
  }
}

@media (max-width: 992px) {
  .TahagaSection-main-title {
    font-size: 3rem;
  }
  
  .TahagaSection-subtitle {
    font-size: 1.25rem;
  }
  
  .TahagaSection-hero-description {
    font-size: 1.1rem;
  }
  
  .TahagaSection-vm-container {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  
  .TahagaSection-values-title {
    font-size: 2rem;
  }
  
  .TahagaSection-join-title {
    font-size: 2rem;
  }
}

@media (max-width: 768px) {
  .TahagaSection-hero {
    padding: 6rem 1.5rem;
  }
  
  .TahagaSection-main-title {
    font-size: 2.5rem;
  }
  
  .TahagaSection-hero-visual {
    height: 400px;
  }
  
  .TahagaSection-floating-card {
    max-width: 220px;
    padding: 1.5rem;
  }
  
  .TahagaSection-about,
  .TahagaSection-vision-mission,
  .TahagaSection-values,
  .TahagaSection-join {
    padding: 6rem 1.5rem;
  }
  
  .TahagaSection-values-grid {
    grid-template-columns: 1fr;
  }
  
  .TahagaSection-hero-cta,
  .TahagaSection-join-buttons {
    flex-direction: column;
    gap: 1rem;
  }
  
  .TahagaSection-primary-button,
  .TahagaSection-secondary-button,
  .TahagaSection-join-primary,
  .TahagaSection-join-secondary {
    width: 100%;
    justify-content: center;
  }

  /* Modifications spécifiques pour les cartes flottantes sur mobile */
  .TahagaSection-floating-cards {
    height: 400px;
  }

  .TahagaSection-floating-card {
    max-width: 150px;
    padding: 0.8rem;
  }

  .TahagaSection-card-icon {
    width: 40px;
    height: 40px;
    margin-bottom: 0.5rem;
  }

  .TahagaSection-card-icon svg {
    width: 24px;
    height: 24px;
  }

  .TahagaSection-floating-card h3 {
    font-size: 0.9rem;
    margin-bottom: 0.3rem;
  }

  .TahagaSection-floating-card p {
    font-size: 0.7rem;
    line-height: 1.2;
  }

  .TahagaSection-floating-card.card-1 {
    top: 5%;
    left: 5%;
  }
  
  .TahagaSection-floating-card.card-2 {
    top: 50%;
    right: 5%;
    transform: translateY(-50%);
  }
  
  .TahagaSection-floating-card.card-3 {
    bottom: 5%;
    left: 25%;
  }
}

@media (max-width: 576px) {
  .TahagaSection-main-title {
    font-size: 2rem;
  }
  
  .TahagaSection-subtitle {
    font-size: 1.1rem;
  }
  
  .TahagaSection-hero-description {
    font-size: 1rem;
  }
  
  .TahagaSection-hero-visual {
    height: 300px;
  }
  
  .TahagaSection-floating-card {
    max-width: 130px;
    padding: 0.6rem;
  }
  
  .TahagaSection-card-icon {
    width: 36px;
    height: 36px;
  }

  .TahagaSection-card-icon svg {
    width: 20px;
    height: 20px;
  }

  .TahagaSection-floating-card h3 {
    font-size: 0.8rem;
  }

  .TahagaSection-floating-card p {
    font-size: 0.65rem;
  }

  /* Centrer les cartes pour les très petits écrans */
  .TahagaSection-floating-card.card-1 {
    top: 5%;
    left: 50%;
    transform: translateX(-50%);
  }
  
  .TahagaSection-floating-card.card-2 {
    top: 50%;
    left: 50%;
    right: auto;
    transform: translate(-50%, -50%);
  }
  
  .TahagaSection-floating-card.card-3 {
    bottom: 5%;
    left: 50%;
    transform: translateX(-50%);
  }

  .TahagaSection-section-heading {
    font-size: 1.5rem;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
  }
  
  .TahagaSection-stats {
    flex-direction: column;
    gap: 1.5rem;
  }
  
  .TahagaSection-stat-number {
    font-size: 2rem;
  }
  
  .TahagaSection-vm-title {
    font-size: 1.5rem;
  }
  
  .TahagaSection-vm-content {
    font-size: 1rem;
  }
  
  .TahagaSection-value-title {
    font-size: 1.25rem;
  }
  
  .TahagaSection-value-description {
    font-size: 0.9375rem;
  }
}

/* Alternative pour empiler les cartes verticalement sur mobile */
@media (max-width: 480px) {
  .TahagaSection-floating-cards {
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    margin-top: 2rem;
  }

  .TahagaSection-floating-card {
    position: static;
    transform: none !important;
    max-width: 250px;
    width: 100%;
    animation: none;
    margin-bottom: 1rem;
  }

  /* Désactiver l'animation de flottement sur mobile */
  @keyframes float {
    0%, 100% { transform: none; }
    50% { transform: none; }
  }
}

/* Smooth scrolling */
html {
  scroll-behavior: smooth;
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: #f8fafc;
  background: var(--TahagaSection-background);
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  background: var(--TahagaSection-gradient);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #0F447E;
  background: var(--TahagaSection-secondary-blue);
}

/* Focus states for accessibility */
button:focus {
  outline: 2px solid #3b82f6;
  outline: 2px solid var(--TahagaSection-accent-blue);
  outline-offset: 2px;
}

/* Print styles */
@media print {
  .TahagaSection-hero-visual,
  .TahagaSection-about-visual,
  .TahagaSection-join-visual,
  button {
    display: none;
  }
  
  .TahagaSection-container {
    background: white;
  }
  
  .TahagaSection-hero,
  .TahagaSection-about,
  .TahagaSection-vision-mission,
  .TahagaSection-values,
  .TahagaSection-join {
    background: white;
    padding: 2rem 0;
  }
  
  .TahagaSection-brand {
    -webkit-text-fill-color: #0F447E;
    -webkit-text-fill-color: var(--TahagaSection-primary-blue);
  }
}

@media (max-width: 768px) {
  .TahagaSection-floating-cards {
    display: none !important;
  }
  
  /* Optionnel : ajustez la hauteur du conteneur visuel */
  .TahagaSection-hero-visual {
    height: 0;
    min-height: 0;
  }
}

/* Assure que les liens prennent le style des boutons */
.TahagaSection-primary-button,
.TahagaSection-join-primary,
.TahagaSection-join-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  cursor: pointer;
}

/* Conserve le style hover des boutons */
.TahagaSection-primary-button:hover,
.TahagaSection-join-primary:hover,
.TahagaSection-join-secondary:hover {
  opacity: 0.9;
}
/* Variables CSS pour une meilleure maintenabilité */
:root {
  --ServiceCards-primary: #0f447e;
  --ServiceCards-accent: #E30613;
  --ServiceCards-bg-light: rgba(217, 217, 217, 0.34);
  --ServiceCards-text-primary: #1a1a1a;
  --ServiceCards-text-secondary: rgba(30, 30, 30, 0.66);
  --ServiceCards-white: #ffffff;
  --ServiceCards-shadow: 0 8px 32px rgba(15, 68, 126, 0.12);
  --ServiceCards-shadow-hover: 0 12px 48px rgba(15, 68, 126, 0.18);
  --ServiceCards-gradient: linear-gradient(135deg, rgba(15, 68, 126, 0.05) 0%, rgba(227, 6, 19, 0.05) 100%);
}

/* Container principal */
.ServiceCards-container {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 60px 20px;
  /* background: var(--ServiceCards-bg-light); */
  position: relative;
  overflow: hidden;
}

.ServiceCards-container::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  /* background: var(--ServiceCards-gradient); */
  pointer-events: none;
}

/* Header moderne */
.ServiceCards-header {
  text-align: center;
  margin-bottom: 80px;
  position: relative;
  z-index: 2;
}

.ServiceCards-title {
  font-family: 'Poppins', sans-serif;
  font-size: clamp(32px, 5vw, 56px);
  font-weight: 700;
  color: #0f447e;
  color: var(--ServiceCards-primary);
  margin: 0 0 20px 0;
  letter-spacing: -0.02em;
  line-height: 1.1;
}

.ServiceCards-highlight {
  color: #E30613;
  color: var(--ServiceCards-accent);
  position: relative;
}

.ServiceCards-highlight::after {
  content: '';
  position: absolute;
  bottom: -5px;
  left: 0;
  width: 100%;
  background: linear-gradient(90deg, #E30613, transparent);
  background: linear-gradient(90deg, var(--ServiceCards-accent), transparent);
  border-radius: 2px;
}

.ServiceCards-subtitle {
  font-family: 'Poppins', sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: rgba(30, 30, 30, 0.66);
  color: var(--ServiceCards-text-secondary);
  max-width: 600px;
  margin: 0 auto;
  line-height: 1.6;
}

/* Navigation Desktop - Design ultra moderne */
.ServiceCards-nav-desktop {
  display: flex;
  background: #ffffff;
  background: var(--ServiceCards-white);
  border-radius: 24px;
  padding: 8px;
  box-shadow: 0 8px 32px rgba(15, 68, 126, 0.12);
  box-shadow: var(--ServiceCards-shadow);
  margin-bottom: 60px;
  position: relative;
  z-index: 2;
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  border: 1px solid rgba(15, 68, 126, 0.1);
}

.ServiceCards-nav-tab {
  flex: 1 1;
  background: none;
  border: none;
  padding: 24px 20px;
  border-radius: 16px;
  cursor: pointer;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.ServiceCards-nav-tab::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(135deg, #0f447e, rgba(15, 68, 126, 0.8));
  background: linear-gradient(135deg, var(--ServiceCards-primary), rgba(15, 68, 126, 0.8));
  opacity: 0;
  transition: opacity 0.4s ease;
  border-radius: 16px;
}

.ServiceCards-nav-tab:hover::before,
.ServiceCards-nav-tab.active::before {
  opacity: 1;
}

.ServiceCards-tab-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  position: relative;
  z-index: 1;
}

.ServiceCards-tab-icon {
  color: #0f447e;
  color: var(--ServiceCards-primary);
  transition: all 0.4s ease;
  transform: translateY(0);
}

.ServiceCards-nav-tab:hover .ServiceCards-tab-icon,
.ServiceCards-nav-tab.active .ServiceCards-tab-icon {
  color: #ffffff;
  color: var(--ServiceCards-white);
  transform: translateY(-2px);
}

.ServiceCards-tab-text {
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: #0f447e;
  color: var(--ServiceCards-primary);
  text-align: center;
  line-height: 1.3;
  transition: color 0.4s ease;
}

.ServiceCards-nav-tab:hover .ServiceCards-tab-text,
.ServiceCards-nav-tab.active .ServiceCards-tab-text {
  color: #ffffff;
  color: var(--ServiceCards-white);
}

.ServiceCards-tab-indicator {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%) scaleX(0);
  width: 60%;
  height: 3px;
  background: #E30613;
  background: var(--ServiceCards-accent);
  border-radius: 2px;
  transition: transform 0.4s ease;
}

.ServiceCards-nav-tab.active .ServiceCards-tab-indicator {
  transform: translateX(-50%) scaleX(1);
}

/* Barre d'onglets Mobile - Style moderne */
.ServiceCards-mobile-tabs {
  display: flex;
  background: #ffffff;
  background: var(--ServiceCards-white);
  border-radius: 20px;
  padding: 6px;
  margin-bottom: 30px;
  box-shadow: 0 8px 32px rgba(15, 68, 126, 0.12);
  box-shadow: var(--ServiceCards-shadow);
  position: relative;
  z-index: 2;
}

.ServiceCards-mobile-tab {
  flex: 1 1;
  background: none;
  border: none;
  padding: 16px 8px;
  border-radius: 14px;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.ServiceCards-mobile-tab::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #0f447e;
  background: var(--ServiceCards-primary);
  opacity: 0;
  transition: opacity 0.3s ease;
  border-radius: 14px;
}

.ServiceCards-mobile-tab.active::before {
  opacity: 1;
}

.ServiceCards-mobile-tab-icon {
  color: #0f447e;
  color: var(--ServiceCards-primary);
  transition: color 0.3s ease;
  margin-bottom: 8px;
  position: relative;
  z-index: 1;
}

.ServiceCards-mobile-tab.active .ServiceCards-mobile-tab-icon {
  color: #ffffff;
  color: var(--ServiceCards-white);
}

.ServiceCards-mobile-tab-text {
  font-family: 'Poppins', sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: #0f447e;
  color: var(--ServiceCards-primary);
  text-align: center;
  line-height: 1.2;
  transition: color 0.3s ease;
  position: relative;
  z-index: 1;
}

.ServiceCards-mobile-tab.active .ServiceCards-mobile-tab-text {
  color: #ffffff;
  color: var(--ServiceCards-white);
}

/* Accordéon Mobile - Design élégant */
.ServiceCards-mobile-accordion {
  background: #ffffff;
  background: var(--ServiceCards-white);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(15, 68, 126, 0.12);
  box-shadow: var(--ServiceCards-shadow);
  margin-bottom: 40px;
  position: relative;
  z-index: 2;
}

.ServiceCards-accordion-item {
  border-bottom: 1px solid rgba(15, 68, 126, 0.1);
}

.ServiceCards-accordion-item:last-child {
  border-bottom: none;
}

.ServiceCards-accordion-header {
  width: 100%;
  background: none;
  border: none;
  padding: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  transition: all 0.3s ease;
}

.ServiceCards-accordion-header:hover {
  background: rgba(15, 68, 126, 0.05);
}

.ServiceCards-accordion-header.expanded {
  background: rgba(15, 68, 126, 0.08);
}

.ServiceCards-accordion-header-content {
  display: flex;
  align-items: center;
  gap: 16px;
}

.ServiceCards-accordion-icon {
  color: #0f447e;
  color: var(--ServiceCards-primary);
  transition: color 0.3s ease;
}

.ServiceCards-accordion-title {
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: #0f447e;
  color: var(--ServiceCards-primary);
  text-align: left;
}

.ServiceCards-accordion-chevron {
  color: #0f447e;
  color: var(--ServiceCards-primary);
  transition: transform 0.3s ease;
  font-size: 14px;
}

.ServiceCards-accordion-chevron.rotated {
  transform: rotate(180deg);
}

.ServiceCards-accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease;
  background: rgba(15, 68, 126, 0.02);
}

.ServiceCards-accordion-content.expanded {
  max-height: 2000px;
}

.ServiceCards-mobile-service {
  padding: 20px;
  border-bottom: 1px solid rgba(15, 68, 126, 0.05);
  transition: all 0.3s ease;
}

.ServiceCards-mobile-service:last-child {
  border-bottom: none;
}

.ServiceCards-mobile-service.featured {
  background: linear-gradient(135deg, rgba(15, 68, 126, 0.05), rgba(227, 6, 19, 0.02));
  border-left: 4px solid #E30613;
  border-left: 4px solid var(--ServiceCards-accent);
}

.ServiceCards-mobile-service-title {
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: #0f447e;
  color: var(--ServiceCards-primary);
  margin: 0 0 12px 0;
  line-height: 1.3;
}

.ServiceCards-mobile-service-description {
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: rgba(30, 30, 30, 0.66);
  color: var(--ServiceCards-text-secondary);
  margin: 0;
  line-height: 1.5;
}

/* Grille Bureau - Cartes modernes */
.ServiceCards-desktop-content {
  position: relative;
  z-index: 2;
  margin-bottom: 60px;
}

.ServiceCards-services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
  grid-gap: 30px;
  gap: 30px;
  padding: 0;
}

.ServiceCards-service-card {
  background: #ffffff;
  background: var(--ServiceCards-white);
  border-radius: 20px;
  padding: 32px;
  position: relative;
  overflow: hidden;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 8px 32px rgba(15, 68, 126, 0.12);
  box-shadow: var(--ServiceCards-shadow);
  border: 1px solid rgba(15, 68, 126, 0.08);
}

.ServiceCards-service-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(135deg, rgba(15, 68, 126, 0.05) 0%, rgba(227, 6, 19, 0.05) 100%);
  background: var(--ServiceCards-gradient);
  opacity: 0;
  transition: opacity 0.4s ease;
}

.ServiceCards-service-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 12px 48px rgba(15, 68, 126, 0.18);
  box-shadow: var(--ServiceCards-shadow-hover);
}

.ServiceCards-service-card:hover::before {
  opacity: 1;
}

.ServiceCards-service-card.featured {
  border-left: 4px solid #E30613;
  border-left: 4px solid var(--ServiceCards-accent);
  background: linear-gradient(135deg, rgba(15, 68, 126, 0.02), rgba(227, 6, 19, 0.01));
}

.ServiceCards-service-header {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  margin-bottom: 20px;
  position: relative;
  z-index: 1;
}

.ServiceCards-service-indicator {
  width: 6px;
  height: 40px;
  background: linear-gradient(135deg, #0f447e, #E30613);
  background: linear-gradient(135deg, var(--ServiceCards-primary), var(--ServiceCards-accent));
  border-radius: 3px;
  flex-shrink: 0;
  transition: all 0.4s ease;
}

.ServiceCards-service-card:hover .ServiceCards-service-indicator {
  height: 50px;
  box-shadow: 0 4px 20px rgba(15, 68, 126, 0.3);
}

.ServiceCards-service-title {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 22px;
  color: #0f447e;
  color: var(--ServiceCards-primary);
  margin: 0;
  line-height: 1.3;
  position: relative;
  z-index: 1;
}

.ServiceCards-service-description {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 15px;
  color: rgba(30, 30, 30, 0.66);
  color: var(--ServiceCards-text-secondary);
  margin: 0;
  line-height: 1.6;
  text-align: justify;
  position: relative;
  z-index: 1;
}

.ServiceCards-service-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(135deg, transparent 0%, rgba(15, 68, 126, 0.02) 100%);
  opacity: 0;
  transition: opacity 0.4s ease;
  pointer-events: none;
}

.ServiceCards-service-card:hover .ServiceCards-service-overlay {
  opacity: 1;
}

/* Bouton CTA Ultra-moderne */
.ServiceCards-cta-container {
  display: flex;
  justify-content: center;
  position: relative;
  z-index: 2;
}

.ServiceCards-cta-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 20px 40px;
  background: linear-gradient(135deg, #0f447e, rgba(15, 68, 126, 0.9));
  background: linear-gradient(135deg, var(--ServiceCards-primary), rgba(15, 68, 126, 0.9));
  color: #ffffff;
  color: var(--ServiceCards-white);
  text-decoration: none;
  border-radius: 50px;
  font-family: 'Poppins', sans-serif;
  font-size: 18px;
  font-weight: 600;
  /* transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); */
  box-shadow: 0 8px 32px rgba(15, 68, 126, 0.12);
  box-shadow: var(--ServiceCards-shadow);
  position: relative;
  overflow: hidden;
  min-width: 280px;
  border: 2px solid transparent;
}

/* .ServiceCards-cta-button::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transition: left 0.6s ease;
} */
/* 
.ServiceCards-cta-button:hover::before {
  left: 100%;
}

.ServiceCards-cta-button:hover {
  transform: translateY(-3px);
  box-shadow: var(--ServiceCards-shadow-hover);
  border-color: rgba(255, 255, 255, 0.2);
}

.ServiceCards-cta-text {
  position: relative;
  z-index: 1;
} */

.ServiceCards-cta-arrow {
  font-size: 20px;
  transition: transform 0.4s ease;
  position: relative;
  z-index: 1;
}

.ServiceCards-cta-button:hover .ServiceCards-cta-arrow {
  transform: translateX(4px);
}

/* Design Responsive - Mobile d'abord */
@media (max-width: 480px) {
  .ServiceCards-container {
    padding: 40px 15px;
  }
  
  .ServiceCards-title {
    font-size: 32px;
    margin-bottom: 15px;
  }
  
  .ServiceCards-subtitle {
    font-size: 16px;
  }
  
  .ServiceCards-header {
    margin-bottom: 50px;
  }
  
  .ServiceCards-mobile-tabs {
    padding: 4px;
    margin-bottom: 20px;
  }
  
  .ServiceCards-mobile-tab {
    padding: 12px 6px;
  }
  
  .ServiceCards-mobile-tab-text {
    font-size: 11px;
  }
  
  .ServiceCards-accordion-header {
    padding: 16px;
  }
  
  .ServiceCards-accordion-title {
    font-size: 15px;
  }
  
  .ServiceCards-mobile-service {
    padding: 16px;
  }
  
  .ServiceCards-mobile-service-title {
    font-size: 15px;
  }
  
  .ServiceCards-mobile-service-description {
    font-size: 13px;
  }
  
  .ServiceCards-cta-button {
    min-width: 250px;
    padding: 16px 30px;
    font-size: 16px;
  }
}

/* Tablette */
@media (min-width: 481px) and (max-width: 768px) {
  .ServiceCards-container {
    padding: 50px 20px;
  }
  
  .ServiceCards-header {
    margin-bottom: 60px;
  }
  
  .ServiceCards-mobile-accordion {
    margin-bottom: 30px;
  }
}

/* Bureau Petit */
@media (min-width: 769px) and (max-width: 1024px) {
  .ServiceCards-nav-desktop {
    margin-bottom: 50px;
  }
  
  .ServiceCards-nav-tab {
    padding: 20px 16px;
  }
  
  .ServiceCards-tab-text {
    font-size: 15px;
  }
  
  .ServiceCards-services-grid {
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 25px;
  }
  
  .ServiceCards-service-card {
    padding: 28px;
  }
  
  .ServiceCards-service-title {
    font-size: 20px;
  }
  
  .ServiceCards-service-description {
    font-size: 14px;
  }
}

/* Bureau Moyen */
@media (min-width: 1025px) and (max-width: 1440px) {
  .ServiceCards-services-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Bureau Large */
@media (min-width: 1441px) {
  .ServiceCards-container {
    max-width: 1600px;
    padding: 80px 40px;
  }
  
  .ServiceCards-header {
    margin-bottom: 100px;
  }
  
  .ServiceCards-title {
    font-size: 64px;
  }
  
  .ServiceCards-subtitle {
    font-size: 20px;
  }
  
  .ServiceCards-nav-desktop {
    margin-bottom: 80px;
    padding: 12px;
  }
  
  .ServiceCards-nav-tab {
    padding: 32px 24px;
  }
  
  .ServiceCards-tab-text {
    font-size: 18px;
  }
  
  .ServiceCards-services-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
  }
  
  .ServiceCards-service-card {
    padding: 40px;
  }
  
  .ServiceCards-service-title {
    font-size: 26px;
  }
  
  .ServiceCards-service-description {
    font-size: 16px;
  }
  
  .ServiceCards-cta-button {
    padding: 24px 50px;
    font-size: 20px;
    min-width: 320px;
  }
}

/* Animations et micro-interactions */
@keyframes ServiceCards-fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes ServiceCards-slideIn {
  from {
    opacity: 0;
    transform: translateX(-20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.ServiceCards-service-card {
  animation: ServiceCards-fadeInUp 0.6s ease forwards;
}

.ServiceCards-service-card:nth-child(even) {
  animation-delay: 0.1s;
}

.ServiceCards-mobile-service {
  animation: ServiceCards-slideIn 0.4s ease forwards;
}

/* États de focus pour l'accessibilité */
.ServiceCards-nav-tab:focus,
.ServiceCards-mobile-tab:focus,
.ServiceCards-accordion-header:focus,
.ServiceCards-cta-button:focus {
  outline: 2px solid #E30613;
  outline: 2px solid var(--ServiceCards-accent);
  outline-offset: 2px;
}

/* Défilement fluide */
html {
  scroll-behavior: smooth;
}

/* Support du mode contraste élevé */
@media (prefers-contrast: more) {
  :root {
    --ServiceCards-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
    --ServiceCards-shadow-hover: 0 8px 24px rgba(0, 0, 0, 0.4);
  }
  
  .ServiceCards-service-card {
    border: 2px solid #0f447e;
    border: 2px solid var(--ServiceCards-primary);
  }
}

/* Support de mouvement réduit */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Styles d'impression */
@media print {
  .ServiceCards-container {
    background: white;
    box-shadow: none;
  }
  
  .ServiceCards-nav-desktop,
  .ServiceCards-mobile-tabs,
  .ServiceCards-cta-button {
    display: none;
  }
  
  .ServiceCards-service-card {
    page-break-inside: avoid;
    break-inside: avoid;
    box-shadow: none;
    border: 1px solid #ccc;
  }
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.tarif-container {
  width: 100%;
  min-height: 100vh;
  background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
  font-family: 'Poppins', sans-serif;
  overflow-x: hidden;
}

/* Header Section */
.tarif-header {
  /* padding: 100px 20px 120px; */
  position: relative;
  overflow: hidden;
}

.tarif-header::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url("data:image/svg+xml,%3Csvg width=%2760%27 height=%2760%27 viewBox=%270 0 60 60%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cg fill=%27none%27 fill-rule=%27evenodd%27%3E%3Cg fill=%27%23ffffff%27 fill-opacity=%270.03%27%3E%3Ccircle cx=%2730%27 cy=%2730%27 r=%274%27/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") repeat;
  animation: float 20s infinite linear;
}

@keyframes float {
  0% { transform: translateX(0px) translateY(0px); }
  100% { transform: translateX(-60px) translateY(-60px); }
}

.header-content {
  max-width: 1200px;
  margin: 0 auto;
  text-align: center;
  position: relative;
  z-index: 2;
}

.main-title {
  font-size: clamp(3rem, 3vw, 3rem);
  font-weight: 800;
  color: #0f447e;
  margin-bottom: 20px;
  letter-spacing: -0.02em;
  line-height: 1.1;
}

.highlight {
  background: linear-gradient(135deg, #E30613, #ff4757);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  position: relative;
}

.main-subtitle {
  font-size: 1.25rem;
  max-width: 600px;
  color: #64748b;
  margin: 0 auto 50px;
  line-height: 1.6;
}

/* Plans Section */
.plans-section {
  padding: 80px 20px;
  max-width: 1400px;
  margin: 0 auto;
  position: relative;
  margin-top: -60px;
}

.plans-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
  grid-gap: 30px;
  gap: 30px;
  align-items: start;
}

.plan-card {
  background: white;
  border-radius: 20px;
  padding: 40px 30px;
  position: relative;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  border: 2px solid transparent;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
  overflow: hidden;
}

.plan-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #0f447e, #1e40af);
  transform: scaleX(0);
  transition: transform 0.4s ease;
}

.plan-card.hovered::before,
.plan-card.popular::before {
  transform: scaleX(1);
}

.plan-card.popular {
  transform: scale(1.05);
  border-color: #E30613;
  box-shadow: 0 20px 60px rgba(227, 6, 19, 0.15);
}

.plan-card.popular::before {
  background: linear-gradient(90deg, #E30613, #ff4757);
}

.plan-card.hovered {
  transform: translateY(-10px);
  box-shadow: 0 25px 70px rgba(0, 0, 0, 0.15);
}

.popular-badge {
  position: absolute;
  top: -1px;
  right: 30px;
  background: linear-gradient(135deg, #E30613, #ff4757);
  color: white;
  padding: 8px 20px;
  border-radius: 0 0 15px 15px;
  font-size: 0.85rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 6px;
  box-shadow: 0 4px 15px rgba(227, 6, 19, 0.3);
}

.plan-header {
  text-align: center;
  margin-bottom: 30px;
}

.plan-icon {
  width: 80px;
  height: 80px;
  margin: 0 auto 20px;
  background: linear-gradient(135deg, #0f447e, #1e40af);
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  transition: all 0.3s ease;
}

.plan-card.popular .plan-icon {
  background: linear-gradient(135deg, #E30613, #ff4757);
}

.plan-name {
  font-size: 1.75rem;
  font-weight: 700;
  color: #1a202c;
  margin-bottom: 10px;
}

.plan-description {
  color: #64748b;
  font-size: 1rem;
  line-height: 1.5;
}

.plan-pricing {
  text-align: center;
  margin-bottom: 40px;
  padding: 30px 0;
  border-top: 1px solid #e2e8f0;
  border-bottom: 1px solid #e2e8f0;
}

.price-main {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 5px;
  margin-bottom: 10px;
}

.currency {
  font-size: 1rem;
  color: #64748b;
  font-weight: 500;
}

.amount {
  font-size: 3rem;
  font-weight: 800;
  color: #1a202c;
  line-height: 1;
}

.period {
  font-size: 1rem;
  color: #64748b;
  font-weight: 500;
}

.savings {
  color: #E30613;
  font-weight: 600;
  font-size: 0.9rem;
}

.plan-features {
  margin-bottom: 40px;
}

.feature-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid #f1f5f9;
}

.feature-item:last-child {
  border-bottom: none;
}

.feature-item svg {
  color: #22c55e;
  flex-shrink: 0;
}

.feature-item span {
  color: #374151;
  font-size: 0.95rem;
  line-height: 1.4;
}

.plan-button {
  width: 100%;
  padding: 16px 24px;
  border-radius: 12px;
  font-weight: 600;
  font-size: 1rem;
  transition: all 0.3s ease;
  cursor: pointer;
  border: none;
  position: relative;
  overflow: hidden;
}

.plan-button.primary {
  background: linear-gradient(135deg, #E30613, #ff4757);
  color: white;
  box-shadow: 0 8px 25px rgba(227, 6, 19, 0.3);
}

.plan-button.primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 35px rgba(227, 6, 19, 0.4);
}

.plan-button.secondary {
  background: linear-gradient(135deg, #0f447e, #1e40af);
  color: white;
  box-shadow: 0 8px 25px rgba(15, 68, 126, 0.3);
}

.plan-button.secondary:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 35px rgba(15, 68, 126, 0.4);
}

/* Additional Services */
.additional-services {
  padding: 80px 20px;
  max-width: 1200px;
  margin: 0 auto;
  background: white;
  border-radius: 30px;
  margin-bottom: 80px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);
}

.section-title {
  font-size: 2.5rem;
  font-weight: 700;
  text-align: center;
  color: #0f447e;
  margin-bottom: 60px;
  position: relative;
}

.section-title2{
    color: #E30613;
}

.section-title::after {
  content: '';
  position: absolute;
  bottom: -15px;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  background: linear-gradient(90deg, #0f447e, #E30613);
  border-radius: 2px;
}

.services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  grid-gap: 30px;
  gap: 30px;
}

.service-card {
  background: #f8fafc;
  border-radius: 15px;
  padding: 30px;
  text-align: center;
  transition: all 0.3s ease;
  border: 1px solid #e2e8f0;
}

.service-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
  background: white;
}

.service-icon {
  width: 60px;
  height: 60px;
  margin: 0 auto 20px;
  background: linear-gradient(135deg, #0f447e, #1e40af);
  border-radius: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
}

.service-title {
  font-size: 1.25rem;
  font-weight: 600;
  color: #1a202c;
  margin-bottom: 10px;
}

.service-description {
  color: #64748b;
  margin-bottom: 20px;
  line-height: 1.5;
}

.service-pricing {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.service-price {
  font-size: 1.25rem;
  font-weight: 700;
  color: #E30613;
}

.service-duration {
  font-size: 0.9rem;
  color: #64748b;
}

/* FAQ Preview */
.faq-preview {
  padding: 80px 20px;
  max-width: 1200px;
  margin: 0 auto;
}

.faq-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
  grid-gap: 30px;
  gap: 30px;
}

.faq-item {
  background: white;
  border-radius: 15px;
  padding: 30px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
  transition: all 0.3s ease;
}

.faq-item:hover {
  transform: translateY(-3px);
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.12);
}

.faq-item h4 {
  font-size: 1.15rem;
  font-weight: 600;
  color: #1a202c;
  margin-bottom: 15px;
}

.faq-item p {
  color: #64748b;
  line-height: 1.6;
}

/* Responsive Design */
@media (max-width: 768px) {
  .tarif-header {
    padding: 10px 20px 30px;
  }

  .main-title {
    font-size: 2.5rem;
  }

  .main-subtitle {
    font-size: 1.1rem;
    margin: 0;
  }

  .billing-toggle {
    flex-direction: column;
    gap: 15px;
    padding: 15px;
    border-radius: 15px;
  }

  .toggle-switch {
    order: -1;
  }

  .plans-section {
    padding: 60px 15px;
    margin-top: -40px;
  }

  .plans-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .plan-card {
    padding: 30px 20px;
  }

  .plan-card.popular {
    transform: none;
  }

  .plan-card.hovered {
    transform: none;
  }

  .amount {
    font-size: 2.5rem;
  }

  .additional-services,
  .faq-preview {
    padding: 60px 15px;
  }

  .section-title {
    font-size: 2rem;
  }

  .services-grid,
  .faq-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .cta-section {
    padding: 60px 15px;
  }

  .cta-content h2 {
    font-size: 2rem;
  }

  .cta-buttons {
    flex-direction: column;
    align-items: center;
  }

  .cta-primary,
  .cta-secondary {
    width: 100%;
    max-width: 300px;
  }
}

@media (max-width: 480px) {
  .main-title {
    font-size: 2rem;
  }

  .main-subtitle {
    font-size: 1rem;
    margin: 0;
  }

  .plan-icon {
    width: 60px;
    height: 60px;
  }

  .plan-name {
    font-size: 1.5rem;
  }

  .amount {
    font-size: 2rem;
  }

  .section-title {
    font-size: 1.75rem;
  }

  .cta-content h2 {
    font-size: 1.75rem;
  }

  .cta-content p {
    font-size: 1.1rem;
  }
}

/* Animation pour les cartes au scroll */
@keyframes slideInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.plan-card,
.service-card,
.faq-item {
  animation: slideInUp 0.6s ease-out forwards;
}

.plan-card:nth-child(2) {
  animation-delay: 0.1s;
}

.plan-card:nth-child(3) {
  animation-delay: 0.2s;
}

.service-card:nth-child(2) {
  animation-delay: 0.1s;
}

.service-card:nth-child(3) {
  animation-delay: 0.2s;
}

.faq-item:nth-child(2) {
  animation-delay: 0.1s;
}

.faq-item:nth-child(3) {
  animation-delay: 0.2s;
}

/* Effet de particules flottantes */
.tarif-header::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: 
    radial-gradient(circle at 20% 80%, rgba(255, 255, 255, 0.1) 1px, transparent 1px),
    radial-gradient(circle at 80% 20%, rgba(255, 255, 255, 0.1) 1px, transparent 1px),
    radial-gradient(circle at 40% 40%, rgba(255, 255, 255, 0.1) 1px, transparent 1px);
  background-size: 50px 50px, 75px 75px, 100px 100px;
  animation: particleFloat 30s infinite linear;
}

@keyframes particleFloat {
  0% { transform: translateY(0px) rotate(0deg); }
  100% { transform: translateY(-100px) rotate(360deg); }
}

/* Effet de lueur sur les boutons */
.plan-button,
.cta-primary,
.cta-secondary {
  position: relative;
  overflow: hidden;
}

.plan-button::before,
.cta-primary::before,
.cta-secondary::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transition: left 0.5s;
}

.plan-button:hover::before,
.cta-primary:hover::before,
.cta-secondary:hover::before {
  left: 100%;
}

/* Amélioration de l'accessibilité */
.plan-button:focus,
.cta-primary:focus,
.cta-secondary:focus {
  outline: 3px solid rgba(227, 6, 19, 0.5);
  outline-offset: 2px;
}

.toggle-switch:focus {
  outline: 2px solid rgba(255, 255, 255, 0.5);
  outline-offset: 2px;
}

/* États de chargement */
.plan-card.loading {
  opacity: 0.7;
  pointer-events: none;
}

.plan-card.loading::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 30px;
  height: 30px;
  border: 3px solid #f3f3f3;
  border-top: 3px solid #0f447e;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% { transform: translate(-50%, -50%) rotate(0deg); }
  100% { transform: translate(-50%, -50%) rotate(360deg); }
}

/* Transitions fluides pour le mode sombre (si implémenté plus tard) */
* {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* Optimisations pour les écrans haute résolution */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .plan-icon,
  .service-icon {
    will-change: transform;
  }
}

/* Amélioration des performances avec will-change */
.plan-card,
.service-card,
.faq-item,
.plan-button,
.cta-primary,
.cta-secondary {
  will-change: transform;
}

/* Styles pour l'impression */
@media print {
  .tarif-container {
    background: white !important;
  }
  
  .tarif-header,
  .cta-section {
    background: white !important;
    color: black !important;
  }
  
  .plan-button,
  .cta-primary,
  .cta-secondary {
    border: 2px solid #0f447e !important;
    background: white !important;
    color: #0f447e !important;
  }
}
:root {
  --ContactForm-primary-blue: #0F447E;
  --ContactForm-secondary-blue: #0F447E;
  --ContactForm-text-primary: #1f2937;
  --ContactForm-text-secondary: #6b7280;
  --ContactForm-text-muted: #9ca3af;
  --ContactForm-background: #f8fafc;
  --ContactForm-white: #ffffff;
  --ContactForm-border: #e5e7eb;
  --ContactForm-border-focus: #3b82f6;
  --ContactForm-error: #e30613;
  --ContactForm-success: #10b981;
  --ContactForm-red: #e30613;
  --ContactForm-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  --ContactForm-shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
  --ContactForm-shadow-xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  --ContactForm-gradient: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
}

/* Animation keyframes */
@keyframes ContactForm-fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes ContactForm-slideInLeft {
  from {
    opacity: 0;
    transform: translateX(-30px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes ContactForm-slideInRight {
  from {
    opacity: 0;
    transform: translateX(30px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes ContactForm-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

@keyframes ContactForm-pulse {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
}

@keyframes ContactForm-float {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
}

/* Section principale */
.ContactForm-section {
  min-height: 100vh;
  padding: 80px 20px;
  background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
  position: relative;
  overflow: hidden;
  font-family: 'Inter', sans-serif;
}

.ContactForm-background-pattern {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url("data:image/svg+xml,<svg width=\"60\" height=\"60\" viewBox=\"0 0 60 60\" xmlns=\"http://www.w3.org/2000/svg\"><g fill=\"none\" fill-rule=\"evenodd\"><g fill=\"%23f1f5f9\" fill-opacity=\"0.3\"><circle cx=\"7\" cy=\"7\" r=\"7\"/></g></svg>") repeat;
  opacity: 0.5;
  z-index: 1;
}

.ContactForm-container {
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

/* Header */
.ContactForm-header {
  text-align: center;
  margin-bottom: 60px;
  animation: ContactForm-fadeInUp 0.8s ease-out;
}

.ContactForm-title {
  font-size: 3.5rem;
  font-weight: 700;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.ContactForm-title-contact {
  color: #e30613;
  color: var(--ContactForm-red);
  position: relative;
}

.ContactForm-title-nous {
  color: #0F447E;
  color: var(--ContactForm-primary-blue);
  position: relative;
}

.ContactForm-subtitle {
  font-size: 1.25rem;
  color: #6b7280;
  color: var(--ContactForm-text-secondary);
  font-weight: 400;
  max-width: 600px;
  margin: 0 auto;
}

/* Layout principal */
.ContactForm-content {
  display: grid;
  grid-template-columns: 400px 1fr;
  grid-gap: 60px;
  gap: 60px;
  align-items: start;
}

/* Section informations */
.ContactForm-info-section {
  display: flex;
  flex-direction: column;
  gap: 20px;
  animation: ContactForm-slideInLeft 0.8s ease-out 0.2s both;
}

.ContactForm-info-card {
  background: #ffffff;
  background: var(--ContactForm-white);
  border-radius: 20px;
  padding: 30px;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  box-shadow: var(--ContactForm-shadow);
  border: 1px solid #e5e7eb;
  border: 1px solid var(--ContactForm-border);
  display: flex;
  align-items: center;
  gap: 20px;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.ContactForm-info-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  background: var(--ContactForm-gradient);
  transition: left 0.5s ease;
  z-index: 1;
}

.ContactForm-info-card:hover::before {
  left: 0;
}

.ContactForm-info-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  box-shadow: var(--ContactForm-shadow-xl);
}

.ContactForm-info-icon-wrapper {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: linear-gradient(135deg, #0F447E, #0F447E);
  background: linear-gradient(135deg, var(--ContactForm-primary-blue), var(--ContactForm-secondary-blue));
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 2;
  transition: all 0.3s ease;
}

.ContactForm-info-card:hover .ContactForm-info-icon-wrapper {
  background: #ffffff;
  background: var(--ContactForm-white);
  transform: scale(1.1);
}

.ContactForm-info-icon {
  font-size: 24px;
  color: #ffffff;
  color: var(--ContactForm-white);
  transition: all 0.3s ease;
}

.ContactForm-phone-icon {
  transform: rotate(90deg);
}

.ContactForm-info-card:hover .ContactForm-info-icon {
  color: #0F447E;
  color: var(--ContactForm-primary-blue);
}

.ContactForm-info-content {
  flex: 1 1;
  position: relative;
  z-index: 2;
}

.ContactForm-info-title {
  font-size: 1.5rem;
  font-weight: 600;
  color: #0F447E;
  color: var(--ContactForm-primary-blue);
  margin-bottom: 8px;
  transition: color 0.3s ease;
}

.ContactForm-info-card:hover .ContactForm-info-title {
  color: #ffffff;
  color: var(--ContactForm-white);
}

.ContactForm-info-text {
  font-size: 1rem;
  color: #1f2937;
  color: var(--ContactForm-text-primary);
  margin: 0;
  transition: color 0.3s ease;
}

.ContactForm-info-card:hover .ContactForm-info-text {
  color: #ffffff;
  color: var(--ContactForm-white);
}

/* Section formulaire */
.ContactForm-form-section {
  animation: ContactForm-slideInRight 0.8s ease-out 0.4s both;
}

.ContactForm-form {
  background: #ffffff;
  background: var(--ContactForm-white);
  border-radius: 24px;
  padding: 40px;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
  box-shadow: var(--ContactForm-shadow-lg);
  border: 1px solid #e5e7eb;
  border: 1px solid var(--ContactForm-border);
  position: relative;
  overflow: hidden;
}

.ContactForm-form::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  background: var(--ContactForm-gradient);
}

.ContactForm-form-header {
  text-align: center;
  margin-bottom: 30px;
}

.ContactForm-form-title {
  font-size: 2rem;
  font-weight: 600;
  color: #0F447E;
  color: var(--ContactForm-primary-blue);
  margin-bottom: 8px;
}

.ContactForm-form-description {
  color: #6b7280;
  color: var(--ContactForm-text-secondary);
  font-size: 1rem;
  margin: 0;
}

.ContactForm-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 20px;
  gap: 20px;
  margin-bottom: 20px;
}

.ContactForm-form-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
  position: relative;
}

.ContactForm-form-group.ContactForm-focused .ContactForm-label {
  color: #3b82f6;
  color: var(--ContactForm-border-focus);
}

.ContactForm-form-group.ContactForm-focused .ContactForm-label-icon {
  color: #3b82f6;
  color: var(--ContactForm-border-focus);
  transform: scale(1.1);
}

.ContactForm-label {
  font-size: 0.9rem;
  font-weight: 500;
  color: #1f2937;
  color: var(--ContactForm-text-primary);
  display: flex;
  align-items: center;
  gap: 8px;
  transition: all 0.3s ease;
}

.ContactForm-label-icon {
  font-size: 14px;
  color: #9ca3af;
  color: var(--ContactForm-text-muted);
  transition: all 0.3s ease;
}

.ContactForm-required {
  color: #e30613;
  color: var(--ContactForm-error);
}

.ContactForm-input,
.ContactForm-select,
.ContactForm-textarea {
  width: 100%;
  padding: 16px 20px;
  border: 2px solid #e5e7eb;
  border: 2px solid var(--ContactForm-border);
  border-radius: 12px;
  font-size: 1rem;
  color: #1f2937;
  color: var(--ContactForm-text-primary);
  background: #ffffff;
  background: var(--ContactForm-white);
  transition: all 0.3s ease;
  font-family: 'Inter', sans-serif;
}

.ContactForm-input:focus,
.ContactForm-select:focus,
.ContactForm-textarea:focus {
  outline: none;
  border-color: #3b82f6;
  border-color: var(--ContactForm-border-focus);
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
  transform: translateY(-2px);
}

.ContactForm-input::placeholder,
.ContactForm-textarea::placeholder {
  color: #9ca3af;
  color: var(--ContactForm-text-muted);
}

.ContactForm-select {
  -webkit-appearance: none;
          appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg fill=\"%230c447e\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M7 10l5 5 5-5z\"/></svg>");
  background-repeat: no-repeat;
  background-position: right 16px center;
  background-size: 16px;
  cursor: pointer;
}

.ContactForm-textarea {
  height: 120px;
  resize: vertical;
  min-height: 120px;
  max-height: 200px;
}

/* Bouton de soumission */
.ContactForm-submit-button {
  width: 100%;
  padding: 18px 24px;
  background: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  background: var(--ContactForm-gradient);
  color: #ffffff;
  color: var(--ContactForm-white);
  border: none;
  border-radius: 12px;
  font-size: 1.1rem;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  transition: all 0.3s ease;
  margin-top: 20px;
  position: relative;
  overflow: hidden;
}

.ContactForm-submit-button::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transition: left 0.5s ease;
}

.ContactForm-submit-button:hover::before {
  left: 100%;
}

.ContactForm-submit-button:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 10px 30px 0 rgba(12, 68, 126, 0.3);
}

.ContactForm-submit-button:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

.ContactForm-button-icon {
  font-size: 16px;
  transition: transform 0.3s ease;
}

.ContactForm-submit-button:hover:not(:disabled) .ContactForm-button-icon {
  transform: translateX(4px);
}

.ContactForm-spinner {
  width: 16px;
  height: 16px;
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-top: 2px solid #ffffff;
  border-top: 2px solid var(--ContactForm-white);
  border-radius: 50%;
  animation: ContactForm-spin 1s linear infinite;
}

/* Messages de succès */
.ContactForm-success-container {
  text-align: center;
  padding: 60px 40px;
  background: #ffffff;
  background: var(--ContactForm-white);
  border-radius: 24px;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
  box-shadow: var(--ContactForm-shadow-lg);
  border: 1px solid #e5e7eb;
  border: 1px solid var(--ContactForm-border);
  animation: ContactForm-fadeInUp 0.6s ease-out;
}

.ContactForm-success-icon {
  width: 80px;
  height: 80px;
  margin: 0 auto 20px;
  background: linear-gradient(135deg, #10b981, #059669);
  background: linear-gradient(135deg, var(--ContactForm-success), #059669);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: ContactForm-pulse 2s ease-in-out infinite;
}

.ContactForm-success-icon svg {
  font-size: 32px;
  color: #ffffff;
  color: var(--ContactForm-white);
}

.ContactForm-success-title {
  font-size: 2rem;
  font-weight: 600;
  color: #0F447E;
  color: var(--ContactForm-primary-blue);
  margin-bottom: 12px;
}

.ContactForm-success-message {
  font-size: 1.1rem;
  color: #6b7280;
  color: var(--ContactForm-text-secondary);
  margin-bottom: 30px;
  line-height: 1.6;
}

.ContactForm-success-button {
  padding: 14px 28px;
  background: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  background: var(--ContactForm-gradient);
  color: #ffffff;
  color: var(--ContactForm-white);
  border: none;
  border-radius: 10px;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  transition: all 0.3s ease;
}

.ContactForm-success-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px 0 rgba(12, 68, 126, 0.3);
}

/* Messages d'erreur */
.ContactForm-error-message {
  background: rgba(239, 68, 68, 0.1);
  color: #e30613;
  color: var(--ContactForm-error);
  border: 1px solid #e30613;
  border: 1px solid var(--ContactForm-error);
  padding: 16px;
  border-radius: 10px;
  margin-top: 20px;
  text-align: center;
  font-weight: 500;
}

/* Responsive Design */
@media (max-width: 1024px) {
  .ContactForm-content {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  
  .ContactForm-title {
    font-size: 3rem;
  }
  
  .ContactForm-form-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .ContactForm-section {
    padding: 40px 15px;
  }
  
  .ContactForm-header {
    margin-bottom: 40px;
  }
  
  .ContactForm-title {
    font-size: 2.5rem;
  }
  
  .ContactForm-subtitle {
    font-size: 1.1rem;
  }
  
  .ContactForm-form {
    padding: 30px 20px;
  }
  
  .ContactForm-info-card {
    padding: 20px;
  }
  
  .ContactForm-info-icon-wrapper {
    width: 50px;
    height: 50px;
  }
  
  .ContactForm-info-icon {
    font-size: 20px;
  }
  
  .ContactForm-info-title {
    font-size: 1.25rem;
  }
  
  .ContactForm-info-text {
    font-size: 0.9rem;
  }
  
  .ContactForm-form-title {
    font-size: 1.75rem;
  }
  
  .ContactForm-input,
  .ContactForm-select,
  .ContactForm-textarea {
    padding: 14px 16px;
  }
  
  .ContactForm-submit-button {
    padding: 16px 20px;
  }
}

@media (max-width: 480px) {
  .ContactForm-section {
    padding: 30px 10px;
  }
  
  .ContactForm-title {
    font-size: 2rem;
  }
  
  .ContactForm-subtitle {
    font-size: 1rem;
  }
  
  .ContactForm-form {
    padding: 20px 15px;
  }
  
  .ContactForm-info-card {
    padding: 15px;
    gap: 15px;
  }
  
  .ContactForm-info-icon-wrapper {
    width: 45px;
    height: 45px;
  }
  
  .ContactForm-info-icon {
    font-size: 18px;
  }
  
  .ContactForm-info-title {
    font-size: 1.1rem;
  }
  
  .ContactForm-info-text {
    font-size: 0.85rem;
  }
  
  .ContactForm-form-title {
    font-size: 1.5rem;
  }
  
  .ContactForm-form-description {
    font-size: 0.9rem;
  }
  
  .ContactForm-input,
  .ContactForm-select,
  .ContactForm-textarea {
    padding: 12px 14px;
    font-size: 0.9rem;
  }
  
  .ContactForm-submit-button {
    padding: 14px 18px;
    font-size: 1rem;
  }
  
  .ContactForm-success-container {
    padding: 40px 20px;
  }
}

.ContactForm-success-icon {
    width: 60px;
    height: 60px;
  }
  
  .ContactForm-success-title {
    font-size: 1.75rem;
  }
  
  .ContactForm-success-message {
    font-size: 1rem;
  }
  
  .ContactForm-success-button {
    padding: 12px 24px;
    font-size: 0.9rem;
  }
  
/* Effets de transition avancés */
.ContactForm-input,
.ContactForm-select,
.ContactForm-textarea {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.ContactForm-submit-button {
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Amélioration de l'accessibilité */
.ContactForm-input:focus-visible,
.ContactForm-select:focus-visible,
.ContactForm-textarea:focus-visible {
  outline: 2px solid #3b82f6;
  outline: 2px solid var(--ContactForm-border-focus);
  outline-offset: 2px;
}

.ContactForm-submit-button:focus-visible {
  outline: 2px solid #ffffff;
  outline: 2px solid var(--ContactForm-white);
  outline-offset: 2px;
}

/* Animation pour le message de succès */
@keyframes ContactForm-checkmark {
  0% {
    stroke-dashoffset: 100;
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

.ContactForm-success-icon svg {
  animation: ContactForm-checkmark 0.6s ease-in-out forwards;
}

/* Effet de vague subtil pour le fond */
.ContactForm-wave-effect {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100px;
  background: url("data:image/svg+xml;utf8,<svg viewBox=\"0 0 1200 120\" xmlns=\"http://www.w3.org/2000/svg\" preserveAspectRatio=\"none\"><path d=\"M0,0V46.29c47.79,22.2,103.59,32.17,158,28,70.36-5.37,136.33-33.31,206.8-37.5C438.64,32.43,512.34,53.67,583,72.05c69.27,18,138.3,24.88,209.4,13.08,36.15-6,69.85-17.84,104.45-29.34C989.49,25,1113-14.29,1200,52.47V0Z\" fill=\"%23f8fafc\" opacity=\".25\"/><path d=\"M0,0V15.81C13,36.92,27.64,56.86,47.69,72.05,99.41,111.27,165,111,224.58,91.58c31.15-10.15,60.09-26.07,89.67-39.8,40.92-19,84.73-46,130.83-49.67,36.26-2.85,70.9,9.42,98.6,31.56,31.77,25.39,62.32,62,103.63,73,40.44,10.79,81.35-6.69,119.13-24.28s75.16-39,116.92-43.05c59.73-5.85,113.28,22.88,168.9,38.84,30.2,8.66,59,6.17,87.09-7.5,22.43-10.89,48-26.93,60.65-49.24V0Z\" fill=\"%23f8fafc\" opacity=\".5\"/><path d=\"M0,0V5.63C149.93,59,314.09,71.32,475.83,42.57c43-7.64,84.23-20.12,127.61-26.46,59-8.63,112.48,12.24,165.56,35.4C827.93,77.22,886,95.24,951.2,90c86.53-7,172.46-45.71,248.8-84.81V0Z\" fill=\"%23f8fafc\"/></svg>");
  background-size: cover;
  z-index: 1;
  opacity: 0.7;
}

/* Amélioration des ombres portées */
.ContactForm-info-card,
.ContactForm-form,
.ContactForm-success-container {
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}

/* Effet de flottement pour les cartes d'information */
.ContactForm-info-card:hover {
  animation: ContactForm-float 3s ease-in-out infinite;
}

/* Style personnalisé pour le sélecteur */
.ContactForm-select {
  background-image: url("data:image/svg+xml;utf8,<svg fill=\"%236b7280\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M7 10l5 5 5-5z\"/></svg>");
  transition: all 0.3s ease;
}

.ContactForm-select:hover {
  background-image: url("data:image/svg+xml;utf8,<svg fill=\"%230C447E\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M7 10l5 5 5-5z\"/></svg>");
}

/* Effet de gradient animé pour le bouton */
@keyframes ContactForm-gradientAnimation {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

.ContactForm-submit-button {
  background-size: 200% 200%;
  animation: ContactForm-gradientAnimation 3s ease infinite;
}

/* Style pour les écrans très larges */
@media (min-width: 1600px) {
  .ContactForm-container {
    max-width: 1400px;
  }
  
  .ContactForm-content {
    grid-template-columns: 450px 1fr;
    gap: 80px;
  }
  
  .ContactForm-title {
    font-size: 4rem;
  }
  
  .ContactForm-subtitle {
    font-size: 1.5rem;
  }
}
:root {
  --MapComponent-primary-blue: #0F447E;
  --MapComponent-secondary-blue: #0F447E;
  --MapComponent-text-primary: #1f2937;
  --MapComponent-text-secondary: #6b7280;
  --MapComponent-text-muted: #9ca3af;
  --MapComponent-background: #f8fafc;
  --MapComponent-white: #ffffff;
  --MapComponent-border: #e5e7eb;
  --MapComponent-border-focus: #3b82f6;
  --MapComponent-red: #ff0000;
  --MapComponent-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  --MapComponent-shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
  --MapComponent-shadow-xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  --MapComponent-gradient: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
}

/* Container principal - STRUCTURE ADAPTÉE À VOTRE JSX */
.map-container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  min-height: 70vh; /* Hauteur minimale pour éviter que la section soit trop petite */
  padding: 40px;
  background: #ffffff;
  background: var(--MapComponent-white);
  border-radius: 24px;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
  box-shadow: var(--MapComponent-shadow-lg);
  border: 1px solid #e5e7eb;
  border: 1px solid var(--MapComponent-border);
  font-family: 'Inter', sans-serif;
  position: relative;
  overflow: hidden;
}

.map-container::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  background: var(--MapComponent-gradient);
  z-index: 1;
}

/* Iframe de la carte - HAUTEUR AUGMENTÉE */
.map-iframe {
  width: 100%;
  height: 600px; /* Hauteur principale augmentée */
  min-height: 600px; /* Hauteur minimale garantie */
  border: none;
  display: block;
  border-radius: 20px;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  box-shadow: var(--MapComponent-shadow);
  border: 2px solid #e5e7eb;
  border: 2px solid var(--MapComponent-border);
  transition: all 0.3s ease;
}

.map-iframe:hover {
  transform: translateY(-2px);
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  box-shadow: var(--MapComponent-shadow-xl);
  border-color: #3b82f6;
  border-color: var(--MapComponent-border-focus);
}

/* Wrapper pour l'iframe si vous l'ajoutez */
.map-wrapper {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  box-shadow: var(--MapComponent-shadow);
  border: 2px solid #e5e7eb;
  border: 2px solid var(--MapComponent-border);
  transition: all 0.3s ease;
}

.map-wrapper:hover {
  transform: translateY(-5px);
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  box-shadow: var(--MapComponent-shadow-xl);
  border-color: #3b82f6;
  border-color: var(--MapComponent-border-focus);
}

.map-wrapper .map-iframe {
  border: none;
  border-radius: 0;
  box-shadow: none;
}

/* Styles pour les autres éléments si vous les ajoutez */
.map-header {
  text-align: center;
  margin-bottom: 40px;
}

.map-title {
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 1rem;
  line-height: 1.2;
  color: #0F447E;
  color: var(--MapComponent-primary-blue);
}

.map-subtitle {
  font-size: 1.1rem;
  color: #6b7280;
  color: var(--MapComponent-text-secondary);
  font-weight: 400;
  max-width: 600px;
  margin: 0 auto;
}

.map-info {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-top: 30px;
  padding: 20px;
  background: linear-gradient(135deg, rgba(12, 68, 126, 0.05) 0%, rgba(16, 79, 146, 0.05) 100%);
  border-radius: 16px;
  border: 1px solid rgba(12, 68, 126, 0.1);
}

.map-location-icon {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  background: var(--MapComponent-gradient);
  display: flex;
  align-items: center;
  justify-content: center;
}

.map-location-icon::before {
  content: '📍';
  font-size: 24px;
  color: #ffffff;
  color: var(--MapComponent-white);
}

.map-address {
  flex: 1 1;
  text-align: left;
}

.map-address-title {
  font-size: 1.2rem;
  font-weight: 600;
  color: #0F447E;
  color: var(--MapComponent-primary-blue);
  margin-bottom: 4px;
}

.map-address-text {
  font-size: 1rem;
  color: #6b7280;
  color: var(--MapComponent-text-secondary);
  margin: 0;
}

.map-actions {
  display: flex;
  gap: 15px;
  margin-top: 30px;
  justify-content: center;
}

.map-action-button {
  padding: 14px 28px;
  border: none;
  border-radius: 12px;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 10px;
  transition: all 0.3s ease;
  font-family: 'Inter', sans-serif;
}

.map-action-button.primary {
  background: linear-gradient(135deg, #0F447E 0%, #104f92 100%);
  background: var(--MapComponent-gradient);
  color: #ffffff;
  color: var(--MapComponent-white);
}

.map-action-button.secondary {
  background: #ffffff;
  background: var(--MapComponent-white);
  color: #0F447E;
  color: var(--MapComponent-primary-blue);
  border: 2px solid #0F447E;
  border: 2px solid var(--MapComponent-primary-blue);
}

.map-action-button:hover {
  transform: translateY(-2px);
}

.map-action-button.primary:hover {
  box-shadow: 0 10px 30px 0 rgba(12, 68, 126, 0.3);
}

.map-action-button.secondary:hover {
  background: #0F447E;
  background: var(--MapComponent-primary-blue);
  color: #ffffff;
  color: var(--MapComponent-white);
}

.map-status {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 20px;
  padding: 12px 20px;
  background: rgba(16, 185, 129, 0.1);
  border: 1px solid rgba(16, 185, 129, 0.2);
  border-radius: 10px;
}

.map-status-icon {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #10b981;
}

.map-status-text {
  font-size: 0.9rem;
  color: #059669;
  font-weight: 500;
}

/* Responsive Design */
@media (max-width: 1024px) {
  .map-container {
    padding: 30px;
    min-height: 60vh;
  }
  
  .map-iframe {
    height: 500px;
    min-height: 500px;
  }
  
  .map-title {
    font-size: 2.2rem;
  }
  
  .map-actions {
    flex-direction: column;
    align-items: center;
  }
  
  .map-action-button {
    width: 100%;
    max-width: 300px;
  }
}

@media (max-width: 768px) {
  .map-container {
    padding: 25px 20px;
    min-height: 50vh;
  }
  
  .map-iframe {
    height: 450px;
    min-height: 450px;
  }
  
  .map-title {
    font-size: 2rem;
  }
  
  .map-subtitle {
    font-size: 1rem;
  }
  
  .map-info {
    flex-direction: column;
    text-align: center;
    gap: 15px;
  }
  
  .map-address {
    text-align: center;
  }
  
  .map-action-button {
    padding: 12px 24px;
    font-size: 0.9rem;
  }
}

@media (max-width: 480px) {
  .map-container {
    padding: 20px 15px;
    min-height: 45vh;
  }
  
  .map-iframe {
    height: 400px;
    min-height: 400px;
  }
  
  .map-title {
    font-size: 1.75rem;
  }
  
  .map-subtitle {
    font-size: 0.9rem;
  }
  
  .map-location-icon {
    width: 40px;
    height: 40px;
  }
  
  .map-location-icon::before {
    font-size: 20px;
  }
  
  .map-address-title {
    font-size: 1.1rem;
  }
  
  .map-address-text {
    font-size: 0.9rem;
  }
  
  .map-action-button {
    padding: 10px 20px;
    font-size: 0.85rem;
  }
}

/* Style pour les écrans très larges */
@media (min-width: 1600px) {
  .map-container {
    max-width: 1400px;
    padding: 50px;
    min-height: 80vh;
  }
  
  .map-iframe {
    height: 700px;
    min-height: 700px;
  }
  
  .map-title {
    font-size: 3rem;
  }
  
  .map-subtitle {
    font-size: 1.25rem;
  }
}
/* --- HERO SECTION --- */
.heroC {
    position: relative;
    width: 100%;
    height: 40vh;
    overflow: hidden;
}
  
.heroC-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: brightness(0.7);
    border-bottom-left-radius: 10%;
    border-bottom-right-radius: 10%;
}
  
.heroC-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 3.5rem;
    font-weight: bold;
    text-align: center;
}

/* --- CONTACT SECTION --- */
.contacts-section {
    display: flex;
    justify-content: center; /* Centre le contenu */
    align-items: center; /* Aligne les éléments verticalement */
    padding: 50px;
    gap: 50px; /* Espace entre les éléments */
}

/* Appliquer une largeur pour que la section ne prenne pas tout l'écran */
.contacts-form, .contacts-info {
    width: 45%;
    justify-content: center;
}

.contacts-form {
    background: #fff;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
    justify-content: center;
   
}

.contacts-form h2 {
    margin-bottom: 20px;
    color: #0C447E;
    text-align: center;
}

/* Ajout des labels */
.forms-group {
    margin-bottom: 10px;
    display: flex;
    flex-direction: column; /* Met les labels au-dessus des inputs */
    justify-content: center;
}

.forms-group label {
    font-weight: bold;
    margin-bottom: 5px;
    color: #0C447E;
}

.forms-group input,
.forms-group select,
.forms-group textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 10px; /* Arrondi des bords */
    font-size: 16px;
    justify-content: center;
}

/* Ajustement pour les inputs côte à côte */
.rows {
    display: flex;
    gap: 15px;
}

/* Ajustement de la hauteur du textarea */
textarea {
    height: 100px;
    resize: none;
}

/* Bouton */
.buttonC {
    background: #0C447E;
    color: #fff;
    padding: 12px;
    border: none;
    cursor: pointer;
    width: 100%;
    border-radius: 8px; /* Arrondi des bords */
    font-size: 16px;
    transition: background 0.3s;
}

.buttonC:hover {
    background: #E30613;
}

/* --- CONTACT INFO SECTION --- */
.contacts-info {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.info-box {
    background: #ffffff;
    padding: 20px;
    border-radius: 10px;
    text-align: center;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
}

.info-box:hover {
    background: #0C447E;
    padding: 20px;
    border-radius: 10px;
    text-align: center;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
}

.info-box i {
    font-size: 24px;
    color: #E30613;
}

.info-box:hover i {
    font-size: 24px;
    color: #FFFFFF;
}

.info-box h3 {
    margin: 10px 0;
    font-size: 18px;
    color: #0C447E;
}

.info-box:hover h3 {
    margin: 10px 0;
    font-size: 18px;
    color: #FFFFFF;
}

.info-box p {
    color: #000000;
    font-size: 18px;
    text-align: center;
}

.info-box:hover p {
    color: #FFFFFF;
    font-size: 18px;
    text-align: center;
}

/* --- MAP SECTION --- */
.map-section {
    display: flex;
    justify-content: center;
    margin: 30px auto;
    max-width: 90%; 
}

.map-section iframe {
    width: 100%;
    border-radius: 10px; 
}


/* Header fixé en haut */
.MainMenu-fixed-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100;
  filter: none !important;
  pointer-events: auto;
}

/* Styles généraux */
.MainMenu-top-bar {
  background-color: #0f447e;
  height: 80px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 60px;
  color: white;
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  min-width: 320px;
  transform: translateY(0);
  opacity: 1;
  visibility: visible;
  transition: transform 0.4s ease, opacity 0.4s ease, visibility 0.4s ease;
  will-change: transform, opacity, visibility;
  position: relative;
  z-index: 101;
}

.MainMenu-contact-info {
  display: flex;
  gap: 30px;
  align-items: center;
}

.MainMenu-contact-item {
  display: flex;
  align-items: center;
  gap: 8px;
}

.MainMenu-icon {
  width: 25px;
  height: 25px;
}

.MainMenu-social-links {
  display: flex;
  align-items: center;
  gap: 0px;
}

.MainMenu-social-link {
  color: white;
  display: flex;
  align-items: center;
  transition: opacity 0.3s ease;
  text-decoration: none;
}

.MainMenu-social-link:hover {
  opacity: 0.8;
}

.MainMenu-manleft {
  padding-right: 70px;
}

.MainMenu-nav-bar {
  background-color: white;
  height: 80px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 60px;
  min-width: 320px;
  transition: transform 0.4s ease, box-shadow 0.4s ease;
  will-change: transform, box-shadow;
  position: absolute;
  top: 80px; /* Positionné directement sous la top-bar */
  left: 0;
  width: 100%;
  pointer-events: auto;
  z-index: 100;
}

.MainMenu-nav-bar.MainMenu-scrolled {
  position: fixed;
  top: 0; /* Se positionne tout en haut quand scrolled */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.MainMenu-logo {
  width: 142px;
  height: 70px;
  object-fit: contain;
}

.MainMenu-burger-btn {
  display: none;
  font-size: 30px;
  background: none;
  border: none;
  color: #0f447e;
  cursor: pointer;
  transition: transform 0.3s ease;
  padding: 5px;
  z-index: 1001;
}

.MainMenu-burger-btn.MainMenu-open {
  transform: rotate(90deg);
}

.MainMenu-nav-links {
  display: flex;
  gap: 75px;
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  font-weight: 500;
  list-style: none;
  transition: all 0.3s ease;
  pointer-events: auto;
}

.MainMenu-nav-links.MainMenu-desktop {
  display: flex !important;
}

.MainMenu-nav-link {
  color: #656565;
  text-decoration: none;
  transition: color 0.3s;
  white-space: nowrap;
}

.MainMenu-nav-link:hover {
  color: #0f447e;
}

.MainMenu-nav-link.MainMenu-active {
  color: #0f447e;
  font-weight: 600;
}

.MainMenu-connect-btn {
  background-color: #0f447e;
  color: white;
  border: none;
  border-radius: 8px;
  padding: 13px 25px;
  font-family: 'Poppins', sans-serif;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.3s;
  text-decoration: none !important;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

.MainMenu-connect-btn:hover {
  background-color: #0a305b;
}

/* Styles pour l'avatar et le profil */
.MainMenu-profile-container {
  position: relative;
}

.MainMenu-avatar {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background-color: #0f447e;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
  border: 2px solid transparent;
  letter-spacing: 1px;
}

.MainMenu-avatar:hover {
  background-color: #0a305b;
  border-color: #0f447e;
}

/* Avatar mobile - plus petit */
.MainMenu-mobile-avatar {
  width: 35px;
  height: 35px;
  font-size: 14px;
}

/* Container pour mobile (avatar + burger) */
.MainMenu-mobile-right {
  display: flex;
  align-items: center;
  gap: 15px;
}

.MainMenu-profile-dropdown {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  background-color: white;
  border-radius: 12px;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
  min-width: 200px;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  transition: all 0.3s ease;
  z-index: 1000;
  border: 1px solid #e5e7eb;
}

/* Dropdown mobile - position différente */
.MainMenu-mobile-dropdown {
  position: fixed;
  top: 65px;
  right: 15px;
  left: auto;
  min-width: 180px;
}

.MainMenu-profile-container:hover .MainMenu-profile-dropdown,
.MainMenu-profile-dropdown:hover {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.MainMenu-profile-dropdown::before {
  content: '';
  position: absolute;
  top: -8px;
  right: 20px;
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid white;
  filter: drop-shadow(0 -2px 2px rgba(0, 0, 0, 0.1));
}

/* Pas de flèche pour le dropdown mobile */
.MainMenu-mobile-dropdown::before {
  right: 30px;
}

.MainMenu-dropdown-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 15px 20px;
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  color: #374151;
  text-decoration: none;
  transition: all 0.2s ease;
  border: none;
  background: none;
  width: 100%;
  cursor: pointer;
  border-bottom: 1px solid #f3f4f6;
}

.MainMenu-dropdown-item:last-child {
  border-bottom: none;
}

.MainMenu-dropdown-item:hover {
  background-color: #f9fafb;
  color: #0f447e;
}

.MainMenu-dropdown-item.MainMenu-logout-item:hover {
  background-color: #fef2f2;
  color: #dc2626;
}

.MainMenu-dropdown-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

/* Masquer la top-bar de manière fluide */
.MainMenu-top-bar.MainMenu-hidden {
  transform: translateY(-100%);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

/* Ajustement du body pour éviter les sauts */
body.MainMenu-has-menu {
  padding-top: 160px; /* Hauteur totale = top-bar (80px) + nav-bar (80px) */
  transition: padding-top 0.4s ease;
}

body.MainMenu-top-bar-hidden {
  padding-top: 80px; /* Seulement nav-bar quand top-bar est caché */
}

/* Style pour le menu mobile */
.MainMenu-nav-links.MainMenu-open {
  display: flex;
  background-color: white;
  pointer-events: auto;
}

/* Amélioration du dropdown pour mobile/touch */
@media (hover: none) and (pointer: coarse) {
  .MainMenu-profile-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    position: fixed;
    top: auto;
    bottom: 0;
    left: 0;
    right: 0;
    border-radius: 12px 12px 0 0;
    min-width: auto;
  }
  
  .MainMenu-profile-dropdown::before {
    display: none;
  }
}

@media (max-width: 768px) {
  body.MainMenu-has-menu {
    padding-top: 60px; /* Seulement la hauteur du nav-bar sur mobile */
  }
  
  .MainMenu-top-bar {
    display: none;
  }

  .MainMenu-nav-bar {
    height: 60px;
    padding: 0 20px;
    justify-content: space-between;
    position: fixed; /* Toujours fixe sur mobile */
    top: 0;
    left: 0;
    width: 100%;
  }
  
  .MainMenu-burger-btn {
    display: block;
  }

  .MainMenu-nav-links {
    display: none;
    flex-direction: column;
    gap: 20px;
    position: absolute;
    top: 60px;
    left: 0;
    width: 100%;
    background-color: white;
    padding: 20px;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    z-index: 999;
    box-sizing: border-box;
    max-height: calc(100vh - 60px);
    overflow-y: auto;
  }

  .MainMenu-nav-links.MainMenu-open {
    display: flex;
  }

  .MainMenu-desktop-only {
    display: none !important;
  }

  .MainMenu-nav-link.MainMenu-mobile-only {
    display: block;
    margin-top: 10px;
    border-top: 1px solid #eee;
    padding-top: 15px;
    font-weight: 600;
    color: #0f447e;
  }

  .MainMenu-logo {
    width: 100px;
    height: auto;
  }
}

/* Pour les très petits écrans */
@media (max-width: 375px) {
  .MainMenu-nav-bar {
    padding: 0 10px;
  }
  
  .MainMenu-logo {
    width: 80px;
  }
}

/* Pour les appareils qui utilisent l'affichage desktop sur mobile */
@media screen and (hover: none) and (pointer: coarse) {
  .MainMenu-burger-btn {
    display: block;
  }
  
  .MainMenu-nav-links:not(.MainMenu-open) {
    display: none;
  }
  
  .MainMenu-connect-btn.MainMenu-desktop-only {
    display: none !important;
  }
}

/* Assurer que le bouton burger apparaît toujours lorsqu'on force l'affichage desktop */
@media (hover: none) {
  .MainMenu-burger-btn {
    display: block;
  }
}


:root {
  --LoginFormComponent-primary-blue: #0F447E;
  --LoginFormComponent-secondary-blue: #0F447E;
  --LoginFormComponent-text-primary: #1f2937;
  --LoginFormComponent-text-secondary: #6b7280;
  --LoginFormComponent-text-muted: #9ca3af;
  --LoginFormComponent-background: #f8fafc;
  --LoginFormComponent-white: #ffffff;
  --LoginFormComponent-border: #e5e7eb;
  --LoginFormComponent-border-focus: #3b82f6;
  --LoginFormComponent-error: #e30613;
  --LoginFormComponent-success: #10b981;
  --LoginFormComponent-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  --LoginFormComponent-shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
}

.LoginFormComponent-container {
  min-height: 100vh;
  background: #f8fafc;
  background: var(--LoginFormComponent-background);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  font-family: 'Inter', sans-serif;
  margin-bottom: 50px;
}

.LoginFormComponent-card {
  width: 100%;
  max-width: 1000px;
  background: #ffffff;
  background: var(--LoginFormComponent-white);
  border-radius: 1rem;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
  box-shadow: var(--LoginFormComponent-shadow-lg);
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 600px;
}

/* Section gauche */
.LoginFormComponent-left {
  background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3rem 2rem;
  position: relative;
}

.LoginFormComponent-left::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url("data:image/svg+xml,<svg width=\"60\" height=\"60\" viewBox=\"0 0 60 60\" xmlns=\"http://www.w3.org/2000/svg\"><g fill=\"none\" fill-rule=\"evenodd\"><g fill=\"%23f1f5f9\" fill-opacity=\"0.4\"><circle cx=\"7\" cy=\"7\" r=\"7\"/></g></svg>") repeat;
  opacity: 0.5;
}

.LoginFormComponent-logo-section {
  text-align: center;
  position: relative;
  z-index: 1;
}

.LoginFormComponent-logo {
  width: 80px;
  height: 80px;
  margin-bottom: 1.5rem;
  object-fit: contain;
}

.LoginFormComponent-main-title {
  font-size: 2rem;
  font-weight: 700;
  color: #0F447E;
  color: var(--LoginFormComponent-primary-blue);
  margin-bottom: 0.5rem;
}
.LoginFormComponent-main-title-tahaga{
  color: #0F447E;
  color: var(--LoginFormComponent-primary-blue);
}
.LoginFormComponent-main-subtitle {
  font-size: 1.125rem;
  color: #6b7280;
  color: var(--LoginFormComponent-text-secondary);
  font-weight: 400;
}

/* Section droite */
.LoginFormComponent-right {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3rem 2rem;
}

.LoginFormComponent-form-container {
  width: 100%;
  max-width: 400px;
}

.LoginFormComponent-form-header {
  text-align: center;
  margin-bottom: 2rem;
}

.LoginFormComponent-form-title {
  font-size: 1.5rem;
  font-weight: 600;
  color: #0F447E;
  color: var( --LoginFormComponent-primary-blue);
  margin-bottom: 0.5rem;
}

.LoginFormComponent-form-subtitle {
  color: #6b7280;
  color: var(--LoginFormComponent-text-secondary);
  font-size: 0.875rem;
}
.LoginFormComponent-Connectez-titre{
   color: #e30613;
   color: var(--LoginFormComponent-error);
}

/* Formulaire */
.LoginFormComponent-form {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.LoginFormComponent-form-group {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.LoginFormComponent-label {
  font-size: 0.875rem;
  font-weight: 500;
  color: #1f2937;
  color: var(--LoginFormComponent-text-primary);
}

.LoginFormComponent-required {
  color: #e30613;
  color: var(--LoginFormComponent-error);
}

/* Input */
.LoginFormComponent-input-wrapper {
  position: relative;
  display: flex;
  align-items: center;
}

.LoginFormComponent-input-icon {
  position: absolute;
  left: 1rem;
  color: #9ca3af;
  color: var(--LoginFormComponent-text-muted);
  font-size: 0.975rem;
}

.LoginFormComponent-input {
  width: 100%;
  height: 3rem;
  border: 1px solid #e5e7eb;
  border: 1px solid var(--LoginFormComponent-border);
  border-radius: 0.5rem;
  padding: 0 1rem 0 2.5rem;
  font-size: 0.875rem;
  color: #1f2937;
  color: var(--LoginFormComponent-text-primary);
  transition: all 0.2s ease;
}

.LoginFormComponent-input:focus {
  outline: none;
  border-color: #3b82f6;
  border-color: var(--LoginFormComponent-border-focus);
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.LoginFormComponent-password-wrapper input {
  padding-right: 2.5rem;
}

/* Password toggle */
.LoginFormComponent-password-toggle {
  position: absolute;
  right: 1rem;
  background: none;
  border: none;
  cursor: pointer;
  color: #9ca3af;
  color: var(--LoginFormComponent-text-muted);
  padding: 0.25rem;
}

.LoginFormComponent-toggle-icon {
  font-size: 1rem;
}

/* Links */
.LoginFormComponent-forgot-password-link {
  text-align: right;
  margin-top: -0.5rem;
}

.LoginFormComponent-link {
  color: #0F447E;
  color: var(--LoginFormComponent-secondary-blue);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 500;
}

/* Messages */
.LoginFormComponent-message {
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  text-align: center;
}

.LoginFormComponent-success {
  background: rgba(16, 185, 129, 0.1);
  color: #10b981;
  color: var(--LoginFormComponent-success);
}

.LoginFormComponent-error {
  background: rgba(239, 68, 68, 0.1);
  color: #e30613;
  color: var(--LoginFormComponent-error);
}

/* Bouton principal */
.LoginFormComponent-submit-button {
  width: 100%;
  height: 60px;
  padding: 1rem;
  background: linear-gradient(135deg, #0F447E 0%, #0F447E 100%);
  background: linear-gradient(135deg, var(--LoginFormComponent-primary-blue) 0%, var(--LoginFormComponent-secondary-blue) 100%);
  color: #ffffff;
  color: var(--LoginFormComponent-white);
  border: none;
  border-radius: 0.75rem;
  font-size: 1rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  cursor: pointer;
  /* transition: all 0.3s ease; */
}

.LoginFormComponent-button-text {
  font-size: inherit;
}

.LoginFormComponent-button-icon {
  font-size: 1rem;
  transition: transform 0.3s ease;
}

/* .LoginFormComponent-submit-button:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px 0 rgba(12, 68, 126, 0.4);
} */

.LoginFormComponent-submit-button:hover:not(:disabled) .LoginFormComponent-button-icon {
  transform: translateX(4px);
}

.LoginFormComponent-submit-button:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

/* Spinner de chargement */
.LoginFormComponent-spinner {
  width: 20px;
  height: 20px;
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-radius: 50%;
  border-top-color: white;
  animation: LoginFormComponent-spin 1s ease-in-out infinite;
}

@keyframes LoginFormComponent-spin {
  to {
    transform: rotate(360deg);
  }
}

/* Inscription */
.LoginFormComponent-signup-text {
  text-align: center;
  font-size: 0.875rem;
  color: #6b7280;
  color: var(--LoginFormComponent-text-secondary);
  border-top: 1px solid #e5e7eb;
  border-top: 1px solid var(--LoginFormComponent-border);
  padding-top: 1.5rem;
}

.LoginFormComponent-signup-link {
  color: #0F447E;
  color: var(--LoginFormComponent-secondary-blue);
  font-weight: 600;
  text-decoration: none;
}

/* Responsive */
@media (max-width: 1024px) {
  .LoginFormComponent-card {
    grid-template-columns: 1fr;
    max-width: 500px;
  }
  
  .LoginFormComponent-main-title {
    font-size: 1.75rem;
  }
}

@media (max-width: 768px) {
  .LoginFormComponent-submit-button {
    height: 50px;
    font-size: 0.9rem;
  }
  
  .LoginFormComponent-button-text {
    font-size: 0.9rem;
  }
}

@media (max-width: 480px) {
  .LoginFormComponent-main-title {
    font-size: 1.5rem;
  }
  
  .LoginFormComponent-submit-button {
    height: 45px;
    font-size: 0.85rem;
  }
  
  .LoginFormComponent-label {
    font-size: 0.8rem;
  }
}
:root {
  --RegistrationForm-main-primary-blue: #0F447E;
  --RegistrationForm-main-secondary-blue: #0F447E;
  --RegistrationForm-main-text-primary: #1f2937;
  --RegistrationForm-main-text-secondary: #6b7280;
  --RegistrationForm-main-text-muted: #9ca3af;
  --RegistrationForm-main-background: #f8fafc;
  --RegistrationForm-main-white: #ffffff;
  --RegistrationForm-main-border: #e5e7eb;
  --RegistrationForm-main-border-focus: #3b82f6;
  --RegistrationForm-main-error: #e30613;
  --RegistrationForm-main-success: #10b981;
  --RegistrationForm-main-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  --RegistrationForm-main-shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
}

.RegistrationForm-main-container {
  min-height: 100vh;
  background: #f8fafc;
  background: var(--RegistrationForm-main-background);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  font-family: 'Inter', sans-serif;
  margin-bottom: 50px;
}

.RegistrationForm-main-card {
  width: 100%;
  max-width: 1200px;
  background: #ffffff;
  background: var(--RegistrationForm-main-white);
  border-radius: 1rem;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
  box-shadow: var(--RegistrationForm-main-shadow-lg);
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 650px;
}

/* Section gauche */
.RegistrationForm-main-left {
  background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
  display: flex;
  align-items: center;
  justify-content: center;
 /* pains: 3rem 2rem; */
  position: relative;
}

.RegistrationForm-main-left::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url("data:image/svg+xml,<svg width=\"60\" height=\"60\" viewBox=\"0 0 60 60\" xmlns=\"http://www.w3.org/2000/svg\"><g fill=\"none\" fill-rule=\"evenodd\"><g fill=\"%23f1f5f9\" fill-opacity=\"0.4\"><circle cx=\"7\" cy=\"7\" r=\"7\"/></g></svg>") repeat;
  opacity: 0.5;
}

.RegistrationForm-main-logo-section {
  text-align: center;
  position: relative;
  z-index: 1;
}

.RegistrationForm-main-logo {
  width: 80px;
  height: 80px;
  margin-bottom: 1.5rem;
  object-fit: contain;
}

.RegistrationForm-main-title {
  font-size: 2rem;
  font-weight: 700;
  color: #0F447E;
  color: var(--RegistrationForm-main-primary-blue);
  margin-bottom: 0.5rem;
}

.RegistrationForm-main-title-tahaga {
  color: #0F447E;
  color: var(--RegistrationForm-main-primary-blue);
}

.RegistrationForm-main-subtitle {
  font-size: 1.125rem;
  color: #6b7280;
  color: var(--RegistrationForm-main-text-secondary);
  font-weight: 400;
  line-height: 1.5;
}

/* Section droite */
.RegistrationForm-main-right {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3rem 2rem;
}

.RegistrationForm-main-form-container {
  width: 100%;
  max-width: 450px;
}

.RegistrationForm-main-form-header {
  text-align: center;
  margin-bottom: 2rem;
}

.RegistrationForm-main-form-title {
  font-size: 1.5rem;
  font-weight: 600;
  color: #0F447E;
  color: var(--RegistrationForm-main-primary-blue);
  margin-bottom: 0.5rem;
}

.RegistrationForm-main-form-subtitle {
  color: #6b7280;
  color: var(--RegistrationForm-main-text-secondary);
  font-size: 0.875rem;
}

.RegistrationForm-main-inscription-titre {
  color: #e30613;
  color: var(--RegistrationForm-main-error);
}

/* Formulaire */
.RegistrationForm-main-form {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.RegistrationForm-main-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 1rem;
  gap: 1rem;
}

.RegistrationForm-main-form-group {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.RegistrationForm-main-label {
  font-size: 0.875rem;
  font-weight: 500;
  color: #1f2937;
  color: var(--RegistrationForm-main-text-primary);
}

.RegistrationForm-main-required {
  color: #e30613;
  color: var(--RegistrationForm-main-error);
}

/* Input */
.RegistrationForm-main-input-wrapper {
  position: relative;
  display: flex;
  align-items: center;
}

.RegistrationForm-main-input-icon {
  position: absolute;
  left: 1rem;
  color: #9ca3af;
  color: var(--RegistrationForm-main-text-muted);
  font-size: 0.975rem;
  z-index: 1;
}

.RegistrationForm-main-input {
  width: 100%;
  height: 3rem;
  border: 1px solid #e5e7eb;
  border: 1px solid var(--RegistrationForm-main-border);
  border-radius: 0.5rem;
  padding: 0 1rem 0 2.5rem;
  font-size: 0.875rem;
  color: #1f2937;
  color: var(--RegistrationForm-main-text-primary);
  transition: all 0.2s ease;
}

.RegistrationForm-main-input:focus {
  outline: none;
  border-color: #3b82f6;
  border-color: var(--RegistrationForm-main-border-focus);
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.RegistrationForm-main-password-wrapper input {
  padding-right: 2.5rem;
}

/* Password toggle */
.RegistrationForm-main-password-toggle {
  position: absolute;
  right: 1rem;
  background: none;
  border: none;
  cursor: pointer;
  color: #9ca3af;
  color: var(--RegistrationForm-main-text-muted);
  padding: 0.25rem;
  z-index: 1;
}

.RegistrationForm-main-toggle-icon {
  font-size: 1rem;
}

/* Field errors */
.RegistrationForm-main-field-error {
  font-size: 0.75rem;
  color: #e30613;
  color: var(--RegistrationForm-main-error);
  margin-top: 0.25rem;
}

/* Messages */
.RegistrationForm-main-message {
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  text-align: center;
}

.RegistrationForm-main-success {
  background: rgba(16, 185, 129, 0.1);
  color: #10b981;
  color: var(--RegistrationForm-main-success);
}

.RegistrationForm-main-error {
  background: rgba(239, 68, 68, 0.1);
  color: #e30613;
  color: var(--RegistrationForm-main-error);
}

/* Bouton principal */
.RegistrationForm-main-submit-button {
  width: 100%;
  height: 60px;
  padding: 1rem;
  background: linear-gradient(135deg, #0F447E 0%, #0F447E 100%);
  background: linear-gradient(135deg, var(--RegistrationForm-main-primary-blue) 0%, var(--RegistrationForm-main-secondary-blue) 100%);
  color: #ffffff;
  color: var(--RegistrationForm-main-white);
  border: none;
  border-radius: 0.75rem;
  font-size: 1rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  cursor: pointer;
  transition: all 0.3s ease;
}

.RegistrationForm-main-button-text {
  font-size: inherit;
}

.RegistrationForm-main-button-icon {
  font-size: 1rem;
  transition: transform 0.3s ease;
}

/* .RegistrationForm-main-submit-button:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px 0 rgba(12, 68, 126, 0.4);
} */

.RegistrationForm-main-submit-button:hover:not(:disabled) .RegistrationForm-main-button-icon {
  transform: translateX(4px);
}

.RegistrationForm-main-submit-button:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

/* Spinner de chargement */
.RegistrationForm-main-spinner {
  width: 20px;
  height: 20px;
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-radius: 50%;
  border-top-color: white;
  animation: RegistrationForm-main-spin 1s ease-in-out infinite;
}

@keyframes RegistrationForm-main-spin {
  to {
    transform: rotate(360deg);
  }
}

/* Connexion */
.RegistrationForm-main-login-text {
  text-align: center;
  font-size: 0.875rem;
  color: #6b7280;
  color: var(--RegistrationForm-main-text-secondary);
  border-top: 1px solid #e5e7eb;
  border-top: 1px solid var(--RegistrationForm-main-border);
  padding-top: 1.5rem;
}

.RegistrationForm-main-login-link {
  color: #0F447E;
  color: var(--RegistrationForm-main-secondary-blue);
  font-weight: 600;
  text-decoration: none;
}

.RegistrationForm-main-login-link:hover {
  text-decoration: underline;
}

/* Conteneur principal du téléphone */
.RegistrationForm-main-phone-input-container {
  position: relative;
  display: flex;
  align-items: stretch;
  width: 100%;
  border: 1px solid #e5e7eb;
  border: 1px solid var(--RegistrationForm-main-border);
  border-radius: 0.5rem;
  transition: all 0.2s ease;
  background: #ffffff;
  background: var(--RegistrationForm-main-white);
}

.RegistrationForm-main-phone-input-container:focus-within {
  border-color: #3b82f6;
  border-color: var(--RegistrationForm-main-border-focus);
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

/* Sélecteur de pays */
.RegistrationForm-main-country-selector {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0 0.75rem;
  background: #f8fafc;
  background: var(--RegistrationForm-main-background);
  border-right: 1px solid #e5e7eb;
  border-right: 1px solid var(--RegistrationForm-main-border);
  border-radius: 0.5rem 0 0 0.5rem;
  cursor: pointer;
  transition: all 0.2s ease;
  min-width: 80px;
  white-space: nowrap;
  -webkit-user-select: none;
          user-select: none;
}

.RegistrationForm-main-country-selector:hover {
  background: #f1f5f9;
}

.RegistrationForm-main-country-selector.active {
  background: #e2e8f0;
  border-right-color: #3b82f6;
  border-right-color: var(--RegistrationForm-main-border-focus);
}

.RegistrationForm-main-country-flag {
  width: 16px;
  height: 12px;
  object-fit: cover;
  border-radius: 2px;
  flex-shrink: 0;
}

.RegistrationForm-main-country-code {
  font-size: 0.875rem;
  font-weight: 500;
  color: #1f2937;
  color: var(--RegistrationForm-main-text-primary);
}

.RegistrationForm-main-country-chevron {
  font-size: 0.75rem;
  color: #9ca3af;
  color: var(--RegistrationForm-main-text-muted);
  transition: transform 0.2s ease;
  flex-shrink: 0;
}

.RegistrationForm-main-country-chevron.active {
  transform: rotate(180deg);
}

/* Input téléphone */
.RegistrationForm-main-phone-input {
  flex: 1 1;
  height: 3rem;
  border: none;
  padding: 0 1rem;
  font-size: 0.875rem;
  color: #1f2937;
  color: var(--RegistrationForm-main-text-primary);
  background: transparent;
  border-radius: 0 0.5rem 0.5rem 0;
  outline: none;
}

.RegistrationForm-main-phone-input::placeholder {
  color: #9ca3af;
  color: var(--RegistrationForm-main-text-muted);
}

/* Dropdown */
.RegistrationForm-main-country-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  background: #ffffff;
  background: var(--RegistrationForm-main-white);
  border: 1px solid #e5e7eb;
  border: 1px solid var(--RegistrationForm-main-border);
  border-radius: 0.75rem;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  z-index: 1000;
  max-height: 300px;
  overflow: hidden;
  animation: RegistrationForm-main-dropdown-appear 0.2s ease-out;
}

@keyframes RegistrationForm-main-dropdown-appear {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Container de recherche */
.RegistrationForm-main-search-container {
  padding: 0.75rem;
  border-bottom: 1px solid #e5e7eb;
  border-bottom: 1px solid var(--RegistrationForm-main-border);
  background: #f8fafc;
  background: var(--RegistrationForm-main-background);
}

.RegistrationForm-main-search-wrapper {
  position: relative;
  display: flex;
  align-items: center;
}

.RegistrationForm-main-search-icon {
  position: absolute;
  left: 0.75rem;
  color: #9ca3af;
  color: var(--RegistrationForm-main-text-muted);
  font-size: 0.875rem;
  z-index: 1;
}

.RegistrationForm-main-search-input {
  width: 100%;
  height: 2.5rem;
  border: 1px solid #e5e7eb;
  border: 1px solid var(--RegistrationForm-main-border);
  border-radius: 0.5rem;
  padding: 0 2.5rem 0 2.5rem;
  font-size: 0.875rem;
  color: #1f2937;
  color: var(--RegistrationForm-main-text-primary);
  background: #ffffff;
  background: var(--RegistrationForm-main-white);
  transition: all 0.2s ease;
}

.RegistrationForm-main-search-input:focus {
  outline: none;
  border-color: #3b82f6;
  border-color: var(--RegistrationForm-main-border-focus);
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.1);
}

.RegistrationForm-main-search-input::placeholder {
  color: #9ca3af;
  color: var(--RegistrationForm-main-text-muted);
}

.RegistrationForm-main-clear-search {
  position: absolute;
  right: 0.75rem;
  background: none;
  border: none;
  cursor: pointer;
  color: #9ca3af;
  color: var(--RegistrationForm-main-text-muted);
  padding: 0.25rem;
  border-radius: 0.25rem;
  transition: all 0.2s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}

.RegistrationForm-main-clear-search:hover {
  color: #1f2937;
  color: var(--RegistrationForm-main-text-primary);
  background: rgba(0, 0, 0, 0.05);
}

/* Liste des pays */
.RegistrationForm-main-countries-list {
  max-height: 200px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #e5e7eb transparent;
  scrollbar-color: var(--RegistrationForm-main-border) transparent;
}

.RegistrationForm-main-countries-list::-webkit-scrollbar {
  width: 6px;
}

.RegistrationForm-main-countries-list::-webkit-scrollbar-track {
  background: transparent;
}

.RegistrationForm-main-countries-list::-webkit-scrollbar-thumb {
  background: #e5e7eb;
  background: var(--RegistrationForm-main-border);
  border-radius: 3px;
}

.RegistrationForm-main-countries-list::-webkit-scrollbar-thumb:hover {
  background: #9ca3af;
  background: var(--RegistrationForm-main-text-muted);
}

/* Option de pays */
.RegistrationForm-main-country-option {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem;
  cursor: pointer;
  transition: all 0.15s ease;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.RegistrationForm-main-country-option:last-child {
  border-bottom: none;
}

.RegistrationForm-main-country-option:hover {
  background: #f8fafc;
  background: var(--RegistrationForm-main-background);
}

.RegistrationForm-main-country-option:active {
  background: #e2e8f0;
}

.RegistrationForm-main-country-name {
  flex: 1 1;
  font-size: 0.875rem;
  color: #1f2937;
  color: var(--RegistrationForm-main-text-primary);
  font-weight: 400;
}

.RegistrationForm-main-country-dialcode {
  font-size: 0.8rem;
  color: #6b7280;
  color: var(--RegistrationForm-main-text-secondary);
  font-weight: 500;
  margin-left: auto;
}

/* Message aucun résultat */
.RegistrationForm-main-no-results {
  padding: 1.5rem;
  text-align: center;
  color: #9ca3af;
  color: var(--RegistrationForm-main-text-muted);
  font-size: 0.875rem;
  font-style: italic;
}

/* Styles pour le titre sous-agent */
.RegistrationForm-main-subagent-title {
  margin: 1.5rem 0 0.5rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid #e5e7eb;
  border-bottom: 1px solid var(--RegistrationForm-main-border);
}

.RegistrationForm-main-subagent-title h4 {
  color: #0F447E;
  color: var(--RegistrationForm-main-primary-blue);
  font-size: 1rem;
  font-weight: 600;
  margin: 0;
}

/* Styles pour la checkbox */
.RegistrationForm-main-checkbox-label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
  font-size: 0.875rem;
  color: #1f2937;
  color: var(--RegistrationForm-main-text-primary);
  margin-top: 0.5rem;
}

.RegistrationForm-main-checkbox-input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.RegistrationForm-main-checkbox-custom {
  position: relative;
  height: 16px;
  width: 16px;
  background-color: #ffffff;
  background-color: var(--RegistrationForm-main-white);
  border: 2px solid #1f2937;
  border: 2px solid var(--RegistrationForm-main-text-primary); /* Contour plus prononcé */
  border-radius: 4px;
  transition: all 0.2s ease;
}

.RegistrationForm-main-checkbox-label:hover .RegistrationForm-main-checkbox-custom {
  border-color: #3b82f6;
  border-color: var(--RegistrationForm-main-border-focus);
}

.RegistrationForm-main-checkbox-input:checked ~ .RegistrationForm-main-checkbox-custom {
  background-color: #0F447E;
  background-color: var(--RegistrationForm-main-primary-blue);
  border-color: #0F447E;
  border-color: var(--RegistrationForm-main-primary-blue);
}

.RegistrationForm-main-checkbox-input:checked ~ .RegistrationForm-main-checkbox-custom::after {
  content: "✓";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-size: 0.75rem;
}

/* Lien conditions d'utilisation */
.RegistrationForm-main-terms-link {
  color: #0F447E;
  color: var(--RegistrationForm-main-primary-blue);
  text-decoration: none;
  font-weight: 500;
}

.RegistrationForm-main-terms-link:hover {
  text-decoration: underline;
}

/* Style pour le texte "Voir les conditions d'utilisation" */
.RegistrationForm-main-terms-view {
  margin-top: 0.75rem;
  font-size: 0.875rem;
  color: #6b7280;
  color: var(--RegistrationForm-main-text-secondary);
}

/* Responsive Design */
@media (max-width: 1024px) {
  .RegistrationForm-main-card {
    grid-template-columns: 1fr;
    max-width: 600px;
  }
  
  .RegistrationForm-main-title {
    font-size: 1.75rem;
  }

  .RegistrationForm-main-form-row {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
}

@media (max-width: 768px) {
  .RegistrationForm-main-container {
    padding: 0.5rem;
  }

  .RegistrationForm-main-card {
    min-height: auto;
  }

  .RegistrationForm-main-left,
  .RegistrationForm-main-right {
    padding: 2rem 1.5rem;
  }
  
  .RegistrationForm-main-submit-button {
    height: 50px;
    font-size: 0.9rem;
  }
  
  .RegistrationForm-main-button-text {
    font-size: 0.9rem;
  }

  .RegistrationForm-main-form {
    gap: 1.25rem;
  }

  .RegistrationForm-main-country-dropdown {
    position: fixed;
    top: 50%;
    left: 1rem;
    right: 1rem;
    transform: translateY(-50%);
    max-height: 70vh;
    border-radius: 1rem;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    animation: RegistrationForm-main-dropdown-modal 0.3s ease-out;
  }

  @keyframes RegistrationForm-main-dropdown-modal {
    from {
      opacity: 0;
      transform: translateY(-50%) scale(0.95);
    }
    to {
      opacity: 1;
      transform: translateY(-50%) scale(1);
    }
  }

  .RegistrationForm-main-countries-list {
    max-height: calc(70vh - 100px);
  }

  .RegistrationForm-main-search-container {
    padding: 1rem;
  }

  .RegistrationForm-main-search-input {
    height: 3rem;
    padding: 0 3rem 0 3rem;
    font-size: 1rem;
  }

  .RegistrationForm-main-country-option {
    padding: 1rem 0.75rem;
    min-height: 3.5rem;
  }

  .RegistrationForm-main-country-name {
    font-size: 1rem;
  }

  .RegistrationForm-main-country-dialcode {
    font-size: 0.9rem;
  }

  /* Overlay pour fermer le modal sur mobile */
  .RegistrationForm-main-country-dropdown::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: -1;
    animation: RegistrationForm-main-overlay-appear 0.3s ease-out;
  }

  @keyframes RegistrationForm-main-overlay-appear {
    from { opacity: 0; }
    to { opacity: 1; }
  }
}

@media (max-width: 480px) {
  .RegistrationForm-main-title {
    font-size: 1.5rem;
  }
  
  .RegistrationForm-main-submit-button {
    height: 45px;
    font-size: 0.85rem;
  }
  
  .RegistrationForm-main-label {
    font-size: 0.8rem;
  }

  .RegistrationForm-main-input {
    height: 2.75rem;
    font-size: 0.8rem;
  }

  .RegistrationForm-main-left,
  .RegistrationForm-main-right {
    padding: 1.5rem 1rem;
  }

  .RegistrationForm-main-country-selector {
    min-width: 70px;
    padding: 0 0.5rem;
    gap: 0.25rem;
  }

  .RegistrationForm-main-country-code {
    font-size: 0.8rem;
  }

  .RegistrationForm-main-phone-input {
    font-size: 0.8rem;
    padding: 0 0.75rem;
  }

  .RegistrationForm-main-country-dropdown {
    left: 0.5rem;
    right: 0.5rem;
    max-height: 80vh;
  }

  .RegistrationForm-main-search-container {
    padding: 0.75rem;
  }

  .RegistrationForm-main-search-input {
    height: 2.75rem;
    font-size: 0.9rem;
    padding-left: 0.75rem;
  }

  .RegistrationForm-main-country-option {
    padding: 0.875rem 0.75rem;
    min-height: 3rem;
  }

  .RegistrationForm-main-country-name {
    font-size: 0.9rem;
  }

  .RegistrationForm-main-country-dialcode {
    font-size: 0.8rem;
  }

  /* Responsive pour les radios */
  .RegistrationForm-main-radio-group {
    flex-direction: column;
    gap: 0.5rem;
  }
}
:root {
  --EmailVerificationSection-main-primary-blue: #0F447E;
  --EmailVerificationSection-main-secondary-blue: #0F447E;
  --EmailVerificationSection-main-text-primary: #1f2937;
  --EmailVerificationSection-main-text-secondary: #6b7280;
  --EmailVerificationSection-main-text-muted: #9ca3af;
  --EmailVerificationSection-main-background: #f8fafc;
  --EmailVerificationSection-main-white: #ffffff;
  --EmailVerificationSection-main-border: #e5e7eb;
  --EmailVerificationSection-main-border-focus: #3b82f6;
  --EmailVerificationSection-main-error: #e30613;
  --EmailVerificationSection-main-success: #10b981;
  --EmailVerificationSection-main-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  --EmailVerificationSection-main-shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
}

.EmailVerificationSection-main-container {
  min-height: 100vh;
  background: #f8fafc;
  background: var(--EmailVerificationSection-main-background);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  font-family: 'Inter', sans-serif;
  margin-bottom: 50px;
}

.EmailVerificationSection-main-card {
  width: 100%;
  max-width: 1200px;
  background: #ffffff;
  background: var(--EmailVerificationSection-main-white);
  border-radius: 1rem;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
  box-shadow: var(--EmailVerificationSection-main-shadow-lg);
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 650px;
}

/* Section gauche */
.EmailVerificationSection-main-left {
  background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.EmailVerificationSection-main-left::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url("data:image/svg+xml,<svg width=\"60\" height=\"60\" viewBox=\"0 0 60 60\" xmlns=\"http://www.w3.org/2000/svg\"><g fill=\"none\" fill-rule=\"evenodd\"><g fill=\"%23f1f5f9\" fill-opacity=\"0.4\"><circle cx=\"7\" cy=\"7\" r=\"7\"/></g></svg>") repeat;
  opacity: 0.5;
}

.EmailVerificationSection-main-logo-section {
  text-align: center;
  position: relative;
  z-index: 1;
}

.EmailVerificationSection-main-logo {
  width: 80px;
  height: 80px;
  margin-bottom: 1.5rem;
  object-fit: contain;
}

.EmailVerificationSection-main-title {
  font-size: 2rem;
  font-weight: 700;
  color: #0F447E;
  color: var(--EmailVerificationSection-main-primary-blue);
  margin-bottom: 0.5rem;
}

.EmailVerificationSection-main-title-tahaga {
  color: #0F447E;
  color: var(--EmailVerificationSection-main-primary-blue);
}

.EmailVerificationSection-main-subtitle {
  font-size: 1.125rem;
  color: #6b7280;
  color: var(--EmailVerificationSection-main-text-secondary);
  font-weight: 400;
  line-height: 1.5;
}

/* Section droite */
.EmailVerificationSection-main-right {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3rem 2rem;
}

.EmailVerificationSection-main-form-container {
  width: 100%;
  max-width: 450px;
}

.EmailVerificationSection-main-form-header {
  text-align: center;
  margin-bottom: 2rem;
}

.EmailVerificationSection-main-form-title {
  font-size: 1.5rem;
  font-weight: 600;
  color: #0F447E;
  color: var(--EmailVerificationSection-main-primary-blue);
  margin-bottom: 0.5rem;
}

.EmailVerificationSection-main-form-subtitle {
  color: #6b7280;
  color: var(--EmailVerificationSection-main-text-secondary);
  font-size: 0.875rem;
}

.EmailVerificationSection-main-verification-titre {
  color: #e30613;
  color: var(--EmailVerificationSection-main-error);
}

/* Contenu principal */
.EmailVerificationSection-main-content {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

/* Message de succès */
.EmailVerificationSection-main-message-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 2rem 1.5rem;
  background: rgba(44, 221, 162, 0.1);
  border: 1px solid rgba(16, 185, 129, 0.2);
  border-radius: 1rem;
}

.EmailVerificationSection-main-message-container.existing-email {
  background: rgba(245, 158, 11, 0.1);
  border: 1px solid rgba(245, 158, 11, 0.2);
}

.EmailVerificationSection-main-icon-wrapper {
  margin-bottom: 1rem;
}

.EmailVerificationSection-main-success-icon {
  font-size: 3rem;
  color: #10b981;
  color: var(--EmailVerificationSection-main-success);
}

.EmailVerificationSection-main-warning-icon {
  font-size: 3rem;
  color: #f59e0b;
}

.EmailVerificationSection-main-message-title {
  font-size: 1.25rem;
  font-weight: 600;
  color: #1f2937;
  color: var(--EmailVerificationSection-main-text-primary);
  margin-bottom: 0.75rem;
}

.EmailVerificationSection-main-message-text {
  font-size: 0.875rem;
  color: #6b7280;
  color: var(--EmailVerificationSection-main-text-secondary);
  line-height: 1.6;
  margin: 0;
}

/* Instructions */
.EmailVerificationSection-main-instructions {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.EmailVerificationSection-main-instruction-item {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  background: #f8fafc;
  background: var(--EmailVerificationSection-main-background);
  border-radius: 0.75rem;
  border: 1px solid #e5e7eb;
  border: 1px solid var(--EmailVerificationSection-main-border);
}

.EmailVerificationSection-main-instruction-number {
  width: 2rem;
  height: 2rem;
  background: #0F447E;
  background: var(--EmailVerificationSection-main-primary-blue);
  color: #ffffff;
  color: var(--EmailVerificationSection-main-white);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 0.875rem;
  flex-shrink: 0;
}

.EmailVerificationSection-main-instruction-text {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  color: #1f2937;
  color: var(--EmailVerificationSection-main-text-primary);
  font-weight: 500;
}

.EmailVerificationSection-main-instruction-icon {
  font-size: 1rem;
  color: #6b7280;
  color: var(--EmailVerificationSection-main-text-secondary);
}

/* Bouton de connexion */
.EmailVerificationSection-main-login-button {
  width: 100%;
  height: 60px;
  padding: 1rem;
  background: linear-gradient(135deg, #0F447E 0%, #0F447E 100%);
  background: linear-gradient(135deg, var(--EmailVerificationSection-main-primary-blue) 0%, var(--EmailVerificationSection-main-secondary-blue) 100%);
  color: #ffffff;
  color: var(--EmailVerificationSection-main-white);
  border: none;
  border-radius: 0.75rem;
  font-size: 1rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  cursor: pointer;
  transition: all 0.3s ease;
  text-decoration: none;
}

.EmailVerificationSection-main-button-text {
  font-size: inherit;
}

.EmailVerificationSection-main-button-icon {
  font-size: 1rem;
  transition: transform 0.3s ease;
}

.EmailVerificationSection-main-login-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px 0 rgba(12, 68, 126, 0.4);
  text-decoration: none;
  color: #ffffff;
  color: var(--EmailVerificationSection-main-white);
}

.EmailVerificationSection-main-login-button:hover .EmailVerificationSection-main-button-icon {
  transform: translateX(4px);
}

/* Section renvoi d'e-mail */
.EmailVerificationSection-main-resend-section {
  text-align: center;
  padding-top: 1.5rem;
  border-top: 1px solid #e5e7eb;
  border-top: 1px solid var(--EmailVerificationSection-main-border);
}

.EmailVerificationSection-main-resend-text {
  font-size: 0.875rem;
  color: #6b7280;
  color: var(--EmailVerificationSection-main-text-secondary);
  margin-bottom: 0.75rem;
}

.EmailVerificationSection-main-resend-button {
  background: none;
  border: 1px solid #0F447E;
  border: 1px solid var(--EmailVerificationSection-main-primary-blue);
  color: #0F447E;
  color: var(--EmailVerificationSection-main-primary-blue);
  padding: 0.75rem 1.5rem;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
}

.EmailVerificationSection-main-resend-button:hover:not(:disabled) {
  background: #0F447E;
  background: var(--EmailVerificationSection-main-primary-blue);
  color: #ffffff;
  color: var(--EmailVerificationSection-main-white);
}

.EmailVerificationSection-main-resend-button:disabled {
  opacity: 0.7;
  cursor: not-allowed;
  /* background: #6b7280;
  border-color: #6b7280; */
  /* opacity: 0.7; */
}

.EmailVerificationSection-main-resend-button:disabled:hover {
  background: #6b7280;
  border-color: #6b7280;
  transform: none;
}

/* Message de renvoi */
.EmailVerificationSection-main-resend-message {
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  text-align: center;
  margin-bottom: 1rem;
}

.EmailVerificationSection-main-resend-message.EmailVerificationSection-main-success {
  background: rgba(16, 185, 129, 0.1);
  color: #10b981;
  color: var(--EmailVerificationSection-main-success);
  border: 1px solid rgba(16, 185, 129, 0.2);
}

.EmailVerificationSection-main-resend-message.EmailVerificationSection-main-error {
  background: rgba(239, 68, 68, 0.1);
  color: #e30613;
  color: var(--EmailVerificationSection-main-error);
  border: 1px solid rgba(239, 68, 68, 0.2);
}

/* Spinner de chargement */
.EmailVerificationSection-main-spinner {
  width: 16px;
  height: 16px;
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-radius: 50%;
  border-top-color: white;
  animation: EmailVerificationSection-main-spin 1s ease-in-out infinite;
  display: inline-block;
  margin-right: 0.5rem;
}

@keyframes EmailVerificationSection-main-spin {
  to {
    transform: rotate(360deg);
  }
}

/* Cooldown message */
.EmailVerificationSection-main-cooldown-message {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem;
  background: rgba(245, 158, 11, 0.1);
  border: 1px solid rgba(245, 158, 11, 0.3);
  border-radius: 0.75rem;
  margin-bottom: 1rem;
}

.EmailVerificationSection-main-cooldown-icon {
  font-size: 1.25rem;
  flex-shrink: 0;
}

.EmailVerificationSection-main-cooldown-text {
  font-size: 0.875rem;
  color: #92400e;
  line-height: 1.4;
}

.EmailVerificationSection-main-cooldown-text strong {
  font-weight: 600;
}

/* Responsive Design */
@media (max-width: 1024px) {
  .EmailVerificationSection-main-card {
    grid-template-columns: 1fr;
    max-width: 600px;
  }
  
  .EmailVerificationSection-main-title {
    font-size: 1.75rem;
  }
}

@media (max-width: 768px) {
  .EmailVerificationSection-main-container {
    padding: 0.5rem;
  }

  .EmailVerificationSection-main-card {
    min-height: auto;
  }

  .EmailVerificationSection-main-left,
  .EmailVerificationSection-main-right {
    padding: 2rem 1.5rem;
  }
  
  .EmailVerificationSection-main-login-button {
    height: 50px;
    font-size: 0.9rem;
  }
  
  .EmailVerificationSection-main-button-text {
    font-size: 0.9rem;
  }

  .EmailVerificationSection-main-content {
    gap: 1.5rem;
  }

  .EmailVerificationSection-main-message-container {
    padding: 1.5rem 1rem;
  }

  .EmailVerificationSection-main-success-icon {
    font-size: 2.5rem;
  }

  .EmailVerificationSection-main-message-title {
    font-size: 1.125rem;
  }
}

@media (max-width: 480px) {
  .EmailVerificationSection-main-title {
    font-size: 1.5rem;
  }
  
  .EmailVerificationSection-main-login-button {
    height: 45px;
    font-size: 0.85rem;
  }

  .EmailVerificationSection-main-left,
  .EmailVerificationSection-main-right {
    padding: 1.5rem 1rem;
  }

  .EmailVerificationSection-main-message-container {
    padding: 1.25rem 0.75rem;
  }

  .EmailVerificationSection-main-success-icon {
    font-size: 2rem;
  }

  .EmailVerificationSection-main-message-title {
    font-size: 1rem;
  }

  .EmailVerificationSection-main-message-text {
    font-size: 0.8rem;
  }

  .EmailVerificationSection-main-instruction-item {
    padding: 0.75rem;
  }

  .EmailVerificationSection-main-instruction-text {
    font-size: 0.8rem;
  }

  .EmailVerificationSection-main-instruction-number {
    width: 1.75rem;
    height: 1.75rem;
    font-size: 0.8rem;
  }
}

.activation-container {
  min-height: 100vh;
  background: #f8fafc;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  font-family: 'Inter', 'Poppins', sans-serif;
}

.activation-section {
  /* width: 100%;
  max-width: 450px; */
  background: #fff;
  border-radius: 1rem;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  padding: 2.5rem 2rem 2rem 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.activation-header {
  background: #0c447e;
  padding: 1.5rem 1rem 1rem 1rem;
  width: 100%;
  text-align: center;
  border-radius: 1rem 1rem 0 0;
}

.activation-header h1 {
  color: #fff;
  font-family: 'Poppins', sans-serif;
  font-size: 2rem;
  font-weight: 700;
  margin: 0;
}

.message-box {
  width: 100%;
  margin-top: 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.activation-message {
  width: 100%;
  margin-bottom: 1rem;
  padding: 1rem 1.25rem;
  border-radius: 0.75rem;
  font-weight: 600;
  text-align: center;
  font-size: 1rem;
  box-sizing: border-box;
}

.activation-message.success {
  background: rgba(16, 185, 129, 0.1);
  color: #10b981;
  border: 1px solid #10b981;
}

.activation-message.error {
  background: rgba(239, 68, 68, 0.1);
  color: #ef4444;
  border: 1px solid #ef4444;
}

/* Responsive styles */
@media (max-width: 600px) {
  .activation-section {
    max-width: 100%;
    padding: 1.5rem 0.5rem 1rem 0.5rem;
  }
  .activation-header {
    padding: 1rem 0.5rem 0.5rem 0.5rem;
  }
  .activation-header h1 {
    font-size: 1.25rem;
  }
  .activation-message {
    font-size: 0.95rem;
    padding: 0.75rem 0.5rem;
  }
}

@media (min-width: 1200px) {
  .activation-section {
    max-width: 500px;
    padding: 3rem 2.5rem 2.5rem 2.5rem;
  }
  .activation-header h1 {
    font-size: 2.25rem;
  }
}

/* Media queries */

/* Mobile (< 768px) */
@media (max-width: 768px) {
  .activation-container {
    padding: 15px;
  }

  .activation-section {
    max-width: 100%;
  }

  .activation-header {
    padding: 15px;
  }

  .activation-header h1 {
    font-size: 24px;
  }
}

/* Très petits écrans (< 480px) */
@media (max-width: 480px) {
  .activation-container {
    padding: 10px;
  }

  .activation-header {
    padding: 10px;
  }

  .activation-header h1 {
    font-size: 20px;
  }
}

/* Grands écrans (> 1440px) */
@media (min-width: 1441px) {
  .activation-container {
    padding: 40px;
  }

  .activation-section {
    max-width: 1000px;
  }

  .activation-header {
    padding: 30px;
  }

  .activation-header h1 {
    font-size: 36px;
  }
}

/* Très grands écrans (> 1920px) */
@media (min-width: 1921px) {
  .activation-container {
    padding: 60px;
  }

  .activation-section {
    max-width: 800px;
  }

  .activation-header {
    padding: 20px;
  }

  .activation-header h1 {
    font-size: 20px;
  }
}

/* Message box styles */
.field-error {
  color: #cc0000;
  font-size: 0.9rem;
  margin-top: 4px;
}

.forget-password {
  text-align: right;
  margin-right: 22px;
}
.forget-password a {
  color: #0c447e;
  text-decoration: none;
}

/* politiqueConfidentialite.css */

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.politiqueConfidentialite-container {
  width: 100%;
  min-height: 100vh;
  background-color: #f8f9fa;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}

/* Header Section */
.politiqueConfidentialite-header {
  background: linear-gradient(135deg, #0F447E 0%, #0a3866 100%);
  color: white;
  padding: 80px 20px;
}

.politiqueConfidentialite-header-content {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

.politiqueConfidentialite-title-section {
  flex: 1 1;
}

.politiqueConfidentialite-title {
  font-size: 48px;
  font-weight: 700;
  margin: 0 0 12px 0;
  line-height: 1.2;
}

.politiqueConfidentialite-subtitle {
  font-size: 18px;
  opacity: 0.9;
  margin: 0;
  font-weight: 400;
}

.politiqueConfidentialite-shield {
  width: 120px;
  height: 120px;
  background: rgba(255, 255, 255, 0.15);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.politiqueConfidentialite-shield svg {
  width: 60px;
  height: 60px;
  color: white;
}

/* Main Content */
.politiqueConfidentialite-main {
  background-color: white;
  position: relative;
  z-index: 1;
}

.politiqueConfidentialite-content {
  max-width: 800px;
  margin: 0 auto;
  padding: 30px 20px;
}

.politiqueConfidentialite-intro {
  margin-bottom: 30px;
  padding: 25px 30px;
  background-color: #f8f9fc;
  border-radius: 12px;
}

.politiqueConfidentialite-intro p {
  font-size: 16px;
  line-height: 1.7;
  color: #5f6368;
  margin: 0;
  text-align: justify;
}

/* Sections */
.politiqueConfidentialite-section {
  margin-bottom: 40px;
  padding-bottom: 30px;
  border-bottom: 1px solid #e8eaed;
}

.politiqueConfidentialite-section:last-child {
  border-bottom: none;
  margin-bottom: 0;
}

.politiqueConfidentialite-section h2 {
  font-size: 24px;
  font-weight: 600;
  color: #202124;
  margin: 0 0 20px 0;
  line-height: 1.3;
}

.politiqueConfidentialite-section p {
  font-size: 16px;
  line-height: 1.7;
  color: #5f6368;
  margin: 0 0 16px 0;
  text-align: justify;
}

.politiqueConfidentialite-section p:last-child {
  margin-bottom: 0;
}

/* Responsive Design */
@media (max-width: 1024px) {
  .politiqueConfidentialite-header-content {
    max-width: 900px;
  }

  .politiqueConfidentialite-content {
    max-width: 700px;
  }

  .politiqueConfidentialite-intro {
    padding: 20px 25px;
  }
}

@media (max-width: 768px) {
  .politiqueConfidentialite-header {
    padding: 60px 20px;
  }

  .politiqueConfidentialite-header-content {
    flex-direction: column;
    text-align: center;
    gap: 30px;
  }

  .politiqueConfidentialite-title {
    font-size: 36px;
  }

  .politiqueConfidentialite-subtitle {
    font-size: 16px;
  }

  .politiqueConfidentialite-shield {
    width: 100px;
    height: 100px;
  }

  .politiqueConfidentialite-shield svg {
    width: 50px;
    height: 50px;
  }

  .politiqueConfidentialite-content {
    padding: 40px 20px;
  }

  .politiqueConfidentialite-intro {
    margin-bottom: 25px;
    padding: 18px 20px;
  }

  .politiqueConfidentialite-section h2 {
    font-size: 22px;
  }

  .politiqueConfidentialite-section p {
    font-size: 15px;
  }

  .politiqueConfidentialite-intro p {
    font-size: 15px;
  }
}

@media (max-width: 480px) {
  .politiqueConfidentialite-header {
    padding: 40px 15px;
  }

  .politiqueConfidentialite-title {
    font-size: 28px;
  }

  .politiqueConfidentialite-subtitle {
    font-size: 15px;
  }

  .politiqueConfidentialite-shield {
    width: 80px;
    height: 80px;
  }

  .politiqueConfidentialite-shield svg {
    width: 40px;
    height: 40px;
  }

  .politiqueConfidentialite-content {
    padding: 30px 15px;
  }

  .politiqueConfidentialite-intro {
    margin-bottom: 20px;
    padding: 15px;
  }

  .politiqueConfidentialite-section h2 {
    font-size: 20px;
  }

  .politiqueConfidentialite-section p,
  .politiqueConfidentialite-intro p {
    font-size: 14px;
  }

  .politiqueConfidentialite-section {
    margin-bottom: 30px;
    padding-bottom: 20px;
  }
}
/* ConditionsPaiementsHome.css */

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.ConditionsPaiementsHome-container {
  width: 100%;
  min-height: 100vh;
  background-color: #f8f9fa;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}

/* Header Section */
.ConditionsPaiementsHome-header {
  background: linear-gradient(135deg, #0F447E 0%, #0a3866 100%);
  color: white;
  padding: 80px 20px;
}

.ConditionsPaiementsHome-header-content {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

.ConditionsPaiementsHome-title-section {
  flex: 1 1;
}

.ConditionsPaiementsHome-title {
  font-size: 48px;
  font-weight: 700;
  margin: 0 0 12px 0;
  line-height: 1.2;
}

.ConditionsPaiementsHome-subtitle {
  font-size: 18px;
  opacity: 0.9;
  margin: 0;
  font-weight: 400;
}

.ConditionsPaiementsHome-icon {
  width: 120px;
  height: 120px;
  background: rgba(255, 255, 255, 0.15);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.ConditionsPaiementsHome-icon svg {
  width: 60px;
  height: 60px;
  color: white;
}

/* Main Content */
.ConditionsPaiementsHome-main {
  background-color: white;
  position: relative;
  z-index: 1;
}

.ConditionsPaiementsHome-content {
  max-width: 800px;
  margin: 0 auto;
  padding: 30px 20px;
}

.ConditionsPaiementsHome-intro {
  margin-bottom: 30px;
  padding: 25px 30px;
  background-color: #f8f9fc;
  border-radius: 12px;
}

.ConditionsPaiementsHome-intro p {
  font-size: 16px;
  line-height: 1.7;
  color: #5f6368;
  margin: 0;
  text-align: justify;
}

/* Sections */
.ConditionsPaiementsHome-section {
  margin-bottom: 40px;
  padding-bottom: 30px;
  border-bottom: 1px solid #e8eaed;
}

.ConditionsPaiementsHome-section:last-child {
  border-bottom: none;
  margin-bottom: 0;
}

.ConditionsPaiementsHome-section h2 {
  font-size: 24px;
  font-weight: 600;
  color: #202124;
  margin: 0 0 20px 0;
  line-height: 1.3;
}

.ConditionsPaiementsHome-section p {
  font-size: 16px;
  line-height: 1.7;
  color: #5f6368;
  margin: 0 0 16px 0;
  text-align: justify;
}

.ConditionsPaiementsHome-section p:last-child {
  margin-bottom: 0;
}

/* Responsive Design */
@media (max-width: 1024px) {
  .ConditionsPaiementsHome-header-content {
    max-width: 900px;
  }

  .ConditionsPaiementsHome-content {
    max-width: 700px;
  }

  .ConditionsPaiementsHome-intro {
    padding: 20px 25px;
  }
}

@media (max-width: 768px) {
  .ConditionsPaiementsHome-header {
    padding: 60px 20px;
  }

  .ConditionsPaiementsHome-header-content {
    flex-direction: column;
    text-align: center;
    gap: 30px;
  }

  .ConditionsPaiementsHome-title {
    font-size: 36px;
  }

  .ConditionsPaiementsHome-subtitle {
    font-size: 16px;
  }

  .ConditionsPaiementsHome-icon {
    width: 100px;
    height: 100px;
  }

  .ConditionsPaiementsHome-icon svg {
    width: 50px;
    height: 50px;
  }

  .ConditionsPaiementsHome-content {
    padding: 40px 20px;
  }

  .ConditionsPaiementsHome-intro {
    margin-bottom: 25px;
    padding: 18px 20px;
  }

  .ConditionsPaiementsHome-section h2 {
    font-size: 22px;
  }

  .ConditionsPaiementsHome-section p {
    font-size: 15px;
  }

  .ConditionsPaiementsHome-intro p {
    font-size: 15px;
  }
}

@media (max-width: 480px) {
  .ConditionsPaiementsHome-header {
    padding: 40px 15px;
  }

  .ConditionsPaiementsHome-title {
    font-size: 28px;
  }

  .ConditionsPaiementsHome-subtitle {
    font-size: 15px;
  }

  .ConditionsPaiementsHome-icon {
    width: 80px;
    height: 80px;
  }

  .ConditionsPaiementsHome-icon svg {
    width: 40px;
    height: 40px;
  }

  .ConditionsPaiementsHome-content {
    padding: 30px 15px;
  }

  .ConditionsPaiementsHome-intro {
    margin-bottom: 20px;
    padding: 15px;
  }

  .ConditionsPaiementsHome-section h2 {
    font-size: 20px;
  }

  .ConditionsPaiementsHome-section p,
  .ConditionsPaiementsHome-intro p {
    font-size: 14px;
  }

  .ConditionsPaiementsHome-section {
    margin-bottom: 30px;
    padding-bottom: 20px;
  }
}
/* MentionsLegalesHome.css */

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.MentionsLegalesHome-container {
  width: 100%;
  min-height: 100vh;
  background-color: #f8f9fa;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}

/* Header Section */
.MentionsLegalesHome-header {
  background: linear-gradient(135deg, #0F447E 0%, #0a3866 100%);
  color: white;
  padding: 80px 20px;
}

.MentionsLegalesHome-header-content {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

.MentionsLegalesHome-title-section {
  flex: 1 1;
}

.MentionsLegalesHome-title {
  font-size: 48px;
  font-weight: 700;
  margin: 0 0 12px 0;
  line-height: 1.2;
}

.MentionsLegalesHome-subtitle {
  font-size: 18px;
  opacity: 0.9;
  margin: 0;
  font-weight: 400;
}

.MentionsLegalesHome-icon {
  width: 120px;
  height: 120px;
  background: rgba(255, 255, 255, 0.15);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.MentionsLegalesHome-icon svg {
  width: 60px;
  height: 60px;
  color: white;
}

/* Main Content */
.MentionsLegalesHome-main {
  background-color: white;
  position: relative;
  z-index: 1;
}

.MentionsLegalesHome-content {
  max-width: 800px;
  margin: 0 auto;
  padding: 30px 20px;
}

.MentionsLegalesHome-intro {
  margin-bottom: 30px;
  padding: 25px 30px;
  background-color: #f8f9fc;
  border-radius: 12px;
}

.MentionsLegalesHome-intro p {
  font-size: 16px;
  line-height: 1.7;
  color: #5f6368;
  margin: 0;
  text-align: justify;
}

/* Sections */
.MentionsLegalesHome-section {
  margin-bottom: 40px;
  padding-bottom: 30px;
  border-bottom: 1px solid #e8eaed;
}

.MentionsLegalesHome-section:last-child {
  border-bottom: none;
  margin-bottom: 0;
}

.MentionsLegalesHome-section h2 {
  font-size: 24px;
  font-weight: 600;
  color: #202124;
  margin: 0 0 20px 0;
  line-height: 1.3;
}

.MentionsLegalesHome-section p {
  font-size: 16px;
  line-height: 1.7;
  color: #5f6368;
  margin: 0 0 16px 0;
  text-align: justify;
}

.MentionsLegalesHome-section p:last-child {
  margin-bottom: 0;
}

.MentionsLegalesHome-section strong {
  color: #0F447E;
}

.MentionsLegalesHome-section a {
  color: #0F447E;
  text-decoration: underline;
}

.MentionsLegalesHome-section a:hover {
  color: #0a3866;
}

/* Responsive Design */
@media (max-width: 1024px) {
  .MentionsLegalesHome-header-content {
    max-width: 900px;
  }

  .MentionsLegalesHome-content {
    max-width: 700px;
  }

  .MentionsLegalesHome-intro {
    padding: 20px 25px;
  }
}

@media (max-width: 768px) {
  .MentionsLegalesHome-header {
    padding: 60px 20px;
  }

  .MentionsLegalesHome-header-content {
    flex-direction: column;
    text-align: center;
    gap: 30px;
  }

  .MentionsLegalesHome-title {
    font-size: 36px;
  }

  .MentionsLegalesHome-subtitle {
    font-size: 16px;
  }

  .MentionsLegalesHome-icon {
    width: 100px;
    height: 100px;
  }

  .MentionsLegalesHome-icon svg {
    width: 50px;
    height: 50px;
  }

  .MentionsLegalesHome-content {
    padding: 40px 20px;
  }

  .MentionsLegalesHome-intro {
    margin-bottom: 25px;
    padding: 18px 20px;
  }

  .MentionsLegalesHome-section h2 {
    font-size: 22px;
  }

  .MentionsLegalesHome-section p {
    font-size: 15px;
  }

  .MentionsLegalesHome-intro p {
    font-size: 15px;
  }
}

@media (max-width: 480px) {
  .MentionsLegalesHome-header {
    padding: 40px 15px;
  }

  .MentionsLegalesHome-title {
    font-size: 28px;
  }

  .MentionsLegalesHome-subtitle {
    font-size: 15px;
  }

  .MentionsLegalesHome-icon {
    width: 80px;
    height: 80px;
  }

  .MentionsLegalesHome-icon svg {
    width: 40px;
    height: 40px;
  }

  .MentionsLegalesHome-content {
    padding: 30px 15px;
  }

  .MentionsLegalesHome-intro {
    margin-bottom: 20px;
    padding: 15px;
  }

  .MentionsLegalesHome-section h2 {
    font-size: 20px;
  }

  .MentionsLegalesHome-section p,
  .MentionsLegalesHome-intro p {
    font-size: 14px;
  }

  .MentionsLegalesHome-section {
    margin-bottom: 30px;
    padding-bottom: 20px;
  }
}

.appartementListMain-container {
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .appartementListMain-container {
    flex-direction: column;
    align-items: center;
  }
}

@media (max-width: 480px) {
  .appartementListMain-container {
    padding: 10px;
  }
}
/* ===== Variables (adapte --card-w et --img-h si besoin) ===== */
:root{
  --t-blue:#0F223A;
  --t-red:#e30613;
  --t-border:#E6E9F0;
  --t-shadow:0 8px 24px rgba(15,34,58,.06);
  --t-chip:#eef2f7;

  --gap:0.5rem;        /* espacement entre cartes */
  --radius:16px;       /* arrondi des cartes */
  --card-w:270px;      /* largeur fixe d’une carte */
  --img-h:200px;       /* hauteur de l’image */
}

/* ===== Conteneur & Grille ===== */
.apt-skel-wrap-list{
  width: 100%;
  min-height: 100vh;
  padding: 0 0.5rem;
  padding: 0 var(--gap);
}

.apt-skel-grid-list{
  display: grid;
  gap: 0.5rem;
  grid-gap: 0.5rem;
  grid-gap: var(--gap);
  gap: var(--gap);
  /* Desktop : 3 colonnes fixes centrées */
  grid-template-columns: repeat(3, 270px);
  grid-template-columns: repeat(3, var(--card-w));
  justify-content: center;   /* centre les colonnes */
  justify-items: center;     /* centre les cartes dans chaque colonne */
  margin-bottom: 2rem;
}

/* ===== Carte (définition unique, pas de doublon) ===== */
.apt-card-skel-list{
  width: 270px;
  width: var(--card-w);               /* fixe sur desktop */
  background:#fff;
  border:1px solid #E6E9F0;
  border:1px solid var(--t-border);
  border-radius:16px;
  border-radius:var(--radius);
  box-shadow:0 8px 24px rgba(15,34,58,.06);
  box-shadow:var(--t-shadow);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  color:#0F223A;
  color:var(--t-blue);
}

/* ====== Tablette : 2 colonnes fixes, centrées ====== */
@media (min-width:641px) and (max-width:1024px){
  .apt-skel-grid-list{
    grid-template-columns: repeat(2, 270px);
    grid-template-columns: repeat(2, var(--card-w));
    justify-content: center;  /* centre l’ensemble des colonnes */
    justify-items: center;    /* centre chaque carte dans sa colonne */
    gap: 0.5rem;
    gap: var(--gap);
  }
  .apt-card-skel-list{
    width: 270px;
    width: var(--card-w);
  }
}

/* ====== Mobile : 1 colonne centrée ====== */
@media (max-width:640px){
  .apt-skel-wrap-list{ padding: 0 12px; } /* réduit le padding latéral */

  .apt-skel-grid-list{
    grid-template-columns: minmax(0, min(100%, 270px));
    grid-template-columns: minmax(0, min(100%, var(--card-w)));
    justify-content: center;  /* centre la colonne */
    justify-items: center;    /* centre la carte */
    gap: 0.5rem;
    gap: var(--gap);
  }
  .apt-card-skel-list{
    width: min(100%, 270px);
    width: min(100%, var(--card-w));
  }
}

/* ===== Image + bouton favori ===== */
.apt-card-img-list{ position: relative; }

.skel-img-list{
  display:block;
  width:100%;
  height:200px;
  height:var(--img-h);
  background:#eef2f7;
  border-radius:16px 16px 0 0;
  border-radius:var(--radius) var(--radius) 0 0;
}

.skel-like-list{
  position:absolute;
  top:12px;
  right:12px;
  width:38px; height:38px;
  border-radius:50%;
  background:#fff;
  border:1px solid #E6E9F0;
  border:1px solid var(--t-border);
  box-shadow:0 2px 8px rgba(0,0,0,.08);
  z-index:5;
  display:none; /* masque le “cœur” dans le squelette */
}

/* ===== Corps de carte ===== */
.apt-card-body-list{
  padding:18px 20px 20px;
  display:flex;
  flex-direction:column;
  gap:12px;
}

/* ===== Atomes Skeleton + shimmer ===== */
.skel-list{
  position:relative;
  overflow:hidden;
  background:#eef2f7;
  border-radius:10px;
}
.skel-list::after{
  content:"";
  position:absolute; inset:0;
  transform:translateX(-100%);
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent);
  animation:skel-shimmer 1.3s infinite;
}
@keyframes skel-shimmer{
  100%{ transform:translateX(100%); }
}

/* Lignes (titre, description, prix) */
.skel-title-list{ height:22px; width:72%; border-radius:8px; }
.skel-desc-list{  height:14px; width:96%; border-radius:8px; }
.skel-desc-list.short-list{ width:78%; }
.skel-price-list{ height:20px; width:62%; border-radius:8px; margin-top:2px; }

/* Chips */
.apt-card-chips-list{ display:flex; gap:10px; margin-top:2px; }
.skel-chip-list{
  width:70px; height:26px; border-radius:999px;
  background:#eef2f7;
  background:var(--t-chip);
}

/* CTA (bouton) */
.skel-cta-list{
  height:48px; border-radius:12px; margin-top:8px;
}

/* Accessibilité */
.sr-only-list{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* Préférence utilisateur : réduire les animations */
@media (prefers-reduced-motion: reduce){
  .skel-list::after{ animation:none; }
}

/* Styles pour AppartementList */

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-family: 'Poppins', sans-serif;
}

/* Styles généraux */
body {
  background-color: #f5f5f5;
  color: #333;
}

.AppartmentListMain-container {
  max-width: 1920px;
  margin: 0 auto;
}

/* Conteneur principal */
.AppartmentListMain-main-container {
  max-width: 1920px;
  margin: 0 auto;
  padding: 0 1rem;
}

.AppartmentListMain-content-wrapper {
  display: flex;
  gap: 2rem;
}

/* Sidebar des filtres */
.AppartmentListMain-filter-sidebar {
  width: 280px;
  flex-shrink: 0;
}

.AppartmentListMain-filter-card {
  background-color: white;
  border-radius: 0.5rem;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}

.AppartmentListMain-filter-header {
  padding: 1.25rem;
  border-bottom: 1px solid #e5e7eb;
}

.AppartmentListMain-filter-title {
  font-weight: 600;
  font-size: 1.1rem;
}

.AppartmentListMain-filter-section {
  padding: 1.25rem;
  border-bottom: 1px solid #e5e7eb;
}

.AppartmentListMain-filter-section:last-child {
  border-bottom: none;
}

.AppartmentListMain-section-title {
  font-size: 0.875rem;
  font-weight: 600;
  color: #1e40af;
  margin-bottom: 1rem;
}

/* Boutons de catégorie */
.AppartmentListMain-category-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.AppartmentListMain-category-button {
  font-size: 0.75rem;
  padding: 0.375rem 0.75rem;
  border-radius: 0.375rem;
  background-color: #f3f4f6;
  color: #4b5563;
  border: none;
  cursor: pointer;
  transition: all 0.2s;
}

.AppartmentListMain-category-button.AppartmentListMain-active {
  background-color: #0c447e;
  color: white;
}

/* Select pour zone */
.AppartmentListMain-zone-select {
  width: 100%;
  padding: 0.625rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  background-color: #f9fafb;
  font-size: 0.875rem;
  outline: none;
  cursor: pointer;
}

.AppartmentListMain-loading-more {
  text-align: center;
  padding: 1rem;
  margin-top: 1rem;
}

.AppartmentListMain-loading {
  font-size: 1rem;
  color: #0c447e;
  font-weight: 500;
}

.AppartmentListMain-apartments-container {
  min-height: 100vh;
  width: 100%;
}

/* Prix */
.AppartmentListMain-price-inputs {
  display: flex;
  align-items: center;
  margin-bottom: 1rem;
}

.AppartmentListMain-price-input {
  width: 5.5rem;
  padding: 0.5rem;
  border: 1px solid #d1d5db;
  border-radius: 0.25rem;
  text-align: center;
  font-size: 0.875rem;
}

.AppartmentListMain-price-separator {
  margin: 0 0.75rem;
  color: #6b7280;
}

.AppartmentListMain-slider-container {
  padding: 0 0.25rem;
}

.AppartmentListMain-price-slider {
  width: 100%;
  height: 0.5rem;
  background: #dbeafe;
  border-radius: 1rem;
  -webkit-appearance: none;
          appearance: none;
  cursor: pointer;
}

.AppartmentListMain-price-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
          appearance: none;
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  background: #0c447e;
  cursor: pointer;
}

/* Options */
/* Options */
.AppartmentListMain-options-list {
  display: grid;
  grid-template-columns: 1fr 1fr; /* Mobile : 1 colonne */
  grid-gap: 0.75rem 1rem;
  gap: 0.75rem 1rem;
}



.AppartmentListMain-option-item {
  display: flex;
  align-items: center;
  cursor: pointer;
}

.AppartmentListMain-option-checkbox {
  margin-right: 0.625rem;
  width: 1rem;
  height: 1rem;
  accent-color: #0c447e;
  cursor: pointer;
}

.AppartmentListMain-option-label {
  font-size: 0.875rem;
  color: #4b5563;
}


/* Grille d'appartements */
.AppartmentListMain-apartments-container {
  flex: 1 1;
}

.AppartmentListMain-apartments-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 1rem;
  gap: 1rem;
  justify-items: center;
  margin-bottom: 2rem;
  justify-items: center;
  align-items: stretch;
}

.AppartmentListMain-apartment-title {
  font-size: 1.2rem;
  font-weight: 600;
  margin-bottom: 0.5rem;
  color: var(--text-primary);
}

.AppartmentListMain-apartment-subtitle {
  color: var(--text-secondary);
  font-size: 0.95rem;
  margin-bottom: 1rem;
  line-height: 1.4;
}

.AppartmentListMain-apartment-subtitle {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  min-height: 2.4em;
  max-height: 2.4em;
  line-height: 1.2;
}

.AppartmentListMain-apartment-price {
  font-weight: 700;
  color: var(--primary-color);
  margin: 0.5rem 0;
  font-size: 1.1rem;
}

.AppartmentListMain-price-period {
  font-size: 0.875rem;
  font-weight: 400;
  color: #6b7280;
}

.AppartmentListMain-options-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

.AppartmentListMain-option-tag {
  font-size: 0.75rem;
  padding: 0.25rem 0.5rem;
  background-color: #f3f4f6;
  color: #4b5563;
  border-radius: 0.25rem;
}
.AppartmentListMain-visit-button-contener {
  margin-top: auto;
  padding-top: 1rem;
}

.AppartmentListMain-visit-button {
  width: 100%;
  background: var(--primary-color);
  color: white;
  border: none;
  padding: 0.8rem;
  border-radius: 0.5rem;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s ease;
  font-size: 0.95rem;
}

.AppartmentListMain-visit-button:hover {
  background-color: #0c3d71;
}

/* Pagination */
.AppartmentListMain-pagination {
  margin-top: 2.5rem;
  margin-bottom: 2rem;
  display: flex;
  justify-content: center;
}

.AppartmentListMain-pagination-controls {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  justify-content: center;
}

.AppartmentListMain-page-button {
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: 1px solid #e5e7eb;
  background-color: white;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
  font-size: 0.9rem;
}

.AppartmentListMain-page-button.AppartmentListMain-active {
  background-color: #0c447e;
  color: white;
  border-color: #0c447e;
}

/* Styles pour les boutons Précédent/Suivant */
.AppartmentListMain-page-button:not(.AppartmentListMain-page-button[data-page]) {
  width: auto;
  padding: 0.625rem 1.5rem;
  border-radius: 0.375rem;
}

.AppartmentListMain-page-button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.AppartmentListMain-page-button:hover:not(:disabled) {
  background-color: #f3f4f6;
}

.AppartmentListMain-page-button.AppartmentListMain-active:hover {
  background-color: #0c447e;
}

/* section pour les devise */
.AppartmentListMain-price-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1rem;
}

.AppartmentListMain-currency-select {
  padding: 0.25rem 0.5rem;
  border: 1px solid #d1d5db;
  border-radius: 0.25rem;
  background-color: #f9fafb;
  font-size: 0.75rem;
  cursor: pointer;
  outline: none;
}

.AppartmentListMain-price-input {
  width: 5.5rem;
}

/* Responsive pour la grille 3x3 */
@media (max-width: 1280px) {
  .AppartmentListMain-apartment-card {
    width: 100%;
    max-width: 500px;
    border: 1px solid var(--border-dark);
    border-radius: 0.8rem;
    overflow: hidden;
    background: var(--bg-white);
    transition: transform 0.2s ease;
  }
}

@media (max-width: 960px) {
  .AppartmentListMain-apartments-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .AppartmentListMain-content-wrapper {
    flex-direction: column;
  }

  .AppartmentListMain-filter-sidebar {
    width: 100%;
    margin-bottom: 1.5rem;
  }
}

@media (max-width: 640px) {
  .AppartmentListMain-apartments-grid {
    grid-template-columns: 1fr;
  }
  .AppartmentListMain-apartment-card {
    max-width: 100%;
  }
  .AppartmentListMain-header-line {
    width: 30px;
  }

  .AppartmentListMain-header-title {
    font-size: 1rem;
    margin: 0 0.75rem;
  }
}

/* AppartmentListMain-container */
/* AppartmentListMain-apartments-grid */

/* Error and No Results Messages */
.AppartmentListMain-error,
.AppartmentListMain-no-results {
  text-align: center;
  padding: 2rem;
  background-color: #fff;
  border-radius: 0.5rem;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  margin: 0.25rem 0;
  color: #dc2626;
  font-size: 1.1rem;
  font-weight: 500;
}

.AppartmentListMain-no-results {
  color: #0c447e;
}

/* Ajouter à la fin de AppartementList.css */

/* Styles pour le modal */
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.modal-content {
  background-color: white;
  border-radius: 0.5rem;
  padding: 1.5rem;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  max-width: 400px;
  width: 100%;
}

.modal-title {
  font-size: 1.25rem;
  font-weight: 600;
  color: #374151;
  margin-bottom: 1rem;
}

.modal-message {
  font-size: 0.875rem;
  color: #6b7280;
  margin-bottom: 1.5rem;
}

.modal-buttons {
  display: flex;
  gap: 1rem;
  justify-content: flex-end;
}

.modal-login-btn,
.modal-cancel-btn {
  padding: 0.625rem 1.25rem;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s;
}

.modal-login-btn {
  background-color: #0c447e;
  color: white;
  border: none;
}

.modal-login-btn:hover {
  background-color: #0c3d71;
}

.modal-cancel-btn {
  background-color: #f3f4f6;
  color: #4b5563;
  border: 1px solid #d1d5db;
}

.modal-cancel-btn:hover {
  background-color: #e5e7eb;
}

/* Bouton filtre mobile - caché par défaut */
.AppartmentListMain-mobile-filter-button-container {
  display: none;
}

.AppartmentListMain-mobile-filter-button {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  background-color: #0c447e;
  color: white;
  border: none;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  transition: background-color 0.2s;
  margin-bottom: 1.5rem;
}

.AppartmentListMain-mobile-filter-button:hover {
  background-color: #0c3d71;
}

/* Overlay pour fermer le filtre mobile */
.AppartmentListMain-mobile-filter-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 999;
}

/* Bouton fermer pour mobile - caché par défaut */
.AppartmentListMain-mobile-close-button {
  display: none;
  width: 2rem;
  height: 2rem;
  border: none;
  background: none;
  cursor: pointer;
  color: #6b7280;
  padding: 0;
  align-items: center;
  justify-content: center;
}

.AppartmentListMain-mobile-close-button:hover {
  color: #374151;
}

/* Bouton Appliquer pour mobile - caché par défaut */
.AppartmentListMain-mobile-apply-button-container {
  display: none;
  padding: 1.25rem;
  border-top: 1px solid #e5e7eb;
}

.AppartmentListMain-mobile-apply-button {
  width: 100%;
  padding: 0.75rem;
  background-color: #0c447e;
  color: white;
  border: none;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s;
}

.AppartmentListMain-mobile-apply-button:hover {
  background-color: #0c3d71;
}

/* Styles responsifs pour mobile */
@media (max-width: 1024px) {
  /* Afficher le bouton filtre mobile */
  .AppartmentListMain-mobile-filter-button-container {
    display: block;
  }

  /* Modifier le header des filtres pour inclure le bouton fermer */
  .AppartmentListMain-filter-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .AppartmentListMain-mobile-close-button {
    display: flex;
  }

  /* Afficher le bouton Appliquer */
  .AppartmentListMain-mobile-apply-button-container {
    display: block;
  }

  /* Afficher l'overlay quand le filtre est ouvert */
  .AppartmentListMain-mobile-filter-overlay {
    display: block;
  }

  /* Modifier la sidebar pour le comportement mobile */
  .AppartmentListMain-filter-sidebar {
    position: fixed;
    top: 0;
    left: -100%;
    height: 100vh;
    width: 320px;
    max-width: 85vw;
    z-index: 1000;
    transition: left 0.3s ease-in-out;
    overflow-y: auto;
  }

  .AppartmentListMain-filter-sidebar.AppartmentListMain-mobile-open {
    left: 0;
  }

  .AppartmentListMain-filter-card {
    height: 100%;
    border-radius: 0;
    box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1);
  }

  /* Ajuster le contenu pour ne pas être caché par la sidebar */
  .AppartmentListMain-content-wrapper {
    flex-direction: column;
  }
}

/* Pour les très petits écrans */
@media (max-width: 480px) {
  .AppartmentListMain-filter-sidebar {
    width: 100vw;
    max-width: 100vw;
  }
}

/* Styles pour AppartementList */

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-family: 'Poppins', sans-serif;
}

body {
  background-color: #f5f5f5;
  color: #333;
}

.AppartmentListMain-container {
  max-width: 1920px;
  margin: 0 auto;
}

.AppartmentListMain-main-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1rem;
}

.AppartmentListMain-content-wrapper {
  display: flex;
  gap: 2rem;
}

/* [Tous les styles existants restent inchangés jusqu'au modal...] */

/* Nouveaux styles pour le modal amélioré */
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.6);
  -webkit-backdrop-filter: blur(5px);
          backdrop-filter: blur(5px);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  animation: fadeIn 0.3s ease-out;
}

.modal-content {
  background-color: white;
  border-radius: 1rem;
  padding: 2rem;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
  max-width: 420px;
  width: 90%;
  text-align: center;
  transform: translateY(0);
  animation: slideUp 0.4s ease-out;
}

.modal-icon {
  margin-bottom: 1.5rem;
}

.modal-icon svg {
  animation: pulse 1.5s infinite;
}

.modal-title {
  font-size: 1.5rem;
  font-weight: 600;
  color: #0c447e;
  margin-bottom: 1rem;
}

.modal-message {
  font-size: 1rem;
  color: #4b5563;
  margin-bottom: 2rem;
  line-height: 1.5;
}

.modal-buttons {
  display: flex;
  gap: 1rem;
  justify-content: center;
}

.modal-login-btn,
.modal-cancel-btn {
  padding: 0.75rem 1.5rem;
  border-radius: 0.5rem;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
}

.modal-login-btn {
  background-color: #0c447e;
  color: white;
  border: none;
  box-shadow: 0 2px 5px rgba(12, 68, 126, 0.3);
}

.modal-login-btn:hover {
  background-color: #0a3a6b;
  transform: translateY(-2px);
}

.modal-cancel-btn {
  background-color: white;
  color: #4b5563;
  border: 1px solid #d1d5db;
}

.modal-cancel-btn:hover {
  background-color: #f3f4f6;
  transform: translateY(-2px);
}

/* Animations */
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes slideUp {
  from {
    transform: translateY(20px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes pulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
  100% {
    transform: scale(1);
  }
}

.AppartmentListMain-apartment-card {
  width: 100%;
  max-width: 380px;
  height: 420px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid var(--border-dark);
  border-radius: 0.8rem;
  overflow: hidden;
  background: var(--bg-white);
  transition: transform 0.2s ease;
}

.AppartmentListMain-apartment-image-container {
  position: relative;
  height: 180px;
  flex-shrink: 0;
}

.AppartmentListMain-apartment-details {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 1rem 1.25rem;
}

.AppartmentListMain-apartment-title {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-primary);
  line-height: 1.3;
  height: 2.8rem; /* même espace pour 2 lignes max */
  overflow: hidden;
}

.AppartmentListMain-apartment-subtitle {
  color: var(--text-secondary);
  font-size: 0.9rem;
  line-height: 1.2;
  height: 2.4rem; /* 2 lignes max */
  overflow: hidden;
  margin-bottom: 0.5rem;
}

.AppartmentListMain-options-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 0.5rem;
  height: 2.4rem;
  overflow: hidden;
}

.AppartmentListMain-apartment-price {
  font-weight: 700;
  color: var(--primary-color);
  font-size: 1.05rem;
  margin: 0.25rem 0;
}

.AppartmentListMain-price-period {
  font-size: 0.8rem;
  color: #6b7280;
  margin-bottom: 0.5rem;
}

.AppartmentListMain-visit-button-contener {
  margin-top: auto;
  padding-top: 0.5rem;
}

.AppartmentListMain-visit-button {
  width: 100%;
  background: var(--primary-color);
  color: white;
  border: none;
  padding: 0.75rem;
  border-radius: 0.5rem;
  font-weight: 500;
  font-size: 0.9rem;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.AppartmentListMain-visit-button:hover {
  background-color: #0c3d71;
}


/* Conteneur global */
.CustomSelect {
  position: relative;
  width: 90%;
  max-width: 400px; /* Limite la largeur pour éviter un étirement excessif */
  margin: 5px auto; /* Centre le composant */
  font-size: 0.95rem;
}

/* Bouton fermé */
.CustomSelect-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 14px;
  padding: 0.9rem 1rem;
  cursor: pointer;
  color: #222;
  box-shadow: 0 3px 15px rgba(0, 0, 0, 0.05);
  transition: all 0.25s ease;
  width: 100%;
  text-align: left;
}

.CustomSelect-trigger:hover {

  box-shadow: 0 4px 18px rgba(15, 68, 126, 0.1);
}

.CustomSelect-trigger:focus {
  outline: none;
  border-color: #0f447e;
  border-color: var(--primary-color, #0f447e);
  box-shadow: 0 0 0 2px rgba(15, 68, 126, 0.2);
}

/* Liste déroulante */
.CustomSelect-options {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  background: #fff;
  border-radius: 7px;

  overflow: hidden;
  border: 1px solid #ddd;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
  animation: fadeDown 0.25s ease forwards;
  z-index: 20;
  max-height: 300px;
  overflow-y: auto;
}

/* Animation */
@keyframes fadeDown {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Option */
.CustomSelect-option {
  padding: 0.4rem 1rem;
  cursor: pointer;
  transition: background 0.2s ease, padding-left 0.2s ease;
  color: #222;
}

.CustomSelect-option:last-child {
  margin-bottom: 0;
}

/* Effet hover sur chaque choix */
.CustomSelect-option:hover {
  background: #0f447e;
  padding-left: 1.3rem;
  color: #ffffff;
}

/* Option sélectionnée */
.CustomSelect-option.selected {
  background: rgba(15, 68, 126, 0.12);
  font-weight: 600;
}

/* Accessibilité : focus visible */
.CustomSelect-option:focus {
  outline: none;
  background: rgba(15, 68, 126, 0.15);
}

/* Mobile friendly */
@media (max-width: 480px) {
  .CustomSelect-options {
    max-height: 260px;
  }
}

/* État désactivé */
.CustomSelect:disabled .CustomSelect-trigger {
  background: #f5f5f5;
  cursor: not-allowed;
  opacity: 0.7;
}

.pagination-container {
    margin-bottom: 20px;
}
/* Base styling */
.SearchAppartement-searchOverlay {
  position: relative;
  width: 90%;
  max-width: 1200px;
  margin: 0 auto;
  z-index: 10; /* Z-index par défaut */
  transition: z-index 0s ease; /* Transition instantanée pour le z-index */
}

/* Classe qui s'applique quand le popup est ouvert */
.SearchAppartement-searchOverlay--popup-open {
  z-index: 1000; /* Z-index élevé quand le popup est ouvert */
}

/* Barre de recherche simple */
.SearchAppartement-searchBar {
  background-color: #ffffff;
  border-radius: 50px;
  padding: 16px 24px;
  margin-top: 10px; /* Réduit de 30px à 10px */
  margin-bottom: 30px;
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  border: 1px solid #e5e7eb;
  transition: all 0.3s ease;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

.SearchAppartement-searchBar:hover {
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
  transform: translateY(-2px);
}

.SearchAppartement-searchBarIcon {
  color: #0C447E;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
}

.SearchAppartement-searchBarText {
  color: #374151;
  font-size: 16px;
  font-weight: 400;
  flex: 1 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Header avec les lignes horizontales */
.AppartmentListMain-header-container {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem 0 1rem 0; /* Réduit de 2rem 0 à 1.5rem 0 1rem 0 */
  margin-bottom: 0.5rem; /* Réduit de 1.5rem à 0.5rem */
}

.AppartmentListMain-header-line {
  background-color: #0C447E;
  border-radius: 5px;
  width: 160px;
}

.AppartmentListMain-header-title {
  margin: 0 1.5rem;
  font-weight: 600;
  font-size: 1.5rem;
  white-space: nowrap;
}

.AppartmentListMain-blue-text {
  color: #0C447E;
}

.AppartmentListMain-red-text {
  color: #dc2626;
}

/* Overlay du popup */
.SearchAppartement-popupOverlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: 20px;
  -webkit-backdrop-filter: blur(3px);
          backdrop-filter: blur(3px);
}

/* Popup de recherche */
.SearchAppartement-searchPopup {
  background-color: #ffffff;
  border-radius: 16px;
  padding: 24px;
  width: 100%;
  max-width: 500px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  position: relative;
  z-index: 10000;
  animation: popupSlideIn 0.3s ease-out;
}

@keyframes popupSlideIn {
  from {
    opacity: 0;
    transform: scale(0.95) translateY(-20px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

/* Header du popup */
.SearchAppartement-popupHeader {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid #e5e7eb;
}

.SearchAppartement-popupHeader h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  color: #111827;
}

.SearchAppartement-closeButton {
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  border-radius: 6px;
  color: #6b7280;
  transition: all 0.2s ease;
}

.SearchAppartement-closeButton:hover {
  background-color: #f3f4f6;
  color: #374151;
}

/* Radio Buttons */
.SearchAppartement-radioContainer {
  display: flex;
  gap: 24px;
  margin-bottom: 20px;
  justify-content: center;
}

.SearchAppartement-radioLabel {
  display: flex;
  align-items: center;
  cursor: pointer;
  font-size: 15px;
  font-weight: 500;
  color: #374151;
  position: relative;
  padding: 4px 0;
}

.SearchAppartement-radioInput {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.SearchAppartement-radioCustom {
  position: relative;
  display: inline-block;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  margin-right: 8px;
  background-color: #ffffff;
  border: 2px solid #d1d5db;
  transition: all 0.2s ease;
}

.SearchAppartement-radioLabel input:checked + .SearchAppartement-radioCustom {
  background-color: #0C447E;
}

.SearchAppartement-radioLabel input:checked + .SearchAppartement-radioCustom::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: white;
}

/* Inputs dans le popup */
.SearchAppartement-popupInputs {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 24px;
}

.SearchAppartement-inputGroup {
  display: flex;
  align-items: center;
  background-color: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 12px 16px;
  position: relative;
  transition: all 0.2s ease;
}

.SearchAppartement-inputGroup:focus-within {
  border-color: #0C447E;
  background-color: #ffffff;
  box-shadow: 0 0 0 3px rgba(12, 68, 126, 0.1);
}

.SearchAppartement-icon {
  color: #0C447E;
  margin-right: 10px;
  flex-shrink: 0;
  cursor: pointer;
  width: 20px;
  height: 20px;
}

.SearchAppartement-input {
  border: none;
  background: transparent;
  width: 100%;
  outline: none;
  font-size: 14px;
  cursor: pointer;
  color: #374151;
}

.SearchAppartement-input::placeholder {
  color: #9ca3af;
}

/* Zone Dropdown */
.SearchAppartement-zoneDropdown {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background-color: white;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
  z-index: 10001;
  margin-top: 8px;
  padding: 8px 0;
  list-style: none;
  border: 1px solid #e5e7eb;
  max-height: 200px;
  overflow-y: auto;
}

.SearchAppartement-zoneDropdownItem {
  padding: 10px 16px;
  cursor: pointer;
  font-size: 14px;
  color: #374151;
  transition: background-color 0.2s ease;
}

.SearchAppartement-zoneDropdownItem:hover {
  background-color: #f3f4f6;
}

/* Occupancy Info */
.SearchAppartement-occupancyInfo {
  font-size: 14px;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1 1;
  color: #374151;
}

/* Room Counter */
.SearchAppartement-counterDisplay {
  flex: 1 1;
  font-size: 14px;
  white-space: nowrap;
  color: #374151;
}

.SearchAppartement-counterButtons {
  display: flex;
  align-items: center;
  gap: 12px;
}

.SearchAppartement-counterButton {
  width: 32px;
  height: 32px;
  background-color: #0C447E;
  color: white;
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  flex-shrink: 0;
  transition: background-color 0.2s ease;
}

.SearchAppartement-counterButton:hover {
  background-color: #0A3B6C;
}

.SearchAppartement-counterButton:disabled {
  background-color: #d1d5db;
  cursor: not-allowed;
}

/* Search Button */
.SearchAppartement-searchButton {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background-color: #0F447E;
  color: white;
  border: none;
  padding: 14px 24px;
  border-radius: 12px;
  cursor: pointer;
  transition: all 0.3s ease;
  white-space: nowrap;
  font-weight: 500;
  font-size: 16px;
  width: 100%;
}

.SearchAppartement-searchButton:hover {
  background-color: #0A3B6C;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(12, 68, 126, 0.3);
}

.SearchAppartement-searchButton:disabled {
  opacity: 0.7;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

.SearchAppartement-searchIcon {
  color: white;
  width: 18px;
  height: 18px;
}

/* Calendar styles - CORRIGÉ POUR LES CERCLES PARFAITS */
.SearchAppartement-calendarDropdown {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: calc(100vw - 40px) !important;
  max-width: 380px !important;
  max-height: 85vh !important;
  overflow-y: auto !important;
  padding: 20px !important;
  margin: 0 !important;
  background-color: white;
  border-radius: 12px;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
  z-index: 10001;
  border: 1px solid #e5e7eb;
}

.SearchAppartement-calendarHeader {
  font-weight: 600;
  text-align: center;
  margin-bottom: 16px;
  font-size: 16px;
  color: #111827;
}

.SearchAppartement-calendarNavigation {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 8px;
  margin-bottom: 20px;
}

.SearchAppartement-calendarNavButton {
  background: none;
  border: none;
  color: #0F447E;
  cursor: pointer;
  padding: 8px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.2s;
  flex-shrink: 0;
}

.SearchAppartement-calendarNavButton:hover {
  background-color: rgba(12, 68, 126, 0.1);
}

.SearchAppartement-calendarNavButton:disabled {
  color: #d1d5db;
  cursor: not-allowed;
}

.SearchAppartement-yearMonthSelectors {
  display: flex;
  gap: 12px;
  align-items: center;
}

.SearchAppartement-monthSelector,
.SearchAppartement-yearSelector {
  padding: 8px 12px;
  border-radius: 8px;
  border: 1px solid #d1d5db;
  background-color: white;
  color: #374151;
  font-size: 14px;
  cursor: pointer;
  outline: none;
  transition: border-color 0.2s ease;
  min-width: 90px;
}

.SearchAppartement-monthSelector:focus,
.SearchAppartement-yearSelector:focus {
  border-color: #0F447E;
}

.SearchAppartement-calendarDualContainer {
  display: flex;
  gap: 20px;
  justify-content: center;
}

.SearchAppartement-calendarMonth {
  flex: 1 1;
  min-width: 0;
  max-width: 280px;
}

.SearchAppartement-monthYearHeader {
  font-weight: 500;
  text-align: center;
  margin-bottom: 12px;
  color: #374151;
  font-size: 15px;
}

.SearchAppartement-calendarWeekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  text-align: center;
  font-weight: 500;
  color: #6b7280;
  margin-bottom: 8px;
  font-size: 12px;
  grid-gap: 1px;
  gap: 1px;
}

.SearchAppartement-calendarDays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  grid-gap: 2px;
  gap: 2px;
}

.SearchAppartement-calendarDay {
  height: 38px;
  width: 38px; /* Largeur fixe égale à la hauteur */
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 50%; /* Garder le cercle parfait */
  font-size: 14px;
  color: #374151;
  transition: all 0.2s ease;
  position: relative;
  font-weight: 500;
  margin: 0 auto; /* Centrer la cellule dans sa colonne */
}

.SearchAppartement-calendarDay:hover:not(.SearchAppartement-pastDate) {
  background-color: rgba(12, 68, 126, 0.1);
}

.SearchAppartement-today {
  border: 2px solid #0C447E;
  font-weight: 600;
}

.SearchAppartement-startDate,
.SearchAppartement-endDate {
  background-color: #0C447E;
  color: white;
  font-weight: 500;
}

.SearchAppartement-inRange {
  background-color: rgba(12, 68, 126, 0.1);
  color: #0C447E;
}

.SearchAppartement-pastDate {
  color: #d1d5db;
  cursor: not-allowed;
}

.SearchAppartement-calendarActions {
  margin-top: 20px;
  text-align: center;
}

/* Occupancy Dropdown */
.SearchAppartement-occupancyDropdown {
  position: absolute;
  top: 100%;
  right: 0;
  background-color: white;
  border-radius: 12px;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
  z-index: 10001;
  margin-top: 8px;
  width: 280px;
  padding: 20px;
  border: 1px solid #e5e7eb;
}

.SearchAppartement-occupancyItem {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px solid #f3f4f6;
}

.SearchAppartement-occupancyItem:last-of-type {
  border-bottom: none;
}

.SearchAppartement-occupancyLabel {
  font-weight: 500;
  color: #374151;
  font-size: 14px;
}

.SearchAppartement-occupancyControls {
  display: flex;
  align-items: center;
  gap: 12px;
}

.SearchAppartement-counterValue {
  font-weight: 500;
  width: 20px;
  text-align: center;
  color: #374151;
}

.SearchAppartement-applyButton {
  display: block;
  width: 100%;
  background-color: #0F447E;
  color: white;
  border: none;
  padding: 12px;
  border-radius: 8px;
  margin-top: 16px;
  cursor: pointer;
  font-weight: 500;
  transition: all 0.3s ease;
  font-size: 14px;
}

.SearchAppartement-applyButton:hover {
  background-color: #0A3B6C;
}

/* Calendar styling */
.SearchAppartement-calendarMonth {
  flex: 1 1;
  min-width: 0;
}

.SearchAppartement-calendarHeader {
  font-weight: 600;
  text-align: center;
  margin-bottom: 10px;
  font-size: 14px;
}

.SearchAppartement-calendarWeekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  text-align: center;
  font-weight: 500;
  color: #666;
  margin-bottom: 5px;
  font-size: 12px;
}

.SearchAppartement-calendarDays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  grid-gap: 2px;
  gap: 2px;
}

.SearchAppartement-calendarDay {
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 50%;
  font-size: 14px;
}

.SearchAppartement-calendarDay:hover {
  background-color: #f0f0f0;
}

.SearchAppartement-today {
  border: 2px solid #0C447E;
  font-weight: 600;
}

.SearchAppartement-startDate, .SearchAppartement-endDate {
  background-color: #0C447E;
  color: white;
}

.SearchAppartement-inRange {
  background-color: rgba(12, 68, 126, 0.1);
}

.SearchAppartement-pastDate {
  color: #ccc;
  cursor: not-allowed;
}

.SearchAppartement-calendarActions {
  margin-top: 15px;
}

/* Search Results Styles */
.SearchAppartement-searchResults {
  margin-top: 2rem;
  padding: 1rem;
}

.SearchAppartement-searchResults h2 {
  font-size: 1.5rem;
  margin-bottom: 1.5rem;
  color: #333;
}

.SearchAppartement-resultsGrid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  grid-gap: 2rem;
  gap: 2rem;
  padding: 1rem;
}

.SearchAppartement-apartmentCard {
  background: white;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transition: transform 0.2s ease-in-out;
}

.SearchAppartement-apartmentCard:hover {
  transform: translateY(-4px);
}

.SearchAppartement-apartmentImage {
  width: 100%;
  height: 200px;
  object-fit: cover;
}

.SearchAppartement-apartmentInfo {
  padding: 1.5rem;
}

.SearchAppartement-apartmentInfo h3 {
  font-size: 1.2rem;
  margin-bottom: 0.5rem;
  color: #333;
}

.SearchAppartement-location {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: #666;
  margin-bottom: 0.5rem;
}

.SearchAppartement-price {
  font-size: 1.25rem;
  font-weight: 600;
  color: #2c5282;
  margin-bottom: 1rem;
}

.SearchAppartement-apartmentDetails {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  font-size: 0.9rem;
  color: #666;
}

.SearchAppartement-apartmentDetails span {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.SearchAppartement-errorMessage {
  margin-top: 1rem;
  padding: 1rem;
  background-color: #fff5f5;
  color: #c53030;
  border-radius: 8px;
  text-align: center;
  font-size: 14px;
  border: 1px solid #fecaca;
}

/* Responsive Design - Tablette */
@media (max-width: 1024px) {
  .SearchAppartement-searchOverlay {
    width: 95%;
  }

  .SearchAppartement-searchBar {
    max-width: 500px;
    padding: 14px 20px;
  }

  .SearchAppartement-searchPopup {
    max-width: 450px;
    padding: 20px;
  }

  .SearchAppartement-calendarDropdown {
    width: 500px;
    padding: 16px;
  }

  .SearchAppartement-calendarDualContainer {
    gap: 16px;
  }

  .SearchAppartement-calendarMonth {
    max-width: 240px;
  }

  .SearchAppartement-calendarDay {
    height: 36px;
    width: 36px;
    font-size: 13px;
  }
}

/* Responsive Design - Mobile */
@media (max-width: 768px) {
  .SearchAppartement-searchOverlay {
    width: 95%;
  }

  .SearchAppartement-searchBar {
    max-width: 100%;
    margin: 20px auto;
    padding: 12px 16px;
  }

  .SearchAppartement-searchBarText {
    font-size: 11px;
  }

  .AppartmentListMain-header-title {
    font-size: 1.2rem; /* Réduit de 1.5rem à 1.2rem sur mobile */
  }

  .AppartmentListMain-header-container {
    padding: 1rem 0 0.5rem 0; /* Encore plus réduit sur mobile */
    margin-bottom: 0.3rem;
  }

  .SearchAppartement-popupOverlay {
    padding: 10px;
  }

  .SearchAppartement-searchPopup {
    max-width: 100%;
    padding: 16px;
    border-radius: 12px;
  }

  .SearchAppartement-popupHeader h3 {
    font-size: 16px;
  }

  .SearchAppartement-radioContainer {
    gap: 16px;
  }

  .SearchAppartement-radioLabel {
    font-size: 14px;
  }

  .SearchAppartement-popupInputs {
    gap: 12px;
  }

  .SearchAppartement-inputGroup {
    padding: 10px 14px;
  }

  /* Calendar mobile - CERCLES PARFAITS */
  .SearchAppartement-calendarDropdown {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: calc(100vw - 20px) !important;
    max-width: 380px !important;
    max-height: 85vh !important;
    overflow-y: auto !important;
    padding: 16px !important;
    margin: 0 !important;
  }

  .SearchAppartement-calendarDualContainer {
    flex-direction: column;
    gap: 0;
  }

  .SearchAppartement-calendarMonth:last-child {
    display: none; /* Cache le deuxième mois sur mobile */
  }

  .SearchAppartement-calendarMonth {
    max-width: 100%;
  }

  .SearchAppartement-yearMonthSelectors {
    gap: 8px;
    flex-wrap: wrap;
    justify-content: center;
  }

  .SearchAppartement-monthSelector,
  .SearchAppartement-yearSelector {
    min-width: 80px;
    padding: 6px 8px;
    font-size: 13px;
    flex: 1 1;
    max-width: 120px;
  }

  .SearchAppartement-occupancyDropdown {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: calc(100vw - 40px) !important;
    max-width: 320px !important;
    padding: 16px !important;
    margin: 0 !important;
  }

  .SearchAppartement-calendarDay {
    height: 36px;
    width: 36px; /* Largeur fixe pour cercle parfait */
    font-size: 14px;
    border-radius: 50%; /* Cercle parfait */
    font-weight: 500;
    margin: 0 auto; /* Centrer dans la grille */
  }

  .SearchAppartement-calendarWeekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    text-align: center;
    font-weight: 600; /* Augmenté de 500 à 600 */
    color: #6b7280;
    margin-bottom: 12px; /* Augmenté de 8px à 12px */
    font-size: 13px; /* Augmenté de 12px à 13px */
    grid-gap: 1px;
    gap: 1px;
  }

  .SearchAppartement-calendarWeekdays div {
    padding: 8px 0; /* Ajout de padding vertical */
    font-size: 13px; /* Uniformisé */
  }

  .SearchAppartement-counterButton {
    width: 28px;
    height: 28px;
    font-size: 16px;
  }
}

@media (max-width: 480px) {
  .SearchAppartement-searchBar {
    padding: 10px 14px;
    margin: 15px auto;
    margin-bottom: 15px;
  }

  .SearchAppartement-searchBarIcon {
    width: 18px;
    height: 18px;
  }

  .SearchAppartement-searchBarText {
    font-size: 11px;
  }

  .AppartmentListMain-header-title {
    font-size: 1.1rem; /* Encore plus petit sur très petit écran */
  }

  .AppartmentListMain-header-container {
    padding: 0.8rem 0 0.3rem 0;
  }

  .SearchAppartement-searchPopup {
    padding: 12px;
  }

  .SearchAppartement-calendarDropdown {
    width: calc(100vw - 16px) !important;
    max-width: 340px !important;
    padding: 12px !important;
  }

  .SearchAppartement-calendarDay {
    height: 34px;
    width: 34px; /* Largeur fixe pour cercle parfait */
    font-size: 13px;
    border-radius: 50%; /* Cercle parfait */
    font-weight: 500;
    margin: 0 auto;
  }

  .SearchAppartement-calendarWeekdays {
    font-size: 12px;
    margin-bottom: 10px;
  }

  .SearchAppartement-calendarWeekdays div {
    font-size: 12px;
    padding: 6px 0;
  }

  .SearchAppartement-counterButton {
    width: 26px;
    height: 26px;
    font-size: 14px;
  }

  .SearchAppartement-occupancyDropdown {
    width: calc(100vw - 20px) !important;
    max-width: 280px !important;
  }

  .SearchAppartement-monthSelector,
  .SearchAppartement-yearSelector {
    font-size: 12px;
    padding: 4px 6px;
  }
}

/* Très petit écran */
@media (max-width: 375px) {
  .SearchAppartement-calendarDay {
    height: 32px;
    width: 32px; /* Largeur fixe pour cercle parfait */
    font-size: 12px;
    border-radius: 50%; /* Cercle parfait */
    font-weight: 500;
    margin: 0 auto;
  }

  .SearchAppartement-calendarWeekdays {
    font-size: 11px;
    margin-bottom: 8px;
  }

  .SearchAppartement-calendarWeekdays div {
    font-size: 11px;
    padding: 4px 0;
  }

  .SearchAppartement-searchBar {
    margin: 10px auto;
    margin-bottom: auto;
  }

  .SearchAppartement-calendarDropdown {
    max-width: 300px !important;
  }

  .SearchAppartement-calendarNavigation {
    padding: 0 4px;
  }

  .SearchAppartement-calendarNavButton {
    padding: 6px;
  }

  .SearchAppartement-calendarDays {
    gap: 1px; /* Espacement minimal sur très petit écran */
  }
}
@media (max-width: 768px) {
  .SearchAppartement-searchOverlay {

    padding-bottom: 15px !important;

  }
}

/* Tour Popup */
.tour-popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.9);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  animation: fadeIn 0.4s forwards;
}

.tour-popup-content {
  position: relative;
  width: 100%;
  height: 100%;
  max-width: 1000px;
  max-height: 700px;
  background: #000;
  border-radius: 7px;
  overflow: hidden;
}

.close-tour-button {
  position: absolute;
  top: 7px;
  right: 7px;
  background: #E30613;
  border: none;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  cursor: pointer;
  z-index: 10000;
  transition: transform 0.2s ease;
}

.close-tour-button:hover {
  transform: scale(1.1);
}

@keyframes fadeIn {
  to {
    opacity: 1;
  }
}

/* Header Principal */
.appartement-header {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 10px 8px;
  background-color: #fdfdfd;
  border-radius: 6px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

/* Informations de l'appartement */
.appartement-info {
  margin-bottom: 8px;
}

.appartement-title {
  display: flex;
  align-items: center;
  font-size: 14px;
  font-weight: 700;
  color: #0F447E;
  margin: 0;
}

.appartement-dot {
  width: 7px;
  height: 7px;
  background-color: #0F447E;
  border-radius: 50%;
  margin-right: 5px;
  display: inline-block;
}

.appartement-location {
  display: flex;
  align-items: center;
  font-size: 10px;
  color: #0F447E;
  margin-top: 3px;
}

.location-icon {
  margin-right: 4px;
  color: #0F447E;
}

/* Nouvelle grille d'images moderne - Design de l'image */
.modern-gallery-grid {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 4px;
  gap: 4px;
  width: 100%;
  border-radius: 6px;
  overflow: hidden;
}

/* Image principale (grande à gauche) */
.main-image-modern {
  position: relative;
  width: 100%;
  height: 200px;
  overflow: hidden;
  border-radius: 6px 6px 0 0;
  cursor: pointer;
}

.main-image-modern-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.3s ease;
}

.main-image-modern:hover .main-image-modern-img {
  transform: scale(1.05);
}

/* Bouton play sur l'image principale - Style de l'image */
.modern-play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 35px;
  height: 35px;
  background-color: rgba(227, 6, 19, 0.95);
  border-radius: 50%;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  z-index: 10;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.modern-play-button:hover {
  background-color: rgba(227, 6, 19, 1);
  transform: translate(-50%, -50%) scale(1.1);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.4);
}

.modern-play-button svg {
  margin-left: 2px;
}

/* Grille des images secondaires - 3 images empilées verticalement */
.secondary-images-modern {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 4px;
  gap: 4px;
}

/* Images secondaires individuelles */
.secondary-image-modern {
  position: relative;
  width: 100%;
  height: 70px;
  overflow: hidden;
  border-radius: 4px;
  cursor: pointer;
}

.secondary-image-modern-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.3s ease;
}

.secondary-image-modern:hover .secondary-image-modern-img {
  transform: scale(1.05);
}

/* Conteneur du bouton "Voir la galerie" - Design de l'image */
.gallery-button-container {
  position: relative;
  width: 100%;
  height: 70px;
  overflow: hidden;
  border-radius: 4px;
  cursor: pointer;
}

.gallery-overlay-bg {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: brightness(0.5);
  transition: all 0.3s ease;
}

.gallery-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: white;
  font-weight: 600;
  font-size: 9px;
  gap: 3px;
  background: rgba(0, 0, 0, 0.4);
  transition: background 0.3s ease;
}

.gallery-button-container:hover .gallery-overlay-bg {
  filter: brightness(0.4);
  transform: scale(1.05);
}

.gallery-button-container:hover .gallery-overlay {
  background: rgba(0, 0, 0, 0.5);
}

/* Modal de galerie complète */
.gallery-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.85);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9998;
  padding: 14px;
  overflow-y: auto;
}

.gallery-modal-content {
  background: white;
  border-radius: 11px;
  width: 100%;
  max-width: 700px;
  max-height: 90vh;
  overflow-y: auto;
  position: relative;
}

.gallery-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 17px;
  border-bottom: 1px solid #e2e8f0;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  background: white;
  z-index: 10;
}

.gallery-modal-header h3 {
  font-size: 1.05rem;
  font-weight: 600;
  color: #0F447E;
  margin: 0;
}

.close-gallery-button {
  background: #E30613;
  color: white;
  border: none;
  border-radius: 50%;
  padding: 6px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s ease;
}

.close-gallery-button:hover {
  transform: scale(1.1);
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  grid-gap: 8px;
  gap: 8px;
  padding: 17px;
}

.gallery-item {
  position: relative;
  width: 100%;
  height: 140px;
  overflow: hidden;
  border-radius: 6px;
  cursor: pointer;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.gallery-item:hover {
  transform: translateY(-3px);
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15);
}

.gallery-item-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Modal d'image plein écran */
body.modal-open {
  overflow: hidden;
}

.image-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.9);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10000;
}

.image-modal-content {
  position: relative;
  max-width: 95%;
  max-height: 95%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.modal-image {
  max-width: 100%;
  max-height: 85vh;
  object-fit: contain;
  border-radius: 4px;
  transition: opacity 0.3s ease;
}

.close-modal-button {
  position: absolute;
  top: 11px;
  right: 11px;
  background-color: #E30613;
  border: none;
  border-radius: 50%;
  padding: 0;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10001;
  transition: background-color 0.3s ease, transform 0.2s ease;
}

.close-modal-button:hover {
  background-color: rgb(0, 66, 122);
  transform: scale(1.05);
}

.nav-button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background-color: rgb(0, 66, 122);
  color: #fff;
  font-size: 17px;
  font-weight: bold;
  border: none;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.3s ease, transform 0.2s ease;
  z-index: 10;
}

.nav-button:hover {
  background-color: rgb(213, 6, 6);
  transform: translateY(-50%) scale(1.1);
}

.prev-button {
  left: 7px;
}

.next-button {
  right: 7px;
}

.image-indicator {
  position: absolute;
  bottom: -18px;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  gap: 6px;
}

.indicator-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.5);
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.indicator-dot.active {
  background-color: white;
}

/* Popups d'abonnement */
.subscription-popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.6);
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10000;
  animation: fadeIn 0.3s ease-out;
}

.subscription-popup-container {
  background-color: white;
  border-radius: 11px;
  width: 90%;
  max-width: 315px;
  box-shadow: 0 7px 21px rgba(0, 0, 0, 0.15);
  overflow: hidden;
  transform: translateY(0);
  animation: slideUp 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.subscription-popup-header {
  padding: 17px 17px 11px;
  text-align: center;
  background-color: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}

.subscription-popup-icon {
  margin: 0 auto 11px;
  width: 45px;
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #e0e7ff;
  border-radius: 50%;
}

.subscription-popup-icon.success {
  background-color: #dcfce7;
}

.subscription-popup-title {
  font-size: 1.05rem;
  font-weight: 600;
  color: #1e293b;
  margin: 0;
}

.subscription-popup-body {
  padding: 17px;
  text-align: center;
}

.subscription-popup-body p {
  color: #475569;
  line-height: 1.6;
  margin: 0;
  font-size: 0.7rem;
}

.subscription-popup-footer {
  display: flex;
  padding: 11px 17px;
  border-top: 1px solid #e2e8f0;
  gap: 8px;
}

.subscription-popup-footer.single-btn {
  justify-content: center;
}

.subscription-popup-cancel-btn,
.subscription-popup-subscribe-btn,
.subscription-popup-continue-btn {
  flex: 1 1;
  padding: 8px 11px;
  border-radius: 6px;
  font-weight: 500;
  font-size: 0.7rem;
  cursor: pointer;
  transition: all 0.2s ease;
  border: none;
}

.subscription-popup-cancel-btn {
  background-color: #f1f5f9;
  color: #64748b;
}

.subscription-popup-cancel-btn:hover {
  background-color: #e2e8f0;
  transform: translateY(-0.7px);
}

.subscription-popup-subscribe-btn {
  background-color: #0C447E;
  color: white;
  box-shadow: 0 1px 4px rgba(12, 68, 126, 0.3);
}

.subscription-popup-subscribe-btn:hover {
  background-color: #0a3a6b;
  transform: translateY(-0.7px);
}

.subscription-popup-continue-btn {
  background-color: #4BB543;
  color: white;
  box-shadow: 0 1px 4px rgba(75, 181, 67, 0.3);
  max-width: 210px;
}

.subscription-popup-continue-btn:hover {
  background-color: #3fa038;
  transform: translateY(-0.7px);
}

@keyframes slideUp {
  from { 
    transform: translateY(14px);
    opacity: 0;
  }
  to { 
    transform: translateY(0);
    opacity: 1;
  }
}

/* Media Queries - Tablette */
@media (min-width: 768px) {
  .appartement-header {
    padding: 14px;
  }

  .appartement-info {
    margin-bottom: 14px;
  }

  .appartement-title {
    font-size: 21px;
  }

  .appartement-dot {
    width: 11px;
    height: 11px;
  }

  .appartement-location {
    font-size: 12px;
  }

  /* Grille moderne en 2 colonnes sur tablette - comme sur l'image */
  .modern-gallery-grid {
    grid-template-columns: 2fr 1fr;
    gap: 7px;
  }

  .main-image-modern {
    height: 364px;
    border-radius: 8px 0 0 8px;
  }

  .secondary-images-modern {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(3, 1fr);
    gap: 7px;
    height: 364px;
  }

  .secondary-image-modern,
  .gallery-button-container {
    height: 100%;
    min-height: 112px;
  }

  .secondary-image-modern:first-child {
    border-radius: 0 8px 0 0;
  }

  .gallery-button-container {
    border-radius: 0 0 8px 0;
  }

  .modern-play-button {
    width: 56px;
    height: 56px;
  }

  .gallery-overlay {
    font-size: 11px;
  }

  .gallery-grid {
    grid-template-columns: repeat(auto-fill, minmax(175px, 1fr));
  }

  .nav-button {
    width: 32px;
    height: 32px;
    font-size: 18px;
  }

  .prev-button {
    left: -35px;
  }

  .next-button {
    right: -35px;
  }

  .indicator-dot {
    width: 7px;
    height: 7px;
  }
}

/* Media Queries - Desktop */
@media (min-width: 1024px) {
  .appartement-header {
    padding: 17px;
  }

  .main-image-modern {
    height: 420px;
  }

  .secondary-images-modern {
    height: 420px;
  }

  .modern-play-button {
    width: 63px;
    height: 63px;
  }

  .modern-play-button svg {
    width: 28px;
    height: 28px;
  }

  .gallery-overlay {
    font-size: 13px;
  }

  .gallery-grid {
    grid-template-columns: repeat(auto-fill, minmax(196px, 1fr));
    gap: 11px;
  }

  .gallery-item {
    height: 154px;
  }

  .nav-button {
    width: 35px;
    height: 35px;
  }

  .prev-button {
    left: -49px;
  }

  .next-button {
    right: -49px;
  }
}
/* ConditionsEtRegles.css */
.Conditions-section {
    margin-top: 30px;
    margin-bottom: 30px;
    padding: 0 20px;
    width: auto;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
  }
  
  .Section-title {
    color: #0F447E;
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 5px;
    position: relative;
  }
  
  .Section-underline {
    position: relative;
    width: 100%;
    height: 3px;
    background-color: #E8E8E8;
    margin-bottom: 20px;
  }
  
  .Section-underline:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 180px; /* Même largeur que dans les autres composants */
    height: 3px;
    background-color: #0F447E;
  }
  
  .Conditions-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
  }
  
  .Condition-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5px 0;
    width: 100%;
  }
  
  .Condition-left {
    display: flex;
    align-items: center;
  }
  
  .Condition-icon-container {
    background-color: #f5f7fa;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 15px;
  }
  
  .Condition-icon {
    color: #0F447E;
  }
  
  .Condition-description {
    color: #444;
    word-break: normal;
    -webkit-hyphens: auto;
            hyphens: auto;
    font-size: 1rem;
  }
  
  .Condition-separator {
    color: #ddd;
    padding: 0 15px;
    font-weight: 200;
  }
  
  .Condition-value {
    color: #777;
  }
  
  /* Responsive layout */
  @media (max-width: 768px) {
    .Condition-item {
      display: flex;
      flex-wrap: nowrap;
      justify-content: space-between;
      width: 100%;
    }
    
    .Condition-description {
      width: auto;
      flex-grow: 1;
      margin-right: 0;
    }
    
    .Condition-separator {
      display: none;
    }
    
    .Condition-value {
      text-align: right;
      width: 80px; /* Largeur fixe pour aligner tous les valeurs */
    }
  }
/* Responsive layout */
@media (max-width: 768px) {
  .Service-item {
    flex-wrap: nowrap;
  }

  .Section-title {
    font-size: 1.2rem;
  }
}

.Property-container {
  display: flex;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px;
  gap: 30px;
  font-size: 1rem;
}

.Property-details {
  flex: 1 1;
}

.Section-title {
  color: #0F447E;
  font-size: 1.5rem;
  font-weight: 600;
  margin-bottom: 5px;
  position: relative;
}

.Section-underline {
  position: relative;
  width: 100%;
  height: 3px;
  background-color: #E8E8E8;
  margin-bottom: 20px;
}

.Section-underline:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 180px;
  height: 3px;
  background-color: #0F447E;
}

.Description-text {
  color: #555;
  line-height: 1.6;
  margin-bottom: 30px;
  text-align: justify;
  font-size: 1rem;
}

.Characteristics-section {
  margin-top: 30px;
}

.Amenities-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 20px;
  gap: 20px;
}

.Amenity-item {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
}

.Amenity-icon {
  color: #0F447E;
  margin-right: 15px;
}

.Amenity-text {
  color: #444;
  font-size: 1rem;
  word-break: break-word;
}

.Services-section {
  margin-top: 30px;
  margin-bottom: 30px;
}

.Services-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 15px 30px;
  gap: 15px 30px;
  align-items: start;
}

.Service-item {
  display: flex;
  align-items: flex-start;
  gap: 15px;
  width: 100%;
  box-sizing: border-box;
}

.Service-icon-container {
  background-color: #f5f7fa;
  border-radius: 50%;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  align-self: flex-start;
}

.Service-icon {
  color: #0F447E;
  font-size: 1.1rem;
}

.Service-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 1 1;
  gap: 15px;
  min-width: 0;
  align-self: stretch;
}

.Service-description {
  color: #444;
  font-size: 1rem;
  flex: 1 1;
  word-break: break-word;
  align-self: center;
}

.Service-frequency {
  color: #666;
  font-size: 0.85rem;
  white-space: nowrap;
  flex-shrink: 0;
  align-self: center;
}

.Property-card {
  background-color: white;
  border-radius: 8px;
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
  padding: 20px;
  width: 320px;
  position: relative;
}

.Card-location {
  color: #444;
  font-size: 0.9rem;
  margin-bottom: 5px;
}

.New-tag {
  background-color: #f8d84a;
  color: #333;
  font-size: 0.8rem;
  font-weight: 500;
  padding: 3px 10px;
  border-radius: 20px;
  display: inline-block;
  margin-bottom: 10px;
}

.Card-title {
  color: #000;
  font-size: 1.1rem;
  font-weight: 500;
  margin-bottom: 10px;
}

.Card-price {
  color: #000;
  font-size: 1.2rem;
  font-weight: 600;
  margin-bottom: 20px;
}

.Amenities-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 15px;
}

.Badge {
  display: flex;
  align-items: center;
  background-color: #f5f5f5;
  padding: 5px 10px;
  border-radius: 20px;
  font-size: 0.8rem;
}

.Badge-icon {
  color: #0F447E;
  margin-right: 5px;
}

.Badge-text {
  color: #444;
  font-size: 0.8rem;
}

.Reserve-button {
  background: linear-gradient(to right, #0F447E, #207cca);
  color: white;
  border: none;
  border-radius: 10px;
  padding: 12px 0;
  width: 100%;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.3s;
  margin: 20px 0;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.Reserve-button:hover {
  background: linear-gradient(to right, #0F447E, #1a6cb1);
  box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15);
  transform: translateY(-1px);
}

.Reserve-button.reserving {
  background: linear-gradient(to right, #0F447E, #1660a0);
  transform: translateY(1px);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.Customer-service {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #666;
  font-size: 0.85rem;
}

.blur-background {
  filter: blur(5px);
  transition: filter 0.3s ease;
  pointer-events: none;
}

body.modal-open {
  overflow: hidden;
}

.image-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.7);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.image-modal-content {
  position: relative;
  max-width: 95%;
  max-height: 95%;
  display: flex;
  justify-content: center;
  align-items: center;
  pointer-events: auto;
}

.appartement-details-container,
.appartement-sidebar,
header,
footer {
  transition: filter 0.3s ease;
}

@media (max-width: 768px) {
  .Property-container {
    flex-direction: column;
    display: flex;
  }
  .Property-card {
    width: 100%;
  }
  .Section-title {
    font-size: 1.2rem;
  }
  .Services-list {
    grid-template-columns: 1fr;
    gap: 15px;
  }
  .Service-item {
    align-items: flex-start;
    gap: 8px;
  }
  .Service-icon-container {
    width: 32px;
    height: 32px;
  }
  .Service-description {
    font-size: 0.9rem;
  }
  .Service-frequency {
    font-size: 0.75rem;
  }
  .Amenities-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px 15px;
  }
  .Amenity-item {
    margin-bottom: 10px;
    font-size: 0.85rem;
  }
  .Amenity-icon {
    margin-right: 8px;
    font-size: 0.9rem;
  }
  .Amenity-text {
    font-size: 0.85rem;
  }
}

/* Base container styles */
.avail-container {
  max-width: 900px;
  margin: 0 auto;
  padding: 15px;
  font-family: Arial, sans-serif;
}

.avail-title {
  color: #0F447E;
  font-size: 1.4rem;
  font-weight: 600;
  margin-bottom: 5px;
}

.avail-underline {
  position: relative;
  width: 100%;
  height: 3px;
  background-color: #E8E8E8;
  margin-bottom: 20px;
}

.avail-underline:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 250px;
  height: 3px;
  background-color: #0F447E;
}

/* Calendar container */
.avail-calendar-container {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  padding: 15px;
  margin-top: 20px;
}

/* Legend styles */
.avail-legend {
  display: flex;
  justify-content: center;
  margin-bottom: 15px;
  gap: 15px;
}

.avail-legend-item {
  display: flex;
  align-items: center;
  font-size: 0.85rem;
}

.avail-legend-color {
  width: 15px;
  height: 15px;
  border-radius: 50%;
  margin-right: 5px;
}

.avail-available {
  background-color: #fff;
  border: 1px solid #ddd;
}


.avail-selected {
  background-color: #0F447E;
  border: 1px solid #0F447E;
}

/* Date selectors container */
.avail-date-selectors {
  display: flex;
  justify-content: space-between;
  gap: 20px;
}

.avail-date-selector-column {
  flex: 1 1;
  max-width: 50%;
}

/* Month navigation */
.avail-month-navigation {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

.avail-nav-button {
  background: none;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  padding: 5px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.avail-nav-button:hover {
  background-color: #f5f5f5;
}

/* Select styles */
.avail-select-container {
  position: relative;
  display: inline-block;
}

.avail-month-select, .avail-year-select {
  -webkit-appearance: none;
          appearance: none;
  padding: 6px 30px 6px 10px;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  background-color: #fff;
  font-size: 0.9rem;
  cursor: pointer;
  width: auto;
}

.avail-year-select-container {
  margin-bottom: 15px;
}

.avail-select-icon {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  color: #777;
}

/* Date label */
.avail-date-label {
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 5px;
  color: #0F447E;
}

.avail-selected-date {
  font-size: 0.9rem;
  margin-bottom: 10px;
  color: #555;
}

/* Calendar grid */
.avail-calendar {
  margin-bottom: 20px;
}

.avail-calendar-header {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  text-align: center;
  font-weight: 600;
  font-size: 0.8rem;
  color: #555;
  margin-bottom: 5px;
}

.avail-weekday {
  padding: 5px 0;
}

.avail-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  grid-gap: 1px;
  gap: 1px;
  justify-items: center;
}

.avail-day {
  text-align: center;
  padding: 8px 0;
  border-radius: 50%;
  cursor: pointer;
  font-size: 0.85rem;
  border: 1px solid #ddd;
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 2px auto;
  width: 32px;
  height: 32px;
}

.avail-day:hover:not(.avail-empty):not(.avail-unavailable) {
  background-color: #e6f7ff;
  border-color: #0F447E;
}

.avail-empty {
  border: none;
  pointer-events: none;
}

.avail-unavailable {
  background-color: #ededed;
  color: #999;
  cursor: not-allowed;
  border: 1px solid #797979;
}

.avail-selected {
  background-color: #0F447E;
  color: #fff;
  border-color: #0F447E;
}

/* Selected dates info */
.avail-selected-dates-info {
  margin-top: 15px;
  padding: 10px;
  background-color: #f0f7ff;
  border-radius: 4px;
  font-size: 0.9rem;
}

/* Responsive styles */
@media (max-width: 768px) {
  .avail-date-selectors {
    flex-direction: column;
  }
  
  .avail-date-selector-column {
    max-width: 100%;
  }
  
  .avail-legend {
    flex-wrap: wrap;
  }
}
.leaflet-fullscreen-icon {
	background-image: url(/static/media/icon-fullscreen.5c475029ed8df9adae01.svg);
	background-size: 26px 52px;
}

.leaflet-fullscreen-icon.leaflet-fullscreen-on {
	background-position: 0 -26px;
}

.leaflet-touch .leaflet-fullscreen-icon {
	background-position: 2px 2px;
}

.leaflet-touch .leaflet-fullscreen-icon.leaflet-fullscreen-on {
	background-position: 2px -24px;
}

/* Safari still needs this vendor-prefix: https://caniuse.com/mdn-css_selectors_fullscreen */
/* stylelint-disable-next-line selector-no-vendor-prefix */

.leaflet-container:fullscreen {
	width: 100% !important;
	height: 100% !important;
	z-index: 99999;
}

.leaflet-pseudo-fullscreen {
	position: fixed !important;
	width: 100% !important;
	height: 100% !important;
	top: 0 !important;
	left: 0 !important;
	z-index: 99999;
}

.localisation-container {
  margin-top: 30px;
  margin-bottom: 30px;
  padding: 0 20px;
  width: auto;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  height: 600px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.localisation-title {
  color: #0F447E;
  font-size: 1.5rem;
  font-weight: 600;
  margin-bottom: 5px;
  position: relative;
  flex-shrink: 0;
}

.localisation-underline {
  position: relative;
  width: 100%;
  height: 3px;
  background-color: #E8E8E8;
  margin-bottom: 20px;
  flex-shrink: 0;
}

.localisation-underline:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 150px;
  height: 3px;
  background-color: #0F447E;
}

.localisation-content {
  position: relative;
  background-color: #fff;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  border: 1px solid #e2e8f0;
  flex: 1 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-height: 0;
}

.localisation-info {
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1 1;
  overflow: hidden;
  min-height: 0;
}

.localisation-address {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
  flex-shrink: 0;
}

.localisation-address h3 {
  font-size: 1.1rem;
  font-weight: 600;
  color: #1a202c;
  margin: 0;
}

.address-icon {
  color: #0F447E;
  flex-shrink: 0;
}

.reservation-notice {
  display: flex;
  flex-direction: column;
  gap: 4px;
  color: #4a5568;
  font-size: 0.95rem;
  margin-bottom: 0;
  flex-shrink: 0;
}

.lock-info {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #718096;
  font-size: 0.85rem;
  font-style: italic;
  margin-top: 0;
  margin-bottom: 0;
}

.map-container {
  position: relative;
  width: 100%;
  border-radius: 8px;

  flex: 1 1;
  min-height: 0;
  background: #f0f0f0;
}

.map-placeholder {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #6c6c6c;
  display: flex;
  align-items: center;
  justify-content: center;
}

.map-overlay {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: white;
  gap: 8px;
  padding: 20px;
}

.map-overlay p {
  font-size: 1rem;
  font-weight: 500;
  margin: 0;
}

.leaflet-container {
  width: 100% !important;
  height: 100% !important;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 8px;
  z-index: 10;
}

/* Sélecteur Desktop - Boutons */
.map-layer-selector.desktop-selector {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 99;
  background: white;
  padding: 6px;
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
  display: flex;
  gap: 6px;
}

.layer-button {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border: 2px solid transparent;
  border-radius: 8px;
  background: #f8f9fa;
  color: #4a5568;
  font-size: 0.85rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
  outline: none;
}

.layer-button:hover {
  background: #e8eaed;
  color: #0F447E;
}

.layer-button.active {
  background: #0F447E;
  color: white;
  border-color: #0F447E;
}

.layer-button svg {
  flex-shrink: 0;
}

.layer-name {
  display: inline;
}

/* Sélecteur Mobile - Custom (caché par défaut) */
.map-layer-selector.mobile-selector {
  display: none;
}

/* Personnalisation des boutons de zoom ET plein écran */
.leaflet-control-zoom,
.leaflet-control-fullscreen {
  border: none !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15) !important;
  border-radius: 12px !important;
  overflow: hidden;
}

/* Style unifié pour TOUS les boutons de contrôle */
.leaflet-control-zoom a,
.leaflet-control-fullscreen a,
.leaflet-control-zoom-fullscreen {
  width: 36px !important;
  height: 36px !important;
  line-height: 36px !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  color: #0F447E !important;
  background: white !important;
  background-image: none !important;
  border: none !important;
  transition: all 0.2s ease !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.leaflet-control-zoom a:hover,
.leaflet-control-fullscreen a:hover,
.leaflet-control-zoom-fullscreen:hover {
  background: #0F447E !important;
  color: white !important;
}

.leaflet-control-zoom-in {
  border-bottom: 1px solid #e2e8f0 !important;
}

/* Icône plein écran personnalisée */
.leaflet-control-fullscreen a,
.leaflet-control-zoom-fullscreen,
.leaflet-fullscreen-icon {
  background-image: none !important;
  text-indent: 0 !important;
}

.leaflet-control-fullscreen a:after,
.leaflet-control-zoom-fullscreen:after {
  content: '⛶';
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Quand on est en plein écran */
.leaflet-fullscreen-on .leaflet-control-fullscreen a:after,
.leaflet-fullscreen-on .leaflet-control-zoom-fullscreen:after {
  content: '⛶';
}

/* Version mobile */
@media (max-width: 767px) {
  .localisation-container {
    height: 500px;
  }

  .localisation-title {
    font-size: 1.3rem;
  }

  .localisation-content {
    padding: 16px;
  }

  /* Cacher le sélecteur desktop */
  .map-layer-selector.desktop-selector {
    display: none;
  }

  /* Afficher le sélecteur mobile custom */
  .map-layer-selector.mobile-selector {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 99;
    display: block;
  }

  /* Trigger du select custom */
  .custom-select-trigger {
    background: linear-gradient(135deg, #0F447E 0%, #1a5a9e 100%);
    padding: 6px 10px;
    border-radius: 20px;
    box-shadow: 0 3px 10px rgba(15, 68, 126, 0.3);
    display: flex;
    align-items: center;
    gap: 6px;
    border: 2px solid rgba(255, 255, 255, 0.2);
    cursor: pointer;
    transition: all 0.2s ease;
    z-index: 99;
  }

  .custom-select-trigger:active {
    transform: scale(0.98);
  }

  .custom-select-trigger svg {
    color: white;
    flex-shrink: 0;
    width: 14px;
    height: 14px;
  }

  .selected-layer-name {
    color: white;
    font-size: 0.8rem;
    font-weight: 600;
  }

  .chevron {
    color: white;
    transition: transform 0.2s ease;
  }

  .chevron.open {
    transform: rotate(180deg);
  }

  /* Overlay pour fermer le dropdown */
  .dropdown-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    background: transparent;
  }

  /* Dropdown personnalisé */
  .custom-dropdown {
    position: absolute;
    top: 42px;
    right: 0;
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    overflow: hidden;
    min-width: 140px;
    animation: slideDown 0.2s ease;
    z-index: 1002;
  }

  @keyframes slideDown {
    from {
      opacity: 0;
      transform: translateY(-10px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  /* Items du dropdown */
  .dropdown-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    cursor: pointer;
    transition: background 0.2s ease;
    border-bottom: 1px solid #f0f0f0;
    position: relative;
  }

  .dropdown-item:last-child {
    border-bottom: none;
  }

  .dropdown-item svg {
    color: #0F447E;
    flex-shrink: 0;
    width: 16px;
    height: 16px;
  }

  .dropdown-item span {
    color: #1a202c;
    font-size: 0.85rem;
    font-weight: 500;
    flex: 1 1;
  }

  .dropdown-item:hover {
    background: #f8f9fa;
  }

  .dropdown-item.active {
    background: #e8f0fe;
  }

  .dropdown-item.active svg {
    color: #0F447E;
  }

  .dropdown-item.active > span {
    color: #0F447E;
    font-weight: 600;
  }

  /* Checkmark pour l'option active */
  .checkmark {
    color: #0F447E;
    font-weight: bold;
    font-size: 1rem;
    margin-left: auto;
  }

  /* Boutons de zoom et plein écran plus petits sur mobile */
  .leaflet-control-zoom a,
  .leaflet-control-fullscreen a,
  .leaflet-control-zoom-fullscreen {
    width: 32px !important;
    height: 32px !important;
    line-height: 32px !important;
    font-size: 18px !important;
  }

  .leaflet-control-fullscreen a:after,
  .leaflet-control-zoom-fullscreen:after {
    font-size: 16px;
  }

  /* Réduire l'ombre sur mobile */
  .leaflet-control-zoom,
  .leaflet-control-fullscreen {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
  }
}

.custom-select-trigger {
  background: white;
  padding: 6px 10px;
  border-radius: 20px;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.12);
  display: flex;
  align-items: center;
  gap: 6px;
  border: 2px solid #e2e8f0;
  cursor: pointer;
  transition: all 0.2s ease;
}

.custom-select-trigger:active {
  transform: scale(0.98);
}

.custom-select-trigger svg {
  color: #0F447E;
  flex-shrink: 0;
  width: 14px;
  height: 14px;
}

.selected-layer-name {
  color: #0F447E;
  font-size: 0.8rem;
  font-weight: 600;
}

.chevron {
  color: #0F447E;
  transition: transform 0.2s ease;
}

.chevron.open {
  transform: rotate(180deg);
}

/* Barre d'outils de la carte */
.map-toolbar {
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 99;
  background: white;
  padding: 6px;
  border-radius: 50px;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.15);
  display: flex;
  gap: 4px;
}

.toolbar-button {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: none;
  background: white;
  color: #0F447E;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  outline: none;
}

.toolbar-button:hover {
  background: #0F447E;
  color: white;
  transform: scale(1.1);
}

.toolbar-button:active {
  transform: scale(0.95);
}

/* Version mobile */
@media (max-width: 767px) {
  .map-toolbar {
    bottom: 20px;
    padding: 4px;
    gap: 3px;
  }

  .toolbar-button {
    width: 32px;
    height: 32px;
  }

  .toolbar-button svg {
    width: 14px;
    height: 14px;
  }
}
/* =============================== */
/* POPUP COMPACT CENTRÉ            */
/* =============================== */

.popup-compact {
  padding: 0 !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  width: 160px !important;        /* Desktop */
  max-width: 85vw !important;
  box-shadow: 0 4px 14px rgba(0,0,0,0.15) !important;
  z-index: 999999 !important;
  text-align: center !important;
}

.popup-header {
  background: #ffffff;
  padding: 10px 12px;
  text-align: center;
}

/* Titre */
.popup-title {
  font-size: 13.5px;
  font-weight: 700;
  margin: 0 0 3px 0;
  color: #0F447E;
  line-height: 1.2;
  text-align: center;
}

/* Adresse */
.popup-address {
  font-size: 12px;
  color: #4a5568;
  margin: 0;
  line-height: 1.2;
  text-align: center;
}

/* Neutralisation Leaflet */
.leaflet-popup-content {
  margin: 0 !important;
  width: auto !important;
  text-align: center !important;
}

.leaflet-popup-content-wrapper {
  padding: 0 !important;
  border-radius: 10px !important;
}

.leaflet-popup-tip {
  background: white !important;
}

/* =============================== */
/* MOBILE : cacher l'adresse       */
/* =============================== */
@media (max-width: 600px) {
  .popup-compact {
    width: 130px !important;       /* Plus petit */
  }

  /* Cacher l'adresse */
  .popup-address {
    display: none !important;
  }

  /* Nom légèrement réduit */
  .popup-title {
    font-size: 12.5px !important;
  }
}

/* PolitiqueAnnulation.css */
.politique-annulation {
    margin-top: 30px;
    margin-bottom: 30px;
    padding: 0 20px;
    width: auto;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
  }
  
  .politique-title {
    color: #0F447E;
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 5px;
    position: relative;
  }
  
  .politique-underline {
    position: relative;
    width: 100%;
    height: 3px;
    background-color: #E8E8E8;
    margin-bottom: 20px;
  }
  
  .politique-underline:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 240px; /* Ajustez selon la longueur du titre */
    height: 3px;
    background-color: #0F447E;
  }
  
  .politique-item {
    display: flex;
    align-items: flex-start;
    padding: 10px 0;
  }
  
  .politique-icon {
    color: #0F447E;
    margin-right: 15px;
    margin-top: 3px;
    flex-shrink: 0;
  }
  
  .politique-content {
    display: flex;
    flex-direction: column;
  }
  
  .politique-heading {
    color: #E30613; /* Rouge */
    font-weight: 600;
    font-size: 1rem;
    margin-bottom: 5px;
  }
  
  .politique-description {
    color: #4a5568;
    margin-bottom: 5px;
  }
  
  .politique-note {
    color: #4a5568;
    font-size: 0.9rem;
  }
  
  /* Responsive adjustments */
  @media (max-width: 768px) {
    .politique-item {
      flex-direction: row;
    }
    
    .politique-icon {
      margin-top: 3px;
    }
  }
/* Responsive adjustments */
@media (max-width: 768px) {
  .politique-item {
    flex-direction: row;
  }

  .politique-icon {
    margin-top: 3px;
  }

  .politique-title {
    font-size: 1.2rem;
  }

  .politique-underline:before {
    width: 180px;
  }
}

:root {
  --t-border: #e6e9f0;
  --card-shadow: 0 8px 24px rgba(15, 34, 58, 0.06);
  --skel-base: #eef2f7;
  --skel-shine: #f7f9fc;
}

/* Carte conteneur */
.booking-skel {
  width: min(360px, 100%);
  background: #fff;
  border: 1px solid #e6e9f0;
  border: 1px solid var(--t-border);
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(15, 34, 58, 0.06);
  box-shadow: var(--card-shadow);
  padding: 18px 18px 16px;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial,
    "Apple Color Emoji", "Segoe UI Emoji";
}

.booking-skel .section {
  margin-top: 14px;
}
.booking-skel .row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 10px 0;
}
.booking-skel .divider {
  height: 1px;
  background: #e6e9f0;
  background: var(--t-border);
  margin: 14px 0;
}

/* Shimmer */
.skel {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  background: #eef2f7;
  background: var(--skel-base);
}
.skel::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, #f7f9fc, transparent);
  background: linear-gradient(90deg, transparent, var(--skel-shine), transparent);
  animation: skel-shine 1.4s infinite;
}
@keyframes skel-shine {
  to {
    transform: translateX(100%);
  }
}

/* Utilitaires tailles */
.h-12 { height: 12px }
.h-16 { height: 16px }
.h-20 { height: 20px }
.h-24 { height: 24px }
.h-28 { height: 28px }
.h-40 { height: 40px }
.h-48 { height: 48px }

.w-20 { width: 20% }
.w-30 { width: 30% }
.w-40 { width: 40% }
.w-50 { width: 50% }
.w-55 { width: 55% }
.w-60 { width: 60% }
.w-65 { width: 65% }
.w-70 { width: 70% }
.w-80 { width: 80% }
.w-100 { width: 100% }

/* Inputs (date / invités) */
.skel-input-wrap {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0;
  border: 1px solid #e6e9f0;
  border: 1px solid var(--t-border);
  border-radius: 14px;
  height: 54px;
}
.skel-input-row {
  display: flex;
  align-items: center;
  height: 100%;
  width: 100%;
}
.skel-input-icon {
  width: 24px;
  height: 24px;
  border-radius: 6px;
  margin-left: 14px;
}
.skel-input-bar {
  height: 14px;
  width: 55%;
  border-radius: 6px;
  margin-left: 10px;
}

/* Bouton */
.skel-btn {
  height: 48px;
  border-radius: 12px;
}

/* Bas de carte (service client) */
.support {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
}
.support-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
}
.support-line {
  height: 12px;
  border-radius: 6px;
}

/* Responsive doux */
@media (max-width: 480px) {
  .booking-skel {
    padding: 16px 14px;
  }
}

/* Style principal de la carte */
.PropertyCard {
  width: 100%;
  max-width: 440px;
  margin: 0 auto;
  padding: 24px;
  background-color: #fff;
  border-radius: 12px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial,
    sans-serif;
  position: relative;
  transition: all 0.3s ease;
}

.PropertyCard-header {
  margin-bottom: 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.PropertyCard-apartment-name {
  font-size: 18px;
  font-weight: 600;
  color: #0f447e;
  margin: 0;
  /* display: none; */
}

.PropertyCard-close-button {
  background: none;
  border: none;
  cursor: pointer;
  color: #4a5568;
  padding: 4px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.2s;
}

.PropertyCard-close-button:hover {
  background-color: #edf2f7;
}

/* Styles des sections */
.PropertyCard-section {
  margin-bottom: 20px;
}

.PropertyCard-section-title {
  font-size: 14px;
  color: #4a5568;
  margin-bottom: 8px;
}

/* Style des affichages d'entrée */
.PropertyCard-input-display {
  display: flex;
  align-items: center;
  padding: 12px 16px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  cursor: pointer;
  transition: border-color 0.2s;
}

.PropertyCard-input-display:hover {
  border-color: #4299e1;
}

.PropertyCard-input-display .PropertyCard-icon {
  color: #4a5568;
  margin-right: 12px;
}

/* Styles des dropdowns */
.PropertyCard-dropdown {
  position: absolute;
  background-color: white;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  z-index: 100;
  width: 320px;
  padding: 16px;
  margin-top: 8px;
}

/* Styles du calendrier */
.PropertyCard-date-tabs {
  display: flex;
  border-bottom: 1px solid #e2e8f0;
  margin-bottom: 12px;
}

.PropertyCard-tab-button {
  flex: 1 1;
  padding: 10px;
  background: none;
  border: none;
  cursor: pointer;
  font-weight: 500;
  color: #718096;
  transition: color 0.2s;
}

.PropertyCard-tab-button.PropertyCard-active {
  color: #0f447e;
  border-bottom: 2px solid #0f447e;
}

.PropertyCard-calendar-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.PropertyCard-month-year {
  font-weight: 500;
  color: #2d3748;
}

.PropertyCard-month-nav {
  background: none;
  border: none;
  cursor: pointer;
  color: #4a5568;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: background-color 0.2s;
}

.PropertyCard-month-nav:hover {
  background-color: #edf2f7;
}

.PropertyCard-weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  margin-bottom: 8px;
}

.PropertyCard-weekdays div {
  text-align: center;
  font-size: 12px;
  color: #718096;
  padding: 4px 0;
}

.PropertyCard-days-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  grid-gap: 2px;
  gap: 2px;
}

.PropertyCard-calendar-day {
  height: 36px;
  width: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  color: #2d3748;
  cursor: pointer;
  border-radius: 50%;
  margin: 0 auto;
}

.PropertyCard-calendar-day:hover:not(.PropertyCard-empty):not(.PropertyCard-past-date) {
  background-color: #edf2f7;
}

.PropertyCard-calendar-day.PropertyCard-empty {
  cursor: default;
}

.PropertyCard-calendar-day.PropertyCard-today {
  font-weight: 600;
}

.PropertyCard-calendar-day.PropertyCard-selected {
  background-color: #0f447e;
  color: white;
}

.PropertyCard-calendar-day.PropertyCard-in-range {
  background-color: #ebf8ff;
  color: #0f447e;
}

.PropertyCard-calendar-day.PropertyCard-past-date {
  color: #cbd5e0;
  cursor: not-allowed;
}

.PropertyCard-calendar-day.PropertyCard-invalid-checkout-date {
  opacity: 0.6;
  cursor: not-allowed;
  text-decoration: line-through;
}

.PropertyCard-selected-dates {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #e2e8f0;
}

.PropertyCard-selected-date {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
}

.PropertyCard-date-label {
  color: #718096;
  font-size: 13px;
}

.PropertyCard-date-value {
  color: #2d3748;
  font-size: 13px;
  font-weight: 500;
}

/* Styles des options d'invités */
.PropertyCard-guest-option {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.PropertyCard-option-label {
  font-size: 14px;
  color: #2d3748;
}

.PropertyCard-number-input {
  display: flex;
  align-items: center;
}

.PropertyCard-number-button {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1px solid #e2e8f0;
  background-color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  transition: background-color 0.2s;
}

.PropertyCard-number-button:hover:not(:disabled) {
  background-color: #edf2f7;
}

.PropertyCard-number-button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.PropertyCard-number-value {
  min-width: 24px;
  text-align: center;
  margin: 0 8px;
  font-size: 14px;
}

/* Styles de la section prix */
.PropertyCard-price-section {
  margin-top: 24px;
  border-top: 1px solid #e2e8f0;
  padding-top: 16px;
}

.PropertyCard-price-row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}

.PropertyCard-subtotal-row {
  margin-top: 12px;
  border-top: 1px solid #f0f4f8;
  padding-top: 12px;
}

.PropertyCard-discount-row {
  margin-bottom: 12px;
  background-color: #f0fff4;
  padding: 8px;
  border-radius: 6px;
}

.PropertyCard-discount-value {
  color: #38a169;
  font-weight: 600;
}

.PropertyCard-total-row {
  margin-top: 12px;
  border-top: 1px solid #e2e8f0;
  padding-top: 12px;
  font-weight: 600;
}

.PropertyCard-price-label {
  color: #2d3748;
  font-size: 14px;
}

.PropertyCard-price-value {
  color: #4a5568;
  font-size: 14px;
}

.PropertyCard-total-value {
  color: #0f447e;
  font-size: 16px;
  font-weight: 700;
}

/* Footer sticky */
.PropertyCard-sticky-footer {
  display: flex;
  flex-direction: column;
  margin-top: 20px;
}

.PropertyCard-price-summary {
  display: flex;
  flex-direction: column;
}

.PropertyCard-price-summary-info {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: #4a5568;
  margin-bottom: 6px;
  padding-bottom: 6px;
  border-bottom: 1px solid #edf2f7;
}

.PropertyCard-price-summary-discount {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  margin-bottom: 6px;
  color: #4a5568;
}

.PropertyCard-price-summary-discount .PropertyCard-discount-value {
  color: #38a169;
  font-weight: 500;
}

.PropertyCard-price-summary-total {
  display: flex;
  justify-content: space-between;
  font-weight: 600;
  margin-bottom: 10px;
}

/* Bouton de réservation */
.PropertyCard-reserve-button {
  width: 100%;
  padding: 14px;
  background: linear-gradient(135deg, #0f447e 0%, #1e5aa8 50%, #164785 100%);
  color: white;
  border: none;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  margin-top: 16px;
}

.PropertyCard-reserve-button:hover {
  background: linear-gradient(135deg, #0f447e, #0c3153);
  transform: translateY(-2px);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.PropertyCard-reserve-button:active {
  transform: scale(0.98);
}

.PropertyCard-reserve-button.PropertyCard-reserving {
  opacity: 0.8;
  transform: scale(0.98);
}

/* Service client */
.PropertyCard-customer-service {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 12px;
  color: #718096;
  font-size: 13px;
}

.PropertyCard-service-icon {
  margin-right: 8px;
  color: #4a5568;
}

/* Bouton d'application pour les dropdowns */
.PropertyCard-apply-button {
  width: 100%;
  padding: 10px;
  background-color: #0f447e;
  color: white;
  border: none;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s;
  margin-top: 12px;
}

.PropertyCard-apply-button:hover {
  background-color: #2c5282;
}

/* Styles spécifiques pour tablettes et mobiles - Étend la couverture jusqu'à 1024px */
@media (max-width: 1024px) {
  .PropertyCard {
    padding: 16px;
    border-radius: 12px;
    max-height: 100vh;
    overflow-y: auto;
  }

  /* Style pour la version mobile/tablette avec le footer fixe */
  .PropertyCard-mobile {
    border-radius: 0;
    max-width: 100%;
    margin: 0;
    padding: 0;
    box-shadow: none;
    /* display: none; */
  }

  /* Style pour cacher le contenu sur mobile/tablette jusqu'au clic sur réserver */
  .PropertyCard-mobile .PropertyCard-content-hidden {
    display: none;
  }

  /* Style pour la vue complète après clic sur réserver */
  .PropertyCard-mobile.PropertyCard-full-view {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    height: 100vh;
    width: 100%;
    max-width: 100%;
    overflow-y: auto;
    background-color: #fff;
    border-radius: 0;
    padding: 16px;
    animation: slideUp 0.3s ease-out;
  }

  @keyframes slideUp {
    from {
      transform: translateY(100%);
    }

    to {
      transform: translateY(0);
    }
  }

  /* Style pour le footer fixe en bas de l'écran */
  .PropertyCard-mobile .PropertyCard-sticky-footer {
    display: flex;
    flex-direction: column;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #fff;
    padding: 12px 16px;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.05);
    z-index: 1000;
    border-top: 1px solid #e2e8f0;
  }

  /* Masquer le footer fixe quand la vue complète est affichée */
  .PropertyCard-mobile.PropertyCard-full-view .PropertyCard-sticky-footer {
    position: relative;
    box-shadow: none;
    border-top: none;
    padding: 0;
    margin-top: 16px;
  }

  /* Ajustement pour le service client */
  .PropertyCard-mobile .PropertyCard-customer-service {
    margin-bottom: 70px;
    display: none;
  }

  .PropertyCard-mobile.PropertyCard-full-view .PropertyCard-customer-service {
    margin-bottom: 16px;
  }

  /* Ajustements pour les popups sur mobile/tablette */
  .PropertyCard-dropdown {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    max-width: 360px;
    max-height: 80vh;
    overflow-y: auto;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  }
}

/* Ajustements spécifiques pour tablettes (768px - 1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
  .PropertyCard-dropdown {
    width: 85%;
    max-width: 400px;
  }

  .PropertyCard-calendar-day {
    height: 40px;
    width: 40px;
    font-size: 14px;
  }

  .PropertyCard-weekdays div {
    font-size: 13px;
  }

  .PropertyCard-input-display {
    padding: 14px 16px;
  }

  .PropertyCard-apartment-name {
    font-size: 20px;
    display: none;
  }

  .PropertyCard-section-title {
    font-size: 15px;
  }
}

/* Styles spécifiques pour mobiles (jusqu'à 768px) */
@media (max-width: 768px) {
  .PropertyCard-calendar-day {
    height: 32px;
    width: 32px;
  }

  .PropertyCard-price-summary-info {
    font-size: 11px;
  }

  .PropertyCard-price-summary-total {
    font-size: 14px;
  }
}

/* Styles pour petits mobiles */
@media (max-width: 480px) {
  .PropertyCard {
    padding: 16px;
    border-radius: 8px;
  }

  .PropertyCard-calendar-day {
    height: 28px;
    width: 28px;
    font-size: 12px;
  }

  .PropertyCard-weekdays div {
    font-size: 11px;
  }

  .PropertyCard-input-display {
    padding: 10px 12px;
  }
}

.PropertyCard-unavailable {
  border: 1px solid #0f447e;
  color: #0f447e;
  position: relative;
  text-decoration: none;
  cursor: not-allowed;
}

.PropertyCard-unavailable::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background-color: #0f447e;
  transform: rotate(-45deg);
}

.PropertyCard-unavailable::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background-color: #0f447e;
  transform: rotate(45deg);
}

.PropertyCard-tooltip {
  background-color: #333;
  color: white;
  padding: 8px 12px;
  border-radius: 4px;
  font-size: 12px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  pointer-events: none;
  white-space: nowrap;
  z-index: 1001;
  position: fixed;
  transform: translate(-50%, -100%);
  margin-top: -8px;
}

.PropertyCard-tooltip::after {
  content: '';
  position: absolute;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%);
  border-width: 5px 5px 0;
  border-style: solid;
  border-color: #333 transparent transparent;
}

.PropertyCard-error-message {
  color: #e30613;
  font-size: 12px;
  margin-top: 8px;
  font-weight: 500;
  /* border: 1px solid #ff0000; */
  background-color: #ffd6d6;
  border-radius: 8px;
  padding: 8px;
  margin-bottom: 8px;
}

@media (max-width: 1024px) {
  .PropertyCard-mobile:not(.PropertyCard-full-view) {
    box-shadow: none;
    background-color: #f5f5f5;
  }
}

.Services-section {
  margin-top: 30px;
  margin-bottom: 30px;
  padding: 0 20px;
  width: auto;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

.Section-title {
  color: #0F447E;
  font-size: 1.5rem;
  font-weight: 600;
  margin-bottom: 5px;
  position: relative;
}

.Section-underline {
  position: relative;
  width: 100%;
  height: 3px;
  background-color: #E8E8E8;
  margin-bottom: 20px;
}

.Section-underline:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 180px;
  height: 3px;
  background-color: #0F447E;
}

.Services-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 0px;
  gap: 0px;
  align-items: start;
}

.Service-item {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  width: 100%;
  box-sizing: border-box;
  flex-wrap: wrap;
}

.Service-icon-wrapper {
  display: flex;
  align-items: flex-start;
  margin-top: 2px;
  flex-shrink: 0;
  flex: 1 1;
  min-width: 0;
}

.Service-icon-container {
  background-color: #f5f7fa;
  border-radius: 50%;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 10px;
  flex-shrink: 0;
  align-self: flex-start;
}

.Service-icon {
  color: #0F447E;
}

.Service-description {
    word-break: normal;
    -webkit-hyphens: auto;
            hyphens: auto;
    color: #444;
    font-size: 1rem;
}

.Service-frequency {
  color: #777;
  text-align: right;
  min-width: -webkit-fit-content;
  min-width: fit-content;
  align-self: center;
  flex-shrink: 0;
  white-space: nowrap;
}

@media (max-width: 768px) {
  .Section-title {
    font-size: 1.2rem;
  }
  .Services-list {
    gap: 0px;
    grid-template-columns: repeat(2, 1fr);
  }
  .Service-item {
    gap: 8px;
    flex-direction: column;
    align-items: stretch;
  }
  .Service-icon-wrapper {
    flex-wrap: wrap;
    max-width: 100%;
  }
  .Service-icon-container {
    width: 30px;
    height: 30px;
    margin-right: 8px;
  }
  .Service-description {
    word-break: normal;
    -webkit-hyphens: auto;
            hyphens: auto;
    color: #444;
    font-size: 1rem; /* Même taille que le texte principal */
  }
  .Service-frequency {
    font-size: 0.8rem;
    text-align: left;
    margin-left: 38px;
  }
}

:root{
  --t-blue:#0F223A;
  --t-red:#e30613;
  --t-border:#E6E9F0;
  --t-shadow:0 8px 24px rgba(15,34,58,.06);
  --gap:20px;
  --radius:16px;
  --maxw:1100px;
}

/* Wrapper */
.sk-wrap{
  width: 100%;
  max-width: 1100px;
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 16px;
}

/* Skeleton base */
.sk-card,
.sk-media,
.sk-field,
.sk-btn,
.sk-bar,
.sk-chip,
.sk-line,
.sk-title,
.sk-pill,
.sk-cal-cell,
.sk-cal-headcell,
.sk-map{
  position: relative;
  background: #f2f4f8;
  border-radius: 16px;
  border-radius: var(--radius);
  overflow: hidden;
}

.sk-card{
  border: 1px solid #E6E9F0;
  border: 1px solid var(--t-border);
  box-shadow: 0 8px 24px rgba(15,34,58,.06);
  box-shadow: var(--t-shadow);
  background: #fff;
}

.sk-shimmer::after{
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent);
  animation: sk-loading 1.2s infinite;
}

@keyframes sk-loading{
  0%{transform: translateX(-100%);}
  100%{transform: translateX(100%);}
}

/* Header bars */
.sk-header{
  display: flex;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
}
.sk-bar{
  height: 14px;
  border-radius: 8px;
  background: #eef2f7;
}
.w-32{ width: 32%; }
.w-28{ width: 28%; }
.w-24{ width: 24%; }
.w-20{ width: 20%; }
.w-36{ width: 36%; }
.mt-2{ margin-top: 8px; }

/* Top layout */
.sk-top{
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 20px;
  grid-gap: 20px;
  grid-gap: var(--gap);
  gap: var(--gap);
  margin-bottom: 24px;
}
@media (max-width: 1024px){
  .sk-top{ grid-template-columns: 1fr; }
}

/* Gallery */
.sk-gallery{ padding: 12px; }
.sk-media{ border-radius: 12px; }
.sk-media.xl{
  height: 300px;
  margin-bottom: 12px;
  background: #e9edf3;
}
.sk-media.sm{
  height: 66px;
  background: #e9edf3;
}
.sk-thumbs{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 10px;
  gap: 10px;
}

/* Booking card */
.sk-booking{
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.sk-field{
  height: 42px;
  border-radius: 10px;
  background: #f3f6fb;
}
.sk-split{
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 10px;
  gap: 10px;
}
.sk-btn{
  height: 46px;
  border-radius: 12px;
  background: #e6eefc;
  box-shadow: inset 0 0 0 1px rgba(15,34,58,.08);
}

/* Sections */
.sk-section{
  margin-bottom: 26px;
}
.sk-title{
  width: 180px;
  height: 18px;
  border-radius: 10px;
  background: #eef2f7;
  margin-bottom: 12px;
}
.sk-lines .sk-line{
  height: 12px;
  border-radius: 8px;
  background: #f0f3f8;
  margin-bottom: 8px;
}
.sk-lines .sk-line.short{ width: 65%; }

/* Chips / caractéristiques */
.sk-grid.chips{
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  grid-gap: 10px;
  gap: 10px;
}
@media (max-width: 768px){
  .sk-grid.chips{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
.sk-chip{
  height: 34px;
  border-radius: 999px;
  background: #f3f5f9;
  border: 1px solid #E6E9F0;
  border: 1px solid var(--t-border);
}

/* Bullets (services, règles, etc.) */
.sk-grid.bullets{
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  grid-gap: 10px 20px;
  gap: 10px 20px;
}
@media (max-width: 768px){
  .sk-grid.bullets{ grid-template-columns: 1fr; }
}
.sk-bullet{
  display: grid;
  grid-template-columns: 14px 1fr;
  grid-gap: 10px;
  gap: 10px;
  align-items: center;
}
.sk-dot{
  width: 12px;
  height: 12px;
  background: #e8ecf4;
  border-radius: 50%;
}
.sk-bullet .sk-line{ height: 12px; }

/* Calendar */
.sk-calendar-head{
  display: flex;
  gap: 10px;
  margin-bottom: 12px;
}
.sk-pill{
  height: 28px;
  border-radius: 999px;
  background: #f1f4f9;
}
.sk-calendar{
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  grid-gap: 6px;
  gap: 6px;
}
.sk-cal-headcell{
  height: 18px;
  border-radius: 8px;
  background: #eef2f7;
}
.sk-cal-cell{
  height: 48px;
  border-radius: 10px;
  background: #f6f8fc;
  border: 1px dashed #e3e7ef;
}

/* Map */
.sk-map{
  height: 220px;
  background:
    radial-gradient(600px 300px at -20% -20%, rgba(15,68,126,0.06), transparent 60%),
    radial-gradient(500px 280px at 120% 120%, rgba(227,6,19,0.06), transparent 60%),
    #fff;
  border: 1px solid #E6E9F0;
  border: 1px solid var(--t-border);
  box-shadow: 0 8px 24px rgba(15,34,58,.06);
  box-shadow: var(--t-shadow);
}

/* Wrapper principal pour compenser le header fixe */
 
.page-content-wrapper {
 
  padding-top: 150px; /* Hauteur du header + top bar */
 
}
/* Responsive pour mobile */
 
@media (max-width: 768px) {
 
  .page-content-wrapper {
 
    padding-top: 120px; /* Hauteur réduite pour mobile */
 
  }
 
}
@media (max-width: 480px) {
 
  .page-content-wrapper {
 
    padding-top: 110px;
 
  }
 
}
@media (max-width: 375px) {
 
  .page-content-wrapper {
 
    padding-top: 100px;
 
  }
 
}
.apartment-detail-wrapper {
 
  display: flex;
 
  max-width: 1200px;
 
  margin: 0 auto;
 
  padding: 20px;
 
  gap: 30px;
 
}
.apartment-detail-content {
 
  flex: 1 1;
 
  width: 65%;
 
}
.apartment-detail-sidebar {
 
  width: 35%;
 
  max-width: 350px;
 
  position: relative;
 
}
.apartment-detail-sidebar > div {
 
  position: -webkit-sticky;
 
  position: sticky;
 
  top: 170px; /* Ajusté pour tenir compte du header fixe */
 
}
@media (max-width: 1024px) {
 
  .apartment-detail-wrapper {
 
    flex-direction: column;
 
  }
  .apartment-detail-content,
 
  .apartment-detail-sidebar {
 
    width: 100%;
 
    max-width: 100%;
 
  }
  .apartment-detail-sidebar > div {
 
    position: static;
 
    margin-bottom: 30px;
 
  }
 
}
/* Effet de flou lorsque le modal est actif */
 
.modal-blur-overlay {
 
  filter: blur(3px);
 
  pointer-events: none;
 
  -webkit-user-select: none;
 
          user-select: none;
 
  transition: filter 0.3s ease;
 
}
/* Chargement & erreurs */
 
.apartment-loading, .apartment-error{
 
  text-align: center;
 
  font-size: 18px;
 
  color: #333;
 
  padding: 40px;
 
  margin-top: 150px; /* Compenser le header fixe */
 
}
/* ============================================
   DASHBOARD CLIENT - CSS PROPRE & RESPONSIVE
   ============================================ */

:root {
  --sidebar-width: 260px;
  --content-padding: 20px;
  --header-spacing: 20px;
  --footer-bg: #ffffff;
  --text-color: #656565;
  --font-family: 'Poppins', sans-serif;
}

/* -------------------- WRAPPER PRINCIPAL -------------------- */
.dashboard-wrapper {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  background: #ffffff;
  padding-top: 20px;
  padding-top: var(--header-spacing);
}

/* -------------------- CONTENU PRINCIPAL -------------------- */
.dashboard-content {
  flex: 1 1;
  width: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Centrer tous les enfants directs du dashboard-content */
.dashboard-content > * {
  width: 100%;
  max-width: 1920px;
}

.main-content {
  margin-left: 260px;
  margin-left: var(--sidebar-width);
  padding: 20px;
  padding: var(--content-padding);
  flex: 1 1;
  box-sizing: border-box;
  transition: margin-left 0.3s ease;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Centrer tous les composants enfants */
.main-content > * {
  width: 100%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

/* -------------------- GRILLE DE LISTES -------------------- */
.lists-container {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 20px;
  gap: 20px;
  margin: 20px auto 80px;
  width: 100%;
  max-width: 1200px;
  padding: 0 20px;
  padding: 0 var(--content-padding);
  box-sizing: border-box;
}

/* -------------------- SECTIONS PLEINE LARGEUR -------------------- */
/* Partenaires et Footer doivent prendre toute la largeur */
.dashboard-wrapper .partenaires-section,
.dashboard-wrapper > footer,
.dashboard-wrapper > *[class*="footer"],
.dashboard-wrapper > *[class*="partenaires"] {
  margin-left: 0;
  margin-right: 0;
  width: 100%;
  max-width: 100%;
  align-self: stretch;
}

/* Les sections pleine largeur dans dashboard-content */
.dashboard-content .partenaires-section,
.dashboard-content > footer,
.dashboard-content > *[class*="footer"],
.dashboard-content > *[class*="partenaires"] {
  max-width: 100%;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
}

/* -------------------- FOOTER -------------------- */
.dashboard-footer {
  width: 100%;
  padding: 20px;
  background: #ffffff;
  background: var(--footer-bg);
  text-align: center;
  font-family: 'Poppins', sans-serif;
  font-family: var(--font-family);
  color: #656565;
  color: var(--text-color);
  font-size: 14px;
  box-sizing: border-box;
  margin-left: 0;
}

/* -------------------- RÉINITIALISATION MARGES -------------------- */
/* Éviter les espacements excessifs en début de contenu */
.dashboard-content > *:first-child,
.dashboard-wrapper > *:nth-child(2) {
  margin-top: 0;
}

/* ============================================
   RESPONSIVE - GRAND ÉCRAN (≥ 1200px)
   ============================================ */
@media (min-width: 1200px) {
  :root {
    --sidebar-width: 280px;
    --content-padding: 25px;
    --header-spacing: 30px;
  }

  .dashboard-footer {
    font-size: 16px;
  }

  .main-content > * {
    max-width: 1400px;
  }

  .lists-container {
    max-width: 1400px;
  }
}

/* ============================================
   RESPONSIVE - TABLETTE (≤ 1024px)
   ============================================ */
@media (max-width: 1024px) {
  :root {
    --sidebar-width: 240px;
    --content-padding: 18px;
    --header-spacing: 25px;
  }

  .dashboard-footer {
    font-size: 13px;
  }

  .main-content > * {
    max-width: 1100px;
  }

  .lists-container {
    max-width: 1100px;
  }
}

/* ============================================
   RESPONSIVE - TABLETTE MOBILE (≤ 768px)
   ============================================ */
@media (max-width: 768px) {
  :root {
    --content-padding: 15px;
    --header-spacing: 20px;
  }

  /* Sidebar cachée, contenu pleine largeur */
  .main-content {
    margin-left: 0;
    padding: 20px;
    padding: var(--content-padding);
  }

  .main-content > * {
    max-width: 100%;
  }

  /* Grille en une seule colonne */
  .lists-container {
    grid-template-columns: 1fr;
    padding: 0 20px;
    padding: 0 var(--content-padding);
    margin-bottom: 60px;
    max-width: 100%;
  }

  .dashboard-footer {
    font-size: 12px;
  }

  /* Sections pleine largeur sur mobile */
  .dashboard-content .partenaires-section,
  .dashboard-content > footer,
  .dashboard-content > *[class*="footer"],
  .dashboard-content > *[class*="partenaires"] {
    margin-left: 0;
    margin-right: 0;
    width: 100%;
  }
}

/* ============================================
   RESPONSIVE - MOBILE (≤ 480px)
   ============================================ */
@media (max-width: 480px) {
  :root {
    --content-padding: 10px;
    --header-spacing: 10px;
  }

  .dashboard-wrapper {
    padding-top: 10px;
  }

  .main-content {
    margin-left: 0;
    padding: 10px;
  }

  .main-content > * {
    max-width: 100%;
  }

  .lists-container {
    padding: 0 10px;
    margin-bottom: 40px;
    gap: 15px;
    max-width: 100%;
  }

  .dashboard-footer {
    padding: 10px;
    font-size: 10px;
  }
}

/* ============================================
   SIDEBAR (À AJOUTER DANS VOTRE COMPOSANT)
   ============================================ */
/*
Note: Si vous avez un composant Sidebar séparé,
ajoutez ces styles dans son fichier CSS :

.sidebar {
  position: fixed;
  top: 0;
  left: 0;
  width: var(--sidebar-width);
  height: 100vh;
  background: #votre-couleur;
  overflow-y: auto;
  z-index: 1000;
  transition: transform 0.3s ease;
}

@media (max-width: 768px) {
  .sidebar {
    transform: translateX(-100%);
  }

  .sidebar.open {
    transform: translateX(0);
  }
}
*/

/* ============================================
   UTILITAIRES
   ============================================ */

/* Transition fluide pour le contenu lors du toggle de la sidebar */
* {
  transition-property: margin, padding, width;
  transition-duration: 0.3s;
  transition-timing-function: ease;
}

/* Désactiver les transitions sur les éléments de texte */
p, h1, h2, h3, h4, h5, h6, span, a {
  transition: none;
}

/* Box-sizing global pour éviter les problèmes de calcul */
*,
*::before,
*::after {
  box-sizing: border-box;
}
:root {
  --primary-white: #ffffff;
  --secondary-blue: #0C447E;
  --accent-red: #E30613;
  --gradient-bg: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  --gradient-accent: linear-gradient(135deg, #E30613 0%, #ff2a3a 100%);
  --glass-bg: rgba(255, 255, 255, 0.9);
  --glass-border: rgba(255, 255, 255, 0.8);
  --shadow-primary: 0 8px 25px rgba(0, 0, 0, 0.08);
  --shadow-hover: 0 12px 30px rgba(0, 0, 0, 0.12);
  --text-primary: #2d3748;
  --text-secondary: #4a5568;
  --text-white: #ffffff;
  --border-radius: 20px;
  --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Wrapper pour centrer et avoir la même largeur que ProfileCard */
.welcome-card-wrapper {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  padding: 0; /* Suppression du padding latéral */
  box-sizing: border-box;
}

.welcome-card-containerW {
  width: 100%;
  max-width: 1920px; /* Suppression de la largeur maximale */
  background: #ffffff;
  background: var(--primary-white);
  border-radius: 20px;
  border-radius: var(--border-radius);
  padding: 1.25rem;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
  box-shadow: var(--shadow-primary);
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(12, 68, 126, 0.1);
  margin: 0; /* Suppression de margin: 0 auto car géré par le wrapper */
}

.welcome-card-headerW {
  margin-bottom: 1.25rem;
  position: relative;
}

.welcome-card-headerW h2 {
  font-size: 1.5rem;
  font-weight: 700;
  margin: 0;
  line-height: 1.2;
  letter-spacing: -0.02em;
  position: relative;
}

.welcome-text {
  background: linear-gradient(135deg, #0C447E 0%, #E30613 100%);
  background: linear-gradient(135deg, var(--secondary-blue) 0%, var(--accent-red) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  display: inline;
}

.wave-emoji {
  background: none !important;
  -webkit-text-fill-color: initial !important;
  color: inherit !important;
  display: inline;
}

.mobile-message {
  display: none;
  font-size: 0.9rem;
  color: #4a5568;
  color: var(--text-secondary);
  margin: 0.5rem 0 0 0;
  font-weight: normal;
}

.welcome-card-contentW {
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.info-itemW {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.875rem 0.75rem;
  background: #ffffff;
  background: var(--primary-white);
  border-radius: 12px;
  border: 1px solid rgba(12, 68, 126, 0.1);
  position: relative;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  text-align: center;
  flex: 1 1;
  min-width: 0;
}

.info-iconW {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

.envelope-iconW {
  color: #0C447E;
  color: var(--secondary-blue);
}

.check-iconW {
  color: #0C447E;
}

.calendar-iconW {
  color: #0C447E;
  color: var(--secondary-blue);
}

.info-itemW span {
  font-size: 0.8rem;
  color: #2d3748;
  color: var(--text-primary);
  font-weight: 500;
  line-height: 1.4;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}



/* Tablettes larges (≤1024px) */
@media (max-width: 1024px) {
  .welcome-card-wrapper {
    padding: 0; /* Suppression du padding latéral */
  }

  .welcome-card-containerW {
    padding: 1.5rem;
  }
}

/* Tablettes (≤768px) */
@media (max-width: 768px) {
  .welcome-card-wrapper {
    padding: 0; /* Suppression du padding latéral */
  }

  .welcome-card-containerW {
    padding: 1.5rem;
  }

  .welcome-card-headerW h2 {
    font-size: 1.75rem;
  }

  .info-itemW {
    padding: 0.75rem 0.5rem;
    gap: 0.5rem;
  }

  .info-itemW span {
    font-size: 0.75rem;
  }

  .info-iconW {
    width: 14px;
    height: 14px;
  }

  .mobile-hide {
    display: none !important;
  }

  .mobile-message {
    display: block;
  }
}

/* Mobiles larges (≤640px) */
@media (max-width: 640px) {
  .welcome-card-wrapper {
    padding: 0; /* Suppression du padding latéral */
  }

  .welcome-card-containerW {
    padding: 1rem;
  }
}

/* Petits mobiles (≤480px) */
@media (max-width: 480px) {
  .welcome-card-wrapper {
    padding: 0; /* Suppression du padding latéral */
  }

  .welcome-card-containerW {
    padding: 1.25rem;
  }

  .welcome-card-headerW h2 {
    font-size: 1.5rem;
  }

  .info-itemW {
    padding: 0.625rem 0.375rem;
  }

  .info-itemW span {
    font-size: 0.7rem;
  }

  .info-iconW {
    width: 12px;
    height: 12px;
  }
}

/* Très petits écrans (≤320px) */
@media (max-width: 320px) {
  .welcome-card-wrapper {
    padding: 0; /* Suppression du padding latéral */
  }

  .welcome-card-containerW {
    padding: 0.75rem;
  }
}

/* En cours = vert */
.status-activeW {
  color: #16a34a;      /* vert */
  font-weight: 600;
}

/* Terminé = rouge */
.status-inactiveW {
  color: #dc2626;      /* rouge */
  font-weight: 600;
}

/* Aucun abonnement = gris */
.status-noneW {
  color: #6b7280;      /* gris neutre */
  font-weight: 600;
}

/* Pendant chargement (squelette ou texte) */
.status-loadingW {
  color: #9ca3af;      /* gris clair */
  font-style: italic;
}
.navigation-menu-container {
    width: 100%;
    max-width: 1920px; /* Largeur maximale pour grands écrans */
    margin: 20px auto; /* Centré avec des marges en haut et en bas */
    background: #ffffff; /* Fond blanc */
    border: 1px solid #0c447e; /* Bordure fine bleue */
    border-radius: 8px; /* Coins arrondis */
    padding: 10px 10px; /* Padding réduit horizontalement */
  }
  
  .navigation-menu-list {
    display: flex;
    justify-content: space-around; /* Espacement uniforme entre les liens */
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
  }
  
  .nav-link {
    display: flex;
    align-items: center;
    gap: 12px; /* Espacement augmenté entre l'icône et le texte */
    text-decoration: none;
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    font-weight: 500;
    color: #0c447e; /* Texte bleu foncé par défaut */
  }
  
  .nav-icon {
    font-size: 20px;
    color: #0c447e; /* Icône bleue foncée par défaut */
  }
  
  /* Style pour le lien actif */
  .nav-link.active {
    color: #ef4444; /* Texte rouge pour le lien actif */
  }
  
  .nav-link.active .nav-icon {
    color: #ef4444; /* Icône rouge pour le lien actif */
  }
  
  /* Responsive */
  
  /* Grands écrans (≥1200px) */
  @media (min-width: 1200px) {
    .navigation-menu-container {
      padding: 12px 12px; /* Ajusté proportionnellement */
    }
  
    .nav-link {
      font-size: 18px;
      gap: 14px; /* Ajusté proportionnellement */
    }
  
    .nav-icon {
      font-size: 22px;
    }
  }
  
  /* Tablettes (≤1024px) */
  @media (max-width: 1024px) {
    .navigation-menu-container {
      margin: 10px auto; /* Centré, pas de sidebar */
      padding: 10px 8px; /* Ajusté proportionnellement */
      position: fixed; /* Fixé en bas */
      bottom: 0;
      left: 0;
      width: 100%;
      max-width: none; /* Supprime la contrainte de largeur */
      background: #ffffff; /* Fond blanc opaque */
      border: none; /* Supprime la bordure */
      border-top: 1px solid #e0e0e0; /* Bordure supérieure */
      border-radius: 0; /* Pas de coins arrondis */
      box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1); /* Ombre vers le haut */
      z-index: 1000; /* S’assurer que le menu est au-dessus du contenu */
    }
  
    .nav-link {
      font-size: 15px;
      gap: 10px; /* Ajusté proportionnellement */
    }
  
    .nav-icon {
      font-size: 18px;
    }
  }
  
  /* Petites tablettes (≤768px) */
  @media (max-width: 768px) {
    .navigation-menu-container {
      margin: 5px auto; /* Centré, pas de sidebar */
      padding: 8px 6px; /* Ajusté proportionnellement */
    }
  
    .navigation-menu-list {
      flex-direction: row; /* On garde la disposition horizontale */
      gap: 10px; /* Espacement réduit */
    }
  
    .nav-link {
      font-size: 14px;
      gap: 8px; /* Ajusté proportionnellement */
    }
  
    .nav-icon {
      font-size: 16px;
    }
  }
  
  /* Mobiles (≤480px) */
  @media (max-width: 480px) {
    .navigation-menu-container {
      position: fixed; /* Fixe la barre en bas de l’écran */
      bottom: 0;
      left: 0;
      margin: 0; /* Supprime les marges */
      padding: 8px 10px; /* Padding ajusté */
      width: 100%; /* Prend toute la largeur */
      max-width: none; /* Supprime la contrainte de largeur */
      background: #ffffff; /* Fond blanc opaque */
      border: none; /* Supprime la bordure pour un look plus moderne */
      border-top: 1px solid #e0e0e0; /* Bordure supérieure pour séparation */
      border-radius: 0; /* Supprime les coins arrondis */
      box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1); /* Ombre vers le haut */
      z-index: 1000; /* S’assurer que le menu est au-dessus du contenu */
    }
  
    .navigation-menu-list {
      flex-direction: row; /* Disposition horizontale comme dans l’image */
      justify-content: space-around;
      gap: 0;
    }
  
    .nav-link {
      flex-direction: column; /* Icône au-dessus du texte */
      align-items: center;
      gap: 4px; /* Espacement réduit entre icône et texte */
      font-size: 12px;
      font-weight: 500;
      padding: 6px 8px; /* Padding pour une zone cliquable plus large */
    }
  
    .nav-icon {
      font-size: 20px; /* Icônes plus grandes pour mobile */
    }
  }
  
  /* Très petits écrans (≤360px) */
  @media (max-width: 360px) {
    .navigation-menu-container {
      padding: 6px 8px;
    }
  
    .nav-link {
      font-size: 11px;
      gap: 3px;
      padding: 4px 6px;
    }
  
    .nav-icon {
      font-size: 18px;
    }
  }

.user-welcome {
  padding: 1rem;
  text-align: center;
  border-bottom: 1px solid #eee;
  margin-bottom: 1rem;
}

.user-welcome p {
  margin: 0;
  color: #333;
  font-weight: 500;
}

.logout-button {
  background: none;
  border: none;
  width: 100%;
  text-align: left;
  cursor: pointer;
  padding: 0.5rem 1rem;
  display: flex;
  align-items: center;
  color: #dc3545;
}

.logout-button:hover {
  background-color: #fff5f5;
}

.logout-button .nav-icon {
  margin-right: 0.5rem;
}
.stats-card-container {
    width: 100%;
    max-width: 1920px; /* Largeur maximale pour grands écrans */
    margin: 20px auto; /* Centré avec des marges en haut et en bas */
    border: none; /* Aucune bordure */
  }
  
  .stats-card-header {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
  }
  
  .stats-icon {
    color: #0c447e;
    font-size: 24px;
    margin-right: 10px;
  }
  
  .stats-card-header h2 {
    font-family: 'Poppins', sans-serif;
    font-size: 24px;
    font-weight: 600;
    color: #0c447e; /* Rouge pour le titre */
    margin: 0;
  }
  
  .stats-cards {
    display: flex;
    gap: 20px;
  }
  
  .stats-item {
    flex: 1 1;
    display: flex;
    align-items: center;
    background: #ffffff;
    border: 1px solid #e0e0e0; /* Bordure fine */
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Ombre augmentée */
    padding: 15px;
    font-family: 'Poppins', sans-serif;
    color: #656565;
    box-sizing: border-box; /* Inclut padding et bordure dans la largeur */
    width: 100%; /* Prend toute la largeur disponible */
  }
  
  .icon-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border-radius: 10%; /* Comme dans ActionsCard */
    margin-right: 15px;
    flex-shrink: 0; /* Empêche l'icône de rétrécir */
    padding: 8px; /* Comme dans ActionsCard */
    background-color: #e6f0fa; /* Uniforme, comme Nouvelle Réservation dans ActionsCard */
  }
  
  .stats-item-icon {
    font-size: 24px; /* Aligné sur ActionsCard (24px par défaut) */
    color: #0c447e; /* Comme dans ActionsCard */
  }
  
  .stats-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex: 1 1; /* Prend tout l'espace restant */
    overflow-wrap: break-word; /* Permet au texte de passer à la ligne */
  }
  
  .stats-number {
    font-size: 16px; /* Aligné sur action-titleA */
    font-weight: 500; /* Aligné sur action-titleA */
    color: #0c447e; /* Aligné sur action-titleA */
  }
  
  .stats-label {
    font-size: 12px; /* Aligné sur action-subtitleA */
    color: #656565; /* Aligné sur action-subtitleA */
  }
  
  /* Responsive */
  
  /* Grands écrans (≥1200px) */
  @media (min-width: 1200px) {
    .stats-card-container {
      margin: 20px auto;
    }
  
    .stats-card-header h2 {
      font-size: 26px;
    }
  
    .stats-icon {
      font-size: 26px;
    }
  
    .stats-cards {
      gap: 25px;
    }
  
    .stats-item {
      padding: 20px;
    }
  
    .icon-wrapper {
      width: 60px; /* Aligné sur ActionsCard */
      height: 60px;
      padding: 10px; /* Aligné sur ActionsCard */
    }
  
    .stats-item-icon {
      font-size: 28px; /* Aligné sur ActionsCard */
    }
  
    .stats-number {
      font-size: 18px; /* Aligné sur action-titleA */
    }
  
    .stats-label {
      font-size: 14px; /* Aligné sur action-subtitleA */
    }
  }
  
  /* Tablettes (≤1024px) */
  @media (max-width: 1024px) {
    .stats-card-container {
      margin: 10px 30px; /* Marges latérales augmentées de 20px à 30px */
      width: calc(100% - 60px); /* Largeur ajustée pour inclure les marges */
    }
  
    .stats-card-header h2 {
      font-size: 22px;
    }
  
    .stats-icon {
      font-size: 22px;
    }
  
    .stats-cards {
      gap: 15px;
    }
  
    .stats-item {
      padding: 12px;
    }
  
    .icon-wrapper {
      width: 50px; /* Aligné sur ActionsCard */
      height: 50px;
      padding: 8px; /* Aligné sur ActionsCard */
    }
  
    .stats-item-icon {
      font-size: 24px; /* Aligné sur ActionsCard */
    }
  
    .stats-number {
      font-size: 16px; /* Aligné sur action-titleA */
    }
  
    .stats-label {
      font-size: 13px; /* Aligné sur action-subtitleA */
    }
  }
  
  /* Petites tablettes (≤768px) */
  @media (max-width: 768px) {
    .stats-card-container {
      margin: 5px 25px; /* Marges latérales augmentées de 15px à 25px */
      width: calc(100% - 50px); /* Largeur ajustée pour inclure les marges */
    }
  
    .stats-card-header h2 {
      font-size: 20px;
    }
  
    .stats-icon {
      font-size: 20px;
    }
  
    .stats-cards {
      flex-direction: column;
      gap: 12px;
    }
  
    .stats-item {
      padding: 12px;
    }
  
    .icon-wrapper {
      width: 50px; /* Aligné sur ActionsCard */
      height: 50px;
      padding: 8px; /* Aligné sur ActionsCard */
    }
  
    .stats-item-icon {
      font-size: 24px; /* Aligné sur ActionsCard */
    }
  
    .stats-number {
      font-size: 16px; /* Aligné sur action-titleA */
    }
  
    .stats-label {
      font-size: 12px; /* Aligné sur action-subtitleA */
    }
  }
  
  /* Mobiles (≤480px) */
  @media (max-width: 480px) {
    .stats-card-container {
      margin: 10px 25px; /* Marges latérales augmentées pour un look aéré */
      width: calc(100% - 50px); /* Largeur ajustée pour inclure les marges */
    }
  
    .stats-card-header {
      margin-bottom: 15px;
    }
  
    .stats-card-header h2 {
      font-size: 18px;
    }
  
    .stats-icon {
      font-size: 18px;
    }
  
    .stats-cards {
      gap: 12px;
    }
  
    .stats-item {
      padding: 10px;
    }
  
    .icon-wrapper {
      width: 60px; /* Aligné sur ActionsCard */
      height: 60px;
      padding: 8px; /* Aligné sur ActionsCard */
      margin-right: 12px; /* Ajusté pour libérer de l'espace */
    }
  
    .stats-item-icon {
      font-size: 30px; /* Aligné sur ActionsCard */
    }
  
    .stats-number {
      font-size: 16px; /* Aligné sur action-titleA */
      margin-bottom: 4px; /* Ajouté pour cohérence avec ActionsCard */
    }
  
    .stats-label {
      font-size: 12px; /* Aligné sur action-subtitleA */
    }
  }
  
  /* Très petits écrans (≤360px) */
  @media (max-width: 360px) {
    .stats-card-container {
      margin: 5px 20px; /* Marges latérales augmentées */
      width: calc(100% - 40px); /* Largeur ajustée pour inclure les marges */
    }
  
    .stats-card-header h2 {
      font-size: 16px;
    }
  
    .stats-icon {
      font-size: 16px;
    }
  
    .stats-cards {
      gap: 10px;
    }
  
    .stats-item {
      padding: 8px;
    }
  
    .icon-wrapper {
      width: 55px; /* Aligné sur ActionsCard */
      height: 55px;
      padding: 6px; /* Aligné sur ActionsCard */
      margin-right: 10px; /* Ajusté pour libérer de l'espace */
    }
  
    .stats-item-icon {
      font-size: 28px; /* Aligné sur ActionsCard */
    }
  
    .stats-number {
      font-size: 14px; /* Aligné sur action-titleA */
    }
  
    .stats-label {
      font-size: 11px; /* Aligné sur action-subtitleA */
    }
  }
.CLientAbonementClientVue .subscription-card-container {
  width: 100%;
  max-width: 1920px;
  margin: 20px auto; /* Centrage horizontal avec auto */
  background: #ffffff;
  border: 1px solid #0c447e;
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  padding: 20px;
  box-sizing: border-box;
  font-family: 'Poppins', sans-serif;
}

.CLientAbonementClientVue .subscription-card-header {
  display: flex;
  align-items: center;
  justify-content: flex-start; /* Alignement proper */
  margin-bottom: 15px;
  border-bottom: 1px solid #0c447e;
  padding-bottom: 10px;
}

.CLientAbonementClientVue .subscription-icon {
  color: #0c447e;
  font-size: 20px;
  margin-right: 10px;
  flex-shrink: 0;
  display: flex;
  align-items: center; /* Centrage vertical de l'icône */
}

.CLientAbonementClientVue .subscription-card-header h2 {
  font-family: 'Poppins', sans-serif;
  font-size: 20px;
  font-weight: 600;
  color: #0c447e;
  margin: 0;
  line-height: 1.2; /* Améliore l'espacement des lignes */
}

.CLientAbonementClientVue .subscription-card-content {
  padding: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #0c447e #f0f0f0;
}

.CLientAbonementClientVue .subscription-card-content::-webkit-scrollbar {
  height: 6px;
}

.CLientAbonementClientVue .subscription-card-content::-webkit-scrollbar-track {
  background: #f0f0f0;
  border-radius: 3px;
}

.CLientAbonementClientVue .subscription-card-content::-webkit-scrollbar-thumb {
  background: #0c447e;
  border-radius: 3px;
}

.CLientAbonementClientVue .subscription-item {
  padding: 16px;
  margin: 0 0 15px 0;
  border-radius: 8px;
  background-color: #f9f9f9;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
  width: 100%; /* Assure la largeur complète */
  box-sizing: border-box;
}

.CLientAbonementClientVue .subscription-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  gap: 10px; /* Espacement entre éléments */
}

.CLientAbonementClientVue .subscription-title {
  font-size: 16px;
  font-weight: 600;
  color: #0c447e;
  margin: 0;
  flex: 1 1; /* Prend l'espace disponible */
  line-height: 1.3;
}

.CLientAbonementClientVue .subscription-status {
  padding: 4px 12px;
  border-radius: 50px;
  font-size: 12px;
  font-weight: 500;
  flex-shrink: 0; /* Empêche la réduction */
  white-space: nowrap; /* Empêche le retour à la ligne */
}

.CLientAbonementClientVue .subscription-status-encours {
  background-color: #e6f4ea;
  color: #137333;
}

.CLientAbonementClientVue .subscription-status-termine {
  background-color: #e8eaed;
  color: #3c4043;
}

.CLientAbonementClientVue .subscription-details {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 12px;
  gap: 12px; /* Espacement uniforme */
  align-items: start;
}

.CLientAbonementClientVue .subscription-detail {
  display: flex;
  flex-direction: column;
  min-width: 0; /* Permet la réduction si nécessaire */
}

.CLientAbonementClientVue .subscription-label {
  font-size: 12px;
  color: #5a6474;
  margin-bottom: 6px;
  line-height: 1.2;
}

.CLientAbonementClientVue .subscription-value {
  font-size: 14px;
  color: #333;
  font-weight: 500;
  line-height: 1.3;
  word-wrap: break-word; /* Permet la coupure des mots longs */
}

.CLientAbonementClientVue .subscription-price {
  color: #0c447e;
}

.CLientAbonementClientVue .subscription-empty {
  padding: 40px 20px;
  text-align: center;
  color: #5a6474;
}

.CLientAbonementClientVue .subscription-loading {
  padding: 40px 20px;
  text-align: center;
  color: #5a6474;
}

.CLientAbonementClientVue .subscription-error {
  padding: 20px;
  color: #ef4444;
  text-align: center;
}

.CLientAbonementClientVue .subscription-divider {
  border: 0;
  border-top: 1px solid #eaeaea;
  margin: 10px 0;
  width: 100%;
}

.CLientAbonementClientVue .subscription-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin-top: 20px;
  flex-wrap: wrap; /* Permet le retour à la ligne si nécessaire */
}

.CLientAbonementClientVue .subscription-pagination-btn {
  padding: 8px 16px;
  background-color: #0c447e;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 14px;
  transition: opacity 0.3s ease; /* Animation douce */
}

.CLientAbonementClientVue .subscription-pagination-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.CLientAbonementClientVue .subscription-page-info {
  font-size: 14px;
  color: #5a6474;
  text-align: center;
}

/* Responsive Design Optimisé */

/* Grands écrans (≥1200px) */
@media (min-width: 1200px) {
  .CLientAbonementClientVue .subscription-card-container {
    padding: 25px;
    margin: 20px auto;
  }

  .CLientAbonementClientVue .subscription-icon {
    font-size: 24px;
  }

  .CLientAbonementClientVue .subscription-card-header h2 {
    font-size: 20px;
  }

  .CLientAbonementClientVue .subscription-title {
    font-size: 18px;
  }

  .CLientAbonementClientVue .subscription-label {
    font-size: 14px;
  }

  .CLientAbonementClientVue .subscription-value {
    font-size: 16px;
  }

  .CLientAbonementClientVue .subscription-details {
    gap: 16px;
  }
}

/* Écrans moyens (992px - 1199px) */
@media (min-width: 992px) and (max-width: 1199px) {
  .CLientAbonementClientVue .subscription-card-container {
    margin: 15px auto;
    padding: 20px;
  }

  .CLientAbonementClientVue .subscription-details {
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
  }
}

/* Tablettes (768px - 991px) */
@media (min-width: 768px) and (max-width: 991px) {
  .CLientAbonementClientVue .subscription-card-container {
    margin: 10px auto;
    padding: 18px;
    max-width: 100%;
  }

  .CLientAbonementClientVue .subscription-icon {
    font-size: 20px;
  }

  .CLientAbonementClientVue .subscription-card-header h2 {
    font-size: 18px;
  }

  .CLientAbonementClientVue .subscription-item {
    padding: 14px;
    margin-bottom: 12px;
  }

  .CLientAbonementClientVue .subscription-title {
    font-size: 15px;
  }

  .CLientAbonementClientVue .subscription-details {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }

  .CLientAbonementClientVue .subscription-label {
    font-size: 12px;
  }

  .CLientAbonementClientVue .subscription-value {
    font-size: 14px;
  }
}

/* Petites tablettes et grands mobiles (576px - 767px) */
@media (min-width: 576px) and (max-width: 767px) {
  .CLientAbonementClientVue .subscription-card-container {
    margin: 8px auto;
    padding: 16px;
  }

  .CLientAbonementClientVue .subscription-icon {
    font-size: 18px;
  }

  .CLientAbonementClientVue .subscription-card-header h2 {
    font-size: 16px;
  }

  .CLientAbonementClientVue .subscription-item {
    padding: 12px;
    margin-bottom: 10px;
  }

  .CLientAbonementClientVue .subscription-header {
    gap: 8px;
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .CLientAbonementClientVue .subscription-title {
    font-size: 14px;
    flex-basis: 100%;
    margin-bottom: 5px;
  }

  .CLientAbonementClientVue .subscription-status {
    align-self: flex-start;
  }

  .CLientAbonementClientVue .subscription-details {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .CLientAbonementClientVue .subscription-detail {
    flex-direction: row;
    align-items: center;
    gap: 10px;
  }

  .CLientAbonementClientVue .subscription-label {
    font-size: 12px;
    margin-bottom: 0;
    min-width: 100px;
    flex-shrink: 0;
  }

  .CLientAbonementClientVue .subscription-value {
    font-size: 13px;
    flex: 1 1;
  }
}

/* Mobiles (481px - 575px) */
@media (min-width: 481px) and (max-width: 575px) {
  .CLientAbonementClientVue .subscription-card-container {
    margin: 5px auto;
    padding: 14px;
  }

  .CLientAbonementClientVue .subscription-icon {
    font-size: 16px;
    margin-right: 8px;
  }

  .CLientAbonementClientVue .subscription-card-header h2 {
    font-size: 15px;
  }

  .CLientAbonementClientVue .subscription-header {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    margin-bottom: 12px;
  }

  .CLientAbonementClientVue .subscription-title {
    font-size: 14px;
    order: 1;
  }

  .CLientAbonementClientVue .subscription-status {
    order: 2;
    align-self: flex-start;
    font-size: 11px;
    padding: 3px 8px;
  }

  .CLientAbonementClientVue .subscription-details {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .CLientAbonementClientVue .subscription-detail {
    flex-direction: row;
    align-items: center;
    gap: 8px;
    padding: 4px 0;
  }

  .CLientAbonementClientVue .subscription-label {
    font-size: 12px;
    margin-bottom: 0;
    min-width: 90px;
    flex-shrink: 0;
  }

  .CLientAbonementClientVue .subscription-value {
    font-size: 12px;
    flex: 1 1;
  }

  .CLientAbonementClientVue .subscription-item {
    padding: 10px;
    margin-bottom: 8px;
  }
}

/* Petits mobiles (≤480px) */
@media (max-width: 480px) {
  .CLientAbonementClientVue .subscription-card-container {
    margin: 5px;
    padding: 12px;
    border-radius: 6px;
  }

  .CLientAbonementClientVue .subscription-icon {
    font-size: 14px;
    margin-right: 6px;
  }

  .CLientAbonementClientVue .subscription-card-header {
    margin-bottom: 12px;
    padding-bottom: 8px;
  }

  .CLientAbonementClientVue .subscription-card-header h2 {
    font-size: 14px;
  }

  .CLientAbonementClientVue .subscription-header {
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
    margin-bottom: 10px;
  }

  .CLientAbonementClientVue .subscription-title {
    font-size: 13px;
    order: 1;
    line-height: 1.4;
  }

  .CLientAbonementClientVue .subscription-status {
    order: 2;
    align-self: flex-start;
    padding: 2px 6px;
    font-size: 10px;
  }

  .CLientAbonementClientVue .subscription-details {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .CLientAbonementClientVue .subscription-detail {
    flex-direction: row;
    align-items: center;
    gap: 6px;
    padding: 3px 0;
    border-bottom: 1px solid #f0f0f0;
  }

  .CLientAbonementClientVue .subscription-detail:last-child {
    border-bottom: none;
  }

  .CLientAbonementClientVue .subscription-label {
    font-size: 11px;
    margin-bottom: 0;
    min-width: 80px;
    flex-shrink: 0;
    font-weight: 500;
  }

  .CLientAbonementClientVue .subscription-value {
    font-size: 11px;
    flex: 1 1;
    text-align: right;
  }

  .CLientAbonementClientVue .subscription-item {
    padding: 8px;
    margin-bottom: 6px;
  }

  .CLientAbonementClientVue .subscription-empty,
  .CLientAbonementClientVue .subscription-loading,
  .CLientAbonementClientVue .subscription-error {
    padding: 20px 10px;
    font-size: 13px;
  }

  .CLientAbonementClientVue .subscription-pagination {
    gap: 6px;
    margin-top: 15px;
  }

  .CLientAbonementClientVue .subscription-pagination-btn {
    padding: 6px 12px;
    font-size: 12px;
  }

  .CLientAbonementClientVue .subscription-page-info {
    font-size: 12px;
  }
}

/* Très petits écrans (≤360px) */
@media (max-width: 360px) {
  .CLientAbonementClientVue .subscription-card-container {
    margin: 2px;
    padding: 10px;
  }

  .CLientAbonementClientVue .subscription-icon {
    font-size: 12px;
    margin-right: 4px;
  }

  .CLientAbonementClientVue .subscription-card-header h2 {
    font-size: 13px;
  }

  .CLientAbonementClientVue .subscription-header {
    gap: 4px;
  }

  .CLientAbonementClientVue .subscription-title {
    font-size: 12px;
  }

  .CLientAbonementClientVue .subscription-status {
    padding: 2px 4px;
    font-size: 9px;
  }

  .CLientAbonementClientVue .subscription-details {
    gap: 4px;
  }

  .CLientAbonementClientVue .subscription-detail {
    gap: 4px;
    padding: 2px 0;
  }

  .CLientAbonementClientVue .subscription-label {
    font-size: 10px;
    min-width: 70px;
  }

  .CLientAbonementClientVue .subscription-value {
    font-size: 10px;
  }

  .CLientAbonementClientVue .subscription-item {
    padding: 6px;
    margin-bottom: 4px;
  }

  .CLientAbonementClientVue .subscription-pagination-btn {
    padding: 4px 8px;
    font-size: 11px;
  }

  .CLientAbonementClientVue .subscription-page-info {
    font-size: 11px;
  }
}

/* Correction de centrage sur mobile */
@media (max-width: 767px) {
  .CLientAbonementClientVue .subscription-card-container {

    flex-direction: column;
    align-items: center; /* Centre horizontalement tous les éléments enfants */
    justify-content: center;
    margin: 10px auto;
    width: 95%; /* Empêche de coller aux bords */
  }

  .CLientAbonementClientVue .subscription-card-content {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center; /* Centre les items */
  }

  .CLientAbonementClientVue .subscription-item {
    width: 100%;
    max-width: 400px; /* Empêche les débordements */
    margin: 8px auto; /* Centre chaque bloc */
  }

  .CLientAbonementClientVue .subscription-header,
  .CLientAbonementClientVue .subscription-details {
    justify-content: center;
  }

  .CLientAbonementClientVue .subscription-empty,
  .CLientAbonementClientVue .subscription-loading,
  .CLientAbonementClientVue .subscription-error {
    text-align: center;
    width: 100%;
  }

  .CLientAbonementClientVue .subscription-pagination {
    justify-content: center;
  }
}

/*  Très petits écrans : centrage renforcé */
@media (max-width: 480px) {
  .CLientAbonementClientVue .subscription-card-container {
    width: 100%;
    padding: 10px;
    align-items: center;
  }

  .CLientAbonementClientVue .subscription-item {
    width: 100%;
    max-width: 360px;
    margin: 6px auto;
  }

  .CLientAbonementClientVue .subscription-card-header {
    justify-content: center;

  }

  .CLientAbonementClientVue .subscription-card-header h2 {
    width: 100%;
  }
}

/* === STATUTS ESSAI === */
.CLientAbonementClientVue .subscription-status-trial-active {
  background-color: #e3f2fd;
  color: #0F447E;
  padding: 4px 12px;
  border-radius: 50px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.CLientAbonementClientVue .subscription-status-trial-expired {
  background-color: #ffebee;
  color: #c62828;
  padding: 4px 12px;
  border-radius: 50px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.skeleton-card {
  background: #fff;
  border: 1px solid #e5e7eb; /* gris clair */
  border-radius: 12px;
  padding: 16px;
  width: 100%;
  margin-bottom: 16px;
  position: relative;
  overflow: hidden;
}

.skeleton {
  background-color: #e5e7eb;
  border-radius: 6px;
  position: relative;
  overflow: hidden;
}

.skeleton::after {
  content: "";
  position: absolute;
  top: 0;
  left: -150px;
  height: 100%;
  width: 150px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.5),
    transparent
  );
  animation: shimmer 1.2s infinite;
}

@keyframes shimmer {
  0% {
    left: -150px;
  }
  100% {
    left: 100%;
  }
}

/* Tailles */
.skeleton-title {
  height: 20px;
  width: 130px;
  margin-bottom: 8px;
}

.skeleton-badge {
  height: 20px;
  width: 50px;
  border-radius: 9999px;
}

.skeleton-line {
  height: 14px;
  width: 100px;
  margin: 6px 0;
}

.skeleton-button {
  height: 36px;
  width: 100%;
  border-radius: 8px;
  margin-top: 12px;
}

/* ============================================
   HISTORIQUE DE RÉSERVATIONS - CSS COMPLET
   ============================================ */

/* -------------------- CONTENEUR PRINCIPAL -------------------- */
.ClasseReservationClient {
  width: 100%;
  max-width: 1920px;
  margin: 20px 0;
  box-sizing: border-box;
}

.ClasseReservationClient .reservation-history-card-container {
  width: 100%;
  max-width: 1920px;
  margin: 0;
  background: #ffffff;
  border: 1px solid #0c447e;
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  padding: 20px;
  box-sizing: border-box;
  font-family: 'Poppins', sans-serif;
}

/* -------------------- HEADER CARD -------------------- */
.ClasseReservationClient .reservation-history-card-header {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 15px;
  border-bottom: 1px solid #0c447e;
  padding-bottom: 10px;
}

.ClasseReservationClient .reservation-icon {
  color: #0f447e;
  font-size: 22px;
  margin-right: 10px;
  flex-shrink: 0;
}

.ClasseReservationClient .reservation-history-card-header h2 {
  font-family: 'Poppins', sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: #0f447e;
  margin: 0;
  overflow-wrap: break-word;
}

.ClasseReservationClient .reservation-history-highlight {
  color: #E30613;
}

/* -------------------- CONTENU -------------------- */
.ClasseReservationClient .reservation-history-card-content {
  padding: 0;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #0c447e #f0f0f0;
  width: 100%;
  box-sizing: border-box;
}

/* -------------------- ITEMS -------------------- */
.ClasseReservationClient .reservation-history-item {
  padding: 16px;
  border-bottom: 1px solid #eaeaea;
  margin: 0 0 15px 0;
  border-radius: 8px;
  background-color: #f9f9f9;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
  position: relative;
  width: 100%;
  box-sizing: border-box;
}

/* -------------------- HEADER ITEM -------------------- */
.ClasseReservationClient .reservation-history-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-bottom: 16px;
  gap: 12px;
  flex-wrap: wrap;
  box-sizing: border-box;
}

.ClasseReservationClient .reservation-history-title {
  font-size: clamp(14px, 4vw, 16px);
  font-weight: 600;
  color: #0c447e;
  margin: 0;
  overflow-wrap: break-word;
  max-width: 100%;
}

/* -------------------- ACTIONS CONTAINER -------------------- */
.ClasseReservationClient .reservation-history-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ClasseReservationClient .reservation-history-cta {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.ClasseReservationClient .reservation-history-refresh-container {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
  width: 100%;
  box-sizing: border-box;
}

/* -------------------- BOUTONS -------------------- */
.ClasseReservationClient .reservation-history-refresh-btn,
.ClasseReservationClient .reservation-history-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  white-space: nowrap;
  height: 40px;
  padding: 0 16px;
  font-size: 14px;
  font-weight: 600;
  font-family: 'Poppins', sans-serif;
  border: none;
  border-radius: 8px;
  background: linear-gradient(135deg, #0f447e 0%, #1e5a96 100%);
  color: white;
  cursor: pointer;
  box-sizing: border-box;
  transition: all 0.2s ease;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
  -webkit-user-select: none;
          user-select: none;
  outline: none;
}

.ClasseReservationClient .reservation-history-refresh-btn .btn-icon,
.ClasseReservationClient .reservation-history-cta-btn .btn-icon {
  font-size: 20px;
  flex-shrink: 0;
  transition: font-size 0.2s ease;
}

.ClasseReservationClient .reservation-history-cta-btn .btn-text {
  overflow: hidden;
  text-overflow: ellipsis;
}

.ClasseReservationClient .reservation-history-refresh-btn .btn-text {
  display: none;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* -------------------- BOUTON RÉESSAYER MAINTENANT -------------------- */
.ClasseReservationClient .reservation-history-retry-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  white-space: nowrap;
  height: 40px;
  padding: 0 20px;
  font-size: 14px;
  font-weight: 600;
  font-family: 'Poppins', sans-serif;
  border: none;
  border-radius: 8px;
  background: linear-gradient(135deg, #0f447e 0%, #1e5a96 100%);
  color: white;
  cursor: pointer;
  box-sizing: border-box;
  transition: all 0.2s ease;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
  -webkit-user-select: none;
          user-select: none;
  outline: none;
  margin-top: 15px;
}

.ClasseReservationClient .reservation-history-retry-btn:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.2), 0 0 12px rgba(30, 90, 150, 0.4);
  background: linear-gradient(135deg, #1e5a96 0%, #0f447e 100%);
}

.ClasseReservationClient .reservation-history-retry-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  background: #94a3b8;
  transform: none !important;
}

.ClasseReservationClient .reservation-history-retry-btn:focus {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

.ClasseReservationClient .reservation-history-retry-btn:active:not(:disabled) {
  transform: translateY(0);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

/* Icône de refresh avec animation */
.ClasseReservationClient .refresh-icon {
  transition: transform 0.3s ease;
}

.ClasseReservationClient .spinning {
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* -------------------- BOUTON RELANCER -------------------- */
.ClasseReservationClient .reservation-history-relancer-btn {
  padding: 8px 16px;
  border-radius: 50px;
  font-size: clamp(11px, 3vw, 12px);
  font-weight: 500;
  background-color: #0f447e;
  color: white;
  border: 1px solid #0f447e;
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: 'Poppins', sans-serif;
  outline: none;
  position: absolute;
  bottom: 16px;
  right: 16px;
  max-width: 100%;
}

/* -------------------- STATUTS -------------------- */
.ClasseReservationClient .reservation-history-status {
  padding: 4px 12px;
  border-radius: 50px;
  font-size: clamp(11px, 3vw, 12px);
  font-weight: 500;
  white-space: nowrap;
}

.ClasseReservationClient .reservation-history-status-annulee {
  background-color: #fef2f2;
  color: #dc2626;
  border: 1px solid #fecaca;
}

.ClasseReservationClient .reservation-history-status-rejetee {
  background-color: #fef2f2;
  color: #b91c1c;
  border: 1px solid #fca5a5;
}

.ClasseReservationClient .reservation-history-status-confirmee {
  background-color: #f0fdf4;
  color: #16a34a;
  border: 1px solid #bbf7d0;
}

.ClasseReservationClient .reservation-history-status-en-paiement {
  background-color: #f0fdf4;
  color: #58b175;
  border: 1px solid #bbf7d0;
}

.ClasseReservationClient .reservation-history-status-en-attente {
  background-color: #fefce8;
  color: #ca8a04;
  border: 1px solid #fde047;
}

.ClasseReservationClient .reservation-history-status-en-traitement {
  background-color: #eff6ff;
  color: #2563eb;
  border: 1px solid #bfdbfe;
}

.ClasseReservationClient .reservation-history-status-remboursement {
  background-color: #eff6ff;
  color: #2563eb;
  border: 1px solid #bfdbfe;
}

/* -------------------- DÉTAILS -------------------- */
.ClasseReservationClient .reservation-history-details {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  grid-gap: 12px;
  gap: 12px;
  margin-bottom: 40px;
  width: 100%;
  box-sizing: border-box;
}

.ClasseReservationClient .reservation-history-detail {
  display: flex;
  flex-direction: column;
  max-width: 100%;
  gap: 6px;
}

.ClasseReservationClient .reservation-history-label {
  font-size: clamp(12px, 3vw, 13px);
  font-weight: 500;
  color: #5a6474;
  overflow-wrap: break-word;
}

.ClasseReservationClient .reservation-history-value {
  font-size: clamp(13px, 3.5vw, 14px);
  color: #333;
  font-weight: 500;
  overflow-wrap: break-word;
  max-width: 100%;
}

.ClasseReservationClient .reservation-history-type {
  color: #0c447e;
}

/* -------------------- ÉTATS VIDES/LOADING -------------------- */
.ClasseReservationClient .reservation-history-empty,
.ClasseReservationClient .reservation-history-loading {
  padding: 40px 20px;
  text-align: center;
  color: #5a6474;
}

.ClasseReservationClient .reservation-history-error {
  padding: 40px 20px;
  text-align: center;
  color: #ef4444;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
}

/* -------------------- PAGINATION -------------------- */
.ClasseReservationClient .modern-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 20px;
  padding: 15px 0;
  border-top: 1px solid #e5e7eb;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  overflow-x: hidden;
}

.ClasseReservationClient .modern-pagination-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 38px;
  height: 38px;
  padding: 8px 12px;
  border: 1px solid #d1d5db;
  background: #ffffff;
  color: #6b7280;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  font-family: 'Poppins', sans-serif;
  cursor: pointer;
  transition: all 0.2s ease;
  -webkit-user-select: none;
          user-select: none;
  text-decoration: none;
  flex-shrink: 0;
}

.ClasseReservationClient .modern-pagination-btn.active {
  background: linear-gradient(135deg, #0f447e 0%, #1e5a96 100%);
  border-color: #0f447e;
  color: white;
  box-shadow: 0 2px 8px rgba(12, 68, 126, 0.3);
}

.ClasseReservationClient .modern-pagination-nav {
  gap: 8px;
  padding: 8px 16px;
  font-weight: 600;
}

.ClasseReservationClient .modern-pagination-numbers {
  display: flex;
  align-items: center;
  gap: 4px;
}

.ClasseReservationClient .modern-pagination-number {
  min-width: 38px;
  font-weight: 600;
}

.ClasseReservationClient .modern-pagination-ellipsis {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 38px;
  height: 38px;
  color: #9ca3af;
  font-size: 12px;
}

.ClasseReservationClient .pagination-icon {
  font-size: 12px;
  flex-shrink: 0;
}

.ClasseReservationClient .pagination-text {
  white-space: nowrap;
}

/* ============================================
   ÉTATS INTERACTIFS (DESKTOP)
   ============================================ */
@media (min-width: 1025px) {
  .ClasseReservationClient .reservation-history-refresh-btn:hover:not(:disabled),
  .ClasseReservationClient .reservation-history-cta-btn:hover:not(:disabled),
  .ClasseReservationClient .reservation-history-relancer-btn:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.2), 0 0 12px rgba(30, 90, 150, 0.4);
  }

  .ClasseReservationClient .modern-pagination-btn:hover:not(:disabled):not(.disabled) {
    background: #f8fafc;
    border-color: #0f447e;
    color: #0f447e;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(12, 68, 126, 0.1);
  }

  .ClasseReservationClient .modern-pagination-btn.active:hover {
    background: linear-gradient(135deg, #1e5a96 0%, #0f447e 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(12, 68, 126, 0.4);
  }
}

/* ============================================
   RESPONSIVE - TABLETTE (≤ 1024px)
   ============================================ */
@media (max-width: 1024px) {
  .ClasseReservationClient .reservation-history-details {
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  }

  /* Masquer le texte, garder les icônes */
  .ClasseReservationClient .reservation-history-cta-btn .btn-text,
  .ClasseReservationClient .reservation-history-refresh-btn .btn-text {
    display: none;
  }

  .ClasseReservationClient .reservation-history-cta-btn .btn-icon,
  .ClasseReservationClient .reservation-history-refresh-btn .btn-icon {
    font-size: 22px;
  }

  /* Masquer le titre, centrer l'icône */
  .ClasseReservationClient .reservation-history-card-header h2 {
    display: none;
  }

  .ClasseReservationClient .reservation-history-card-header {
    justify-content: center;
  }

  .ClasseReservationClient .reservation-icon {
    font-size: 26px;
  }
}

/* ============================================
   RESPONSIVE - TABLETTE/MOBILE (≤ 768px)
   ============================================ */
@media (max-width: 768px) {
  .ClasseReservationClient {
    padding: 0 10px;
  }

  .ClasseReservationClient .reservation-history-header {
    margin-bottom: 12px;
    gap: 10px;
  }

  .ClasseReservationClient .reservation-history-actions {
    gap: 10px;
  }

  .ClasseReservationClient .reservation-history-refresh-container {
    gap: 10px;
  }

  /* Boutons plus compacts */
  .ClasseReservationClient .reservation-history-refresh-btn,
  .ClasseReservationClient .reservation-history-cta-btn,
  .ClasseReservationClient .reservation-history-retry-btn {
    height: 38px;
    padding: 0 12px;
    font-size: 13px;
  }

  /* Icônes tablette */
  .ClasseReservationClient .reservation-history-refresh-btn .btn-icon {
    font-size: 18px;
  }

  .ClasseReservationClient .reservation-history-cta-btn .btn-icon {
    font-size: 20px;
  }

  /* Détails */
  .ClasseReservationClient .reservation-history-details {
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  }

  /* Pagination */
  .ClasseReservationClient .modern-pagination {
    gap: 4px;
    margin-top: 24px;
    padding: 16px 0;
  }

  .ClasseReservationClient .modern-pagination-btn {
    min-width: 36px;
    height: 36px;
    font-size: 13px;
  }

  .ClasseReservationClient .modern-pagination-nav {
    padding: 6px 12px;
  }

  .ClasseReservationClient .modern-pagination-numbers {
    gap: 2px;
  }

  .ClasseReservationClient .modern-pagination-ellipsis {
    min-width: 36px;
    height: 36px;
  }
}

/* ============================================
   RESPONSIVE - MOBILE (≤ 480px)
   ============================================ */
@media (max-width: 480px) {
  .ClasseReservationClient {
    padding: 0 8px;
  }

  .ClasseReservationClient .reservation-history-header {
    margin-bottom: 10px;
    gap: 8px;
    flex-wrap: nowrap;
  }

  .ClasseReservationClient .reservation-history-actions {
    gap: 8px;
  }

  .ClasseReservationClient .reservation-history-refresh-container {
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: nowrap;
  }

  /* Boutons mobile */
  .ClasseReservationClient .reservation-history-refresh-btn,
  .ClasseReservationClient .reservation-history-cta-btn,
  .ClasseReservationClient .reservation-history-retry-btn {
    height: 36px;
    padding: 0 10px;
    font-size: 12px;
    min-width: 36px;
  }

  /* Icônes mobile */
  .ClasseReservationClient .reservation-history-refresh-btn .btn-icon {
    font-size: 16px;
  }

  .ClasseReservationClient .reservation-history-cta-btn .btn-icon {
    font-size: 18px;
  }

  /* CTA reste à droite */
  .ClasseReservationClient .reservation-history-cta {
    flex: 0 0 auto;
  }

  .ClasseReservationClient .reservation-history-cta-btn {
    width: auto;
  }

  /* Détails en colonnes simples */
  .ClasseReservationClient .reservation-history-details {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .ClasseReservationClient .reservation-history-detail {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: nowrap;
  }

  .ClasseReservationClient .reservation-history-label {
    min-width: 80px;
    text-align: left;
  }

  .ClasseReservationClient .reservation-history-value {
    text-align: right;
    max-width: calc(100% - 90px);
  }

  /* Bouton relancer */
  .ClasseReservationClient .reservation-history-relancer-btn {
    position: static;
    margin-top: 8px;
    width: 100%;
    text-align: center;
  }
}

/* ============================================
   RESPONSIVE - TRÈS PETIT ÉCRAN (≤ 360px)
   ============================================ */
@media (max-width: 360px) {
  .ClasseReservationClient {
    padding: 0 5px;
  }

  .ClasseReservationClient .reservation-history-refresh-btn,
  .ClasseReservationClient .reservation-history-cta-btn,
  .ClasseReservationClient .reservation-history-retry-btn {
    height: 34px;
    padding: 0 8px;
    font-size: 11px;
  }

  /* Icônes très petit écran */
  .ClasseReservationClient .reservation-history-refresh-btn .btn-icon {
    font-size: 14px;
  }

  .ClasseReservationClient .reservation-history-cta-btn .btn-icon {
    font-size: 16px;
  }

  .ClasseReservationClient .reservation-history-label {
    min-width: 75px;
    font-size: 12px;
  }

  .ClasseReservationClient .reservation-history-value {
    font-size: 12px;
    max-width: calc(100% - 85px);
  }
}

/* ============================================
   ÉTATS DISABLED & FOCUS
   ============================================ */
.ClasseReservationClient .reservation-history-refresh-btn:disabled,
.ClasseReservationClient .reservation-history-cta-btn:disabled,
.ClasseReservationClient .reservation-history-relancer-btn:disabled,
.ClasseReservationClient .reservation-history-retry-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  background: #94a3b8;
  transform: none !important;
}

.ClasseReservationClient .modern-pagination-btn:disabled,
.ClasseReservationClient .modern-pagination-btn.disabled {
  background: #f9fafb;
  border-color: #e5e7eb;
  color: #d1d5db;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

.ClasseReservationClient .reservation-history-refresh-btn:focus,
.ClasseReservationClient .reservation-history-cta-btn:focus,
.ClasseReservationClient .reservation-history-relancer-btn:focus,
.ClasseReservationClient .reservation-history-retry-btn:focus {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

.ClasseReservationClient .reservation-history-refresh-btn:active:not(:disabled),
.ClasseReservationClient .reservation-history-cta-btn:active:not(:disabled),
.ClasseReservationClient .reservation-history-relancer-btn:active:not(:disabled),
.ClasseReservationClient .reservation-history-retry-btn:active:not(:disabled) {
  transform: translateY(0);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.ClasseReservationClient .modern-pagination-btn:active:not(:disabled):not(.disabled) {
  transform: translateY(0);
  box-shadow: 0 1px 2px rgba(12, 68, 126, 0.1);
}
.actions-card-containerA {
  width: 100%;
  max-width: 1920px; /* Largeur maximale pour grands écrans */
  margin: 20px auto; /* Centré avec des marges en haut et en bas */
  border: none; /* Aucune bordure */
}

.actions-card-headerA {
  margin-bottom: 20px;
}

.actions-card-headerA h2 {
  font-family: 'Poppins', sans-serif;
  font-size: 24px;
  font-weight: 600;
  color: #0c447e;
  margin: 0;
}

.actions-cardsA {
  display: flex;
  gap: 20px;
}

.action-itemA {
  flex: 1 1;
  display: flex;
  flex-direction: row; /* Icône à gauche, textes à droite */
  align-items: center; /* Centrage vertical */
  background: #ffffff;
  border: 1px solid #e0e0e0; /* Bordure fine */
  border-radius: 8px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Ombre */
  padding: 20px;
  font-family: 'Poppins', sans-serif;
  transition: transform 0.2s, box-shadow 0.3s, background-color 0.3s ease; /* Transition pour effet de survol */
  box-sizing: border-box; /* Inclut padding et bordure dans la largeur */
}

.action-itemA:hover {
  transform: translateY(-3px); /* Légère élévation au survol */
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15); /* Ombre plus marquée au survol */
  background-color: #f8f9fa; /* Légère variation de couleur de fond au survol */
}

.icon-wrapperA {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px; /* Taille carrée */
  height: 50px;
  border-radius: 10%; /* Carré avec coins légèrement arrondis */
  margin-right: 15px; /* Espacement avec les textes à droite */
  flex-shrink: 0; /* Empêche l'icône de rétrécir */
  padding: 8px; /* Ajout de padding pour le fond */
  background-color: #e6f0fa; /* Bleu clair pour tous */
  cursor: pointer;
}

.action-iconA {
  font-size: 24px;
  color: #0c447e;
}

.action-textA {
  display: flex;
  flex-direction: column; /* Les textes restent en colonne (titre en haut, sous-titre en bas) */
  justify-content: center; /* Centrage vertical des textes par rapport à l'icône */
  flex: 1 1; /* Prend tout l'espace restant */
  overflow-wrap: break-word; /* Permet au texte de passer à la ligne */
  cursor: pointer;
}

.action-titleA {
  font-size: 16px;
  font-weight: 500;
  color: #0c447e; /* Titre en bleu */
  margin-bottom: 5px; /* Espacement avec le sous-titre */
}

.action-subtitleA {
  font-size: 12px;
  color: #656565; /* Sous-titre en gris */
}

.popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.popup-content {
  background: white;
  padding: 20px;
  border-radius: 8px;
  text-align: center;
  max-width: 400px;
  width: 90%;
}

.popup-content h2 {
  margin-bottom: 15px;
}

.popup-content button {
  padding: 10px 20px;
  background-color: #007bff;
  color: white;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}

.popup-content button:hover {
  background-color: #0056b3;
}

/* Responsive */

/* Grands écrans (≥1200px) */
@media (min-width: 1200px) {
  .actions-card-containerA {
      margin: 20px auto;
  }

  .actions-card-headerA h2 {
      font-size: 26px;
  }

  .actions-cardsA {
      gap: 25px;
  }

  .action-itemA {
      padding: 25px;
  }

  .icon-wrapperA {
      width: 60px;
      height: 60px;
      padding: 10px; /* Ajusté pour les grands écrans */
  }

  .action-iconA {
      font-size: 28px;
  }

  .action-titleA {
      font-size: 18px;
  }

  .action-subtitleA {
      font-size: 14px;
  }
}

/* Tablettes (≤1024px) */
@media (max-width: 1024px) {
  .actions-card-containerA {
      margin: 10px 30px; /* Marges latérales augmentées de 20px à 30px */
      width: calc(100% - 60px); /* Largeur ajustée pour inclure les marges */
  }

  .actions-card-headerA h2 {
      font-size: 22px;
  }

  .actions-cardsA {
      gap: 15px;
  }

  .action-itemA {
      padding: 15px;
  }

  .icon-wrapperA {
      width: 50px;
      height: 50px;
      padding: 8px; /* Ajusté pour les tablettes */
  }

  .action-iconA {
      font-size: 24px;
  }

  .action-titleA {
      font-size: 16px;
  }

  .action-subtitleA {
      font-size: 13px;
  }
}

/* Petites tablettes (≤768px) */
@media (max-width: 768px) {
  .actions-card-containerA {
      margin: 5px 25px; /* Marges latérales augmentées de 15px à 25px */
      width: calc(100% - 50px); /* Largeur ajustée pour inclure les marges */
  }

  .actions-card-headerA h2 {
      font-size: 20px;
  }

  .actions-cardsA {
      flex-direction: column;
      gap: 12px;
  }

  .action-itemA {
      padding: 15px;
  }

  .icon-wrapperA {
      width: 50px;
      height: 50px;
      padding: 8px; /* Ajusté pour les petites tablettes */
  }

  .action-iconA {
      font-size: 24px;
  }

  .action-titleA {
      font-size: 16px;
  }

  .action-subtitleA {
      font-size: 12px;
  }
}

/* Mobiles (≤480px) */
@media (max-width: 480px) {
  .actions-card-containerA {
      margin: 15px 25px; /* Marges latérales uniformes */
      width: calc(100% - 50px); /* Largeur ajustée pour inclure les marges */
  }

  .actions-card-headerA {
      margin-bottom: 15px;
  }

  .actions-card-headerA h2 {
      font-size: 20px;
  }

  .actions-cardsA {
      gap: 12px;
  }

  .action-itemA {
      padding: 15px;
      border-radius: 10px;
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
      width: 100%; /* Prend toute la largeur disponible */
  }

  .icon-wrapperA {
      width: 60px; /* Réduit de 65px à 60px */
      height: 60px;
      padding: 8px; /* Réduit de 10px à 8px pour s’adapter à l’icône plus petite */
      margin-right: 12px;
  }

  .action-iconA {
      font-size: 30px; /* Réduit de 34px à 30px */
  }

  .action-titleA {
      font-size: 16px;
      margin-bottom: 4px;
  }

  .action-subtitleA {
      font-size: 12px;
  }
}

/* Très petits écrans (≤360px) */
@media (max-width: 360px) {
  .actions-card-containerA {
      margin: 10px 20px; /* Marges latérales uniformes */
      width: calc(100% - 40px); /* Largeur ajustée pour inclure les marges */
  }

  .actions-card-headerA h2 {
      font-size: 18px;
  }

  .actions-cardsA {
      gap: 10px;
  }

  .action-itemA {
      padding: 12px;
      border-radius: 8px;
  }

  .icon-wrapperA {
      width: 55px; /* Réduit de 60px à 55px */
      height: 55px;
      padding: 6px; /* Réduit de 8px à 6px pour s’adapter à l’icône plus petite */
      margin-right: 10px;
  }

  .action-iconA {
      font-size: 28px; /* Réduit de 32px à 28px */
  }

  .action-titleA {
      font-size: 14px;
  }

  .action-subtitleA {
      font-size: 11px;
  }
}
/* ProfileEditModal.css - Design Moderne avec préfixe NouvelleCl */

/* === OVERLAY AVEC BLUR === */
.NouvelleCl-modal-overlayP {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 99999;
  overflow-y: auto;
  padding: 1.5rem;
  animation: NouvelleCl-fadeIn 0.3s ease-out;
  margin: 0;
  box-sizing: border-box;
}

@keyframes NouvelleCl-fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* === CONTAINER MODAL === */
.NouvelleCl-modal-containerP {
  background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  border-radius: 20px;
  box-shadow:
    0 20px 60px rgba(0, 0, 0, 0.15),
    0 0 0 1px rgba(255, 255, 255, 0.1);
  width: 100%;
  max-width: 500px;
  max-height: 90vh;
  overflow-y: auto;
  margin: auto;
  padding: 2rem;
  animation: NouvelleCl-slideUp 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
  box-sizing: border-box;
}

@keyframes NouvelleCl-slideUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.NouvelleCl-modal-containerP::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #0a4275 0%, #0c5d9e 100%);
  border-radius: 20px 20px 0 0;
}

/* === SCROLLBAR PERSONNALISÉE === */
.NouvelleCl-modal-containerP::-webkit-scrollbar {
  width: 6px;
}

.NouvelleCl-modal-containerP::-webkit-scrollbar-track {
  background: #f1f5f9;
  border-radius: 10px;
}

.NouvelleCl-modal-containerP::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 10px;
}

.NouvelleCl-modal-containerP::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* === CONTENU === */
.NouvelleCl-modal-contentP {
  width: 100%;
}

/* === TITRE === */
.NouvelleCl-modal-titleP {
  color: #0a4275;
  font-size: 1.75rem;
  font-weight: 700;
  margin-bottom: 1.5rem;
  letter-spacing: -0.02em;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.NouvelleCl-modal-titleP::before {
  content: '';
  width: 4px;
  height: 32px;
  background: linear-gradient(180deg, #0a4275 0%, #0c5d9e 100%);
  border-radius: 10px;
}

.NouvelleCl-text-redP {
  color: #dc3545;
  font-weight: 700;
}

/* === FORMULAIRE === */
.NouvelleCl-modal-formP {
  width: 100%;
}

/* === GROUPES DE CHAMPS === */
.NouvelleCl-form-groupP {
  margin-bottom: 1.5rem;
}

.NouvelleCl-form-groupP label {
  display: block;
  color: #1e293b;
  font-weight: 600;
  margin-bottom: 0.625rem;
  font-size: 0.95rem;
  letter-spacing: -0.01em;
}

.NouvelleCl-form-groupP input {
  width: 100%;
  padding: 0.875rem 1rem;
  border: 2px solid #e2e8f0;
  border-radius: 12px;
  font-size: 1rem;
  transition: all 0.2s ease;
  background: #ffffff;
  font-family: inherit;
}

.NouvelleCl-form-groupP input:focus {
  outline: none;
  border-color: #0a4275;
  box-shadow: 0 0 0 4px rgba(10, 66, 117, 0.08);
  background: #ffffff;
}

.NouvelleCl-form-groupP input::placeholder {
  color: #94a3b8;
}

/* === PHONE INPUT === */
.react-tel-input {
  margin-top: 0.625rem;
}

.react-tel-input .form-control {
  width: 100% !important;
  height: 48px !important;
  border: 2px solid #e2e8f0 !important;
  border-radius: 12px !important;
  font-size: 1rem !important;
  padding-left: 52px !important;
  transition: all 0.2s ease !important;
  background: #ffffff !important;
}

.react-tel-input .form-control:focus {
  border-color: #0a4275 !important;
  box-shadow: 0 0 0 4px rgba(10, 66, 117, 0.08) !important;
}

.react-tel-input .flag-dropdown {
  border: 2px solid #e2e8f0 !important;
  border-radius: 12px 0 0 12px !important;
  background: #f8fafc !important;
}

/* === MESSAGES === */
.NouvelleCl-error-messageP {
  background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%);
  color: #dc2626;
  padding: 1rem 1.25rem;
  border-radius: 12px;
  margin-bottom: 1.25rem;
  font-size: 0.9rem;
  font-weight: 500;
  border-left: 4px solid #dc2626;
  animation: NouvelleCl-shake 0.4s ease;
}

@keyframes NouvelleCl-shake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-5px); }
  75% { transform: translateX(5px); }
}

.NouvelleCl-success-messageP {
  background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
  color: #16a34a;
  padding: 1rem 1.25rem;
  border-radius: 12px;
  margin-bottom: 1.25rem;
  font-size: 0.9rem;
  font-weight: 500;
  border-left: 4px solid #16a34a;
  animation: NouvelleCl-fadeIn 0.3s ease;
}

/* === ERREURS DE VALIDATION === */
.NouvelleCl-validation-errorP {
  color: #dc2626;
  font-size: 0.8rem;
  margin-top: 0.375rem;
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-weight: 500;
}

/* Remplacer l'emoji par une icône CSS */
.NouvelleCl-validation-errorP::before {
  content: '!';
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  background: #dc2626;
  color: white;
  border-radius: 50%;
  font-size: 0.7rem;
  font-weight: bold;
}

.NouvelleCl-error-inputP {
  border-color: #dc2626 !important;
  background: #fef2f2 !important;
}

.NouvelleCl-error-inputP:focus {
  border-color: #dc2626 !important;
  box-shadow: 0 0 0 4px rgba(220, 38, 38, 0.1) !important;
}

/* === BOUTON TOGGLE NIP === */
.NouvelleCl-btn-toggle-nip {
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
  border: 2px solid #3b82f6;
  color: #1e40af;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  padding: 0.75rem 1.25rem;
  margin: 0.75rem 0 1.25rem;
  border-radius: 12px;
  transition: all 0.2s ease;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

/* Remplacer l'emoji par une icône CSS */
.NouvelleCl-btn-toggle-nip::before {
  content: '';
  display: inline-block;
  width: 18px;
  height: 18px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27currentColor%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Crect x=%273%27 y=%2711%27 width=%2718%27 height=%2711%27 rx=%272%27 ry=%272%27/%3E%3Cpath d=%27M7 11V7a5 5 0 0 1 10 0v4%27/%3E%3C/svg%3E") no-repeat center;
          mask: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27currentColor%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Crect x=%273%27 y=%2711%27 width=%2718%27 height=%2711%27 rx=%272%27 ry=%272%27/%3E%3Cpath d=%27M7 11V7a5 5 0 0 1 10 0v4%27/%3E%3C/svg%3E") no-repeat center;
  mask-size: contain;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27currentColor%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Crect x=%273%27 y=%2711%27 width=%2718%27 height=%2711%27 rx=%272%27 ry=%272%27/%3E%3Cpath d=%27M7 11V7a5 5 0 0 1 10 0v4%27/%3E%3C/svg%3E") no-repeat center;
  -webkit-mask-size: contain;
}

.NouvelleCl-btn-toggle-nip:hover {
  background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%);
}

.NouvelleCl-btn-toggle-nip:active {
  transform: translateY(0);
}

/* === SECTION NIP === */
.NouvelleCl-nip-section {
  margin-top: 1.5rem;
  padding: 1.5rem;
  border-radius: 16px;
  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
  border: 2px solid #e2e8f0;
  animation: NouvelleCl-slideDown 0.3s ease-out;
}

@keyframes NouvelleCl-slideDown {
  from {
    opacity: 0;
    max-height: 0;
    padding: 0 1.5rem;
  }
  to {
    opacity: 1;
    max-height: 500px;
    padding: 1.5rem;
  }
}

.NouvelleCl-nip-section .NouvelleCl-form-groupP {
  margin-bottom: 1.25rem;
}

.NouvelleCl-nip-section .NouvelleCl-form-groupP:last-child {
  margin-bottom: 0;
}

/* === CHAMPS AVEC ICÔNE === */
.NouvelleCl-password-input-container {
  position: relative;
}

.NouvelleCl-password-input-container input {
  width: 100%;
  padding: 0.875rem 3rem 0.875rem 1rem;
  border: 2px solid #e2e8f0;
  border-radius: 12px;
  font-size: 1rem;
  transition: all 0.2s ease;
  background: #ffffff;
}

.NouvelleCl-password-input-container input:focus {
  outline: none;
  border-color: #0a4275;
  box-shadow: 0 0 0 4px rgba(10, 66, 117, 0.08);
}

.NouvelleCl-password-input-container button {
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  cursor: pointer;
  color: #64748b;
  padding: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  border-radius: 8px;
}

.NouvelleCl-password-input-container button:hover {
  color: #0a4275;
  background: #f1f5f9;
}

/* === ACTIONS === */
.NouvelleCl-modal-actionsP {
  display: flex;
  justify-content: flex-end;
  gap: 1rem;
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 2px solid #f1f5f9;
}

.NouvelleCl-btn-cancelP {
  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
  color: #64748b;
  border: 2px solid #e2e8f0;
  border-radius: 12px;
  padding: 0.875rem 1.75rem;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
}

.NouvelleCl-btn-cancelP:hover {
  background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
  color: #475569;
}

.NouvelleCl-btn-saveP {
  background: linear-gradient(135deg, #0a4275 0%, #0c5d9e 100%);
  color: white;
  border: none;
  border-radius: 12px;
  padding: 0.875rem 1.75rem;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  box-shadow: 0 4px 12px rgba(10, 66, 117, 0.2);
}


.NouvelleCl-btn-saveP:active,
.NouvelleCl-btn-cancelP:active {
  transform: translateY(0);
}

.NouvelleCl-btn-saveP:disabled,
.NouvelleCl-btn-cancelP:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none !important;
}

/* === RESPONSIVE === */
@media (max-width: 640px) {
  .NouvelleCl-modal-overlayP {
    padding: 1rem 0;
  }

  .NouvelleCl-modal-containerP {
    padding: 1.5rem;
    margin: 0 0.75rem;
    border-radius: 16px;
  }

  .NouvelleCl-modal-titleP {
    font-size: 1.5rem;
  }

  .NouvelleCl-modal-actionsP {
    flex-direction: column;
    gap: 0.75rem;
  }

  .NouvelleCl-btn-cancelP,
  .NouvelleCl-btn-saveP {
    width: 100%;
    padding: 1rem;
  }
}

@media (max-width: 480px) {
  .NouvelleCl-modal-containerP {
    padding: 1.25rem;
    margin: 0 0.5rem;
  }

  .NouvelleCl-modal-titleP {
    font-size: 1.35rem;
  }

  .NouvelleCl-modal-titleP::before {
    height: 28px;
  }

  .NouvelleCl-nip-section {
    padding: 1.25rem;
  }
}

/* === ACCESSIBILITÉ === */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

.NouvelleCl-btn-cancelP:focus-visible,
.NouvelleCl-btn-saveP:focus-visible,
.NouvelleCl-btn-toggle-nip:focus-visible {
  outline: 3px solid #0a4275;
  outline-offset: 3px;
}

.NouvelleCl-form-groupP input:focus-visible,
.NouvelleCl-password-input-container input:focus-visible {
  outline: none;
  border-color: #0a4275;
  box-shadow: 0 0 0 4px rgba(10, 66, 117, 0.08);
}
.dashboard-wrapper {
    display: flex;
    flex-direction: column;
    min-height: 100vh; /* Assure que le wrapper prend toute la hauteur de la fenêtre */
    background: #ffffff; /* Fond global */
  }
  
  .main-content {
    margin-top: 90px; /* Hauteur de la Topbar (60px + 30px) */
    margin-left: 260px; /* Largeur du Sidebar */
    padding: 20px;
    flex: 1 1; /* Permet à main-content de prendre tout l'espace disponible */
    box-sizing: border-box;
    /* Retire overflow-y et height pour laisser le défilement au niveau du wrapper */
  }
  
  .lists-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 20px;
    gap: 20px;
    width: calc(100% - 300px); /* 260px (Sidebar) + 20px (marge gauche) + 20px (marge droite) */
    margin-left: 280px; /* 260px (Sidebar) + 20px (marge gauche) */
    margin-right: 20px;
    margin-top: 20px;
    margin-bottom: 80px;
  }
  
  .dashboard-footer {
    width: calc(100% - 260px);
    margin-left: 260px;
    padding: 20px;
    background: #FFFFFF;
    text-align: center;
    font-family: 'Poppins', sans-serif;
    color: #656565;
    font-size: 14px;
    /* Retire position: fixed pour laisser le footer dans le flux naturel */
    /* position: fixed; */
    /* bottom: 0; */
    /* left: 0; */
    /* z-index: 10; */
  }
  
  /* Responsive */
  @media (min-width: 1200px) {
    .main-content {
      margin-left: 280px;
      margin-top: 90px; /* 60px (hauteur de base) + 30px (padding-top) */
    }
  
    .lists-container {
      width: calc(100% - 320px); /* 280px (Sidebar) + 20px (marge gauche) + 20px (marge droite) */
      margin-left: 300px;
      margin-right: 20px;
    }
  
    .dashboard-footer {
      width: calc(100% - 280px);
      margin-left: 280px;
      padding: 25px;
      font-size: 16px;
    }
  }
  
  @media (max-width: 1024px) {
    .main-content {
      margin-left: 240px;
      margin-top: 90px; /* 60px (hauteur de base) + 30px (padding-top) */
    }
  
    .lists-container {
      width: calc(100% - 280px); /* 240px (Sidebar) + 20px (marge gauche) + 20px (marge droite) */
      margin-left: 260px;
      margin-right: 20px;
    }
  
    .dashboard-footer {
      width: calc(100% - 240px);
      margin-left: 240px;
      padding: 18px;
      font-size: 13px;
    }
  }
  
  @media (max-width: 768px) {
    .main-content {
      margin-left: 200px;
      margin-top: 65px; /* 50px (hauteur de base) + 15px (padding-top) */
    }
  
    .lists-container {
      grid-template-columns: 1fr; /* Passe à 1 colonne */
      width: calc(100% - 240px); /* 200px (Sidebar) + 20px (marge gauche) + 20px (marge droite) */
      margin-left: 220px;
      margin-right: 20px;
    }
  
    .dashboard-footer {
      width: calc(100% - 200px);
      margin-left: 200px;
      padding: 15px;
      font-size: 12px;
    }
  }
  
  @media (max-width: 480px) {
    .main-content {
      margin-left: 180px;
      margin-top: 55px; /* 45px (hauteur de base) + 10px (padding-top) */
    }
  
    .lists-container {
      width: calc(100% - 220px); /* 180px (Sidebar) + 20px (marge gauche) + 20px (marge droite) */
      margin-left: 200px;
      margin-right: 20px;
    }
  
    .dashboard-footer {
      width: calc(100% - 180px);
      margin-left: 180px;
      padding: 10px;
      font-size: 10px;
    }
  }
.dashboard-wrapper {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background: #ffffff;
    /* Espacement réduit entre header et contenu */
    padding-top: 20px;
}
 
.dashboard-content {
    margin-top: -10px; /* Ajustement fin pour rapprocher du header */
}
 
/* Réduire la marge du premier composant - seulement les marges externes */
.dashboard-wrapper > *:first-child:not(header) {
    margin-top: 0 !important;
    /* Préserver le padding interne des composants */
}
 
/* Cibler spécifiquement le WelcomeCard - seulement les marges externes */
.dashboard-wrapper .welcome-card,
.dashboard-wrapper > div:first-of-type:not(header) {
    margin-top: 0 !important;
    /* Ne pas toucher au padding interne du WelcomeCard */
}
 
/* Éliminer toute marge par défaut sur les premiers éléments */
.dashboard-wrapper > *:nth-child(2) {
    margin-top: 0 !important;
    /* Ne pas toucher au padding interne */
}
 
/* Cibler le premier enfant du dashboard-content (WelcomeCard) - seulement margin */
.dashboard-content > *:first-child {
    margin-top: 0 !important;
    /* Préserver le padding interne du WelcomeCard */
}
 
.main-content {
    margin-top: 0;
    margin-left: 260px;
    padding: 20px;
    flex: 1 1;
    box-sizing: border-box;
}
 
.lists-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 20px;
    gap: 20px;
    width: calc(100% - 300px);
    margin-left: 280px;
    margin-right: 20px;
    margin-top: 20px;
    margin-bottom: 80px;
}
 
.dashboard-footer {
    width: calc(100% - 260px);
    margin-left: 260px;
    padding: 20px;
    background: #FFFFFF;
    text-align: center;
    font-family: 'Poppins', sans-serif;
    color: #656565;
    font-size: 14px;
}
 
/* Responsive */
@media (min-width: 1200px) {
    .dashboard-wrapper {
        padding-top: 30px; /* Réduit pour grands écrans */
    }
   
    .dashboard-content {
        margin-top: -15px; /* Ajustement proportionnel */
    }
   
    .main-content {
        margin-left: 280px;
        margin-top: 0;
    }
 
    .lists-container {
        width: calc(100% - 320px);
        margin-left: 300px;
        margin-right: 20px;
    }
 
    .dashboard-footer {
        width: calc(100% - 280px);
        margin-left: 280px;
        padding: 25px;
        font-size: 16px;
    }
}
 
@media (max-width: 1024px) {
    .dashboard-wrapper {
        padding-top: 25px; /* Réduit */
    }
   
    .dashboard-content {
        margin-top: -12px; /* Ajustement proportionnel */
    }
   
    .main-content {
        margin-left: 240px;
        margin-top: 0;
    }
 
    .lists-container {
        width: calc(100% - 280px);
        margin-left: 260px;
        margin-right: 20px;
    }
 
    .dashboard-footer {
        width: calc(100% - 240px);
        margin-left: 240px;
        padding: 18px;
        font-size: 13px;
    }
}
 
@media (max-width: 768px) {
    .dashboard-wrapper {
        padding-top: 20px; /* Réduit */
    }
   
    .dashboard-content {
        margin-top: -10px; /* Ajustement proportionnel */
    }
   
    .main-content {
        margin-left: 200px;
        margin-top: 0;
    }
 
    .lists-container {
        grid-template-columns: 1fr;
        width: calc(100% - 240px);
        margin-left: 220px;
        margin-right: 20px;
    }
 
    .dashboard-footer {
        width: calc(100% - 200px);
        margin-left: 200px;
        padding: 15px;
        font-size: 12px;
    }
}
 
@media (max-width: 480px) {
    .dashboard-wrapper {
        padding-top: 10px; /* Réduit pour très petits écrans */
    }
   
    .dashboard-content {
        margin-top: -5px; /* Ajustement minimal */
    }
   
    .main-content {
        margin-left: 180px;
        margin-top: 0;
    }
 
    .lists-container {
        width: calc(100% - 220px);
        margin-left: 200px;
        margin-right: 20px;
    }
 
    .dashboard-footer {
        width: calc(100% - 180px);
        margin-left: 180px;
        padding: 10px;
        font-size: 10px;
    }
}
.pagination-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  margin: 2rem auto;
  padding: 0.5rem 1rem;
  width: 100%;
  max-width: 60%;
  overflow: hidden; /* ensures scroll area stays inside */
}

.pagination-scroll {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: auto;
  padding: 0 0.5rem;
  justify-content: center;
}

.pagination-scroll::-webkit-scrollbar {
  height: 0px;
}

.pagination-nav-btn,
.pagination-num-btn {
  flex-shrink: 0;
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e0e0e0;
  background: white;
  border-radius: 0.5rem;
  cursor: pointer;
  transition: all 0.2s ease;
  font-weight: 500;
}

.pagination-nav-btn {
  position: -webkit-sticky;
  position: sticky;
  left: 0;
  z-index: 2;
  background-color: #fff;
}

.pagination-nav-btn:last-of-type {
  right: 0;
  left: auto;
}

.pagination-nav-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.pagination-nav-btn:not(:disabled):hover,
.pagination-num-btn:hover:not(.active) {
  background: #f3f4f6;
  border-color: #0f447e;
}

.pagination-num-btn.active {
  background: #0f447e;
  color: white;
  border-color: #0f447e;
}

@media (max-width: 768px) {
  .pagination-wrapper {
    gap: 0.4rem;
    padding: 0.4rem 0.6rem;
    max-width: 95%;
  }

  .pagination-nav-btn,
  .pagination-num-btn {
    width: 2.2rem;
    height: 2.2rem;
    font-size: 0.9rem;
  }
}

@media (max-width: 480px) {
  .pagination-wrapper {
    gap: 0.3rem;
    padding: 0.3rem 0.4rem;
    max-width: 100%;
  }

  .pagination-nav-btn,
  .pagination-num-btn {
    width: 2rem;
    height: 2rem;
    font-size: 0.85rem;
  }
}

.client-favoris-containerFAV {
  max-width: 1920px;
  margin: 0 auto;
  padding: 2rem 1.5rem;
  font-family: 'Poppins', sans-serif;
}

.category-tabsFAV {
  display: flex;
  margin-bottom: 2rem;
  border-bottom: 1px solid #e5e7eb;
}

.category-tabFAV {
  padding: 1rem 1.5rem;
  font-size: 1.1rem;
  font-weight: 500;
  background: transparent;
  border: none;
  color: #6b7280;
  cursor: pointer;
  position: relative;
  transition: color 0.2s ease;
}

.category-tabFAV.active {
  color: #0f447e;
  font-weight: 600;
}

.category-tabFAV.active::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  height: 2px;
  background-color: #0f447e;
}

.category-tabFAV:hover {
  color: #0d3a6b;
}

.countFAV {
  font-size: 0.9rem;
  font-weight: 500;
  margin-left: 0.5rem;
  color: #656565;
}

.favoris-sectionFAV {
  margin-bottom: 3rem;
}

.favoris-gridFAV {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 1rem;
  gap: 1rem;
  justify-items: center;
  margin-bottom: 2rem;
  justify-items: center;
  align-items: stretch;
}

.favoris-cardFAV {
  flex: 0 0 300px; /* Largeur fixe pour chaque carte */
  max-width: 300px; /* Limite la largeur */
  border: 1px solid #e0e0e0;
  border-radius: 0.8rem;
  overflow: hidden;
  background: white;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
}

.favoris-cardFAV:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

.favoris-image-containerFAV {
  position: relative;
  height: 200px;
  width: 100%;
}

.favoris-imageFAV {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.favorite-btnFAV {
  position: absolute;
  top: 0.8rem;
  right: 0.8rem;
  background: white;
  border: none;
  border-radius: 50%;
  width: 2.2rem;
  height: 2.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transition: all 0.2s ease;
}

.favorite-btnFAV:hover {
  transform: scale(1.1);
  background: #f8f8f8;
}

.favorite-btnFAV.active {
  background: #fff0f0;
}

.favoris-detailsFAV {
  padding: 1.5rem;
}

.favoris-nameFAV {
  font-size: 1.2rem;
  font-weight: 600;
  margin-bottom: 0.5rem;
  color: #111827;
}

.favoris-infoFAV {
  display: flex;
  align-items: center;
  color: #6b7280;
  font-size: 0.9rem;
  margin-bottom: 1rem;
  gap: 0.3rem;
}

.favoris-locationFAV {
  color: #6b7280;
  font-size: 0.9rem;
  margin-bottom: 1rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.iconFAV {
  color: #0f447e;
  flex-shrink: 0;
}

.favoris-priceFAV {
  font-weight: 700;
  color: #0f447e;
  margin: 1rem 0;
  font-size: 1.1rem;
}

.favoris-amenitiesFAV {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-bottom: 1rem;
  overflow-x: auto;
  padding-bottom: 0.5rem;
}

.hotel-amenityFAV {
  background: #f3f4f6;
  padding: 0.5rem 0.8rem;
  border-radius: 1rem;
  font-size: 0.85rem;
  color: #4b5563;
  display: flex;
  align-items: center;
  gap: 0.3rem;
  border: 1px solid #e0e0e0;
}

.hotel-amenityFAV .amenity-iconFAV {
  color: #0f447e;
}

.appartement-amenityFAV {
  background: #f3f4f6;
  padding: 0.5rem 0.8rem;
  border-radius: 1rem;
  font-size: 0.85rem;
  color: #4b5563;
  border: 1px solid #e0e0e0;
}

.visit-btnFAV {
  width: 100%;
  background: #0f447e;
  color: white;
  border: none;
  padding: 0.8rem;
  border-radius: 0.5rem;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s ease;
  font-size: 0.95rem;
}

.visit-btnFAV:hover {
  background: #0d3a6b;
}

.no-favorisFAV {
  text-align: center;
  padding: 3rem 1rem;
  margin: 2rem auto;
  max-width: 500px;
  background: #f8f9fa;
  border-radius: 0.8rem;
  border: 1px dashed #a3a9ae;
}

.no-favoris-iconFAV {
  color: #ef4444;
  opacity: 0.5;
  margin-bottom: 1rem;
}

.no-favorisFAV h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: #111827;
  margin-bottom: 0.5rem;
}

.no-favorisFAV p {
  color: #6b7280;
  margin-bottom: 1.5rem;
}

.browse-btnFAV {
  background: #0f447e;
  color: white;
  border: none;
  padding: 0.8rem 1.5rem;
  border-radius: 0.5rem;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s ease;
  font-size: 0.95rem;
}

.browse-btnFAV:hover {
  background: #0d3a6b;
}

@media (max-width: 1120px) {
  .favoris-gridFAV {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .client-favoris-containerFAV {
    padding: 1.5rem 1rem;
  }

  .category-tabsFAV {
    justify-content: center;
  }

  .category-tabFAV {
    padding: 0.8rem 1rem;
    font-size: 1rem;
  }

  .favoris-cardFAV {
    flex: 0 0 auto; /* Ajuster pour la disposition verticale */
    max-width: 350px; /* Légèrement plus large sur mobile */
    width: 100%; /* S'assurer que la carte prend toute la largeur disponible */
  }

  .favoris-amenitiesFAV {
    /* display: flex; */
    flex-wrap: wrap;
    overflow-x: visible;
    padding-bottom: 0;
    margin-bottom: 1rem;
  }
  .amenity-tagFAV {
    font-size: 0.8rem;
    white-space: normal; /* Permettre le retour à la ligne dans le texte si nécessaire */
    flex-shrink: 1; /* Laisser les éléments s’adapter */
  }

  .favoris-amenitiesFAV::-webkit-scrollbar {
    display: none;
  }
}

@media (max-width: 640px) {
  .favoris-gridFAV {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .category-tabFAV {
    padding: 0.6rem 0.8rem;
    font-size: 0.9rem;
  }

  .favoris-nameFAV {
    font-size: 1.1rem;
  }

  .favoris-locationFAV {
    font-size: 0.85rem;
  }

  .favoris-amenitiesFAV {
    display: flex;
    flex-wrap: wrap;
    overflow-x: visible;
    flex-wrap: wrap;
    overflow-x: visible;
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .favoris-amenitiesFAV::-webkit-scrollbar {
    display: none;
  }

  .amenity-tagFAV {
    font-size: 0.8rem;
    white-space: nowrap;
    flex-shrink: 0;
  }

  .visit-btnFAV {
    font-size: 0.9rem;
    padding: 0.7rem;
  }
}

.dashboard-wrapper {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background: #ffffff;
    /* Espacement réduit entre header et contenu */
    padding-top: 20px;
}
 
.dashboard-content {
    margin-top: -10px; /* Ajustement fin pour rapprocher du header */
}
 
/* Réduire la marge du premier composant - seulement les marges externes */
.dashboard-wrapper > *:first-child:not(header) {
    margin-top: 0 !important;
    /* Préserver le padding interne des composants */
}
 
/* Cibler spécifiquement le WelcomeCard - seulement les marges externes */
.dashboard-wrapper .welcome-card,
.dashboard-wrapper > div:first-of-type:not(header) {
    margin-top: 0 !important;
    /* Ne pas toucher au padding interne du WelcomeCard */
}
 
/* Éliminer toute marge par défaut sur les premiers éléments */
.dashboard-wrapper > *:nth-child(2) {
    margin-top: 0 !important;
    /* Ne pas toucher au padding interne */
}
 
/* Cibler le premier enfant du dashboard-content (WelcomeCard) - seulement margin */
.dashboard-content > *:first-child {
    margin-top: 0 !important;
    /* Préserver le padding interne du WelcomeCard */
}

/* AJOUT : Supprimer les marges latérales pour PartenairesSection et FooterNew */
.dashboard-content > :nth-last-child(2), /* PartenairesSection (avant-dernier) */
.dashboard-content > :last-child {       /* FooterNew (dernier) */
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
}

/* Alternative : Cibler directement par nom de composant si nécessaire */
.dashboard-wrapper [class*="partenaires"],
.dashboard-wrapper [class*="footer"] {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
}
 
.main-content {
    margin-top: 0;
    margin-left: 260px;
    padding: 20px;
    flex: 1 1;
    box-sizing: border-box;
}
 
.lists-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 20px;
    gap: 20px;
    width: calc(100% - 300px);
    margin-left: 280px;
    margin-right: 20px;
    margin-top: 20px;
    margin-bottom: 80px;
}
 
.dashboard-footer {
    width: calc(100% - 260px);
    margin-left: 260px;
    padding: 20px;
    background: #FFFFFF;
    text-align: center;
    font-family: 'Poppins', sans-serif;
    color: #656565;
    font-size: 14px;
}
 
/* Responsive */
@media (min-width: 1200px) {
    .dashboard-wrapper {
        padding-top: 30px; /* Réduit pour grands écrans */
    }
   
    .dashboard-content {
        margin-top: -15px; /* Ajustement proportionnel */
    }
   
    .main-content {
        margin-left: 280px;
        margin-top: 0;
    }
 
    .lists-container {
        width: calc(100% - 320px);
        margin-left: 300px;
        margin-right: 20px;
    }
 
    .dashboard-footer {
        width: calc(100% - 280px);
        margin-left: 280px;
        padding: 25px;
        font-size: 16px;
    }
}
 
@media (max-width: 1024px) {
    .dashboard-wrapper {
        padding-top: 25px; /* Réduit */
    }
   
    .dashboard-content {
        margin-top: -12px; /* Ajustement proportionnel */
    }
   
    .main-content {
        margin-left: 240px;
        margin-top: 0;
    }
 
    .lists-container {
        width: calc(100% - 280px);
        margin-left: 260px;
        margin-right: 20px;
    }
 
    .dashboard-footer {
        width: calc(100% - 240px);
        margin-left: 240px;
        padding: 18px;
        font-size: 13px;
    }
}
 
@media (max-width: 768px) {
    .dashboard-wrapper {
        padding-top: 20px; /* Réduit */
    }
   
    .dashboard-content {
        margin-top: -10px; /* Ajustement proportionnel */
    }
   
    .main-content {
        margin-left: 200px;
        margin-top: 0;
    }
 
    .lists-container {
        grid-template-columns: 1fr;
        width: calc(100% - 240px);
        margin-left: 220px;
        margin-right: 20px;
    }
 
    .dashboard-footer {
        width: calc(100% - 200px);
        margin-left: 200px;
        padding: 15px;
        font-size: 12px;
    }
}
 
@media (max-width: 480px) {
    .dashboard-wrapper {
        padding-top: 10px; /* Réduit pour très petits écrans */
    }
   
    .dashboard-content {
        margin-top: -5px; /* Ajustement minimal */
    }
   
    .main-content {
        margin-left: 180px;
        margin-top: 0;
    }
 
    .lists-container {
        width: calc(100% - 220px);
        margin-left: 200px;
        margin-right: 20px;
    }
 
    .dashboard-footer {
        width: calc(100% - 180px);
        margin-left: 180px;
        padding: 10px;
        font-size: 10px;
    }
}
/* Variables CSS */
:root {
  --primary-blue: #0c447e;
  --light-blue: #e6f0fa;
  --success-green: #10b981;
  --success-bg: #d1fae5;
  --text-primary: #1f2937;
  --text-secondary: #6b7280;
  --text-light: #9ca3af;
  --white: #ffffff;
  --shadow-light: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  --shadow-medium: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --shadow-large: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  --border-radius: 12px;
  --border-radius-small: 8px;
  --border-radius-large: 16px;
  --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.profile-card-wrapper-ClientProfil {
  display: flex;
  flex-direction: column;
  min-height: auto;
  padding: 2rem;
  box-sizing: border-box;
  width: 100%;
  margin: 0 auto;
  background: #ffffff;
  background: var(--white);
  border-radius: 12px;
  border-radius: var(--border-radius);
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--shadow-medium);
}

/* Header au-dessus de la carte */
.client-header {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 2rem;
  padding: 0;
}

.retour-btn {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  background: transparent;
  border: none;
  color: #0c447e;
  color: var(--primary-blue);
  font-family: 'Inter', 'Poppins', sans-serif;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  transition: var(--transition);
  padding: 0.5rem;
}

.retour-btn:hover {
  color: #0c447e;
  color: var(--primary-blue);
  transform: translateX(-3px);
}

.retour-icon {
  font-size: 1.25rem;
  font-weight: bold;
}

.details-title {
  font-family: 'Inter', 'Poppins', sans-serif;
  font-size: 1.75rem;
  font-weight: 600;
  margin: 0;
  line-height: 1.2;
}

.details-text {
  color: #0c447e;
  color: var(--primary-blue);
}

.clients-text {
  color: #e63946;
}

.profile-card-container-PartenaireProfil {
  width: 100%;
  background: #ffffff;
  background: var(--white);
  border-radius: 12px;
  padding: 2.5rem;
  position: relative;
  /* box-shadow: var(--shadow-medium); */
}

.edit-profile-link-PartenaireProfil {
  position: absolute;
  top: 2rem;
  right: 2rem;
  font-family: 'Inter', 'Poppins', '-apple-system', 'BlinkMacSystemFont', sans-serif;
  font-size: 0.875rem;
  font-weight: 500;
  color: #ffffff;
  color: var(--white);
  background: #0c447e;
  background: var(--primary-blue);
  padding: 0.75rem 1.5rem;
  border-radius: 10px;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  transition: var(--transition);
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.edit-profile-link-PartenaireProfil:hover {
  background: #0a3661;
  transform: translateY(-1px);
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--shadow-medium);
}

.profile-card-content-PartenaireProfil {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-gap: 3rem;
  gap: 3rem;
  align-items: start;
  margin-top: 1rem;
}

.profile-icon-wrapper-PartenaireProfil {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 12rem;
  height: 14rem;
  background: linear-gradient(145deg, #f8f9fa 0%, #ffffff 100%);
  border-radius: 16px;
  border-radius: var(--border-radius-large);
  border: 2px solid rgba(12, 68, 126, 0.1);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  transition: var(--transition);
  position: relative;
  overflow: hidden;
}

.profile-icon-wrapper-PartenaireProfil::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(45deg, transparent 30%, rgba(255, 255, 255, 0.1) 50%, transparent 70%);
  transform: translateX(-100%);
  transition: transform 0.6s;
}

.profile-icon-wrapper-PartenaireProfil:hover::before {
  transform: translateX(100%);
}

.profile-icon-PartenaireProfil {
  font-size: 5rem;
  color: #0c447e;
  color: var(--primary-blue);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  transition: var(--transition);
  z-index: 1;
}

.profile-icon-wrapper-PartenaireProfil:hover .profile-icon-PartenaireProfil {
  transform: scale(1.05);
}

.profile-info-PartenaireProfil {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  min-width: 0;
  padding-top: 0.5rem;
}

.info-item-PartenaireProfil {
  display: grid;
  grid-template-columns: 200px 1fr;
  grid-gap: 2rem;
  gap: 2rem;
  align-items: center;
}

.info-label-PartenaireProfil {
  font-family: 'Inter', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 1rem;
  font-weight: 500;
  color: #6b7280;
  color: var(--text-secondary);
  letter-spacing: -0.01em;
}

.info-value-PartenaireProfil {
  font-family: 'Inter', 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 1.05rem;
  font-weight: 600;
  color: #1f2937;
  color: var(--text-primary);
  letter-spacing: -0.01em;
  word-break: break-word;
}

.status-active-PartenaireProfil {
  background: #d1fae5;
  background: var(--success-bg);
  color: #10b981;
  color: var(--success-green);
  padding: 0.375rem 0.75rem;
  border-radius: 9999px;
  font-size: 0.875rem;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  border: 1px solid rgba(16, 185, 129, 0.2);
}

.status-active-PartenaireProfil::before {
  content: '';
  width: 0.375rem;
  height: 0.375rem;
  background: #10b981;
  background: var(--success-green);
  border-radius: 50%;
  animation: pulse 2s infinite;
}

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

/* Tablettes larges (≤1024px) */
@media (max-width: 1024px) {
  .profile-card-wrapper-ClientProfil {
    padding: 1.5rem;
  }

  .profile-card-container-PartenaireProfil {
    padding: 2rem;
  }

  .profile-card-content-PartenaireProfil {
    gap: 2rem;
  }

  .profile-icon-wrapper-PartenaireProfil {
    width: 10rem;
    height: 12rem;
  }

  .profile-icon-PartenaireProfil {
    font-size: 4rem;
  }

  .info-item-PartenaireProfil {
    grid-template-columns: 180px 1fr;
    gap: 1.5rem;
  }
}

/* Tablettes (≤768px) */
@media (max-width: 768px) {
  .profile-card-wrapper-ClientProfil {
    padding: 1rem;
  }

  .client-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1.5rem;
  }

  .details-title {
    font-size: 1.5rem;
  }

  .profile-card-container-PartenaireProfil {
    padding: 1.5rem;
  }

  .profile-card-content-PartenaireProfil {
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 2rem;
  }

  .profile-icon-wrapper-PartenaireProfil {
    width: 8rem;
    height: 10rem;
    margin: 0 auto;
  }

  .profile-icon-PartenaireProfil {
    font-size: 3.5rem;
  }

  .profile-info-PartenaireProfil {
    width: 100%;
    gap: 1rem;
  }

  .info-item-PartenaireProfil {
    grid-template-columns: auto 1fr;
    gap: 1rem;
    text-align: left;
    padding: 1rem;
    background: rgba(12, 68, 126, 0.02);
    border-radius: 12px;
    border-radius: var(--border-radius);
    border: 1px solid rgba(12, 68, 126, 0.05);
  }

  .edit-profile-link-PartenaireProfil {
    position: static;
    margin: 0 auto 1.5rem auto;
    display: inline-flex;
  }
}

/* Mobiles (≤640px) */
@media (max-width: 640px) {
  .profile-card-wrapper-ClientProfil {
    padding: 0.75rem;
  }

  .profile-card-container-PartenaireProfil {
    padding: 1.25rem;
  }

  .profile-icon-wrapper-PartenaireProfil {
    display: none;
  }

  .info-item-PartenaireProfil {
    padding: 0.875rem;
  }

  .info-label-PartenaireProfil {
    font-size: 0.875rem;
  }

  .info-value-PartenaireProfil {
    font-size: 0.95rem;
  }
}

/* Focus visible pour l'accessibilité */
.edit-profile-link-PartenaireProfil:focus-visible,
.retour-btn:focus-visible {
  outline: 2px solid #0c447e;
  outline: 2px solid var(--primary-blue);
  outline-offset: 2px;
}
.dashboard-wrapper {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background: #ffffff;
}

.dashboard-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 0 20px;
    box-sizing: border-box;
}

.main-content {
    margin-top: 90px;
    margin-left: 260px;
    padding: 20px;
    flex: 1 1;
    box-sizing: border-box;
}

.lists-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 20px;
    gap: 20px;
    width: calc(100% - 300px);
    margin-left: 280px;
    margin-right: 20px;
    margin-top: 20px;
    margin-bottom: 80px;
}

.dashboard-footer {
    width: calc(100% - 260px);
    margin-left: 260px;
    padding: 20px;
    background: #FFFFFF;
    text-align: center;
    font-family: 'Poppins', sans-serif;
    color: #656565;
    font-size: 14px;
}

/* Responsive */
@media (min-width: 1200px) {
    .dashboard-content {
        padding: 0 40px; /* Plus d'espace sur les grands écrans */
    }

    .main-content {
        margin-left: 280px;
        margin-top: 90px;
    }

    .lists-container {
        width: calc(100% - 320px);
        margin-left: 300px;
        margin-right: 20px;
    }

    .dashboard-footer {
        width: calc(100% - 280px);
        margin-left: 280px;
        padding: 25px;
        font-size: 16px;
    }
}

@media (max-width: 1024px) {
    .dashboard-content {
        padding: 0 30px;
    }

    .main-content {
        margin-left: 240px;
        margin-top: 90px;
    }

    .lists-container {
        width: calc(100% - 280px);
        margin-left: 260px;
        margin-right: 20px;
    }

    .dashboard-footer {
        width: calc(100% - 240px);
        margin-left: 240px;
        padding: 18px;
        font-size: 13px;
    }
}

@media (max-width: 768px) {
    .dashboard-content {
        padding: 0 20px;
    }

    .main-content {
        margin-left: 200px;
        margin-top: 65px;
    }

    .lists-container {
        grid-template-columns: 1fr;
        width: calc(100% - 240px);
        margin-left: 220px;
        margin-right: 20px;
    }

    .dashboard-footer {
        width: calc(100% - 200px);
        margin-left: 200px;
        padding: 15px;
        font-size: 12px;
    }
}

@media (max-width: 480px) {
    .dashboard-content {
        padding: 0 15px;
    }

    .main-content {
        margin-left: 180px;
        margin-top: 55px;
    }

    .lists-container {
        width: calc(100% - 220px);
        margin-left: 200px;
        margin-right: 20px;
    }

    .dashboard-footer {
        width: calc(100% - 180px);
        margin-left: 180px;
        padding: 10px;
        font-size: 10px;
    }
}


/* ====================== */
/*  Variables CSS */
/* ====================== */
:root {
  --primary-color: #0c447e;
  --bg-white: #ffffff;
  --bg-light: #f9f9f9;
  --text-dark: #333;
  --text-medium: #5a6474;
  --text-light: #3c4043;
  --success-bg: #e6f4ea;
  --success-text: #137333;
  --neutral-bg: #e8eaed;
  --border-light: #eaeaea;
  --error-color: #ef4444;
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 2px 4px rgba(0, 0, 0, 0.1);
  --radius-sm: 4px;
  --radius-md: 8px;
  --transition-fast: 0.3s;
}

/* ====================== */
/*  Container principal */
/* ====================== */
.receipt-card-container {
  width: 100%;
  max-width: 1920px;
  margin: 20px auto;
  padding: 20px;
  background: #ffffff;
  background: var(--bg-white);
  border: 1px solid #0c447e;
  border: 1px solid var(--primary-color);
  border-radius: 8px;
  border-radius: var(--radius-md);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: var(--shadow-md);
  box-sizing: border-box;
  font-family: 'Poppins', sans-serif;
  transition: border-width 0.3s;
  transition: border-width var(--transition-fast);
}

/* ====================== */
/*  En-tête principal */
/* ====================== */
.receipt-card-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-bottom: 10px;
  margin-bottom: 15px;
  border-bottom: 1px solid #0c447e;
  border-bottom: 1px solid var(--primary-color);
}

.receipt-icon {
  flex-shrink: 0;
  font-size: 20px;
  color: #0c447e;
  color: var(--primary-color);
  margin-right: 10px;
}

.receipt-card-header h2 {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
  color: #0c447e;
  color: var(--primary-color);
  font-family: inherit;
}

/* ====================== */
/* Contenu avec scroll */
/* ====================== */
.receipt-card-content {
  padding: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #0c447e #f0f0f0;
  scrollbar-color: var(--primary-color) #f0f0f0;
}

.receipt-card-content::-webkit-scrollbar {
  height: 6px;
}

.receipt-card-content::-webkit-scrollbar-track {
  background: #f0f0f0;
  border-radius: 3px;
}

.receipt-card-content::-webkit-scrollbar-thumb {
  background: #0c447e;
  background: var(--primary-color);
  border-radius: 3px;
}

/* ====================== */
/*  Item de reçu */
/* ====================== */
.receipt-item {
  padding: 16px;
  border-bottom: 1px solid #eaeaea;
  margin: 0 0 15px 0;
  border-radius: 8px;
  background-color: #f9f9f9;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
  position: relative;
  width: 100%;
  box-sizing: border-box;
}

/* ====================== */
/*  En-tête du reçu */
/* ====================== */
.receipt-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.receipt-title {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  color: #0c447e;
  color: var(--primary-color);
}

/* ====================== */
/*  Détails en grille */
/* ====================== */
.receipt-details {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 10px;
  gap: 10px;
}

.receipt-detail {
  display: flex;
  flex-direction: column;
}

.receipt-label {
  font-size: clamp(12px, 3vw, 13px);
  font-weight: 500;
  color: #5a6474;
  overflow-wrap: break-word;
}

.receipt-value {
  font-size: 14px;
  font-weight: 500;
  color: #333;
  color: var(--text-dark);
}

.receipt-price {
  color: #0c447e;
  color: var(--primary-color);
}

/* ====================== */
/*  Footer avec actions */
/* ====================== */
.receipt-footer {
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid #eaeaea;
  border-top: 1px solid var(--border-light);
  display: flex;
  justify-content: flex-end;
}

/* ====================== */
/*  Boutons d'action */
/* ====================== */
.receipt-actions {
  display: flex;
  gap: 10px;
}

.receipt-action-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 6px 12px;
  border: none;
  border-radius: 4px;
  border-radius: var(--radius-sm);
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
}



.view-btn {
  background: #0c447e;
  background: var(--primary-color);
  color: #e8eaed;
  color: var(--neutral-bg);
}



.download-btn {
  background: #0c447e;
  background: var(--primary-color);
  color: #e8eaed;
  color: var(--neutral-bg);
}


/* ====================== */
/*  États spéciaux */
/* ====================== */
.receipt-empty,
.receipt-loading {
  padding: 40px 20px;
  text-align: center;
  color: #5a6474;
  color: var(--text-medium);
}

.receipt-error {
  padding: 20px;
  text-align: center;
  color: #ef4444;
  color: var(--error-color);
}

/* ====================== */
/*  Séparateur */
/* ====================== */
.receipt-divider {
  height: 0;
  margin: 10px 0;
  border: 0;
  border-top: 1px solid #eaeaea;
  border-top: 1px solid var(--border-light);
}

/* ====================== */
/*  Media Queries */
/* ====================== */

/* 🖥 Grands écrans (≥1200px) */
@media (min-width: 1200px) {
  .receipt-card-container {
    padding: 25px;
  }

  .receipt-icon {
    font-size: 24px;
  }

  .receipt-card-header h2 {
    font-size: 22px;
  }

  .receipt-title {
    font-size: 18px;
  }

  .receipt-label {
    font-size: 14px;
  }

  .receipt-value {
    font-size: 16px;
  }
}

/*  Tablettes (≤1024px) */
@media (max-width: 1024px) {
  .receipt-card-container {
    margin: 10px 30px;
    width: calc(100% - 60px);
    padding: 15px;
  }

  .receipt-icon {
    font-size: 20px;
  }

  .receipt-card-header h2 {
    font-size: 18px;
  }

  .receipt-item {
    padding: 12px 15px;
    margin: 8px 10px 15px;
  }

  .receipt-title {
    font-size: 14px;
  }

  .receipt-label {
    font-size: 11px;
  }

  .receipt-value {
    font-size: 13px;
  }

  .receipt-details {
    grid-template-columns: repeat(2, 1fr);
  }
}

/*  Petites tablettes (≤768px) */
@media (max-width: 768px) {
  .receipt-card-container {
    margin: 5px 25px;
    width: calc(100% - 50px);
    padding: 15px;
  }

  .receipt-icon {
    font-size: 18px;
  }

  .receipt-card-header h2 {
    font-size: 16px;
  }

  .receipt-item {
    padding: 10px;
    margin: 6px 8px 15px;
  }

  .receipt-details {
    grid-template-columns: 1fr;
  }
}

/*  Mobiles (≤480px) */
@media (max-width: 480px) {
  .receipt-card-container {
    margin: 10px 25px;
    width: calc(100% - 50px);
    padding: 10px;
  }

  .receipt-icon {
    font-size: 16px;
    margin-right: 8px;
  }

  .receipt-card-header h2 {
    font-size: 14px;
  }

  .receipt-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .receipt-details {
    grid-template-columns: 1fr;
  }

  .receipt-detail {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }

  .receipt-label {
    flex: 0 0 auto;
  }

  .receipt-value {
    text-align: right;
  }

  .receipt-footer {
    justify-content: stretch;
  }

  .receipt-actions {
    width: 100%;
    flex-direction: column;
    gap: 8px;
  }

  .receipt-action-btn {
    width: 100%;
    justify-content: center;
  }

  .receipt-item {
    padding: 10px;
    margin: 6px 8px 15px;
  }

  .receipt-empty,
  .receipt-loading,
  .receipt-error {
    padding: 30px 15px;
    font-size: 14px;
  }
}

/*  Très petits écrans (≤360px) */
@media (max-width: 360px) {
  .receipt-card-container {
    margin: 5px 20px;
    width: calc(100% - 40px);
    padding: 8px;
  }

  .receipt-icon {
    font-size: 14px;
    margin-right: 6px;
  }

  .receipt-card-header h2 {
    font-size: 13px;
  }

  .receipt-item {
    padding: 8px;
    margin: 4px 6px 15px;
  }
}
.PropertyCardPopup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}
.PropertyCardPopup-container {
  position: relative;
  width: 90%;
  max-width: 500px;
  max-height: 90vh;
  z-index: 10000;
}

.PropertyCardPopup {
  background-color: #fff;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial,
    sans-serif;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  position: relative;
}
.PropertyCardPopup-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.PropertyCardPopup-header h2 {
  font-size: 20px;
  font-weight: 600;
  color: #0c447e;
  margin: 0;
}
.PropertyCardPopup-close-button {
  background: none;
  border: none;
  cursor: pointer;
  color: #ffffff;
  background-color: #e30613;
  padding: 6px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.2s;
}

.PropertyCardPopup-close-button:hover {
  background-color: #0c447e;
}

.PropertyCardPopup-content {
  margin-bottom: 20px;
}

.PropertyCardPopup-section {
  margin-bottom: 20px;
  position: relative;
}

.PropertyCardPopup-section-title {
  font-size: 14px;
  color: #4a5568;
  margin-bottom: 8px;
  font-weight: 500;
}

.PropertyCardPopup-input-display {
  display: flex;
  align-items: center;
  padding: 12px 16px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  cursor: pointer;
  transition: border-color 0.2s;
  background-color: #fff;
  width: 100%;
  box-sizing: border-box;
}

.PropertyCardPopup-input-display:hover {
  border-color: #0c447e;
}

.PropertyCardPopup-icon {
  color: #4a5568;
  margin-right: 12px;
  flex-shrink: 0;
}

.PropertyCardPopup-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background-color: white;
  border-radius: 8px;
  padding: 16px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  z-index: 100;
  margin-top: 8px;
}

.PropertyCardPopup-calendar-container {
  margin-bottom: 16px;
}

.PropertyCardPopup-calendar-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.PropertyCardPopup-month-year {
  font-weight: 500;
  color: #2d3748;
}

.PropertyCardPopup-month-nav {
  background: none;
  border: none;
  cursor: pointer;
  color: #4a5568;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: background-color 0.2s;
}

.PropertyCardPopup-month-nav:hover {
  background-color: #edf2f7;
}

.PropertyCardPopup-weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  margin-bottom: 8px;
  text-align: center;
  font-size: 12px;
  color: #718096;
}

.PropertyCardPopup-days-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  grid-gap: 4px;
  gap: 4px;
}
.PropertyCardPopup-calendar-day {
  height: 36px;
  width: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  color: #2d3748;
  cursor: pointer;
  border-radius: 50%;
  margin: 0 auto;
  transition: all 0.2s;
}

.PropertyCardPopup-calendar-day:hover:not(.PropertyCardPopup-empty):not(
    .PropertyCardPopup-past-date
  ) {
  background-color: #edf2f7;
}

.PropertyCardPopup-calendar-day.PropertyCardPopup-empty {
  cursor: default;
}

.PropertyCardPopup-calendar-day.PropertyCardPopup-today {
  font-weight: 600;
  color: #0c447e;
}

.PropertyCardPopup-calendar-day.PropertyCardPopup-selected {
  background-color: #0c447e;
  color: white;
}

.PropertyCardPopup-calendar-day.PropertyCardPopup-in-range {
  background-color: #ebf8ff;
  color: #0c447e;
}

.PropertyCardPopup-calendar-day.PropertyCardPopup-past-date {
  color: #cbd5e0;
  cursor: not-allowed;
}

.PropertyCardPopup-unavailable {
  border: 1px solid #2c5282;
  color: #2c5282;
  position: relative;
  text-decoration: none;
  cursor: not-allowed;
}

.PropertyCardPopup-invalid-checkout-date {
  opacity: 0.6;
  cursor: not-allowed;
  text-decoration: line-through;
}

.PropertyCardPopup-unavailable::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background-color: #2c5282;
  transform: rotate(-45deg);
}

.PropertyCardPopup-unavailable::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background-color: #2c5282;
  transform: rotate(45deg);
}

.PropertyCardPopup-tooltip {
  background-color: #333;
  color: white;
  padding: 8px 12px;
  border-radius: 4px;
  font-size: 12px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  pointer-events: none;
  white-space: nowrap;
  z-index: 1001;
  position: fixed;
  transform: translate(-50%, -100%);
  margin-top: -8px;
}

.PropertyCardPopup-tooltip::after {
  content: '';
  position: absolute;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%);
  border-width: 5px 5px 0;
  border-style: solid;
  border-color: #333 transparent transparent;
}

.PropertyCardPopup-selected-dates {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid #e2e8f0;
}
.PropertyCardPopup-selected-date {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.PropertyCardPopup-date-label {
  font-size: 14px;
  color: #4a5568;
  font-weight: 500;
}
.PropertyCardPopup-date-value {
  font-size: 14px;
  color: #2d3748;
}
.PropertyCardPopup-guest-option {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}
.PropertyCardPopup-option-label {
  font-size: 14px;
  color: #2d3748;
}
.PropertyCardPopup-number-input {
  display: flex;
  align-items: center;
}

.PropertyCardPopup-number-input button {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1px solid #e2e8f0;
  background-color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  transition: background-color 0.2s;
}

.PropertyCardPopup-number-input button:hover:not(:disabled) {
  background-color: #edf2f7;
}

.PropertyCardPopup-number-input button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.PropertyCardPopup-number-value {
  min-width: 24px;
  text-align: center;
  margin: 0 8px;
  font-size: 14px;
}

.PropertyCardPopup-price-section {
  margin-top: 24px;
  border-top: 1px solid #e2e8f0;
  padding-top: 16px;
}

.PropertyCardPopup-price-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  font-size: 14px;
}

.PropertyCardPopup-price-label {
  color: #4a5568;
}

.PropertyCardPopup-price-value {
  color: #2d3748;
  font-weight: 500;
}

.PropertyCardPopup-subtotal-row {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #f0f4f8;
}

.PropertyCardPopup-discount-row {
  margin-bottom: 12px;
  padding: 8px;
  border-radius: 6px;
  background-color: #f0fff4;
}

.PropertyCardPopup-discount-value {
  color: #38a169;
  font-weight: 600;
}

.PropertyCardPopup-total-row {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #e2e8f0;
  font-weight: 600;
}

.PropertyCardPopup-total-value {
  color: #0c447e;
  font-size: 16px;
  font-weight: 600;
}

.PropertyCardPopup-reserve-button {
  width: 100%;
  height: auto;
  padding: 14px 20px;
  background: linear-gradient(135deg, #3182ce 0%, #2c5282 100%);
  color: white;
  border: none;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  margin: 20px 0 12px 0;
  display: block;
  text-align: center;
  box-sizing: border-box;
}

.PropertyCardPopup-reserve-button:hover {
  background: linear-gradient(135deg, #2c5282, #1a365d);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(49, 130, 206, 0.3);
}

.PropertyCardPopup-customer-service {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 0;
  color: #718096;
  font-size: 13px;
}

.PropertyCardPopup-service-icon {
  margin-right: 8px;
  color: #4a5568;
}

.PropertyCardPopup-apply-button {
  width: 100%;
  padding: 10px;
  background-color: #0c447e;
  color: white;
  border: none;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s;
  margin-top: 12px;
  box-sizing: border-box;
}

.PropertyCardPopup-apply-button:hover {
  background-color: #2c5282;
}

@media (max-width: 768px) {
  .PropertyCardPopup-container {
    padding: 20px;
  }

  .PropertyCardPopup {
    padding: 16px;
    width: 100%;
    max-width: none;
  }

  .PropertyCardPopup-calendar-day {
    height: 32px;
    width: 32px;
    font-size: 13px;
  }
}

@media (max-width: 480px) {
  .PropertyCardPopup {
    padding: 16px;
  }

  .PropertyCardPopup-calendar-day {
    height: 32px;
    width: 28px;
  }

  .PropertyCardPopup-input-display {
    padding: 10px 12px;
  }

  .PropertyCardPopup-reserve-button {
    padding: 12px 16px;
    font-size: 15px;
    width: 100%;
    height: auto;
  }
}

.reservation-datesRD {
  background-color: #fff;
  padding: 20px 15px;
  border-radius: 10px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  min-width: 0;
  margin-bottom: 20px;
}

.dates-contentRD {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}

.dates-columnRD,
.duration-modifyRD {
  display: flex;
  gap: 10px;
}

.dates-columnRD {
  flex-direction: row;
}

.duration-modifyRD {
  flex-direction: row;
  align-items: center;
}

.arrival-departureRD,
.durationRD {
  display: flex;
  gap: 5px;
  font-size: 0.9rem;
}

.date-labelRD {
  color: #333;
  font-weight: 600;
  margin-right: 3px;
}

.date-valueRD {
  color: #666;
}

.modify-buttonRD {
  background-color: #e9ecef;
  color: #495057;
  border: 1px solid #ced4da;
  border-radius: 5px;
  padding: 6px 10px;
  font-size: 0.9rem;
  cursor: pointer;
  transition: background-color 0.3s ease;
  white-space: nowrap;
}

.modify-buttonRD:hover {
  background-color: #dee2e6;
}

@media (max-width: 768px) {
  .reservation-datesRD {
    width: 100%;
    margin-bottom: 8px;
    padding: 8px 15px;
  }

  .dates-contentRD {
    flex-direction: row;
    gap: 5px;
    white-space: normal;
    flex-wrap: wrap;
  }

  .dates-columnRD {
    flex: 1 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
  }

  .duration-modifyRD {
    flex: 1 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
    align-items: flex-end;
  }

  .arrival-departureRD,
  .durationRD {
    font-size: 0.8rem;
  }

  .date-labelRD {
    margin-right: 2px;
  }

  .modify-buttonRD {
    padding: 3px 6px;
    font-size: 0.75rem;
  }
}

@media (max-width: 480px) {
  .reservation-datesRD {
    padding: 6px 12px;
  }

  .dates-contentRD {
    flex-direction: row;
    gap: 3px;
  }

  .dates-columnRD,
  .duration-modifyRD {
    flex: 1 1;
  }

  .arrival-departureRD,
  .durationRD {
    font-size: 0.75rem;
  }

  .modify-buttonRD {
    font-size: 0.7rem;
    padding: 2px 5px;
  }
}
.billing-formBF {
  flex: 1 1;
  background-color: #fff;
  padding: 25px;
  border-radius: 10px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.form-titleBF {
  font-size: 1.5rem;
  font-weight: 600;
  color: #0a4275;
  margin-bottom: 20px;
  text-align: left;
  padding-left: 0;
}

.form-fieldsBF {
  display: flex;
  flex-direction: column;
  gap: 25px;
  padding-left: 0;
}

.form-rowBF {
  display: flex;
  gap: 15px;
}

.form-groupBF {
  display: flex;
  flex-direction: column;
  flex: 1 1;
}

.form-groupBF.full-width {
  width: 100%;
}

.form-groupBF label {
  font-weight: 600;
  color: #333;
  margin-bottom: 5px;
  font-size: 0.95rem;
}

.form-groupBF .info-label {
  white-space: nowrap;
}

.required-star {
  color: #dc3545;
}

.form-groupBF input,
.form-groupBF textarea,
.form-groupBF select {
  padding: 10px;
  border: 1px solid #ced4da;
  border-radius: 5px;
  font-size: 0.95rem;
  width: 100%;
  height: 40px;
  box-sizing: border-box;
}

.form-groupBF textarea {
  height: 100px;
  resize: vertical;
}

.phone-inputBF {
  display: flex;
  align-items: center;
  gap: 5px;
}

.country-codeBF {
  flex: 0 0 100px;
  padding: 4px;
  border: 1px solid #ced4da;
  border-radius: 5px;
  font-size: 0.95rem;
  text-align: left;
  overflow: hidden;
  white-space: nowrap;
  display: flex;
  align-items: center;
  height: 40px; /* Uniformisé avec le champ de saisie */
  box-sizing: border-box;
}

.country-codeBF img {
  width: 16px;
  height: 12px;
  margin-right: 5px;
}

.separatorBF {
  font-size: 1.2rem;
  color: #ced4da;
}

.phone-numberBF {
  flex: 2 1;
  padding: 10px;
  border: 1px solid #ced4da;
  border-radius: 5px;
  font-size: 0.95rem;
  height: 40px;
  box-sizing: border-box;
}

/* Styles pour l'autocomplétion */
.autocomplete-container {
  position: relative;
}

.autocomplete-input {
  width: 100%;
  padding: 10px;
  border: 1px solid #ced4da;
  border-radius: 5px;
  font-size: 0.95rem;
}

.autocomplete-suggestions {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 1000;
  max-height: 200px;
  overflow-y: auto;
  margin: 0;
  padding: 0;
  list-style: none;
  background-color: #fff;
  border: 1px solid #ced4da;
  border-radius: 0 0 5px 5px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.autocomplete-suggestion-item {
  padding: 8px 12px;
  cursor: pointer;
}

.autocomplete-suggestion-item:hover {
  background-color: #f8f9fa;
}

.suggestion-main {
  font-weight: 500;
}

.suggestion-secondary {
  font-size: 0.8rem;
  color: #6c757d;
}

.autocomplete-loading {
  padding: 8px 12px;
  color: #6c757d;
  font-size: 0.9rem;
}

@media (max-width: 768px) {
  .billing-formBF {
    padding: 20px;
  }

  .form-rowBF {
    flex-direction: column;
    gap: 10px; /* Réduit l'intervalle pour mobile */
  }

  .form-fieldsBF {
    gap: 10px; /* Réduit l'intervalle entre tous les champs sur mobile */
  }

  .form-groupBF label {
    font-size: 0.9rem;
    margin-bottom: 8px;
  }

  .form-groupBF input,
  .form-groupBF textarea,
  .form-groupBF select,
  .country-codeBF,
  .phone-numberBF {
    font-size: 0.9rem;
    padding: 8px;
    height: 38px; /* Ajustement pour mobile */
  }

  .form-groupBF textarea {
    height: 90px;
  }

  .phone-inputBF {
    flex-direction: row;
    gap: 8px;
  }

  .country-codeBF {
    flex: 0 0 90px;
    height: 38px; /* Uniformisé avec le champ de saisie sur mobile */
  }
}

@media (max-width: 480px) {
  .form-titleBF {
    font-size: 1.3rem;
  }

  .form-groupBF label {
    font-size: 0.85rem;
    margin-bottom: 6px;
  }

  .form-groupBF input,
  .form-groupBF textarea,
  .form-groupBF select,
  .country-codeBF,
  .phone-numberBF {
    font-size: 0.85rem;
    padding: 6px;
    height: 36px; /* Ajustement pour petit écran */
  }

  .form-groupBF textarea {
    height: 80px;
  }

  .phone-inputBF {
    gap: 6px;
  }

  .country-codeBF {
    flex: 0 0 80px;
    height: 36px; /* Uniformisé avec le champ de saisie sur petit écran */
  }
}
/* FontAwesome CDN should be included in your project */
.booking-detailsBD {
    flex: 1 1;
    background-color: #fff;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    text-align: left;
}

.section-titleBD {
    font-size: 1.5rem;
    font-weight: 600;
    color: #0a4275;
    margin-bottom: 15px;
}

.booking-imageBD {
    width: 100%;
    max-height: 300px;
    object-fit: cover;
    border-radius: 10px;
    margin-bottom: 15px;
}

.booking-titleBD {
    font-size: 1.3rem;
    font-weight: 600;
    color: #0a4275;
    margin-bottom: 10px;
    text-align: left;
}

.booking-locationBD {
    font-size: 1rem;
    color: #666;
    margin-bottom: 10px;
    text-align: left;
}

.location-icon {
    margin-right: 5px;
    color: #0a4275;
}

.duration-priceBD {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 5px 0;
    padding: 0px 0;
}

.booking-durationBD,
.booking-priceBD {
    font-size: 1rem;
    color: #666;
}

.dividerBD {
    border: none;
    border-top: 2px solid #ced4da;
    margin: 10px 0;
}

.total-priceBD {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 5px 0;
    padding: 0px 0;
}

.total-labelBD {
    font-size: 1rem;
    font-weight: 600;
    color: #333;
}

.total-amountBD {
    font-size: 1rem;
    color: #666;
}

.payment-options-desktopBD {
    margin-top: 20px;
}

.payment-methodsBD {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 10px 0;
}

.payment-methodsBD label {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 1rem;
    color: #333;
}

.payment-logosBD {
    display: flex;
    gap: 5px;
    align-items: center;
}

.payment-logoBD {
    width: 200px;
    height: auto;
    margin-left: 5px;
    object-fit: contain;
}

.paypal-logoBD {
    width: 100px;
    height: auto;
    margin-left: 5px;
    object-fit: contain;
}

.payment-option-noteBD {
    font-size: 0.9rem;
    color: #666;
    margin-left: 25px;
    margin-top: 5px;
}

.payment-noteBD {
    font-size: 0.9rem;
    color: #666;
    margin-top: 10px;
    text-align: left;
    text-align: justify;
}

.confirm-buttonBD {
    background-color: #0a4275;
    color: white;
    border: none;
    border-radius: 5px;
    padding: 12px 25px;
    font-size: 1.1rem;
    font-weight: 600;
    width: 100%;
    cursor: pointer;
    transition: background-color 0.3s ease;
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    box-sizing: border-box;
}

.confirm-buttonBD.paypal {
    background-color:  #0a4275;
    color: white;
}

.confirm-buttonBD.stripe {
    background-color: #0a4275;
    color: white;
}

.confirm-buttonBD:hover {
    background-color: #083258;
}

.confirm-buttonBD.paypal:hover {
    background-color:#083258;
}

.confirm-buttonBD.stripe:hover {
    background-color: #0056b3;
}

.button-iconBD {
    width: 100px;
    height: auto;
    object-fit: contain;
}

.secure-paymentBD {
    font-size: 0.9rem;
    color: #666;
    font-style: italic;
    text-align: center;
    margin-top: 10px;
}

.lock-icon {
    margin-right: 5px;
}

.error-messageBD {
    color: #dc3545;
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
    padding: 10px;
    margin: 10px 0;
    border-radius: 4px;
    text-align: center;
}

.confirm-buttonBD:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}

.discount-containerBD {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 5px 0;
    background-color: #F0FFF4;
    padding: 8px 12px;         /* un peu d'air autour du contenu */
    border-radius: 6px;        /* option : coins arrondis */
}

.discount-labelBD {
    align-items: center; 
}

.discount-amountBD {
    align-items: center;
}

/* Styles pour mobile */
.mobile-button-spaceBD {
    display: none;
}

.mobile-fixed-buttonBD {
    display: none;
}

/* Modal de paiement */
.payment-modal-overlayBD {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.payment-modalBD {
    background: white;
    width: 100%;
    max-width: 500px;
    border-radius: 20px 20px 0 0;
    max-height: 80vh;
    overflow-y: auto;
    animation: slideUp 0.3s ease-out;
}

@keyframes slideUp {
    from {
        transform: translateY(100%);
    }
    to {
        transform: translateY(0);
    }
}

.modal-headerBD {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    border-bottom: 1px solid #eee;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    background: white;
    border-radius: 20px 20px 0 0;
}

.modal-titleBD {
    font-size: 1.2rem;
    font-weight: 600;
    color: #0a4275;
    margin: 0;
}

.modal-close-buttonBD {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #666;
    cursor: pointer;
    padding: 5px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
}

.modal-close-buttonBD:hover {
    background-color: #f5f5f5;
}

.modal-contentBD {
    padding: 20px;
}

.modal-price-summaryBD {
    background-color: #f8f9fa;
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 20px;
}

.price-rowBD {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.price-amountBD {
    font-weight: 600;
    color: #0a4275;
    font-size: 1.1rem;
}

.payment-method-labelBD {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 15px;
    border: 2px solid #eee;
    border-radius: 10px;
    margin-bottom: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.payment-method-labelBD:hover {
    border-color: #0a4275;
    background-color: #f8f9ff;
}

.payment-method-labelBD.selected {
    border-color: #0a4275;
    background-color: #f8f9ff;
}

.payment-method-labelBD input[type="radio"] {
    width: 20px;
    height: 20px;
    accent-color: #0a4275;
    pointer-events: none; /* Désactive les événements sur l'input */
}

/* .payment-method-labelBD.selected input[type="radio"] {
} */

.payment-method-labelBD.selected .payment-method-contentBD {
    color: #0a4275;
    font-weight: 600;
}

.payment-method-contentBD {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex: 1 1;
    font-size: 1rem;
}

.payment-method-logoBD {
    height: 30px;
    width: auto;
    object-fit: contain;
}

.payment-method-logo-paypalBD {
    height: 25px;
    width: auto;
    object-fit: contain;
}

.payment-method-noteBD {
    font-size: 0.9rem;
    color: #666;
    margin-top: 10px;
    padding: 10px;
    background-color: #f8f9fa;
    border-radius: 5px;
}

.modal-footerBD {
    padding: 20px;
    border-top: 1px solid #eee;
    position: -webkit-sticky;
    position: sticky;
    bottom: 0;
    background: white;
}

.modal-confirm-buttonBD {
    background-color: #0a4275;
    color: white;
    border: none;
    border-radius: 10px;
    padding: 15px 25px;
    font-size: 1.1rem;
    font-weight: 600;
    width: 100%;
    cursor: pointer;
    transition: background-color 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 55px;
    box-sizing: border-box;
}

.modal-confirm-buttonBD.paypal {
    background-color: #ffc107;
    color: transparent;
}

.modal-confirm-buttonBD.stripe {
    background-color: #0a4275;
    color: white;
}

.modal-confirm-buttonBD:hover {
    background-color: #083258;
}

.modal-confirm-buttonBD.paypal:hover {
    background-color: #e0a800;
}

.modal-confirm-buttonBD.stripe:hover {
    background-color: #0056b3;
}

.modal-confirm-buttonBD:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}

/* Media queries pour mobile */
@media (max-width: 768px) {
    .booking-detailsBD {
        margin-bottom: 80px; /* Espace pour le bouton fixe */
    }
    
    .payment-options-desktopBD {
        display: none;
    }
    
    .mobile-button-spaceBD {
        display: block;
        height: 100px;
    }
    
    .mobile-fixed-buttonBD {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        background: white;
        padding: 15px 20px;
        box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
        z-index: 999;
        align-items: center;
        justify-content: space-between;
        gap: 15px;
    }
    
    .mobile-price-infoBD {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
    
    .mobile-totalBD {
        font-size: 1.1rem;
        font-weight: 600;
        color: #0a4275;
    }
    
    .mobile-durationBD {
        font-size: 0.9rem;
        color: #666;
    }
    
    .mobile-confirm-buttonBD {
        background-color: #0a4275;
        color: white;
        border: none;
        border-radius: 8px;
        padding: 12px 24px;
        font-size: 1rem;
        font-weight: 600;
        cursor: pointer;
        transition: background-color 0.3s ease;
        white-space: nowrap;
        min-width: 160px;
    }
    
    .mobile-confirm-buttonBD:hover {
        background-color: #083258;
    }
    
    .mobile-confirm-buttonBD:active {
        transform: scale(0.98);
    }
    
    .confirm-buttonBD {
        font-size: 1rem;
        padding: 10px 20px;
        height: 45px;
    }

    .button-iconBD {
        width: 80px;
        height: auto;
    }
    
    .payment-modal-overlayBD {
        align-items: flex-end;
    }
    
    .payment-modalBD {
        border-radius: 20px 20px 0 0;
        max-height: 85vh;
    }
    
    .modal-headerBD {
        padding: 15px 20px;
    }
    
    .modal-titleBD {
        font-size: 1.1rem;
    }
    
    .modal-contentBD {
        padding: 15px 20px;
    }
    
    .modal-footerBD {
        padding: 15px 20px;
    }
    
    .payment-method-labelBD {
        padding: 12px;
        gap: 12px;
    }
    
    .payment-method-contentBD {
        font-size: 0.95rem;
    }
    
    .payment-method-logoBD {
        height: 25px;
    }
    
    .payment-method-logo-paypalBD {
        height: 20px;
    }
}

@media (max-width: 480px) {
    .section-titleBD {
        font-size: 1.3rem;
    }

    .booking-titleBD {
        font-size: 1.1rem;
    }

    .booking-locationBD,
    .booking-durationBD,
    .booking-priceBD,
    .total-labelBD,
    .total-amountBD {
        font-size: 0.9rem;
    }

    .confirm-buttonBD {
        font-size: 0.9rem;
        padding: 8px 16px;
        height: 40px;
    }

    .button-iconBD {
        width: 70px;
        height: auto;
    }

    .payment-logoBD {
        width: 100px;
        height: auto;
    }
    
    .mobile-fixed-buttonBD {
        padding: 12px 15px;
        gap: 10px;
    }
    
    .mobile-totalBD {
        font-size: 1rem;
    }
    
    .mobile-durationBD {
        font-size: 0.85rem;
    }
    
    .mobile-confirm-buttonBD {
        padding: 10px 20px;
        font-size: 0.9rem;
        min-width: 140px;
    }
    
    .modal-headerBD {
        padding: 12px 15px;
    }
    
    .modal-titleBD {
        font-size: 1rem;
    }
    
    .modal-contentBD {
        padding: 12px 15px;
    }
    
    .modal-footerBD {
        padding: 12px 15px;
    }
    
    .payment-method-labelBD {
        padding: 10px;
        gap: 10px;
    }
    
    .payment-method-contentBD {
        font-size: 0.9rem;
    }
    
    .payment-method-logoBD {
        height: 22px;
    }
    
    .payment-method-logo-paypalBD {
        height: 18px;
    }
    
    .modal-confirm-buttonBD {
        padding: 12px 20px;
        font-size: 1rem;
        height: 50px;
    }
}

/* Desktop - masquer les éléments mobiles */
@media (min-width: 769px) {
    .mobile-fixed-buttonBD {
        display: none !important;
    }
    
    .mobile-button-spaceBD {
        display: none !important;
    }
    
    .payment-modal-overlayBD {
        display: none !important;
    }
}

/* Améliorer l'apparence du modal sur desktop si nécessaire */
@media (min-width: 769px) {
    .payment-modal-overlayBD {
        align-items: center;
    }
    
    .payment-modalBD {
        border-radius: 15px;
        max-height: 90vh;
        width: 90%;
        max-width: 500px;
    }
    
    .modal-headerBD {
        border-radius: 15px 15px 0 0;
    }
}


.caution-noteBD {
  font-size: 0.85rem;
  color: #000000;
  text-align: left;
  margin: 12px 0 8px 0;
  padding: 0 5px;
  font-style: italic;
  /* font-weight: bold; */
}
.BookingPage-booking-page {
  font-family: 'Poppins', sans-serif;
  color: #333;
  background-color: #f8f9fa;
  margin: 0;
  padding: 0;
  /* Ajout du padding-top pour compenser la hauteur du header fixe */
  padding-top: 20px; /* Hauteur du header + top bar */
}
 
.BookingPage-popup-blur-active {
  filter: blur(4px);
  pointer-events: none;
  transition: filter 0.3s ease;
}
 
.BookingPage-main {
  padding: 60px 20px;
  max-width: 1200px;
  margin: 0 auto;
}
 
.BookingPage-page-title {
  font-size: 2rem;
  font-weight: 600;
  color: #0C447E;
  margin-bottom: 30px;
  text-align: left;
}

.page-titleBKP .highlight {
  color: #E30613;
}
 
.BookingPage-booking-content {
  display: flex;
  gap: 30px;
}
 
.BookingPage-left-section {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
 
@media (max-width: 768px) {
  .BookingPage-booking-page {
    /* Ajustement pour mobile - header plus petit */
    padding-top: 10px;
  }
  .BookingPage-main {
    padding: 40px 15px;
  }
  .BookingPage-page-title {
    font-size: 1.8rem;
  }
  .BookingPage-booking-content {
    flex-direction: column;
  }
  .BookingPage-left-section {
    flex-direction: column;
  }
}
 
@media (max-width: 480px) {
  .BookingPage-booking-page {
    /* Ajustement pour très petits écrans */
    padding-top: 10px;
  }
  .BookingPage-main {
    padding: 30px 10px;
  }
  .BookingPage-page-title {
    font-size: 1.5rem;
  }
}
 
@media (max-width: 375px) {
  .BookingPage-booking-page {
    /* Ajustement pour écrans extra petits */
    padding-top: 10px;
  }
}

/* === GÉNÉRAL === */
.confirm-page {
  min-height: 100vh;
  background: #f8f9fb;
  padding: 40px 16px;
  font-family: 'Inter', system-ui, sans-serif;
  display: flex;
  justify-content: center;
}

.confirm-card {
  max-width: 1200px;
  width: 100%;
  max-height: 800px;
  background: white;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(12, 68, 126, 0.12);
  border: 1px solid #e2e6eb;
}

/* === EN-TÊTE === */
.confirm-header {
  background: #0c447e;
  color: white;
  text-align: center;
  padding: 36px 24px;
}

.confirm-header h1 {
  margin: 0;
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: -0.5px;
}

.subtitle {
  margin: 10px 0 0;
  font-size: 1rem;
  opacity: 0.95;
  font-weight: 500;
}

/* === TIMELINE WRAPPER === */
.timeline-wrapper {
  position: relative;
  margin: 20px 0 32px;
  padding: 0 28px;
}

/* === LIGNE GRISE : S'ARRÊTE AU CENTRE DE LA DERNIÈRE ICÔNE === */
.progress-track {
  position: absolute;
  top: 22px;
  left: 0px;
  right: calc(50% - 44px); /* ← 50% - (44px / 2) = centre de la dernière icône */
  height: 4px;
  background: #e2e6eb;
  border-radius: 2px;
  z-index: 1;
}

/* === REMPLISSAGE BLEU : S'ARRÊTE AU CENTRE DE L'ÉTAPE EN COURS === */
.progress-fill {
  position: absolute;
  top: 22px;
  left: 0px;
  height: 4px;
  background: #0c447e;
  border-radius: 2px;
  z-index: 2;
  transition: width 1.4s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 0 8px rgba(12, 68, 126, 0.3);
}

/* === TIMELINE === */
.timeline {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  z-index: 3;
}

.step {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1 1;
  min-width: 60px;
}

.step-icon {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 19px;
  margin-bottom: 8px;
  z-index: 4;
  background: #0c447e;
  color: white;
  border: 3px solid #0c447e;
  box-shadow: 0 3px 10px rgba(12, 68, 126, 0.18);
}

.step.completed .step-icon {
  background: #0c447e;
  color: white;
  border-color: #0c447e;
}

.step.current .step-icon {
  background: white;
  color: #0c447e;
  border: 3px solid #e30613;
  animation: pulse 2s infinite;
}

.step.upcoming .step-icon {
  background: white;
  color: #0c447e;
  border: 3px solid #0c447e;
}

@keyframes pulse {
  0% { box-shadow: 0 0 0 0 rgba(227, 6, 19, 0.3); }
  70% { box-shadow: 0 0 0 12px rgba(227, 6, 19, 0); }
  100% { box-shadow: 0 0 0 0 rgba(227, 6, 19, 0); }
}

.step-label {
  font-weight: 600;
  font-size: 0.78rem;
  color: #0c447e;
  text-align: center;
  white-space: nowrap;
}

.step.current .step-label {
  color: #0c447e;
  font-weight: 700;
}

/* === DÉTAILS === */
.details-card {
  background: #f8f9fa;
  border: 1px solid #0c447e;
  border-radius: 16px;
  padding: 32px 28px;
  position: relative;
}

.details-title {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  color: #0c447e;
  font-weight: 700;
  font-size: 1.3rem;
}

.details-title .icon {
  color: #0c447e;
  font-size: 1.4rem;
}

.details-list {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 14px;
  gap: 14px;
  font-size: 0.98rem;
}

.detail {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px dashed #cbd5e1;
}

.detail:last-child {
  border-bottom: none;
}

.detail .label {
  color: #0c447e;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 6px;
}

.icon-sm {
  font-size: 0.9rem;
  color: #0c447e;
}

.detail .value {
  color: #1a1a1a;
  font-weight: 600;
}

.detail.price .value {
  color: #e30613;
  font-weight: 700;
  font-size: 1.1rem;
}

.bold {
  font-weight: 700;
  color: #0c447e;
}

.status-badge {
  position: absolute;
  top: 16px;
  right: 16px;
  background: #fff8e1;
  color: #e30613;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 0.82rem;
  font-weight: 700;
  border: 1px solid #e30613;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* === BOUTONS : CONFIGURATION GÉNÉRALE === */
.actions {
  display: flex;
  gap: 16px;
  width: 100%;
  margin-top: 12px;
  align-items: flex-end;
}

.btn-primary,
.btn-secondary {
  padding: 13px 20px;
  border-radius: 12px;
  font-weight: 600;
  font-size: 0.95rem;
  cursor: pointer;
  transition: all 0.3s ease;
  text-align: center;
  border: none;
  flex: 1 1;
  max-width: 280px;
}

.btn-primary {
  background: #0c447e;
  color: white;
}

.btn-primary:hover {
  background: #0a3a6a;
  transform: translateY(-1px);
}

.btn-secondary {
  background: transparent;
  color: #0c447e;
  border: 2px solid #0c447e;
}

.btn-secondary:hover {
  background: #0c447e;
  color: white;
}

/* === MOBILE : CENTRÉS EN COLONNE === */
@media (max-width: 767px) {
  .actions {
    flex-direction: column;
    justify-content: center;
    align-items: center;      /* ← CENTRÉ */
    gap: 10px;
  }

  .btn-primary,
  .btn-secondary {
    width: 100%;
    max-width: 280px;
  }
}

/* === TABLETTE & ORDINATEUR : ALIGNÉS À DROITE EN 1 LIGNE === */
@media (min-width: 768px) {
  .actions {
    flex-direction: row;
    justify-content: flex-end;   /* ← ALIGNÉ À DROITE */
    align-items: flex-end;
  }

  .btn-primary,
  .btn-secondary {
    width: auto;
    min-width: 180px;
    flex: none;
  }
}
/* === TABLETTE & ORDINATEUR === */
@media (min-width: 768px) {
  .actions {
    flex-direction: row;
    justify-content: flex-end;
    gap: 16px;
  }

  .btn-primary,
  .btn-secondary {
    width: auto;
    min-width: 180px;
  }

  .details-card {
    padding: 32px 28px;
  }
}

/* === MOBILE === */
@media (max-width: 767px) {
  .confirm-page { padding: 16px 8px; }
  .confirm-header { padding: 20px 16px; }
  .confirm-header h1 { font-size: 1.5rem; }
  .subtitle { font-size: 0.9rem; }
  .confirm-body { padding: 20px 16px; gap: 18px; }

  .timeline-wrapper {
    margin: 16px 0 24px;
    padding: 0 20px;
  }

  .progress-track {
    top: 18px;
    height: 3px;
    left: 20px;
    right: calc(50% - 18px); /* ← Arrête au centre de la dernière icône (mobile) */
  }

  .progress-fill {
    top: 18px;
    height: 3px;
    left: 20px;
  }

  .step { min-width: 50px; }
  .step-icon {
    width: 36px;
    height: 36px;
    font-size: 16px;
    margin-bottom: 6px;
  }
  .step-label { font-size: 0.68rem; }

  .details-card { padding: 24px 20px; }
  .details-title { font-size: 1.1rem; }
  .details-list { gap: 10px; font-size: 0.88rem; }
  .status-badge {
    position: static;
    display: block;
    text-align: center;
    margin-top: 12px;
    font-size: 0.72rem;
    padding: 4px 10px;
  }
  .actions { gap: 10px; }
}
/* Admin Login Page Styles */
.admin-login-page {
  width: 100%;
  height: 100vh;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif;
  overflow-x: hidden;
}

/* Ensure the body has proper reset */
body {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}
/* TAHAGA Login Component - Premium VR Real Estate Platform */

/* Base Variables */
:root {
  --tahaga-blue: #0F447E;
  --tahaga-red: #E30613;
  --accent-color: #00d0ff;
  --text-light: #0b0b0b;
  --text-dark: #333333;
  --glass-background: rgba(255, 255, 255, 0.1);
  --glass-border: rgba(255, 255, 255, 0.2);
  --glass-shadow: rgba(0, 0, 0, 0.3);
}

/* ========== MASTER LOADING SCREEN ========== */
.LoginAdminComponent-master-loading {
  position: fixed;
  width: 100vw;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #070b34;
  overflow: hidden;
}

/* VR Grid Environment */
.LoginAdminComponent-vr-environment {
  position: absolute;
  width: 100%;
  height: 100%;
  perspective: 1000px;
  overflow: hidden;
}

.LoginAdminComponent-grid {
  position: absolute;
  width: 200%;
  height: 200%;
  top: -50%;
  left: -50%;
  background-image: 
    linear-gradient(rgba(0, 208, 255, 0.2) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 208, 255, 0.2) 1px, transparent 1px);
  background-size: 40px 40px;
  transform: rotateX(60deg) scale(6);
  animation: LoginAdminComponent-grid-animation 15s linear infinite;
}

@keyframes LoginAdminComponent-grid-animation {
  0% {
    transform: rotateX(60deg) translateZ(0) scale(6);
  }
  100% {
    transform: rotateX(60deg) translateZ(200px) scale(6);
  }
}

/* Particles */
.LoginAdminComponent-particles {
  position: absolute;
  width: 100%;
  height: 100%;
}

.LoginAdminComponent-particle {
  position: absolute;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 50%;
  width: 4px;
  height: 4px;
  animation: LoginAdminComponent-float-up 10s infinite linear;
}

@keyframes LoginAdminComponent-float-up {
  0% {
    opacity: 0;
    transform: translateY(100vh) translateX(0) scale(0);
  }
  10% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translateY(-20vh) translateX(20vw) scale(2);
  }
}

/* Generate unique particles with different positions and animations */
.LoginAdminComponent-particle-1 { left: 10%; animation-delay: 0s; animation-duration: 15s; }
.LoginAdminComponent-particle-2 { left: 20%; animation-delay: 2s; animation-duration: 12s; }
.LoginAdminComponent-particle-3 { left: 30%; animation-delay: 4s; animation-duration: 14s; }
.LoginAdminComponent-particle-4 { left: 40%; animation-delay: 1s; animation-duration: 18s; }
.LoginAdminComponent-particle-5 { left: 50%; animation-delay: 3s; animation-duration: 13s; }
.LoginAdminComponent-particle-6 { left: 60%; animation-delay: 5s; animation-duration: 16s; }
.LoginAdminComponent-particle-7 { left: 70%; animation-delay: 0s; animation-duration: 17s; }
.LoginAdminComponent-particle-8 { left: 80%; animation-delay: 2s; animation-duration: 19s; }
.LoginAdminComponent-particle-9 { left: 90%; animation-delay: 4s; animation-duration: 11s; }
.LoginAdminComponent-particle-10 { left: 15%; animation-delay: 1s; animation-duration: 13s; }
.LoginAdminComponent-particle-11 { left: 25%; animation-delay: 3s; animation-duration: 15s; }
.LoginAdminComponent-particle-12 { left: 35%; animation-delay: 5s; animation-duration: 12s; }
.LoginAdminComponent-particle-13 { left: 45%; animation-delay: 2s; animation-duration: 14s; }
.LoginAdminComponent-particle-14 { left: 55%; animation-delay: 0s; animation-duration: 16s; }
.LoginAdminComponent-particle-15 { left: 65%; animation-delay: 3s; animation-duration: 20s; }

/* Loading Content */
.LoginAdminComponent-loading-content {
  position: relative;
  z-index: 10;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.LoginAdminComponent-loader-logo {
  width: 220px;
  height: auto;
  margin-bottom: 40px;
  filter: drop-shadow(0 0 15px rgba(0, 208, 255, 0.6));
  animation: LoginAdminComponent-pulse 2s infinite alternate;
}

@keyframes LoginAdminComponent-pulse {
  0% {
    filter: drop-shadow(0 0 5px rgba(0, 208, 255, 0.6));
  }
  100% {
    filter: drop-shadow(0 0 20px rgba(0, 208, 255, 0.8));
  }
}

/* Advanced Loader */
.LoginAdminComponent-loader {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.LoginAdminComponent-loader-circle {
  width: 80px;
  height: 80px;
  border: 3px solid rgba(0, 208, 255, 0.2);
  border-top: 3px solid #00d0ff;
  border-top: 3px solid var(--accent-color);
  border-radius: 50%;
  animation: LoginAdminComponent-spin 1.5s linear infinite;
  margin-bottom: 20px;
}

@keyframes LoginAdminComponent-spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.LoginAdminComponent-loader-text {
  display: flex;
  justify-content: center;
}

.LoginAdminComponent-loader-text span {
  color: #0b0b0b;
  color: var(--text-light);
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 2px;
  margin: 0 1px;
  animation: LoginAdminComponent-letter-glow 2s infinite alternate;
}

@keyframes LoginAdminComponent-letter-glow {
  0%, 40%, 100% {
    color: rgba(255, 255, 255, 0.7);
    text-shadow: none;
  }
  90% {
    color: #0b0b0b;
    color: var(--text-light);
    text-shadow: 0 0 8px #00d0ff;
    text-shadow: 0 0 8px var(--accent-color);
  }
}

/* Apply delay to each letter */
.LoginAdminComponent-loader-text span:nth-child(1) { animation-delay: 0.1s; }
.LoginAdminComponent-loader-text span:nth-child(2) { animation-delay: 0.2s; }
.LoginAdminComponent-loader-text span:nth-child(3) { animation-delay: 0.3s; }
.LoginAdminComponent-loader-text span:nth-child(4) { animation-delay: 0.4s; }
.LoginAdminComponent-loader-text span:nth-child(5) { animation-delay: 0.5s; }
.LoginAdminComponent-loader-text span:nth-child(6) { animation-delay: 0.6s; }
.LoginAdminComponent-loader-text span:nth-child(7) { animation-delay: 0.7s; }
.LoginAdminComponent-loader-text span:nth-child(8) { animation-delay: 0.8s; }
.LoginAdminComponent-loader-text span:nth-child(9) { animation-delay: 0.9s; }
.LoginAdminComponent-loader-text span:nth-child(10) { animation-delay: 1.0s; }

/* ========== MASTER LOGIN FORM ========== */
.LoginAdminComponent-master-login {
  position: fixed;
  width: 100vw;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  background: linear-gradient(135deg, #f5f7fa 0%, #e4e8f0 100%);
  overflow: hidden;
  font-family: 'Poppins', sans-serif;
}

/* Panoramic View */
.LoginAdminComponent-panoramic-view {
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.LoginAdminComponent-panorama {
  position: absolute;
  width: 200%;
  height: 100%;
  background-image: radial-gradient(circle at center, 
    rgba(0, 83, 165, 0.1) 0%, 
    rgba(255, 0, 0, 0.05) 50%, 
    rgba(0, 0, 0, 0) 70%);
  animation: LoginAdminComponent-rotate-panorama 30s linear infinite;
}

@keyframes LoginAdminComponent-rotate-panorama {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* Floating Elements */
.LoginAdminComponent-floating-elements {
  position: absolute;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.LoginAdminComponent-float-element {
  position: absolute;
  border-radius: 20%;
  background: linear-gradient(
    45deg, 
    rgba(0, 83, 165, 0.1),
    rgba(0, 208, 255, 0.1)
  );
  filter: blur(10px);
  animation: LoginAdminComponent-float 20s infinite ease-in-out;
}

@keyframes LoginAdminComponent-float {
  0%, 100% {
    transform: translateY(0) translateX(0) rotate(0deg);
  }
  25% {
    transform: translateY(-30px) translateX(20px) rotate(5deg);
  }
  50% {
    transform: translateY(15px) translateX(15px) rotate(-5deg);
  }
  75% {
    transform: translateY(20px) translateX(-25px) rotate(3deg);
  }
}

/* Create unique floating elements */
.LoginAdminComponent-float-1 {
  width: 120px;
  height: 120px;
  top: 10%;
  left: 10%;
  animation-duration: 25s;
}

.LoginAdminComponent-float-2 {
  width: 180px;
  height: 180px;
  top: 20%;
  right: 15%;
  animation-duration: 22s;
  animation-delay: 2s;
}

.LoginAdminComponent-float-3 {
  width: 90px;
  height: 90px;
  bottom: 15%;
  left: 20%;
  animation-duration: 28s;
  animation-delay: 1s;
}

.LoginAdminComponent-float-4 {
  width: 150px;
  height: 150px;
  bottom: 20%;
  right: 10%;
  animation-duration: 18s;
  animation-delay: 3s;
}

.LoginAdminComponent-float-5 {
  width: 100px;
  height: 100px;
  top: 50%;
  left: 5%;
  animation-duration: 20s;
  animation-delay: 4s;
}

.LoginAdminComponent-float-6 {
  width: 200px;
  height: 200px;
  top: 40%;
  right: 5%;
  animation-duration: 30s;
  animation-delay: 0s;
}

.LoginAdminComponent-float-7 {
  width: 85px;
  height: 85px;
  bottom: 40%;
  left: 40%;
  animation-duration: 23s;
  animation-delay: 2s;
}

.LoginAdminComponent-float-8 {
  width: 130px;
  height: 130px;
  top: 15%;
  left: 50%;
  animation-duration: 26s;
  animation-delay: 3s;
}

/* Master Form */
.LoginAdminComponent-master-form {
  position: relative;
  width: 400px;
  background: rgba(255, 255, 255, 0.9);
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 16px;
  padding: 40px;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
  z-index: 100;
  transform: translateY(50px);
  opacity: 0;
  transition: all 0.6s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}

.LoginAdminComponent-master-form.active {
  transform: translateY(0);
  opacity: 1;
}

/* Form Header */
.LoginAdminComponent-form-header {
  text-align: center;
  margin-bottom: 30px;
}

.LoginAdminComponent-form-logo {
  width: 140px;
  height: auto;
  margin-bottom: 20px;
}

.LoginAdminComponent-form-header h1 {
  color: #333;
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 10px;
  background: linear-gradient(90deg, #0F447E, #E30613);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.LoginAdminComponent-form-header p {
  color: #666;
  font-size: 14px;
  line-height: 1.6;
}

/* Glass Form */
.LoginAdminComponent-glass-form {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* Input Group */
.LoginAdminComponent-input-group {
  position: relative;
  margin-bottom: 10px;
}

.LoginAdminComponent-input-group.with-floating-label {
  height: 50px;
}

.LoginAdminComponent-styled-input {
  width: 100%;
  background: transparent;
  border: none;
  padding: 15px 0 8px;
  font-size: 16px;
  color: #333;
  position: relative;
  z-index: 10;
  border-bottom: 1px solid #ddd;
}

.LoginAdminComponent-styled-input:focus {
  outline: none;
  border-bottom-color: #0F447E;
  border-bottom-color: var(--tahaga-blue);
}

.LoginAdminComponent-input-group label {
  position: absolute;
  left: 0;
  color: #999;
  font-size: 16px;
  pointer-events: none;
  transform-origin: left top;
  transition: all 0.3s ease;
  top: 15px;
}

.LoginAdminComponent-styled-input:focus + label,
.LoginAdminComponent-styled-input:not(:placeholder-shown) + label,
.LoginAdminComponent-input-group label.active {
  transform: translateY(-20px) scale(0.8);
  color: #0F447E;
  color: var(--tahaga-blue);
}

.LoginAdminComponent-input-line {
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 1px;
  background: #ddd;
}

.LoginAdminComponent-styled-input:focus ~ .LoginAdminComponent-input-line::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: #0F447E;
  background: var(--tahaga-blue);
  transform: scaleX(1);
  transition: transform 0.3s ease;
}

/* Password Toggle Button */
.LoginAdminComponent-visibility-toggle {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: #999;
  cursor: pointer;
  z-index: 15;
  transition: color 0.3s;
}

.LoginAdminComponent-visibility-toggle:hover {
  color: #0F447E;
  color: var(--tahaga-blue);
}

/* Form Options */
.LoginAdminComponent-form-options {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
}

.LoginAdminComponent-remember-me {
  display: flex;
  align-items: center;
  color: #666;
  cursor: pointer;
}

.LoginAdminComponent-remember-me input {
  margin-right: 6px;
}

.LoginAdminComponent-password-reset {
  color: #0F447E;
  color: var(--tahaga-blue);
  text-decoration: none;
  transition: all 0.3s;
}

.LoginAdminComponent-password-reset:hover {
  color: #E30613;
  color: var(--tahaga-red);
}

/* Submit Button */
.LoginAdminComponent-submit-button {
  position: relative;
  width: 100%;
  padding: 14px;
  margin-top: 20px;
  background: linear-gradient(90deg, #0F447E, #E30613);
  background: linear-gradient(90deg, var(--tahaga-blue), var(--tahaga-red));
  color: white;
  border: none;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 1px;
  cursor: pointer;
  overflow: hidden;
  transition: all 0.3s;
}

.LoginAdminComponent-submit-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 15px rgba(0, 83, 165, 0.4);
}

.LoginAdminComponent-button-effect {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, 
    transparent, 
    rgba(255, 255, 255, 0.4), 
    transparent);
  transform: translateX(-100%);
}

.LoginAdminComponent-submit-button:hover .LoginAdminComponent-button-effect {
  animation: LoginAdminComponent-button-shine 1.5s infinite;
}

@keyframes LoginAdminComponent-button-shine {
  100% {
    transform: translateX(100%);
  }
}

/* Responsive Adjustments */
@media (max-width: 480px) {
  .LoginAdminComponent-master-form {
    width: 90%;
    padding: 30px 20px;
  }
  
  .LoginAdminComponent-form-header h1 {
    font-size: 20px;
  }
  
  .LoginAdminComponent-form-options {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
}


.login-message {
  margin-top: 1rem;
  padding: 0.75rem 1rem;
  border-radius: 6px;
  font-size: 0.95rem;
  font-weight: 500;
  line-height: 1.4;
  text-align: center;
  display: block;          /* prend toute la largeur dispo mais pas la hauteur */
  width: auto;             /* largeur auto */
  height: auto !important; /* ignore toute hauteur forcée */
  min-height: 0 !important;
  min-height: initial !important;
  max-width: 100%;
  box-sizing: border-box;
}

/* Variantes */
.login-message.error {
  background: #ffecec;
  border: 1px solid #e30613;
  color: #e30613;
}

.login-message.success {
  background: #e6f7ec;
  border: 1px solid #0f834d;
  color: #0f834d;
}

.login-message.info {
  background: #e8f4ff;
  border: 1px solid #0f447e;
  color: #0f447e;
}

.footer-right {
  width: 100%;
  padding: 15px 0;
  background-color: transparent;
  text-align: center;
  font-family: Arial, sans-serif;
}

.footer-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 15px;
}

.copyright {
  font-size: 14px;
  color: #888;
  font-weight: 300;
}

@media (max-width: 768px) {
  .copyright {
    font-size: 12px;
  }
}


/* .footer-right {
  position: fixed;
  bottom: 0;
  left: 50%; 
  transform: translateX(-10%); 
  width: auto; 
  max-width: 1200px; 
  padding: 15px 20px;
  text-align: center;
  font-family: Arial, sans-serif;
  z-index: 100;
}

body {
  padding-bottom: 70px; 
} */
.tahaga-notification-container {
  position: relative;
  display: inline-block;
  font-family: 'Poppins', sans-serif;
}

.tahaga-notification-icon {
  position: relative;
  cursor: pointer;
  font-size: 1.7rem;
  color: #1e293b;
  transition: transform 0.5s ease, color 0.5s ease;
}

.tahaga-notification-icon:hover {
  transform: scale(1.07);
  color: #0f447e;
}

.tahaga-notification-badge {
  position: absolute;
  top: -6px;
  right: -7px;
  background: #ef4444;
  color: #fff;
  border-radius: 50%;
  padding: 3px 7px;
  font-size: 0.7rem;
  font-weight: 600;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
}

.tahaga-notification-dropdown-wrapper {
  position: absolute;
  right: 0;
  top: 2.1rem;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-10px);
  transition: opacity 0.4s ease, transform 0.4s ease;
  z-index: 999;
}

.tahaga-notification-dropdown-wrapper.open {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.tahaga-notification-dropdown {
  width: 340px;
  max-height: 420px;
  overflow-y: auto;
  background: rgba(255, 255, 255);
  border-radius: 12px;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
  padding: 0.3rem 0;
}

.tahaga-no-notifications {
  text-align: center;
  padding: 1.3rem;
  color: #6b7280;
  font-size: 0.9rem;
}

.tahaga-notification-item {
  cursor: pointer;
  padding: 0.8rem 1rem;
  transition: background 0.3s ease, transform 0.2s ease;
  border-radius: 10px;
  margin: 0.2rem 0.5rem;
}

.tahaga-notification-item:hover {
  background: rgba(0, 123, 255, 0.08);
}

.tahaga-notification-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.tahaga-notification-text {
  flex: 1 1;
  overflow: hidden;
}

.tahaga-notification-title {
  font-weight: 700;
  color: #111827;
  font-size: 0.8rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tahaga-notification-message {
  color: #4b5563;
  font-size: 0.73rem;
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tahaga-unread-dot {
  width: 6px;
  height: 6px;
  background-color: #ef4444;
  border-radius: 50%;
  margin-left: 10px;
}

.tahaga-notification-separator {
  height: 1px;
  background: rgba(0, 0, 0, 0.07);
  margin: 0 0.8rem;
}

.tahaga-notification-dropdown::-webkit-scrollbar {
  width: 4px;
}
.tahaga-notification-dropdown::-webkit-scrollbar-thumb {
  background: #0f447e;
  border-radius: 8px;
}

@media (max-width: 480px) {
  .tahaga-notification-dropdown-wrapper {
    right: -13.5vw;
    transform: translateX(50%);
    top: 2.3rem;
  }

  .tahaga-notification-dropdown {
    width: 75vw;
    max-width: 320px;
  }
}

@media (max-width: 360px) {
  .tahaga-notification-dropdown-wrapper {
    right: -18vw;
    transform: translateX(50%);
    top: 2.3rem;
  }

  .tahaga-notification-dropdown {
    width: 73vw;
    max-width: 320px;
  }
}

/* Notification Details section: This is for viewing notification details */
.tahaga-notification-details {
  padding: 1.2rem;
  border-radius: 12px;
  animation: fadeIn 0.5s ease forwards;
  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.05);
}

@keyframes fadeIn {
  from {
    opacity: 0.5;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.tahaga-back-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  color: #0f447e;
  font-weight: 500;
  font-size: 0.8rem;
  margin-bottom: 1rem;
  transition: color 0.5s ease;
}

.tahaga-back-btn:hover {
  color: #17579b;
}

.tahaga-details-title {
  font-size: 0.85rem;
  font-weight: 700;
  color: #0f447e;
  margin-bottom: 0.5rem;
}

.tahaga-details-message {
  color: #374151;
  font-size: 0.76rem;
  line-height: 1.5;
  background: #f1f5f9;
  padding: 0.8rem;
  border-radius: 8px;
  margin-bottom: 1rem;
  word-wrap: break-word;
}

.tahaga-details-footer {
  gap: 8px;
  display: flex;
  justify-content: end;
  text-align: right;
  font-size: 0.6rem;
  color: #6b7280;
  font-style: italic;
}

.tahaga-notification-date {
  font-size: 0.65rem;
  color: #9ca3af;
  margin-top: 2px;
}

.tahaga-details-date {
  font-size: 0.75rem;
  color: #6b7280;
  margin-bottom: 0.8rem;
  font-style: italic;
}

.tahaga-header {
  position: fixed; 
  top: 0;
  left: 250px; 
  right: 0; 
  z-index: 50; 
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  background-color: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  font-family: 'Poppins', sans-serif;
  transition: left 0.3s ease;
}

.tahaga-header.sidebar-collapsed {
  left: 70px;
}

/* Burger Menu Button - MODERNE ET STYLÉ */
.tahaga-burger-btn {
  display: none;
  position: relative;
  width: 46px;
  height: 46px;
  border: none;
  background: transparent;
  border-radius: 12px;
  cursor: pointer;
  padding: 0;
  overflow: hidden;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.tahaga-burger-btn::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0) 100%);
  opacity: 0;
  transition: opacity 0.3s;
}

.tahaga-burger-btn::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  background: rgba(255, 255, 255, 0.3);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

.tahaga-burger-btn:hover::before {
  opacity: 1;
}

.tahaga-burger-btn:active {
  box-shadow: 0 2px 8px rgba(15, 68, 126, 0.3);
}

.tahaga-burger-btn:active::after {
  width: 120%;
  height: 120%;
}

/* Style de l'icône Menu dans le burger */
.tahaga-burger-btn svg {
  position: relative;
  z-index: 1;
  color: #0F447E;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.tahaga-burger-btn:active svg {
  transform: scale(0.9);
}

.tahaga-search-container {
  flex: 1 1;
  max-width: 600px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.tahaga-search-input-wrapper {
  position: relative;
  width: 100%;
}

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

.tahaga-filter-btn {
  background: none;
  border: none;
  color: #555;
  font-size: 18px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.tahaga-search-input {
  width: 100%;
  padding: 10px 15px 10px 40px;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  background-color: #f9f9f9;
}

.tahaga-search-input:focus {
  outline: none;
  border-color: #0F447E;
  background-color: #fff;
}

.tahaga-header-right {
  display: flex;
  align-items: center;
  gap: 15px;
}

.tahaga-notification-icon {
  position: relative;
  font-size: 18px;
  color: #555;
  cursor: pointer;
}

.tahaga-notification-badge {
  position: absolute;
  top: -8px;
  right: -8px;
  background-color: #e30613;
  color: white;
  font-size: 10px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
}

.tahaga-user-profile {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}

.tahaga-user-info {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.tahaga-welcome-text {
  font-size: 12px;
  color: #777;
}

.tahaga-user-role {
  font-size: 14px;
  font-weight: 600;
  color: #0F447E;
}

.tahaga-user-avatar {
  width: 36px;
  height: 36px;
  background-color: #0F447E;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
}

.tahaga-user-icon {
  font-size: 16px;
}

/* Dropdown Profil */
.tahaga-dropdown {
  position: absolute;
  top: 110%;
  right: 0;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  margin-top: 8px;
  min-width: 160px;
  box-shadow: 0px 4px 8px rgba(0,0,0,0.1);
  z-index: 100;
}

.tahaga-dropdown-item {
  width: 100%;
  padding: 10px 14px;
  display: flex;
  align-items: center;
  gap: 8px;
  background: none;
  border: none;
  cursor: pointer;
  font-size: 14px;
  color: #374151;
  text-align: left;
  font-family: 'Poppins', sans-serif;
}

.tahaga-dropdown-item:hover {
  background-color: #f3f4f6;
}

.tahaga-dropdown-icon {
  font-size: 16px;
  color: #6b7280;
}

/* Tablette */
@media (max-width: 992px) {
  .tahaga-search-container {
    max-width: 300px;
  }
}

/* Mobile - LE HEADER PREND TOUTE LA LARGEUR */
@media (max-width: 768px) {
  .tahaga-header {
    left: 0 !important; /* Plus de marge pour la sidebar */
    padding: 0 15px;
  }
  
  /* Afficher le burger menu */
  .tahaga-burger-btn {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .tahaga-search-container {
    max-width: 200px;
  }
  
  .tahaga-user-info {
    display: none;
  }
}

/* Très petit écran */
@media (max-width: 576px) {
  .tahaga-search-container {
    max-width: 150px;
  }
  
  .tahaga-header {
    padding: 0 10px;
  }
}
html,
body {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

.tahaca-layout {
  display: flex;
  width: 100%;
  min-height: 100vh;
  overflow-x: hidden;
}

.tahaca-main-content {
  flex: 1 1;
  margin-left: 250px;
  padding: 70px 20px 20px 20px;
  transition: margin-left 0.3s ease;
  min-height: 100vh;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-y: auto;
  overflow-x: hidden;
}

.tahaca-main-content.sidebar-collapsed {
  margin-left: 70px;
  width: calc(100% - 70px);
}

.tahaca-sidebar {
  width: 250px;
  height: 100vh;
  background-color: #0F447E;
  color: white;
  font-family: 'Poppins', sans-serif;
  display: flex;
  flex-direction: column;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 100;
  transition: width 0.3s ease;
  box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1);
  overflow-y: auto;
  overflow-x: hidden;
}

.tahaca-sidebar.collapsed {
  width: 70px;
}

.tahaca-sidebar__logo-container {
  padding: 12px 0;
  height: 85px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.tahaca-sidebar__logo {
  max-height: 70px;
  max-width: 80%;
  transition: opacity 0.3s ease;
}

.tahaca-sidebar.collapsed .tahaca-sidebar__logo {
  opacity: 0;
  display: none;
}

/* Garder le logo visible sur mobile même si collapsed */
@media (max-width: 768px) {
  .tahaca-sidebar.collapsed .tahaca-sidebar__logo {
    opacity: 1;
    display: block;
  }
}

.tahaca-sidebar__collapse-btn {
  position: absolute;
  top: 50px;
  right: -15px;
  width: 30px;
  height: 30px;
  background-color: #0F447E;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
  color: white;
  font-size: 14px;
  z-index: 110;
  border: 1px solid rgba(255, 255, 255, 0.3);
  transition: transform 0.3s;
  overflow: visible;
}

.tahaca-sidebar__collapse-btn:hover {
  transform: scale(1.1);
}

/* Bouton fermer sur mobile */
.tahaca-sidebar__close-btn {
  display: none;
  position: absolute;
  top: 15px;
  right: 15px;
  background: rgba(255, 255, 255, 0.2);
  border: none;
  color: white;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  z-index: 120;
  transition: background 0.2s ease;
}

.tahaca-sidebar__close-btn:hover {
  background: rgba(255, 255, 255, 0.3);
}

.tahaca-sidebar__close-btn:active {
  background: rgba(255, 255, 255, 0.25);
}

.tahaca-sidebar__nav {
  flex-grow: 1;
  overflow-y: auto;
  overflow-x: visible;
  margin-top: 10px;
  padding-bottom: 20px;
}

.tahaca-sidebar__menu {
  list-style: none;
  padding: 0;
  margin: 0;
}

.tahaca-sidebar__menu-item {
  margin: 5px 0;
  padding: 0 15px;
  position: relative;
}

.tahaca-sidebar__menu-link {
  display: flex;
  align-items: center;
  padding: 12px 11px;
  color: rgb(255, 255, 255);
  text-decoration: none;
  border-left: 4px solid transparent;
  position: relative;
  transition: all 0.2s ease;
}

.tahaca-sidebar__menu-link.dashboard {
  background-color: #E30613 !important;
  border-radius: 6px;
  color: #ffffff !important;
  font-weight: 500;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  border-left: 4px solid transparent !important;
  padding: 12px 11px !important;
}

.tahaca-sidebar__menu-link.dashboard.active {
  background-color: #E30613 !important;
  border-left: 4px solid transparent !important;
  padding: 12px 11px !important;
}

.tahaca-sidebar__menu-link.dashboard .tahaca-sidebar__icon {
  color: #ffffff;
}

.tahaca-sidebar__menu-link.styled {
  border-radius: 6px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  border-left: 4px solid transparent;
  padding: 12px 11px !important;
}

.tahaca-sidebar__menu-link.styled.active {
  background-color: rgba(255, 255, 255, 0.1);
  color: #fcfcfc;
  font-weight: 500;
  border-radius: 6px;
  border-left: 4px solid #E30613;
  padding: 12px 11px !important;
}

.tahaca-sidebar__menu-link.styled.active .tahaca-sidebar__icon {
  color: #ffffff;
}

.tahaca-sidebar__icon {
  color: white;
  font-size: 18px;
  min-width: 24px;
  margin-right: 12px;
  transition: color 0.2s;
}

.tahaca-sidebar__menu-text {
  font-size: 14px;
  font-weight: 400;
  white-space: nowrap;
  opacity: 1;
  transition: opacity 0.2s;
}

.tahaca-sidebar.collapsed .tahaca-sidebar__menu-text {
  opacity: 0;
  width: 0;
  display: none;
}

.tahaca-sidebar.collapsed .tahaca-sidebar__menu-link {
  justify-content: center;
  padding: 15px 0;
}

.tahaca-sidebar.collapsed .tahaca-sidebar__icon {
  margin-right: 0;
  font-size: 20px;
}

.tahaca-sidebar__footer {
  padding: 15px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.tahaca-sidebar__logout-btn {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 12px 15px;
  background-color: rgba(255, 255, 255, 0.9);
  border: none;
  border-radius: 6px;
  color: #0F447E;
  cursor: pointer;
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  font-weight: 500;
  transition: all 0.2s;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.tahaca-sidebar__logout-btn .tahaca-sidebar__icon {
  color: #0F447E;
}

.tahaca-sidebar__logout-btn:hover {
  background-color: rgba(255, 255, 255, 1);
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.tahaca-sidebar.collapsed .tahaca-sidebar__logout-btn {
  justify-content: center;
  padding: 12px 0;
}

.tahaca-sidebar.collapsed .tahaca-sidebar__logout-btn .tahaca-sidebar__menu-text {
  display: none;
}

.tahaca-sidebar__nav::-webkit-scrollbar {
  width: 5px;
}

.tahaca-sidebar__nav::-webkit-scrollbar-track {
  background: transparent;
}

.tahaca-sidebar__nav::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.2);
  border-radius: 10px;
}

.content-container {
  padding: 15px;
  box-sizing: border-box;
  width: 100%;
}

.content-flex {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  padding: 15px 0;
}

.content-item {
  background: white;
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
  padding: 15px;
  flex: 1 1 300px;
}

.content-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  grid-gap: 15px;
  gap: 15px;
  padding: 15px 0;
}

.tahaca-sidebar__submenu-arrow {
  margin-left: auto;
  font-size: 12px;
  transition: transform 0.3s ease;
}

.tahaca-sidebar__submenu-arrow.open {
  transform: rotate(180deg);
}

.tahaca-sidebar__submenu {
  list-style: none;
  padding: 0;
  margin: 5px 0 5px 20px;
  overflow: hidden;
  transition: max-height 0.3s ease;
  background-color: rgba(0, 0, 0, 0.15);
  border-radius: 6px;
}

.tahaca-sidebar__submenu-header {
  display: none;
}

.tahaca-sidebar__submenu-item {
  margin: 2px 0;
}

.tahaca-sidebar__submenu-link {
  display: flex;
  align-items: center;
  padding: 10px 12px;
  color: rgba(255, 255, 255, 0.85);
  text-decoration: none;
  font-size: 13px;
  transition: all 0.2s;
  border-left: 3px solid transparent;
}

.tahaca-sidebar__submenu-link:hover {
  background-color: rgba(255, 255, 255, 0.1);
  color: white;
  border-left: 3px solid #E30613;
}

.tahaca-sidebar__submenu-link.active {
  background-color: rgba(255, 255, 255, 0.15);
  color: white;
  border-left: 3px solid #E30613;
}

.tahaca-sidebar__submenu-icon {
  font-size: 14px;
  min-width: 20px;
  margin-right: 8px;
  color: rgba(255, 255, 255, 0.7);
}

.tahaca-sidebar__submenu-text {
  font-weight: 400;
}

.tahaca-sidebar.collapsed .tahaca-sidebar__submenu {
  position: absolute;
  left: 70px;
  top: 0;
  width: 200px;
  margin: 0;
  z-index: 200;
  background-color: #0F447E;
  box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.2);
  border-radius: 0 6px 6px 0;
}

.tahaca-sidebar.collapsed .tahaca-sidebar__submenu-item {
  margin: 0;
}

.tahaca-sidebar.collapsed .submenu-active .tahaca-sidebar__menu-link {
  background-color: rgba(255, 255, 255, 0.1);
}

.tahaca-sidebar.collapsed .tahaca-sidebar__menu-link {
  position: relative;
}

.tahaca-sidebar.collapsed .tahaca-sidebar__menu-link::after {
  content: attr(data-tooltip);
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
  background-color: #0F447E;
  color: white;
  padding: 6px 12px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 400;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
  z-index: 1000;
  margin-left: 15px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  pointer-events: none;
}

.tahaca-sidebar.collapsed .tahaca-sidebar__menu-link:hover::after {
  opacity: 1;
  visibility: visible;
  margin-left: 20px;
}

.tahaca-sidebar.collapsed .tahaca-sidebar__submenu-link::after {
  content: attr(data-tooltip);
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
  background-color: #0F447E;
  color: white;
  padding: 6px 12px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 400;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
  z-index: 1000;
  margin-left: 15px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  pointer-events: none;
}

.tahaca-sidebar.collapsed .tahaca-sidebar__submenu-link:hover::after {
  opacity: 1;
  visibility: visible;
  margin-left: 20px;
}

/* Overlay pour mobile */
.tahaca-sidebar__overlay {
  display: none;
}

/* ============================================
   MEDIA QUERY MOBILE - DESIGN ÉPURÉ
   ============================================ */
@media (max-width: 768px) {
  .tahaca-sidebar {
    width: 250px;
    min-width: 250px;
    max-width: 250px;
    left: -100%;
    transition: left 0.3s ease;
    z-index: 1000;
    box-shadow: 8px 0 30px rgba(0, 0, 0, 0.4);
    background: #0F447E;
    overflow-x: hidden;
    overflow-y: auto;
  }
  
  .tahaca-sidebar.mobile-open {
    left: 0;
  }
  
  .tahaca-sidebar__overlay {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 999;
  }
  
  .tahaca-sidebar__close-btn {
    display: flex;
  }
  
  .tahaca-sidebar__collapse-btn {
    display: none;
  }
  
  .tahaca-sidebar__logo-container {
    display: flex;
    padding: 25px 20px;
    height: auto;
    min-height: 90px;
    border-bottom: none;
  }
  
  .tahaca-sidebar__logo {
    max-height: 65px;
    max-width: 75%;
  }
  
  .tahaca-sidebar__nav {
    margin-top: 15px;
    padding: 0 12px 20px;
    overflow-y: auto;
    overflow-x: hidden;
  }
  
  .tahaca-sidebar__menu-item {
    margin: 10px 0;
    padding: 0;
  }
  
  .tahaca-sidebar__menu-link {
    padding: 16px 14px !important;
    border-radius: 8px;
    transition: none;
    border-left: 4px solid transparent !important;
    display: flex;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
  }
  
  .tahaca-sidebar__menu-text {
    display: block !important;
    opacity: 1 !important;
    width: auto !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
    line-height: 1.4;
    flex: 1 1;
  }
  
  .tahaca-sidebar__icon {
    margin-right: 16px !important;
    font-size: 20px !important;
    flex-shrink: 0;
    min-width: 20px;
  }
  
  .tahaca-sidebar__menu-link.dashboard {
    background: #E30613 !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
    border-left: 4px solid transparent !important;
    padding: 16px 14px !important;
  }
  
  .tahaca-sidebar__menu-link.dashboard.active {
    background: #E30613 !important;
    border-left: 4px solid transparent !important;
    padding: 16px 14px !important;
  }
  
  .tahaca-sidebar__menu-link.styled {
    background: transparent;
    box-shadow: none;
    border-left: 4px solid transparent !important;
    padding: 16px 14px !important;
  }
  
  .tahaca-sidebar__menu-link.styled.active {
    background: rgba(255, 255, 255, 0.12) !important;
    border-left: 4px solid #E30613 !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
    padding: 16px 14px !important;
  }
  
  .tahaca-sidebar__footer {
    padding: 16px 12px;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    margin-top: auto;
  }
  
  .tahaca-sidebar__logout-btn {
    padding: 14px 18px !important;
    border-radius: 8px;
    font-size: 15px !important;
    font-weight: 500 !important;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
    transition: background 0.2s ease;
    display: flex;
    align-items: center;
    width: 100%;
  }
  
  .tahaca-sidebar__logout-btn:hover {
    background: rgba(255, 255, 255, 1);
  }
  
  .tahaca-sidebar__logout-btn .tahaca-sidebar__menu-text {
    display: block !important;
    font-size: 15px !important;
    white-space: nowrap !important;
  }
  
  .tahaca-sidebar__logout-btn .tahaca-sidebar__icon {
    font-size: 18px !important;
    margin-right: 14px !important;
  }
  
  .tahaca-main-content,
  .tahaca-main-content.sidebar-collapsed {
    margin-left: 0;
    width: 100%;
    padding: 70px 10px 10px 10px;
  }
  
  .content-item {
    flex: 1 1 100%;
  }
  
  .content-grid {
    grid-template-columns: 1fr;
  }

  /* IMPORTANT: Styles pour afficher le sous-menu Paramètres sur mobile */
  .tahaca-sidebar__submenu {
    position: fixed !important;
    left: 60px !important;
    top: 10vh !important;
    bottom: 10vh !important;
    width: 240px !important;
    margin: 0 !important;
    background-color: #0F447E !important;
    box-shadow: 3px 0px 15px rgba(0, 0, 0, 0.4) !important;
    border-radius: 0 8px 8px 0 !important;
    z-index: 500 !important;
    max-height: none !important;
    height: auto !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 0 !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* Header du sous-menu avec titre et bouton fermer */
  .tahaca-sidebar__submenu-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 15px 16px !important;
    background-color: rgba(0, 0, 0, 0.2) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 10 !important;
    margin: 0 !important;
  }

  .tahaca-sidebar__submenu-title {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: white !important;
    display: flex !important;
    align-items: center !important;
  }

  .tahaca-sidebar__submenu-close {
    background: none !important;
    border: none !important;
    color: white !important;
    font-size: 20px !important;
    cursor: pointer !important;
    padding: 5px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    transition: all 0.2s ease !important;
  }

  .tahaca-sidebar__submenu-close:hover {
    background-color: rgba(255, 255, 255, 0.1) !important;
  }

  .tahaca-sidebar__submenu-close:active {
    background-color: rgba(255, 255, 255, 0.2) !important;
    transform: scale(0.95) !important;
  }

  .tahaca-sidebar__submenu::-webkit-scrollbar {
    width: 4px;
  }

  .tahaca-sidebar__submenu::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 10px;
  }

  .tahaca-sidebar__submenu::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.3);
    border-radius: 10px;
  }

  .tahaca-sidebar__submenu::-webkit-scrollbar-thumb:hover {
    background-color: rgba(255, 255, 255, 0.5);
  }

  .tahaca-sidebar__submenu-item {
    margin: 0 !important;
  }

  .tahaca-sidebar__submenu-link {
    padding: 14px 16px !important;
    font-size: 14px !important;
    white-space: normal !important;
    word-wrap: break-word !important;
    display: flex !important;
    align-items: center !important;
  }

  .tahaca-sidebar__submenu-icon {
    font-size: 16px !important;
    min-width: 24px !important;
    margin-right: 12px !important;
    flex-shrink: 0 !important;
  }

  .tahaca-sidebar__submenu-text {
    display: block !important;
    line-height: 1.4 !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  .tahaca-sidebar__menu-item.submenu-active {
    z-index: 500 !important;
    overflow: visible !important;
  }

  .tahaca-sidebar__submenu-arrow {
    display: none !important;
  }

  /* Enlever les tooltips sur mobile */
  .tahaca-sidebar__menu-link::after,
  .tahaca-sidebar__submenu-link::after {
    display: none !important;
  }
}

@media (max-width: 380px) {
  .tahaca-sidebar {
    width: 85vw;
    min-width: 260px;
  }
  
  .tahaca-sidebar__menu-text {
    font-size: 15px !important;
  }
  
  .tahaca-sidebar__icon {
    font-size: 19px !important;
  }
  
  .tahaca-sidebar__menu-link {
    padding: 13px 14px;
  }
}
.Admin-accommodations-container {
  padding: 10px;
  max-width: 1920px;
  width: 100%;
}

.Admin-accommodations-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 20px;
  gap: 20px;
}

.Admin-appartements-column, 
.Admin-hotels-column {
  width: 100%;
}

/* Styles responsifs */
@media (max-width: 992px) {
  .Admin-accommodations-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

@media (max-width: 768px) {
  .Admin-accommodations-container {
    padding: 15px;
  }
}

@media (max-width: 576px) {
  .Admin-accommodations-container {
    padding: 10px;
  }
}
.Admin-accommodation-card {
  display: flex;
  background-color: #f8f9fa;
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 16px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  transition: transform 0.2s ease-in-out;
}

/* .Admin-accommodation-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
} */

.Admin-accommodation-card-image {
  width: 80px;
  min-width: 80px;
  height: 80px;
  overflow: hidden;
}

.Admin-accommodation-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.Admin-accommodation-card-content {
  display: flex;
  justify-content: space-between;
  flex-grow: 1;
  padding: 12px 16px;
}

.Admin-accommodation-card-info {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.Admin-accommodation-card-title {
  font-weight: 600;
  font-size: 16px;
  color: #0a3d62;
  margin-bottom: 2px;
}

.Admin-accommodation-card-subtitle {
  font-weight: 500;
  font-size: 14px;
  color: #1e5f74;
  margin-bottom: 4px;
}

.Admin-accommodation-card-location {
  font-size: 14px;
  color: #6c757d;
}

.Admin-accommodation-card-stats {
  display: flex;
  align-items: center;
  gap: 15px;
}

.Admin-accommodation-card-views,
.Admin-accommodation-card-likes {
  display: flex;
  align-items: center;
  color: #6c757d;
  font-size: 14px;
}

.Admin-accommodation-card-views i,
.Admin-accommodation-card-likes i {
  margin-right: 5px;
  font-size: 16px;
}

.Admin-accommodation-card-views i {
  color: #e74c3c;
}

.Admin-accommodation-card-likes i {
  color: #e74c3c;
}

.Admin-accommodation-card-actions {
  display: flex;
  gap: 8px;
  margin-left: 15px;
}

@media (max-width: 768px) {
  .Admin-accommodation-card-stats {
    gap: 10px;
  }
  
  .Admin-accommodation-card-content {
    padding: 10px;
  }
}

@media (max-width: 576px) {
  .Admin-accommodation-card-stats {
    flex-direction: column;
    align-items: flex-end;
    gap: 5px;
  }
  
  .Admin-accommodation-card-actions {
    margin-left: 0;
    margin-top: 5px;
  }
}
.Admin-appartements-section {
  background-color: #fff;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  height: 100%;
}

.Admin-section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 1px solid #e9ecef;
}

.Admin-section-header h2 {
  font-size: 20px;
  font-weight: 600;
  color: #0a3d62;
  margin: 0;
}

.Admin-add-button {
  background-color: #0a4b8c;
  color: white;
  border: none;
  border-radius: 6px;
  padding: 8px 15px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: background-color 0.2s;
}

.Admin-add-button:hover {
  background-color: #083c6f;
}

.Admin-appartements-list {
  margin-bottom: 20px;
}

.Admin-view-all {
  display: flex;
  justify-content: center;
}

.Admin-view-all-button {
  background-color: transparent;
  color: #0a4b8c;
  border: 1px solid #0a4b8c;
  border-radius: 6px;
  padding: 8px 20px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

/* .Admin-view-all-button:hover {
  background-color: rgba(10, 75, 140, 0.1);
} */

@media (max-width: 992px) {
  .Admin-appartements-section {
    margin-bottom: 20px;
  }
}

@media (max-width: 576px) {
  .Admin-section-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  
  .Admin-add-button {
    align-self: flex-end;
  }
}
.Admin-hotels-section {
  background-color: #fff;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  height: 100%;
}

.Admin-section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 1px solid #e9ecef;
}

.Admin-section-header h2 {
  font-size: 20px;
  font-weight: 600;
  color: #0a3d62;
  margin: 0;
}

.Admin-add-button {
  background-color: #0a4b8c;
  color: white;
  border: none;
  border-radius: 6px;
  padding: 8px 15px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: background-color 0.2s;
}

.Admin-add-button:hover {
  background-color: #083c6f;
}

.Admin-hotels-list {
  margin-bottom: 20px;
}

.Admin-view-all {
  display: flex;
  justify-content: center;
}

.Admin-view-all-button {
  background-color: transparent;
  color: #0a4b8c;
  border: 1px solid #0a4b8c;
  border-radius: 6px;
  padding: 8px 20px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

/* .Admin-view-all-button:hover {
  background-color: rgba(10, 75, 140, 0.1);
} */

@media (max-width: 992px) {
  .Admin-hotels-section {
    margin-bottom: 20px;
  }
}

@media (max-width: 576px) {
  .Admin-section-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  
  .Admin-add-button {
    align-self: flex-end;
  }
}

.stat-value-skeleton {
  width: 30%;
  height: 10px;
  border-radius: 8px;
  background: linear-gradient(90deg, #f0f2f5 25%, #e0e3e7 50%, #f0f2f5 75%);
  background-size: 200% 100%;
  animation: shimmer 1.2s infinite;
  margin: 8px 0;
}

@keyframes shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Styles de base pour le conteneur principal */
.dashboard-container {
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
  background-color: #f8fafc;
  transition: filter 0.3s ease;
}

/* Effet de flou quand le modal est ouvert */
.blur-background {
  filter: blur(5px);
  pointer-events: none;
}

/* Grille pour les cartes de statistiques */
.dashboard-stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  grid-gap: 12px;
  gap: 12px;
  max-width: 1920px;
  margin: 0 auto;
}

/* Style pour chaque carte de statistique */
.dashboard-stat-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: white;
  border-radius: 10px;
  padding: 16px 20px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
  border: 1px solid #f0f0f0;
  position: relative;
  overflow: hidden;
  transition: all 0.3s ease;
  height: 100%;
  min-height: 90px;
}

/* Effet au survol modifié pour être plus accessible sur mobile */
/* @media (hover: hover) {
  .dashboard-stat-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
  }
} */

/* Bordure bleue en haut des cartes */
.dashboard-stat-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: #0F447E;
}

/* Animation au survol des cartes */
/* .dashboard-stat-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
} */

/* Contenu principal de la carte */
.dashboard-stat-content {
  flex: 1 1;
  display: flex;
  flex-direction: column;
}

/* En-tête de la carte avec titre et icône de visibilité */
.dashboard-stat-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

/* Style pour le titre des statistiques */
.dashboard-stat-title {
  font-size: 14px;
  font-weight: 500;
  color: #64748b;
  margin: 0;
}

/* Style pour la valeur principale */
.dashboard-stat-value {
  font-size: 24px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 10px;
}

/* Style pour la variation (positive ou négative) */
.dashboard-stat-variation {
  display: flex;
  align-items: center;
  font-size: 12px;
  font-weight: 500;
}

/* Variation positive (rouge) */
.dashboard-positive {
  color: #e30613;
}

/* Variation positive - flèche vers le haut */
.dashboard-positive::before {
  content: '↑';
  display: inline-block;
  margin-right: 2px;
}

/* Variation négative (rouge) */
.dashboard-negative {
  color: #e30613;
}

/* Variation négative - flèche vers le bas */
.dashboard-negative::before {
  content: '↓';
  display: inline-block;
  margin-right: 2px;
}

/* Container pour les icônes */
.dashboard-icon-container {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 6px;
  background-color: #f7fafc;
  color: #94a3b8;
  margin-left: 10px;
}

/* Styles pour l'icône */
.dashboard-icon {
  color: #94a3b8;
}

/* Bouton de visibilité (œil) */
.dashboard-visibility-toggle {
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  color: #94a3b8;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  transition: all 0.2s;
}

.dashboard-visibility-toggle:hover {
  background-color: #f1f5f9;
  color: #1e293b;
}

/* Icône de stylo (personnalisée) */
.dashboard-pencil-icon {
  position: relative;
  width: 24px;
  height: 24px;
}

.dashboard-pencil-icon::before {
  content: '';
  position: absolute;
  width: 3px;
  height: 16px;
  background-color: #94a3b8;
  transform: rotate(45deg);
  top: 3px;
  left: 12px;
}

.dashboard-pencil-icon::after {
  content: '';
  position: absolute;
  width: 8px;
  height: 3px;
  background-color: #94a3b8;
  top: 4px;
  left: 6px;
  transform: rotate(45deg);
}

/* ==============================================
   STYLES POUR LE MODAL DE MOT DE PASSE
   ============================================== */

/* Overlay du modal avec effet de flou */
.password-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
  min-width: 100%;
}

/* Container principal du modal */
.password-modal {
  background: white;
  border-radius: 16px;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  max-width: 400px;
  max-height: 90vh;
  overflow-y: auto;
  animation: modalSlideIn 0.3s ease-out;
}

/* Animation d'ouverture du modal */
@keyframes modalSlideIn {
  from {
    opacity: 0;
    transform: translateY(-20px) scale(0.95);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* En-tête du modal */
.password-modal-header {
  padding: 24px 24px 16px;
  text-align: center;
  position: relative;
  border-bottom: 1px solid #e5e7eb;
}

/* Icône du cadenas dans l'en-tête */
.password-modal-icon {
  width: 64px;
  height: 64px;
  background: linear-gradient(135deg, #0F447E, #1e40af);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 16px;
  color: white;
}

/* Titre du modal */
.password-modal-header h2 {
  margin: 0;
  font-size: 24px;
  font-weight: 600;
  color: #1f2937;
}

/* Bouton de fermeture (X) */
.password-modal-close {
  position: absolute;
  top: 16px;
  right: 16px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  border-radius: 6px;
  color: #6b7280;
  transition: all 0.2s;
}

.password-modal-close:hover {
  background-color: #f3f4f6;
  color: #374151;
}

/* Corps du modal */
.password-modal-body {
  padding: 24px;
}

.password-modal-body p {
  margin: 0 0 20px;
  color: #6b7280;
  text-align: center;
  line-height: 1.5;
}

/* Container pour le champ de saisie */
.password-input-container {
  position: relative;
  margin-bottom: 16px;
}

/* Champ de saisie du mot de passe */
.password-input {
  width: 100%;
  padding: 12px 16px;
  padding-right: 48px;
  border: 2px solid #e5e7eb;
  border-radius: 8px;
  font-size: 16px;
  transition: all 0.2s;
  box-sizing: border-box;
}

.password-input:focus {
  outline: none;
  border-color: #0F447E;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.password-input.dashboard-nip-error {
  border-color: #e30613;
}

/* Bouton pour afficher/masquer le mot de passe */
.password-toggle-btn {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  color: #6b7280;
  border-radius: 4px;
  transition: all 0.2s;
}

.password-toggle-btn:hover {
  background-color: #f3f4f6;
  color: #374151;
}

/* Message d'erreur */
.password-error {
  color: #e30613;
  font-size: 14px;
  margin-top: 8px;
  padding: 8px 12px;
  background-color: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 6px;
}

/* Bloc d'information de démonstration */
.demo-info {
  background: linear-gradient(135deg, #f0f9ff, #e0f2fe);
  border: 1px solid #bae6fd;
  border-radius: 8px;
  padding: 16px;
  margin-top: 16px;
  text-align: center;
}

.demo-info p {
  margin: 0;
  font-size: 14px;
}

.demo-info p:first-child {
  font-weight: 600;
  color: #0369a1;
  margin-bottom: 4px;
}

.demo-info code {
  background-color: #1e293b;
  color: #e2e8f0;
  padding: 2px 6px;
  border-radius: 4px;
  font-family: 'Monaco', 'Consolas', monospace;
  font-size: 13px;
}

/* Pied de page du modal avec les boutons */
.password-modal-footer {
  padding: 16px 24px 24px;
  display: flex;
  gap: 12px;
  justify-content: flex-end;
}

/* Styles pour les boutons */
.password-btn-cancel,
.password-btn-submit {
  padding: 10px 20px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
  border: none;
}

/* Bouton Annuler */
.password-btn-cancel {
  background-color: #f3f4f6;
  color: #374151;
}

.password-btn-cancel:hover {
  background-color: #e5e7eb;
}

/* Bouton Valider */
.password-btn-submit {
  background: linear-gradient(135deg, #0F447E, #1e40af);
  color: white;
}

.password-btn-submit:hover:not(:disabled) {
  background: linear-gradient(135deg, #0F447E, #1d4ed8);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.4);
}

.password-btn-submit:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* ==============================================
   STYLES POUR LA RÉACTIVITÉ
   ============================================== */

@media (max-width: 1200px) {
  .dashboard-stats-grid {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 12px;
    padding: 0 8px;
  }
}

@media (max-width: 768px) {
  .dashboard-container {
    padding: 8px;
  }

  .dashboard-stats-grid {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 10px;
  }

  .dashboard-stat-card {
    padding: 14px 16px;
  }

  .dashboard-stat-value {
    font-size: 22px;
    margin-bottom: 8px;
  }

  .dashboard-icon-container {
    width: 36px;
    height: 36px;
  }

  /* Ajustements du modal sur tablette */
  .password-modal {
    margin: 16px;
  }

  .password-modal-header,
  .password-modal-body,
  .password-modal-footer {
    padding-left: 16px;
    padding-right: 16px;
  }
}

@media (max-width: 480px) {
  .dashboard-stats-grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .dashboard-stat-card {
    padding: 12px 14px;
  }

  .dashboard-stat-title {
    font-size: 13px;
  }

  .dashboard-stat-value {
    font-size: 20px;
    margin-bottom: 6px;
  }

  .dashboard-stat-variation {
    font-size: 11px;
  }

  .dashboard-icon-container {
    width: 32px;
    height: 32px;
  }

  /* Ajustements du modal sur mobile */
  .password-modal-footer {
    flex-direction: column;
  }

  .password-btn-cancel,
  .password-btn-submit {
    width: 100%;
  }
}
/* UserAddPopup.css */

/* Import de la police Poppins */

/* Container principal */
.UserAddPopup-main-container {
  font-family: 'Poppins', sans-serif;
  background-color: white;
  padding: 2.5rem;
  border-radius: 1.5rem;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  max-width: 42rem;
  margin: 10px auto;
  width: 100%;
  box-sizing: border-box;
}

/* Titre */
.UserAddPopup-main-title {
  font-size: 1.25rem;
  font-weight: 600;
  text-align: left;
  margin-bottom: 1.5rem;
  color: #0C447E;
}

.UserAddPopup-main-title-highlight {
  color: #ef4444; 
}

/* Formulaire principal */
.UserAddPopup-main-form {
  width: 100%;
}

/* Grille du formulaire */
.UserAddPopup-main-form-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 1rem;
  gap: 1rem;
}

/* Groupes de formulaire */
.UserAddPopup-main-form-group {
  margin-bottom: 1rem;
}

.UserAddPopup-main-full-width {
  grid-column: span 2;
}

/* Labels */
.UserAddPopup-main-label {
  display: block;
  font-size: 0.875rem;
  margin-bottom: 0.25rem;
  font-weight: 500;
}

.UserAddPopup-main-required {
  color: #ef4444; /* Rouge */
}

/* Inputs standards */
.UserAddPopup-main-input {
  width: 100%;
  padding: 0.5rem 0.75rem;
  border: 1px solid #e2e8f0;
  border-radius: 0.25rem;
  font-size: 0.875rem;
  outline: none;
  transition: border-color 0.2s ease;
  box-sizing: border-box;
}

.UserAddPopup-main-input:focus {
  border-color: #0C447E;
  box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.5);
}

/* Container de mot de passe */
.UserAddPopup-main-password-container {
  position: relative;
}

.UserAddPopup-main-password-toggle {
  position: absolute;
  right: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Select */
.UserAddPopup-main-select {
  width: 100%;
  padding: 0.5rem 0.75rem;
  border: 1px solid #e2e8f0;
  border-radius: 0.25rem;
  font-size: 0.875rem;
  color: #6b7280;
  background-color: white;
  -webkit-appearance: none;
          appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2716%27 height=%2716%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%236b7280%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpath d=%27M6 9l6 6 6-6%27/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 1rem;
  padding-right: 2rem;
  box-sizing: border-box;
}

.UserAddPopup-main-select:focus {
  border-color: #3b82f6;
  outline: none;
  box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.5);
}

/* ================================ */
/* STYLES POUR LES RADIO BUTTONS */
/* ================================ */

.UserAddPopup-main-radio-group {
  display: flex;
  gap: 1rem;
  margin-top: 0.5rem;
  flex-wrap: wrap;
}

.UserAddPopup-main-radio-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.UserAddPopup-main-radio {
  width: 1rem;
  height: 1rem;
  border: 2px solid #e2e8f0;
  border-radius: 50%;
  -webkit-appearance: none;
          appearance: none;
  cursor: pointer;
  position: relative;
  transition: all 0.2s ease;
  background-color: white;
  flex-shrink: 0;
}

.UserAddPopup-main-radio:checked {
  border-color: #0C447E;
  background-color: #0C447E;
}

.UserAddPopup-main-radio:checked::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 50%;
  background-color: white;
}

.UserAddPopup-main-radio:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(12, 68, 126, 0.2);
}

.UserAddPopup-main-radio-label {
  font-size: 0.875rem;
  font-weight: 400;
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
  color: #374151;
}

.UserAddPopup-main-radio:checked + .UserAddPopup-main-radio-label {
  color: #0C447E;
  font-weight: 500;
}

/* Boutons */
.UserAddPopup-main-buttons {
  display: flex;
  justify-content: flex-end;
  gap: 1rem;
  margin-top: 1.5rem;
}

.UserAddPopup-main-cancel-button {
  padding: 0.5rem 1rem;
  background-color: #fee2e2;
  color: #ef4444;
  border-radius: 0.5rem;
  font-weight: 500;
  border: none;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.UserAddPopup-main-cancel-button:hover {
  background-color: #fecaca;
}

.UserAddPopup-main-save-button {
  padding: 0.5rem 1rem;
  background-color: #0C447E;
  color: white;
  border-radius: 0.5rem;
  font-weight: 500;
  border: none;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.UserAddPopup-main-save-button:hover {
  background-color: #1e3a8a;
}

/* Placeholder style */
.UserAddPopup-main-input::placeholder {
  color: #9ca3af;
  opacity: 1;
}

/* ================================ */
/* RESPONSIVE DESIGN */
/* ================================ */

/* Tablettes (768px et moins) */
@media (max-width: 768px) {
  .UserAddPopup-main-container {
    padding: 2rem;
    margin: 10px;
    border-radius: 1rem;
    max-width: none;
  }

  .UserAddPopup-main-title {
    font-size: 1.125rem;
    margin-bottom: 1.25rem;
    text-align: center;
  }

  .UserAddPopup-main-form-grid {
    gap: 0.875rem;
  }

  .UserAddPopup-main-buttons {
    justify-content: center;
    margin-top: 1.25rem;
  }

  .UserAddPopup-main-cancel-button,
  .UserAddPopup-main-save-button {
    padding: 0.625rem 1.25rem;
    font-size: 0.875rem;
  }

  /* Radio buttons en responsive */
  .UserAddPopup-main-radio-group {
    gap: 0.75rem;
  }
}

/* Mobiles (480px et moins) */
@media (max-width: 480px) {
  .UserAddPopup-main-container {
    padding: 1.5rem;
    margin: 5px;
    border-radius: 0.75rem;
  }

  .UserAddPopup-main-title {
    font-size: 1rem;
    margin-bottom: 1rem;
  }

  /* Passage en une seule colonne sur mobile */
  .UserAddPopup-main-form-grid {
    grid-template-columns: 1fr;
    gap: 0.75rem;
  }

  .UserAddPopup-main-full-width {
    grid-column: span 1;
  }

  .UserAddPopup-main-form-group {
    margin-bottom: 0.75rem;
  }

  .UserAddPopup-main-label {
    font-size: 0.8125rem;
    margin-bottom: 0.375rem;
  }

  .UserAddPopup-main-input,
  .UserAddPopup-main-select {
    padding: 0.75rem;
    font-size: 1rem; /* Augmentation pour éviter le zoom automatique sur iOS */
  }

  .UserAddPopup-main-password-toggle {
    right: 1rem;
  }

  .UserAddPopup-main-select {
    background-position: right 1rem center;
    padding-right: 2.5rem;
  }

  .UserAddPopup-main-buttons {
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 1rem;
  }

  .UserAddPopup-main-cancel-button,
  .UserAddPopup-main-save-button {
    width: 100%;
    padding: 0.75rem;
    font-size: 1rem;
    border-radius: 0.5rem;
  }

  /* Radio buttons sur mobile - passage en colonne */
  .UserAddPopup-main-radio-group {
    flex-direction: column;
    gap: 0.5rem;
    align-items: flex-start;
  }

  .UserAddPopup-main-radio-item {
    width: 100%;
  }

  .UserAddPopup-main-radio-label {
    font-size: 1rem;
  }
}

/* Très petits écrans (320px et moins) */
@media (max-width: 320px) {
  .UserAddPopup-main-container {
    padding: 1rem;
    margin: 2px;
  }

  .UserAddPopup-main-title {
    font-size: 0.9375rem;
  }

  .UserAddPopup-main-input,
  .UserAddPopup-main-select {
    padding: 0.5rem;
  }
}

/* ================================ */
/* STYLES POUR LES ERREURS */
/* ================================ */

.UserAddPopup-main-input-error {
  border-color: #ef4444 !important;
  box-shadow: 0 0 0 1px rgba(239, 68, 68, 0.3) !important;
}

.UserAddPopup-main-error {
  display: block;
  color: #ef4444;
  font-size: 0.75rem;
  margin-top: 0.25rem;
  font-weight: 400;
}

/* ================================ */
/* STYLES POUR L'OVERLAY (optionnel) */
/* ================================ */

.popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  padding: 20px;
  box-sizing: border-box;
  pointer-events: all;
  overflow: hidden;
}

/* Empêcher le défilement du body quand le popup est ouvert */
body.popup-open {
  overflow: hidden;
  position: fixed;
  width: 100%;
  height: 100%;
}

/* Animation d'apparition de la popup */
.popup-overlay {
  animation: fadeIn 0.3s ease-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.UserAddPopup-main-container {
  animation: slideIn 0.3s ease-out;
  max-height: 90vh;
  overflow-y: auto;
  position: relative;
  z-index: 1001;
}

@keyframes slideIn {
  from {
    transform: translateY(-30px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

/* Responsive pour l'overlay */
@media (max-width: 768px) {
  .popup-overlay {
    padding: 10px;
    align-items: flex-start;
    padding-top: 20px;
  }
}

@media (max-width: 480px) {
  .popup-overlay {
    padding: 5px;
    padding-top: 10px;
  }
  
  .UserAddPopup-main-container {
    max-height: 95vh;
    margin: 0;
  }
}

/* ================================ */
/* STYLES POUR LE MESSAGE POPUP     */
/* ================================ */

.UserAddPopup-message {
  padding: 0.75rem 1.25rem;
  border-radius: 0.5rem;
  font-size: 1rem;
  font-weight: 500;
  margin-top: 1rem;
  box-shadow: 0 2px 8px rgba(0,0,0,0.07);
  text-align: center;
  animation: fadeIn 0.3s;
}

.UserAddPopup-message-success {
  background-color: #e6f9ed;
  color: #15803d;
  border: 1px solid #34d399;
}

.UserAddPopup-message-error {
  background-color: #fee2e2;
  color: #b91c1c;
  border: 1px solid #ef4444;
}
/* Container principal */
.UserViewAdmin-container {
  width: 100%;
  padding: 10px;
    max-width: 1920px;
  box-sizing: border-box;
  background-color: #f8fafc;
  transition: filter 0.3s ease;
}

/* En-tête du composant */
.UserViewAdmin-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.UserViewAdmin-title {
  font-size: 18px;
  font-weight: 600;
  color: #0F447E;
  margin: 0;
}

/* Bouton d'ajout */
.UserViewAdmin-add-btn {
  background-color: #0F447E;
  color: white;
  border: none;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
}

.UserViewAdmin-add-btn:hover {
  background-color: #0a3b70;
}

.UserViewAdmin-icon-plus {
  margin-right: 6px;
  font-size: 14px;
}

/* Container de la table */
.UserViewAdmin-table-container {
  overflow-x: auto;
  border-radius: 4px;
  background-color: #f9f9f9;
}

/* Style de la table */
.UserViewAdmin-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}

.UserViewAdmin-th {
  background-color: #f5f5f5;
  font-weight: 500;
  padding: 12px 15px;
  color: #0F447E;
  font-size: 14px;
}

.UserViewAdmin-tr {
  border-bottom: 1px solid #eaeaea;
}

.UserViewAdmin-tr:last-child {
  border-bottom: none;
}

.UserViewAdmin-td {
  padding: 12px 15px;
  font-size: 14px;
  color: #333;
}

/* Style des actions */
.UserViewAdmin-actions {
  display: flex;
  gap: 10px;
}

.UserViewAdmin-action-btn {
  background: none;
  border: none;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.2s;
}

.UserViewAdmin-edit-btn {
  color: #0F447E;
  background-color: rgba(14, 76, 144, 0.1);
}

.UserViewAdmin-edit-btn:hover {
  background-color: rgba(14, 76, 144, 0.2);
}

.UserViewAdmin-delete-btn {
  color: #e30613;
  background-color: rgba(230, 57, 70, 0.1);
}

.UserViewAdmin-delete-btn:hover {
  background-color: rgba(230, 57, 70, 0.2);
}

/* Styles pour le bouton toggle */
.UserViewAdmin-toggle-btn {
  color: #4CAF50;
  background-color: rgba(76, 175, 80, 0.1);
  font-size: 18px;
}

.UserViewAdmin-toggle-btn:hover {
  background-color: rgba(76, 175, 80, 0.2);
}

/* Styles pour le statut */
.user-status {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}

.user-status.active {
  background-color: rgba(40, 167, 69, 0.1);
  color: #28a745;
}

.user-status.inactive {
  background-color: rgba(220, 53, 69, 0.1);
  color: #e30613;
}

/* Styles pour la popup de confirmation */
.user-confirmation-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}

.user-confirmation-content {
  background-color: white;
  border-radius: 8px;
  width: 90%;
  max-width: 400px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  overflow: hidden;
}

.user-confirmation-header {
  padding: 16px;
  background-color: #0F447E;
  border-bottom: 1px solid #e9ecef;
}

.user-confirmation-header h3 {
  margin: 0;
  font-size: 18px;
  color: #ffffff;
}

.user-confirmation-body {
  padding: 20px 16px;
  border-bottom: 1px solid #e9ecef;
}

.user-confirmation-body p {
  margin: 0;
  font-size: 14px;
  color: #333;
}

.user-confirmation-footer {
  padding: 16px;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.user-confirmation-btn {
  padding: 8px 16px;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.user-confirmation-btn-cancel {
  background-color: #f8f9fa;
  color: #6c757d;
  border: 1px solid #dee2e6;
}

.user-confirmation-btn-cancel:hover {
  background-color: #e30613;
  color: white;
}

.user-confirmation-btn-confirm {
  background-color: #0F447E;
  color: white;
  border: 1px solid #0F447E;
}

.user-confirmation-btn-confirm:hover {
  background-color: #0a3b70;
}

/* Styles pour la popup overlay */
.popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}

/* Pied de page */
.UserViewAdmin-footer {
  display: flex;
  justify-content: flex-start;
  margin-top: 20px;
}

.UserViewAdmin-view-all-btn {
    background-color: #0F447E;
    color: white;
    border: none;
    border-radius: 4px;
    padding: 8px 16px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.3s;
    margin-left: auto; /* Aligne le bouton à droite dans un conteneur flex */
    display: block; /* Assure que le bouton prend toute la largeur disponible pour que `margin-left: auto` fonctionne */
}


.UserViewAdmin-view-all-btn:hover {
  background-color: #0a3b70;
}

/* Responsive design */
@media (max-width: 768px) {
  .UserViewAdmin-container {
    padding: 20px;
    margin: 20px auto;
  }
  
  .UserViewAdmin-header {
    flex-direction: row;
    margin-bottom: 15px;
  }
  
  .UserViewAdmin-title {
    font-size: 16px;
  }
  
  .UserViewAdmin-add-btn {
    padding: 6px 12px;
    font-size: 12px;
  }
  
  .UserViewAdmin-th, 
  .UserViewAdmin-td {
    padding: 10px;
    font-size: 13px;
  }
  
  .UserViewAdmin-table-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #0F447E #f0f0f0;
  }
  
  .UserViewAdmin-table-container::-webkit-scrollbar {
    height: 6px;
  }
  
  .UserViewAdmin-table-container::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
  }
  
  .UserViewAdmin-table-container::-webkit-scrollbar-thumb {
    background: #0F447E;
    border-radius: 3px;
  }
  
  .UserViewAdmin-action-btn {
    width: 28px;
    height: 28px;
  }

  /* Popup responsive */
  .user-confirmation-content {
    width: 95%;
    margin: 0 10px;
  }
}

@media (max-width: 480px) {
  .UserViewAdmin-container {
    padding: 15px;
    margin: 15px auto;
    max-width: 98%;
  }
  
  .UserViewAdmin-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  
  .UserViewAdmin-add-btn {
    align-self: flex-start;
  }

  .user-confirmation-header h3 {
    font-size: 16px;
  }

  .user-confirmation-body p {
    font-size: 13px;
  }

  .user-confirmation-btn {
    padding: 6px 12px;
    font-size: 13px;
  }
}
@charset "UTF-8";
.react-datepicker__navigation-icon::before, .react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow {
  border-color: #ccc;
  border-style: solid;
  border-width: 3px 3px 0 0;
  content: "";
  display: block;
  height: 9px;
  position: absolute;
  top: 6px;
  width: 9px;
}
.react-datepicker-wrapper {
  display: inline-block;
  padding: 0;
  border: 0;
}

.react-datepicker {
  font-family: "Helvetica Neue", helvetica, arial, sans-serif;
  font-size: 0.8rem;
  background-color: #fff;
  color: #000;
  border: 1px solid #aeaeae;
  border-radius: 0.3rem;
  display: inline-block;
  position: relative;
  line-height: normal;
  line-height: initial;
}

.react-datepicker--time-only .react-datepicker__time-container {
  border-left: 0;
}
.react-datepicker--time-only .react-datepicker__time,
.react-datepicker--time-only .react-datepicker__time-box {
  border-bottom-left-radius: 0.3rem;
  border-bottom-right-radius: 0.3rem;
}

.react-datepicker-popper {
  z-index: 1;
  line-height: 0;
}
.react-datepicker-popper .react-datepicker__triangle {
  stroke: #aeaeae;
}
.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle {
  fill: #f0f0f0;
  color: #f0f0f0;
}
.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle {
  fill: #fff;
  color: #fff;
}

.react-datepicker__header {
  text-align: center;
  background-color: #f0f0f0;
  border-bottom: 1px solid #aeaeae;
  border-top-left-radius: 0.3rem;
  padding: 8px 0;
  position: relative;
}
.react-datepicker__header--time {
  padding-bottom: 8px;
  padding-left: 5px;
  padding-right: 5px;
}
.react-datepicker__header--time:not(.react-datepicker__header--time--only) {
  border-top-left-radius: 0;
}
.react-datepicker__header:not(.react-datepicker__header--has-time-select) {
  border-top-right-radius: 0.3rem;
}

.react-datepicker__year-dropdown-container--select,
.react-datepicker__month-dropdown-container--select,
.react-datepicker__month-year-dropdown-container--select,
.react-datepicker__year-dropdown-container--scroll,
.react-datepicker__month-dropdown-container--scroll,
.react-datepicker__month-year-dropdown-container--scroll {
  display: inline-block;
  margin: 0 15px;
}

.react-datepicker__current-month,
.react-datepicker-time__header,
.react-datepicker-year-header {
  margin-top: 0;
  color: #000;
  font-weight: bold;
  font-size: 0.944rem;
}

h2.react-datepicker__current-month {
  padding: 0;
  margin: 0;
}

.react-datepicker-time__header {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.react-datepicker__navigation {
  align-items: center;
  background: none;
  display: flex;
  justify-content: center;
  text-align: center;
  cursor: pointer;
  position: absolute;
  top: 2px;
  padding: 0;
  border: none;
  z-index: 1;
  height: 32px;
  width: 32px;
  text-indent: -999em;
  overflow: hidden;
}
.react-datepicker__navigation--previous {
  left: 2px;
}
.react-datepicker__navigation--next {
  right: 2px;
}
.react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button) {
  right: 85px;
}
.react-datepicker__navigation--years {
  position: relative;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.react-datepicker__navigation--years-previous {
  top: 4px;
}
.react-datepicker__navigation--years-upcoming {
  top: -4px;
}
.react-datepicker__navigation:hover *::before {
  border-color: rgb(165.75, 165.75, 165.75);
}

.react-datepicker__navigation-icon {
  position: relative;
  top: -1px;
  font-size: 20px;
  width: 0;
}
.react-datepicker__navigation-icon--next {
  left: -2px;
}
.react-datepicker__navigation-icon--next::before {
  transform: rotate(45deg);
  left: -7px;
}
.react-datepicker__navigation-icon--previous {
  right: -2px;
}
.react-datepicker__navigation-icon--previous::before {
  transform: rotate(225deg);
  right: -7px;
}

.react-datepicker__month-container {
  float: left;
}

.react-datepicker__year {
  margin: 0.4rem;
  text-align: center;
}
.react-datepicker__year-wrapper {
  display: flex;
  flex-wrap: wrap;
  max-width: 180px;
}
.react-datepicker__year .react-datepicker__year-text {
  display: inline-block;
  width: 4rem;
  margin: 2px;
}

.react-datepicker__month {
  margin: 0.4rem;
  text-align: center;
}
.react-datepicker__month .react-datepicker__month-text,
.react-datepicker__month .react-datepicker__quarter-text {
  display: inline-block;
  width: 4rem;
  margin: 2px;
}

.react-datepicker__input-time-container {
  clear: both;
  width: 100%;
  float: left;
  margin: 5px 0 10px 15px;
  text-align: left;
}
.react-datepicker__input-time-container .react-datepicker-time__caption {
  display: inline-block;
}
.react-datepicker__input-time-container .react-datepicker-time__input-container {
  display: inline-block;
}
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input {
  display: inline-block;
  margin-left: 10px;
}
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input {
  width: auto;
}
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-inner-spin-button,
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time] {
  -moz-appearance: textfield;
}
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__delimiter {
  margin-left: 5px;
  display: inline-block;
}

.react-datepicker__time-container {
  float: right;
  border-left: 1px solid #aeaeae;
  width: 85px;
}
.react-datepicker__time-container--with-today-button {
  display: inline;
  border: 1px solid #aeaeae;
  border-radius: 0.3rem;
  position: absolute;
  right: -87px;
  top: 0;
}
.react-datepicker__time-container .react-datepicker__time {
  position: relative;
  background: white;
  border-bottom-right-radius: 0.3rem;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box {
  width: 85px;
  overflow-x: hidden;
  margin: 0 auto;
  text-align: center;
  border-bottom-right-radius: 0.3rem;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list {
  list-style: none;
  margin: 0;
  height: calc(195px + 1.7rem / 2);
  overflow-y: scroll;
  padding-right: 0;
  padding-left: 0;
  width: 100%;
  box-sizing: content-box;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item {
  height: 30px;
  padding: 5px 10px;
  white-space: nowrap;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover {
  cursor: pointer;
  background-color: #f0f0f0;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected {
  background-color: #216ba5;
  color: white;
  font-weight: bold;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover {
  background-color: #216ba5;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled {
  color: #ccc;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled:hover {
  cursor: default;
  background-color: transparent;
}

.react-datepicker__week-number {
  color: #ccc;
  display: inline-block;
  width: 1.7rem;
  line-height: 1.7rem;
  text-align: center;
  margin: 0.166rem;
}
.react-datepicker__week-number.react-datepicker__week-number--clickable {
  cursor: pointer;
}
.react-datepicker__week-number.react-datepicker__week-number--clickable:not(.react-datepicker__week-number--selected):hover {
  border-radius: 0.3rem;
  background-color: #f0f0f0;
}
.react-datepicker__week-number--selected {
  border-radius: 0.3rem;
  background-color: #216ba5;
  color: #fff;
}
.react-datepicker__week-number--selected:hover {
  background-color: rgb(28.75, 93.2196969697, 143.75);
}

.react-datepicker__day-names {
  white-space: nowrap;
  margin-bottom: -8px;
}

.react-datepicker__week {
  white-space: nowrap;
}

.react-datepicker__day-name,
.react-datepicker__day,
.react-datepicker__time-name {
  color: #000;
  display: inline-block;
  width: 1.7rem;
  line-height: 1.7rem;
  text-align: center;
  margin: 0.166rem;
}

.react-datepicker__day,
.react-datepicker__month-text,
.react-datepicker__quarter-text,
.react-datepicker__year-text {
  cursor: pointer;
}
.react-datepicker__day:not([aria-disabled=true]):hover,
.react-datepicker__month-text:not([aria-disabled=true]):hover,
.react-datepicker__quarter-text:not([aria-disabled=true]):hover,
.react-datepicker__year-text:not([aria-disabled=true]):hover {
  border-radius: 0.3rem;
  background-color: #f0f0f0;
}
.react-datepicker__day--today,
.react-datepicker__month-text--today,
.react-datepicker__quarter-text--today,
.react-datepicker__year-text--today {
  font-weight: bold;
}
.react-datepicker__day--highlighted,
.react-datepicker__month-text--highlighted,
.react-datepicker__quarter-text--highlighted,
.react-datepicker__year-text--highlighted {
  border-radius: 0.3rem;
  background-color: #3dcc4a;
  color: #fff;
}
.react-datepicker__day--highlighted:not([aria-disabled=true]):hover,
.react-datepicker__month-text--highlighted:not([aria-disabled=true]):hover,
.react-datepicker__quarter-text--highlighted:not([aria-disabled=true]):hover,
.react-datepicker__year-text--highlighted:not([aria-disabled=true]):hover {
  background-color: rgb(49.8551020408, 189.6448979592, 62.5632653061);
}
.react-datepicker__day--highlighted-custom-1,
.react-datepicker__month-text--highlighted-custom-1,
.react-datepicker__quarter-text--highlighted-custom-1,
.react-datepicker__year-text--highlighted-custom-1 {
  color: magenta;
}
.react-datepicker__day--highlighted-custom-2,
.react-datepicker__month-text--highlighted-custom-2,
.react-datepicker__quarter-text--highlighted-custom-2,
.react-datepicker__year-text--highlighted-custom-2 {
  color: green;
}
.react-datepicker__day--holidays,
.react-datepicker__month-text--holidays,
.react-datepicker__quarter-text--holidays,
.react-datepicker__year-text--holidays {
  position: relative;
  border-radius: 0.3rem;
  background-color: #ff6803;
  color: #fff;
}
.react-datepicker__day--holidays .overlay,
.react-datepicker__month-text--holidays .overlay,
.react-datepicker__quarter-text--holidays .overlay,
.react-datepicker__year-text--holidays .overlay {
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  background-color: #333;
  color: #fff;
  padding: 4px;
  border-radius: 4px;
  white-space: nowrap;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s, opacity 0.3s ease-in-out;
}
.react-datepicker__day--holidays:not([aria-disabled=true]):hover,
.react-datepicker__month-text--holidays:not([aria-disabled=true]):hover,
.react-datepicker__quarter-text--holidays:not([aria-disabled=true]):hover,
.react-datepicker__year-text--holidays:not([aria-disabled=true]):hover {
  background-color: rgb(207, 82.9642857143, 0);
}
.react-datepicker__day--holidays:hover .overlay,
.react-datepicker__month-text--holidays:hover .overlay,
.react-datepicker__quarter-text--holidays:hover .overlay,
.react-datepicker__year-text--holidays:hover .overlay {
  visibility: visible;
  opacity: 1;
}
.react-datepicker__day--selected, .react-datepicker__day--in-selecting-range, .react-datepicker__day--in-range,
.react-datepicker__month-text--selected,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__month-text--in-range,
.react-datepicker__quarter-text--selected,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__quarter-text--in-range,
.react-datepicker__year-text--selected,
.react-datepicker__year-text--in-selecting-range,
.react-datepicker__year-text--in-range {
  border-radius: 0.3rem;
  background-color: #216ba5;
  color: #fff;
}
.react-datepicker__day--selected:not([aria-disabled=true]):hover, .react-datepicker__day--in-selecting-range:not([aria-disabled=true]):hover, .react-datepicker__day--in-range:not([aria-disabled=true]):hover,
.react-datepicker__month-text--selected:not([aria-disabled=true]):hover,
.react-datepicker__month-text--in-selecting-range:not([aria-disabled=true]):hover,
.react-datepicker__month-text--in-range:not([aria-disabled=true]):hover,
.react-datepicker__quarter-text--selected:not([aria-disabled=true]):hover,
.react-datepicker__quarter-text--in-selecting-range:not([aria-disabled=true]):hover,
.react-datepicker__quarter-text--in-range:not([aria-disabled=true]):hover,
.react-datepicker__year-text--selected:not([aria-disabled=true]):hover,
.react-datepicker__year-text--in-selecting-range:not([aria-disabled=true]):hover,
.react-datepicker__year-text--in-range:not([aria-disabled=true]):hover {
  background-color: rgb(28.75, 93.2196969697, 143.75);
}
.react-datepicker__day--keyboard-selected,
.react-datepicker__month-text--keyboard-selected,
.react-datepicker__quarter-text--keyboard-selected,
.react-datepicker__year-text--keyboard-selected {
  border-radius: 0.3rem;
  background-color: rgb(186.25, 217.0833333333, 241.25);
  color: rgb(0, 0, 0);
}
.react-datepicker__day--keyboard-selected:not([aria-disabled=true]):hover,
.react-datepicker__month-text--keyboard-selected:not([aria-disabled=true]):hover,
.react-datepicker__quarter-text--keyboard-selected:not([aria-disabled=true]):hover,
.react-datepicker__year-text--keyboard-selected:not([aria-disabled=true]):hover {
  background-color: rgb(28.75, 93.2196969697, 143.75);
}
.react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range,
.react-datepicker__month-text--in-range,
.react-datepicker__quarter-text--in-range,
.react-datepicker__year-text--in-range),
.react-datepicker__month-text--in-selecting-range:not(.react-datepicker__day--in-range,
.react-datepicker__month-text--in-range,
.react-datepicker__quarter-text--in-range,
.react-datepicker__year-text--in-range),
.react-datepicker__quarter-text--in-selecting-range:not(.react-datepicker__day--in-range,
.react-datepicker__month-text--in-range,
.react-datepicker__quarter-text--in-range,
.react-datepicker__year-text--in-range),
.react-datepicker__year-text--in-selecting-range:not(.react-datepicker__day--in-range,
.react-datepicker__month-text--in-range,
.react-datepicker__quarter-text--in-range,
.react-datepicker__year-text--in-range) {
  background-color: rgba(33, 107, 165, 0.5);
}
.react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range), .react-datepicker__year--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__month--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__year--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__month--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__year--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__month--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__year--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range) {
  background-color: #f0f0f0;
  color: #000;
}
.react-datepicker__day--disabled,
.react-datepicker__month-text--disabled,
.react-datepicker__quarter-text--disabled,
.react-datepicker__year-text--disabled {
  cursor: default;
  color: #ccc;
}
.react-datepicker__day--disabled .overlay,
.react-datepicker__month-text--disabled .overlay,
.react-datepicker__quarter-text--disabled .overlay,
.react-datepicker__year-text--disabled .overlay {
  position: absolute;
  bottom: 70%;
  left: 50%;
  transform: translateX(-50%);
  background-color: #333;
  color: #fff;
  padding: 4px;
  border-radius: 4px;
  white-space: nowrap;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s, opacity 0.3s ease-in-out;
}

.react-datepicker__input-container {
  position: relative;
  display: inline-block;
  width: 100%;
}
.react-datepicker__input-container .react-datepicker__calendar-icon {
  position: absolute;
  padding: 0.5rem;
  box-sizing: content-box;
}

.react-datepicker__view-calendar-icon input {
  padding: 6px 10px 5px 25px;
}

.react-datepicker__year-read-view,
.react-datepicker__month-read-view,
.react-datepicker__month-year-read-view {
  border: 1px solid transparent;
  border-radius: 0.3rem;
  position: relative;
}
.react-datepicker__year-read-view:hover,
.react-datepicker__month-read-view:hover,
.react-datepicker__month-year-read-view:hover {
  cursor: pointer;
}
.react-datepicker__year-read-view:hover .react-datepicker__year-read-view--down-arrow,
.react-datepicker__year-read-view:hover .react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-read-view:hover .react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view:hover .react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view:hover .react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-year-read-view:hover .react-datepicker__month-read-view--down-arrow {
  border-top-color: rgb(178.5, 178.5, 178.5);
}
.react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow {
  transform: rotate(135deg);
  right: -16px;
  top: 0;
}

.react-datepicker__year-dropdown,
.react-datepicker__month-dropdown,
.react-datepicker__month-year-dropdown {
  background-color: #f0f0f0;
  position: absolute;
  width: 50%;
  left: 25%;
  top: 30px;
  z-index: 1;
  text-align: center;
  border-radius: 0.3rem;
  border: 1px solid #aeaeae;
}
.react-datepicker__year-dropdown:hover,
.react-datepicker__month-dropdown:hover,
.react-datepicker__month-year-dropdown:hover {
  cursor: pointer;
}
.react-datepicker__year-dropdown--scrollable,
.react-datepicker__month-dropdown--scrollable,
.react-datepicker__month-year-dropdown--scrollable {
  height: 150px;
  overflow-y: scroll;
}

.react-datepicker__year-option,
.react-datepicker__month-option,
.react-datepicker__month-year-option {
  line-height: 20px;
  width: 100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.react-datepicker__year-option:first-of-type,
.react-datepicker__month-option:first-of-type,
.react-datepicker__month-year-option:first-of-type {
  border-top-left-radius: 0.3rem;
  border-top-right-radius: 0.3rem;
}
.react-datepicker__year-option:last-of-type,
.react-datepicker__month-option:last-of-type,
.react-datepicker__month-year-option:last-of-type {
  -webkit-user-select: none;
  user-select: none;
  border-bottom-left-radius: 0.3rem;
  border-bottom-right-radius: 0.3rem;
}
.react-datepicker__year-option:hover,
.react-datepicker__month-option:hover,
.react-datepicker__month-year-option:hover {
  background-color: #ccc;
}
.react-datepicker__year-option:hover .react-datepicker__navigation--years-upcoming,
.react-datepicker__month-option:hover .react-datepicker__navigation--years-upcoming,
.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-upcoming {
  border-bottom-color: rgb(178.5, 178.5, 178.5);
}
.react-datepicker__year-option:hover .react-datepicker__navigation--years-previous,
.react-datepicker__month-option:hover .react-datepicker__navigation--years-previous,
.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-previous {
  border-top-color: rgb(178.5, 178.5, 178.5);
}
.react-datepicker__year-option--selected,
.react-datepicker__month-option--selected,
.react-datepicker__month-year-option--selected {
  position: absolute;
  left: 15px;
}

.react-datepicker__close-icon {
  cursor: pointer;
  background-color: transparent;
  border: 0;
  outline: 0;
  padding: 0 6px 0 0;
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  display: table-cell;
  vertical-align: middle;
}
.react-datepicker__close-icon::after {
  cursor: pointer;
  background-color: #216ba5;
  color: #fff;
  border-radius: 50%;
  height: 16px;
  width: 16px;
  padding: 2px;
  font-size: 12px;
  line-height: 1;
  text-align: center;
  display: table-cell;
  vertical-align: middle;
  content: "×";
}
.react-datepicker__close-icon--disabled {
  cursor: default;
}
.react-datepicker__close-icon--disabled::after {
  cursor: default;
  background-color: #ccc;
}

.react-datepicker__today-button {
  background: #f0f0f0;
  border-top: 1px solid #aeaeae;
  cursor: pointer;
  text-align: center;
  font-weight: bold;
  padding: 5px 0;
  clear: left;
}

.react-datepicker__portal {
  position: fixed;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.8);
  left: 0;
  top: 0;
  justify-content: center;
  align-items: center;
  display: flex;
  z-index: 2147483647;
}
.react-datepicker__portal .react-datepicker__day-name,
.react-datepicker__portal .react-datepicker__day,
.react-datepicker__portal .react-datepicker__time-name {
  width: 3rem;
  line-height: 3rem;
}
@media (max-width: 400px), (max-height: 550px) {
  .react-datepicker__portal .react-datepicker__day-name,
  .react-datepicker__portal .react-datepicker__day,
  .react-datepicker__portal .react-datepicker__time-name {
    width: 2rem;
    line-height: 2rem;
  }
}
.react-datepicker__portal .react-datepicker__current-month,
.react-datepicker__portal .react-datepicker-time__header {
  font-size: 1.44rem;
}

.react-datepicker__children-container {
  width: 13.8rem;
  margin: 0.4rem;
  padding-right: 0.2rem;
  padding-left: 0.2rem;
  height: auto;
}

.react-datepicker__aria-live {
  position: absolute;
  -webkit-clip-path: circle(0);
          clip-path: circle(0);
  border: 0;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  width: 1px;
  white-space: nowrap;
}

.react-datepicker__calendar-icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
}

.dashboard-chart-container {
  position: relative;
  background-color: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
  padding: 16px;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.chart-title {
  font-size: 16px;
  font-weight: 600;
  color: #0f172a;
  margin-top: 0;
  margin-bottom: 16px;
}

.chart-wrapper {
  flex-grow: 1;
  width: 100%;
  background-color: #f8fafc;
  border-radius: 8px;
}

.info-button {
  position: absolute;
  top: 16px;
  right: 16px;
}

.info-button button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: none;
  background-color: #f1f5f9;
  color: #64748b;
  cursor: pointer;
  transition: background-color 0.2s;
}

.info-button button:hover {
  background-color: #e2e8f0;
  color: #334155;
}

@media (max-width: 768px) {
  .dashboard-chart-container {
    padding: 12px;
  }
  
  .chart-title {
    font-size: 14px;
    margin-bottom: 12px;
  }
}
/* DashboardAdmin-CommissionChart.css */
.commission-chart-container {
  padding: 16px;
  background-color: white;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
  border: 1px solid #f0f0f0;
  margin-top: 20px;
  position: relative;
}

.chart-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.chart-header h3 {
  font-size: 16px;
  font-weight: 500;
  color: #0f172a;
  margin: 0;
}

.chart-skeleton {
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #64748b;
  font-size: 14px;
  background-color: #f8fafc;
  border-radius: 8px;
}

/* Réactivité */
@media (max-width: 768px) {
  .commission-chart-container {
    padding: 12px;
    margin-top: 16px;
  }

  .chart-header h3 {
    font-size: 14px;
  }
}

@media (max-width: 480px) {
  .commission-chart-container {
    padding: 10px;
  }

  .chart-header h3 {
    font-size: 13px;
  }
}

/* DashboardAdmin-ProfitChart.css */
.profit-chart-container {
  padding: 16px;
  background-color: white;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
  border: 1px solid #f0f0f0;
  margin-top: 20px;
  position: relative;
  min-height: 300px; /* Hauteur minimale pour le graphique */
}

.chart-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.chart-header h3 {
  font-size: 16px;
  font-weight: 500;
  color: #0f172a;
  margin: 0;
}

.chart-skeleton {
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #64748b;
  font-size: 14px;
  background-color: #f8fafc;
  border-radius: 8px;
}

.chart-error {
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #dc2626; /* Rouge pour les erreurs */
  font-size: 14px;
  background-color: #fef2f2;
  border-radius: 8px;
}

.chart-empty {
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #64748b;
  font-size: 14px;
  background-color: #f8fafc;
  border-radius: 8px;
}

/* Réactivité */
@media (max-width: 768px) {
  .profit-chart-container {
    padding: 12px;
    margin-top: 16px;
  }

  .chart-header h3 {
    font-size: 14px;
  }
}

@media (max-width: 480px) {
  .profit-chart-container {
    padding: 10px;
  }

  .chart-header h3 {
    font-size: 13px;
  }
}
/* DashboardAdmin-ReservationChart.css */
.reservation-chart-container {
  padding: 16px;
  background-color: white;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
  border: 1px solid #f0f0f0;
  margin-top: 20px;
  position: relative;
  min-height: 300px; /* Hauteur minimale pour le graphique */
}

.chart-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.chart-header h3 {
  font-size: 16px;
  font-weight: 500;
  color: #0f172a;
  margin: 0;
}

.chart-skeleton {
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #64748b;
  font-size: 14px;
  background-color: #f8fafc;
  border-radius: 8px;
}

.chart-error {
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #dc2626; /* Rouge pour les erreurs */
  font-size: 14px;
  background-color: #fef2f2;
  border-radius: 8px;
}

.chart-empty {
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #64748b;
  font-size: 14px;
  background-color: #f8fafc;
  border-radius: 8px;
}

/* Réactivité */
@media (max-width: 768px) {
  .reservation-chart-container {
    padding: 12px;
    margin-top: 16px;
  }

  .chart-header h3 {
    font-size: 14px;
  }
}

@media (max-width: 480px) {
  .reservation-chart-container {
    padding: 10px;
  }

  .chart-header h3 {
    font-size: 13px;
  }
}

.financial-charts-container {
  padding: 10px;
  max-width: 1920px;
  width: 100%;
}

.financial-charts-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 20px;
  gap: 20px;
}

.chart-item {
  min-height: 350px;
}

/* Responsive design */
@media (max-width: 1200px) {
  .financial-charts-grid {
    gap: 20px;
  }
}

@media (max-width: 992px) {
  .financial-charts-grid {
    gap: 16px;
  }
}

@media (max-width: 768px) {
  .financial-charts-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .chart-item {
    min-height: 300px;
  }
}

.date-filter {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 20px;
}

.date-filter label {
  font-weight: bold;
}

/* ==========================================================
   OG-MA – Date Filter + React DatePicker (version stable)
   ========================================================== */

.date-filter {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 14px 18px;
  margin-bottom: 28px;
  margin-left: 40px;
  font-family: "Inter", "Poppins", sans-serif;
}

/* Labels */
.date-filter label {
  font-size: 14px;
  font-weight: 500;
  color: #0f447e;
  white-space: nowrap;
  letter-spacing: 0.2px;
}

/* Wrapper du DatePicker */
.date-filter .react-datepicker-wrapper {
  width: 170px;
  flex-shrink: 0;
  position: relative;
}

/* Input stable et solide */
.date-filter input {
  width: 100%;
  height: 42px;
  border: 1px solid #b6beca;
  border-radius: 8px;
  background-color: #ffffff;
  font-size: 14px;
  color: #1f2937;
  padding: 8px 12px;
  outline: none;
  box-sizing: border-box;
}

/* Hover / focus sobres et solides */
.date-filter input:hover {
  border-color: #0f447e;
}

.date-filter input:focus {
  border: 1px solid #0f447e;
  box-shadow: none; /* 🔹 pas d’ombre, reste stable */
}

/* Placeholder neutre */
.date-filter input::placeholder {
  color: #9ca3af;
}

/* Responsive */
@media (max-width: 768px) {
  .date-filter {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    margin-left: 0;
  }
  .date-filter .react-datepicker-wrapper {
    width: 100%;
  }
  .date-filter label {
    font-size: 13px;
    margin-bottom: 2px;
  }
}

/* ==========================================================
   React DatePicker – visuel OG-MA sobre
   ========================================================== */

.react-datepicker {
  font-family: "Inter", "Poppins", sans-serif;
  border: 1px solid #d1d5db !important;
  border-radius: 8px !important;
  background-color: #ffffff !important;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.06) !important;
  overflow: hidden;
  padding: 4px;
}

/* En-tête */
.react-datepicker__header {
  background-color: #f9fafb !important;
  border-bottom: 1px solid #e2e8f0 !important;
  padding: 8px 0 !important;
}

.react-datepicker__current-month {
  font-size: 15px;
  font-weight: 600;
  color: #0f447e !important;
}

/* Jours */
.react-datepicker__day-name {
  color: #64748b !important;
  font-weight: 500;
  font-size: 13px;
  margin: 0.2rem;
}

.react-datepicker__day {
  color: #1f2937 !important;
  font-size: 13px;
  font-weight: 500;
  border-radius: 6px;
  width: 2rem;
  line-height: 2rem;
  margin: 0.2rem;
  background: transparent !important;
}

.react-datepicker__day:hover {
  background-color: rgba(15, 68, 126, 0.1) !important;
  color: #0f447e !important;
}

/* Sélection */
.react-datepicker__day--selected,
.react-datepicker__day--range-start,
.react-datepicker__day--range-end {
  background-color: #0f447e !important;
  color: #fff !important;
}

/* Jour actuel */
.react-datepicker__day--today {
  border: 1px solid rgba(15, 68, 126, 0.25) !important;
  color: #0f447e !important;
  font-weight: 600 !important;
  background-color: transparent !important;
}

/* Hors mois */
.react-datepicker__day--outside-month {
  color: #cbd5e1 !important;
}

/* Triangle et popper */
.react-datepicker__triangle {
  display: none !important;
}
.react-datepicker-popper {
  z-index: 2000 !important;
  max-width: 100vw !important;
  transform: translate3d(0, 0, 0);
}

:root {
  --gap: 20px;
  --radius: 12px;
  --bg-light: #f3f6fb;
  --bg-dark: #e9edf3;
}

.dash-skel-wrap {
  padding: 20px;
}

/* ====== Cartes statistiques ====== */
.dash-skel-grid.stats {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 20px;
  grid-gap: 20px;
  grid-gap: var(--gap);
  gap: var(--gap);
  margin-bottom: 30px;
}
.dash-skel-card {
  background: white;
  border-radius: 12px;
  border-radius: var(--radius);
  padding: 16px;
  border: 1px solid #eceff4;
  box-shadow: 0 2px 8px rgba(0,0,0,.05);
}
.dash-skel-title {
  width: 60%;
  height: 14px;
  background: #e9edf3;
  background: var(--bg-dark);
  border-radius: 6px;
  margin-bottom: 10px;
}
.dash-skel-value {
  width: 80%;
  height: 20px;
  background: #f3f6fb;
  background: var(--bg-light);
  border-radius: 8px;
  margin-bottom: 8px;
}
.dash-skel-sub {
  width: 40%;
  height: 12px;
  background: #e9edf3;
  background: var(--bg-dark);
  border-radius: 6px;
}

/* ====== Graphiques ====== */
.dash-skel-grid.charts {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 20px;
  grid-gap: 20px;
  grid-gap: var(--gap);
  gap: var(--gap);
  margin-bottom: 30px;
}
.dash-skel-chart {
  height: 220px;
  background: #f3f6fb;
  background: var(--bg-light);
  border-radius: 12px;
  border-radius: var(--radius);
  border: 1px dashed #dfe3ea;
}

/* ====== Listes ====== */
.dash-skel-grid.lists {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  grid-gap: 20px;
  grid-gap: var(--gap);
  gap: var(--gap);
  margin-bottom: 30px;
}
@media (max-width: 900px) {
  .dash-skel-grid.lists {
    grid-template-columns: 1fr;
  }
}
.dash-skel-list {
  background: white;
  border-radius: 12px;
  border-radius: var(--radius);
  padding: 16px;
  border: 1px solid #eceff4;
}
.dash-skel-item {
  height: 48px;
  background: #f3f6fb;
  background: var(--bg-light);
  border-radius: 10px;
  margin-bottom: 12px;
}
.dash-skel-btn {
  height: 32px;
  background: #e9edf3;
  background: var(--bg-dark);
  border-radius: 8px;
  width: 140px;
  margin-top: 10px;
}

/* ====== Tableau utilisateurs ====== */
.dash-skel-table {
  background: white;
  border-radius: 12px;
  border-radius: var(--radius);
  padding: 16px;
  border: 1px solid #eceff4;
}
.dash-skel-table-head {
  height: 30px;
  background: #f3f6fb;
  background: var(--bg-light);
  border-radius: 8px;
  margin: 12px 0;
}
.dash-skel-row {
  height: 40px;
  background: #e9edf3;
  background: var(--bg-dark);
  border-radius: 8px;
  margin-bottom: 10px;
}

/* Style principal pour la page du dashboard admin */
.dashboard-admin-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
  margin-top: 30px;
}

.page-content {
  flex: 1 1;
  margin-left: 250px; 
  padding-top: 70px; 
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Quand le sidebar est collapsé sur DESKTOP */
.dashboard-admin-page.sidebar-collapsed .page-content {
  margin-left: 70px;
  width: calc(100% - 70px);
}

/* Conteneur pour le contenu du dashboard */
.dashboard-content {
  padding: 0 20px;
  box-sizing: border-box;
}

/* ===============================================
   MOBILE VIEW - Le contenu prend toute la largeur
   =============================================== */
.dashboard-admin-page.mobile-view .page-content {
  margin-left: 0 !important;
  width: 100% !important;
  padding-top: 80px;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 0 !important;
    width: 100% !important;
    padding-top: 80px;
  }
  
  .dashboard-admin-page.sidebar-collapsed .page-content {
    margin-left: 0 !important;
    width: 100% !important;
  }
  
  .dashboard-content {
    padding: 0 15px;
  }
}

@media (max-width: 480px) {
  .dashboard-content {
    padding: 0 10px;
  }
  
  .page-content {
    padding-top: 75px;
  }
}
/* Style principal pour la page de profil admin */
.mon-profil-admin-page {
    min-height: 100vh;
    display: flex;
    width: 100%;
    background-color: #f5f7f9;
    margin-top: 30px;
}

.page-content {
    flex: 1 1;
    margin-left: 250px;
    padding-top: 70px;
    transition: margin-left 0.3s ease;
    width: calc(100% - 250px);
    box-sizing: border-box;
    overflow-x: hidden;
}

/* Quand le sidebar est collapsé sur DESKTOP */
.mon-profil-admin-page.sidebar-collapsed .page-content {
    margin-left: 70px;
    width: calc(100% - 70px);
}

/* Conteneur pour le contenu du dashboard */
.dashboard-content {
    padding: 0 20px;
    box-sizing: border-box;
}

/* ===============================================
   MOBILE VIEW - Le contenu prend toute la largeur
   =============================================== */
.mon-profil-admin-page.mobile-view .page-content {
    margin-left: 0 !important;
    width: 100% !important;
    padding-top: 80px;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
    .page-content {
        margin-left: 0 !important;
        width: 100% !important;
        padding-top: 80px;
    }
    
    .mon-profil-admin-page.sidebar-collapsed .page-content {
        margin-left: 0 !important;
        width: 100% !important;
    }
    
    .dashboard-content {
        padding: 0 15px;
    }
}

@media (max-width: 480px) {
    .dashboard-content {
        padding: 0 10px;
    }
    
    .page-content {
        padding-top: 75px;
    }
}

/* Styles spécifiques pour le composant ProfileCard */
.dashboard-content .profile-card-container {
    margin: 0;
    padding: 0;
}

/* Assurer que le ProfileCard s'adapte correctement */
.dashboard-content > *:first-child {
    margin-top: 0 !important;
}

/* Éliminer les marges excessives */
.dashboard-content > * {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
}
/* Style principal pour la page de gestion d'appartements */
.gestion-appartement-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
}


.page-content {
  flex: 1 1;
  margin-left: 250px;
  padding-top: 70px;
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}
/* Largeur des blocs enfants UNIQUEMENT dans la page d’édition d’appartement */
.gestion-appartement-page .page-content > * {
  max-width: 1920px;
  width: 100%;
  box-sizing: border-box;
  overflow-x: auto; /* Permet le défilement horizontal si nécessaire */
}
/* Quand le sidebar est collapsé */
.gestion-appartement-page.sidebar-collapsed .page-content {
  margin-left: 70px; /* Largeur du sidebar collapsé */
  width: calc(100% - 70px);
}

/* Conteneur pour la liste d'appartements */
.list-container {
  padding: 20px;
  box-sizing: border-box;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 60px !important; /* Largeur du sidebar en mobile */
    width: calc(100% - 60px) !important;
  }
}
/* Container principal */
.tahaga-appartement-main-container {
  font-family: "Poppins", sans-serif;
  padding: 20px;
  width: 100%;
  max-width: 100%;
  margin: 0;
  min-height: 100vh;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}

/* Titre principal */
.tahaga-appartement-title {
  font-size: 24px;
  font-weight: 600;
  color: #0f447e;
  margin-bottom: 20px;
  white-space: nowrap;
}

.tahaga-appartement-title-highlight {
  color: #e30613;
}

/* Container de la liste */
.tahaga-appartement-container {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  padding: 0;
  margin: 10px auto;
  width: 100%;
  overflow: hidden;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}

/* En-tête de la liste */
.tahaga-appartement-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid #f0f0f0;
}

.tahaga-header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.tahaga-appartement-section-title {
  font-size: 16px;
  font-weight: 600;
  color: #333;
  margin: 0;
}

/* Bouton d'ajout */
.tahaga-add-appartement-btn {
  background-color: #0f447e;
  color: white;
  border: none;
  border-radius: 5px;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
  white-space: nowrap;
}

.tahaga-add-appartement-btn:hover {
  background-color: #0d4583;
}

.tahaga-plus-icon {
  margin-right: 5px;
  font-size: 16px;
  font-weight: bold;
}

/* Tableau avec barre de défilement */
.tahaga-appartement-table-container {
  overflow-x: auto;
  flex-grow: 1;
  max-height: calc(100vh - 200px);
  overflow-y: auto;
  position: relative;
  width: 100%;
}

/* Indicateur de défilement horizontal pour mobile */
.tahaga-appartement-table-container::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 60px;
  height: 20px;
  background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.8));
  pointer-events: none;
  animation: fadeInOut 1.5s infinite alternate;
  display: none;
}

@keyframes fadeInOut {
  from {
    opacity: 0.4;
  }
  to {
    opacity: 1;
  }
}

.tahaga-appartement-table {
  width: 100%;
  border-collapse: collapse;
}

.tahaga-appartement-table th,
.tahaga-appartement-table td {
  padding: 15px;
  text-align: left;
  border-bottom: 1px solid #f0f0f0;
  font-size: 14px;
}

.tahaga-appartement-table th {
  font-weight: 500;
  color: #0f447e;
  background-color: #fafafa;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 1;
}

.tahaga-appartement-table tr:hover {
  background-color: #f9f9f9;
}

/* Classe pour cacher les colonnes sur mobile */
.tahaga-hide-on-mobile {
  display: table-cell;
}

/* Cellule d'image */
.tahaga-image-cell {
  width: 80px;
}

.tahaga-appt-thumbnail {
  width: 60px;
  height: 60px;
  object-fit: cover;
  border-radius: 4px;
}

/* Options - Style badge */
.tahaga-options-cell {
  min-width: 140px;
}

.tahaga-options-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.tahaga-badge {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
  background-color: #f0f4f9;
  color: #666768;
}

.tahaga-badge.active {
  background-color: #f0f4f9;
  color: #666768;
}

/* Liens */
.tahaga-links-cell {
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tahaga-link {
  color: #0f447e;
  text-decoration: none;
  font-size: 13px;
  transition: color 0.3s;
}

.tahaga-link:hover {
  color: #e30613;
  text-decoration: underline;
}

.apartment-pagination {
  margin-bottom: 20px;
}

/* Actions */
.tahaga-actions-cell {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
}

.tahaga-action-btn {
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  width: 30px;
  height: 30px;
  border-radius: 4px;
}

.tahaga-view-btn {
  color: #4caf50;
  background-color: #e8f5e9;
}

.tahaga-edit-btn {
  color: #0f447e;
  background-color: #e9f5fb;
}

.tahaga-delete-btn {
  color: #e30613;
  background-color: #ffebee;
}

/* Toggle Switch */
.tahaga-toggle-container {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 22px;
}

.tahaga-toggle-input {
  opacity: 0;
  width: 0;
  height: 0;
}

.tahaga-toggle-label {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  border-radius: 22px;
  transition: 0.3s;
}

.tahaga-toggle-label:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  border-radius: 50%;
  transition: 0.3s;
}

.tahaga-toggle-input:checked + .tahaga-toggle-label {
  background-color: #4caf50;
}

.tahaga-toggle-input:checked + .tahaga-toggle-label:before {
  transform: translateX(24px);
}

/* Pagination */
.tahaga-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 20px 0;
  gap: 5px;
}

.tahaga-pagination-btn {
  background-color: #f0f4f9;
  border: none;
  color: #333;
  padding: 8px 12px;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.3s;
}

.tahaga-pagination-btn:hover:not(.disabled) {
  background-color: #e9f5fb;
}

.tahaga-pagination-btn.active {
  background-color: #0f447e;
  color: white;
}

.tahaga-pagination-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Modal */
.tahaga-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.tahaga-modal-content {
  background-color: #fff;
  border-radius: 8px;
  width: 90%;
  max-width: 700px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  z-index: 1001;
  position: relative;
}

.tahaga-modal-header {
  padding: 15px 20px;
  border-bottom: 1px solid #f0f0f0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.tahaga-modal-header h3 {
  margin: 0;
  color: #0f447e;
  font-size: 18px;
  font-weight: 600;
}

.tahaga-modal-close {
  background: transparent;
  border: none;
  font-size: 24px;
  cursor: pointer;
  color: #666;
}

.tahaga-modal-body {
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.tahaga-modal-image-container {
  width: 100%;
  max-height: 300px;
  overflow: hidden;
  border-radius: 6px;
}

.tahaga-modal-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.tahaga-modal-details {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.tahaga-detail-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 8px;
}

.tahaga-detail-label {
  font-weight: 600;
  color: #333;
  width: 150px;
}

.tahaga-detail-value {
  color: #666;
}

.tahaga-detail-link {
  color: #0f447e;
  text-decoration: none;
}

.tahaga-detail-link:hover {
  text-decoration: underline;
}

.tahaga-modal-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tahaga-detail-description {
  margin-top: 15px;
}

.tahaga-detail-description h4 {
  margin-top: 0;
  margin-bottom: 10px;
  color: #333;
  font-size: 16px;
}

.tahaga-detail-description p {
  margin: 0;
  color: #666;
  line-height: 1.5;
}

/* Styles pour le flou modal */
.tahaga-appartement-main-container.modal-open {
  position: relative;
}

.tahaga-appartement-main-container.modal-open::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 999;
}

.tahaga-appartement-main-container.modal-open > *:not(.tahaga-modal-overlay) {
  filter: blur(3px);
  transition: filter 0.3s ease;
  pointer-events: none;
}

/* Styles pour la popup de confirmation */
.user-confirmation-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}

.user-confirmation-content {
  background-color: white;
  border-radius: 8px;
  width: 90%;
  max-width: 400px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  overflow: hidden;
}

.user-confirmation-header {
  padding: 16px;
  background-color: #0f447e;
  border-bottom: 1px solid #e9ecef;
}

.user-confirmation-header h3 {
  margin: 0;
  font-size: 18px;
  color: #ffffff;
}

.user-confirmation-body {
  padding: 20px 16px;
  border-bottom: 1px solid #e9ecef;
}

.user-confirmation-body p {
  margin: 0;
  font-size: 14px;
  color: #333;
}

.user-confirmation-footer {
  padding: 16px;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.user-confirmation-btn {
  padding: 8px 16px;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.user-confirmation-btn-cancel {
  background-color: #f8f9fa;
  color: #6c757d;
  border: 1px solid #dee2e6;
}

.user-confirmation-btn-cancel:hover {
  background-color: #e30613;
  color: white;
}

.user-confirmation-btn-confirm {
  background-color: #0f447e;
  color: white;
  border: 1px solid #0f447e;
}

.user-confirmation-btn-confirm:hover {
  background-color: #0a3b70;
}

/* Styles pour la colonne État */
.tahaga-etat-cell {
  min-width: 100px;
}

.tahaga-etat-badge {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
  display: inline-block;
  text-align: center;
}

.tahaga-etat-badge.attente {
  background-color: #fff3cd;
  color: #856404;
}

.tahaga-etat-badge.publie {
  background-color: #d4edda;
  color: #155724;
}

/* Conteneur pour le champ de recherche avec icône */
.tahaga-search-container {
  position: relative;
  display: flex;
  align-items: center;
  width: 200px;
}

.tahaga-search-icon {
  color: #666;
  font-size: 14px;
  cursor: pointer;
  z-index: 2;
}

.tahaga-search-input {
  padding: 8px 12px 8px 30px;
  border: 1px solid #e0e0e0;
  border-radius: 5px;
  font-size: 13px;
  font-family: "Poppins", sans-serif;
  width: 100%;
  outline: none;
  transition: border-color 0.3s, width 0.3s ease, opacity 0.3s ease;
}

.tahaga-search-input:focus {
  border-color: #0f447e;
}

/* Responsive */
@media (max-width: 992px) {
  .tahaga-appartement-table {
    min-width: 900px;
  }

  .tahaga-modal-body {
    flex-direction: column;
  }
}

@media (max-width: 768px) {
  /* Cacher les colonnes sur mobile */
  .tahaga-hide-on-mobile {
    display: none !important;
  }

  .tahaga-appartement-header {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
  }

  .tahaga-header-actions {
    flex-direction: row;
    gap: 5px;
  }

  .tahaga-appartement-section-title {
    font-size: 14px;
  }

  .tahaga-add-appartement-btn {
    padding: 5px 8px;
    font-size: 10px;
    white-space: nowrap;
    max-width: 130px;
  }

  .tahaga-plus-icon {
    font-size: 12px;
    margin-right: 3px;
  }

  .tahaga-appartement-main-container {
    padding: 10px;
  }

  .tahaga-appartement-title {
    font-size: 18px;
  }

  /* Affiche l'indicateur de défilement sur mobile */
  .tahaga-appartement-table-container::after {
    display: block;
  }

  /* Assure que le défilement horizontal est évident sur mobile */
  .tahaga-appartement-table-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #0f447e #f0f0f0;
  }

  .tahaga-appartement-table-container::-webkit-scrollbar {
    height: 6px;
  }

  .tahaga-appartement-table-container::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
  }

  .tahaga-appartement-table-container::-webkit-scrollbar-thumb {
    background: #0f447e;
    border-radius: 3px;
  }

  .tahaga-modal-content {
    width: 95%;
  }

  .tahaga-detail-label {
    width: 100%;
    margin-bottom: 2px;
  }

  /* Ajuster la largeur des colonnes visibles sur mobile */
  .tahaga-image-cell {
    width: 60px;
  }

  .tahaga-appt-thumbnail {
    width: 50px;
    height: 50px;
  }

  .tahaga-actions-cell {
    min-width: 150px;
  }

  /* Ajuster la table pour mobile */
  .tahaga-appartement-table {
    min-width: auto;
  }

  /* Styles pour le champ de recherche sur mobile */
  .tahaga-search-container {
    width: 30px;
    transition: width 0.3s ease;
  }

  .tahaga-search-container.expanded {
    width: 120px;
  }

  .tahaga-search-icon {
    left: 8px;
    font-size: 12px;
  }

  .tahaga-search-input {
    padding: 5px 8px 5px 25px;
    font-size: 12px;
    width: 0;
    opacity: 0;
    visibility: hidden;
    position: absolute;
    left: 0;
  }

  .tahaga-search-input.visible {
    width: 100%;
    opacity: 1;
    visibility: visible;
  }
}

/* Styles pour tablette (769px à 1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
  .tahaga-search-container {
    width: 150px;
  }

  .tahaga-search-input {
    padding: 7px 10px 7px 28px;
    font-size: 13px;
    width: 100%;
    opacity: 1;
    visibility: visible;
  }

  .tahaga-search-icon {
    left: 9px;
    font-size: 13px;
  }
}

/* Styles pour desktop (min-width: 1025px) */
@media (min-width: 1025px) {
  .tahaga-search-container {
    width: 200px;
  }

  .tahaga-search-input {
    width: 100%;
    opacity: 1;
    visibility: visible;
  }
}

/* Conteneur pour le champ de recherche avec icône */
.tahaga-search-container {
  position: relative;
  display: flex;
  align-items: center;
  width: 200px;
}

.tahaga-search-icon {
  color: #666;
  font-size: 14px;
  cursor: pointer;
  z-index: 2;
}

.tahaga-search-input {
  padding: 8px 12px 8px 30px; /* Ajout de padding à gauche pour l'icône */
  border: 1px solid #e0e0e0;
  border-radius: 5px;
  font-size: 13px;
  font-family: 'Poppins', sans-serif;
  width: 100%;
  outline: none;
  transition: border-color 0.3s, width 0.3s ease, opacity 0.3s ease;
}

.tahaga-search-input:focus {
  border-color: #0F447E;
}

/* Styles pour mobile (max-width: 768px) */
@media (max-width: 768px) {
  .tahaga-search-container {
    width: 30px; /* Taille minimale pour l'icône */
    transition: width 0.3s ease;
  }

  .tahaga-search-container.expanded {
    width: 110px; /* Ajusté à 110px pour correspondre à la taille du bouton */
  }

  .tahaga-search-icon {
    left: 8px;
    font-size: 12px;
  }

  .tahaga-search-input {
    padding: 5px 8px 5px 24px; /* Padding ajusté pour la largeur réduite */
    font-size: 12px; /* Taille de police augmentée légèrement pour la lisibilité */
    width: 0;
    opacity: 0;
    visibility: hidden;
    position: absolute;
    left: 0;
  }

  .tahaga-search-input.visible {
    width: 100%;
    opacity: 1;
    visibility: visible;
  }
}

/* Styles pour tablette (769px à 1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
  .tahaga-search-container {
    width: 150px; /* Réduit pour tablette */
  }

  .tahaga-search-input {
    padding: 7px 10px 7px 28px;
    font-size: 13px;
    width: 100%;
    opacity: 1;
    visibility: visible;
  }

  .tahaga-search-icon {
    left: 9px;
    font-size: 13px;
  }
}

/* Styles pour desktop (min-width: 1025px) */
@media (min-width: 1025px) {
  .tahaga-search-container {
    width: 200px;
  }

  .tahaga-search-input {
    width: 100%;
    opacity: 1;
    visibility: visible;
  }
}
:root {
  --skel-light: #f3f6fb;
  --skel-dark: #e9edf3;
  --skel-radius: 6px;
}

.aptskel-card {
  background: #fff;
  border: 1px solid #eceff4;
  border-radius: 10px;
  padding: 12px;
  box-shadow: 0 2px 6px rgba(0,0,0,.05);
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* Header */
.aptskel-header {
  display: grid;
  grid-template-columns: 80px 150px 100px 120px 200px 80px 80px 150px 100px 150px;
  grid-gap: 10px;
  gap: 10px;
}
.aptskel-headcell {
  height: 16px;
  background: #e9edf3;
  background: var(--skel-dark);
  border-radius: 6px;
  border-radius: var(--skel-radius);
}

/* Rows */
.aptskel-row {
  display: grid;
  grid-template-columns: 80px 150px 100px 120px 200px 80px 80px 150px 100px 150px;
  grid-gap: 10px;
  gap: 10px;
  align-items: center;
}

.aptskel-cell {
  height: 26px;
  border-radius: 6px;
  border-radius: var(--skel-radius);
  background: #f3f6fb;
  background: var(--skel-light);
}

/* Custom widths */
.apts-img { height: 50px; border-radius: 8px; }
.apts-text.short { width: 60%; }
.apts-text.long { width: 90%; }
.apts-badges { height: 20px; border-radius: 12px; }
.apts-actions { height: 26px; border-radius: 8px; }

/* Shimmer effect */
.aptskel-card * {
  position: relative;
  overflow: hidden;
}
.aptskel-card *::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent);
  animation: shimmer 1.2s infinite;
}
@keyframes shimmer {
  100% { transform: translateX(100%); }
}
.Partenaire-appartements-empty {
  animation: fadeIn 0.3s ease-out;
}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Style principal pour la page de gestion d'hôtels */
.gestion-hotel-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
}


.page-content {
  flex: 1 1;
  margin-left: 250px;
  padding-top: 70px;
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}
/* Largeur des blocs enfants UNIQUEMENT dans la page d’édition d’appartement */
.gestion-hotel-page .page-content > * {
  max-width: 1920px;
  width: 100%;
  box-sizing: border-box;
  overflow-x: auto; /* Permet le défilement horizontal si nécessaire */
}
/* Quand le sidebar est collapsé */
.gestion-hotel-page.sidebar-collapsed .page-content {
  margin-left: 70px; /* Largeur du sidebar collapsé */
  width: calc(100% - 70px);
}

/* Conteneur pour la liste d'hôtels */
.list-container {
  padding: 20px;
  box-sizing: border-box;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 60px !important; /* Largeur du sidebar en mobile */
    width: calc(100% - 60px) !important;
  }
}
/* Container principal */
.GestionHotelList-main-container {
  font-family: 'Poppins', sans-serif;
  padding: 20px;
  max-width: 100%;
  margin: 0 auto;
}

/* Titre principal */
.GestionHotelList-title {
  font-size: 24px;
  font-weight: 600;
  color: #0F447E;
  margin-bottom: 20px;
  white-space: nowrap; /* Empêche le texte de se casser sur plusieurs lignes */
}

.GestionHotelList-title-highlight {
  color: #e30613;
}

/* Container de la liste */
.GestionHotelList-container {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  padding: 0;
  margin-top: 10px;
  overflow: hidden;
}

/* En-tête de la liste */
.GestionHotelList-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid #f0f0f0;
}

.GestionHotelList-section-title {
  font-size: 16px;
  font-weight: 600;
  color: #333;
  margin: 0;
}

/* Bouton d'ajout */
.GestionHotelList-add-btn {
  background-color: #0F447E;
  color: white;
  border: none;
  border-radius: 5px;
  padding: 8px 14px; /* Légèrement réduit */
  font-size: 13px; /* Légèrement réduit */
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
}

.GestionHotelList-add-btn:hover {
  background-color: #0d4583;
}

.GestionHotelList-plus-icon {
  margin-right: 5px;
  font-size: 16px;
  font-weight: bold;
}

/* Tableau avec barre de défilement */
.GestionHotelList-table-container {
  overflow-x: auto;
  max-height: 500px; /* Hauteur maximale pour la table */
  overflow-y: auto; /* Ajoute une barre de défilement verticale si nécessaire */
  position: relative;
}

/* Indicateur de défilement horizontal pour mobile */
.GestionHotelList-table-container::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 60px;
  height: 20px;
  background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.8));
  pointer-events: none; /* Pour ne pas interférer avec les interactions */
  animation: fadeInOut 1.5s infinite alternate;
  display: none; /* Caché par défaut, affiché seulement sur mobile */
}

@keyframes fadeInOut {
  from { opacity: 0.4; }
  to { opacity: 1; }
}

.GestionHotelList-table {
  width: 100%;
  border-collapse: collapse;
}

.GestionHotelList-table th, 
.GestionHotelList-table td {
  padding: 15px;
  text-align: left;
  border-bottom: 1px solid #f0f0f0;
  font-size: 14px;
}

.GestionHotelList-table th {
  font-weight: 500;
  color: #0F447E;
  background-color: #fafafa;
  position: -webkit-sticky;
  position: sticky; /* Garde les en-têtes visibles lors du défilement */
  top: 0;
  z-index: 1;
}

.GestionHotelList-table tr:hover {
  background-color: #f9f9f9;
}

/* Cellule d'image */
.GestionHotelList-image-cell {
  width: 80px;
}

.GestionHotelList-thumbnail {
  width: 60px;
  height: 60px;
  object-fit: cover;
  border-radius: 4px;
}

/* Options - Style badge */
.GestionHotelList-options-cell {
  min-width: 140px;
}

.GestionHotelList-options-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.GestionHotelList-badge {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
  background-color: #f0f4f9; /* Couleur de fond gris clair comme sur l'image */
  color: #666768;
}

.GestionHotelList-badge.active {
  background-color: #f0f4f9; /* Même couleur que les badges normaux */
  color: #666768;
}

/* Liens */
.GestionHotelList-links-cell {
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.GestionHotelList-link {
  color: #0F447E;
  text-decoration: none;
  font-size: 13px;
  transition: color 0.3s;
}

.GestionHotelList-link:hover {
  color: #e30613;
  text-decoration: underline;
}

/* Actions */
.GestionHotelList-actions-cell {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
}

.GestionHotelList-action-btn {
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  width: 30px;
  height: 30px;
  border-radius: 4px;
}

.GestionHotelList-view-btn {
  color: #4CAF50;
  background-color: #e8f5e9;
}

.GestionHotelList-edit-btn {
  color: #0F447E;
  background-color: #e9f5fb;
}
/* Toggle Switch */
.GestionHotelList-toggle-container {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 22px;
}

.GestionHotelList-toggle-input {
  opacity: 0;
  width: 0;
  height: 0;
}

.GestionHotelList-toggle-label {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  border-radius: 22px;
  transition: .3s;
}

.GestionHotelList-toggle-label:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  border-radius: 50%;
  transition: .3s;
}

.GestionHotelList-toggle-input:checked + .GestionHotelList-toggle-label {
  background-color: #4CAF50;
}

.GestionHotelList-toggle-input:checked + .GestionHotelList-toggle-label:before {
  transform: translateX(24px);
}

/* Pagination */
.GestionHotelList-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 20px 0;
  gap: 5px;
}

.GestionHotelList-pagination-btn {
  background-color: #f0f4f9;
  border: none;
  color: #333;
  padding: 8px 12px;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.3s;
}

.GestionHotelList-pagination-btn:hover:not(.disabled) {
  background-color: #e9f5fb;
}

.GestionHotelList-pagination-btn.active {
  background-color: #0F447E;
  color: white;
}

.GestionHotelList-pagination-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Modal */
.GestionHotelList-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.GestionHotelList-modal-content {
  background-color: #fff;
  border-radius: 8px;
  width: 90%;
  max-width: 700px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

.GestionHotelList-modal-header {
  padding: 15px 20px;
  border-bottom: 1px solid #f0f0f0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.GestionHotelList-modal-header h3 {
  margin: 0;
  color: #0F447E;
  font-size: 18px;
  font-weight: 600;
}

.GestionHotelList-modal-close {
  background: transparent;
  border: none;
  font-size: 24px;
  cursor: pointer;
  color: #666;
}

.GestionHotelList-modal-body {
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.GestionHotelList-modal-image-container {
  width: 100%;
  max-height: 300px;
  overflow: hidden;
  border-radius: 6px;
}

.GestionHotelList-modal-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.GestionHotelList-modal-details {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.GestionHotelList-detail-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 8px;
}

.GestionHotelList-detail-label {
  font-weight: 600;
  color: #333;
  width: 150px;
}

.GestionHotelList-detail-value {
  color: #666;
}

.GestionHotelList-detail-link {
  color: #0F447E;
  text-decoration: none;
}

.GestionHotelList-detail-link:hover {
  text-decoration: underline;
}

.GestionHotelList-modal-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.GestionHotelList-detail-description {
  margin-top: 15px;
}

.GestionHotelList-detail-description h4 {
  margin-top: 0;
  margin-bottom: 10px;
  color: #333;
  font-size: 16px;
}

.GestionHotelList-detail-description p {
  margin: 0;
  color: #666;
  line-height: 1.5;
}

/* Responsive */
@media (max-width: 992px) {
  .GestionHotelList-table {
    min-width: 900px;
  }
  
  .GestionHotelList-modal-body {
    flex-direction: column;
  }
}

@media (max-width: 768px) {
  .GestionHotelList-header {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
  }
  
  .GestionHotelList-section-title {
    font-size: 14px;
  }
  
  .GestionHotelList-add-btn {
    padding: 5px 8px;
    font-size: 8px;
    white-space: nowrap;
    max-width: 130px;
  }
  
  .GestionHotelList-plus-icon {
    font-size: 12px;
    margin-right: 3px;
  }
  
  .GestionHotelList-main-container {
    padding: 10px;
  }
  
  .GestionHotelList-title {
    font-size: 18px;
  }
  
  /* Affiche l'indicateur de défilement sur mobile */
  .GestionHotelList-table-container::after {
    display: block;
  }
  
  /* Assure que le défilement horizontal est évident sur mobile */
  .GestionHotelList-table-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #0F447E #f0f0f0;
  }
  
  .GestionHotelList-table-container::-webkit-scrollbar {
    height: 6px;
  }
  
  .GestionHotelList-table-container::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
  }
  
  .GestionHotelList-table-container::-webkit-scrollbar-thumb {
    background: #0F447E;
    border-radius: 3px;
  }
  
  .GestionHotelList-modal-content {
    width: 95%;
  }
  
  .GestionHotelList-detail-label {
    width: 100%;
    margin-bottom: 2px;
  }
}

/* Styles pour le flou modal */
.GestionHotelList-main-container.modal-open {
  position: relative;
}

.GestionHotelList-main-container.modal-open::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 999;
}

.GestionHotelList-main-container.modal-open > *:not(.GestionHotelList-modal-overlay) {
  filter: blur(3px);
  transition: filter 0.3s ease;
  pointer-events: none;
}

/* S'assurer que le modal est au-dessus */
.GestionHotelList-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.GestionHotelList-modal-content {
  z-index: 1001;
  position: relative;
}

/* Styles pour la popup de confirmation */
.user-confirmation-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}

.user-confirmation-content {
  background-color: white;
  border-radius: 8px;
  width: 90%;
  max-width: 400px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  overflow: hidden;
}

.user-confirmation-header {
  padding: 16px;
  background-color: #0F447E;
  border-bottom: 1px solid #e9ecef;
}

.user-confirmation-header h3 {
  margin: 0;
  font-size: 18px;
  color: #ffffff;
}

.user-confirmation-body {
  padding: 20px 16px;
  border-bottom: 1px solid #e9ecef;
}

.user-confirmation-body p {
  margin: 0;
  font-size: 14px;
  color: #333;
}

.user-confirmation-footer {
  padding: 16px;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.user-confirmation-btn {
  padding: 8px 16px;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.user-confirmation-btn-cancel {
  background-color: #f8f9fa;
  color: #6c757d;
  border: 1px solid #dee2e6;
}

.user-confirmation-btn-cancel:hover {
  background-color: #e30613;
  color: white;
}

.user-confirmation-btn-confirm {
  background-color: #0F447E;
  color: white;
  border: 1px solid #0F447E;
}

.user-confirmation-btn-confirm:hover {
  background-color: #0a3b70;
}

/* Styles pour la colonne État */
.GestionHotelList-etat-cell {
  min-width: 100px;
}

.GestionHotelList-etat-badge {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
  display: inline-block;
  text-align: center;
}

.GestionHotelList-etat-badge.attente {
  background-color: #FFF3CD;
  color: #856404;
}

.GestionHotelList-etat-badge.publie {
  background-color: #D4EDDA;
  color: #155724;
}
/* Style principal pour la page d'administration des réservations */
.reservation-vue-admin-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
  margin-top: 30px;
}

.page-content {
  flex: 1 1;
  margin-left: 250px;
  padding-top: 70px;
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Quand le sidebar est collapsé sur DESKTOP */
.reservation-vue-admin-page.sidebar-collapsed .page-content {
  margin-left: 70px;
  width: calc(100% - 70px);
}

/* Conteneur pour le contenu du dashboard */
.dashboard-content {
  padding: 0 20px;
  box-sizing: border-box;
}

/* Section des réservations */
.reservations-section {
  padding: 20px 0;
  box-sizing: border-box;
}

/* ===============================================
   MOBILE VIEW - Le contenu prend toute la largeur
   =============================================== */
.reservation-vue-admin-page.mobile-view .page-content {
  margin-left: 0 !important;
  width: 100% !important;
  padding-top: 80px;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 0 !important;
    width: 100% !important;
    padding-top: 80px;
  }
  
  .reservation-vue-admin-page.sidebar-collapsed .page-content {
    margin-left: 0 !important;
    width: 100% !important;
  }
  
  .dashboard-content {
    padding: 0 15px;
  }
  
  .reservations-section {
    padding: 10px 0;
  }
}

@media (max-width: 480px) {
  .dashboard-content {
    padding: 0 10px;
  }
  
  .page-content {
    padding-top: 75px;
  }
  
  .reservations-section {
    padding: 5px 0;
  }
}

/* Animation de transition pour le chargement des cartes */
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.reservations-container {
  animation: fadeIn 0.5s ease-out forwards;
}

/* Style pour améliorer l'espace entre les sections */
.reservations-container + .reservations-container {
  margin-top: 30px;
}
.ReservationAppartement-container {
  max-width: 1900px;
  margin: 0 auto;
  font-family: 'Poppins', sans-serif;
  padding: 20px;
}

.ReservationAppartement-header {
  display: flex;
  align-items: center;
  margin-bottom: 30px;
  padding: 0 10px;
}

.ReservationAppartement-icon {
  margin-right: 10px;
}

.ReservationAppartement-title {
  font-size: 24px;
  font-weight: 600;
}

.ReservationAppartement-mes-reservations {
  color: #0F447E;
}

.ReservationAppartement-appartements {
  color: #E30613;
}

.ReservationAppartement-cards-container {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}

.ReservationAppartement-card {
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  width: calc(33.333% - 14px);
  max-width: 380px;
  background-color: white;
  /* transition: transform 0.2s ease, box-shadow 0.2s ease; */
}

/* .ReservationAppartement-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
} */

.ReservationAppartement-card-header {
  display: flex;
  border-bottom: 1px solid #e2e8f0;
  height: 110px;
}

.ReservationAppartement-card-header-image {
  width: 110px;
  min-width: 110px;
  height: 110px;
  overflow: hidden;
}

.ReservationAppartement-card-header-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ReservationAppartement-card-header-info {
  flex: 1 1;
  background-color: #0F447E;
  color: white;
  padding: 12px;
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: space-between;
}

.ReservationAppartement-title-container {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 7px;
}

.ReservationAppartement-residence-name-container {
  flex: 1 1;
  min-width: 0;
  padding-right: 8px;
}

.ReservationAppartement-residence-name {
  font-size: 18px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  display: flex;
  align-items: center;
  gap: 6px;
}

/* Icône de l'œil */
.ReservationAppartement-eye-icon {
  cursor: pointer;
  opacity: 0.8;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.ReservationAppartement-eye-icon:hover {
  opacity: 1;
  transform: scale(1.1);
}

.ReservationAppartement-header-details {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-top: auto;
}

.ReservationAppartement-info-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  height: 20px;
  overflow: hidden;
}

.ReservationAppartement-info-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ReservationAppartement-status {
  text-align: right;
  flex-shrink: 0;
}

.ReservationAppartement-status-badge {
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  display: inline-block;
  color: white;
}

.ReservationAppartement-card-body {
  padding: 20px;
}

.ReservationAppartement-detail-row {
  display: flex;
  justify-content: space-between;
  padding: 10px 0;
  border-bottom: 1px solid #f0f0f0;
  align-items: center;
}

.ReservationAppartement-detail-row:last-of-type {
  border-bottom: none;
  margin-bottom: 20px;
}

.ReservationAppartement-label {
  color: #94a3b8;
  font-size: 14px;
}

.ReservationAppartement-value {
  font-weight: 600;
  text-align: right;
  color: #0F447E;
}

.ReservationAppartement-actions {
  display: flex;
  gap: 10px;
}

.ReservationAppartement-approve-btn,
.ReservationAppartement-cancel-btn {
  flex: 1 1;
  padding: 12px;
  border: none;
  border-radius: 6px;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  transition: all 0.2s ease;
}

.ReservationAppartement-approve-btn {
  background-color: #b7e4c7;
  color: #2d6a4f;
}

.ReservationAppartement-approve-btn:hover {
  background-color: #95d5b2;
}

.ReservationAppartement-approve-btn:disabled {
  background-color: #d1d5db;
  color: #6b7280;
  cursor: not-allowed;
  opacity: 0.7;
  position: relative;
}

.ReservationAppartement-approve-btn:disabled::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
  animation: loading-shimmer 1.5s infinite;
}

@keyframes loading-shimmer {
  0% { left: -100%; }
  100% { left: 100%; }
}

.ReservationAppartement-cancel-btn {
  background-color: #E30613;
  color: white;
}

.ReservationAppartement-cancel-btn:hover {
  background-color: #E30613;
}

.ReservationAppartement-cancel-btn:disabled {
  /* background-color: #9ca3af;
  color: #6b7280; */
  cursor: not-allowed;
  opacity: 0.4;
  position: relative;
}

.ReservationAppartement-cancel-btn:disabled::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
  animation: loading-shimmer 1.5s infinite;
}

/* Style de pagination */
.ReservationAppartement-pagination {
  display: flex;
  justify-content: center;
  margin-top: 30px;
  gap: 8px;
}

.ReservationAppartement-pagination-btn {
  min-width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e0e0e0;
  background-color: white;
  color: #333;
  font-size: 14px;
  cursor: pointer;
  border-radius: 6px;
  transition: all 0.2s;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.ReservationAppartement-pagination-btn:hover:not(:disabled) {
  background-color: #f0f0f0;
  transform: translateY(-1px);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
}

.ReservationAppartement-pagination-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.ReservationAppartement-pagination-active {
  background-color: #0F447E;
  color: white;
  border-color: #0F447E;
  font-weight: 600;
}

.ReservationAppartement-pagination-active:hover {
  background-color: #002b63;
}

/* Styles pour le popup */
.ReservationAppartement-popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  padding: 20px;
}

.ReservationAppartement-popup-content {
  background-color: white;
  border-radius: 12px;
  width: 100%;
  max-width: 600px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
  animation: fadeIn 0.3s ease-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.ReservationAppartement-popup-header {
  background-color: #0F447E;
  color: white;
  padding: 16px 20px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.ReservationAppartement-popup-title {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
}

.ReservationAppartement-popup-close {
  background: none;
  border: none;
  color: white;
  font-size: 24px;
  cursor: pointer;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: background-color 0.2s ease;
}

.ReservationAppartement-popup-close:hover {
  background-color: rgba(255, 255, 255, 0.2);
}

.ReservationAppartement-popup-body {
  padding: 20px;
}

.ReservationAppartement-popup-image-container {
  width: 100%;
  height: 200px;
  overflow: hidden;
  border-radius: 8px;
  margin-bottom: 20px;
}

.ReservationAppartement-popup-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ReservationAppartement-popup-info {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ReservationAppartement-popup-status {
  margin-bottom: 10px;
}

.ReservationAppartement-popup-detail {
  padding: 8px 0;
  border-bottom: 1px solid #f0f0f0;
  line-height: 1.5;
}

.ReservationAppartement-popup-detail:last-child {
  border-bottom: none;
}

.ReservationAppartement-popup-actions {
  padding: 20px;
  display: flex;
  gap: 10px;
  border-top: 1px solid #e0e0e0;
}

/* Responsive design */
@media (max-width: 1100px) {
  .ReservationAppartement-card {
    width: calc(50% - 10px);
    max-width: 450px;
  }
}

@media (max-width: 768px) {
  .ReservationAppartement-container {
    padding: 15px;
    max-width: 95%;
  }
  
  .ReservationAppartement-title {
    font-size: 20px;
  }
  
  .ReservationAppartement-card {
    width: 100%;
  }
  
  .ReservationAppartement-popup-content {
    width: 95%;
  }
}

@media (max-width: 576px) {
  .ReservationAppartement-card-header {
    flex-direction: column;
    height: auto;
  }
  
  .ReservationAppartement-card-header-image {
    width: 100%;
    height: 120px;
  }
  
  .ReservationAppartement-card-header-info {
    height: auto;
  }
  
  .ReservationAppartement-residence-name {
    white-space: normal;
    overflow: visible;
  }
  
  .ReservationAppartement-title-container {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  
  .ReservationAppartement-status {
    margin-top: 5px;
  }
  
  .ReservationAppartement-header-details {
    margin-top: 10px;
  }
  
  .ReservationAppartement-info-row {
    height: auto;
  }
  
  .ReservationAppartement-info-text {
    white-space: normal;
  }
  
  .ReservationAppartement-detail-row {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
  }
  
  .ReservationAppartement-period-row {
    flex-direction: column;
    align-items: flex-start;
  }
  
  .ReservationAppartement-period-row .ReservationAppartement-value {
    text-align: left;
    margin-top: 5px;
  }
  
  .ReservationAppartement-popup-actions {
    flex-direction: column;
  }
}

@media (max-width: 480px) {
  .ReservationAppartement-actions {
    flex-direction: column;
  }
  
  .ReservationAppartement-pagination-btn {
    min-width: 28px;
    height: 28px;
    font-size: 12px;
  }
}

/* Styles pour les onglets */
.ReservationAppartement-category-tabs {
  display: flex;
  margin-bottom: 2rem;
  border-bottom: 1px solid #e5e7eb;
  padding: 0 10px;
  overflow-x: auto;
  scrollbar-width: none;
}

.ReservationAppartement-category-tabs::-webkit-scrollbar {
  display: none;
}

.ReservationAppartement-category-tab {
  padding: 0.8rem 1.2rem;
  font-size: 0.95rem;
  font-weight: 500;
  background: transparent;
  border: none;
  color: #6b7280;
  cursor: pointer;
  position: relative;
  transition: color 0.2s ease;
  white-space: nowrap;
  flex-shrink: 0;
}

.ReservationAppartement-category-tab.active {
  color: #0F447E;
  font-weight: 600;
}

.ReservationAppartement-category-tab.active::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  height: 2px;
  background-color: #0F447E;
}

.ReservationAppartement-category-tab:hover {
  color: #0d3a6b;
}

.ReservationAppartement-count {
  font-size: 0.85rem;
  font-weight: 500;
  margin-left: 0.3rem;
  color: #656565;
}

/* Styles pour le statut "Initié" */
.ReservationAppartement-status-badge[style*="#93c5fd"] {
  color: #0F447E;
}

/* Message quand pas de résultats */
.ReservationAppartement-no-results {
  width: 100%;
  text-align: center;
  padding: 2rem;
  color: #64748b;
  font-size: 1.1rem;
}

/* Loading state */
.ReservationAppartement-loading {
  text-align: center;
  padding: 2rem;
  color: #0F447E;
}

/* Error state */
.ReservationAppartement-error {
  text-align: center;
  padding: 2rem;
  color: #e30613;
}

/* Responsive pour les onglets */
@media (max-width: 768px) {
  .ReservationAppartement-category-tab {
    padding: 0.6rem 0.8rem;
    font-size: 0.9rem;
  }
}

@media (max-width: 480px) {
  .ReservationAppartement-category-tab {
    padding: 0.5rem 0.6rem;
    font-size: 0.8rem;
  }
  
  .ReservationAppartement-count {
    font-size: 0.75rem;
  }
}

/* Animation de chargement */
.ReservationAppartement-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 200px;
  gap: 1rem;
  color: #0F447E;
}

.ReservationAppartement-loading-circle-container {
  display: flex;
  justify-content: center;
  align-items: center;
}

.ReservationAppartement-loading-circle {
  width: 50px;
  height: 50px;
  border: 5px solid #f3f3f3;
  border-top: 5px solid #0F447E;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


/* Style pour le bouton Refuser */
.ReservationAppartement-reject-btn {
  flex: 1 1;
  padding: 12px;
  border: none;
  border-radius: 6px;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  transition: all 0.2s ease;
  background-color: #f59e0b;
  color: white;
}

.ReservationAppartement-reject-btn:hover {
  background-color: #d97706;
}

/* Style pour le badge de statut Refusée */
.ReservationAppartement-status-badge[style*="#f59e0b"] {
  color: white;
}
/* 
=================================================================================================================
================================================================================================================= */


/* Réduire seulement la taille des éléments spécifiques dans le card-body */
.ReservationAppartement-card-body {
  padding: 20px;
}

.ReservationAppartement-detail-row {
  display: flex;
  justify-content: space-between;
  padding: 8px 0; /* Légèrement réduit */
  border-bottom: 1px solid #f0f0f0;
  align-items: center;
  font-size: 13px; /* Taille réduite */
}

.ReservationAppartement-detail-row:last-of-type {
  border-bottom: none;
  margin-bottom: 15px; /* Légèrement réduit */
}

.ReservationAppartement-label {
  color: #94a3b8;
  font-size: 12px; /* Taille réduite */
  white-space: nowrap; /* Empêche le retour à la ligne */
}

.ReservationAppartement-value {
  font-weight: 600;
  text-align: right;
  color: #0F447E;
  font-size: 12px; /* Taille réduite */
  white-space: nowrap; /* Empêche le retour à la ligne */
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 60%; /* Limite la largeur pour éviter les débordements */
}

/* Pour les très petits écrans seulement */
@media (max-width: 480px) {
  .ReservationAppartement-detail-row {
    font-size: 12px; /* Un peu plus petit sur mobile */
  }
  
  .ReservationAppartement-label,
  .ReservationAppartement-value {
    font-size: 11px; /* Un peu plus petit sur mobile */
  }
  
  /* S'assurer que les éléments restent sur une ligne même sur mobile */
  .ReservationAppartement-detail-row {
    flex-direction: row; /* Toujours en ligne */
    align-items: center;
    gap: 5px;
  }
  
  .ReservationAppartement-value {
    max-width: 55%; /* Ajusté pour mobile */
    text-align: right;
  }
}

/* Pour les écrans très étroits */
@media (max-width: 360px) {
  .ReservationAppartement-detail-row {
    font-size: 11px;
  }
  
  .ReservationAppartement-label,
  .ReservationAppartement-value {
    font-size: 10px;
  }
}



/* ==============================================================================
Pagination 
===================================================================== */

/* Styles pour la pagination améliorée */
.ReservationAppartement-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 30px;
  gap: 6px;
  flex-wrap: wrap;
}

.ReservationAppartement-pagination-btn {
  min-width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e0e0e0;
  background-color: white;
  color: #333;
  font-size: 14px;
  cursor: pointer;
  border-radius: 6px;
  transition: all 0.2s;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.ReservationAppartement-pagination-btn:hover:not(:disabled) {
  background-color: #f0f0f0;
  transform: translateY(-1px);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
}

.ReservationAppartement-pagination-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.ReservationAppartement-pagination-active {
  background-color: #0F447E;
  color: white;
  border-color: #0F447E;
  font-weight: 600;
}

.ReservationAppartement-pagination-active:hover {
  background-color: #002b63;
}

.ReservationAppartement-pagination-ellipsis {
  padding: 0 8px;
  color: #666;
  font-weight: 600;
}

/* Responsive pour la pagination */
@media (max-width: 768px) {
  .ReservationAppartement-pagination {
    gap: 4px;
  }
  
  .ReservationAppartement-pagination-btn {
    min-width: 32px;
    height: 32px;
    font-size: 12px;
  }
  
  .ReservationAppartement-pagination-ellipsis {
    padding: 0 6px;
    font-size: 12px;
  }
}

@media (max-width: 480px) {
  .ReservationAppartement-pagination-btn {
    min-width: 28px;
    height: 28px;
    font-size: 11px;
  }
}
/* Approvereservationpoppup.css */

.Approvereservationpoppup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  padding: 20px;
  animation: Approvereservationpoppup-fadeIn 0.3s ease-out;
}

.Approvereservationpoppup-closing {
  animation: Approvereservationpoppup-fadeOut 0.3s ease-out;
}

@keyframes Approvereservationpoppup-fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes Approvereservationpoppup-fadeOut {
  from { opacity: 1; }
  to { opacity: 0; }
}

.Approvereservationpoppup-container {
  background: white;
  border-radius: 24px;
  max-width: 520px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  position: relative;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
  animation: Approvereservationpoppup-slideUp 0.3s ease-out;
}

.Approvereservationpoppup-success {
  border-top: 4px solid #10B981;
}
.Approvereservationpoppup-error {
  border-top: 4px solid #EF4444;
}

@keyframes Approvereservationpoppup-slideUp {
  from { transform: translateY(30px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

.Approvereservationpoppup-close {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 40px;
  height: 40px;
  border: none;
  background: rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  z-index: 1001;
}
.Approvereservationpoppup-close:hover {
  background: rgba(0, 0, 0, 0.2);
  transform: scale(1.1);
}

.Approvereservationpoppup-header {
  text-align: center;
  padding: 50px 32px 32px;
  background: linear-gradient(135deg, #f8f9ff 0%, #e8f2ff 100%);
  border-radius: 24px 24px 0 0;
}
.Approvereservationpoppup-success .Approvereservationpoppup-header {
  background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
}
.Approvereservationpoppup-error .Approvereservationpoppup-header {
  background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%);
}

.Approvereservationpoppup-icon {
  margin-bottom: 24px;
  display: flex;
  justify-content: center;
  animation: Approvereservationpoppup-iconBounce 0.6s ease-out;
}
@keyframes Approvereservationpoppup-iconBounce {
  0% { transform: scale(0.3); opacity: 0; }
  50% { transform: scale(1.1); }
  100% { transform: scale(1); opacity: 1; }
}

.Approvereservationpoppup-title {
  font-size: 32px;
  font-weight: 700;
  margin: 0 0 16px 0;
  line-height: 1.2;
}
.Approvereservationpoppup-success .Approvereservationpoppup-title {
  color: #10B981;
}
.Approvereservationpoppup-error .Approvereservationpoppup-title {
  color: #EF4444;
}

.Approvereservationpoppup-subtitle {
  font-size: 16px;
  color: #666;
  line-height: 1.6;
  margin: 0;
  max-width: 400px;
  margin-left: auto;
  margin-right: auto;
}

.Approvereservationpoppup-actions {
  padding: 0 32px 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.Approvereservationpoppup-btn {
  width: 100%;
  padding: 16px 24px;
  border: none;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}
.Approvereservationpoppup-btn::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transition: left 0.5s;
}
.Approvereservationpoppup-btn:hover::before {
  left: 100%;
}
.Approvereservationpoppup-btn-primary {
  background: linear-gradient(135deg, #10B981 0%, #059669 100%);
  color: white;
  box-shadow: 0 4px 15px rgba(16, 185, 129, 0.3);
}
.Approvereservationpoppup-error .Approvereservationpoppup-btn-primary {
  background: linear-gradient(135deg, #EF4444 0%, #DC2626 100%);
  box-shadow: 0 4px 15px rgba(239, 68, 68, 0.3);
}
.Approvereservationpoppup-btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(16, 185, 129, 0.4);
}
.Approvereservationpoppup-error .Approvereservationpoppup-btn-primary:hover {
  box-shadow: 0 8px 25px rgba(239, 68, 68, 0.4);
}

/* Responsive Design (copy/adapt from original) */
@media (max-width: 360px) {
  .Approvereservationpoppup-overlay { padding: 8px; align-items: flex-start; padding-top: 20px; }
  .Approvereservationpoppup-container { border-radius: 16px; max-height: calc(100vh - 40px); width: 100%; }
  .Approvereservationpoppup-close { top: 12px; right: 12px; width: 32px; height: 32px; }
  .Approvereservationpoppup-header { padding: 30px 16px 20px; border-radius: 16px 16px 0 0; }
  .Approvereservationpoppup-icon svg { width: 48px; height: 48px; }
  .Approvereservationpoppup-title { font-size: 22px; }
  .Approvereservationpoppup-subtitle { font-size: 14px; }
  .Approvereservationpoppup-actions { padding: 0 16px 20px; gap: 10px; }
  .Approvereservationpoppup-btn { padding: 14px 18px; font-size: 12px; border-radius: 10px; }
}
@media (min-width: 361px) and (max-width: 480px) {
  .Approvereservationpoppup-overlay { padding: 12px; align-items: flex-start; padding-top: 30px; }
  .Approvereservationpoppup-container { border-radius: 18px; max-height: calc(100vh - 60px); }
  .Approvereservationpoppup-header { padding: 40px 20px 24px; border-radius: 18px 18px 0 0; }
  .Approvereservationpoppup-icon svg { width: 56px; height: 56px; }
  .Approvereservationpoppup-title { font-size: 26px; }
  .Approvereservationpoppup-subtitle { font-size: 15px; }
  .Approvereservationpoppup-actions { padding: 0 20px 24px; }
  .Approvereservationpoppup-btn { padding: 15px 20px; font-size: 13px; }
}
@media (min-width: 481px) and (max-width: 768px) {
  .Approvereservationpoppup-overlay { padding: 16px; }
  .Approvereservationpoppup-container { border-radius: 20px; max-height: 90vh; max-width: 480px; }
  .Approvereservationpoppup-header { padding: 42px 28px 28px; border-radius: 20px 20px 0 0; }
  .Approvereservationpoppup-title { font-size: 28px; }
  .Approvereservationpoppup-actions { padding: 0 28px 28px; }
}
@media (min-width: 769px) and (max-width: 1024px) {
  .Approvereservationpoppup-container { max-width: 560px; }
  .Approvereservationpoppup-actions { flex-direction: row; gap: 16px; }
  .Approvereservationpoppup-btn { flex: 1 1; padding: 16px 20px; }
}
@media (min-width: 1025px) {
  .Approvereservationpoppup-container { max-width: 580px; }
  .Approvereservationpoppup-actions { flex-direction: row; gap: 20px; }
  .Approvereservationpoppup-btn { flex: 1 1; padding: 18px 24px; font-size: 14px; }
  .Approvereservationpoppup-btn:hover { transform: translateY(-2px); }
}
@media (min-width: 1440px) {
  .Approvereservationpoppup-container { max-width: 620px; }
  .Approvereservationpoppup-header { padding: 60px 40px 40px; }
  .Approvereservationpoppup-title { font-size: 36px; }
  .Approvereservationpoppup-subtitle { font-size: 18px; }
  .Approvereservationpoppup-actions { padding: 0 40px 40px; }
}
@media (orientation: portrait) and (max-height: 600px) {
  .Approvereservationpoppup-overlay { align-items: flex-start; padding-top: 10px; }
  .Approvereservationpoppup-container { max-height: calc(100vh - 20px); }
  .Approvereservationpoppup-header { padding: 25px 24px 20px; }
  .Approvereservationpoppup-title { font-size: 24px; }
  .Approvereservationpoppup-actions { padding: 0 24px 20px; }
}
@media (orientation: landscape) and (max-height: 500px) {
  .Approvereservationpoppup-overlay { align-items: flex-start; padding: 8px; }
  .Approvereservationpoppup-container { max-height: calc(100vh - 16px); max-width: 90vw; }
  .Approvereservationpoppup-header { padding: 20px 24px 16px; }
  .Approvereservationpoppup-icon svg { width: 48px; height: 48px; }
  .Approvereservationpoppup-title { font-size: 24px; }
  .Approvereservationpoppup-subtitle { font-size: 14px; }
  .Approvereservationpoppup-actions { flex-direction: row; gap: 12px; padding: 0 24px 16px; }
  .Approvereservationpoppup-btn { flex: 1 1; padding: 12px 16px; font-size: 12px; }
}

.refund-popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  padding: 20px;
}

.refund-popup-content {
  background-color: #fff;
  border-radius: 12px;
  width: 100%;
  max-width: 500px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.18);
  animation: refundFadeIn 0.3s ease-out;
}

@keyframes refundFadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

.refund-popup-header {
  background-color: #0C447E;
  color: #fff;
  padding: 16px 20px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.refund-popup-title {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
}

.refund-popup-close {
  background: none;
  border: none;
  color: #fff;
  font-size: 24px;
  cursor: pointer;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: background-color 0.2s ease;
}

.refund-popup-close:hover {
  background-color: rgba(255, 255, 255, 0.2);
}

.refund-popup-body {
  padding: 20px;
}

.refund-popup-info {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.refund-popup-detail {
  padding: 8px 0;
  border-bottom: 1px solid #f0f0f0;
  line-height: 1.5;
  font-size: 15px;
  display: flex;
  justify-content: space-between;

}

.refund-popup-detail:last-child {
  border-bottom: none;
}

.refund-popup-detail-radio{
    margin-left: 30px;
}
.refund-popup-amount {
  color: #0C447E;
  font-weight: 600;
  font-size: 1.1em;
}

.refund-popup-actions {
  padding: 20px;
  display: flex;
  gap: 10px;
  border-top: 1px solid #e0e0e0;
  justify-content: flex-end;
}

.refund-popup-approve-btn {
  background-color: #b7e4c7;
  color: #2d6a4f;
  border: none;
  border-radius: 6px;
  font-weight: 600;
  padding: 12px 20px;
  cursor: pointer;
  font-size: 16px;
  transition: background 0.2s, color 0.2s;
}

.refund-popup-approve-btn:hover:not(:disabled) {
  background-color: #95d5b2;
}

.refund-popup-approve-btn:disabled {
  background-color: #e5e7eb;
  color: #9ca3af;
  cursor: not-allowed;
}

@media (max-width: 600px) {
  .refund-popup-content {
    max-width: 98vw;
    padding: 0;
  }
  .refund-popup-header, .refund-popup-body, .refund-popup-actions {
    padding-left: 10px;
    padding-right: 10px;
  }
}

/* Style principal pour la page d'administration des partenaires */
.partenaire-admin-vue-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
}

.page-content {
  flex: 1 1;
  margin-left: 250px;
  transition: margin-left 0.3s ease;
  box-sizing: border-box;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}

/* Quand le sidebar est collapsé */
.partenaire-admin-vue-page.sidebar-collapsed .page-content {
  margin-left: 70px; /* Largeur du sidebar collapsé */
  width: calc(100% - 70px);
}
/* Largeur des blocs enfants UNIQUEMENT dans la page d’édition d’appartement */
.partenaire-admin-vue-page .page-content > * {
  max-width: 1800px;
  width: 100%;
  box-sizing: border-box;
  overflow-x: auto; /* Permet le défilement horizontal si nécessaire */
}
/* Conteneur pour la liste des partenaires */
.list-container {
  padding: 20px;
  box-sizing: border-box;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 60px !important; /* Largeur du sidebar en mobile */
    width: calc(100% - 60px) !important;
  }
}
/* Styles du conteneur principal */
.partenaire-container {
  width: 100%;
  padding: 16px;
  box-sizing: border-box;
}

/* Titre bicolore */
.partenaire-title {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 24px;
}

.partenaire-title-blue {
  color: #0F447E; /* Bleu foncé */
}

.partenaire-title-red {
  color: #e30613; /* Rouge */
}

/* Grille pour les cartes de statistiques */
.partenaire-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 20px;
  gap: 20px;
}

/* Style pour chaque carte */
.partenaire-card {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  background-color: white;
  border-radius: 8px;
  padding: 20px;
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.08);
  border: 1px solid #f0f0f0;
  position: relative;
  overflow: hidden;
  transition: all 0.2s ease;
}

/* Bordure bleue en haut des cartes */
.partenaire-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: #0F447E; /* Bleu foncé */
}

/* Effet au survol des cartes */
.partenaire-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* Contenu de la carte */
.partenaire-card-content {
  flex: 1 1;
}

/* Titre de la statistique */
.partenaire-card-title {
  font-size: 14px;
  font-weight: 500;
  color: #64748b;
  margin: 0 0 8px 0;
}

/* Valeur principale */
.partenaire-card-value {
  font-size: 28px;
  font-weight: 700;
  color: #111827;
  margin: 0 0 8px 0;
}

/* Variation (positive ou négative) */
.partenaire-card-variation {
  display: flex;
  align-items: center;
  font-size: 14px;
  font-weight: 500;
}

/* Style pour la variation positive */
.partenaire-positive {
  color: #e30613; /* Rouge */
}

/* Flèche pour variation positive */
.partenaire-positive::before {
  content: '↑';
  display: inline-block;
  margin-right: 4px;
}

/* Style pour la variation négative */
.partenaire-negative {
  color: #e30613; /* Rouge - même couleur d'après la maquette */
}

/* Flèche pour variation négative */
.partenaire-negative::before {
  content: '↓';
  display: inline-block;
  margin-right: 4px;
}

/* Container pour les icônes */
.partenaire-icon-container {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 6px;
  background-color: #f8fafc;
  margin-left: 16px;
}

/* Style pour les icônes */
.partenaire-icon {
  color: #94a3b8;
}

/* Media queries pour la responsivité */
@media (max-width: 1024px) {
  .partenaire-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
  }
  
  .partenaire-card {
    padding: 16px;
  }
  
  .partenaire-card-value {
    font-size: 24px;
  }
}

@media (max-width: 768px) {
  .partenaire-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  
  .partenaire-title {
    font-size: 24px;
  }
}

@media (max-width: 480px) {
  .partenaire-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  
  .partenaire-card {
    padding: 14px;
  }
  
  .partenaire-title {
    font-size: 22px;
  }
  
  .partenaire-card-title {
    font-size: 13px;
  }
  
  .partenaire-card-value {
    font-size: 22px;
  }
}
:root {
  --skel-light: #f3f6fb;
  --skel-dark: #e9edf3;
  --skel-radius: 6px;
}

/* Container */
.table-skel-card {
  background: #fff;
  border-radius: 10px;
  border: 1px solid #eceff4;
  padding: 16px;
  box-shadow: 0 2px 6px rgba(0,0,0,.05);
  width: 100%;
}

/* Header */
.table-skel-header {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-columns: var(--skel-cols, repeat(5, 1fr));
  grid-gap: 12px;
  gap: 12px;
  margin-bottom: 14px;
}
.table-skel-headcell {
  height: 16px;
  background: #e9edf3;
  background: var(--skel-dark);
  border-radius: 6px;
  border-radius: var(--skel-radius);
}

/* Rows */
.table-skel-row {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-columns: var(--skel-cols, repeat(5, 1fr));
  grid-gap: 12px;
  gap: 12px;
  margin-bottom: 10px;
}
.table-skel-cell {
  height: 20px;
  background: #f3f6fb;
  background: var(--skel-light);
  border-radius: 6px;
  border-radius: var(--skel-radius);
}

/* Effet shimmer */
.table-skel-card * {
  position: relative;
  overflow: hidden;
}
.table-skel-card *::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.6),
    transparent
  );
  animation: shimmer 1.2s infinite;
}
@keyframes shimmer {
  100% {
    transform: translateX(100%);
  }
}

/* Container principal */
.PartenaireInfoFusion-main-container {
  font-family: "Poppins", sans-serif;
  padding: 20px;
  max-width: 100%;
  margin: 0 auto;
}

/* Titre principal */
.PartenaireInfoFusion-main-title {
  font-size: 24px;
  font-weight: 600;
  color: #0f447e;
  margin-bottom: 20px;
  white-space: nowrap;
}

.PartenaireInfoFusion-main-title-highlight {
  color: #e30613;
}

/* Container de la liste */
.PartenaireInfoFusion-container {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  padding: 0;
  margin-top: 10px;
  overflow: hidden;
}

/* En-tête de la liste */
.PartenaireInfoFusion-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid #f0f0f0;
}

.PartenaireInfoFusion-title {
  font-size: 16px;
  font-weight: 600;
  color: #0f447e;
  margin: 0;
}

.PartenaireInfoFusion-title-c {
  color: #e30613;
}

/* Tableau avec barre de défilement */
.PartenaireInfoFusion-table-container {
  overflow-x: auto;
  max-height: 500px;
  overflow-y: auto;
  position: relative;
}

/* Indicateur de défilement horizontal pour mobile */
.PartenaireInfoFusion-table-container::after {
  /* content: ""; */
  position: absolute;
  bottom: 0;
  right: 0;
  width: 60px;
  height: 20px;
  background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.8));
  pointer-events: none;
  animation: fadeInOut 1.5s infinite alternate;
  display: none;
}

@keyframes fadeInOut {
  from {
    opacity: 0.4;
  }
  to {
    opacity: 1;
  }
}

/* Style de la table */
.PartenaireInfoFusion-table {
  width: 100%;
  border-collapse: collapse;
}

.PartenaireInfoFusion-th,
.PartenaireInfoFusion-td {
  padding: 15px;
  text-align: left;
  border-bottom: 1px solid #f0f0f0;
  font-size: 14px;
}

.PartenaireInfoFusion-th {
  font-weight: 500;
  color: #0f447e;
  background-color: #fafafa;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 1;
}

.PartenaireInfoFusion-tr:hover {
  background-color: #f9f9f9;
}

.PartenaireInfoFusion-tr:last-child .PartenaireInfoFusion-td {
  border-bottom: none;
}

.PartenaireInfoFusion-td {
  color: #333;
}

/* Statuts */
.PartenaireInfoFusion-status {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}

.PartenaireInfoFusion-statusActive {
  background-color: rgba(76, 175, 80, 0.1);
  color: #4caf50;
}

.PartenaireInfoFusion-statusInactive {
  background-color: rgba(244, 67, 54, 0.1);
  color: #e30613;
}

/* Style des actions */
.PartenaireInfoFusion-actions {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
}

.PartenaireInfoFusion-action-btn {
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  width: 30px;
  height: 30px;
  border-radius: 4px;
  transition: background-color 0.2s;
}

.PartenaireInfoFusion-action-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.PartenaireInfoFusion-view-btn {
  color: #4caf50;
  background-color: #e8f5e9;
}

.PartenaireInfoFusion-view-btn:hover {
  background-color: rgba(76, 175, 80, 0.2);
}

.PartenaireInfoFusion-edit-btn {
  color: #0f447e;
  background-color: rgba(14, 76, 144, 0.1);
}

.PartenaireInfoFusion-edit-btn:hover {
  background-color: rgba(14, 76, 144, 0.2);
}

.PartenaireInfoFusion-toggle-btn {
  color: #4caf50;
  background-color: rgba(76, 175, 80, 0.1);
  font-size: 18px;
}

.PartenaireInfoFusion-toggle-btn:hover {
  background-color: rgba(76, 175, 80, 0.2);
}

.PartenaireInfoFusion-spinner {
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* Style de pagination */
.PartenaireInfoFusion-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 20px 0;
  gap: 5px;
}

.PartenaireInfoFusion-pagination-btn {
  background-color: #f0f4f9;
  border: none;
  color: #333;
  padding: 8px 12px;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.3s;
  min-width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
}

.PartenaireInfoFusion-pagination-btn:hover:not(.disabled) {
  background-color: #e9f5fb;
}

.PartenaireInfoFusion-pagination-btn.active {
  background-color: #0e4c90;
  color: white;
}

.PartenaireInfoFusion-pagination-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Modal */
.PartenaireInfoFusion-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.PartenaireInfoFusion-modal-content {
  background-color: #fff;
  border-radius: 8px;
  width: 90%;
  max-width: 600px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

.PartenaireInfoFusion-modal-header {
  padding: 15px 20px;
  border-bottom: 1px solid #f0f0f0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.PartenaireInfoFusion-modal-header h3 {
  margin: 0;
  color: #0f447e;
  font-size: 18px;
  font-weight: 600;
}

.PartenaireInfoFusion-modal-close {
  background: transparent;
  border: none;
  font-size: 24px;
  cursor: pointer;
  color: #666;
}

.PartenaireInfoFusion-modal-body {
  padding: 20px;
}

.PartenaireInfoFusion-detail-item {
  margin-bottom: 12px;
  display: flex;
  flex-direction: column;
}

.PartenaireInfoFusion-detail-label {
  font-weight: 600;
  color: #0f447e;
  font-size: 14px;
  margin-bottom: 4px;
}

.PartenaireInfoFusion-detail-value {
  color: #333;
  font-size: 14px;
}

.PartenaireInfoFusion-modal-footer {
  padding: 15px 20px;
  display: flex;
  justify-content: flex-end;
  border-top: 1px solid #eaeaea;
}

.PartenaireInfoFusion-modal-btn {
  background-color: #0f447e;
  color: white;
  border: none;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.3s;
}

.PartenaireInfoFusion-modal-btn:hover {
  background-color: #0d4080;
}

/* Styles pour les champs de formulaire */
.PartenaireInfoFusion-input {
  padding: 8px;
  border: 1px solid #ddd;
  border-radius: 4px;
  font-size: 14px;
  width: 100%;
  box-sizing: border-box;
}

.PartenaireInfoFusion-input:focus {
  outline: none;
  border-color: #0f447e;
  box-shadow: 0 0 5px rgba(14, 76, 144, 0.2);
}

/* Popup de confirmation */
.PartenaireInfoFusion-confirmation-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1001;
}

.PartenaireInfoFusion-confirmation-content {
  background-color: white;
  width: 90%;
  max-width: 400px;
  border-radius: 8px;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  overflow: hidden;
  animation: modalFadeIn 0.3s ease-out;
}

.PartenaireInfoFusion-confirmation-header {
  padding: 15px 20px;
  background-color: #0f447e;
  color: white;
}

.PartenaireInfoFusion-confirmation-header h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}

.PartenaireInfoFusion-confirmation-body {
  padding: 20px;
}

.PartenaireInfoFusion-confirmation-body p {
  margin: 0;
  color: #333;
  font-size: 14px;
  line-height: 1.5;
}

.PartenaireInfoFusion-confirmation-footer {
  padding: 15px 20px;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  border-top: 1px solid #eaeaea;
}

.PartenaireInfoFusion-confirmation-btn {
  border: none;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.3s;
}

.title-admin-modify-partner {
  display: block;
  font-size: 1.8rem;
}

.PartenaireInfoFusion-confirmation-btn-cancel {
  background-color: #f5f5f5;
  color: #666;
}

.PartenaireInfoFusion-confirmation-btn-cancel:hover {
  background-color: #e0e0e0;
}

.PartenaireInfoFusion-confirmation-btn-confirm {
  background-color: #0f447e;
  color: white;
}

.PartenaireInfoFusion-confirmation-btn-confirm:hover {
  background-color: #0d4080;
}

/* Responsive */
@media (max-width: 992px) {
  .PartenaireInfoFusion-table {
    min-width: 800px;
  }
}

@media (max-width: 768px) {
  .PartenaireInfoFusion-main-container {
    padding: 10px;
  }

  .PartenaireInfoFusion-main-title {
    font-size: 18px;
  }

  .PartenaireInfoFusion-title {
    font-size: 14px;
  }

  /* Affiche l'indicateur de défilement sur mobile */
  .PartenaireInfoFusion-table-container::after {
    display: block;
  }

  /* Assure que le défilement horizontal est évident sur mobile */
  .PartenaireInfoFusion-table-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #0f447e #f0f0f0;
  }

  .PartenaireInfoFusion-table-container::-webkit-scrollbar {
    height: 6px;
  }

  .PartenaireInfoFusion-table-container::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
  }

  .PartenaireInfoFusion-table-container::-webkit-scrollbar-thumb {
    background: #0f447e;
    border-radius: 3px;
  }

  .PartenaireInfoFusion-th,
  .PartenaireInfoFusion-td {
    padding: 10px;
    font-size: 13px;
  }

  .PartenaireInfoFusion-action-btn {
    width: 28px;
    height: 28px;
  }

  .PartenaireInfoFusion-pagination {
    flex-wrap: wrap;
  }

  .PartenaireInfoFusion-modal-content {
    width: 95%;
  }

  .PartenaireInfoFusion-detail-label {
    width: 100%;
    margin-bottom: 2px;
  }
}

@media (max-width: 480px) {
  .PartenaireInfoFusion-main-container {
    padding: 8px;
  }

  .PartenaireInfoFusion-container {
    border-radius: 6px;
  }

  .PartenaireInfoFusion-header {
    padding: 12px 15px;
  }

  .PartenaireInfoFusion-th,
  .PartenaireInfoFusion-td {
    padding: 8px;
    font-size: 12px;
  }

  .PartenaireInfoFusion-pagination-btn {
    min-width: 28px;
    height: 28px;
    font-size: 12px;
    padding: 6px 8px;
  }

  .PartenaireInfoFusion-modal-header {
    padding: 12px 15px;
  }

  .PartenaireInfoFusion-modal-header h3 {
    font-size: 16px;
  }

  .PartenaireInfoFusion-modal-body {
    padding: 15px;
  }

  .PartenaireInfoFusion-confirmation-content {
    width: 95%;
  }
}

/* Optimisations pour très petits écrans */
@media (max-width: 320px) {
  .PartenaireInfoFusion-main-title {
    font-size: 16px;
  }

  .PartenaireInfoFusion-title {
    font-size: 13px;
  }

  .PartenaireInfoFusion-th,
  .PartenaireInfoFusion-td {
    padding: 6px;
    font-size: 11px;
  }

  .PartenaireInfoFusion-action-btn {
    width: 24px;
    height: 24px;
    font-size: 12px;
  }
}

/* Styles pour cacher les colonnes sur mobile */
.PartenaireInfoFusion-desktop-only {
  display: table-cell;
}

/* Sur mobile - cacher toutes les colonnes sauf Nom et Actions */
@media (max-width: 768px) {
  .PartenaireInfoFusion-desktop-only {
    display: none;
  }

  /* Ajuster la largeur des colonnes visibles */
  .PartenaireInfoFusion-th:first-child,
  .PartenaireInfoFusion-td:first-child {
    width: 40%;
    min-width: 120px;
  }

  .PartenaireInfoFusion-th:last-child,
  .PartenaireInfoFusion-td:last-child {
    width: 60%;
    min-width: 180px;
  }

  /* Optimiser l'affichage des actions sur mobile */
  .PartenaireInfoFusion-actions {
    gap: 8px;
    justify-content: center;
  }

  .PartenaireInfoFusion-action-btn {
    width: 32px;
    height: 32px;
    font-size: 14px;
  }
}

/* Pour les très petits écrans */
@media (max-width: 480px) {
  .PartenaireInfoFusion-th:first-child,
  .PartenaireInfoFusion-td:first-child {
    width: 35%;
    min-width: 100px;
  }

  .PartenaireInfoFusion-th:last-child,
  .PartenaireInfoFusion-td:last-child {
    width: 65%;
    min-width: 150px;
  }

  .PartenaireInfoFusion-actions {
    gap: 6px;
  }

  .PartenaireInfoFusion-action-btn {
    width: 28px;
    height: 28px;
    font-size: 12px;
  }
}

/* Styles pour cacher les colonnes sur mobile */
.PartenaireInfoFusion-desktop-only {
  display: table-cell;
}

/* Sur mobile - cacher toutes les colonnes sauf Nom et Actions */
@media (max-width: 768px) {
  .PartenaireInfoFusion-desktop-only {
    display: none !important;
  }

  /* Forcer le tableau à ne pas avoir de largeur minimale sur mobile */
  .PartenaireInfoFusion-table {
    min-width: 100% !important;
    width: 100%;
    table-layout: fixed;
  }

  /* Supprimer le défilement horizontal */
  .PartenaireInfoFusion-table-container {
    overflow-x: hidden;
  }

  /* Ajuster la largeur des colonnes visibles */
  .PartenaireInfoFusion-th:first-child,
  .PartenaireInfoFusion-td:first-child {
    width: 45%;
    padding-left: 12px;
  }

  .PartenaireInfoFusion-th:last-child,
  .PartenaireInfoFusion-td:last-child {
    width: 55%;
    padding-right: 12px;
  }

  /* Optimiser l'affichage des actions sur mobile */
  .PartenaireInfoFusion-actions {
    gap: 8px;
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .PartenaireInfoFusion-action-btn {
    width: 36px;
    height: 36px;
    font-size: 16px;
  }

  /* Masquer l'indicateur de défilement sur mobile */
  .PartenaireInfoFusion-table-container::after {
    display: none !important;
  }
}

/* Pour les très petits écrans */
@media (max-width: 480px) {
  .PartenaireInfoFusion-th:first-child,
  .PartenaireInfoFusion-td:first-child {
    width: 40%;
    padding-left: 10px;
  }

  .PartenaireInfoFusion-th:last-child,
  .PartenaireInfoFusion-td:last-child {
    width: 60%;
    padding-right: 10px;
  }

  .PartenaireInfoFusion-actions {
    gap: 6px;
  }

  .PartenaireInfoFusion-action-btn {
    width: 32px;
    height: 32px;
    font-size: 14px;
  }
}

/* Pour les très très petits écrans */
@media (max-width: 380px) {
  .PartenaireInfoFusion-th:first-child,
  .PartenaireInfoFusion-td:first-child {
    width: 35%;
    font-size: 12px;
  }

  .PartenaireInfoFusion-th:last-child,
  .PartenaireInfoFusion-td:last-child {
    width: 65%;
  }

  .PartenaireInfoFusion-action-btn {
    width: 28px;
    height: 28px;
    font-size: 13px;
  }
}

.partenaire-detail-admin-vue-page {
  min-height: 100vh;
  width: 100%;
  display: flex;
  background-color: #f5f7f9;
}

.page-content {
  flex: 1 1;
  margin-left: 250px; /* normal sidebar width */
  width: calc(100% - 250px);
  padding-top: 70px; /* header height */
  transition: margin-left 0.3s ease, width 0.3s ease;
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Sidebar collapsed */
.partenaire-detail-admin-vue-page.sidebar-collapsed .page-content {
  margin-left: 70px;
  width: calc(100% - 70px);
}

.detail-container {
  padding: 20px 20px 40px 20px;
  box-sizing: border-box;
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
}

/* Ensures sections inside are spaced correctly */
.detail-container > * {
  margin-bottom: 30px;
}

@media (max-width: 992px) {
  .page-content {
    margin-left: 70px;
    width: calc(100% - 70px);
  }
}

@media (max-width: 768px) {
  .page-content {
    margin-left: 60px !important;
    width: calc(100% - 60px) !important;
    padding-top: 65px;
  }

  .detail-container {
    width: 100%;
    padding: 15px 10px 30px 10px;
  }
}

@media (max-width: 480px) {
  .detail-container {
    width: 100%;
    padding: 15px 0 30px 0;
  }
}

/* PartenaireProfilDetail.css */
:root {
  --primary-blue: #0f447e;
  --text-gray: #707070;
  --active-green: #5ece5e;
  --card-background: #d50606;
  --body-background: #f5f5f5;
  --border-radius: 8px;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-family: "Poppins", sans-serif;
}

.PartenaireProfilDetail-container {
  margin: 0 auto;
  padding: 20px;
}

.PartenaireProfilDetail-header {
  margin-bottom: 20px;
}

.PartenaireProfilDetail-retour-btn {
  background: none;
  border: none;
  color: #0f447e;
  color: var(--primary-blue);
  font-size: 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  padding: 0;
  margin-bottom: 10px;
}

.PartenaireProfilDetail-retour-icon {
  margin-right: 5px;
}

.PartenaireProfilDetail-title {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 15px;
}

.PartenaireProfilDetail-details-text {
  color: #0f447e;
  color: var(--primary-blue);
}

.PartenaireProfilDetail-partenaires-text {
  color: #e30613;
}

.PartenaireProfilDetail-card {
  background-color: #d50606;
  background-color: var(--card-background);
  border-radius: 8px;
  border-radius: var(--border-radius);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  padding: 20px;
  display: flex;
  flex-direction: row;
}

.PartenaireProfilDetail-avatar-container {
  padding: 20px;
  background-color: #f8f8f8;
  border-radius: 8px;
  border-radius: var(--border-radius);
  width: 200px;
  height: 220px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 30px;
}

.PartenaireProfilDetail-avatar {
  width: 150px;
  height: 150px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.PartenaireProfilDetail-person-icon {
  width: 100px;
  height: 100px;
  fill: #0f447e;
  fill: var(--primary-blue);
}

.PartenaireProfilDetail-info {
  flex: 1 1;
}

.PartenaireProfilDetail-info-row {
  display: flex;
  padding: 10px 0;
  border-bottom: 1px solid #f0f0f0;
  flex-wrap: wrap;
}

.PartenaireProfilDetail-info-row:last-child {
  border-bottom: none;
}

.PartenaireProfilDetail-info-label {
  width: 30%;
  min-width: 120px;
  color: #707070;
  color: var(--text-gray);
  font-size: 15px;
}

.PartenaireProfilDetail-info-value {
  flex: 1 1;
  color: #0f447e;
  color: var(--primary-blue);
  font-weight: 500;
  font-size: 15px;
  word-break: break-word;
}

.PartenaireProfilDetail-status-badge {
  background-color: #5ece5e;
  background-color: var(--active-green);
  color: white;
  padding: 5px 15px;
  border-radius: 4px;
  font-size: 14px;
}

@media screen and (max-width: 992px) {
  .PartenaireProfilDetail-card {
    flex-direction: column;
  }

  .PartenaireProfilDetail-avatar-container {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;
    padding: 15px;
  }
}

/* Responsive styles */
@media screen and (max-width: 768px) {
  .PartenaireProfilDetail-avatar {
    width: 120px;
    height: 120px;
  }

  .PartenaireProfilDetail-person-icon {
    width: 80px;
    height: 80px;
  }

  .PartenaireProfilDetail-info-label {
    width: 40%;
    min-width: 120px;
  }
}

@media screen and (max-width: 480px) {
  .PartenaireProfilDetail-container {
    padding: 10px;
  }

  .PartenaireProfilDetail-title {
    font-size: 20px;
  }

  .PartenaireProfilDetail-card {
    padding: 15px;
  }

  .PartenaireProfilDetail-info-label {
    min-width: 100px;
    font-size: 14px;
  }

  .PartenaireProfilDetail-info-value {
    font-size: 14px;
  }
}

.PartenaireStatComponent-wrapper {
  font-family: "Poppins", sans-serif;
  background-color: transparent;
  max-width: 1500px;
  margin: 10px auto;
  padding: 0 20px;
}

.PartenaireStatComponent-header {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}

.PartenaireStatComponent-title-icon {
  color: #0f447e;
  width: 24px;
  height: 24px;
  margin-right: 10px;
}

.PartenaireStatComponent-title {
  font-size: 20px;
  font-weight: 700;
  color: #0f447e;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 5px;
}

.PartenaireStatComponent-highlight {
  color: #e30613;
}

.PartenaireStatComponent-container {
  display: flex;
  justify-content: space-between;
  gap: 16px;
}

.PartenaireStatComponent-stat-card {
  flex: 1 1;
  display: flex;
  align-items: center;
  background-color: #ffffff;
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  padding: 16px;
  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1);
}

.PartenaireStatComponent-icon-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  background-color: #f3f4f6;
  border-radius: 8px;
  margin-right: 16px;
}

.PartenaireStatComponent-icon {
  color: #0f447e;
  width: 24px;
  height: 24px;
}

.PartenaireStatComponent-stat-content {
  display: flex;
  flex-direction: column;
}

.PartenaireStatComponent-stat-number {
  font-size: 20px;
  font-weight: 600;
  color: #1b1b1b;
  margin-bottom: 4px;
}

.PartenaireStatComponent-stat-label {
  font-size: 14px;
  color: #6b7280;
}

@media (max-width: 992px) {
  .PartenaireStatComponent-container {
    flex-direction: column;
    gap: 12px;
  }
}

/* Responsive Design */
@media (max-width: 768px) {
  .PartenaireStatComponent-wrapper {
    padding: 0 10px;
  }

  .PartenaireStatComponent-title {
    font-size: 18px;
  }

  .PartenaireStatComponent-stat-card {
    padding: 12px;
  }

  .PartenaireStatComponent-icon-wrapper {
    width: 40px;
    height: 40px;
    margin-right: 12px;
  }

  .PartenaireStatComponent-icon {
    width: 20px;
    height: 20px;
  }

  .PartenaireStatComponent-stat-number {
    font-size: 18px;
  }

  .PartenaireStatComponent-stat-label {
    font-size: 13px;
  }
}

@media (max-width: 480px) {
  .PartenaireStatComponent-title {
    font-size: 16px;
  }

  .PartenaireStatComponent-stat-card {
    padding: 10px;
  }

  .PartenaireStatComponent-icon-wrapper {
    width: 36px;
    height: 36px;
    margin-right: 10px;
  }

  .PartenaireStatComponent-stat-number {
    font-size: 16px;
  }

  .PartenaireStatComponent-stat-label {
    font-size: 12px;
  }
}

/* Container principal */
.partenaire-appartement-main-container {
  font-family: "Poppins", sans-serif;
  padding: 20px;
  max-width: 100%;
  margin: 0 auto;
}

/* Titre principal */
.partenaire-appartement-title {
  font-size: 24px;
  font-weight: 600;
  color: #0f447e;
  margin-bottom: 20px;
  white-space: nowrap;
}

.partenaire-appartement-title-highlight {
  color: #e30613;
}

/* Container de la liste */
.partenaire-appartement-container {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  padding: 0;
  margin-top: 10px;
  overflow: hidden;
}

/* En-tête de la liste */
.partenaire-appartement-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid #f0f0f0;
}

.partenaire-appartement-section-title {
  font-size: 16px;
  font-weight: 600;
  color: #333;
  margin: 0;
}

/* Bouton d'ajout */
.partenaire-add-appartement-btn {
  background-color: #0f447e;
  color: white;
  border: none;
  border-radius: 5px;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
}

.partenaire-add-appartement-btn:hover {
  background-color: #0d4583;
}

.partenaire-plus-icon {
  margin-right: 5px;
  font-size: 16px;
  font-weight: bold;
}

/* Tableau avec barre de défilement */
.partenaire-appartement-table-container {
  overflow-x: auto;
  max-height: 500px;
  overflow-y: auto;
  position: relative;
}

.partenaire-appartement-table-container::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 60px;
  height: 20px;
  background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.8));
  pointer-events: none;
  animation: fadeInOut 1.5s infinite alternate;
  display: none;
}

@keyframes fadeInOut {
  from {
    opacity: 0.4;
  }
  to {
    opacity: 1;
  }
}

.partenaire-appartement-table {
  width: 100%;
  border-collapse: collapse;
}

.partenaire-appartement-table th,
.partenaire-appartement-table td {
  padding: 15px;
  text-align: left;
  border-bottom: 1px solid #f0f0f0;
  font-size: 14px;
}

.partenaire-appartement-table th {
  font-weight: 500;
  color: #0f447e;
  background-color: #fafafa;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 1;
}

.partenaire-appartement-table tr:hover {
  background-color: #f9f9f9;
}

/* Cellule d'image */
.partenaire-image-cell {
  width: 80px;
}

.partenaire-appt-thumbnail {
  width: 60px;
  height: 60px;
  object-fit: cover;
  border-radius: 4px;
}

/* Options - Style badge */
.partenaire-options-cell {
  min-width: 140px;
}

.partenaire-options-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.partenaire-badge {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
  background-color: #f0f4f9;
  color: #666768;
}

.partenaire-badge.active {
  background-color: #f0f4f9;
  color: #666768;
}

/* Liens */
.partenaire-links-cell {
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.partenaire-link {
  color: #0f447e;
  text-decoration: none;
  font-size: 13px;
  transition: color 0.3s;
}

.partenaire-link:hover {
  color: #e30613;
  text-decoration: underline;
}

/* Actions */
.partenaire-actions-cell {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
}

.partenaire-action-btn {
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  width: 30px;
  height: 30px;
  border-radius: 4px;
}

.partenaire-view-btn {
  color: #4caf50;
  background-color: #e8f5e9;
}

.partenaire-edit-btn {
  color: #0f447e;
  background-color: #e9f5fb;
}

.partenaire-delete-btn {
  color: #e30613;
  background-color: #ffebee;
}

/* Toggle Switch */
.partenaire-toggle-container {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 22px;
}

.partenaire-toggle-input {
  opacity: 0;
  width: 0;
  height: 0;
}

.partenaire-toggle-label {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  border-radius: 22px;
  transition: 0.3s;
}

.partenaire-toggle-label:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  border-radius: 50%;
  transition: 0.3s;
}

.partenaire-toggle-input:checked + .partenaire-toggle-label {
  background-color: #4caf50;
}

.partenaire-toggle-input:checked + .partenaire-toggle-label:before {
  transform: translateX(24px);
}

/* Pagination */
.partenaire-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 20px 0;
  gap: 5px;
}

.partenaire-pagination-btn {
  background-color: #f0f4f9;
  border: none;
  color: #333;
  padding: 8px 12px;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.3s;
}

.partenaire-pagination-btn:hover:not(.disabled) {
  background-color: #e9f5fb;
}

.partenaire-pagination-btn.active {
  background-color: #0f447e;
  color: white;
}

.partenaire-pagination-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Modal */
.partenaire-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.partenaire-modal-content {
  background-color: #fff;
  border-radius: 8px;
  width: 90%;
  max-width: 700px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

.partenaire-modal-header {
  padding: 15px 20px;
  border-bottom: 1px solid #f0f0f0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.partenaire-modal-header h3 {
  margin: 0;
  color: #0f447e;
  font-size: 18px;
  font-weight: 600;
}

.partenaire-modal-close {
  background: transparent;
  border: none;
  font-size: 24px;
  cursor: pointer;
  color: #666;
}

.partenaire-modal-body {
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.partenaire-modal-image-container {
  width: 100%;
  max-height: 300px;
  overflow: hidden;
  border-radius: 6px;
}

.partenaire-modal-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.partenaire-modal-details {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.partenaire-detail-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 8px;
}

.partenaire-detail-label {
  font-weight: 600;
  color: #333;
  width: 150px;
}

.partenaire-detail-value {
  color: #666;
}

.partenaire-detail-link {
  color: #0f447e;
  text-decoration: none;
}

.partenaire-detail-link:hover {
  text-decoration: underline;
}

.partenaire-modal-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.partenaire-detail-description {
  margin-top: 15px;
}

.partenaire-detail-description h4 {
  margin-top: 0;
  margin-bottom: 10px;
  color: #333;
  font-size: 16px;
}

.partenaire-detail-description p {
  margin: 0;
  color: #666;
  line-height: 1.5;
}

/* Responsive */
@media (max-width: 992px) {
  .partenaire-appartement-table {
    min-width: 900px;
  }

  .partenaire-modal-body {
    flex-direction: column;
  }
}

@media (max-width: 768px) {
  .partenaire-appartement-header {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
  }

  .partenaire-appartement-section-title {
    font-size: 14px;
  }

  .partenaire-add-appartement-btn {
    padding: 5px 8px;
    font-size: 8px;
    white-space: nowrap;
    max-width: 130px;
  }

  .partenaire-plus-icon {
    font-size: 12px;
    margin-right: 3px;
  }

  .partenaire-appartement-main-container {
    padding: 10px;
  }

  .partenaire-appartement-title {
    font-size: 18px;
  }

  .partenaire-appartement-table-container::after {
    display: block;
  }

  .partenaire-appartement-table-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #0f447e #f0f0f0;
  }

  .partenaire-appartement-table-container::-webkit-scrollbar {
    height: 6px;
  }

  .partenaire-appartement-table-container::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
  }

  .partenaire-appartement-table-container::-webkit-scrollbar-thumb {
    background: #0f447e;
    border-radius: 3px;
  }

  .partenaire-modal-content {
    width: 95%;
  }

  .partenaire-detail-label {
    width: 100%;
    margin-bottom: 2px;
  }
}

/* Styles pour le flou modal */
.partenaire-appartement-main-container.modal-open {
  position: relative;
}

.partenaire-appartement-main-container.modal-open::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 999;
}

.partenaire-appartement-main-container.modal-open
  > *:not(.partenaire-modal-overlay) {
  filter: blur(3px);
  transition: filter 0.3s ease;
  pointer-events: none;
}

.partenaire-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.partenaire-modal-content {
  z-index: 1001;
  position: relative;
}

.must-be-hidden-on-mobile {
  display: table-cell;
}

@media (max-width: 480px) {
  .partenaire-appartement-table {
    min-width: auto !important;
    width: 100% !important;
  }
  .must-be-hidden-on-mobile {
    display: none !important;
  }
}

/* Container principal */
.PartenaireHotelComponent-main-container {
  font-family: 'Poppins', sans-serif;
  padding: 20px;
  max-width: 100%;
  margin: 0 auto;
}

/* Titre principal */
.PartenaireHotelComponent-title {
  font-size: 24px;
  font-weight: 600;
  color: #0F447E;
  margin-bottom: 20px;
  white-space: nowrap; /* Empêche le texte de se casser sur plusieurs lignes */
}

.PartenaireHotelComponent-title-highlight {
  color: #e30613;
}

/* Container de la liste */
.PartenaireHotelComponent-container {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  padding: 0;
  margin-top: 10px;
  overflow: hidden;
}

/* En-tête de la liste */
.PartenaireHotelComponent-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid #f0f0f0;
}

.PartenaireHotelComponent-section-title {
  font-size: 16px;
  font-weight: 600;
  color: #0F447E;
  margin: 0;
}

/* Bouton d'ajout */
.PartenaireHotelComponent-add-btn {
  background-color: #0F447E;
  color: white;
  border: none;
  border-radius: 5px;
  padding: 8px 14px; /* Légèrement réduit */
  font-size: 13px; /* Légèrement réduit */
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
}

.PartenaireHotelComponent-add-btn:hover {
  background-color: #0d4583;
}

.PartenaireHotelComponent-plus-icon {
  margin-right: 5px;
  font-size: 16px;
  font-weight: bold;
}

/* Tableau avec barre de défilement */
.PartenaireHotelComponent-table-container {
  overflow-x: auto;
  max-height: 500px; /* Hauteur maximale pour la table */
  overflow-y: auto; /* Ajoute une barre de défilement verticale si nécessaire */
  position: relative;
}

/* Indicateur de défilement horizontal pour mobile */
.PartenaireHotelComponent-table-container::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 60px;
  height: 20px;
  background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.8));
  pointer-events: none; /* Pour ne pas interférer avec les interactions */
  animation: fadeInOut 1.5s infinite alternate;
  display: none; /* Caché par défaut, affiché seulement sur mobile */
}

@keyframes fadeInOut {
  from { opacity: 0.4; }
  to { opacity: 1; }
}

.PartenaireHotelComponent-table {
  width: 100%;
  border-collapse: collapse;
}

.PartenaireHotelComponent-table th, 
.PartenaireHotelComponent-table td {
  padding: 15px;
  text-align: left;
  border-bottom: 1px solid #f0f0f0;
  font-size: 14px;
}

.PartenaireHotelComponent-table th {
  font-weight: 500;
  color: #0F447E;
  background-color: #fafafa;
  position: -webkit-sticky;
  position: sticky; /* Garde les en-têtes visibles lors du défilement */
  top: 0;
  z-index: 1;
}

.PartenaireHotelComponent-table tr:hover {
  background-color: #f9f9f9;
}

/* Cellule d'image */
.PartenaireHotelComponent-image-cell {
  width: 80px;
}

.PartenaireHotelComponent-thumbnail {
  width: 60px;
  height: 60px;
  object-fit: cover;
  border-radius: 4px;
}

/* Options - Style badge */
.PartenaireHotelComponent-options-cell {
  min-width: 140px;
}

.PartenaireHotelComponent-options-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.PartenaireHotelComponent-badge {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
  background-color: #f0f4f9; /* Couleur de fond gris clair comme sur l'image */
  color: #666768;
}

.PartenaireHotelComponent-badge.active {
  background-color: #f0f4f9; /* Même couleur que les badges normaux */
  color: #666768;
}

/* Liens */
.PartenaireHotelComponent-links-cell {
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.PartenaireHotelComponent-link {
  color: #0F447E;
  text-decoration: none;
  font-size: 13px;
  transition: color 0.3s;
}

.PartenaireHotelComponent-link:hover {
  color: #e30613;
  text-decoration: underline;
}

/* Actions */
.PartenaireHotelComponent-actions-cell {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
}

.PartenaireHotelComponent-action-btn {
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  width: 30px;
  height: 30px;
  border-radius: 4px;
}

.PartenaireHotelComponent-view-btn {
  color: #4CAF50;
  background-color: #e8f5e9;
}

.PartenaireHotelComponent-edit-btn {
  color: #0F447E;
  background-color: #e9f5fb;
}

.PartenaireHotelComponent-delete-btn {
  color: #e30613;
  background-color: #ffebee;
}

/* Toggle Switch */
.PartenaireHotelComponent-toggle-container {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 22px;
}

.PartenaireHotelComponent-toggle-input {
  opacity: 0;
  width: 0;
  height: 0;
}

.PartenaireHotelComponent-toggle-label {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  border-radius: 22px;
  transition: .3s;
}

.PartenaireHotelComponent-toggle-label:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  border-radius: 50%;
  transition: .3s;
}

.PartenaireHotelComponent-toggle-input:checked + .PartenaireHotelComponent-toggle-label {
  background-color: #4CAF50;
}

.PartenaireHotelComponent-toggle-input:checked + .PartenaireHotelComponent-toggle-label:before {
  transform: translateX(24px);
}

/* Pagination */
.PartenaireHotelComponent-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 20px 0;
  gap: 5px;
}

.PartenaireHotelComponent-pagination-btn {
  background-color: #f0f4f9;
  border: none;
  color: #333;
  padding: 8px 12px;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.3s;
}

.PartenaireHotelComponent-pagination-btn:hover:not(.disabled) {
  background-color: #e9f5fb;
}

.PartenaireHotelComponent-pagination-btn.active {
  background-color: #0F447E;
  color: white;
}

.PartenaireHotelComponent-pagination-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Modal */
.PartenaireHotelComponent-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.PartenaireHotelComponent-modal-content {
  background-color: #fff;
  border-radius: 8px;
  width: 90%;
  max-width: 700px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

.PartenaireHotelComponent-modal-header {
  padding: 15px 20px;
  border-bottom: 1px solid #f0f0f0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.PartenaireHotelComponent-modal-header h3 {
  margin: 0;
  color: #0F447E;
  font-size: 18px;
  font-weight: 600;
}

.PartenaireHotelComponent-modal-close {
  background: transparent;
  border: none;
  font-size: 24px;
  cursor: pointer;
  color: #666;
}

.PartenaireHotelComponent-modal-body {
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.PartenaireHotelComponent-modal-image-container {
  width: 100%;
  max-height: 300px;
  overflow: hidden;
  border-radius: 6px;
}

.PartenaireHotelComponent-modal-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.PartenaireHotelComponent-modal-details {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.PartenaireHotelComponent-detail-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 8px;
}

.PartenaireHotelComponent-detail-label {
  font-weight: 600;
  color: #333;
  width: 150px;
}

.PartenaireHotelComponent-detail-value {
  color: #666;
}

.PartenaireHotelComponent-detail-link {
  color: #0F447E;
  text-decoration: none;
}

.PartenaireHotelComponent-detail-link:hover {
  text-decoration: underline;
}

.PartenaireHotelComponent-modal-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.PartenaireHotelComponent-detail-description {
  margin-top: 15px;
}

.PartenaireHotelComponent-detail-description h4 {
  margin-top: 0;
  margin-bottom: 10px;
  color: #333;
  font-size: 16px;
}

.PartenaireHotelComponent-detail-description p {
  margin: 0;
  color: #666;
  line-height: 1.5;
}

/* Responsive */
@media (max-width: 992px) {
  .PartenaireHotelComponent-table {
    min-width: 900px;
  }
  
  .PartenaireHotelComponent-modal-body {
    flex-direction: column;
  }
}

@media (max-width: 768px) {
  .PartenaireHotelComponent-header {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
  }
  
  .PartenaireHotelComponent-section-title {
    font-size: 14px;
  }
  
  .PartenaireHotelComponent-add-btn {
    padding: 5px 8px;
    font-size: 8px;
    white-space: nowrap;
    max-width: 130px;
  }
  
  .PartenaireHotelComponent-plus-icon {
    font-size: 12px;
    margin-right: 3px;
  }
  
  .PartenaireHotelComponent-main-container {
    padding: 10px;
  }
  
  .PartenaireHotelComponent-title {
    font-size: 18px;
  }
  
  /* Affiche l'indicateur de défilement sur mobile */
  .PartenaireHotelComponent-table-container::after {
    display: block;
  }
  
  /* Assure que le défilement horizontal est évident sur mobile */
  .PartenaireHotelComponent-table-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #0F447E #f0f0f0;
  }
  
  .PartenaireHotelComponent-table-container::-webkit-scrollbar {
    height: 6px;
  }
  
  .PartenaireHotelComponent-table-container::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
  }
  
  .PartenaireHotelComponent-table-container::-webkit-scrollbar-thumb {
    background: #0F447E;
    border-radius: 3px;
  }
  
  .PartenaireHotelComponent-modal-content {
    width: 95%;
  }
  
  .PartenaireHotelComponent-detail-label {
    width: 100%;
    margin-bottom: 2px;
  }
}

/* Styles pour le flou modal */
.PartenaireHotelComponent-main-container.modal-open {
  position: relative;
}

.PartenaireHotelComponent-main-container.modal-open::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 999;
}

.PartenaireHotelComponent-main-container.modal-open > *:not(.PartenaireHotelComponent-modal-overlay) {
  filter: blur(3px);
  transition: filter 0.3s ease;
  pointer-events: none;
}

/* S'assurer que le modal est au-dessus */
.PartenaireHotelComponent-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.PartenaireHotelComponent-modal-content {
  z-index: 1001;
  position: relative;
}
/* Style principal pour la page d'administration des clients */
.client-admin-vue-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
}

.page-content {
  flex: 1 1;
  margin-left: 250px;
  transition: margin-left 0.3s ease;
  box-sizing: border-box;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
/* Largeur des blocs enfants UNIQUEMENT dans la page d’édition d’appartement */
.client-admin-vue-page .page-content > * {
  max-width: 1920px;
  width: 100%;
  box-sizing: border-box;
  overflow-x: auto; /* Permet le défilement horizontal si nécessaire */
}
/* Quand le sidebar est collapsé */
.client-admin-vue-page.sidebar-collapsed .page-content {
  margin-left: 70px; /* Largeur du sidebar collapsé */
  width: calc(100% - 70px);
}

/* Conteneur pour la liste des clients */
.list-container {
  padding: 20px;
  box-sizing: border-box;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 60px !important; /* Largeur du sidebar en mobile */
    width: calc(100% - 60px) !important;
  }
}
.client-stats-container {
  padding-top: 20px;
  font-family: 'Poppins', sans-serif;
  max-width: 1920px;
  margin: 0 auto;
}

.stats-header {
  margin-bottom: 15px;
}

.stats-title {
  display: flex;
  align-items: center;
  font-size: 1.5rem;
  font-weight: 600;
  color: #0F447E;
  margin: 0;
}

.stats-icon-chart {
  margin-right: 10px;
  display: flex;
  align-items: center;
}

.client-text {
  color: #E30613;
  margin-left: 5px;
}

.stats-cards-container {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  justify-content: space-between;
}

.stats-card {
  background-color: #FFFFFF;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  padding: 20px;
  flex: 1 1;
  min-width: 180px;
  border: 1px solid #E0E0E0;
}

.stats-card-content {
  display: flex;
  align-items: center;
}

.stats-icon {
  background-color: #E3F2FD;
  border-radius: 8px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 15px;
}

.stats-info {
  display: flex;
  flex-direction: column;
}

.stats-value {
  font-size: 1.8rem;
  font-weight: 700;
  color: #0F447E;
  margin: 0;
}

.stats-label {
  color: #757575;
  font-size: 0.9rem;
  margin: 0;
  white-space: nowrap;
}

/* Responsive design for tablets */
@media (max-width: 992px) {
  .stats-cards-container {
    flex-wrap: wrap;
  }

  .stats-card {
    min-width: 160px;
    flex-basis: calc(50% - 10px);
    margin-bottom: 10px;
  }
}

/* Responsive design for mobile */
@media (max-width: 576px) {
  .stats-cards-container {
    flex-direction: column;
  }

  .stats-card {
    flex-basis: 100%;
    width: 100%;
  }

  .stats-value {
    font-size: 1.5rem;
  }
}
/* Container principal */
.ListeCLientAdminVueComponent-client-list-container.UniqueClassclientAdmin {
  font-family: 'Poppins', sans-serif;
  max-width: 1920px;
  margin: 40px auto; /* Augmenté de 20px à 40px pour plus d'espace */
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  overflow: hidden;
  padding: 30px;
}
 
/* En-tête du composant */
.ListeCLientAdminVueComponent-client-list-header.UniqueClassclientAdmin {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}
.ListeCLientAdminVueComponent-client-list-title.UniqueClassclientAdmin {
  font-size: 18px;
  font-weight: 600;
  color: #0F447E;
  margin: 0;
}

.ListeCLientAdminVueComponent-client-list-title-c.UniqueClassclientAdmin {
    color: #E30613;
}

/* Container de la table */
.ListeCLientAdminVueComponent-client-list-table-container.UniqueClassclientAdmin {
  overflow-x: auto;
  border-radius: 4px;
  background-color: #f9f9f9;
}
 
/* Style de la table */
.ListeCLientAdminVueComponent-client-list-table.UniqueClassclientAdmin {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}
.ListeCLientAdminVueComponent-client-list-th.UniqueClassclientAdmin {
  background-color: #f5f5f5;
  font-weight: 500;
  padding: 12px 15px;
  color: #0F447E;
  font-size: 14px;
}

.ListeCLientAdminVueComponent-client-list-tr.UniqueClassclientAdmin {
  border-bottom: 1px solid #eaeaea;
}

.ListeCLientAdminVueComponent-client-list-tr.UniqueClassclientAdmin:last-child {
  border-bottom: none;
}

.ListeCLientAdminVueComponent-client-list-td.UniqueClassclientAdmin {
  padding: 12px 15px;
  font-size: 14px;
  color: #333;
}
 
/* Style des status d'abonnement */
.ListeCLientAdminVueComponent-client-status.UniqueClassclientAdmin {
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 500;
  display: inline-block;
}
.ListeCLientAdminVueComponent-abonne.UniqueClassclientAdmin {
  background-color: #fff3e0;
  color: #ff9800;
}
.ListeCLientAdminVueComponent-non-abonne.UniqueClassclientAdmin {
  background-color: #e8eaf6;
  color: #0F447E;
}
 
/* Style des actions */
.ListeCLientAdminVueComponent-client-list-actions.UniqueClassclientAdmin {
  display: flex;
  gap: 10px;
}
.ListeCLientAdminVueComponent-client-list-action-btn.UniqueClassclientAdmin {
  background: none;
  border: none;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.2s;
}
.ListeCLientAdminVueComponent-client-list-view-btn.UniqueClassclientAdmin {
  color: #4caf50;
  background-color: rgba(76, 175, 80, 0.1);
}

.ListeCLientAdminVueComponent-client-list-view-btn.UniqueClassclientAdmin:hover {
  background-color: rgba(76, 175, 80, 0.2);
}

.ListeCLientAdminVueComponent-client-list-edit-btn.UniqueClassclientAdmin {
  color: #0F447E;
  background-color: rgba(14, 76, 144, 0.1);
}

.ListeCLientAdminVueComponent-client-list-edit-btn.UniqueClassclientAdmin:hover {
  background-color: rgba(14, 76, 144, 0.2);
}

.ListeCLientAdminVueComponent-client-list-delete-btn.UniqueClassclientAdmin {
  color: #E30613;
  background-color: rgba(230, 57, 70, 0.1);
}
.ListeCLientAdminVueComponent-client-list-delete-btn.UniqueClassclientAdmin:hover {
  background-color: rgba(230, 57, 70, 0.2);
}
 
/* Style de pagination */
.ListeCLientAdminVueComponent-client-list-pagination.UniqueClassclientAdmin {
  display: flex;
  justify-content: center;
  margin-top: 20px;
  gap: 5px;
}
.ListeCLientAdminVueComponent-client-list-pagination-btn.UniqueClassclientAdmin {
  min-width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e0e0e0;
  background-color: white;
  color: #333;
  font-size: 14px;
  cursor: pointer;
  border-radius: 4px;
  transition: all 0.2s;
}

.ListeCLientAdminVueComponent-client-list-pagination-btn.UniqueClassclientAdmin:hover:not(:disabled) {
  background-color: #f0f0f0;
}

.ListeCLientAdminVueComponent-client-list-pagination-btn.UniqueClassclientAdmin:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.ListeCLientAdminVueComponent-client-list-pagination-active.UniqueClassclientAdmin {
  background-color: #0F447E;
  color: white;
  border-color: #0F447E;
}
.ListeCLientAdminVueComponent-client-list-pagination-active.UniqueClassclientAdmin:hover {
  background-color: #0a3b70;
}
 
/* Responsive design */
@media (max-width: 768px) {
  .ListeCLientAdminVueComponent-client-list-container.UniqueClassclientAdmin {
    padding: 20px;
    margin: 30px auto; /* Augmenté de 20px à 30px */
    max-width: 96%; /* Réduit légèrement pour laisser de l'espace sur les côtés */
  }
  
  .ListeCLientAdminVueComponent-client-list-header.UniqueClassclientAdmin {
    flex-direction: row;
    margin-bottom: 15px;
  }
  
  .ListeCLientAdminVueComponent-client-list-title.UniqueClassclientAdmin {
    font-size: 16px;
  }
  
  .ListeCLientAdminVueComponent-client-list-th.UniqueClassclientAdmin, 
  .ListeCLientAdminVueComponent-client-list-td.UniqueClassclientAdmin {
    padding: 10px;
    font-size: 13px;
  }
  
  .ListeCLientAdminVueComponent-client-list-table-container.UniqueClassclientAdmin {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #0F447E #f0f0f0;
  }
  
  .ListeCLientAdminVueComponent-client-list-table-container.UniqueClassclientAdmin::-webkit-scrollbar {
    height: 6px;
  }
  
  .ListeCLientAdminVueComponent-client-list-table-container.UniqueClassclientAdmin::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
  }
  
  .ListeCLientAdminVueComponent-client-list-table-container.UniqueClassclientAdmin::-webkit-scrollbar-thumb {
    background: #0F447E;
    border-radius: 3px;
  }
  
  .ListeCLientAdminVueComponent-client-list-action-btn.UniqueClassclientAdmin {
    width: 28px;
    height: 28px;
  }
  
  .ListeCLientAdminVueComponent-client-list-pagination.UniqueClassclientAdmin {
    flex-wrap: wrap;
  }
}
 
@media (max-width: 480px) {
  .ListeCLientAdminVueComponent-client-list-container.UniqueClassclientAdmin {
    padding: 15px;
    margin: 20px auto; /* Ajusté pour les petits écrans */
    max-width: 96%; /* Augmenté légèrement de 98% à 96% pour plus d'air */
  }
  
  .ListeCLientAdminVueComponent-client-list-header.UniqueClassclientAdmin {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
 
  /* Simplifier la pagination sur très petits écrans */
  .ListeCLientAdminVueComponent-client-list-pagination-btn.UniqueClassclientAdmin {
    min-width: 28px;
    height: 28px;
    font-size: 12px;
  }
}
/* Styles pour le toggle */
.ListeCLientAdminVueComponent-client-list-toggle-btn.UniqueClassclientAdmin {
  color: #4CAF50;
  background-color: rgba(76, 175, 80, 0.1);
  font-size: 18px;
}

.ListeCLientAdminVueComponent-client-list-toggle-btn.UniqueClassclientAdmin:hover {
  background-color: rgba(76, 175, 80, 0.2);
}

/* Styles pour les statuts */
.ListeCLientAdminVueComponent-active.UniqueClassclientAdmin {
  background-color: rgba(76, 175, 80, 0.1);
  color: #4CAF50;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}
.ListeCLientAdminVueComponent-inactive.UniqueClassclientAdmin {
  background-color: rgba(244, 67, 54, 0.1);
  color: #E30613;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}
/* Styles pour le popup de confirmation */
.ListeCLientAdminVueComponent-client-list-confirmation-overlay.UniqueClassclientAdmin {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1001;
}
.ListeCLientAdminVueComponent-client-list-confirmation-content.UniqueClassclientAdmin {
  background-color: white;
  width: 90%;
  max-width: 400px;
  border-radius: 8px;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  overflow: hidden;
  animation: ListeCLientAdminVueComponent-modalFadeIn 0.3s ease-out;
}
.ListeCLientAdminVueComponent-client-list-confirmation-header.UniqueClassclientAdmin {
  padding: 15px 20px;
  background-color: #0F447E;
  color: white;
}
.ListeCLientAdminVueComponent-client-list-confirmation-header.UniqueClassclientAdmin h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}

.ListeCLientAdminVueComponent-client-list-confirmation-body.UniqueClassclientAdmin {
  padding: 20px;
}

.ListeCLientAdminVueComponent-client-list-confirmation-body.UniqueClassclientAdmin p {
  margin: 0;
  color: #333;
  font-size: 14px;
  line-height: 1.5;
}
.ListeCLientAdminVueComponent-client-list-confirmation-footer.UniqueClassclientAdmin {
  padding: 15px 20px;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  border-top: 1px solid #eaeaea;
}
.ListeCLientAdminVueComponent-client-list-confirmation-btn.UniqueClassclientAdmin {
  border: none;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.3s;
}
.ListeCLientAdminVueComponent-client-list-confirmation-btn-cancel.UniqueClassclientAdmin {
  background-color: #f5f5f5;
  color: #666;
}

.ListeCLientAdminVueComponent-client-list-confirmation-btn-cancel.UniqueClassclientAdmin:hover {
  background-color: #e0e0e0;
}

.ListeCLientAdminVueComponent-client-list-confirmation-btn-confirm.UniqueClassclientAdmin {
  background-color: #0F447E;
  color: white;
}

.ListeCLientAdminVueComponent-client-list-confirmation-btn-confirm.UniqueClassclientAdmin:hover {
  background-color: #0d4080;
}

@keyframes ListeCLientAdminVueComponent-modalFadeIn {
  from { opacity: 0; transform: translateY(-20px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Header actions container */
.ClientAdmin-header-actions.UniqueClassclientAdmin {
  display: flex;
  align-items: center;
  gap: 10px;
}

@media (max-width: 768px) {
  .ClientAdmin-header-actions.UniqueClassclientAdmin {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
}


/* Ajoutez ces styles à la fin de votre fichier CSS */

/* Classe pour les colonnes à masquer sur mobile */
.ListeCLientAdminVueComponent-desktop-only.UniqueClassclientAdmin {
  display: table-cell;
}

/* Responsive pour mobile - masquer colonnes et optimiser affichage */
@media (max-width: 768px) {
  /* Masquer toutes les colonnes sauf Nom et Actions */
  .ListeCLientAdminVueComponent-desktop-only.UniqueClassclientAdmin {
    display: none !important;
  }
  
  /* Forcer le tableau à occuper 100% sans défilement */
  .ListeCLientAdminVueComponent-client-list-table.UniqueClassclientAdmin {
    min-width: 100% !important;
    width: 100%;
    table-layout: fixed;
  }
  
  /* Supprimer le défilement horizontal */
  .ListeCLientAdminVueComponent-client-list-table-container.UniqueClassclientAdmin {
    overflow-x: hidden;
  }
  
  /* Ajuster les largeurs des colonnes visibles */
  .ListeCLientAdminVueComponent-client-list-th.UniqueClassclientAdmin:first-child,
  .ListeCLientAdminVueComponent-client-list-td.UniqueClassclientAdmin:first-child {
    width: 50%;
    padding-left: 15px;
    text-align: left;
  }
  
  .ListeCLientAdminVueComponent-client-list-th.UniqueClassclientAdmin:last-child,
  .ListeCLientAdminVueComponent-client-list-td.UniqueClassclientAdmin:last-child {
    width: 50%;
    padding-right: 15px;
    text-align: center !important;
  }
  
  /* Forcer le centrage du titre "Action" */
  .ListeCLientAdminVueComponent-client-list-th.UniqueClassclientAdmin:last-child {
    text-align: center !important;
  }
  
  /* Centrer les actions sur mobile */
  .ListeCLientAdminVueComponent-client-list-actions.UniqueClassclientAdmin {
    justify-content: center !important;
    display: flex !important;
    margin: 0 auto;
  }
  
  .ListeCLientAdminVueComponent-client-list-action-btn.UniqueClassclientAdmin {
    width: 36px;
    height: 36px;
    font-size: 16px;
    margin: 0 auto;
  }
}

/* Pour les très petits écrans */
@media (max-width: 480px) {
  .ListeCLientAdminVueComponent-client-list-th.UniqueClassclientAdmin:first-child,
  .ListeCLientAdminVueComponent-client-list-td.UniqueClassclientAdmin:first-child {
    width: 45%;
    font-size: 13px;
  }
  
  .ListeCLientAdminVueComponent-client-list-th.UniqueClassclientAdmin:last-child,
  .ListeCLientAdminVueComponent-client-list-td.UniqueClassclientAdmin:last-child {
    width: 55%;
  }
  
  .ListeCLientAdminVueComponent-client-list-action-btn.UniqueClassclientAdmin {
    width: 32px;
    height: 32px;
    font-size: 14px;
  }
}

/* Pour les très très petits écrans */
@media (max-width: 380px) {
  .ListeCLientAdminVueComponent-client-list-th.UniqueClassclientAdmin:first-child,
  .ListeCLientAdminVueComponent-client-list-td.UniqueClassclientAdmin:first-child {
    width: 40%;
    font-size: 12px;
  }
  
  .ListeCLientAdminVueComponent-client-list-th.UniqueClassclientAdmin:last-child,
  .ListeCLientAdminVueComponent-client-list-td.UniqueClassclientAdmin:last-child {
    width: 60%;
  }
  
  .ListeCLientAdminVueComponent-client-list-action-btn.UniqueClassclientAdmin {
    width: 28px;
    height: 28px;
    font-size: 13px;
  }
}
.page-content {
  flex: 1 1;
  margin-left: 250px;
  transition: margin-left 0.3s ease;
  box-sizing: border-box;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 70px 15px 20px 15px;
  gap: 10px;
}

/* Quand le sidebar est collapsé */
.client-detail-admin-page.sidebar-collapsed .page-content {
  margin-left: 70px;
  width: calc(100% - 70px);
}

/* Largeur des blocs enfants UNIQUEMENT dans la page d’édition d’appartement */
.client-detail-admin-page .page-content > * {
  max-width: 1920px;
  width: 100%;
  box-sizing: border-box;
  overflow-x: auto; /* Permet le défilement horizontal si nécessaire */
}


/* Responsive */
@media (max-width: 768px) {
  .page-content {
    margin-left: 0;
    width: 100%;
    padding: 70px 15px 20px 15px;
    gap: 15px;
  }
}


:root {
  --primary-blue: #0a3977;
  --text-gray: #707070;
  --active-green: #5ece5e;
  --card-background: #ffffff;
  --body-background: #f5f5f5;
  --border-radius: 8px;
}
.profile-card-wrapper-PartenaireProfil {
  width: 100%;
  max-width: 1920%;
  margin: 20px 0;
  padding: 0 15px;
  box-sizing: border-box;
}

.client-header {
  margin-bottom: 20px;
}

.retour-btn {
  background: none;
  border: none;
  color: #0a3977;
  color: var(--primary-blue);
  font-size: 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  padding: 0;
  margin-bottom: 10px;
}

.retour-icon {
  margin-right: 5px;
}

.details-title {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 15px;
}

.details-text {
  color: #0a3977;
  color: var(--primary-blue);
}

.clients-text {
  color: #e63946;
}



.ClientStatAdmin-container {
  font-family: 'Poppins', sans-serif;
  margin: 10px;
  /* max-width: 9900px; */
  padding: 20px;
}

.ClientStatAdmin-header {
  display: flex;
  align-items: center;
  margin-bottom: 25px;
}

.ClientStatAdmin-chart-icon {
  color: #0d4c92;
  margin-right: 12px;
}

.ClientStatAdmin-title {
  font-size: 24px;
  font-weight: 600;
  color: #0d4c92;
  margin: 0;
}

.ClientStatAdmin-client-text {
  color: #e63946;
}

.ClientStatAdmin-cards-container {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}

.ClientStatAdmin-card {
  background-color: white;
  border-radius: 12px;
  padding: 18px 22px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  display: flex;
  align-items: center;
  flex: 1 1;
  min-width: 200px;
}

.ClientStatAdmin-icon-container {
  background-color: #f0f0f0;
  width: 48px;
  height: 48px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 15px;
  color: #0d4c92;
}

.ClientStatAdmin-info {
  display: flex;
  flex-direction: column;
}

.ClientStatAdmin-number {
  font-size: 24px;
  font-weight: 700;
  color: #0d4c92;
  margin: 0 0 5px 0;
}

.ClientStatAdmin-description {
  font-size: 14px;
  color: #6c757d;
  margin: 0;
}

/* Responsive design */
@media (max-width: 768px) {
  .ClientStatAdmin-cards-container {
    flex-direction: column;
  }
  
  .ClientStatAdmin-card {
    width: 100%;
  }
  
  .ClientStatAdmin-container {
    margin: 20px;
    padding: 15px;
  }
}

@media (max-width: 480px) {
  .ClientStatAdmin-header {
    flex-direction: row; /* Gardez le titre et l'icône sur la même ligne */
    align-items: center;
  }
  
  .ClientStatAdmin-title {
    font-size: 18px;
  }
  
  .ClientStatAdmin-container {
    margin: 15px;
    padding: 10px;
  }
}
.CLientAbonementAdminVue .subscription-card-container {
  width: 100%;
  max-width: 1920px;
  margin: 20px auto; /* Centrage horizontal avec auto */
  background: #ffffff;
  border: 1px solid #0c447e;
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  padding: 20px;
  box-sizing: border-box;
  font-family: 'Poppins', sans-serif;
}

.CLientAbonementAdminVue .subscription-card-header {
  display: flex;
  align-items: center;
  justify-content: flex-start; /* Alignement proper */
  margin-bottom: 15px;
  border-bottom: 1px solid #0c447e;
  padding-bottom: 10px;
}

.CLientAbonementAdminVue .subscription-icon {
  color: #0c447e;
  font-size: 20px;
  margin-right: 10px;
  flex-shrink: 0;
  display: flex;
  align-items: center; /* Centrage vertical de l'icône */
}

.CLientAbonementAdminVue .subscription-card-header h2 {
  font-family: 'Poppins', sans-serif;
  font-size: 20px;
  font-weight: 600;
  color: #0c447e;
  margin: 0;
  line-height: 1.2; /* Améliore l'espacement des lignes */
}

.CLientAbonementAdminVue .subscription-card-content {
  padding: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #0c447e #f0f0f0;
}

.CLientAbonementAdminVue .subscription-card-content::-webkit-scrollbar {
  height: 6px;
}

.CLientAbonementAdminVue .subscription-card-content::-webkit-scrollbar-track {
  background: #f0f0f0;
  border-radius: 3px;
}

.CLientAbonementAdminVue .subscription-card-content::-webkit-scrollbar-thumb {
  background: #0c447e;
  border-radius: 3px;
}

.CLientAbonementAdminVue .subscription-item {
  padding: 16px;
  margin: 0 0 15px 0;
  border-radius: 8px;
  background-color: #f9f9f9;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
  width: 100%; /* Assure la largeur complète */
  box-sizing: border-box;
}

.CLientAbonementAdminVue .subscription-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  gap: 10px; /* Espacement entre éléments */
}

.CLientAbonementAdminVue .subscription-title {
  font-size: 16px;
  font-weight: 600;
  color: #0c447e;
  margin: 0;
  flex: 1 1; /* Prend l'espace disponible */
  line-height: 1.3;
}

.CLientAbonementAdminVue .subscription-status {
  padding: 4px 12px;
  border-radius: 50px;
  font-size: 12px;
  font-weight: 500;
  flex-shrink: 0; /* Empêche la réduction */
  white-space: nowrap; /* Empêche le retour à la ligne */
}

.CLientAbonementAdminVue .subscription-status-encours {
  background-color: #e6f4ea;
  color: #137333;
}

.CLientAbonementAdminVue .subscription-status-termine {
  background-color: #e8eaed;
  color: #3c4043;
}

.CLientAbonementAdminVue .subscription-details {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 12px;
  gap: 12px; /* Espacement uniforme */
  align-items: start;
}

.CLientAbonementAdminVue .subscription-detail {
  display: flex;
  flex-direction: column;
  min-width: 0; /* Permet la réduction si nécessaire */
}

.CLientAbonementAdminVue .subscription-label {
  font-size: 12px;
  color: #5a6474;
  margin-bottom: 6px;
  line-height: 1.2;
}

.CLientAbonementAdminVue .subscription-value {
  font-size: 14px;
  color: #333;
  font-weight: 500;
  line-height: 1.3;
  word-wrap: break-word; /* Permet la coupure des mots longs */
}

.CLientAbonementAdminVue .subscription-price {
  color: #0c447e;
}

.CLientAbonementAdminVue .subscription-empty {
  padding: 40px 20px;
  text-align: center;
  color: #5a6474;
}

.CLientAbonementAdminVue .subscription-loading {
  padding: 40px 20px;
  text-align: center;
  color: #5a6474;
}

.CLientAbonementAdminVue .subscription-error {
  padding: 20px;
  color: #ef4444;
  text-align: center;
}

.CLientAbonementAdminVue .subscription-divider {
  border: 0;
  border-top: 1px solid #eaeaea;
  margin: 10px 0;
  width: 100%;
}

.CLientAbonementAdminVue .subscription-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin-top: 20px;
  flex-wrap: wrap; /* Permet le retour à la ligne si nécessaire */
}

.CLientAbonementAdminVue .subscription-pagination-btn {
  padding: 8px 16px;
  background-color: #0c447e;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 14px;
  transition: opacity 0.3s ease; /* Animation douce */
}

.CLientAbonementAdminVue .subscription-pagination-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.CLientAbonementAdminVue .subscription-page-info {
  font-size: 14px;
  color: #5a6474;
  text-align: center;
}

/* Responsive Design Optimisé */

/* Grands écrans (≥1200px) */
@media (min-width: 1200px) {
  .CLientAbonementAdminVue .subscription-card-container {
    padding: 25px;
    margin: 20px auto;
  }

  .CLientAbonementAdminVue .subscription-icon {
    font-size: 24px;
  }

  .CLientAbonementAdminVue .subscription-card-header h2 {
    font-size: 20px;
  }

  .CLientAbonementAdminVue .subscription-title {
    font-size: 18px;
  }

  .CLientAbonementAdminVue .subscription-label {
    font-size: 14px;
  }

  .CLientAbonementAdminVue .subscription-value {
    font-size: 16px;
  }

  .CLientAbonementAdminVue .subscription-details {
    gap: 16px;
  }
}

/* Écrans moyens (992px - 1199px) */
@media (min-width: 992px) and (max-width: 1199px) {
  .CLientAbonementAdminVue .subscription-card-container {
    margin: 15px auto;
    padding: 20px;
  }

  .CLientAbonementAdminVue .subscription-details {
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
  }
}

/* Tablettes (768px - 991px) */
@media (min-width: 768px) and (max-width: 991px) {
  .CLientAbonementAdminVue .subscription-card-container {
    margin: 10px auto;
    padding: 18px;
    max-width: 100%;
  }

  .CLientAbonementAdminVue .subscription-icon {
    font-size: 20px;
  }

  .CLientAbonementAdminVue .subscription-card-header h2 {
    font-size: 18px;
  }

  .CLientAbonementAdminVue .subscription-item {
    padding: 14px;
    margin-bottom: 12px;
  }

  .CLientAbonementAdminVue .subscription-title {
    font-size: 15px;
  }

  .CLientAbonementAdminVue .subscription-details {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }

  .CLientAbonementAdminVue .subscription-label {
    font-size: 12px;
  }

  .CLientAbonementAdminVue .subscription-value {
    font-size: 14px;
  }
}

/* Petites tablettes et grands mobiles (576px - 767px) */
@media (min-width: 576px) and (max-width: 767px) {
  .CLientAbonementAdminVue .subscription-card-container {
    margin: 8px auto;
    padding: 16px;
  }

  .CLientAbonementAdminVue .subscription-icon {
    font-size: 18px;
  }

  .CLientAbonementAdminVue .subscription-card-header h2 {
    font-size: 16px;
  }

  .CLientAbonementAdminVue .subscription-item {
    padding: 12px;
    margin-bottom: 10px;
  }

  .CLientAbonementAdminVue .subscription-header {
    gap: 8px;
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .CLientAbonementAdminVue .subscription-title {
    font-size: 14px;
    flex-basis: 100%;
    margin-bottom: 5px;
  }

  .CLientAbonementAdminVue .subscription-status {
    align-self: flex-start;
  }

  .CLientAbonementAdminVue .subscription-details {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .CLientAbonementAdminVue .subscription-detail {
    flex-direction: row;
    align-items: center;
    gap: 10px;
  }

  .CLientAbonementAdminVue .subscription-label {
    font-size: 12px;
    margin-bottom: 0;
    min-width: 100px;
    flex-shrink: 0;
  }

  .CLientAbonementAdminVue .subscription-value {
    font-size: 13px;
    flex: 1 1;
  }
}

/* Mobiles (481px - 575px) */
@media (min-width: 481px) and (max-width: 575px) {
  .CLientAbonementAdminVue .subscription-card-container {
    margin: 5px auto;
    padding: 14px;
  }

  .CLientAbonementAdminVue .subscription-icon {
    font-size: 16px;
    margin-right: 8px;
  }

  .CLientAbonementAdminVue .subscription-card-header h2 {
    font-size: 15px;
  }

  .CLientAbonementAdminVue .subscription-header {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    margin-bottom: 12px;
  }

  .CLientAbonementAdminVue .subscription-title {
    font-size: 14px;
    order: 1;
  }

  .CLientAbonementAdminVue .subscription-status {
    order: 2;
    align-self: flex-start;
    font-size: 11px;
    padding: 3px 8px;
  }

  .CLientAbonementAdminVue .subscription-details {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .CLientAbonementAdminVue .subscription-detail {
    flex-direction: row;
    align-items: center;
    gap: 8px;
    padding: 4px 0;
  }

  .CLientAbonementAdminVue .subscription-label {
    font-size: 12px;
    margin-bottom: 0;
    min-width: 90px;
    flex-shrink: 0;
  }

  .CLientAbonementAdminVue .subscription-value {
    font-size: 12px;
    flex: 1 1;
  }

  .CLientAbonementAdminVue .subscription-item {
    padding: 10px;
    margin-bottom: 8px;
  }
}

/* Petits mobiles (≤480px) */
@media (max-width: 480px) {
  .CLientAbonementAdminVue .subscription-card-container {
    margin: 5px;
    padding: 12px;
    border-radius: 6px;
  }

  .CLientAbonementAdminVue .subscription-icon {
    font-size: 14px;
    margin-right: 6px;
  }

  .CLientAbonementAdminVue .subscription-card-header {
    margin-bottom: 12px;
    padding-bottom: 8px;
  }

  .CLientAbonementAdminVue .subscription-card-header h2 {
    font-size: 14px;
  }

  .CLientAbonementAdminVue .subscription-header {
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
    margin-bottom: 10px;
  }

  .CLientAbonementAdminVue .subscription-title {
    font-size: 13px;
    order: 1;
    line-height: 1.4;
  }

  .CLientAbonementAdminVue .subscription-status {
    order: 2;
    align-self: flex-start;
    padding: 2px 6px;
    font-size: 10px;
  }

  .CLientAbonementAdminVue .subscription-details {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .CLientAbonementAdminVue .subscription-detail {
    flex-direction: row;
    align-items: center;
    gap: 6px;
    padding: 3px 0;
    border-bottom: 1px solid #f0f0f0;
  }

  .CLientAbonementAdminVue .subscription-detail:last-child {
    border-bottom: none;
  }

  .CLientAbonementAdminVue .subscription-label {
    font-size: 11px;
    margin-bottom: 0;
    min-width: 80px;
    flex-shrink: 0;
    font-weight: 500;
  }

  .CLientAbonementAdminVue .subscription-value {
    font-size: 11px;
    flex: 1 1;
    text-align: right;
  }

  .CLientAbonementAdminVue .subscription-item {
    padding: 8px;
    margin-bottom: 6px;
  }

  .CLientAbonementAdminVue .subscription-empty,
  .CLientAbonementAdminVue .subscription-loading,
  .CLientAbonementAdminVue .subscription-error {
    padding: 20px 10px;
    font-size: 13px;
  }

  .CLientAbonementAdminVue .subscription-pagination {
    gap: 6px;
    margin-top: 15px;
  }

  .CLientAbonementAdminVue .subscription-pagination-btn {
    padding: 6px 12px;
    font-size: 12px;
  }

  .CLientAbonementAdminVue .subscription-page-info {
    font-size: 12px;
  }
}

/* Très petits écrans (≤360px) */
@media (max-width: 360px) {
  .CLientAbonementAdminVue .subscription-card-container {
    margin: 2px;
    padding: 10px;
  }

  .CLientAbonementAdminVue .subscription-icon {
    font-size: 12px;
    margin-right: 4px;
  }

  .CLientAbonementAdminVue .subscription-card-header h2 {
    font-size: 13px;
  }

  .CLientAbonementAdminVue .subscription-header {
    gap: 4px;
  }

  .CLientAbonementAdminVue .subscription-title {
    font-size: 12px;
  }

  .CLientAbonementAdminVue .subscription-status {
    padding: 2px 4px;
    font-size: 9px;
  }

  .CLientAbonementAdminVue .subscription-details {
    gap: 4px;
  }

  .CLientAbonementAdminVue .subscription-detail {
    gap: 4px;
    padding: 2px 0;
  }

  .CLientAbonementAdminVue .subscription-label {
    font-size: 10px;
    min-width: 70px;
  }

  .CLientAbonementAdminVue .subscription-value {
    font-size: 10px;
  }

  .CLientAbonementAdminVue .subscription-item {
    padding: 6px;
    margin-bottom: 4px;
  }

  .CLientAbonementAdminVue .subscription-pagination-btn {
    padding: 4px 8px;
    font-size: 11px;
  }

  .CLientAbonementAdminVue .subscription-page-info {
    font-size: 11px;
  }
}

/* Correction de centrage sur mobile */
@media (max-width: 767px) {
  .CLientAbonementAdminVue .subscription-card-container {

    flex-direction: column;
    align-items: center; /* Centre horizontalement tous les éléments enfants */
    justify-content: center;
    margin: 10px auto;
    width: 95%; /* Empêche de coller aux bords */
  }

  .CLientAbonementAdminVue .subscription-card-content {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center; /* Centre les items */
  }

  .CLientAbonementAdminVue .subscription-item {
    width: 100%;
    max-width: 400px; /* Empêche les débordements */
    margin: 8px auto; /* Centre chaque bloc */
  }

  .CLientAbonementAdminVue .subscription-header,
  .CLientAbonementAdminVue .subscription-details {
    justify-content: center;
  }

  .CLientAbonementAdminVue .subscription-empty,
  .CLientAbonementAdminVue .subscription-loading,
  .CLientAbonementAdminVue .subscription-error {
    text-align: center;
    width: 100%;
  }

  .CLientAbonementAdminVue .subscription-pagination {
    justify-content: center;
  }
}

/*  Très petits écrans : centrage renforcé */
@media (max-width: 480px) {
  .CLientAbonementAdminVue .subscription-card-container {
    width: 100%;
    padding: 10px;
    align-items: center;
  }

  .CLientAbonementAdminVue .subscription-item {
    width: 100%;
    max-width: 360px;
    margin: 6px auto;
  }

  .CLientAbonementAdminVue .subscription-card-header {
    justify-content: center;

  }

  .CLientAbonementAdminVue .subscription-card-header h2 {
    width: 100%;
  }
}

/* === STATUTS ESSAI === */
.CLientAbonementAdminVue .subscription-status-trial-active {
  background-color: #e3f2fd;
  color: #0F447E;
  padding: 4px 12px;
  border-radius: 50px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.CLientAbonementAdminVue .subscription-status-trial-expired {
  background-color: #ffebee;
  color: #c62828;
  padding: 4px 12px;
  border-radius: 50px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.AbonnementClientsVue-admin .AbonnementClients-container-admin {
  width: 100%;
  max-width: 1920%;
  margin: 20px 0;
  padding: 0 15px;
  box-sizing: border-box;
}

.AbonnementClientsVue-admin .AbonnementClients-header-admin {
  display: flex;
  align-items: center;
  margin-bottom: 0px;
}

.AbonnementClientsVue-admin .AbonnementClients-iconTitle-admin {
  display: flex;
  align-items: center;
}

.AbonnementClientsVue-admin .AbonnementClients-icon {
  color: #e2b13c;
  margin-right: 12px;
  width: 28px;
  height: 28px;
}

.AbonnementClientsVue-admin .AbonnementClients-title {
  color: #0a3b6c;
  font-size: 22px;
  font-weight: 600;
  margin: 0;
}

.AbonnementClientsVue-admin .AbonnementClients-content {
  padding-top: 0;
}

.AbonnementClientsVue-admin .AbonnementClients-titleRow {
  display: flex;
  justify-content: space-between;
  align-items: center;

}

.AbonnementClientsVue-admin .AbonnementClients-subtitle {
  font-size: 16px;
  font-weight: 500;
  color: #333;
  margin: 0;
}

.AbonnementClientsVue-admin .AbonnementClients-redText {
  color: #e74c3c;
}

.AbonnementClientsVue-admin .AbonnementClients-statusBadge {
  padding: 6px 16px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
}

.AbonnementClientsVue-admin .AbonnementClients-active {
  background-color: #eaf4ff;
  color: #0a3b6c;
}

.AbonnementClientsVue-admin .AbonnementClients-inactive {
  background-color: #f8f8f8;
  color: #888;
}

.AbonnementClients-details {
  margin-top: 15px;
}

.AbonnementClientsVue-admin .AbonnementClients-detailsRow {
  display: flex;
  justify-content: space-between;
}

.AbonnementClientsVue-admin .AbonnementClients-detailColumn {
  flex: 1 1;
  margin-right: 10px;
}

.AbonnementClientsVue-admin .AbonnementClients-detailColumn:last-child {
  margin-right: 0;
}

/* Nouveau style pour les paires label-valeur */
.AbonnementClientsVue-admin .AbonnementClients-detailItem {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 15px;
}

.AbonnementClientsVue-admin .AbonnementClients-detailLabel {
  color: #666;
  font-size: 14px;
  font-weight: 400;
  white-space: nowrap;
  margin-right: 5px;
}

.AbonnementClientsVue-admin .AbonnementClients-detailValue {
  color: #0a3b6c;
  font-size: 16px;
  font-weight: 600;
  flex: 1 1;
  min-width: 0;
}

.AbonnementClientsVue-admin .AbonnementClients-noSubscription {
  padding: 20px 0;
}

.AbonnementClientsVue-admin .AbonnementClients-noSubscriptionMessage {
  color: #666;
  text-align: center;
  font-size: 15px;
}

/* Responsive design */
@media (max-width: 768px) {
 .AbonnementClients-container-admin {
    padding: 20px;
  }

  .AbonnementClients-detailsRow {
    flex-direction: column;
    gap: 5px;
  }

  .AbonnementClientsVue-admin .AbonnementClients-titleRow {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .AbonnementClientsVue-admin .AbonnementClients-statusBadge {
    align-self: flex-start;
  }

  .AbonnementClientsVue-admin .AbonnementClients-detailColumn {
    margin-right: 0;

  }

  /* Style spécifique pour mobile qui permet au texte de rester sur la même ligne que le label */
  .AbonnementClientsVue-admin .AbonnementClients-detailItem {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
  }

  /* Le label reste toujours à gauche */
  .AbonnementClientsVue-admin .AbonnementClients-detailLabel {
    white-space: nowrap;
  }

  /* La valeur peut passer à la ligne si nécessaire mais reste sur la même ligne si possible */
  .AbonnementClientsVue-admin .AbonnementClients-detailValue {
    display: inline;
  }
}
.ClasseReservationAdmin {
  width: 100%;
  max-width: 1920%;
  margin: 20px 0;
  padding: 0 15px;
  box-sizing: border-box;
}

.ClasseReservationAdmin .reservation-history-card-container {
  width: 100%;
  max-width: 1920%;
  margin: 0;
  background: #ffffff;
  border: 1px solid #0c447e;
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  padding: 20px;
  box-sizing: border-box;
  font-family: 'Poppins', sans-serif;
}

.reservation-icon {
  color: #0f447e;
  font-size: 22px;
  margin-right: 10px;
  flex-shrink: 0;
}

.reservation-history-card-header-admin h2 {
  font-family: 'Poppins', sans-serif;
  font-size: 24px;
  font-weight: 600;
  color: #0f447e;
  margin: 0;
  overflow-wrap: break-word;
}
.reservation-history-card-header-admin span {
  color: #E30613;
  }

@media (min-width: 768px) {
  .ClasseReservationAdmin .reservation-history-card-container {
    max-width: 100%;
  }
}

.ClasseReservationAdmin .reservation-history-card-content {
  width: 100%;
}

.ClasseReservationAdmin .modern-pagination-container {
  justify-content: center !important; 
  margin-top: 20px;
}

.ClasseReservationAdmin .modern-pagination-pages {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
}
/* Style principal pour la page de gestion des utilisateurs */
.admin-user-list-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
}

.page-content {
  flex: 1 1;
  margin-left: 250px;
  padding-top: 70px;
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}
/* Largeur des blocs enfants UNIQUEMENT dans la page d’édition d’appartement */
.admin-user-list-page .page-content > * {
  max-width: 1920px;
  width: 100%;
  box-sizing: border-box;
  overflow-x: auto; /* Permet le défilement horizontal si nécessaire */
}
/* Quand le sidebar est collapsé */
.admin-user-list-page.sidebar-collapsed .page-content {
  margin-left: 70px; /* Largeur du sidebar collapsé */
  width: calc(100% - 70px);
}

/* Conteneur pour la liste des utilisateurs */
.admin-user-list-container {
  padding: 0 20px;
  box-sizing: border-box;
}

.access-denied-message {
  margin-top: 100px;
  padding: 20px;
  border: 2px solid red;
  border-radius: 10px;
  font-size: 24px;
  text-align: center;
}
.access-denied-message h2 {
  color: red;
}
.access-denied-message p {
  color: #0F447E;
}



/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 60px !important; /* Largeur du sidebar en mobile */
    width: calc(100% - 60px) !important;
  }
  
  .admin-user-list-container {
    padding: 0 10px;
  }
}

@media (max-width: 480px) {
  .admin-user-list-container {
    padding: 0 5px;
  }
}
/* Container principal */
.UserViewAdmin-container {
  font-family: 'Poppins', sans-serif;
  width: 100%; /* Prend toute la largeur disponible */
  max-width: 1920px; /* Assure que la largeur ne dépasse pas celle de la fenêtre */
  margin: 30px auto; /* Centre le conteneur horizontalement */
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  overflow: hidden;
  box-sizing: border-box; /* Inclut le padding dans la largeur totale */
}

/* En-tête du composant */
.UserViewAdmin-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.UserViewAdmin-title {
  font-size: 18px;
  font-weight: 600;
  color: #0F447E;
  margin: 0;
}

/* Bouton d'ajout */
.UserViewAdmin-add-btn {
  background-color: #0F447E;
  color: white;
  border: none;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
}

.UserViewAdmin-add-btn:hover {
  background-color: #0a3b70;
}

.UserViewAdmin-icon-plus {
  margin-right: 6px;
  font-size: 14px;
}

/* Container de la table */
.UserViewAdmin-table-container {
  overflow-x: auto;
  border-radius: 4px;
  background-color: #f9f9f9;
  width: 100%; /* Prend toute la largeur disponible */
}

/* Style de la table */
.UserViewAdmin-table {
  width: 100%; /* Prend toute la largeur disponible */
  border-collapse: collapse;
  text-align: left;
}

.UserViewAdmin-th {
  background-color: #f5f5f5;
  font-weight: 500;
  padding: 12px 15px;
  color: #0F447E;
  font-size: 14px;
}

.UserViewAdmin-tr {
  border-bottom: 1px solid #eaeaea;
}

.UserViewAdmin-tr:last-child {
  border-bottom: none;
}

.UserViewAdmin-td {
  padding: 12px 15px;
  font-size: 14px;
  color: #333;
}

/* Date formatting styles */
.UserViewAdmin-date {
  font-size: 13px;
  color: #0F447E;
  font-weight: 400;
}

/* Loading and error states */
.UserViewAdmin-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px;
  text-align: center;
}

.UserViewAdmin-loading p {
  margin-top: 15px;
  color: #666;
  font-size: 14px;
}

.UserViewAdmin-error {
  background-color: #f8d7da;
  color: #721c24;
  padding: 15px;
  border-radius: 4px;
  margin: 20px 0;
  border: 1px solid #f5c6cb;
}

.UserViewAdmin-error p {
  margin: 0;
  font-size: 14px;
}

/* Style des actions */
.UserViewAdmin-actions {
  display: flex;
  gap: 10px;
}

.UserViewAdmin-action-btn {
  background: none;
  border: none;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.2s;
}

.UserViewAdmin-edit-btn {
  color: #0F447E;
  background-color: rgba(14, 76, 144, 0.1);
}

.UserViewAdmin-edit-btn:hover {
  background-color: rgba(14, 76, 144, 0.2);
}

.UserViewAdmin-delete-btn {
  color: #e30613;
  background-color: rgba(230, 57, 70, 0.1);
}

.UserViewAdmin-delete-btn:hover {
  background-color: rgba(230, 57, 70, 0.2);
}

/* Style de pagination */
.UserViewAdmin-pagination {
  display: flex;
  justify-content: center;
  margin-top: 20px;
  gap: 5px;
}

.UserViewAdmin-pagination-btn {
  min-width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e0e0e0;
  background-color: white;
  color: #333;
  font-size: 14px;
  cursor: pointer;
  border-radius: 4px;
  transition: all 0.2s;
}

.UserViewAdmin-pagination-btn:hover:not(:disabled) {

  background-color: #0F447E;
  color: #0F447E;
}

.UserViewAdmin-pagination-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.UserViewAdmin-pagination-active {
  background-color: #f0f0f0;
  color: white;
  border-color: #0F447E;
}

.UserViewAdmin-pagination-active:hover {
  background-color: #0a3b70;
}

/* Responsive design */
@media (max-width: 768px) {
  .UserViewAdmin-container {
    padding: 20px;
    width: 100%; /* Prend toute la largeur disponible */
  }

  .UserViewAdmin-header {
    flex-direction: row;
    margin-bottom: 15px;
  }

  .UserViewAdmin-title {
    font-size: 16px;
  }

  .UserViewAdmin-add-btn {
    padding: 6px 12px;
    font-size: 12px;
  }

  .UserViewAdmin-th,
  .UserViewAdmin-td {
    padding: 10px;
    font-size: 13px;
  }

  .UserViewAdmin-table-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #0F447E #f0f0f0;
  }

  .UserViewAdmin-table-container::-webkit-scrollbar {
    height: 6px;
  }

  .UserViewAdmin-table-container::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 2px;
  }

  .UserViewAdmin-table-container::-webkit-scrollbar-thumb {
    background: #0F447E;
    border-radius: 3px;
  }

  .UserViewAdmin-action-btn {
    width: 28px;
    height: 28px;
  }

  .UserViewAdmin-pagination {
    flex-wrap: wrap;
  }
}

@media (max-width: 480px) {
  .UserViewAdmin-container {
    padding: 15px;
    width: 100%; /* Prend toute la largeur disponible */
  }

  .UserViewAdmin-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .UserViewAdmin-add-btn {
    align-self: flex-start;
  }

  /* Simplifier la pagination sur très petits écrans */
  .UserViewAdmin-pagination-btn {
    min-width: 28px;
    height: 28px;
    font-size: 12px;
  }
}

/* Styles pour le statut */
.user-status {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}

.user-status.active {
  background-color: rgba(40, 167, 69, 0.1);
  color: #28a745;
}

.user-status.inactive {
  background-color: rgba(220, 53, 69, 0.1);
  color: #e30613;
}

/* Styles pour le bouton toggle */
.UserViewAdmin-toggle-btn {
  color: #4CAF50;
  background-color: rgba(76, 175, 80, 0.1);
  font-size: 18px;
}

.UserViewAdmin-toggle-btn:hover {
  background-color: rgba(76, 175, 80, 0.2);
}

/* Styles pour la popup de confirmation */
.user-confirmation-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}

.user-confirmation-content {
  background-color: white;
  border-radius: 8px;
  width: 90%;
  max-width: 400px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  overflow: hidden;
}

.user-confirmation-header {
  padding: 16px;
  background-color: #0F447E;
  border-bottom: 1px solid #e9ecef;
}

.user-confirmation-header h3 {
  margin: 0;
  font-size: 18px;
  color: #ffffff;
}

.user-confirmation-body {
  padding: 20px 16px;
  border-bottom: 1px solid #e9ecef;
}

.user-confirmation-body p {
  margin: 0;
  font-size: 14px;
  color: #333;
}

.user-confirmation-footer {
  padding: 16px;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.user-confirmation-btn {
  padding: 8px 16px;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.user-confirmation-btn-cancel {
  background-color: #f8f9fa;
  color: #6c757d;
  border: 1px solid #dee2e6;
}

.user-confirmation-btn-cancel:hover {
  background-color: #e30613;
  color: white;
}

.user-confirmation-btn-confirm {
  background-color: #0F447E;
  color: white;
  border: 1px solid #0F447E;
}

.user-confirmation-btn-confirm:hover {
  background-color: #0a3b70;
}

.UserViewAdmin-header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}


/* Classe pour les colonnes à masquer sur mobile */
.UserViewAdmin-desktop-only {
  display: table-cell;
}

/* Responsive pour mobile - masquer colonnes et optimiser affichage */
@media (max-width: 768px) {
  /* Masquer toutes les colonnes sauf Nom et Actions */
  .UserViewAdmin-desktop-only {
    display: none !important;
  }
  
  /* Forcer le tableau à occuper 100% sans défilement */
  .UserViewAdmin-table {
    min-width: 100% !important;
    width: 100%;
    table-layout: fixed;
  }
  
  /* Supprimer le défilement horizontal */
  .UserViewAdmin-table-container {
    overflow-x: hidden;
  }
  
  /* Ajuster les largeurs des colonnes visibles */
  .UserViewAdmin-th:first-child,
  .UserViewAdmin-td:first-child {
    width: 45%;
    padding-left: 15px;
    text-align: left;
  }
  
  .UserViewAdmin-th:last-child,
  .UserViewAdmin-td:last-child {
    width: 55%;
    padding-right: 15px;
    text-align: center !important;
  }
  
  /* Forcer le centrage du titre "Actions" */
  .UserViewAdmin-th:last-child {
    text-align: center !important;
  }
  
  /* Centrer les actions sur mobile */
  .UserViewAdmin-actions {
    justify-content: center !important;
    display: flex !important;
    margin: 0 auto;
  }
  
  .UserViewAdmin-action-btn {
    width: 36px;
    height: 36px;
    font-size: 16px;
    margin: 0;
  }
}

/* Pour les très petits écrans */
@media (max-width: 480px) {
  .UserViewAdmin-th:first-child,
  .UserViewAdmin-td:first-child {
    width: 40%;
    font-size: 13px;
  }
  
  .UserViewAdmin-th:last-child,
  .UserViewAdmin-td:last-child {
    width: 60%;
  }
  
  .UserViewAdmin-actions {
    gap: 6px;
  }
  
  .UserViewAdmin-action-btn {
    width: 32px;
    height: 32px;
    font-size: 14px;
  }
}

/* Pour les très très petits écrans */
@media (max-width: 380px) {
  .UserViewAdmin-th:first-child,
  .UserViewAdmin-td:first-child {
    width: 35%;
    font-size: 12px;
  }
  
  .UserViewAdmin-th:last-child,
  .UserViewAdmin-td:last-child {
    width: 65%;
  }
  
  .UserViewAdmin-action-btn {
    width: 28px;
    height: 28px;
    font-size: 13px;
  }
}


/* Pagination améliorée */
.UserViewAdmin-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
  gap: 6px;
  flex-wrap: wrap;
}

.UserViewAdmin-pagination-btn {
  min-width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e0e0e0;
  background-color: white;
  color: #333;
  font-size: 14px;
  cursor: pointer;
  border-radius: 6px;
  transition: all 0.2s;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.UserViewAdmin-pagination-btn:hover:not(:disabled) {
  background-color: #f0f0f0;
  transform: translateY(-1px);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
}

.UserViewAdmin-pagination-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.UserViewAdmin-pagination-active {
  background-color: #0F447E;
  color: white;
  border-color: #0F447E;
  font-weight: 600;
}

.UserViewAdmin-pagination-active:hover {
  background-color: #002b63;
}

.UserViewAdmin-pagination-ellipsis {
  padding: 0 8px;
  color: #666;
  font-weight: 600;
}

/* Responsive pour la pagination */
@media (max-width: 768px) {
  .UserViewAdmin-pagination {
    gap: 4px;
  }
  
  .UserViewAdmin-pagination-btn {
    min-width: 32px;
    height: 32px;
    font-size: 12px;
  }
  
  .UserViewAdmin-pagination-ellipsis {
    padding: 0 6px;
    font-size: 12px;
  }
}

@media (max-width: 480px) {
  .UserViewAdmin-pagination-btn {
    min-width: 28px;
    height: 28px;
    font-size: 11px;
  }
}
.agence-reservation-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
}

.page-content {
  flex: 1 1;
  margin-left: 250px;
  transition: margin-left 0.3s ease;
  box-sizing: border-box;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}

/* Quand le sidebar est collapsé */
.agence-reservation-page.sidebar-collapsed .page-content {
  margin-left: 70px; /* Largeur du sidebar collapsé */
  width: calc(100% - 70px);
}

/* Conteneur pour le formulaire de réservation */
.reservation-form-container {
  padding: 20px;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 60px !important; /* Largeur du sidebar en mobile */
    width: calc(100% - 60px) !important;
  }
  
  .reservation-form-container {
    padding: 15px;
  }
}
/* ====== Variables CSS ====== */
:root {
  /* Couleurs principales */
  --color-primary: #0f447e;
  --color-primary-dark: #0d3869;
  --color-primary-light: #eaf2fb;
  --color-danger: #e30613;
  --color-danger-dark: #c10510;
  --color-success: #0f5132;
  --color-error: #842029;

  /* Couleurs UI */
  --color-text: #1e293b;
  --color-text-light: #64748b;
  --color-text-muted: #6b7280;
  --color-border: #e2e8f0;
  --color-border-hover: #cbd5e1;
  --color-bg: #ffffff;
  --color-bg-secondary: #f8fafc;
  --color-bg-disabled: #f1f5f9;

  /* Espacements */
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 1.5rem;
  --spacing-xl: 2rem;

  /* Bordures */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-full: 18px;

  /* Transitions */
  --transition-fast: 0.15s ease;
  --transition-normal: 0.3s ease-in-out;

  /* Tailles */
  --input-height: 44px;
  --max-width-container: 1920px;
}

/* ====== Conteneur général avec contrainte de largeur ====== */
.staff-cash-reservation-form {
  max-width: 1920px;
  max-width: var(--max-width-container);
  margin: 0 auto;
  background-color: #ffffff;
  background-color: var(--color-bg);
  border: 1px solid #e2e8f0;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  border-radius: var(--radius-lg);
  padding: 2rem;
  padding: var(--spacing-xl);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
  width: 100%;
  box-sizing: border-box;
  overflow: visible;
}

.form-title {
  font-size: 1.75rem;
  font-weight: 500;
  color: #0f447e;
  color: var(--color-primary);
  margin-bottom: 2rem;
  margin-bottom: var(--spacing-xl);
  text-align: left;
  letter-spacing: -0.025em;
}

/* ====== Messages ====== */
.message-success,
.message-error {
  padding: 12px 16px;
  border-radius: 8px;
  border-radius: var(--radius-md);
  font-size: 0.9rem;
  margin-bottom: 1rem;
  margin-bottom: var(--spacing-md);
  font-weight: 500;
  animation: fadeIn 0.3s ease-in-out;
  animation: fadeIn var(--transition-normal);
}

.message-success {
  background-color: #e6ffed;
  color: #0f5132;
  color: var(--color-success);
  border: 1px solid #badbcc;
}

.message-error {
  background-color: #f8d7da;
  color: #842029;
  color: var(--color-error);
  border: 1px solid #f5c2c7;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(-5px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ====== Form Structure ====== */
.form-container {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  gap: var(--spacing-lg);
}

.form-row,
.form-row-2,
.form-row-3 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
  grid-gap: 1.5rem;
  grid-gap: var(--spacing-lg);
  gap: var(--spacing-lg);
}

.full-width {
  width: 100%;
}

/* ====== Ligne Appartement / Période ====== */
.form-row-appartement-periode {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
  grid-gap: 1.5rem;
  grid-gap: var(--spacing-lg);
  gap: var(--spacing-lg);
  width: 100%;
  box-sizing: border-box;
  overflow: visible;
}

.form-row-appartement-periode .form-group {
  width: 100%;
  box-sizing: border-box;
}

.form-row-appartement-periode .form-input,
.form-row-appartement-periode .ss-container,
.form-row-appartement-periode .ss-control,
.form-row-appartement-periode .ss-input {
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
}

/* ====== Form Groups ====== */
.form-group {
  display: flex;
  flex-direction: column;
}

.form-label {
  font-size: 0.875rem;
  font-weight: 500;
  color: #0f447e;
  color: var(--color-primary);
  margin-bottom: 0.5rem;
  margin-bottom: var(--spacing-sm);
}

.form-input,
.form-textarea {
  border: 1px solid #e2e8f0;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  border-radius: var(--radius-md);
  padding: 0.75rem;
  font-size: 0.875rem;
  background-color: #ffffff;
  background-color: var(--color-bg);
  min-height: 44px;
  min-height: var(--input-height);
  width: 100%;
  box-sizing: border-box;
}

.form-input:hover {
  border-color: #cbd5e1;
  border-color: var(--color-border-hover);
}

.form-input:focus,
.form-textarea:focus {
  outline: none;
}

.form-textarea {
  resize: vertical;
  font-family: inherit;
}

.date-trigger {
  cursor: pointer;
}

/* Masquer les flèches des inputs number */
input[type='number'].form-input::-webkit-outer-spin-button,
input[type='number'].form-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type='number'].form-input {
  -moz-appearance: textfield;
}

/* ====== Checkbox ====== */
.checkbox-container {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.5rem 0;
  padding: var(--spacing-sm) 0;
}

.checkbox-input {
  width: 1.125rem;
  height: 1.125rem;
  border: 1px solid #e2e8f0;
  border: 1px solid var(--color-border);
  border-radius: 4px;
  accent-color: #e30613;
  accent-color: var(--color-danger);
  cursor: pointer;
}

.checkbox-label {
  font-size: 0.875rem;
  color: #374151;
  -webkit-user-select: none;
          user-select: none;
  cursor: pointer;
}

/* ====== Résumé ====== */
.summary-container {
  background-color: #f8fafc;
  background-color: var(--color-bg-secondary);
  border: 1px solid #e2e8f0;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  border-radius: var(--radius-md);
  padding: 1rem;
  padding: var(--spacing-md);
  font-size: 0.875rem;
  margin-top: 0.5rem;
  margin-top: var(--spacing-sm);
}

.summary-container div {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.25rem 0;
  padding: var(--spacing-xs) 0;
}

.summary-container strong {
  font-weight: 600;
  color: #0f447e;
  color: var(--color-primary);
}

.discount-row {
  color: #065f46;
}

.total-row {
  font-weight: 600;
  border-top: 1px solid #e2e8f0;
  border-top: 1px solid var(--color-border);
  padding-top: 0.5rem;
  padding-top: var(--spacing-sm);
  margin-top: 0.5rem;
  margin-top: var(--spacing-sm);
}

/* ====== Boutons ====== */
.submit-button {
  background-color: #0f447e;
  background-color: var(--color-primary);
  color: #ffffff;
  color: var(--color-bg);
  font-weight: 500;
  font-size: 0.875rem;
  padding: 0.875rem 1.5rem;
  border-radius: 8px;
  border-radius: var(--radius-md);
  border: none;
  cursor: pointer;
  margin-top: 1rem;
  margin-top: var(--spacing-md);
  align-self: flex-start;
  min-width: 180px;
  min-height: 44px;
  min-height: var(--input-height);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  gap: var(--spacing-sm);
}

.submit-button:hover:not(:disabled) {
  background-color: #0d3869;
  background-color: var(--color-primary-dark);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(15, 68, 126, 0.2);
}

.submit-button:active:not(:disabled) {
  transform: translateY(0);
}

.submit-button:disabled {
  background-color: #94a3b8;
  cursor: not-allowed;
  opacity: 0.6;
}

/* ====== Spinner ====== */
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

.animate-spin {
  animation: spin 1s linear infinite;
}

/* ====== Modale ====== */
.modal {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  -webkit-backdrop-filter: blur(4px);
          backdrop-filter: blur(4px);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  padding: 1rem;
  padding: var(--spacing-md);
}

.modal-content {
  background: #ffffff;
  background: var(--color-bg);
  padding: 1.5rem;
  padding: var(--spacing-lg);
  border-radius: 8px;
  border-radius: var(--radius-md);
  max-width: 420px;
  width: 100%;
  text-align: center;
  max-height: 90vh;
  overflow-y: auto;
}

.modal-content h3 {
  color: #0f447e;
  color: var(--color-primary);
  margin-bottom: 1rem;
  margin-bottom: var(--spacing-md);
}

.modal-actions {
  display: flex;
  gap: 1rem;
  gap: var(--spacing-md);
  justify-content: center;
  margin-top: 1.5rem;
  margin-top: var(--spacing-lg);
  flex-wrap: wrap;
}

.modal-button {
  padding: 0.75rem 1.5rem;
  border-radius: 8px;
  border-radius: var(--radius-md);
  border: none;
  cursor: pointer;
  min-height: 44px;
  min-height: var(--input-height);
  flex: 1 1;
  min-width: 120px;
  font-weight: 500;
}

.modal-button.cancel {
  background-color: #e5e7eb;
  color: #374151;
}

.modal-button.cancel:hover {
  background-color: #d1d5db;
}

.modal-button.confirm {
  background-color: #e30613;
  background-color: var(--color-danger);
  color: #ffffff;
  color: var(--color-bg);
}

.modal-button.confirm:hover {
  background-color: #c10510;
  background-color: var(--color-danger-dark);
  transform: translateY(-1px);
}

/* ====== Service info ====== */
.service-info {
  text-align: center;
  font-size: 0.75rem;
  color: #6b7280;
  color: var(--color-text-muted);
  margin-top: 1rem;
  margin-top: var(--spacing-md);
}

.service-text {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  gap: var(--spacing-xs);
}

/* ===================================================================== */
/* ========================= CALENDRIER DOUBLE MOIS ===================== */
/* ===================================================================== */
.calendar-modal {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  -webkit-backdrop-filter: blur(4px);
          backdrop-filter: blur(4px);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1001;
  padding: 1rem;
  padding: var(--spacing-md);
}

.calendar-content {
  background: #ffffff;
  background: var(--color-bg);
  padding: 1rem;
  padding: var(--spacing-md);
  border-radius: 12px;
  border-radius: var(--radius-lg);
  max-width: 320px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
}

.calendar-content.wide {
  max-width: 720px;
}

.calendar-loading,
.calendar-error,
.loading-container,
.error-container {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  gap: var(--spacing-sm);
  padding: 2rem;
  padding: var(--spacing-xl);
  text-align: center;
  color: #64748b;
  color: var(--color-text-light);
}

.calendar-error,
.error-container {
  color: #ef4444;
}

.calendar-header-title {
  text-align: center;
  font-weight: 600;
  color: #0f447e;
  color: var(--color-primary);
  margin-bottom: 0.25rem;
  margin-bottom: var(--spacing-xs);
}

.calendar-legend {
  display: flex;
  justify-content: center;
  gap: 1rem;
  gap: var(--spacing-md);
  margin-bottom: 1rem;
  margin-bottom: var(--spacing-md);
  flex-wrap: wrap;
}

.legend-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  gap: var(--spacing-sm);
  font-size: 0.8rem;
  color: #64748b;
  color: var(--color-text-light);
}

.legend-color {
  width: 12px;
  height: 12px;
  border-radius: 2px;
}

.legend-color.available {
  background: #ffffff;
  background: var(--color-bg);
  border: 1px solid #e2e8f0;
  border: 1px solid var(--color-border);
}

.legend-color.unavailable {
  background: #fef2f2;
  border: 1px solid #fecaca;
}

.legend-color.selected {
  background: #0f447e;
  background: var(--color-primary);
}

.calendar-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.75rem;
  gap: 0.5rem;
  gap: var(--spacing-sm);
}

.nav-arrow {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  border-radius: var(--radius-md);
  border: 1px solid #e2e8f0;
  border: 1px solid var(--color-border);
  background: #ffffff;
  background: var(--color-bg);
  color: #0f447e;
  color: var(--color-primary);
  cursor: pointer;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.nav-arrow:hover {
  background: #f3f4f6;
  transform: scale(1.05);
}

.selectors {
  display: flex;
  gap: 0.5rem;
  gap: var(--spacing-sm);
  align-items: center;
  flex-wrap: wrap;
}

.month-select,
.year-select {
  border: 1px solid #e2e8f0;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  border-radius: var(--radius-md);
  padding: 0.45rem 0.6rem;
  color: #0f447e;
  color: var(--color-primary);
  background: #ffffff;
  background: var(--color-bg);
  min-height: 36px;
  cursor: pointer;
}

.month-select:hover,
.year-select:hover {
  border-color: #0f447e;
  border-color: var(--color-primary);
}

.double-month {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  grid-gap: 1rem;
  grid-gap: var(--spacing-md);
  gap: var(--spacing-md);
}

.month-block {
  padding: 0.25rem 0.25rem 0.75rem;
  padding: var(--spacing-xs) var(--spacing-xs) 0.75rem;
}

.month-title {
  text-align: left;
  font-weight: 600;
  color: #0f447e;
  color: var(--color-primary);
  margin: 0.25rem 0 0.5rem;
  margin: var(--spacing-xs) 0 var(--spacing-sm);
  text-transform: capitalize;
  font-size: 0.9rem;
}

.calendar-grid-7 {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 0.25rem;
  grid-gap: 0.25rem;
  grid-gap: var(--spacing-xs);
  gap: var(--spacing-xs);
}

.day-head {
  text-align: center;
  font-size: 0.8rem;
  font-weight: 600;
  color: #64748b;
  color: var(--color-text-light);
  padding: 0.25rem 0;
  padding: var(--spacing-xs) 0;
}

.day-cell {
  height: 36px;
  border-radius: 18px;
  border-radius: var(--radius-full);
  border: 1px solid transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9rem;
  cursor: pointer;
  background: transparent;
  color: #0f223a;
  touch-action: manipulation;
}

.day-cell:hover:not(.disabled):not(.unavailable) {
  background: #eaf2fb;
  background: var(--color-primary-light);
  transform: scale(1.05);
}

.day-cell.disabled {
  color: #cbd5e1;
  color: var(--color-border-hover);
  cursor: not-allowed;
  background: transparent !important;
}

.day-cell.unavailable {
  color: #ef4444;
  cursor: not-allowed;
  background: #fef2f2 !important;
  border-color: #fecaca;
  text-decoration: line-through;
}

.day-cell.invalid-checkout-date {
  opacity: 0.6;
  cursor: not-allowed;
  text-decoration: line-through;
}

.day-cell.in-range {
  background: #eaf2fb;
  background: var(--color-primary-light);
}

.day-cell.range-start,
.day-cell.range-end {
  background: #0f447e !important;
  background: var(--color-primary) !important;
  color: #ffffff !important;
  color: var(--color-bg) !important;
  border-color: #0f447e;
  border-color: var(--color-primary);
  font-weight: 600;
}

.apply-button {
  background-color: #0f447e;
  background-color: var(--color-primary);
  color: #ffffff;
  color: var(--color-bg);
  font-weight: 500;
  font-size: 0.95rem;
  padding: 0.9rem 1.25rem;
  border-radius: 8px;
  border-radius: var(--radius-md);
  border: none;
  cursor: pointer;
  margin-top: 1rem;
  margin-top: var(--spacing-md);
  display: block;
  min-height: 44px;
  min-height: var(--input-height);
}

.apply-button:hover {
  background-color: #0d3869;
  background-color: var(--color-primary-dark);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(15, 68, 126, 0.2);
}

.apply-button.full {
  width: 100%;
}

/* ===================================================================== */
/* ======================== COMBOBOX (Searchable) ======================= */
/* ===================================================================== */
.ss-container {
  position: relative;
  width: 100%;
}

.ss-control {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  gap: var(--spacing-sm);
  border: 1px solid #e2e8f0;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  border-radius: var(--radius-md);
  padding: 0.5rem 0.75rem;
  background: #ffffff;
  background: var(--color-bg);
  cursor: pointer;
  min-height: 44px;
  min-height: var(--input-height);
  height: auto;
  width: 100%;
  box-sizing: border-box;
  position: relative;
  z-index: 10;
}

.ss-control:hover {
  border-color: #cbd5e1;
  border-color: var(--color-border-hover);
}

.ss-control:focus-within {
  border-color: #0f447e;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(15, 68, 126, 0.15);
}

.ss-control.ss-disabled {
  background: #f1f5f9;
  background: var(--color-bg-disabled);
  opacity: 0.7;
  cursor: not-allowed;
}

.ss-input {
  border: none;
  outline: none;
  flex: 1 1 auto;
  padding: 0.25rem 0.25rem;
  padding: var(--spacing-xs) var(--spacing-xs);
  font-size: 0.875rem;
  background: transparent;
  min-width: 0;
}

.ss-caret {
  color: #0f447e;
  color: var(--color-primary);
  -webkit-user-select: none;
          user-select: none;
  font-size: 0.9rem;
  margin-left: 0.25rem;
  margin-left: var(--spacing-xs);
}

.ss-dropdown {
  position: absolute;
  z-index: 9999;
  left: 0;
  right: 0;
  top: calc(100% + 4px);
  background: #ffffff;
  background: var(--color-bg);
  border: 1px solid #e2e8f0;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  border-radius: var(--radius-md);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  max-height: 260px;
  overflow: auto;
  width: 100%;
}

.ss-empty {
  padding: 0.75rem 1rem;
  padding: 0.75rem var(--spacing-md);
  color: #6b7280;
  color: var(--color-text-muted);
  font-size: 0.875rem;
}

.ss-option {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.75rem 1rem;
  padding: 0.75rem var(--spacing-md);
  cursor: pointer;
  font-size: 0.875rem;
  min-height: 44px;
  min-height: var(--input-height);
}

.ss-option:hover,
.ss-option.active {
  background: #f1f5f9;
  background: var(--color-bg-disabled);
}

.ss-option.selected {
  font-weight: 600;
  background: #eaf2fb;
  background: var(--color-primary-light);
}

.ss-option-label {
  color: #0f223a;
}

.ss-option-meta {
  color: #64748b;
  color: var(--color-text-light);
  font-size: 0.85rem;
}

/* Fix pour que le dropdown sorte du conteneur */
.form-row-appartement-periode .ss-dropdown {
  width: 100% !important;
  left: 0 !important;
  right: 0 !important;
  box-sizing: border-box;
}

/* ===================================================================== */
/* ============================ RESPONSIVE ============================== */
/* ===================================================================== */

/* Tablettes (768px - 1023px) */
@media (min-width: 768px) {
  .form-row,
  .form-row-2 {
    grid-template-columns: 1fr 1fr;
  }

  .form-row-3 {
    grid-template-columns: 1fr 1fr;
  }

  .form-row-appartement-periode {
    grid-template-columns: 1fr 1fr;
    align-items: start;
  }

  .submit-button {
    align-self: flex-end;
  }

  .double-month {
    grid-template-columns: 1fr 1fr;
  }
}

/* Desktop (1024px+) */
@media (min-width: 1024px) {
  .form-row-3 {
    grid-template-columns: 1fr 1fr 1fr;
  }
}

/* Large Desktop (1200px - 1920px) */
@media (min-width: 1200px) and (max-width: 1920px) {
  .staff-cash-reservation-form {
    padding: 2.5rem;
  }
}

/* Tablettes moyennes */
@media (min-width: 600px) and (max-width: 767px) {
  .staff-cash-reservation-form {
    max-width: 95%;
    padding: 1.5rem;
    padding: var(--spacing-lg);
  }

  .calendar-content.wide {
    max-width: 600px;
  }

  .double-month {
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
  }

  .month-block {
    padding: 0.25rem;
    padding: var(--spacing-xs);
  }
}

/* Mobile (jusqu'à 599px) */
@media (max-width: 599px) {
  .staff-cash-reservation-form {
    padding: 1rem;
    padding: var(--spacing-md);
    margin: 0;
    border-radius: 8px;
    border-radius: var(--radius-md);
    box-shadow: none;
    border: none;
    max-width: 100%;
  }

  .form-title {
    font-size: 1.5rem;
    margin-bottom: 1.5rem;
    margin-bottom: var(--spacing-lg);
    line-height: 1.3;
  }

  .form-row,
  .form-container {
    gap: 1rem;
    gap: var(--spacing-md);
  }

  .form-row-appartement-periode {
    grid-template-columns: 1fr;
    gap: 1rem;
    gap: var(--spacing-md);
  }

  .submit-button {
    width: 100%;
    align-self: center;
    font-size: 0.9rem;
    padding: 1rem;
    padding: var(--spacing-md);
  }

  .form-input,
  .ss-control {
    padding: 0.5rem;
    padding: var(--spacing-sm);
  }

  /* Calendrier mobile */
  .calendar-content {
    padding: 0.75rem;
    margin: 0.5rem;
    margin: var(--spacing-sm);
    width: calc(100% - 1rem);
    width: calc(100% - var(--spacing-md));
    border-radius: 8px;
    border-radius: var(--radius-md);
  }

  .calendar-content.wide {
    max-width: none;
  }

  .calendar-header-title {
    font-size: 1.1rem;
    margin-bottom: 0.5rem;
    margin-bottom: var(--spacing-sm);
  }

  .calendar-legend {
    gap: 0.5rem;
    gap: var(--spacing-sm);
    margin-bottom: 0.75rem;
  }

  .legend-item {
    font-size: 0.75rem;
  }

  .calendar-topbar {
    margin-bottom: 0.5rem;
    margin-bottom: var(--spacing-sm);
    flex-wrap: wrap;
    gap: 0.25rem;
    gap: var(--spacing-xs);
  }

  .selectors {
    order: -1;
    width: 100%;
    justify-content: center;
    margin-bottom: 0.5rem;
    margin-bottom: var(--spacing-sm);
  }

  .nav-arrow {
    width: 40px;
    height: 40px;
    font-size: 1.2rem;
  }

  .month-select,
  .year-select {
    padding: 0.5rem;
    padding: var(--spacing-sm);
    font-size: 0.85rem;
  }

  .double-month {
    grid-template-columns: 1fr;
    gap: 0.75rem;
  }

  .month-title {
    text-align: center;
    font-size: 1rem;
    margin-bottom: 0.75rem;
  }

  .day-cell {
    height: 40px;
    font-size: 0.85rem;
    border-radius: 8px;
    border-radius: var(--radius-md);
  }

  .day-head {
    padding: 0.5rem 0;
    padding: var(--spacing-sm) 0;
    font-size: 0.75rem;
  }

  .apply-button {
    padding: 1rem;
    padding: var(--spacing-md);
    font-size: 1rem;
    margin-top: 1rem;
    margin-top: var(--spacing-md);
  }

  /* Modal mobile */
  .modal {
    padding: 0.5rem;
    padding: var(--spacing-sm);
  }

  .modal-content {
    padding: 1rem;
    padding: var(--spacing-md);
    width: calc(100% - 1rem);
    width: calc(100% - var(--spacing-md));
    margin: 0.5rem;
    margin: var(--spacing-sm);
    border-radius: 8px;
    border-radius: var(--radius-md);
  }

  .modal-actions {
    flex-direction: column;
    gap: 0.75rem;
  }

  .modal-button {
    width: 100%;
    padding: 0.875rem;
    font-size: 0.9rem;
  }

  /* Summary responsive */
  .summary-container {
    font-size: 0.8rem;
    padding: 0.875rem;
  }

  .summary-container div {
    padding: 0.375rem 0;
  }

  /* Combobox mobile */
  .ss-dropdown {
    max-height: 200px;
  }

  .ss-option {
    padding: 0.875rem;
    font-size: 0.85rem;
  }

  /* Messages mobile */
  .message-success,
  .message-error {
    padding: 0.875rem;
    font-size: 0.8rem;
    margin-bottom: 1rem;
    margin-bottom: var(--spacing-md);
    border-radius: 6px;
    border-radius: var(--radius-sm);
  }
}

/* Très petits écrans (360px et moins) */
@media (max-width: 360px) {
  .staff-cash-reservation-form {
    margin: 0;
    padding: 0.75rem;
  }

  .form-title {
    font-size: 1.3rem;
  }

  .calendar-content {
    padding: 0.5rem;
    padding: var(--spacing-sm);
  }

  .day-cell {
    height: 36px;
    font-size: 0.8rem;
  }

  .modal-content {
    padding: 0.75rem;
  }
}

/* Landscape mobile */
@media (max-width: 767px) and (orientation: landscape) {
  .calendar-content {
    max-height: 85vh;
  }

  .double-month {
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
    gap: var(--spacing-sm);
  }

  .month-block {
    padding: 0.125rem;
  }

  .day-cell {
    height: 32px;
    font-size: 0.8rem;
  }
}

/* ===================================================================== */
/* ==================== ACCESSIBILITÉ TACTILE =========================== */
/* ===================================================================== */
@media (hover: none) and (pointer: coarse) {
  .form-input,
  .form-textarea,
  .ss-control,
  .day-cell,
  .modal-button,
  .submit-button,
  .apply-button {
    min-height: 44px;
    min-height: var(--input-height);
  }

  .ss-option {
    padding: 1rem 0.8rem;
    padding: var(--spacing-md) 0.8rem;
  }

  .nav-arrow {
    width: 44px;
    width: var(--input-height);
    height: 44px;
    height: var(--input-height);
  }

  /* Augmenter la zone de tap */
  .checkbox-input {
    width: 1.25rem;
    height: 1.25rem;
  }
}

/* ===================================================================== */
/* ======================== ÉTATS & ANIMATIONS ========================== */
/* ===================================================================== */

/* États focus visible pour accessibilité clavier */
*:focus-visible {
  outline: 2px solid #0f447e;
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

/* Smooth scroll */
html {
  scroll-behavior: smooth;
}

/* Réduction de mouvement pour accessibilité */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Style principal pour la page de gestion des catégories */
.gestion-categorie-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
}

.page-content {
  flex: 1 1;
  margin-left: 250px;
  padding-top: 70px;
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}
/* Largeur des blocs enfants UNIQUEMENT dans la page d’édition d’appartement */
.gestion-categorie-page .page-content > * {
  max-width: 1920px;
  width: 100%;
  box-sizing: border-box;
  overflow-x: auto; /* Permet le défilement horizontal si nécessaire */
}
/* Quand le sidebar est collapsé */
.gestion-categorie-page.sidebar-collapsed .page-content {
  margin-left: 70px; /* Largeur du sidebar collapsé */
  width: calc(100% - 70px);
}

/* Conteneur pour la liste des catégories */
.categories-container {
  padding: 20px;
  box-sizing: border-box;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 60px !important; /* Largeur du sidebar en mobile */
    width: calc(100% - 60px) !important;
  }
}
/* Container principal */
.CategoryAdmin-container.AdminCategGestion {
  font-family: 'Poppins', sans-serif;
  width: 95%;
  margin: 30px auto;
  color: #333;
}

/* Titre principal */
.CategoryAdmin-main-title.AdminCategGestion {
  font-size: 24px;
  font-weight: 600;
  color: #0F447E;
  margin-bottom: 20px;
}

.CategoryAdmin-title-highlight.AdminCategGestion {
  color: #e30613;
}

/* Carte principale */
.CategoryAdmin-card.AdminCategGestion {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

/* En-tête de la carte */
.CategoryAdmin-card-header.AdminCategGestion {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  border-bottom: 1px solid #f0f0f0;
}

.CategoryAdmin-subtitle.AdminCategGestion {
  font-size: 16px;
  font-weight: 600;
  color: #0F447E;
  margin: 0;
}

.CategoryAdmin-subtitle-highlight.AdminCategGestion {
  color: #e30613;
}

/* Bouton d'ajout */
.CategoryAdmin-add-btn.AdminCategGestion {
  background-color: #0F447E;
  color: white;
  border: none;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
}

.CategoryAdmin-add-btn.AdminCategGestion:hover {
  background-color: #0a3b70;
}

.CategoryAdmin-btn-icon.AdminCategGestion {
  margin-right: 6px;
  font-size: 14px;
  font-weight: bold;
}

/* Conteneur de la table */
.CategoryAdmin-table-wrapper.AdminCategGestion {
  overflow-x: auto;
}

/* Style de la table */
.CategoryAdmin-table.AdminCategGestion {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}

.CategoryAdmin-th.AdminCategGestion {
  background-color: #f8f9fa;
  font-weight: 500;
  padding: 15px 20px;
  color: #0F447E;
  font-size: 14px;
  border-bottom: 1px solid #eaeaea;
}

.CategoryAdmin-tr.AdminCategGestion {
  border-bottom: 1px solid #eaeaea;
}

.CategoryAdmin-tr.AdminCategGestion:last-child {
  border-bottom: none;
}

.CategoryAdmin-td.AdminCategGestion {
  padding: 15px 20px;
  font-size: 14px;
  color: #333;
}

/* Style des actions */
.CategoryAdmin-actions.AdminCategGestion {
  display: flex;
  gap: 10px;
}

.CategoryAdmin-action-btn.AdminCategGestion {
  background: none;
  border: none;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.2s;
}

.CategoryAdmin-edit-btn.AdminCategGestion {
  color: #0e4c90;
  background-color: rgba(14, 76, 144, 0.1);
}

.CategoryAdmin-edit-btn.AdminCategGestion:hover {
  background-color: rgba(14, 76, 144, 0.2);
}

.CategoryAdmin-delete-btn.AdminCategGestion {
  color: #e63946;
  background-color: rgba(230, 57, 70, 0.1);
}

.CategoryAdmin-delete-btn.AdminCategGestion:hover {
  background-color: rgba(230, 57, 70, 0.2);
}

/* Style de pagination */
.CategoryAdmin-pagination.AdminCategGestion {
  display: flex;
  justify-content: center;
  margin: 20px 0;
  gap: 5px;
}

.CategoryAdmin-pagination-btn.AdminCategGestion {
  min-width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e0e0e0;
  background-color: white;
  color: #333;
  font-size: 14px;
  cursor: pointer;
  border-radius: 4px;
  transition: all 0.2s;
}

.CategoryAdmin-pagination-btn.AdminCategGestion:hover:not(:disabled) {
  background-color: #f0f0f0;
}

.CategoryAdmin-pagination-btn.AdminCategGestion:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.CategoryAdmin-pagination-active.AdminCategGestion {
  background-color: #0F447E;
  color: white;
  border-color: #0F447E;
}

.CategoryAdmin-pagination-active.AdminCategGestion:hover {
  background-color: #0a3b70;
}

/* Responsive design */
@media (max-width: 768px) {
  .CategoryAdmin-container.AdminCategGestion {
    padding: 15px;
    margin: 15px auto;
  }
  
  .CategoryAdmin-main-title.AdminCategGestion {
    font-size: 20px;
  }
  
  .CategoryAdmin-card-header.AdminCategGestion {
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
  }
  
  .CategoryAdmin-add-btn.AdminCategGestion {
    width: 100%;
    justify-content: center;
  }
  
  .CategoryAdmin-th.AdminCategGestion, 
  .CategoryAdmin-td.AdminCategGestion {
    padding: 12px 10px;
    font-size: 13px;
  }
  
  .CategoryAdmin-table-wrapper.AdminCategGestion {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #0F447E #f0f0f0;
  }
  
  .CategoryAdmin-table-wrapper.AdminCategGestion::-webkit-scrollbar {
    height: 6px;
  }
  
  .CategoryAdmin-table-wrapper.AdminCategGestion::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
  }
  
  .CategoryAdmin-table-wrapper.AdminCategGestion::-webkit-scrollbar-thumb {
    background: #0F447E;
    border-radius: 3px;
  }
  
  .CategoryAdmin-pagination.AdminCategGestion {
    flex-wrap: wrap;
  }
}

@media (max-width: 480px) {
  .CategoryAdmin-container.AdminCategGestion {
    padding: 10px;
    margin: 10px auto;
    max-width: 98%;
  }
  
  .CategoryAdmin-main-title.AdminCategGestion {
    font-size: 18px;
  }
  
  .CategoryAdmin-subtitle.AdminCategGestion {
    font-size: 14px;
  }
  
  .CategoryAdmin-action-btn.AdminCategGestion {
    width: 28px;
    height: 28px;
  }
  
  /* Simplifier la pagination sur très petits écrans */
  .CategoryAdmin-pagination-btn.AdminCategGestion {
    min-width: 28px;
    height: 28px;
    font-size: 12px;
  }
}

/* Styles pour le toggle */
.CategoryAdmin-toggle-btn.AdminCategGestion {
  color: #4CAF50;
  background-color: rgba(76, 175, 80, 0.1);
}

.CategoryAdmin-toggle-btn.AdminCategGestion:hover {
  background-color: rgba(76, 175, 80, 0.2);
}

.CategoryAdmin-toggle-btn.AdminCategGestion svg {
  font-size: 18px;
}

.CategoryAdmin-status.AdminCategGestion {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}

.CategoryAdmin-status.active.AdminCategGestion {
  background-color: rgba(76, 175, 80, 0.1);
  color: #4CAF50;
}

.CategoryAdmin-status.inactive.AdminCategGestion {
  background-color: rgba(244, 67, 54, 0.1);
  color: #e30613;
}

/* Supprimer le style du bouton delete */
.CategoryAdmin-delete-btn.AdminCategGestion {
  display: none;
}

/* Header actions container */
.CategoryAdmin-header-actions.AdminCategGestion {
  display: flex;
  align-items: center;
  gap: 10px;
}

@media (max-width: 768px) {
  .CategoryAdmin-header-actions.AdminCategGestion {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
}
/* Overlay du popup */
.CategorieAddPopup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  -webkit-backdrop-filter: blur(5px);
          backdrop-filter: blur(5px);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  overflow-y: auto;
}

/* Container principal du popup */
.CategorieAddPopup-container {
  background-color: white;
  border-radius: 10px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  width: 90%;
  max-width: 600px;
  max-height: 90vh;
  overflow-y: auto;
  padding: 20px;
  position: relative;
}

/* Header du popup */
.CategorieAddPopup-header {
  padding: 24px 24px 16px 24px;
  border-bottom: 1px solid #e5e7eb;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.CategorieAddPopup-title {
  font-size: 20px;
  font-weight: 600;
  margin: 0;
}

.CategorieAddPopup-title-blue {
  color: #0c447e;
}

.CategorieAddPopup-title-red {
  color: #ef4444;
}

.CategorieAddPopup-close-button {
  background: none;
  border: none;
  color: #9ca3af;
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  transition: color 0.2s;
}

.CategorieAddPopup-close-button:hover {
  color: #6b7280;
}

/* Formulaire */
.CategorieAddPopup-form {
  padding: 24px;
}

.CategorieAddPopup-form-group {
  margin-bottom: 24px;
}

.CategorieAddPopup-form-label {
  display: block;
  font-size: 16px;
  font-weight: 500;
  color: #374151;
  margin-bottom: 8px;
}

.CategorieAddPopup-required {
  color: #ef4444;
}

/* Styles pour les erreurs */
.CategorieAddPopup-form-input.CategorieAddPopup-error,
.CategorieAddPopup-form-select.CategorieAddPopup-error {
  border-color: #ef4444;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
}

.CategorieAddPopup-error-message {
  display: block;
  color: #ef4444;
  font-size: 12px;
  margin-top: 4px;
  font-weight: 500;
}

.CategorieAddPopup-form-input,
.CategorieAddPopup-form-select {
  width: 100%;
  padding: 12px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  font-size: 14px;
  transition: border-color 0.2s, box-shadow 0.2s;
  background: white;
}

.CategorieAddPopup-form-input:focus,
.CategorieAddPopup-form-select:focus {
  outline: none;
  border-color: #0c447e;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.CategorieAddPopup-form-select {
  -webkit-appearance: none;
          appearance: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 fill=%27none%27 viewBox=%270 0 20 20%27%3e%3cpath stroke=%27%236b7280%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%271.5%27 d=%27m6 8 4 4 4-4%27/%3e%3c/svg%3e");
  background-position: right 12px center;
  background-repeat: no-repeat;
  background-size: 16px;
  padding-right: 40px;
}

/* Sélecteur d'icône */
.CategorieAddPopup-icon-selector {
  position: relative;
}

.CategorieAddPopup-icon-selector-button {
  width: 100%;
  padding: 12px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  background: white;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.CategorieAddPopup-icon-selector-button:hover {
  border-color: #9ca3af;
}

.CategorieAddPopup-icon-selector-button:focus {
  outline: none;
  border-color: #0c447e;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.CategorieAddPopup-icon-selector-content {
  display: flex;
  align-items: center;
  gap: 8px;
}

.CategorieAddPopup-placeholder-text {
  color: #6b7280;
  font-size: 14px;
}

.CategorieAddPopup-placeholder-subtext {
  color: #9ca3af;
  font-size: 14px;
  margin-left: 8px;
}

.CategorieAddPopup-dropdown-arrow {
  color: #9ca3af;
  font-size: 8px;
}

/* Panneau de sélection d'icônes */
.CategorieAddPopup-icon-picker-panel {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin-top: 4px;
  background: white;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -2px rgba(0, 0, 0, 0.05);
  z-index: 1001;
  max-height: 400px;
  overflow: hidden;
}

/* Barre de recherche */
.CategorieAddPopup-search-container {
  padding: 16px;
  border-bottom: 1px solid #e5e7eb;
}

.CategorieAddPopup-search-input-wrapper {
  position: relative;
}

.CategorieAddPopup-search-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #9ca3af;
}

.CategorieAddPopup-search-input {
  width: 100%;
  padding: 8px 12px 8px 40px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  font-size: 14px;
}

.CategorieAddPopup-search-input:focus {
  outline: none;
  border-color: #0c447e;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

/* Sélecteur de couleur */
.CategorieAddPopup-color-selector {
  padding: 16px;
  border-bottom: 1px solid #e5e7eb;
}

.CategorieAddPopup-color-label {
  display: block;
  font-size: 12px;
  font-weight: 500;
  color: #374151;
  margin-bottom: 8px;
}

.CategorieAddPopup-color-options {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.CategorieAddPopup-color-option {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 2px solid transparent;
  cursor: pointer;
  transition: transform 0.2s, border-color 0.2s;
}

.CategorieAddPopup-color-option:hover {
  transform: scale(1.1);
}

.CategorieAddPopup-color-option.CategorieAddPopup-selected {
  border-color: #374151;
  transform: scale(1.2);
}

/* Container de la grille d'icônes */
.CategorieAddPopup-icons-grid-container {
  max-height: 250px;
  overflow-y: auto;
  padding: 16px;
}

/* Catégorie d'icônes */
.CategorieAddPopup-icon-category {
  margin-bottom: 20px;
}

.CategorieAddPopup-category-title {
  font-size: 12px;
  font-weight: 600;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 12px;
  padding-bottom: 4px;
  border-bottom: 1px solid #f3f4f6;
}

/* Grille d'icônes */
.CategorieAddPopup-icons-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
  grid-gap: 8px;
  gap: 8px;
}

.CategorieAddPopup-icon-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 12px 8px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: none;
  cursor: pointer;
  transition: background-color 0.2s, border-color 0.2s;
}

.CategorieAddPopup-icon-item:hover {
  background-color: #f9fafb;
  border-color: #e5e7eb;
}

.CategorieAddPopup-icon-component {
  margin-bottom: 4px;
}

.CategorieAddPopup-icon-label {
  font-size: 10px;
  color: #6b7280;
  text-align: center;
  line-height: 1.2;
}

.CategorieAddPopup-no-icons-message {
  text-align: center;
  color: #9ca3af;
  padding: 20px;
  font-size: 14px;
}

/* Boutons */
.CategorieAddPopup-buttons-container {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid #e5e7eb;
}

.CategorieAddPopup-cancel-button,
.CategorieAddPopup-submit-button {
  padding: 10px 20px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s, border-color 0.2s;
}

.CategorieAddPopup-cancel-button {
  background: #0c447e04;
  color: #646870;
  border: 1px solid #cfcccc;
}

.CategorieAddPopup-cancel-button:hover {
  background: #0c447e11;
  border-color: #b4b2b2;
}

.CategorieAddPopup-submit-button {
  background: #0c447e;
  border: 1px solid #114a87;
  color: white;
}

.CategorieAddPopup-submit-button:hover {
  background: #07305c;
}

/* Responsive */
@media (max-width: 640px) {
  .CategorieAddPopup-container {
    width: 95%;
    margin: 20px;
  }

  .CategorieAddPopup-header,
  .CategorieAddPopup-form {
    padding: 16px;
  }

  .CategorieAddPopup-icons-grid {
    grid-template-columns: repeat(auto-fill, minmax(70px, 1fr));
  }

  .CategorieAddPopup-buttons-container {
    flex-direction: column;
  }

  .CategorieAddPopup-cancel-button,
  .CategorieAddPopup-submit-button {
    width: 100%;
  }
}

/* Style principal pour la page de gestion des zones */
.gestion-zone-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
}

.page-content {
  flex: 1 1;
  margin-left: 250px;
  padding-top: 70px;
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}
/* Largeur des blocs enfants UNIQUEMENT dans la page d’édition d’appartement */
.gestion-zone-page .page-content > * {
  max-width: 1920px;
  width: 100%;
  box-sizing: border-box;
  overflow-x: auto; /* Permet le défilement horizontal si nécessaire */
}
/* Quand le sidebar est collapsé */
.gestion-zone-page.sidebar-collapsed .page-content {
  margin-left: 70px; /* Largeur du sidebar collapsé */
  width: calc(100% - 70px);
}

/* Conteneur pour la liste des zones */
.zones-container {
  padding: 20px;
  box-sizing: border-box;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 60px !important; /* Largeur du sidebar en mobile */
    width: calc(100% - 60px) !important;
  }
}
/* Overlay du popup */
.AjoutZonePopup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  -webkit-backdrop-filter: blur(5px);
          backdrop-filter: blur(5px);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  overflow-y: auto;
}

/* Container principal du popup */
.AjoutZonePopup-container {
  background-color: white;
  border-radius: 10px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  width: 90%;
  max-width: 600px;
  max-height: 90vh;
  overflow-y: auto;
  padding: 20px;
  position: relative;
}

/* Header du popup */
.AjoutZonePopup-header {
  padding: 24px 24px 16px 24px;
  border-bottom: 1px solid #e5e7eb;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.AjoutZonePopup-title {
  font-size: 20px;
  font-weight: 600;
  margin: 0;
}

.AjoutZonePopup-title-blue {
  color: #0c447e;
}

.AjoutZonePopup-title-red {
  color: #ef4444;
}

.AjoutZonePopup-close-button {
  background: none;
  border: none;
  color: #9ca3af;
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  transition: color 0.2s;
}

.AjoutZonePopup-close-button:hover {
  color: #6b7280;
}

/* Formulaire */
.AjoutZonePopup-form {
  padding: 24px;
}

.AjoutZonePopup-form-group {
  margin-bottom: 24px;
}

.AjoutZonePopup-form-label {
  display: block;
  font-size: 14px;
  font-weight: 500;
  color: #374151;
  margin-bottom: 8px;
}

.AjoutZonePopup-required {
  color: #ef4444;
}

/* Styles pour les erreurs */
.AjoutZonePopup-form-input.AjoutZonePopup-error,
.AjoutZonePopup-form-select.AjoutZonePopup-error {
  border-color: #ef4444;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
}

.AjoutZonePopup-error-message {
  display: block;
  color: #ef4444;
  font-size: 12px;
  margin-top: 4px;
  font-weight: 500;
}

.AjoutZonePopup-form-input,
.AjoutZonePopup-form-select {
  width: 100%;
  padding: 12px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  font-size: 14px;
  transition: border-color 0.2s, box-shadow 0.2s;
  background: white;
}

.AjoutZonePopup-form-input:focus,
.AjoutZonePopup-form-select:focus {
  outline: none;
  border-color: #0c447e;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.AjoutZonePopup-form-select {
  -webkit-appearance: none;
          appearance: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 fill=%27none%27 viewBox=%270 0 20 20%27%3e%3cpath stroke=%27%236b7280%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%271.5%27 d=%27m6 8 4 4 4-4%27/%3e%3c/svg%3e");
  background-position: right 12px center;
  background-repeat: no-repeat;
  background-size: 16px;
  padding-right: 40px;
}

/* Sélecteur d'icône */
.AjoutZonePopup-icon-selector {
  position: relative;
}

.AjoutZonePopup-icon-selector-button {
  width: 100%;
  padding: 12px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  background: white;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.AjoutZonePopup-icon-selector-button:hover {
  border-color: #9ca3af;
}

.AjoutZonePopup-icon-selector-button:focus {
  outline: none;
  border-color: #0c447e;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.AjoutZonePopup-icon-selector-content {
  display: flex;
  align-items: center;
  gap: 8px;
}

.AjoutZonePopup-placeholder-text {
  color: #6b7280;
  font-size: 14px;
}

.AjoutZonePopup-placeholder-subtext {
  color: #9ca3af;
  font-size: 14px;
  margin-left: 8px;
}

.AjoutZonePopup-dropdown-arrow {
  color: #9ca3af;
  font-size: 8px;
}

/* Panneau de sélection d'icônes */
.AjoutZonePopup-icon-picker-panel {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin-top: 4px;
  background: white;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -2px rgba(0, 0, 0, 0.05);
  z-index: 1001;
  max-height: 400px;
  overflow: hidden;
}

/* Barre de recherche */
.AjoutZonePopup-search-container {
  padding: 16px;
  border-bottom: 1px solid #e5e7eb;
}

.AjoutZonePopup-search-input-wrapper {
  position: relative;
}

.AjoutZonePopup-search-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #9ca3af;
}

.AjoutZonePopup-search-input {
  width: 100%;
  padding: 8px 12px 8px 40px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  font-size: 14px;
}

.AjoutZonePopup-search-input:focus {
  outline: none;
  border-color: #0c447e;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

/* Sélecteur de couleur */
.AjoutZonePopup-color-selector {
  padding: 16px;
  border-bottom: 1px solid #e5e7eb;
}

.AjoutZonePopup-color-label {
  display: block;
  font-size: 12px;
  font-weight: 500;
  color: #374151;
  margin-bottom: 8px;
}

.AjoutZonePopup-color-options {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.AjoutZonePopup-color-option {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 2px solid transparent;
  cursor: pointer;
  transition: transform 0.2s, border-color 0.2s;
}

.AjoutZonePopup-color-option:hover {
  transform: scale(1.1);
}

.AjoutZonePopup-color-option.AjoutZonePopup-selected {
  border-color: #374151;
  transform: scale(1.2);
}

/* Container de la grille d'icônes */
.AjoutZonePopup-icons-grid-container {
  max-height: 250px;
  overflow-y: auto;
  padding: 16px;
}

/* Catégorie d'icônes */
.AjoutZonePopup-icon-category {
  margin-bottom: 20px;
}

.AjoutZonePopup-category-title {
  font-size: 12px;
  font-weight: 600;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 12px;
  padding-bottom: 4px;
  border-bottom: 1px solid #f3f4f6;
}

/* Grille d'icônes */
.AjoutZonePopup-icons-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
  grid-gap: 8px;
  gap: 8px;
}

.AjoutZonePopup-icon-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 12px 8px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: none;
  cursor: pointer;
  transition: background-color 0.2s, border-color 0.2s;
}

.AjoutZonePopup-icon-item:hover {
  background-color: #f9fafb;
  border-color: #e5e7eb;
}

.AjoutZonePopup-icon-component {
  margin-bottom: 4px;
}

.AjoutZonePopup-icon-label {
  font-size: 10px;
  color: #6b7280;
  text-align: center;
  line-height: 1.2;
}

.AjoutZonePopup-no-icons-message {
  text-align: center;
  color: #9ca3af;
  padding: 20px;
  font-size: 14px;
}

/* Boutons */
.AjoutZonePopup-buttons-container {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid #e5e7eb;
}

.AjoutZonePopup-cancel-button,
.AjoutZonePopup-submit-button {
  padding: 10px 20px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s, border-color 0.2s;
}

.AjoutZonePopup-cancel-button {
  background: #0c447e04;
  color: #646870;
  border: 1px solid #cfcccc;
}

.AjoutZonePopup-cancel-button:hover {
  background: #0c447e11;
  border-color: #b4b2b2;
}

.AjoutZonePopup-submit-button {
  background: #0c447e;
  border: 1px solid #114a87;
  color: white;
}

.AjoutZonePopup-submit-button:hover {
  background: #07305c;
}

/* Responsive */
@media (max-width: 640px) {
  .AjoutZonePopup-container {
    width: 95%;
    margin: 20px;
  }

  .AjoutZonePopup-header,
  .AjoutZonePopup-form {
    padding: 16px;
  }

  .AjoutZonePopup-icons-grid {
    grid-template-columns: repeat(auto-fill, minmax(70px, 1fr));
  }

  .AjoutZonePopup-buttons-container {
    flex-direction: column;
  }

  .AjoutZonePopup-cancel-button,
  .AjoutZonePopup-submit-button {
    width: 100%;
  }
}

/* Container principal */
.ZoneAdmin-container {
  font-family: 'Poppins', sans-serif;
  max-width: 95%;
  margin: 30px auto;
  color: #333;
}

/* Titre principal */
.ZoneAdmin-main-title {
  font-size: 24px;
  font-weight: 600;
  color: #0F447E;
  margin-bottom: 20px;
}

.ZoneAdmin-title-highlight {
  color: #E30613;
}

/* Carte principale */
.ZoneAdmin-card {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

/* En-tête de la carte */
.ZoneAdmin-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  border-bottom: 1px solid #f0f0f0;
}

.ZoneAdmin-subtitle {
  font-size: 16px;
  font-weight: 600;
  color: #0F447E;
  margin: 0;
}

.ZoneAdmin-subtitle-highlight {
  color: #E30613;
}

/* Bouton d'ajout */
.ZoneAdmin-add-btn {
  background-color: #0F447E;
  color: white;
  border: none;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
}

.ZoneAdmin-add-btn:hover {
  background-color: #0a3b70;
}

.ZoneAdmin-btn-icon {
  margin-right: 6px;
  font-size: 14px;
  font-weight: bold;
}

/* Conteneur de la table */
.ZoneAdmin-table-wrapper {
  overflow-x: auto;
}

/* Style de la table */
.ZoneAdmin-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}

.ZoneAdmin-th {
  background-color: #f8f9fa;
  font-weight: 500;
  padding: 15px 20px;
  color: #0F447E;
  font-size: 14px;
  border-bottom: 1px solid #eaeaea;
}

.ZoneAdmin-tr {
  border-bottom: 1px solid #eaeaea;
}

.ZoneAdmin-tr:last-child {
  border-bottom: none;
}

.ZoneAdmin-td {
  padding: 15px 20px;
  font-size: 14px;
  color: #333;
}

/* Style des actions */
.ZoneAdmin-actions {
  display: flex;
  gap: 10px;
}

.ZoneAdmin-action-btn {
  background: none;
  border: none;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.2s;
}

.ZoneAdmin-edit-btn {
  color: #0F447E;
  background-color: rgba(14, 76, 144, 0.1);
}

.ZoneAdmin-edit-btn:hover {
  background-color: rgba(14, 76, 144, 0.2);
}

.ZoneAdmin-delete-btn {
  color: #E30613;
  background-color: rgba(230, 57, 70, 0.1);
}

.ZoneAdmin-delete-btn:hover {
  background-color: rgba(230, 57, 70, 0.2);
}

/* Style de pagination */
.ZoneAdmin-pagination {
  display: flex;
  justify-content: center;
  margin: 20px 0;
  gap: 5px;
}

.ZoneAdmin-pagination-btn {
  min-width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e0e0e0;
  background-color: white;
  color: #333;
  font-size: 14px;
  cursor: pointer;
  border-radius: 4px;
  transition: all 0.2s;
}

.ZoneAdmin-pagination-btn:hover:not(:disabled) {
  background-color: #f0f0f0;
}

.ZoneAdmin-pagination-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.ZoneAdmin-pagination-active {
  background-color: #0F447E;
  color: white;
  border-color: #0F447E;
}

.ZoneAdmin-pagination-active:hover {
  background-color: #0a3b70;
}

/* Responsive design */
@media (max-width: 768px) {
  .ZoneAdmin-container {
    padding: 15px;
    margin: 15px auto;
  }
  
  .ZoneAdmin-main-title {
    font-size: 20px;
  }
  
  .ZoneAdmin-card-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
  }
  
  .ZoneAdmin-add-btn {
    width: 100%;
    justify-content: center;
  }
  
  .ZoneAdmin-th, 
  .ZoneAdmin-td {
    padding: 12px 10px;
    font-size: 13px;
  }
  
  .ZoneAdmin-table-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #0F447E #f0f0f0;
  }
  
  .ZoneAdmin-table-wrapper::-webkit-scrollbar {
    height: 6px;
  }
  
  .ZoneAdmin-table-wrapper::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
  }
  
  .ZoneAdmin-table-wrapper::-webkit-scrollbar-thumb {
    background: #0F447E;
    border-radius: 3px;
  }
  
  .ZoneAdmin-pagination {
    flex-wrap: wrap;
  }
}

@media (max-width: 480px) {
  .ZoneAdmin-container {
    padding: 10px;
    margin: 10px auto;
    max-width: 98%;
  }
  
  .ZoneAdmin-main-title {
    font-size: 18px;
  }
  
  .ZoneAdmin-subtitle {
    font-size: 14px;
  }
  
  .ZoneAdmin-action-btn {
    width: 28px;
    height: 28px;
  }
  
  /* Simplifier la pagination sur très petits écrans */
  .ZoneAdmin-pagination-btn {
    min-width: 28px;
    height: 28px;
    font-size: 12px;
  }
}

/* Styles pour le toggle */
.ZoneAdmin-toggle-btn {
  color: #4CAF50;
  background-color: rgba(76, 175, 80, 0.1);
}

.ZoneAdmin-toggle-btn:hover {
  background-color: rgba(76, 175, 80, 0.2);
}

.ZoneAdmin-toggle-btn svg {
  font-size: 18px;
}

.ZoneAdmin-status {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}

.ZoneAdmin-status.active {
  background-color: rgba(76, 175, 80, 0.1);
  color: #4CAF50;
}

.ZoneAdmin-status.inactive {
  background-color: rgba(244, 67, 54, 0.1);
  color: #E30613;
}

/* Supprimer le style du bouton delete */
.ZoneAdmin-delete-btn {
  display: none;
}

/* Ajouter une colonne Statut dans le tableau */
.ZoneAdmin-table th:nth-child(4),
.ZoneAdmin-table td:nth-child(4) {
  width: 120px;
}

/* Header actions container */
.ZoneAdmin-header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

@media (max-width: 768px) {
  .ZoneAdmin-header-actions {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
}
/* Style principal pour la page de gestion des caractéristiques */
.gestion-caracteristique-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
}

.page-content {
  flex: 1 1;
  margin-left: 250px;
  padding-top: 70px;
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}
/* Largeur des blocs enfants UNIQUEMENT dans la page d’édition d’appartement */
.gestion-caracteristique-page .page-content > * {
  max-width: 1920px;
  width: 100%;
  box-sizing: border-box;
  overflow-x: auto; /* Permet le défilement horizontal si nécessaire */
}

/* Quand le sidebar est collapsé */
.gestion-caracteristique-page.sidebar-collapsed .page-content {
  margin-left: 70px; /* Largeur du sidebar collapsé */
  width: calc(100% - 70px);
}

/* Conteneur pour la liste des caractéristiques */
.caracteristiques-container {
  padding: 20px;
  box-sizing: border-box;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 60px !important; /* Largeur du sidebar en mobile */
    width: calc(100% - 60px) !important;
  }
}
/* Overlay du popup */
.AjoutCaractPopup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  -webkit-backdrop-filter: blur(5px);
          backdrop-filter: blur(5px);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  overflow-y: auto;
}

/* Container principal du popup */
.AjoutCaractPopup-container {
  background-color: white;
  border-radius: 10px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  width: 90%;
  max-width: 600px;
  max-height: 90vh;
  overflow-y: auto;
  padding: 20px;
  position: relative;
}

/* Header du popup */
.AjoutCaractPopup-header {
  padding: 24px 24px 16px 24px;
  border-bottom: 1px solid #e5e7eb;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.AjoutCaractPopup-title {
  font-size: 20px;
  font-weight: 600;
  margin: 0;
}

.AjoutCaractPopup-title-blue {
  color: #0c447e;
}

.AjoutCaractPopup-title-red {
  color: #ef4444;
}

.AjoutCaractPopup-close-button {
  background: none;
  border: none;
  color: #9ca3af;
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  transition: color 0.2s;
}

.AjoutCaractPopup-close-button:hover {
  color: #6b7280;
}

/* Formulaire */
.AjoutCaractPopup-form {
  padding: 24px;
}

.AjoutCaractPopup-form-group {
  margin-bottom: 24px;
}

.AjoutCaractPopup-form-label {
  display: block;
  font-size: 14px;
  font-weight: 500;
  color: #374151;
  margin-bottom: 8px;
}

.AjoutCaractPopup-required {
  color: #ef4444;
}

/* Styles pour les erreurs */
.AjoutCaractPopup-form-input.AjoutCaractPopup-error,
.AjoutCaractPopup-form-select.AjoutCaractPopup-error {
  border-color: #ef4444;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
}

.AjoutCaractPopup-error-message {
  display: block;
  color: #ef4444;
  font-size: 12px;
  margin-top: 4px;
  font-weight: 500;
}

.AjoutCaractPopup-form-input,
.AjoutCaractPopup-form-select {
  width: 100%;
  padding: 12px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  font-size: 14px;
  transition: border-color 0.2s, box-shadow 0.2s;
  background: white;
}

.AjoutCaractPopup-form-input:focus,
.AjoutCaractPopup-form-select:focus {
  outline: none;
  border-color: #0c447e;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.AjoutCaractPopup-form-select {
  -webkit-appearance: none;
          appearance: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 fill=%27none%27 viewBox=%270 0 20 20%27%3e%3cpath stroke=%27%236b7280%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%271.5%27 d=%27m6 8 4 4 4-4%27/%3e%3c/svg%3e");
  background-position: right 12px center;
  background-repeat: no-repeat;
  background-size: 16px;
  padding-right: 40px;
}

/* Sélecteur d'icône */
.AjoutCaractPopup-icon-selector {
  position: relative;
}

.AjoutCaractPopup-icon-selector-button {
  width: 100%;
  padding: 12px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  background: white;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.AjoutCaractPopup-icon-selector-button:hover {
  border-color: #9ca3af;
}

.AjoutCaractPopup-icon-selector-button:focus {
  outline: none;
  border-color: #0c447e;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.AjoutCaractPopup-icon-selector-content {
  display: flex;
  align-items: center;
  gap: 8px;
}

.AjoutCaractPopup-placeholder-text {
  color: #6b7280;
  font-size: 14px;
}

.AjoutCaractPopup-placeholder-subtext {
  color: #9ca3af;
  font-size: 14px;
  margin-left: 8px;
}

.AjoutCaractPopup-dropdown-arrow {
  color: #9ca3af;
  font-size: 8px;
}

/* Panneau de sélection d'icônes */
.AjoutCaractPopup-icon-picker-panel {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin-top: 4px;
  background: white;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -2px rgba(0, 0, 0, 0.05);
  z-index: 1001;
  max-height: 400px;
  overflow: hidden;
}

/* Barre de recherche */
.AjoutCaractPopup-search-container {
  padding: 16px;
  border-bottom: 1px solid #e5e7eb;
}

.AjoutCaractPopup-search-input-wrapper {
  position: relative;
}

.AjoutCaractPopup-search-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #9ca3af;
}

.AjoutCaractPopup-search-input {
  width: 100%;
  padding: 8px 12px 8px 40px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  font-size: 14px;
}

.AjoutCaractPopup-search-input:focus {
  outline: none;
  border-color: #0c447e;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

/* Sélecteur de couleur */
.AjoutCaractPopup-color-selector {
  padding: 16px;
  border-bottom: 1px solid #e5e7eb;
}

.AjoutCaractPopup-color-label {
  display: block;
  font-size: 12px;
  font-weight: 500;
  color: #374151;
  margin-bottom: 8px;
}

.AjoutCaractPopup-color-options {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.AjoutCaractPopup-color-option {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 2px solid transparent;
  cursor: pointer;
  transition: transform 0.2s, border-color 0.2s;
}

.AjoutCaractPopup-color-option:hover {
  transform: scale(1.1);
}

.AjoutCaractPopup-color-option.AjoutCaractPopup-selected {
  border-color: #374151;
  transform: scale(1.2);
}

/* Container de la grille d'icônes */
.AjoutCaractPopup-icons-grid-container {
  max-height: 250px;
  overflow-y: auto;
  padding: 16px;
}

/* Catégorie d'icônes */
.AjoutCaractPopup-icon-category {
  margin-bottom: 20px;
}

.AjoutCaractPopup-category-title {
  font-size: 12px;
  font-weight: 600;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 12px;
  padding-bottom: 4px;
  border-bottom: 1px solid #f3f4f6;
}

/* Grille d'icônes */
.AjoutCaractPopup-icons-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
  grid-gap: 8px;
  gap: 8px;
}

.AjoutCaractPopup-icon-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 12px 8px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: none;
  cursor: pointer;
  transition: background-color 0.2s, border-color 0.2s;
}

.AjoutCaractPopup-icon-item:hover {
  background-color: #f9fafb;
  border-color: #e5e7eb;
}

.AjoutCaractPopup-icon-component {
  margin-bottom: 4px;
}

.AjoutCaractPopup-icon-label {
  font-size: 10px;
  color: #6b7280;
  text-align: center;
  line-height: 1.2;
}

.AjoutCaractPopup-no-icons-message {
  text-align: center;
  color: #9ca3af;
  padding: 20px;
  font-size: 14px;
}

/* Boutons */
.AjoutCaractPopup-buttons-container {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid #e5e7eb;
}

.AjoutCaractPopup-cancel-button,
.AjoutCaractPopup-submit-button {
  padding: 10px 20px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s, border-color 0.2s;
}

.AjoutCaractPopup-cancel-button {
  background: #0c447e04;
  color: #646870;
  border: 1px solid #cfcccc;
}

.AjoutCaractPopup-cancel-button:hover {
  background: #0c447e11;
  border-color: #b4b2b2;
}

.AjoutCaractPopup-submit-button {
  background: #0c447e;
  border: 1px solid #114a87;
  color: white;
}

.AjoutCaractPopup-submit-button:hover {
  background: #07305c;
}

/* Responsive */
@media (max-width: 640px) {
  .AjoutCaractPopup-container {
    width: 95%;
    margin: 20px;
  }

  .AjoutCaractPopup-header,
  .AjoutCaractPopup-form {
    padding: 16px;
  }

  .AjoutCaractPopup-icons-grid {
    grid-template-columns: repeat(auto-fill, minmax(70px, 1fr));
  }

  .AjoutCaractPopup-buttons-container {
    flex-direction: column;
  }

  .AjoutCaractPopup-cancel-button,
  .AjoutCaractPopup-submit-button {
    width: 100%;
  }
}

/* Container principal */
.CaracteristiqueAdmin-container {
  font-family: 'Poppins', sans-serif;
  max-width: 95%;
  margin: 30px auto;
  color: #333;
}

/* Titre principal */
.CaracteristiqueAdmin-main-title {
  font-size: 24px;
  font-weight: 600;
  color: #0F447E;
  margin-bottom: 20px;
}

.CaracteristiqueAdmin-title-highlight {
  color: #E30613;
}

/* Carte principale */
.CaracteristiqueAdmin-card {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

/* En-tête de la carte */
.CaracteristiqueAdmin-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  border-bottom: 1px solid #f0f0f0;
}

.CaracteristiqueAdmin-subtitle {
  font-size: 16px;
  font-weight: 600;
  color: #0F447E;
  margin: 0;
}

.CaracteristiqueAdmin-subtitle-highlight {
  color: #E30613;
}

/* Bouton d'ajout */
.CaracteristiqueAdmin-add-btn {
  background-color: #0F447E;
  color: white;
  border: none;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
}

.CaracteristiqueAdmin-add-btn:hover {
  background-color: #0a3b70;
}

.CaracteristiqueAdmin-btn-icon {
  margin-right: 6px;
  font-size: 14px;
  font-weight: bold;
}

/* Conteneur de la table */
.CaracteristiqueAdmin-table-wrapper {
  overflow-x: auto;
}

/* Style de la table */
.CaracteristiqueAdmin-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}

.CaracteristiqueAdmin-th {
  background-color: #f8f9fa;
  font-weight: 500;
  padding: 15px 20px;
  color: #0F447E;
  font-size: 14px;
  border-bottom: 1px solid #eaeaea;
}

.CaracteristiqueAdmin-tr {
  border-bottom: 1px solid #eaeaea;
}

.CaracteristiqueAdmin-tr:last-child {
  border-bottom: none;
}

.CaracteristiqueAdmin-td {
  padding: 15px 20px;
  font-size: 14px;
  color: #333;
}

/* Style des actions */
.CaracteristiqueAdmin-actions {
  display: flex;
  gap: 10px;
}

.CaracteristiqueAdmin-action-btn {
  background: none;
  border: none;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.2s;
}

.CaracteristiqueAdmin-edit-btn {
  color: #0F447E;
  background-color: rgba(14, 76, 144, 0.1);
}

.CaracteristiqueAdmin-edit-btn:hover {
  background-color: rgba(14, 76, 144, 0.2);
}

.CaracteristiqueAdmin-toggle-btn {
  color: #28a745;
  background-color: rgba(40, 167, 69, 0.1);
}

.CaracteristiqueAdmin-toggle-btn:hover {
  background-color: rgba(40, 167, 69, 0.2);
}

/* Style du statut */
.CaracteristiqueAdmin-status {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}

.CaracteristiqueAdmin-status.active {
  background-color: rgba(76, 175, 80, 0.1);
  color: #4CAF50;
}

.CaracteristiqueAdmin-status.inactive {
  background-color: rgba(244, 67, 54, 0.1);
  color: #E30613;
}

/* Style de pagination */
.CaracteristiqueAdmin-pagination {
  display: flex;
  justify-content: center;
  margin: 20px 0;
  gap: 5px;
}

.CaracteristiqueAdmin-pagination-btn {
  min-width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e0e0e0;
  background-color: white;
  color: #333;
  font-size: 14px;
  cursor: pointer;
  border-radius: 4px;
  transition: all 0.2s;
}

.CaracteristiqueAdmin-pagination-btn:hover:not(:disabled) {
  background-color: #f0f0f0;
}

.CaracteristiqueAdmin-pagination-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.CaracteristiqueAdmin-pagination-active {
  background-color: #0F447E;
  color: white;
  border-color: #0F447E;
}

.CaracteristiqueAdmin-pagination-active:hover {
  background-color: #0a3b70;
}

/* Responsive design */
@media (max-width: 768px) {
  .CaracteristiqueAdmin-container {
    padding: 15px;
    margin: 15px auto;
  }

  .CaracteristiqueAdmin-main-title {
    font-size: 20px;
  }

  .CaracteristiqueAdmin-card-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
  }

  .CaracteristiqueAdmin-add-btn {
    width: 100%;
    justify-content: center;
  }

  .CaracteristiqueAdmin-th,
  .CaracteristiqueAdmin-td {
    padding: 12px 10px;
    font-size: 13px;
  }

  .CaracteristiqueAdmin-table-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #0F447E #f0f0f0;
  }

  .CaracteristiqueAdmin-table-wrapper::-webkit-scrollbar {
    height: 6px;
  }

  .CaracteristiqueAdmin-table-wrapper::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
  }

  .CaracteristiqueAdmin-table-wrapper::-webkit-scrollbar-thumb {
    background: #0F447E;
    border-radius: 3px;
  }

  .CaracteristiqueAdmin-pagination {
    flex-wrap: wrap;
  }
}

@media (max-width: 480px) {
  .CaracteristiqueAdmin-container {
    padding: 10px;
    margin: 10px auto;
    max-width: 98%;
  }

  .CaracteristiqueAdmin-main-title {
    font-size: 18px;
  }

  .CaracteristiqueAdmin-subtitle {
    font-size: 14px;
  }

  .CaracteristiqueAdmin-action-btn {
    width: 28px;
    height: 28px;
  }

  /* Simplifier la pagination sur très petits écrans */
  .CaracteristiqueAdmin-pagination-btn {
    min-width: 28px;
    height: 28px;
    font-size: 12px;
  }

  .CaracteristiqueAdmin-status {
    padding: 2px 8px;
    font-size: 11px;
  }
}

/* Header actions container */
.CaracteristiqueAdmin-header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}
/* Style principal pour la page de gestion des services */
.gestion-services-admin-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
  margin-top: 30px;
}

.page-content {
  flex: 1 1;
  margin-left: 250px;
  padding-top: 70px;
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Quand le sidebar est collapsé sur DESKTOP */
.gestion-services-admin-page.sidebar-collapsed .page-content {
  margin-left: 70px;
  width: calc(100% - 70px);
}

/* Conteneur pour le contenu du dashboard */
.dashboard-content {
  padding: 0 20px;
  box-sizing: border-box;
}

/* Conteneur pour la gestion des services */
.gestion-services-container {
  padding: 20px 0;
  box-sizing: border-box;
}

/* ===============================================
   MOBILE VIEW - Le contenu prend toute la largeur
   =============================================== */
.gestion-services-admin-page.mobile-view .page-content {
  margin-left: 0 !important;
  width: 100% !important;
  padding-top: 80px;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 0 !important;
    width: 100% !important;
    padding-top: 80px;
  }
  
  .gestion-services-admin-page.sidebar-collapsed .page-content {
    margin-left: 0 !important;
    width: 100% !important;
  }
  
  .dashboard-content {
    padding: 0 15px;
  }
  
  .gestion-services-container {
    padding: 10px 0;
  }
}

@media (max-width: 480px) {
  .dashboard-content {
    padding: 0 10px;
  }
  
  .page-content {
    padding-top: 75px;
  }
  
  .gestion-services-container {
    padding: 5px 0;
  }
}
/* Container principal */
.GestionServicesComponent-container {
  font-family: 'Poppins', sans-serif;
  max-width: 95%;
  margin: 30px auto;
  color: #333;
}

/* Titre principal */
.GestionServicesComponent-main-title {
  font-size: 24px;
  font-weight: 600;
  color: #0F447E;
  margin-bottom: 20px;
}

.GestionServicesComponent-title-highlight {
  color: #E30613;
}

/* Carte principale */
.GestionServicesComponent-card {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

/* En-tête de la carte */
.GestionServicesComponent-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  border-bottom: 1px solid #f0f0f0;
}

.GestionServicesComponent-subtitle {
  font-size: 16px;
  font-weight: 600;
  color: #0F447E;
  margin: 0;
}

.GestionServicesComponent-subtitle-highlight {
  color: #E30613;
}

/* Bouton d'ajout */
.GestionServicesComponent-add-btn {
  background-color: #0F447E;
  color: white;
  border: none;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
}

.GestionServicesComponent-add-btn:hover {
  background-color: #0a3b70;
}

.GestionServicesComponent-btn-icon {
  margin-right: 6px;
  font-size: 14px;
  font-weight: bold;
}

/* Conteneur de la table */
.GestionServicesComponent-table-wrapper {
  overflow-x: auto;
}

/* Style de la table */
.GestionServicesComponent-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}

.GestionServicesComponent-th {
  background-color: #f8f9fa;
  font-weight: 500;
  padding: 15px 20px;
  color: #0F447E;
  font-size: 14px;
  border-bottom: 1px solid #eaeaea;
}

.GestionServicesComponent-tr {
  border-bottom: 1px solid #eaeaea;
}

.GestionServicesComponent-tr:last-child {
  border-bottom: none;
}

.GestionServicesComponent-td {
  padding: 15px 20px;
  font-size: 14px;
  color: #333;
}

/* Style spécifique pour la colonne description */
.GestionServicesComponent-description {
  max-width: 200px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: help;
}

.GestionServicesComponent-description:hover {
  color: #0e4c90;
}

/* Style des actions */
.GestionServicesComponent-actions {
  display: flex;
  gap: 10px;
}

.GestionServicesComponent-action-btn {
  background: none;
  border: none;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.2s;
}

.GestionServicesComponent-edit-btn {
  color: #0F447E;
  background-color: rgba(14, 76, 144, 0.1);
}

.GestionServicesComponent-edit-btn:hover {
  background-color: rgba(14, 76, 144, 0.2);
}

.GestionServicesComponent-delete-btn {
  color: #E30613;
  background-color: rgba(230, 57, 70, 0.1);
}

.GestionServicesComponent-delete-btn:hover {
  background-color: rgba(230, 57, 70, 0.2);
}

/* Style de pagination */
.GestionServicesComponent-pagination {
  display: flex;
  justify-content: center;
  margin: 20px 0;
  gap: 5px;
}

.GestionServicesComponent-pagination-btn {
  min-width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e0e0e0;
  background-color: white;
  color: #333;
  font-size: 14px;
  cursor: pointer;
  border-radius: 4px;
  transition: all 0.2s;
}

.GestionServicesComponent-pagination-btn:hover:not(:disabled) {
  background-color: #f0f0f0;
}

.GestionServicesComponent-pagination-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.GestionServicesComponent-pagination-active {
  background-color: #0F447E;
  color: white;
  border-color: #0F447E;
}

.GestionServicesComponent-pagination-active:hover {
  background-color: #0a3b70;
}

/* Responsive design */
@media (max-width: 768px) {
  .GestionServicesComponent-container {
    padding: 15px;
    margin: 15px auto;
  }
  
  .GestionServicesComponent-main-title {
    font-size: 20px;
  }
  
  .GestionServicesComponent-card-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
  }
  
  .GestionServicesComponent-add-btn {
    width: 100%;
    justify-content: center;
  }
  
  .GestionServicesComponent-th, 
  .GestionServicesComponent-td {
    padding: 12px 10px;
    font-size: 13px;
  }
  
  .GestionServicesComponent-description {
    max-width: 150px;
  }
  
  .GestionServicesComponent-table-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #0F447E #f0f0f0;
  }
  
  .GestionServicesComponent-table-wrapper::-webkit-scrollbar {
    height: 6px;
  }
  
  .GestionServicesComponent-table-wrapper::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
  }
  
  .GestionServicesComponent-table-wrapper::-webkit-scrollbar-thumb {
    background: #0F447E;
    border-radius: 3px;
  }
  
  .GestionServicesComponent-pagination {
    flex-wrap: wrap;
  }
}

@media (max-width: 480px) {
  .GestionServicesComponent-container {
    padding: 10px;
    margin: 10px auto;
    max-width: 98%;
  }
  
  .GestionServicesComponent-main-title {
    font-size: 18px;
  }
  
  .GestionServicesComponent-subtitle {
    font-size: 14px;
  }
  
  .GestionServicesComponent-action-btn {
    width: 28px;
    height: 28px;
  }
  
  .GestionServicesComponent-description {
    max-width: 120px;
  }
  
  /* Simplifier la pagination sur très petits écrans */
  .GestionServicesComponent-pagination-btn {
    min-width: 28px;
    height: 28px;
    font-size: 12px;
  }
}

/* Styles pour le toggle */
.GestionServicesComponent-toggle-btn {
  color: #4CAF50;
  background-color: rgba(76, 175, 80, 0.1);
}

.GestionServicesComponent-toggle-btn:hover {
  background-color: rgba(76, 175, 80, 0.2);
}

.GestionServicesComponent-toggle-btn svg {
  font-size: 18px;
}

.GestionServicesComponent-status {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}

.GestionServicesComponent-status.active {
  background-color: rgba(76, 175, 80, 0.1);
  color: #4CAF50;
}

.GestionServicesComponent-status.inactive {
  background-color: rgba(244, 67, 54, 0.1);
  color: #E30613;
}

/* Supprimer le style du bouton delete */
.GestionServicesComponent-delete-btn {
  display: none;
}

.GestionServicesComponent-header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}
/* Overlay du popup */
.ServiceAddPopup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  -webkit-backdrop-filter: blur(5px);
          backdrop-filter: blur(5px);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  overflow-y: auto;
}

/* Container principal du popup */
.ServiceAddPopup-container {
  background-color: white;
  border-radius: 10px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  width: 90%;
  max-width: 700px;
  max-height: 90vh;
  overflow-y: auto;
  padding: 20px;
  position: relative;
}

/* Header du popup */
.ServiceAddPopup-header {
  padding: 24px 24px 16px 24px;
  border-bottom: 1px solid #e5e7eb;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.ServiceAddPopup-title {
  font-size: 20px;
  font-weight: 600;
  margin: 0;
}

.ServiceAddPopup-title-blue {
  color: #0c447e;
}

.ServiceAddPopup-title-red {
  color: #ef4444;
}

.ServiceAddPopup-close-button {
  background: none;
  border: none;
  color: #9ca3af;
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  transition: color 0.2s;
}

.ServiceAddPopup-close-button:hover {
  color: #6b7280;
}

/* Formulaire */
.ServiceAddPopup-form {
  padding: 24px;
}

.ServiceAddPopup-form-group {
  margin-bottom: 24px;
}

.ServiceAddPopup-form-label {
  display: block;
  font-size: 16px;
  font-weight: 500;
  color: #374151;
  margin-bottom: 8px;
}

.ServiceAddPopup-required {
  color: #ef4444;
}

/* Styles pour les erreurs */
.ServiceAddPopup-form-input.ServiceAddPopup-error,
.ServiceAddPopup-form-select.ServiceAddPopup-error,
.ServiceAddPopup-form-textarea.ServiceAddPopup-error {
  border-color: #ef4444;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
}

.ServiceAddPopup-error-message {
  display: block;
  color: #ef4444;
  font-size: 12px;
  margin-top: 4px;
  font-weight: 500;
}

.ServiceAddPopup-form-input,
.ServiceAddPopup-form-select,
.ServiceAddPopup-form-textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  font-size: 14px;
  transition: border-color 0.2s, box-shadow 0.2s;
  background: white;
  font-family: inherit;
}

.ServiceAddPopup-form-input:focus,
.ServiceAddPopup-form-select:focus,
.ServiceAddPopup-form-textarea:focus {
  outline: none;
  border-color: #0c447e;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.ServiceAddPopup-form-select {
  -webkit-appearance: none;
          appearance: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 fill=%27none%27 viewBox=%270 0 20 20%27%3e%3cpath stroke=%27%236b7280%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%271.5%27 d=%27m6 8 4 4 4-4%27/%3e%3c/svg%3e");
  background-position: right 12px center;
  background-repeat: no-repeat;
  background-size: 16px;
  padding-right: 40px;
}

.ServiceAddPopup-form-textarea {
  resize: vertical;
  min-height: 100px;
  line-height: 1.5;
}

/* Sélecteur d'icône */
.ServiceAddPopup-icon-selector {
  position: relative;
}

.ServiceAddPopup-icon-selector-button {
  width: 100%;
  padding: 12px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  background: white;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.ServiceAddPopup-icon-selector-button:hover {
  border-color: #9ca3af;
}

.ServiceAddPopup-icon-selector-button:focus {
  outline: none;
  border-color: #0c447e;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.ServiceAddPopup-icon-selector-content {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ServiceAddPopup-placeholder-text {
  color: #6b7280;
  font-size: 14px;
}

.ServiceAddPopup-placeholder-subtext {
  color: #9ca3af;
  font-size: 14px;
  margin-left: 8px;
}

.ServiceAddPopup-dropdown-arrow {
  color: #9ca3af;
  font-size: 8px;
}

/* Panneau de sélection d'icônes */
.ServiceAddPopup-icon-picker-panel {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin-top: 4px;
  background: white;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -2px rgba(0, 0, 0, 0.05);
  z-index: 1001;
  max-height: 400px;
  overflow: hidden;
}

/* Barre de recherche */
.ServiceAddPopup-search-container {
  padding: 16px;
  border-bottom: 1px solid #e5e7eb;
}

.ServiceAddPopup-search-input-wrapper {
  position: relative;
}

.ServiceAddPopup-search-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #9ca3af;
}

.ServiceAddPopup-search-input {
  width: 100%;
  padding: 8px 12px 8px 40px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  font-size: 14px;
}

.ServiceAddPopup-search-input:focus {
  outline: none;
  border-color: #0c447e;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

/* Sélecteur de couleur */
.ServiceAddPopup-color-selector {
  padding: 16px;
  border-bottom: 1px solid #e5e7eb;
}

.ServiceAddPopup-color-label {
  display: block;
  font-size: 12px;
  font-weight: 500;
  color: #374151;
  margin-bottom: 8px;
}

.ServiceAddPopup-color-options {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.ServiceAddPopup-color-option {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 2px solid transparent;
  cursor: pointer;
  transition: transform 0.2s, border-color 0.2s;
}

.ServiceAddPopup-color-option:hover {
  transform: scale(1.1);
}

.ServiceAddPopup-color-option.ServiceAddPopup-selected {
  border-color: #374151;
  transform: scale(1.2);
}

/* Container de la grille d'icônes */
.ServiceAddPopup-icons-grid-container {
  max-height: 300px;
  overflow-y: auto;
  padding: 16px;
}

/* Catégorie d'icônes */
.ServiceAddPopup-icon-category {
  margin-bottom: 20px;
}

.ServiceAddPopup-category-title {
  font-size: 12px;
  font-weight: 600;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 12px;
  padding-bottom: 4px;
  border-bottom: 1px solid #f3f4f6;
}

/* Grille d'icônes */
.ServiceAddPopup-icons-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
  grid-gap: 8px;
  gap: 8px;
}

.ServiceAddPopup-icon-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 12px 8px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: none;
  cursor: pointer;
  transition: background-color 0.2s, border-color 0.2s;
}

.ServiceAddPopup-icon-item:hover {
  background-color: #f9fafb;
  border-color: #e5e7eb;
}

.ServiceAddPopup-icon-component {
  margin-bottom: 4px;
}

.ServiceAddPopup-icon-label {
  font-size: 10px;
  color: #6b7280;
  text-align: center;
  line-height: 1.2;
}

.ServiceAddPopup-no-icons-message {
  text-align: center;
  color: #9ca3af;
  padding: 20px;
  font-size: 14px;
}

/* Boutons */
.ServiceAddPopup-buttons-container {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid #e5e7eb;
}

.ServiceAddPopup-cancel-button,
.ServiceAddPopup-submit-button {
  padding: 10px 20px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s, border-color 0.2s;
}

.ServiceAddPopup-cancel-button {
  background: #0c447e04;
  color: #646870;
  border: 1px solid #cfcccc;
}

.ServiceAddPopup-cancel-button:hover {
  background: #0c447e11;
  border-color: #b4b2b2;
}

.ServiceAddPopup-submit-button {
  background: #0c447e;
  border: 1px solid #114a87;
  color: white;
}

.ServiceAddPopup-submit-button:hover {
  background: #07305c;
}

/* Responsive */
@media (max-width: 768px) {
  .ServiceAddPopup-container {
    width: 95%;
    margin: 10px;
    max-height: 95vh;
  }

  .ServiceAddPopup-header,
  .ServiceAddPopup-form {
    padding: 16px;
  }

  .ServiceAddPopup-title {
    font-size: 18px;
  }

  .ServiceAddPopup-icons-grid {
    grid-template-columns: repeat(auto-fill, minmax(70px, 1fr));
  }

  .ServiceAddPopup-buttons-container {
    flex-direction: column;
  }

  .ServiceAddPopup-cancel-button,
  .ServiceAddPopup-submit-button {
    width: 100%;
  }

  .ServiceAddPopup-icons-grid-container {
    max-height: 250px;
  }
}

@media (max-width: 480px) {
  .ServiceAddPopup-container {
    width: 98%;
    margin: 5px;
  }

  .ServiceAddPopup-header,
  .ServiceAddPopup-form {
    padding: 12px;
  }

  .ServiceAddPopup-title {
    font-size: 16px;
  }

  .ServiceAddPopup-form-label {
    font-size: 14px;
  }

  .ServiceAddPopup-form-input,
  .ServiceAddPopup-form-select,
  .ServiceAddPopup-form-textarea {
    padding: 10px;
    font-size: 13px;
  }
}

/* Style principal pour la page de gestion des règles et conditions */
.regles-conditions-admin-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
  margin-top: 30px;
}

.page-content {
  flex: 1 1;
  margin-left: 250px;
  padding-top: 70px;
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Quand le sidebar est collapsé sur DESKTOP */
.regles-conditions-admin-page.sidebar-collapsed .page-content {
  margin-left: 70px;
  width: calc(100% - 70px);
}

/* Conteneur pour le contenu du dashboard */
.dashboard-content {
  padding: 0 20px;
  box-sizing: border-box;
}

/* Conteneur pour la gestion des règles et conditions */
.regles-conditions-container {
  padding: 20px 0;
  box-sizing: border-box;
}

/* ===============================================
   MOBILE VIEW - Le contenu prend toute la largeur
   =============================================== */
.regles-conditions-admin-page.mobile-view .page-content {
  margin-left: 0 !important;
  width: 100% !important;
  padding-top: 80px;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 0 !important;
    width: 100% !important;
    padding-top: 80px;
  }
  
  .regles-conditions-admin-page.sidebar-collapsed .page-content {
    margin-left: 0 !important;
    width: 100% !important;
  }
  
  .dashboard-content {
    padding: 0 15px;
  }
  
  .regles-conditions-container {
    padding: 10px 0;
  }
}

@media (max-width: 480px) {
  .dashboard-content {
    padding: 0 10px;
  }
  
  .page-content {
    padding-top: 75px;
  }
  
  .regles-conditions-container {
    padding: 5px 0;
  }
}

/* Styles spécifiques pour le formulaire de règles et conditions */
.staff-cash-form h2 {
  color: #0F223A;
  font-size: 1.6rem;
  font-weight: 600;
  margin-bottom: 1.5rem;
  text-align: center;
}

.staff-cash-form form {
  display: grid;
  grid-gap: 1.25rem;
  gap: 1.25rem;
}

.staff-cash-form label {
  display: block;
  font-weight: 500;
  color: #0F223A;
}

.staff-cash-form input,
.staff-cash-form select,
.staff-cash-form textarea {
  border: 1px solid #E6E9F0;
  border-radius: 8px;
  padding: 0.6rem 0.75rem;
  font-size: 0.95rem;
  width: 100%;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.staff-cash-form input:focus,
.staff-cash-form select:focus,
.staff-cash-form textarea:focus {
  outline: none;
  border-color: #134981;
  box-shadow: 0 0 0 2px rgba(19, 73, 129, 0.15);
}

/* Grille responsive pour les lignes à 2 colonnes */
.staff-cash-form .row-2 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  grid-gap: 1rem;
  gap: 1rem;
}

/* Checkbox inline */
.staff-cash-form .checkbox-inline {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.staff-cash-form .summary-box {
  border: 1px solid #E6E9F0;
  border-radius: 8px;
  background: #f9f9f9;
  padding: 0.75rem;
  font-size: 0.95rem;
  line-height: 1.4;
}

.staff-cash-form button {
  background-color: #e30613;
  color: #fff;
  font-weight: 600;
  border: none;
  border-radius: 10px;
  padding: 0.7rem 1.2rem;
  font-size: 1rem;
  cursor: pointer;
  transition: background-color 0.25s ease, transform 0.15s ease;
}

.staff-cash-form button:hover {
  background-color: #c10510;
  transform: translateY(-1px);
}

.staff-cash-form button:disabled {
  background-color: #999;
  cursor: not-allowed;
}

/* Messages succès/erreur */
.staff-cash-form .alert {
  padding: 0.75rem;
  border-radius: 8px;
  font-size: 0.9rem;
}

.staff-cash-form .alert.success {
  background: #e6f9ee;
  border: 1px solid #b6e2c1;
  color: #256029;
}

.staff-cash-form .alert.error {
  background: #fdeaea;
  border: 1px solid #f5c2c2;
  color: #a12626;
}

/* Responsive pour le formulaire */
@media (max-width: 640px) {
  .staff-cash-form {
    padding: 1rem;
  }
  
  .staff-cash-form .row-2 {
    grid-template-columns: 1fr;
  }
}
/* Container principal */
.ReglesConditionsComponent-container {
  font-family: 'Poppins', sans-serif;
  max-width: 95%;
  margin: 30px auto;
  color: #333;
}

/* Titre principal */
.ReglesConditionsComponent-main-title {
  font-size: 24px;
  font-weight: 600;
  color: #0F447E;
  margin-bottom: 20px;
}

.ReglesConditionsComponent-title-highlight {
  color: #E30613;
}

/* Carte principale */
.ReglesConditionsComponent-card {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

/* En-tête de la carte */
.ReglesConditionsComponent-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  border-bottom: 1px solid #f0f0f0;
}

.ReglesConditionsComponent-subtitle {
  font-size: 16px;
  font-weight: 600;
  color: #0F447E;
  margin: 0;
}

.ReglesConditionsComponent-subtitle-highlight {
  color: #E30613;
}

/* Bouton d'ajout */
.ReglesConditionsComponent-add-btn {
  background-color: #0F447E;
  color: white;
  border: none;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
}

.ReglesConditionsComponent-add-btn:hover {
  background-color: #0a3b70;
}

.ReglesConditionsComponent-btn-icon {
  margin-right: 6px;
  font-size: 14px;
  font-weight: bold;
}

/* Conteneur de la table */
.ReglesConditionsComponent-table-wrapper {
  overflow-x: auto;
}

/* Style de la table */
.ReglesConditionsComponent-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}

.ReglesConditionsComponent-th {
  background-color: #f8f9fa;
  font-weight: 500;
  padding: 15px 20px;
  color: #0F447E;
  font-size: 14px;
  border-bottom: 1px solid #eaeaea;
}

.ReglesConditionsComponent-tr {
  border-bottom: 1px solid #eaeaea;
}

.ReglesConditionsComponent-tr:last-child {
  border-bottom: none;
}

.ReglesConditionsComponent-td {
  padding: 15px 20px;
  font-size: 14px;
  color: #333;
}

/* Style des types */
.ReglesConditionsComponent-type {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}

.ReglesConditionsComponent-type.appartement {
  color: #333;
}

.ReglesConditionsComponent-type.hôtel {
  color: #333;
}

.ReglesConditionsComponent-type.mixte {
  color: #333;
}

/* Style des actions */
.ReglesConditionsComponent-actions {
  display: flex;
  gap: 10px;
}

.ReglesConditionsComponent-action-btn {
  background: none;
  border: none;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.2s;
}

.ReglesConditionsComponent-edit-btn {
  color: #0F447E;
  background-color: rgba(14, 76, 144, 0.1);
}

.ReglesConditionsComponent-edit-btn:hover {
  background-color: rgba(14, 76, 144, 0.2);
}

/* Style de pagination */
.ReglesConditionsComponent-pagination {
  display: flex;
  justify-content: center;
  margin: 20px 0;
  gap: 5px;
}

.ReglesConditionsComponent-pagination-btn {
  min-width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e0e0e0;
  background-color: white;
  color: #333;
  font-size: 14px;
  cursor: pointer;
  border-radius: 4px;
  transition: all 0.2s;
}

.ReglesConditionsComponent-pagination-btn:hover:not(:disabled) {
  background-color: #f0f0f0;
}

.ReglesConditionsComponent-pagination-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.ReglesConditionsComponent-pagination-active {
  background-color: #0F447E;
  color: white;
  border-color: #0F447E;
}

.ReglesConditionsComponent-pagination-active:hover {
  background-color: #0a3b70;
}

/* Styles pour le toggle */
.ReglesConditionsComponent-toggle-btn {
  color: #4CAF50;
  background-color: rgba(76, 175, 80, 0.1);
}

.ReglesConditionsComponent-toggle-btn:hover {
  background-color: rgba(76, 175, 80, 0.2);
}

.ReglesConditionsComponent-toggle-btn svg {
  font-size: 18px;
}

.ReglesConditionsComponent-status {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}

.ReglesConditionsComponent-status.active {
  background-color: rgba(76, 175, 80, 0.1);
  color: #4CAF50;
}

.ReglesConditionsComponent-status.inactive {
  background-color: rgba(244, 67, 54, 0.1);
  color: #E30613;
}

/* Responsive design */
@media (max-width: 768px) {
  .ReglesConditionsComponent-container {
    padding: 15px;
    margin: 15px auto;
  }

  .ReglesConditionsComponent-main-title {
    font-size: 20px;
  }

  .ReglesConditionsComponent-card-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
  }

  .ReglesConditionsComponent-add-btn {
    width: 100%;
    justify-content: center;
  }

  .ReglesConditionsComponent-th,
  .ReglesConditionsComponent-td {
    padding: 12px 10px;
    font-size: 13px;
  }

  .ReglesConditionsComponent-table-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #0F447E #f0f0f0;
  }

  .ReglesConditionsComponent-table-wrapper::-webkit-scrollbar {
    height: 6px;
  }

  .ReglesConditionsComponent-table-wrapper::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
  }

  .ReglesConditionsComponent-table-wrapper::-webkit-scrollbar-thumb {
    background: #0F447E;
    border-radius: 3px;
  }

  .ReglesConditionsComponent-pagination {
    flex-wrap: wrap;
  }
}

@media (max-width: 480px) {
  .ReglesConditionsComponent-container {
    padding: 10px;
    margin: 10px auto;
    max-width: 98%;
  }

  .ReglesConditionsComponent-main-title {
    font-size: 18px;
  }

  .ReglesConditionsComponent-subtitle {
    font-size: 14px;
  }

  .ReglesConditionsComponent-action-btn {
    width: 28px;
    height: 28px;
  }

  /* Simplifier la pagination sur très petits écrans */
  .ReglesConditionsComponent-pagination-btn {
    min-width: 28px;
    height: 28px;
    font-size: 12px;
  }
}

.GestionServicesComponent-header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}
/* Overlay du popup */
.RegleAddPopup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  -webkit-backdrop-filter: blur(5px);
          backdrop-filter: blur(5px);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  overflow-y: auto;
}

/* Container principal du popup */
.RegleAddPopup-container {
  background-color: white;
  border-radius: 10px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  width: 90%;
  max-width: 600px;
  max-height: 90vh;
  overflow-y: auto;
  padding: 20px;
  position: relative;
}

/* Header du popup */
.RegleAddPopup-header {
  padding: 24px 24px 16px 24px;
  border-bottom: 1px solid #e5e7eb;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.RegleAddPopup-title {
  font-size: 20px;
  font-weight: 600;
  margin: 0;
}

.RegleAddPopup-title-blue {
  color: #0c447e;
}

.RegleAddPopup-title-red {
  color: #ef4444;
}

.RegleAddPopup-close-button {
  background: none;
  border: none;
  color: #9ca3af;
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  transition: color 0.2s;
}

.RegleAddPopup-close-button:hover {
  color: #6b7280;
}

/* Formulaire */
.RegleAddPopup-form {
  padding: 24px;
}

.RegleAddPopup-form-group {
  margin-bottom: 24px;
}

.RegleAddPopup-form-label {
  display: block;
  font-size: 16px;
  font-weight: 500;
  color: #374151;
  margin-bottom: 8px;
}

.RegleAddPopup-required {
  color: #ef4444;
}

/* Styles pour les erreurs */
.RegleAddPopup-form-input.RegleAddPopup-error,
.RegleAddPopup-form-select.RegleAddPopup-error {
  border-color: #ef4444;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
}

.RegleAddPopup-error-message {
  display: block;
  color: #ef4444;
  font-size: 12px;
  margin-top: 4px;
  font-weight: 500;
}

.RegleAddPopup-form-input,
.RegleAddPopup-form-select {
  width: 100%;
  padding: 12px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  font-size: 14px;
  transition: border-color 0.2s, box-shadow 0.2s;
  background: white;
  font-family: inherit;
}

.RegleAddPopup-form-input:focus,
.RegleAddPopup-form-select:focus {
  outline: none;
  border-color: #0c447e;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.RegleAddPopup-form-select {
  -webkit-appearance: none;
          appearance: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 fill=%27none%27 viewBox=%270 0 20 20%27%3e%3cpath stroke=%27%236b7280%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%271.5%27 d=%27m6 8 4 4 4-4%27/%3e%3c/svg%3e");
  background-position: right 12px center;
  background-repeat: no-repeat;
  background-size: 16px;
  padding-right: 40px;
}

/* Sélecteur d'icône */
.RegleAddPopup-icon-selector {
  position: relative;
}

.RegleAddPopup-icon-selector-button {
  width: 100%;
  padding: 12px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  background: white;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.RegleAddPopup-icon-selector-button:hover {
  border-color: #9ca3af;
}

.RegleAddPopup-icon-selector-button:focus {
  outline: none;
  border-color: #0c447e;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.RegleAddPopup-icon-selector-content {
  display: flex;
  align-items: center;
  gap: 8px;
}

.RegleAddPopup-placeholder-text {
  color: #6b7280;
  font-size: 14px;
}

.RegleAddPopup-dropdown-arrow {
  color: #9ca3af;
  font-size: 8px;
}

/* Panneau de sélection d'icônes */
.RegleAddPopup-icon-picker-panel {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin-top: 4px;
  background: white;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -2px rgba(0, 0, 0, 0.05);
  z-index: 1001;
  max-height: 400px;
  overflow: hidden;
}

/* Barre de recherche */
.RegleAddPopup-search-container {
  padding: 16px;
  border-bottom: 1px solid #e5e7eb;
}

.RegleAddPopup-search-input-wrapper {
  position: relative;
}

.RegleAddPopup-search-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #9ca3af;
}

.RegleAddPopup-search-input {
  width: 100%;
  padding: 8px 12px 8px 40px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  font-size: 14px;
}

.RegleAddPopup-search-input:focus {
  outline: none;
  border-color: #0c447e;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

/* Sélecteur de couleur */
.RegleAddPopup-color-selector {
  padding: 16px;
  border-bottom: 1px solid #e5e7eb;
}

.RegleAddPopup-color-label {
  display: block;
  font-size: 12px;
  font-weight: 500;
  color: #374151;
  margin-bottom: 8px;
}

.RegleAddPopup-color-options {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.RegleAddPopup-color-option {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 2px solid transparent;
  cursor: pointer;
  transition: transform 0.2s, border-color 0.2s;
}

.RegleAddPopup-color-option:hover {
  transform: scale(1.1);
}

.RegleAddPopup-color-option.RegleAddPopup-selected {
  border-color: #374151;
  transform: scale(1.2);
}

/* Container de la grille d'icônes */
.RegleAddPopup-icons-grid-container {
  max-height: 300px;
  overflow-y: auto;
  padding: 16px;
}

/* Catégorie d'icônes */
.RegleAddPopup-icon-category {
  margin-bottom: 20px;
}

.RegleAddPopup-category-title {
  font-size: 12px;
  font-weight: 600;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 12px;
  padding-bottom: 4px;
  border-bottom: 1px solid #f3f4f6;
}

/* Grille d'icônes */
.RegleAddPopup-icons-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
  grid-gap: 8px;
  gap: 8px;
}

.RegleAddPopup-icon-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 12px 8px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: none;
  cursor: pointer;
  transition: background-color 0.2s, border-color 0.2s;
}

.RegleAddPopup-icon-item:hover {
  background-color: #f9fafb;
  border-color: #e5e7eb;
}

.RegleAddPopup-icon-component {
  margin-bottom: 4px;
}

.RegleAddPopup-icon-label {
  font-size: 10px;
  color: #6b7280;
  text-align: center;
  line-height: 1.2;
}

.RegleAddPopup-no-icons-message {
  text-align: center;
  color: #9ca3af;
  padding: 20px;
  font-size: 14px;
}

/* Boutons */
.RegleAddPopup-buttons-container {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid #e5e7eb;
}

.RegleAddPopup-cancel-button,
.RegleAddPopup-submit-button {
  padding: 10px 20px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s, border-color 0.2s;
}

.RegleAddPopup-cancel-button {
  background: #0c447e04;
  color: #646870;
  border: 1px solid #cfcccc;
}

.RegleAddPopup-cancel-button:hover {
  background: #0c447e11;
  border-color: #b4b2b2;
}

.RegleAddPopup-submit-button {
  background: #0c447e;
  border: 1px solid #114a87;
  color: white;
}

.RegleAddPopup-submit-button:hover {
  background: #07305c;
}

/* Responsive */
@media (max-width: 768px) {
  .RegleAddPopup-container {
    width: 95%;
    margin: 10px;
    max-height: 95vh;
  }

  .RegleAddPopup-header,
  .RegleAddPopup-form {
    padding: 16px;
  }

  .RegleAddPopup-title {
    font-size: 18px;
  }

  .RegleAddPopup-icons-grid {
    grid-template-columns: repeat(auto-fill, minmax(70px, 1fr));
  }

  .RegleAddPopup-buttons-container {
    flex-direction: column;
  }

  .RegleAddPopup-cancel-button,
  .RegleAddPopup-submit-button {
    width: 100%;
  }

  .RegleAddPopup-icons-grid-container {
    max-height: 250px;
  }
}

@media (max-width: 480px) {
  .RegleAddPopup-container {
    width: 98%;
    margin: 5px;
  }

  .RegleAddPopup-header,
  .RegleAddPopup-form {
    padding: 12px;
  }

  .RegleAddPopup-title {
    font-size: 16px;
  }

  .RegleAddPopup-form-label {
    font-size: 14px;
  }

  .RegleAddPopup-form-input,
  .RegleAddPopup-form-select {
    padding: 10px;
    font-size: 13px;
  }
}

/* Style principal pour la page de gestion des politiques d'annulation */
.politique-annulation-admin-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
  margin-top: 30px;
}

.page-content {
  flex: 1 1;
  margin-left: 250px;
  padding-top: 70px;
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Quand le sidebar est collapsé sur DESKTOP */
.politique-annulation-admin-page.sidebar-collapsed .page-content {
  margin-left: 70px;
  width: calc(100% - 70px);
}

/* Conteneur pour le contenu du dashboard */
.dashboard-content {
  padding: 0 20px;
  box-sizing: border-box;
}

/* Conteneur pour la gestion des politiques d'annulation */
.politique-annulation-container {
  padding: 20px 0;
  box-sizing: border-box;
}

/* ===============================================
   MOBILE VIEW - Le contenu prend toute la largeur
   =============================================== */
.politique-annulation-admin-page.mobile-view .page-content {
  margin-left: 0 !important;
  width: 100% !important;
  padding-top: 80px;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 0 !important;
    width: 100% !important;
    padding-top: 80px;
  }
  
  .politique-annulation-admin-page.sidebar-collapsed .page-content {
    margin-left: 0 !important;
    width: 100% !important;
  }
  
  .dashboard-content {
    padding: 0 15px;
  }
  
  .politique-annulation-container {
    padding: 10px 0;
  }
}

@media (max-width: 480px) {
  .dashboard-content {
    padding: 0 10px;
  }
  
  .page-content {
    padding-top: 75px;
  }
  
  .politique-annulation-container {
    padding: 5px 0;
  }
}
/* Container principal */
.PolitiqueAnnulationComponent-container {
  font-family: 'Poppins', sans-serif;
  max-width: 95%;
  margin: 30px auto;
  color: #333;
}

/* Titre principal */
.PolitiqueAnnulationComponent-main-title {
  font-size: 24px;
  font-weight: 600;
  color: #0F447E;
  margin-bottom: 20px;
}

.PolitiqueAnnulationComponent-title-highlight {
  color: #E30613;
}

/* Carte principale */
.PolitiqueAnnulationComponent-card {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

/* En-tête de la carte */
.PolitiqueAnnulationComponent-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  border-bottom: 1px solid #f0f0f0;
}

.PolitiqueAnnulationComponent-subtitle {
  font-size: 16px;
  font-weight: 600;
  color: #0F447E;
  margin: 0;
}

.PolitiqueAnnulationComponent-subtitle-highlight {
  color: #E30613;
}

/* Bouton d'ajout */
.PolitiqueAnnulationComponent-add-btn {
  background-color: #0F447E;
  color: white;
  border: none;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
}

.PolitiqueAnnulationComponent-add-btn:hover {
  background-color: #0a3b70;
}

.PolitiqueAnnulationComponent-btn-icon {
  margin-right: 6px;
  font-size: 14px;
  font-weight: bold;
}

/* Conteneur de la table */
.PolitiqueAnnulationComponent-table-wrapper {
  overflow-x: auto;
}

/* Style de la table */
.PolitiqueAnnulationComponent-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}

.PolitiqueAnnulationComponent-th {
  background-color: #f8f9fa;
  font-weight: 500;
  padding: 15px 20px;
  color: #0F447E;
  font-size: 14px;
  border-bottom: 1px solid #eaeaea;
}

.PolitiqueAnnulationComponent-tr {
  border-bottom: 1px solid #eaeaea;
}

.PolitiqueAnnulationComponent-tr:last-child {
  border-bottom: none;
}

.PolitiqueAnnulationComponent-td {
  padding: 15px 20px;
  font-size: 14px;
  color: #333;
}

/* Style des types */
.PolitiqueAnnulationComponent-type {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}

.PolitiqueAnnulationComponent-type.appartement {
  color: #777676;
}

.PolitiqueAnnulationComponent-type.hôtel {
  color: #777676;
}

.PolitiqueAnnulationComponent-type.mixte {
color: #777676;
}

/* Style des actions */
.PolitiqueAnnulationComponent-actions {
  display: flex;
  gap: 10px;
}

.PolitiqueAnnulationComponent-action-btn {
  background: none;
  border: none;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.2s;
}

.PolitiqueAnnulationComponent-edit-btn {
  color: #0F447E;
  background-color: rgba(14, 76, 144, 0.1);
}

.PolitiqueAnnulationComponent-edit-btn:hover {
  background-color: rgba(14, 76, 144, 0.2);
}

/* Style de pagination */
.PolitiqueAnnulationComponent-pagination {
  display: flex;
  justify-content: center;
  margin: 20px 0;
  gap: 5px;
}

.PolitiqueAnnulationComponent-pagination-btn {
  min-width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e0e0e0;
  background-color: white;
  color: #333;
  font-size: 14px;
  cursor: pointer;
  border-radius: 4px;
  transition: all 0.2s;
}

.PolitiqueAnnulationComponent-pagination-btn:hover:not(:disabled) {
  background-color: #f0f0f0;
}

.PolitiqueAnnulationComponent-pagination-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.PolitiqueAnnulationComponent-pagination-active {
  background-color: #0F447E;
  color: white;
  border-color: #0F447E;
}

.PolitiqueAnnulationComponent-pagination-active:hover {
  background-color: #0a3b70;
}

/* Styles pour le toggle */
.PolitiqueAnnulationComponent-toggle-btn {
  color: #4CAF50;
  background-color: rgba(76, 175, 80, 0.1);
}

.PolitiqueAnnulationComponent-toggle-btn:hover {
  background-color: rgba(76, 175, 80, 0.2);
}

.PolitiqueAnnulationComponent-toggle-btn svg {
  font-size: 18px;
}

.PolitiqueAnnulationComponent-status {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}

.PolitiqueAnnulationComponent-status.active {
  background-color: rgba(76, 175, 80, 0.1);
  color: #4CAF50;
}

.PolitiqueAnnulationComponent-status.inactive {
  background-color: rgba(244, 67, 54, 0.1);
  color: #E30613;
}

/* Responsive design */
@media (max-width: 768px) {
  .PolitiqueAnnulationComponent-container {
    padding: 15px;
    margin: 15px auto;
  }

  .PolitiqueAnnulationComponent-main-title {
    font-size: 20px;
  }

  .PolitiqueAnnulationComponent-card-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
  }

  .PolitiqueAnnulationComponent-add-btn {
    width: 100%;
    justify-content: center;
  }

  .PolitiqueAnnulationComponent-th,
  .PolitiqueAnnulationComponent-td {
    padding: 12px 10px;
    font-size: 13px;
  }

  .PolitiqueAnnulationComponent-table-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #0F447E #f0f0f0;
  }

  .PolitiqueAnnulationComponent-table-wrapper::-webkit-scrollbar {
    height: 6px;
  }

  .PolitiqueAnnulationComponent-table-wrapper::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
  }

  .PolitiqueAnnulationComponent-table-wrapper::-webkit-scrollbar-thumb {
    background: #0F447E;
    border-radius: 3px;
  }

  .PolitiqueAnnulationComponent-pagination {
    flex-wrap: wrap;
  }
}

@media (max-width: 480px) {
  .PolitiqueAnnulationComponent-container {
    padding: 10px;
    margin: 10px auto;
    max-width: 98%;
  }

  .PolitiqueAnnulationComponent-main-title {
    font-size: 18px;
  }

  .PolitiqueAnnulationComponent-subtitle {
    font-size: 14px;
  }

  .PolitiqueAnnulationComponent-action-btn {
    width: 28px;
    height: 28px;
  }

  /* Simplifier la pagination sur très petits écrans */
  .PolitiqueAnnulationComponent-pagination-btn {
    min-width: 28px;
    height: 28px;
    font-size: 12px;
  }
}
/* Overlay du popup */
.PolitiqueAnnulationPopup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  -webkit-backdrop-filter: blur(5px);
          backdrop-filter: blur(5px);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  overflow-y: auto;
}

/* Container principal du popup */
.PolitiqueAnnulationPopup-container {
  background-color: white;
  border-radius: 10px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  width: 90%;
  max-width: 600px;
  max-height: 90vh;
  overflow-y: auto;
  padding: 20px;
  position: relative;
}

/* Header du popup */
.PolitiqueAnnulationPopup-header {
  padding: 24px 24px 16px 24px;
  border-bottom: 1px solid #e5e7eb;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.PolitiqueAnnulationPopup-title {
  font-size: 20px;
  font-weight: 600;
  margin: 0;
}

.PolitiqueAnnulationPopup-title-blue {
  color: #0c447e;
}

.PolitiqueAnnulationPopup-title-red {
  color: #ef4444;
}

.PolitiqueAnnulationPopup-close-button {
  background: none;
  border: none;
  color: #9ca3af;
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  transition: color 0.2s;
}

.PolitiqueAnnulationPopup-close-button:hover {
  color: #6b7280;
}

/* Formulaire */
.PolitiqueAnnulationPopup-form {
  padding: 24px;
}

.PolitiqueAnnulationPopup-form-group {
  margin-bottom: 24px;
}

.PolitiqueAnnulationPopup-form-label {
  display: block;
  font-size: 16px;
  font-weight: 500;
  color: #374151;
  margin-bottom: 8px;
}

.PolitiqueAnnulationPopup-required {
  color: #ef4444;
}

.PolitiqueAnnulationPopup-form-input,
.PolitiqueAnnulationPopup-form-select,
.PolitiqueAnnulationPopup-form-textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  font-size: 14px;
  transition: border-color 0.2s, box-shadow 0.2s;
  background: white;
  font-family: inherit;
}

.PolitiqueAnnulationPopup-form-input:focus,
.PolitiqueAnnulationPopup-form-select:focus,
.PolitiqueAnnulationPopup-form-textarea:focus {
  outline: none;
  border-color: #0c447e;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.PolitiqueAnnulationPopup-form-select {
  -webkit-appearance: none;
          appearance: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 fill=%27none%27 viewBox=%270 0 20 20%27%3e%3cpath stroke=%27%236b7280%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%271.5%27 d=%27m6 8 4 4 4-4%27/%3e%3c/svg%3e");
  background-position: right 12px center;
  background-repeat: no-repeat;
  background-size: 16px;
  padding-right: 40px;
}

.PolitiqueAnnulationPopup-form-textarea {
  resize: vertical;
  min-height: 100px;
  line-height: 1.5;
}

/* Boutons */
.PolitiqueAnnulationPopup-buttons-container {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid #e5e7eb;
}

.PolitiqueAnnulationPopup-cancel-button,
.PolitiqueAnnulationPopup-submit-button {
  padding: 10px 20px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s, border-color 0.2s;
}

.PolitiqueAnnulationPopup-cancel-button {
  background: #0c447e04;
  color: #646870;
  border: 1px solid #cfcccc;
}

.PolitiqueAnnulationPopup-cancel-button:hover {
  background: #0c447e11;
  border-color: #b4b2b2;
}

.PolitiqueAnnulationPopup-submit-button {
  background: #0c447e;
  border: 1px solid #114a87;
  color: white;
}

.PolitiqueAnnulationPopup-submit-button:hover {
  background: #07305c;
}

/* Responsive */
@media (max-width: 768px) {
  .PolitiqueAnnulationPopup-container {
    width: 95%;
    margin: 10px;
    max-height: 95vh;
  }

  .PolitiqueAnnulationPopup-header,
  .PolitiqueAnnulationPopup-form {
    padding: 16px;
  }

  .PolitiqueAnnulationPopup-title {
    font-size: 18px;
  }

  .PolitiqueAnnulationPopup-buttons-container {
    flex-direction: column;
  }

  .PolitiqueAnnulationPopup-cancel-button,
  .PolitiqueAnnulationPopup-submit-button {
    width: 100%;
  }
}

@media (max-width: 480px) {
  .PolitiqueAnnulationPopup-container {
    width: 98%;
    margin: 5px;
  }

  .PolitiqueAnnulationPopup-header,
  .PolitiqueAnnulationPopup-form {
    padding: 12px;
  }

  .PolitiqueAnnulationPopup-title {
    font-size: 16px;
  }

  .PolitiqueAnnulationPopup-form-label {
    font-size: 14px;
  }

  .PolitiqueAnnulationPopup-form-input,
  .PolitiqueAnnulationPopup-form-select,
  .PolitiqueAnnulationPopup-form-textarea {
    padding: 10px;
    font-size: 13px;
  }
}

/* Sélecteur d'icône */
.PolitiqueAnnulationPopup-icon-selector {
  position: relative;
}

.PolitiqueAnnulationPopup-icon-selector-button {
  width: 100%;
  padding: 12px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  background: white;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.PolitiqueAnnulationPopup-icon-selector-button:hover {
  border-color: #9ca3af;
}

.PolitiqueAnnulationPopup-icon-selector-button:focus {
  outline: none;
  border-color: #0c447e;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.PolitiqueAnnulationPopup-icon-selector-content {
  display: flex;
  align-items: center;
  gap: 8px;
}

.PolitiqueAnnulationPopup-placeholder-text {
  color: #6b7280;
  font-size: 14px;
}

.PolitiqueAnnulationPopup-dropdown-arrow {
  color: #9ca3af;
  font-size: 8px;
}

/* Panneau de sélection d'icônes */
.PolitiqueAnnulationPopup-icon-picker-panel {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin-top: 4px;
  background: white;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -2px rgba(0, 0, 0, 0.05);
  z-index: 1001;
  max-height: 400px;
  overflow: hidden;
}

/* Barre de recherche */
.PolitiqueAnnulationPopup-search-container {
  padding: 16px;
  border-bottom: 1px solid #e5e7eb;
}

.PolitiqueAnnulationPopup-search-input-wrapper {
  position: relative;
}

.PolitiqueAnnulationPopup-search-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #9ca3af;
}

.PolitiqueAnnulationPopup-search-input {
  width: 100%;
  padding: 8px 12px 8px 40px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  font-size: 14px;
}

.PolitiqueAnnulationPopup-search-input:focus {
  outline: none;
  border-color: #0c447e;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

/* Sélecteur de couleur */
.PolitiqueAnnulationPopup-color-selector {
  padding: 16px;
  border-bottom: 1px solid #e5e7eb;
}

.PolitiqueAnnulationPopup-color-label {
  display: block;
  font-size: 12px;
  font-weight: 500;
  color: #374151;
  margin-bottom: 8px;
}

.PolitiqueAnnulationPopup-color-options {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.PolitiqueAnnulationPopup-color-option {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 2px solid transparent;
  cursor: pointer;
  transition: transform 0.2s, border-color 0.2s;
}

.PolitiqueAnnulationPopup-color-option:hover {
  transform: scale(1.1);
}

.PolitiqueAnnulationPopup-color-option.PolitiqueAnnulationPopup-selected {
  border-color: #374151;
  transform: scale(1.2);
}

/* Container de la grille d'icônes */
.PolitiqueAnnulationPopup-icons-grid-container {
  max-height: 300px;
  overflow-y: auto;
  padding: 16px;
}

/* Catégorie d'icônes */
.PolitiqueAnnulationPopup-icon-category {
  margin-bottom: 20px;
}

.PolitiqueAnnulationPopup-category-title {
  font-size: 12px;
  font-weight: 600;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 12px;
  padding-bottom: 4px;
  border-bottom: 1px solid #f3f4f6;
}

/* Grille d'icônes */
.PolitiqueAnnulationPopup-icons-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
  grid-gap: 8px;
  gap: 8px;
}

.PolitiqueAnnulationPopup-icon-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 12px 8px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: none;
  cursor: pointer;
  transition: background-color 0.2s, border-color 0.2s;
}

.PolitiqueAnnulationPopup-icon-item:hover {
  background-color: #f9fafb;
  border-color: #e5e7eb;
}

.PolitiqueAnnulationPopup-icon-component {
  margin-bottom: 4px;
}

.PolitiqueAnnulationPopup-icon-label {
  font-size: 10px;
  color: #6b7280;
  text-align: center;
  line-height: 1.2;
}

.PolitiqueAnnulationPopup-no-icons-message {
  text-align: center;
  color: #9ca3af;
  padding: 20px;
  font-size: 14px;
}

/* Style principal pour la page de gestion des partenaires */
.gestion-partenaire-admin-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
  margin-top: 30px;
}

.page-content {
  flex: 1 1;
  margin-left: 250px;
  padding-top: 70px;
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Quand le sidebar est collapsé sur DESKTOP */
.gestion-partenaire-admin-page.sidebar-collapsed .page-content {
  margin-left: 70px;
  width: calc(100% - 70px);
}

/* Conteneur pour le contenu du dashboard */
.dashboard-content {
  padding: 0 20px;
  box-sizing: border-box;
}

/* Conteneur pour la gestion des partenaires */
.gestion-partenaire-container {
  padding: 20px 0;
  box-sizing: border-box;
}

/* ===============================================
   MOBILE VIEW - Le contenu prend toute la largeur
   =============================================== */
.gestion-partenaire-admin-page.mobile-view .page-content {
  margin-left: 0 !important;
  width: 100% !important;
  padding-top: 80px;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 0 !important;
    width: 100% !important;
    padding-top: 80px;
  }
  
  .gestion-partenaire-admin-page.sidebar-collapsed .page-content {
    margin-left: 0 !important;
    width: 100% !important;
  }
  
  .dashboard-content {
    padding: 0 15px;
  }
  
  .gestion-partenaire-container {
    padding: 10px 0;
  }
}

@media (max-width: 480px) {
  .dashboard-content {
    padding: 0 10px;
  }
  
  .page-content {
    padding-top: 75px;
  }
  
  .gestion-partenaire-container {
    padding: 5px 0;
  }
}
/* Container principal */
.GestionPartenaireComponent-container {
  font-family: 'Poppins', sans-serif;
  max-width: 95%;
  margin: 30px auto;
  color: #333;
}

/* Titre principal */
.GestionPartenaireComponent-main-title {
  font-size: 24px;
  font-weight: 600;
  color: #0F447E;
  margin-bottom: 20px;
}

.GestionPartenaireComponent-title-highlight {
  color: #E30613;
}

/* Carte principale */
.GestionPartenaireComponent-card {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

/* En-tête de la carte */
.GestionPartenaireComponent-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  border-bottom: 1px solid #f0f0f0;
}

.GestionPartenaireComponent-subtitle {
  font-size: 16px;
  font-weight: 600;
  color: #0F447E;
  margin: 0;
}

.GestionPartenaireComponent-subtitle-highlight {
  color: #E30613;
}

/* Bouton d'ajout */
.GestionPartenaireComponent-add-btn {
  background-color: #0F447E;
  color: white;
  border: none;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
}

.GestionPartenaireComponent-add-btn:hover {
  background-color: #0a3b70;
}

.GestionPartenaireComponent-btn-icon {
  margin-right: 6px;
  font-size: 14px;
  font-weight: bold;
}

/* État vide */
.GestionPartenaireComponent-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px;
  text-align: center;
}

.GestionPartenaireComponent-empty-icon {
  font-size: 64px;
  color: #e0e6ed;
  margin-bottom: 20px;
}

.GestionPartenaireComponent-empty-title {
  font-size: 20px;
  font-weight: 600;
  color: #0F447E;
  margin: 0 0 10px 0;
}

.GestionPartenaireComponent-empty-message {
  font-size: 14px;
  color: #666;
  margin: 0 0 20px 0;
  max-width: 400px;
}

/* Loading state */
.GestionPartenaireComponent-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px;
  text-align: center;
}

.GestionPartenaireComponent-spinner {
  width: 40px;
  height: 40px;
  border: 4px solid #f3f3f3;
  border-top: 4px solid #0F447E;
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin-bottom: 20px;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Error state */
.GestionPartenaireComponent-error {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px;
  text-align: center;
}

.GestionPartenaireComponent-error p {
  color: #E30613;
  font-size: 16px;
  margin-bottom: 20px;
}

.GestionPartenaireComponent-retry-btn {
  background-color: #0F447E;
  color: white;
  border: none;
  border-radius: 4px;
  padding: 10px 20px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.3s;
}

.GestionPartenaireComponent-retry-btn:hover {
  background-color: #0a3b70;
}


.GestionPartenaireComponent-empty-btn {
  background-color: #E30613;
  color: white;
  border: none;
  border-radius: 6px;
  padding: 12px 24px;
  font-size: 14px;
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
}

.GestionPartenaireComponent-empty-btn:hover {
  background-color: #c8050f;
}

.GestionPartenaireComponent-empty-btn .GestionPartenaireComponent-btn-icon {
  margin-right: 8px;
}

/* Conteneur de la table */
.GestionPartenaireComponent-table-wrapper {
  overflow-x: auto;
}

/* Style de la table */
.GestionPartenaireComponent-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}

.GestionPartenaireComponent-th {
  background-color: #f8f9fa;
  font-weight: 500;
  padding: 15px 20px;
  color: #0F447E;
  font-size: 14px;
  border-bottom: 1px solid #eaeaea;
}

.GestionPartenaireComponent-tr {
  border-bottom: 1px solid #eaeaea;
}

.GestionPartenaireComponent-tr:last-child {
  border-bottom: none;
}

.GestionPartenaireComponent-td {
  padding: 15px 20px;
  font-size: 14px;
  color: #333;
  vertical-align: middle;
}

/* Logo */
.GestionPartenaireComponent-logo-container {
  display: flex;
  justify-content: center;
  align-items: center;
}

.GestionPartenaireComponent-logo {
  width: 40px;
  height: 40px;
  border-radius: 4px;
  object-fit: cover;
}

.GestionPartenaireComponent-logo-placeholder {
  width: 40px;
  height: 40px;
  border-radius: 4px;
  background-color: #f0f0f0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #6c757d;
}

/* Style du nom */
.GestionPartenaireComponent-name {
  font-weight: 500;
  color: #0F447E;
}

/* Style du type */
.GestionPartenaireComponent-type {
  font-size: 13px;
}

/* Style de l'email */
.GestionPartenaireComponent-email {
  color: #0F447E;
}

/* Style des actions */
.GestionPartenaireComponent-actions {
  display: flex;
  gap: 10px;
}

.GestionPartenaireComponent-action-btn {
  background: none;
  border: none;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.2s;
}

.GestionPartenaireComponent-edit-btn {
  color: #0F447E;
  background-color: rgba(14, 76, 144, 0.1);
}

.GestionPartenaireComponent-edit-btn:hover {
  background-color: rgba(14, 76, 144, 0.2);
}

.GestionPartenaireComponent-delete-btn {
  color: #E30613;
  background-color: rgba(227, 6, 19, 0.1);
  margin-left: 8px;
}

.GestionPartenaireComponent-delete-btn:hover {
  background-color: rgba(227, 6, 19, 0.2);
}

/* Toggle Switch */
.tahaga-toggle-container {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 22px;
  margin-left: 8px;
}

.tahaga-toggle-input {
  opacity: 0;
  width: 0;
  height: 0;
}

.tahaga-toggle-label {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  border-radius: 22px;
  transition: .3s;
}

.tahaga-toggle-label:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  border-radius: 50%;
  transition: .3s;
}

.tahaga-toggle-input:checked + .tahaga-toggle-label {
  background-color: #4CAF50;
}

.tahaga-toggle-input:checked + .tahaga-toggle-label:before {
  transform: translateX(24px);
}

/* Status styles */
.GestionPartenaireComponent-status {
  padding: 4px 8px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.GestionPartenaireComponent-status.active {
  background-color: rgba(40, 167, 69, 0.1);
  color: #28a745;
}

.GestionPartenaireComponent-status.inactive {
  background-color: rgba(108, 117, 125, 0.1);
  color: #6c757d;
}

/* Style de pagination */
.GestionPartenaireComponent-pagination {
  display: flex;
  justify-content: center;
  margin: 20px 0;
  gap: 5px;
}

.GestionPartenaireComponent-pagination-btn {
  min-width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e0e0e0;
  background-color: white;
  color: #333;
  font-size: 14px;
  cursor: pointer;
  border-radius: 4px;
  transition: all 0.2s;
}

.GestionPartenaireComponent-pagination-btn:hover:not(:disabled) {
  background-color: #f0f0f0;
}

.GestionPartenaireComponent-pagination-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.GestionPartenaireComponent-pagination-active {
  background-color: #0F447E;
  color: white;
  border-color: #0F447E;
}

.GestionPartenaireComponent-pagination-active:hover {
  background-color: #0a3b70;
}

/* Responsive design */
@media (max-width: 768px) {
  .GestionPartenaireComponent-container {
    padding: 15px;
    margin: 15px auto;
  }

  .GestionPartenaireComponent-main-title {
    font-size: 20px;
  }

  .GestionPartenaireComponent-card-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
  }

  .GestionPartenaireComponent-add-btn {
    width: 100%;
    justify-content: center;
  }

  /* État vide responsive */
  .GestionPartenaireComponent-empty-state {
    padding: 40px 15px;
  }

  .GestionPartenaireComponent-empty-icon {
    font-size: 48px;
  }

  .GestionPartenaireComponent-empty-title {
    font-size: 18px;
  }

  .GestionPartenaireComponent-empty-btn {
    width: 100%;
    justify-content: center;
  }

  .GestionPartenaireComponent-th,
  .GestionPartenaireComponent-td {
    padding: 12px 10px;
    font-size: 13px;
  }

  .GestionPartenaireComponent-table-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #0F447E #f0f0f0;
  }

  .GestionPartenaireComponent-table-wrapper::-webkit-scrollbar {
    height: 6px;
  }

  .GestionPartenaireComponent-table-wrapper::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
  }

  .GestionPartenaireComponent-table-wrapper::-webkit-scrollbar-thumb {
    background: #0F447E;
    border-radius: 3px;
  }

  .GestionPartenaireComponent-pagination {
    flex-wrap: wrap;
  }
}

@media (max-width: 480px) {
  .GestionPartenaireComponent-container {
    padding: 10px;
    margin: 10px auto;
    max-width: 98%;
  }

  .GestionPartenaireComponent-main-title {
    font-size: 18px;
  }

  .GestionPartenaireComponent-subtitle {
    font-size: 14px;
  }

  /* État vide mobile */
  .GestionPartenaireComponent-empty-state {
    padding: 30px 10px;
  }

  .GestionPartenaireComponent-empty-icon {
    font-size: 40px;
    margin-bottom: 15px;
  }

  .GestionPartenaireComponent-empty-title {
    font-size: 16px;
  }

  .GestionPartenaireComponent-empty-message {
    font-size: 13px;
  }

  .GestionPartenaireComponent-action-btn {
    width: 28px;
    height: 28px;
  }

  .GestionPartenaireComponent-pagination-btn {
    min-width: 28px;
    height: 28px;
    font-size: 12px;
  }
}
/* Container principal */
.GestionPartenaireComponent-container {
  font-family: 'Poppins', sans-serif;
  max-width: 95%;
  margin: 30px auto;
  color: #333;
}

/* Titre principal */
.GestionPartenaireComponent-main-title {
  font-size: 24px;
  font-weight: 600;
  color: #0F447E;
  margin-bottom: 20px;
}

.GestionPartenaireComponent-title-highlight {
  color: #E30613;
}

/* Carte principale */
.GestionPartenaireComponent-card {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

/* En-tête de la carte */
.GestionPartenaireComponent-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  border-bottom: 1px solid #f0f0f0;
}

.GestionPartenaireComponent-subtitle {
  font-size: 16px;
  font-weight: 600;
  color: #0F447E;
  margin: 0;
}

.GestionPartenaireComponent-subtitle-highlight {
  color: #E30613;
}

/* Bouton d'ajout */
.GestionPartenaireComponent-add-btn {
  background-color: #0F447E;
  color: white;
  border: none;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
}

.GestionPartenaireComponent-add-btn:hover {
  background-color: #0a3b70;
}

.GestionPartenaireComponent-btn-icon {
  margin-right: 6px;
  font-size: 14px;
  font-weight: bold;
}

/* État vide */
.GestionPartenaireComponent-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px;
  text-align: center;
}

.GestionPartenaireComponent-empty-icon {
  font-size: 64px;
  color: #e0e6ed;
  margin-bottom: 20px;
}

.GestionPartenaireComponent-empty-title {
  font-size: 20px;
  font-weight: 600;
  color: #0F447E;
  margin: 0 0 10px 0;
}

.GestionPartenaireComponent-empty-message {
  font-size: 14px;
  color: #6c757d;
  margin: 0 0 25px 0;
  max-width: 400px;
  line-height: 1.5;
}

.GestionPartenaireComponent-empty-btn {
  background-color: #E30613;
  color: white;
  border: none;
  border-radius: 6px;
  padding: 12px 24px;
  font-size: 14px;
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
}

.GestionPartenaireComponent-empty-btn:hover {
  background-color: #c8050f;
}

.GestionPartenaireComponent-empty-btn .GestionPartenaireComponent-btn-icon {
  margin-right: 8px;
}

/* Conteneur de la table */
.GestionPartenaireComponent-table-wrapper {
  overflow-x: auto;
}

/* Style de la table */
.GestionPartenaireComponent-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}

.GestionPartenaireComponent-th {
  background-color: #f8f9fa;
  font-weight: 500;
  padding: 15px 20px;
  color: #0F447E;
  font-size: 14px;
  border-bottom: 1px solid #eaeaea;
}

.GestionPartenaireComponent-tr {
  border-bottom: 1px solid #eaeaea;
}

.GestionPartenaireComponent-tr:last-child {
  border-bottom: none;
}

.GestionPartenaireComponent-td {
  padding: 15px 20px;
  font-size: 14px;
  color: #333;
  vertical-align: middle;
}

/* Logo */
.GestionPartenaireComponent-logo-container {
  display: flex;
  justify-content: center;
  align-items: center;
}

.GestionPartenaireComponent-logo {
  width: 40px;
  height: 40px;
  border-radius: 4px;
  object-fit: cover;
}

.GestionPartenaireComponent-logo-placeholder {
  width: 40px;
  height: 40px;
  border-radius: 4px;
  background-color: #f0f0f0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #6c757d;
}

/* Style du nom */
.GestionPartenaireComponent-name {
  font-weight: 500;
  color: #0F447E;
}

/* Style du type */
.GestionPartenaireComponent-type {
  font-size: 13px;
}

/* Style de l'email */
.GestionPartenaireComponent-email {
  color: #0F447E;
}

/* Style des actions */
.GestionPartenaireComponent-actions {
  display: flex;
  gap: 10px;
}

.GestionPartenaireComponent-action-btn {
  background: none;
  border: none;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 4px;
  transition: background-color 0.2s;
}

.GestionPartenaireComponent-edit-btn {
  color: #0F447E;
  background-color: rgba(14, 76, 144, 0.1);
}

.GestionPartenaireComponent-edit-btn:hover {
  background-color: rgba(14, 76, 144, 0.2);
}

/* Style de pagination */
.GestionPartenaireComponent-pagination {
  display: flex;
  justify-content: center;
  margin: 20px 0;
  gap: 5px;
}

.GestionPartenaireComponent-pagination-btn {
  min-width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e0e0e0;
  background-color: white;
  color: #333;
  font-size: 14px;
  cursor: pointer;
  border-radius: 4px;
  transition: all 0.2s;
}

.GestionPartenaireComponent-pagination-btn:hover:not(:disabled) {
  background-color: #f0f0f0;
}

.GestionPartenaireComponent-pagination-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.GestionPartenaireComponent-pagination-active {
  background-color: #0F447E;
  color: white;
  border-color: #0F447E;
}

.GestionPartenaireComponent-pagination-active:hover {
  background-color: #0a3b70;
}

/* Responsive design */
@media (max-width: 768px) {
  .GestionPartenaireComponent-container {
    padding: 15px;
    margin: 15px auto;
  }

  .GestionPartenaireComponent-main-title {
    font-size: 20px;
  }

  .GestionPartenaireComponent-card-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
  }

  .GestionPartenaireComponent-add-btn {
    width: 100%;
    justify-content: center;
  }

  /* État vide responsive */
  .GestionPartenaireComponent-empty-state {
    padding: 40px 15px;
  }

  .GestionPartenaireComponent-empty-icon {
    font-size: 48px;
  }

  .GestionPartenaireComponent-empty-title {
    font-size: 18px;
  }

  .GestionPartenaireComponent-empty-btn {
    width: 100%;
    justify-content: center;
  }

  .GestionPartenaireComponent-th,
  .GestionPartenaireComponent-td {
    padding: 12px 10px;
    font-size: 13px;
  }

  .GestionPartenaireComponent-table-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #0F447E #f0f0f0;
  }

  .GestionPartenaireComponent-table-wrapper::-webkit-scrollbar {
    height: 6px;
  }

  .GestionPartenaireComponent-table-wrapper::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
  }

  .GestionPartenaireComponent-table-wrapper::-webkit-scrollbar-thumb {
    background: #0F447E;
    border-radius: 3px;
  }

  .GestionPartenaireComponent-pagination {
    flex-wrap: wrap;
  }
}

@media (max-width: 480px) {
  .GestionPartenaireComponent-container {
    padding: 10px;
    margin: 10px auto;
    max-width: 98%;
  }

  .GestionPartenaireComponent-main-title {
    font-size: 18px;
  }

  .GestionPartenaireComponent-subtitle {
    font-size: 14px;
  }

  /* État vide mobile */
  .GestionPartenaireComponent-empty-state {
    padding: 30px 10px;
  }

  .GestionPartenaireComponent-empty-icon {
    font-size: 40px;
    margin-bottom: 15px;
  }

  .GestionPartenaireComponent-empty-title {
    font-size: 16px;
  }

  .GestionPartenaireComponent-empty-message {
    font-size: 13px;
  }

  .GestionPartenaireComponent-action-btn {
    width: 28px;
    height: 28px;
  }

  .GestionPartenaireComponent-pagination-btn {
    min-width: 28px;
    height: 28px;
    font-size: 12px;
  }
}

/* ===== STYLES POPUP PARTENAIRE - CORRIGÉS ===== */

/* Overlay du popup */
.PartenaireAddPopup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.6);
  -webkit-backdrop-filter: blur(5px);
          backdrop-filter: blur(5px);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  padding: 20px;
  animation: fadeIn 0.3s ease-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* Container principal du popup */
.PartenaireAddPopup-container {
  background: white;
  border-radius: 16px;
  width: 100%;
  max-width: 700px;
  max-height: 90vh;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
  font-family: 'Poppins', sans-serif;
  animation: slideUp 0.3s ease-out;
}

@keyframes slideUp {
  from {
    transform: translateY(30px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

/* En-tête du popup */
.PartenaireAddPopup-header {
  background: linear-gradient(135deg, #0F447E 0%, #1a5490 100%);
  color: white;
  padding: 25px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.PartenaireAddPopup-title {
  font-size: 20px;
  font-weight: 600;
  margin: 0;
}

.PartenaireAddPopup-close-btn {
  background: none;
  border: none;
  color: white;
  font-size: 18px;
  cursor: pointer;
  padding: 8px;
  border-radius: 8px;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}

.PartenaireAddPopup-close-btn:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: scale(1.1);
}

/* Formulaire */
.PartenaireAddPopup-form {
  display: flex;
  flex-direction: column;
  height: calc(90vh - 100px);
  max-height: 600px;
}

.PartenaireAddPopup-form-content {
  padding: 30px;
  overflow-y: auto;
  flex: 1 1;
}

/* Section Logo */
.PartenaireAddPopup-logo-section {
  margin-bottom: 30px;
  text-align: center;
}

.PartenaireAddPopup-logo-upload {
  margin-top: 15px;
}

.PartenaireAddPopup-logo-preview {
  position: relative;
  display: inline-block;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.PartenaireAddPopup-logo-preview img {
  width: 120px;
  height: 120px;
  object-fit: cover;
  display: block;
}

.PartenaireAddPopup-logo-actions {
  position: absolute;
  top: 8px;
  right: 8px;
}

.PartenaireAddPopup-logo-remove {
  background: rgba(227, 6, 19, 0.9);
  border: none;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  color: white;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}

.PartenaireAddPopup-logo-remove:hover {
  background: #E30613;
  transform: scale(1.1);
}

.PartenaireAddPopup-logo-placeholder {
  width: 120px;
  height: 120px;
  border: 3px dashed #0F447E;
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  margin: 0 auto;
  background: linear-gradient(135deg, #f8f9ff 0%, #e8f0ff 100%);
  transition: all 0.3s ease;
  position: relative;
}

.PartenaireAddPopup-logo-placeholder:hover {
  border-color: #1a5490;
  background: linear-gradient(135deg, #e8f0ff 0%, #d0e2ff 100%);
  transform: scale(1.05);
}

.PartenaireAddPopup-placeholder-icon {
  font-size: 24px;
  color: #0F447E;
  margin-bottom: 8px;
}

.PartenaireAddPopup-upload-icon {
  font-size: 16px;
  color: #1a5490;
  margin-bottom: 5px;
}

.PartenaireAddPopup-upload-text {
  font-size: 12px;
  color: #0F447E;
  font-weight: 500;
  text-align: center;
}

.PartenaireAddPopup-file-input {
  display: none;
}

/* Lignes de formulaire - FIX PRINCIPAL POUR LA GRILLE */
.PartenaireAddPopup-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 20px;
  gap: 20px;
  margin-bottom: 25px;
  /* Assure que la grille reste stable même avec les erreurs */
  align-items: start;
}

/* Groupes de formulaire - FIX POUR MAINTENIR LA HAUTEUR */
.PartenaireAddPopup-form-group {
  display: flex;
  flex-direction: column;
  /* Assure que chaque groupe prend l'espace nécessaire */
  width: 100%;
}

.PartenaireAddPopup-label {
  font-size: 14px;
  font-weight: 500;
  color: #0F447E;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  /* Hauteur fixe pour le label */
  min-height: 20px;
}

.PartenaireAddPopup-required {
  color: #E30613;
  margin-left: 4px;
}

/* Champs de saisie - HAUTEUR FIXE POUR MAINTENIR LA COHÉRENCE */
.PartenaireAddPopup-input,
.PartenaireAddPopup-select {
  padding: 12px 16px;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  font-size: 14px;
  font-family: 'Poppins', sans-serif;
  transition: all 0.3s ease;
  background: white;
  /* Hauteur fixe pour maintenir la cohérence */
  height: 44px;
  /* Assure que le champ prend toute la largeur de son container */
  width: 100%;
  box-sizing: border-box;
}

.PartenaireAddPopup-input:focus,
.PartenaireAddPopup-select:focus {
  outline: none;
  border-color: #0F447E;
  box-shadow: 0 0 0 3px rgba(15, 68, 126, 0.1);
}

.PartenaireAddPopup-input.error,
.PartenaireAddPopup-select.error {
  border-color: #E30613;
  background-color: #fff5f5;
  box-shadow: 0 0 0 3px rgba(227, 6, 19, 0.08);
}

.PartenaireAddPopup-input.error:focus,
.PartenaireAddPopup-select.error:focus {
  border-color: #E30613;
  background-color: white;
  box-shadow: 0 0 0 3px rgba(227, 6, 19, 0.15);
}

.PartenaireAddPopup-select {
  cursor: pointer;
}

/* Container d'erreur - ESPACE RÉSERVÉ POUR LES ERREURS */
.PartenaireAddPopup-error-container {
  min-height: 24px;
  margin-top: 6px;
}

/* Messages d'erreur */
.PartenaireAddPopup-error {
  color: #E30613;
  font-size: 12px;
  font-weight: 500;
  display: flex;
  align-items: center;
  line-height: 1.2;
}

/* Espace réservé pour maintenir la hauteur */
.PartenaireAddPopup-error-space {
  height: 18px;
}

/* Pied du popup */
.PartenaireAddPopup-footer {
  padding: 25px 30px;
  background: #f8f9fa;
  display: flex;
  justify-content: flex-end;
  gap: 15px;
  border-top: 1px solid #e0e0e0;
}

/* Boutons */
.PartenaireAddPopup-cancel-btn,
.PartenaireAddPopup-submit-btn {
  padding: 12px 24px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.3s ease;
  border: none;
  font-family: 'Poppins', sans-serif;
  min-width: 120px;
}

.PartenaireAddPopup-cancel-btn {
  background: white;
  color: #666;
  border: 2px solid #e0e0e0;
}

.PartenaireAddPopup-cancel-btn:hover:not(:disabled) {
  background: #f8f9fa;
  border-color: #ccc;
}

.PartenaireAddPopup-submit-btn {
  background: linear-gradient(135deg, #0F447E 0%, #1a5490 100%);
  color: white;
  box-shadow: 0 4px 12px rgba(15, 68, 126, 0.3);
}

.PartenaireAddPopup-submit-btn:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(15, 68, 126, 0.4);
}

.PartenaireAddPopup-submit-btn:disabled,
.PartenaireAddPopup-cancel-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}

/* Responsive design pour popup */
@media (max-width: 768px) {
  .PartenaireAddPopup-overlay {
    padding: 10px;
    align-items: flex-start;
    padding-top: 20px;
  }

  .PartenaireAddPopup-container {
    max-width: 100%;
    max-height: 95vh;
    margin: 0;
  }

  .PartenaireAddPopup-header {
    padding: 20px;
  }

  .PartenaireAddPopup-title {
    font-size: 18px;
  }

  .PartenaireAddPopup-form {
    height: auto;
    max-height: calc(95vh - 80px);
  }

  .PartenaireAddPopup-form-content {
    padding: 20px;
  }

  .PartenaireAddPopup-form-row {
    grid-template-columns: 1fr;
    gap: 15px;
    margin-bottom: 20px;
  }

  .PartenaireAddPopup-logo-section {
    margin-bottom: 25px;
  }

  .PartenaireAddPopup-logo-preview img,
  .PartenaireAddPopup-logo-placeholder {
    width: 100px;
    height: 100px;
  }

  .PartenaireAddPopup-input,
  .PartenaireAddPopup-select {
    height: 40px;
  }

  .PartenaireAddPopup-error-container {
    min-height: 22px;
  }

  .PartenaireAddPopup-error-space {
    height: 16px;
  }

  .PartenaireAddPopup-footer {
    padding: 20px;
    flex-direction: column-reverse;
    gap: 12px;
  }

  .PartenaireAddPopup-cancel-btn,
  .PartenaireAddPopup-submit-btn {
    width: 100%;
    min-width: auto;
  }
}

@media (max-width: 480px) {
  .PartenaireAddPopup-overlay {
    padding: 5px;
    padding-top: 10px;
  }

  .PartenaireAddPopup-container {
    border-radius: 12px;
  }

  .PartenaireAddPopup-header {
    padding: 15px;
  }

  .PartenaireAddPopup-title {
    font-size: 16px;
  }

  .PartenaireAddPopup-close-btn {
    padding: 6px;
    font-size: 16px;
  }

  .PartenaireAddPopup-form-content {
    padding: 15px;
  }

  .PartenaireAddPopup-logo-section {
    margin-bottom: 20px;
  }

  .PartenaireAddPopup-logo-preview img,
  .PartenaireAddPopup-logo-placeholder {
    width: 80px;
    height: 80px;
  }

  .PartenaireAddPopup-placeholder-icon {
    font-size: 20px;
    margin-bottom: 6px;
  }

  .PartenaireAddPopup-upload-icon {
    font-size: 14px;
    margin-bottom: 4px;
  }

  .PartenaireAddPopup-upload-text {
    font-size: 10px;
  }

  .PartenaireAddPopup-form-row {
    gap: 12px;
    margin-bottom: 18px;
  }

  .PartenaireAddPopup-input,
  .PartenaireAddPopup-select {
    padding: 10px 12px;
    font-size: 13px;
    height: 38px;
  }

  .PartenaireAddPopup-label {
    font-size: 13px;
    margin-bottom: 6px;
    min-height: 18px;
  }

  .PartenaireAddPopup-error {
    font-size: 11px;
  }

  .PartenaireAddPopup-error-container {
    min-height: 20px;
  }

  .PartenaireAddPopup-error-space {
    height: 14px;
  }

  .PartenaireAddPopup-footer {
    padding: 15px;
    gap: 10px;
  }

  .PartenaireAddPopup-cancel-btn,
  .PartenaireAddPopup-submit-btn {
    padding: 10px 16px;
    font-size: 13px;
  }
}

/* Améliorations supplémentaires pour mobile */
@media (max-width: 375px) {
  .PartenaireAddPopup-overlay {
    padding: 0;
    align-items: stretch;
  }

  .PartenaireAddPopup-container {
    height: 100vh;
    max-height: 100vh;
    border-radius: 0;
  }

  .PartenaireAddPopup-form {
    max-height: calc(100vh - 70px);
  }

  .PartenaireAddPopup-logo-preview img,
  .PartenaireAddPopup-logo-placeholder {
    width: 70px;
    height: 70px;
  }

  .PartenaireAddPopup-placeholder-icon {
    font-size: 18px;
  }

  .PartenaireAddPopup-upload-icon {
    font-size: 12px;
  }

  .PartenaireAddPopup-upload-text {
    font-size: 9px;
  }
}

/* Mode paysage mobile */
@media (max-height: 500px) and (orientation: landscape) {
  .PartenaireAddPopup-overlay {
    align-items: flex-start;
    padding-top: 10px;
  }

  .PartenaireAddPopup-container {
    max-height: 95vh;
  }

  .PartenaireAddPopup-form {
    max-height: calc(95vh - 60px);
  }

  .PartenaireAddPopup-header {
    padding: 15px 20px;
  }

  .PartenaireAddPopup-form-content {
    padding: 15px 20px;
  }

  .PartenaireAddPopup-logo-section {
    margin-bottom: 15px;
  }

  .PartenaireAddPopup-form-row {
    margin-bottom: 15px;
  }

  .PartenaireAddPopup-footer {
    padding: 15px 20px;
  }

  .PartenaireAddPopup-error-container {
    min-height: 18px;
  }

  .PartenaireAddPopup-error-space {
    height: 12px;
  }
}

/* ===== NOTIFICATIONS DE SUCCÈS/ERREUR ===== */

/* Container de notification */
.notification-container {
  position: fixed;
  top: 20px;
  right: 20px;
  z-index: 2000;
  pointer-events: none;
}

/* Notification de base */
.notification {
  background: white;
  border-radius: 12px;
  padding: 16px 20px;
  margin-bottom: 12px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
  border: 1px solid transparent;
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  font-weight: 500;
  pointer-events: all;
  transform: translateX(100%);
  opacity: 0;
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  max-width: 400px;
  min-width: 300px;
}

/* Animation d'entrée */
.notification.show {
  transform: translateX(0);
  opacity: 1;
}

/* Animation de sortie */
.notification.hide {
  transform: translateX(100%);
  opacity: 0;
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
  max-height: 0;
}

/* Notification de succès */
.notification.success {
  border-left: 4px solid #10B981;
  background: linear-gradient(135deg, #ECFDF5 0%, #F0FDF4 100%);
  color: #065F46;
}

.notification.success .notification-icon {
  color: #10B981;
  font-size: 18px;
}

/* Notification d'erreur */
.notification.error {
  border-left: 4px solid #E30613;
  background: linear-gradient(135deg, #FEF2F2 0%, #FFF5F5 100%);
  color: #7F1D1D;
}

.notification.error .notification-icon {
  color: #E30613;
  font-size: 18px;
}

/* Contenu de la notification */
.notification-content {
  flex: 1 1;
}

.notification-title {
  font-weight: 600;
  margin: 0 0 4px 0;
  font-size: 14px;
}

.notification-message {
  margin: 0;
  font-weight: 400;
  font-size: 13px;
  opacity: 0.9;
}

/* Bouton de fermeture */
.notification-close {
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  transition: all 0.2s ease;
  color: inherit;
  opacity: 0.6;
  font-size: 14px;
}

.notification-close:hover {
  opacity: 1;
  background: rgba(0, 0, 0, 0.05);
}

/* Barre de progression (optionnelle) */
.notification-progress {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 3px;
  background: currentColor;
  border-radius: 0 0 12px 12px;
  opacity: 0.3;
  animation: progressBar 3s linear;
}

@keyframes progressBar {
  from {
    width: 100%;
  }
  to {
    width: 0%;
  }
}

/* Responsive pour les notifications */
@media (max-width: 768px) {
  .notification-container {
    top: 10px;
    right: 10px;
    left: 10px;
  }

  .notification {
    min-width: auto;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
  }
}

@media (max-width: 480px) {
  .notification-container {
    top: 5px;
    right: 5px;
    left: 5px;
  }

  .notification {
    padding: 12px 16px;
    font-size: 13px;
  }

  .notification-title {
    font-size: 13px;
  }

  .notification-message {
    font-size: 12px;
  }

  .notification-icon {
    font-size: 16px !important;
  }
}

/* ===== NOTIFICATIONS DE SUCCÈS/ERREUR ===== */

/* Container de notification */
.notification-container {
  position: fixed;
  top: 20px;
  right: 20px;
  z-index: 2000;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Notification de base */
.notification {
  background: white;
  border-radius: 12px;
  padding: 16px 20px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
  border: 1px solid transparent;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  font-weight: 500;
  pointer-events: all;
  transform: translateX(100%);
  opacity: 0;
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  max-width: 350px;
  min-width: 250px;
  position: relative;
  overflow: hidden;
}

/* Animation d'entrée */
.notification.show {
  transform: translateX(0);
  opacity: 1;
}

/* Animation de sortie */
.notification.hide {
  transform: translateX(100%);
  opacity: 0;
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
  max-height: 0;
}

/* Notification de succès */
.notification.success {
  border-left: 4px solid #10B981;
  background: linear-gradient(135deg, #ECFDF5 0%, #F0FDF4 100%);
  color: #065F46;
}

.notification.success .notification-icon {
  color: #10B981;
  font-size: 18px;
  flex-shrink: 0;
  margin-top: 2px;
}

/* Notification d'erreur */
.notification.error {
  border-left: 4px solid #E30613;
  background: linear-gradient(135deg, #FEF2F2 0%, #FFF5F5 100%);
  color: #7F1D1D;
}

.notification.error .notification-icon {
  color: #E30613;
  font-size: 18px;
  flex-shrink: 0;
  margin-top: 2px;
}

/* Contenu de la notification */
.notification-content {
  flex: 1 1;
}

.notification-title {
  font-weight: 600;
  margin: 0 0 4px 0;
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.notification-message {
  margin: 0;
  font-weight: 400;
  font-size: 13px;
  opacity: 0.9;
  line-height: 1.4;
}

/* Bouton de fermeture */
.notification-close {
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  transition: all 0.2s ease;
  color: inherit;
  opacity: 0.6;
  font-size: 14px;
  flex-shrink: 0;
  margin-top: 2px;
}

.notification-close:hover {
  opacity: 1;
  background: rgba(0, 0, 0, 0.05);
}

/* Barre de progression */
.notification-progress {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 3px;
  background: currentColor;
  border-radius: 0 0 12px 12px;
  opacity: 0.3;
  width: 100%;
  transform-origin: left;
  animation: progressBar 5s linear forwards;
}

@keyframes progressBar {
  from {
    transform: scaleX(1);
  }
  to {
    transform: scaleX(0);
  }
}

/* Responsive pour les notifications */
@media (max-width: 768px) {
  .notification-container {
    top: 10px;
    right: 10px;
    left: 10px;
    align-items: flex-end;
  }

  .notification {
    min-width: auto;
    max-width: 100%;
  }
}

@media (max-width: 480px) {
  .notification-container {
    top: 5px;
    right: 5px;
    left: 5px;
  }

  .notification {
    padding: 12px 16px;
    font-size: 13px;
    max-width: calc(100% - 10px);
  }

  .notification-title {
    font-size: 13px;
  }

  .notification-message {
    font-size: 12px;
  }

  .notification-icon {
    font-size: 16px !important;
  }
}
/* Style principal pour la page de gestion des paramètres du site */
.site-params-admin-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
  margin-top: 30px;
}

.page-content {
  flex: 1 1;
  margin-left: 250px;
  padding-top: 70px;
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Quand le sidebar est collapsé sur DESKTOP */
.site-params-admin-page.sidebar-collapsed .page-content {
  margin-left: 70px;
  width: calc(100% - 70px);
}

/* Conteneur pour le contenu du dashboard */
.dashboard-content {
  padding: 0 20px;
  box-sizing: border-box;
}

/* Conteneur pour la gestion des paramètres du site */
.site-params-container {
  padding: 20px 0;
  box-sizing: border-box;
}

/* ===============================================
   MOBILE VIEW - Le contenu prend toute la largeur
   =============================================== */
.site-params-admin-page.mobile-view .page-content {
  margin-left: 0 !important;
  width: 100% !important;
  padding-top: 80px;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 0 !important;
    width: 100% !important;
    padding-top: 80px;
  }
  
  .site-params-admin-page.sidebar-collapsed .page-content {
    margin-left: 0 !important;
    width: 100% !important;
  }
  
  .dashboard-content {
    padding: 0 15px;
  }
  
  .site-params-container {
    padding: 10px 0;
  }
}

@media (max-width: 480px) {
  .dashboard-content {
    padding: 0 10px;
  }
  
  .page-content {
    padding-top: 75px;
  }
  
  .site-params-container {
    padding: 5px 0;
  }
}

/* Styles spécifiques pour le formulaire de paramètres du site */
.staff-cash-form h2 {
  color: #0F223A;
  font-size: 1.6rem;
  font-weight: 600;
  margin-bottom: 1.5rem;
  text-align: center;
}

.staff-cash-form form {
  display: grid;
  grid-gap: 1.25rem;
  gap: 1.25rem;
}

.staff-cash-form label {
  display: block;
  font-weight: 500;
  color: #0F223A;
}

.staff-cash-form input,
.staff-cash-form select,
.staff-cash-form textarea {
  border: 1px solid #E6E9F0;
  border-radius: 8px;
  padding: 0.6rem 0.75rem;
  font-size: 0.95rem;
  width: 100%;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.staff-cash-form input:focus,
.staff-cash-form select:focus,
.staff-cash-form textarea:focus {
  outline: none;
  border-color: #134981;
  box-shadow: 0 0 0 2px rgba(19, 73, 129, 0.15);
}

/* Grille responsive pour les lignes à 2 colonnes */
.staff-cash-form .row-2 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  grid-gap: 1rem;
  gap: 1rem;
}

/* Checkbox inline */
.staff-cash-form .checkbox-inline {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.staff-cash-form .summary-box {
  border: 1px solid #E6E9F0;
  border-radius: 8px;
  background: #f9f9f9;
  padding: 0.75rem;
  font-size: 0.95rem;
  line-height: 1.4;
}

.staff-cash-form button {
  background-color: #e30613;
  color: #fff;
  font-weight: 600;
  border: none;
  border-radius: 10px;
  padding: 0.7rem 1.2rem;
  font-size: 1rem;
  cursor: pointer;
  transition: background-color 0.25s ease, transform 0.15s ease;
}

.staff-cash-form button:hover {
  background-color: #c10510;
  transform: translateY(-1px);
}

.staff-cash-form button:disabled {
  background-color: #999;
  cursor: not-allowed;
}

/* Messages succès/erreur */
.staff-cash-form .alert {
  padding: 0.75rem;
  border-radius: 8px;
  font-size: 0.9rem;
}

.staff-cash-form .alert.success {
  background: #e6f9ee;
  border: 1px solid #b6e2c1;
  color: #256029;
}

.staff-cash-form .alert.error {
  background: #fdeaea;
  border: 1px solid #f5c2c2;
  color: #a12626;
}

/* Responsive pour le formulaire */
@media (max-width: 640px) {
  .staff-cash-form {
    padding: 1rem;
  }
  
  .staff-cash-form .row-2 {
    grid-template-columns: 1fr;
  }
}
/* === CONTENEUR PRINCIPAL === */
.site-params-container-param {
  font-family: 'Poppins', sans-serif;
  max-width: 1024px;
  margin: 30px auto;
  color: #333;
  background-color: #fff;
  padding: 40px;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* === TITRE === */
.site-params-title {
  font-size: 1.75rem;
  font-weight: 600;
  color: #0f447e;
  color: var(--primary-blue, #0f447e);
  margin-bottom: 2rem;
  /* text-align: center; */
  text-align: left !important;
}

.site-params-title-highlight {
  color: #e30613;
  color: var(--primary-red, #e30613);
  font-weight: 700;
}

/* === FORMULAIRE === */
.site-params-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  grid-gap: 1.5rem;
  gap: 1.5rem;
  margin-bottom: 2rem;
}

/* === GROUPE DE CHAMP === */
.site-param-group {
  display: flex;
  flex-direction: column;
}

.site-param-label {
  color: #212529;
  color: var(--text-dark, #212529);
  font-weight: 600;
  margin-bottom: 0.5rem;
  font-size: 0.95rem;
}

.site-param-required {
  color: #e30613;
  color: var(--primary-red, #e30613);
  font-weight: 700;
}

/* === INPUTS GÉNÉRAUX === */
.site-param-input {
  width: 100%;
  height: 50px;
  min-height: 50px;
  padding: 0.75rem 1rem;
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray, #dee2e6);
  border-radius: 8px;
  font-size: 1rem;
  background: #fff;
  background: var(--white, #fff);
  box-sizing: border-box;
  transition: all 0.2s ease;
}

.site-param-input:focus {
  outline: none;
  border-color: #0f447e;
  border-color: var(--primary-blue, #0f447e);
  box-shadow: 0 0 0 3px rgba(15, 68, 126, 0.1);
}

/* === INPUTS NUMBER (comme EditingAppartement) === */
.site-param-input.site-param-number {
  text-align: center;
  -moz-appearance: textfield;
}

.site-param-input.site-param-number::-webkit-outer-spin-button,
.site-param-input.site-param-number::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* === PHONE INPUT (PhoneInput) === */
.site-param-phone-container {
  width: 100%;
}

.site-param-phone-input {
  width: 100% !important;
  height: 50px !important;
  min-height: 50px !important;
  padding: 0.75rem 1rem !important;
  border: 2px solid #dee2e6 !important;
  border: 2px solid var(--border-gray, #dee2e6) !important;
  border-radius: 8px !important;
  font-size: 1rem !important;
  background: #fff !important;
  background: var(--white, #fff) !important;
  box-shadow: none !important;
  transition: all 0.2s ease !important;
}

.site-param-phone-input:focus {
  border-color: #0f447e !important;
  border-color: var(--primary-blue, #0f447e) !important;
  box-shadow: 0 0 0 3px rgba(15, 68, 126, 0.1) !important;
}

/* === BOUTON === */
.site-params-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
  margin-top: 1rem;
}

.site-params-btn-save {
  background: #0f447e;
  background: var(--primary-blue, #0f447e);
  color: white;
  font-weight: 600;
  padding: 0.75rem 2rem;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  font-size: 1rem;
  transition: all 0.2s ease;
}

.site-params-btn-save:hover {
  background: #1a5a9e;
  background: var(--light-blue, #1a5a9e);
  transform: translateY(-1px);
}

/* === RESPONSIVE === */
@media (max-width: 768px) {
  .site-params-container-param {
    padding: 20px;
    margin: 15px auto;
  }

  .site-params-title {
    font-size: 1.5rem;
  }

  .site-params-form {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .site-params-container-param {
    padding: 16px;
    margin: 10px auto;
  }

  .site-params-title {
    font-size: 1.25rem;
  }
}

/* === TOAST NOTIFICATION (comme EditingAppartement) === */
.site-params-toast {
  position: fixed;
  bottom: 30px;
  right: 30px;
  background: #28a745;
  color: white;
  padding: 1rem 1.5rem;
  border-radius: 8px;
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  animation: slideInToast 0.4s ease-out;
  z-index: 1000;
  font-weight: 500;
  font-size: 0.95rem;
}

.toast-icon {
  background: rgba(255, 255, 255, 0.3);
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 0.8rem;
}

.toast-close {
  background: none;
  border: none;
  color: white;
  font-size: 1.4rem;
  cursor: pointer;
  margin-left: 10px;
  padding: 0;
  line-height: 1;
}

@keyframes slideInToast {
  from {
    transform: translateX(100%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

.site-param-input.disabled,
.site-param-phone-input.disabled {
  background-color: #f5f5f5;
  color: #999;
  cursor: not-allowed;
  border-color: #ddd;
}

.site-param-input[disabled],
.site-param-phone-input[disabled] {
  opacity: 0.7;
}

.site-params-actions {
  display: flex;
  flex-direction: column;
  align-items: center;        /* Centre horizontalement */
  justify-content: center;    /* (Optionnel) centre verticalement si besoin */
  gap: 12px;
  margin-top: 20px;
  width: 100%;                /* Prend toute la largeur pour centrer proprement */
}

.site-params-btn-save {
  /* Plus besoin de align-self, car align-items: center fait tout */
  padding: 10px 20px;
  font-size: 1rem;
  min-width: 220px;           /* Optionnel : largeur minimale pour cohérence */
}

.site-params-readonly-note {
  margin: 0;
  font-size: 0.9rem;
  color: #e74c3c;
  font-style: italic;
  text-align: center;         /* Texte centré */
}
/* Style principal pour la page d'édition d'appartement gérant */
.editing-appartement-gerant-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
}

.page-content {
  flex: 1 1;
  margin-left: 250px;
  padding-top: 70px;
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Largeur des blocs enfants UNIQUEMENT dans la page d'édition d'appartement */
.editing-appartement-gerant-page .page-content > * {
  max-width: 1200px;
  width: 100%;
  box-sizing: border-box;
  overflow-x: auto; /* Permet le défilement horizontal si nécessaire */
}

/* Quand le sidebar est collapsé */
.editing-appartement-gerant-page.sidebar-collapsed .page-content {
  margin-left: 70px; /* Largeur du sidebar collapsé */
  width: calc(100% - 70px);
}

/* Conteneur pour la liste d'appartements */
.list-container {
  padding: 20px;
  box-sizing: border-box;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 60px !important; /* Largeur du sidebar en mobile */
    width: calc(100% - 60px) !important;
  }
}

/* Style principal pour la page d'édition d'appartement gérant */
.editing-appartement-gerant-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
}

.page-content {
  flex: 1 1;
  margin-left: 250px;
  padding-top: 70px;
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
  overflow-y: auto; /* Changé de hidden à auto */
}

/* Largeur des blocs enfants UNIQUEMENT dans la page d'édition d'appartement */
.editing-appartement-gerant-page .page-content > * {
  max-width: 1200px;
  width: 100%;
  box-sizing: border-box;
  overflow: visible !important; /* Changé de auto à visible */
}

/* Quand le sidebar est collapsé */
.editing-appartement-gerant-page.sidebar-collapsed .page-content {
  margin-left: 70px; /* Largeur du sidebar collapsé */
  width: calc(100% - 70px);
}

/* Conteneur pour la liste d'appartements */
.list-container {
  padding: 20px;
  box-sizing: border-box;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 60px !important; /* Largeur du sidebar en mobile */
    width: calc(100% - 60px) !important;
  }
}


/* Style principal pour la page d'édition d'appartement gérant */
.editing-appartement-gerant-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
}

.page-content {
  flex: 1 1;
  margin-left: 250px;
  padding-top: 70px;
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
  overflow-y: auto;
}

/* Largeur des blocs enfants UNIQUEMENT dans la page d'édition d'appartement */
.editing-appartement-gerant-page .page-content > * {
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
  overflow: visible !important;
}

/* Limite la largeur du wrapper du composant */
.editing-appartement-gerant-page .EditingAppartementGerantComponent-wrapper {
  max-width: 800px;
  margin: 0 auto;
  padding: 20px;
}

/* Quand le sidebar est collapsé */
.editing-appartement-gerant-page.sidebar-collapsed .page-content {
  margin-left: 70px;
  width: calc(100% - 70px);
}

/* Conteneur pour la liste d'appartements */
.list-container {
  padding: 20px;
  box-sizing: border-box;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 60px !important;
    width: calc(100% - 60px) !important;
  }
  
  .editing-appartement-gerant-page .EditingAppartementGerantComponent-wrapper {
    max-width: 100%;
    padding: 10px;
  }
}
/* ================================
   EDITING APPARTEMENT GERANT COMPONENT
   Rouge: #e30613 | Bleu: #0f447e
   Responsive: Mobile First
   ================================ */
:root {
    --primary-red: #e30613;
    --primary-blue: #0f447e;
    --light-blue: #1a5a9e;
    --dark-blue: #0a2f5c;
    --light-gray: #f8f9fa;
    --medium-gray: #e9ecef;
    --border-gray: #dee2e6;
    --text-dark: #212529;
    --text-medium: #6c757d;
    --text-light: #adb5bd;
    --success-green: #28a745;
    --error-red: #dc3545;
    --white: #ffffff;
    --shadow-light: 0 2px 4px rgba(0, 0, 0, 0.1);
    --shadow-medium: 0 4px 8px rgba(0, 0, 0, 0.15);
    --shadow-strong: 0 8px 16px rgba(0, 0, 0, 0.2);
    --radius-small: 6px;
    --radius-medium: 8px;
    --radius-large: 12px;
    --transition-fast: 0.2s ease;
    --transition-medium: 0.3s ease;
}

/* Wrapper principal */
.EditingAppartementGerantComponent-wrapper {
    width: 100%;
    max-width: 10px;
    margin: 0 auto;
    padding: 20px;
    box-sizing: border-box;
}

/* Card principale */
.EditingAppartementGerantComponent-card {
    background: transparent;
    overflow: visible;
    width: 100%;
    border-radius: 12px;
    border-radius: var(--radius-large);
}

/* États : chargement / erreur */
.EditingAppartementGerantComponent-loading,
.EditingAppartementGerantComponent-error {
    text-align: center;
    padding: 2rem;
    background: #ffffff;
    background: var(--white);
    border-radius: 12px;
    border-radius: var(--radius-large);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
    box-shadow: var(--shadow-medium);
}

.EditingAppartementGerantComponent-loading-spinner {
    border: 4px solid rgba(0, 0, 0, 0.1);
    border-radius: 50%;
    border-top: 4px solid #0f447e;
    border-top: 4px solid var(--primary-blue);
    width: 40px;
    height: 40px;
    animation: spin 1s linear infinite;
    margin: 0 auto 1rem;
}

.EditingAppartementGerantComponent-loading p {
    color: #6c757d;
    color: var(--text-medium);
    font-size: 1rem;
}

.EditingAppartementGerantComponent-error h3 {
    color: #dc3545;
    color: var(--error-red);
    margin-bottom: 0.5rem;
}

.EditingAppartementGerantComponent-error p {
    color: #6c757d;
    color: var(--text-medium);
    margin-bottom: 1rem;
}

.EditingAppartementGerantComponent-retry-btn {
    background: #0f447e;
    background: var(--primary-blue);
    color: #ffffff;
    color: var(--white);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    border-radius: var(--radius-medium);
    cursor: pointer;
    font-weight: 600;
    margin-top: 1rem;
    transition: background 0.2s ease;
    transition: background var(--transition-fast);
}

.EditingAppartementGerantComponent-retry-btn:hover {
    background: #1a5a9e;
    background: var(--light-blue);
}

/* En-tête */
.EditingAppartementGerantComponent-header {
    background: #ffffff;
    background: var(--white);
    padding: 1.5rem 2rem;
    margin-bottom: 0;
    border-bottom: 1px solid #dee2e6;
    border-bottom: 1px solid var(--border-gray);
    border-radius: 12px 12px 0 0;
    border-radius: var(--radius-large) var(--radius-large) 0 0;
}

.EditingAppartementGerantComponent-back-btn {
    background: none;
    color: #0f447e;
    color: var(--primary-blue);
    border: none;
    padding: 0.5rem 0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
    font-weight: 500;
    transition: 0.2s ease;
    transition: var(--transition-fast);
}

.EditingAppartementGerantComponent-back-btn:hover {
    color: #1a5a9e;
    color: var(--light-blue);
}

.EditingAppartementGerantComponent-header h2 {
    font-size: 1.75rem;
    font-weight: 600;
    margin: 0;
    color: #212529;
    color: var(--text-dark);
}

.EditingAppartementGerantComponent-text-blue {
    color: #0f447e;
    color: var(--primary-blue);
    font-weight: 700;
}

.EditingAppartementGerantComponent-text-red {
    color: #e30613;
    color: var(--primary-red);
    font-weight: 700;
}

/* Body */
.EditingAppartementGerantComponent-body {
    padding: 2rem;
    width: 100%;
    box-sizing: border-box;
    position: relative;
    overflow: visible !important;
    background: #ffffff;
    background: var(--white);
    border-radius: 0 0 12px 12px;
    border-radius: 0 0 var(--radius-large) var(--radius-large);
}

.EditingAppartementGerantComponent-body h3 {
    margin-bottom: 1.5rem;
    font-size: 1.2rem;
    font-weight: 600;
    color: #212529;
    color: var(--text-dark);
}

/* Grille de formulaire */
.EditingAppartementGerantComponent-form-grid {
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 1.5rem;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
    max-width: 600px;
    position: relative;
    overflow: visible !important;
}

/* Groupe de champs */
.EditingAppartementGerantComponent-form-group {
    display: flex;
    flex-direction: column;
    margin-bottom: 0;
    position: relative;
    overflow: visible !important;
}

.EditingAppartementGerantComponent-form-group label {
    color: #212529;
    color: var(--text-dark);
    font-weight: 600;
    margin-bottom: 0.5rem;
    font-size: 0.95rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.EditingAppartementGerantComponent-required {
    color: #e30613;
    color: var(--primary-red);
    font-weight: 700;
}

.EditingAppartementGerantComponent-form-group input {
    padding: 0.75rem 1rem;
    border: 2px solid #dee2e6;
    border: 2px solid var(--border-gray);
    border-radius: 8px;
    border-radius: var(--radius-medium);
    font-size: 1rem;
    transition: 0.2s ease;
    transition: var(--transition-fast);
    background: #ffffff;
    background: var(--white);
    width: 100%;
    box-sizing: border-box;
    min-height: 50px;
}

.EditingAppartementGerantComponent-form-group input:focus {
    outline: none;
    border-color: #0f447e;
    border-color: var(--primary-blue);
    box-shadow: 0 0 0 3px rgba(15, 68, 126, 0.1);
}

.EditingAppartementGerantComponent-form-group input:disabled {
    background: #f8f9fa;
    background: var(--light-gray);
    cursor: not-allowed;
    opacity: 0.6;
}

/* Recherche */
.EditingAppartementGerantComponent-search-container {
    position: relative;
    width: 100%;
    overflow: visible !important;
    max-width: 600px;
}

.EditingAppartementGerantComponent-search-input {
    position: relative;
    width: 100%;
}

.EditingAppartementGerantComponent-search-input input {
    padding-right: 40px;
    padding-left: 1rem;
    text-overflow: ellipsis;
    min-height: 50px;
    border: 2px solid #dee2e6;
    border: 2px solid var(--border-gray);
    border-radius: 8px;
    border-radius: var(--radius-medium);
    width: 100%;
    max-width: 600px;
    box-sizing: border-box;
}

.EditingAppartementGerantComponent-search-icon {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    opacity: 0.6;
    color: #adb5bd;
    color: var(--text-light);
}

/* Dropdown */
.EditingAppartementGerantComponent-dropdown {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    max-height: 300px;
    overflow-y: auto;
    border: 1px solid #dee2e6;
    border: 1px solid var(--border-gray);
    border-radius: 8px;
    border-radius: var(--radius-medium);
    background: #ffffff;
    background: var(--white);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    box-shadow: var(--shadow-strong);
    z-index: 9999;
    margin-top: 0;
}

.EditingAppartementGerantComponent-dropdown::-webkit-scrollbar {
    width: 8px;
}

.EditingAppartementGerantComponent-dropdown::-webkit-scrollbar-track {
    background: #f8f9fa;
    background: var(--light-gray);
    border-radius: 4px;
}

.EditingAppartementGerantComponent-dropdown::-webkit-scrollbar-thumb {
    background: #adb5bd;
    background: var(--text-light);
    border-radius: 4px;
}

.EditingAppartementGerantComponent-dropdown::-webkit-scrollbar-thumb:hover {
    background: #6c757d;
    background: var(--text-medium);
}

.EditingAppartementGerantComponent-dropdown-item {
    padding: 12px 16px;
    cursor: pointer;
    transition: background 0.2s ease;
    transition: background var(--transition-fast);
    border-bottom: 1px solid #f8f9fa;
    border-bottom: 1px solid var(--light-gray);
}

.EditingAppartementGerantComponent-dropdown-item:last-child {
    border-bottom: none;
}

.EditingAppartementGerantComponent-dropdown-item:hover {
    background: #f8f9fa;
    background: var(--light-gray);
}

.EditingAppartementGerantComponent-no-results {
    text-align: center;
    color: #6c757d;
    color: var(--text-medium);
    cursor: default;
}

.EditingAppartementGerantComponent-partner-content {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.EditingAppartementGerantComponent-partner-name {
    font-weight: 600;
    color: #212529;
    color: var(--text-dark);
    font-size: 0.95rem;
}

.EditingAppartementGerantComponent-partner-email {
    font-size: 0.85rem;
    color: #6c757d;
    color: var(--text-medium);
}

.EditingAppartementGerantComponent-partner-role {
    font-size: 0.8rem;
    color: #0f447e;
    color: var(--primary-blue);
    font-weight: 500;
}

/* Actions */
.EditingAppartementGerantComponent-actions {
    display: flex;
    gap: 15px;
    justify-content: flex-start;
    padding: 1.5rem 0 0 0;
    border-top: 1px solid #dee2e6;
    border-top: 1px solid var(--border-gray);
    margin-top: 1.5rem;
}

.EditingAppartementGerantComponent-btn {
    padding: 14px 28px;
    border-radius: 8px;
    border-radius: var(--radius-medium);
    font-weight: 600;
    font-size: 15px;
    cursor: pointer;
    transition: all 0.2s ease;
    transition: all var(--transition-fast);
    border: none;
    min-width: 150px;
    white-space: nowrap;
}

.EditingAppartementGerantComponent-btn-secondary {
    background: #ffffff;
    background: var(--white);
    color: #0f447e;
    color: var(--primary-blue);
    border: 2px solid #0f447e;
    border: 2px solid var(--primary-blue);
}

/* .EditingAppartementGerantComponent-btn-secondary:hover {
    background: rgba(15, 68, 126, 0.1);
} */

.EditingAppartementGerantComponent-btn-primary {
    background: #0f447e;
    background: var(--primary-blue);
    color: #ffffff;
    color: var(--white);
    /* box-shadow: 0 4px 12px rgba(15, 68, 126, 0.3); */
}

/* .EditingAppartementGerantComponent-btn-primary:hover {
    background: var(--light-blue);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(15, 68, 126, 0.4);
} */

.EditingAppartementGerantComponent-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none !important;
}

/* Messages */
.EditingAppartementGerantComponent-message {
    padding: 0.75rem 1.5rem;
    margin: 0 0 1.5rem 0;
    border-radius: 8px;
    border-radius: var(--radius-medium);
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    animation: slideIn 0.3s ease;
    animation: slideIn var(--transition-medium);
}

.EditingAppartementGerantComponent-message-success {
    background-color: #d1fae5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}

.EditingAppartementGerantComponent-message-error {
    background-color: #fee2e2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

/* Animations */
@keyframes slideIn {
    from {
        transform: translateY(-10px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* ================================
   RESPONSIVE TABLET (1024px)
   ================================ */
@media (max-width: 1024px) {
    .EditingAppartementGerantComponent-wrapper {
        padding: 15px;
    }

    .EditingAppartementGerantComponent-header {
        padding: 1.25rem 1.5rem;
    }

    .EditingAppartementGerantComponent-body {
        padding: 1.5rem;
    }
}

/* ================================
   RESPONSIVE MOBILE (768px)
   ================================ */
@media (max-width: 768px) {
    .EditingAppartementGerantComponent-wrapper {
        padding: 10px;
    }

    .EditingAppartementGerantComponent-header {
        padding: 1rem 1.25rem;
        border-radius: 8px 8px 0 0;
        border-radius: var(--radius-medium) var(--radius-medium) 0 0;
    }

    .EditingAppartementGerantComponent-body {
        border-radius: 0 0 8px 8px;
        border-radius: 0 0 var(--radius-medium) var(--radius-medium);
        padding: 1.25rem;
    }

    .EditingAppartementGerantComponent-header h2 {
        font-size: 1.4rem;
    }

    .EditingAppartementGerantComponent-form-grid {
        gap: 1.25rem;
    }

    .EditingAppartementGerantComponent-actions {
        flex-direction: column;
        gap: 12px;
    }

    .EditingAppartementGerantComponent-btn {
        width: 100%;
        min-width: 100%;
    }

    .EditingAppartementGerantComponent-form-group input,
    .EditingAppartementGerantComponent-search-input input {
        min-height: 48px;
        font-size: 16px;
    }

    .EditingAppartementGerantComponent-dropdown {
        max-height: 250px;
    }

    .EditingAppartementGerantComponent-message {
        font-size: 13px;
        padding: 0.625rem 1rem;
    }
}

/* ================================
   RESPONSIVE SMALL MOBILE (480px)
   ================================ */
@media (max-width: 480px) {
    .EditingAppartementGerantComponent-wrapper {
        padding: 8px;
    }

    .EditingAppartementGerantComponent-header {
        padding: 0.875rem 1rem;
        border-radius: 6px 6px 0 0;
        border-radius: var(--radius-small) var(--radius-small) 0 0;
    }

    .EditingAppartementGerantComponent-body {
        border-radius: 0 0 6px 6px;
        border-radius: 0 0 var(--radius-small) var(--radius-small);
        padding: 1rem;
    }

    .EditingAppartementGerantComponent-header h2 {
        font-size: 1.2rem;
    }

    .EditingAppartementGerantComponent-form-grid {
        gap: 1rem;
    }

    .EditingAppartementGerantComponent-actions {
        padding: 1rem 0 0 0;
        gap: 10px;
    }

    .EditingAppartementGerantComponent-btn {
        padding: 12px 20px;
        font-size: 14px;
    }

    .EditingAppartementGerantComponent-form-group input,
    .EditingAppartementGerantComponent-search-input input {
        min-height: 46px;
        padding: 0.625rem 0.875rem;
        font-size: 16px;
    }

    .EditingAppartementGerantComponent-search-input input {
        padding-right: 36px;
    }

    .EditingAppartementGerantComponent-dropdown-item {
        padding: 10px 12px;
    }

    .EditingAppartementGerantComponent-partner-name {
        font-size: 0.9rem;
    }

    .EditingAppartementGerantComponent-partner-email {
        font-size: 0.8rem;
    }

    .EditingAppartementGerantComponent-partner-role {
        font-size: 0.75rem;
    }

    .EditingAppartementGerantComponent-back-btn {
        font-size: 0.9rem;
    }
}

/* ================================
   RESPONSIVE EXTRA SMALL (360px)
   ================================ */
@media (max-width: 360px) {
    .EditingAppartementGerantComponent-header h2 {
        font-size: 1.1rem;
    }

    .EditingAppartementGerantComponent-btn {
        padding: 10px 16px;
        font-size: 13px;
    }
}
/* Style principal pour la page du dashboard partenaire */
.dashboard-partenaire-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
  margin-top: 30px;
}

.page-content {
  flex: 1 1;
  margin-left: 250px; 
  padding-top: 70px; 
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Quand le sidebar est collapsé sur DESKTOP */
.dashboard-partenaire-page.sidebar-collapsed .page-content {
  margin-left: 70px;
  width: calc(100% - 70px);
}

/* Conteneur pour le contenu du dashboard */
.dashboard-content {
  padding: 0 20px;
  box-sizing: border-box;
}

/* ===============================================
   MOBILE VIEW - Le contenu prend toute la largeur
   =============================================== */
.dashboard-partenaire-page.mobile-view .page-content {
  margin-left: 0 !important;
  width: 100% !important;
  padding-top: 80px;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 0 !important;
    width: 100% !important;
    padding-top: 80px;
  }
  
  .dashboard-partenaire-page.sidebar-collapsed .page-content {
    margin-left: 0 !important;
    width: 100% !important;
  }
  
  .dashboard-content {
    padding: 0 15px;
  }
}

@media (max-width: 480px) {
  .dashboard-content {
    padding: 0 10px;
  }
  
  .page-content {
    padding-top: 75px;
  }
}
.partenaire-sidebar {
  width: 250px;
  height: 100vh;
  background-color: #0F447E;
  color: white;
  font-family: 'Poppins', sans-serif;
  display: flex;
  flex-direction: column;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 100;
  transition: width 0.3s ease;
  box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1);
  overflow-y: auto; 
  overflow-x: hidden; 
}

.partenaire-sidebar.collapsed {
  width: 70px;
}

.partenaire-sidebar__logo-container {
  padding: 12px 0;
  height: 85px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.partenaire-sidebar__logo {
  max-height: 70px;
  max-width: 80%;
  transition: opacity 0.3s ease;
}

.partenaire-sidebar.collapsed .partenaire-sidebar__logo {
  opacity: 0;
  display: none;
}

/* Garder le logo visible sur mobile même si collapsed */
@media (max-width: 768px) {
  .partenaire-sidebar.collapsed .partenaire-sidebar__logo {
    opacity: 1;
    display: block;
  }
}

.partenaire-sidebar__collapse-btn {
  position: absolute;
  top: 50px;
  right: -15px;
  width: 30px;
  height: 30px;
  background-color: #0F447E;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
  color: white;
  font-size: 14px;
  z-index: 110; 
  border: 1px solid rgba(255, 255, 255, 0.3);
  transition: transform 0.3s;
}

.partenaire-sidebar__collapse-btn:hover {
  transform: scale(1.1);
}

/* Bouton fermer sur mobile */
.partenaire-sidebar__close-btn {
  display: none;
  position: absolute;
  top: 15px;
  right: 15px;
  background: rgba(255, 255, 255, 0.2);
  border: none;
  color: white;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  z-index: 120;
  transition: background 0.2s ease;
}

.partenaire-sidebar__close-btn:hover {
  background: rgba(255, 255, 255, 0.3);
}

.partenaire-sidebar__close-btn:active {
  background: rgba(255, 255, 255, 0.25);
}

.partenaire-sidebar__nav {
  flex-grow: 1;
  overflow-y: auto;
  margin-top: 10px;
  padding-bottom: 20px; 
}

.partenaire-sidebar__menu {
  list-style: none;
  padding: 0;
  margin: 0;
}

.partenaire-sidebar__menu-item {
  margin: 5px 0;
  padding: 0 15px;
}

/* Style de base pour tous les liens du menu */
.partenaire-sidebar__menu-link {
  display: flex;
  align-items: center;
  padding: 12px 11px;
  color: rgb(255, 255, 255);
  text-decoration: none;
  border-left: 4px solid transparent;
  position: relative;
  transition: all 0.2s ease;
}

/* Style pour le tableau de bord */
.partenaire-sidebar__menu-link.dashboard {
  background-color: #E30613 !important;
  border-radius: 6px;
  color: #ffffff;
  font-weight: 500;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  border-left: 4px solid transparent !important;
  padding: 12px 11px !important;
}

.partenaire-sidebar__menu-link.dashboard.active {
  background-color: #E30613 !important;
  border-left: 4px solid transparent !important;
  padding: 12px 11px !important;
}

.partenaire-sidebar__menu-link.dashboard .partenaire-sidebar__icon {
  color: #ffffff;
}

/* Style pour les autres éléments du menu */
.partenaire-sidebar__menu-link.styled {
  border-radius: 6px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  border-left: 4px solid transparent;
  padding: 12px 11px !important;
}

.partenaire-sidebar__menu-link.styled.active {
  background-color: rgba(255, 255, 255, 0.1);
  color: #fcfcfc;
  font-weight: 500;
  border-radius: 6px;
  border-left: 4px solid #E30613;
  padding: 12px 11px !important;
}

.partenaire-sidebar__menu-link.styled.active .partenaire-sidebar__icon {
  color: #ffffff;
}

.partenaire-sidebar__icon {
  color: white;
  font-size: 18px;
  min-width: 24px;
  margin-right: 12px;
  transition: color 0.2s;
}

.partenaire-sidebar__menu-text {
  font-size: 14px;
  font-weight: 400;
  white-space: nowrap;
  opacity: 1;
  transition: opacity 0.2s;
}

.partenaire-sidebar.collapsed .partenaire-sidebar__menu-text {
  opacity: 0;
  width: 0;
  display: none;
}

.partenaire-sidebar.collapsed .partenaire-sidebar__menu-link {
  justify-content: center;
  padding: 15px 0;
}

.partenaire-sidebar.collapsed .partenaire-sidebar__icon {
  margin-right: 0;
  font-size: 20px;
}

.partenaire-sidebar__footer {
  padding: 15px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.partenaire-sidebar__logout-btn {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 12px 15px;
  background-color: rgba(255, 255, 255, 0.9);
  border: none;
  border-radius: 6px;
  color: #0F447E;
  cursor: pointer;
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  font-weight: 500;
  transition: all 0.2s;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.partenaire-sidebar__logout-btn .partenaire-sidebar__icon {
  color: #0F447E;
}

.partenaire-sidebar.collapsed .partenaire-sidebar__logout-btn {
  justify-content: center;
  padding: 12px 0;
}

.partenaire-sidebar.collapsed .partenaire-sidebar__logout-btn .partenaire-sidebar__menu-text {
  display: none;
}

/* Scrollbar styling */
.partenaire-sidebar__nav::-webkit-scrollbar {
  width: 5px;
}

.partenaire-sidebar__nav::-webkit-scrollbar-track {
  background: transparent;
}

.partenaire-sidebar__nav::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.2);
  border-radius: 10px;
}

/* Overlay pour mobile */
.partenaire-sidebar__overlay {
  display: none;
}

/* ============================================
   MEDIA QUERY MOBILE - DESIGN ÉPURÉ
   ============================================ */
@media (max-width: 768px) {
  .partenaire-sidebar {
    width: 250px;
    min-width: 250px;
    max-width: 250px;
    left: -100%;
    transition: left 0.3s ease;
    z-index: 1000;
    box-shadow: 8px 0 30px rgba(0, 0, 0, 0.4);
    background: #0F447E;
    overflow-x: hidden;
    overflow-y: auto;
  }
  
  .partenaire-sidebar.mobile-open {
    left: 0;
  }
  
  .partenaire-sidebar__overlay {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 999;
  }
  
  .partenaire-sidebar__close-btn {
    display: flex;
  }
  
  .partenaire-sidebar__collapse-btn {
    display: none;
  }
  
  .partenaire-sidebar__logo-container {
    display: flex;
    padding: 25px 20px;
    height: auto;
    min-height: 90px;
    border-bottom: none;
  }
  
  .partenaire-sidebar__logo {
    max-height: 65px;
    max-width: 75%;
  }
  
  .partenaire-sidebar__nav {
    margin-top: 15px;
    padding: 0 12px 20px;
    overflow-y: auto;
    overflow-x: hidden;
  }
  
  .partenaire-sidebar__menu-item {
    margin: 10px 0;
    padding: 0;
  }
  
  .partenaire-sidebar__menu-link {
    padding: 16px 14px !important;
    border-radius: 8px;
    transition: none;
    border-left: 4px solid transparent !important;
    display: flex;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
  }
  
  .partenaire-sidebar__menu-text {
    display: block !important;
    opacity: 1 !important;
    width: auto !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
    line-height: 1.4;
    flex: 1 1;
  }
  
  .partenaire-sidebar__icon {
    margin-right: 16px !important;
    font-size: 20px !important;
    flex-shrink: 0;
    min-width: 20px;
  }
  
  .partenaire-sidebar__menu-link.dashboard {
    background: #E30613 !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
    border-left: 4px solid transparent !important;
    padding: 16px 14px !important;
  }
  
  .partenaire-sidebar__menu-link.dashboard.active {
    background: #E30613 !important;
    border-left: 4px solid transparent !important;
    padding: 16px 14px !important;
  }
  
  .partenaire-sidebar__menu-link.styled {
    background: transparent;
    box-shadow: none;
    border-left: 4px solid transparent !important;
    padding: 16px 14px !important;
  }
  
  .partenaire-sidebar__menu-link.styled.active {
    background: rgba(255, 255, 255, 0.12) !important;
    border-left: 4px solid #E30613 !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
    padding: 16px 14px !important;
  }
  
  .partenaire-sidebar__footer {
    padding: 16px 12px;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    margin-top: auto;
  }
  
  .partenaire-sidebar__logout-btn {
    padding: 14px 18px !important;
    border-radius: 8px;
    font-size: 15px !important;
    font-weight: 500 !important;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
    transition: background 0.2s ease;
    display: flex;
    align-items: center;
    width: 100%;
  }
  
  .partenaire-sidebar__logout-btn:hover {
    background: rgba(255, 255, 255, 1);
  }
  
  .partenaire-sidebar__logout-btn .partenaire-sidebar__menu-text {
    display: block !important;
    font-size: 15px !important;
    white-space: nowrap !important;
  }
  
  .partenaire-sidebar__logout-btn .partenaire-sidebar__icon {
    font-size: 18px !important;
    margin-right: 14px !important;
  }
}

@media (max-width: 380px) {
  .partenaire-sidebar {
    width: 85vw;
    min-width: 260px;
  }
  
  .partenaire-sidebar__menu-text {
    font-size: 15px !important;
  }
  
  .partenaire-sidebar__icon {
    font-size: 19px !important;
  }
  
  .partenaire-sidebar__menu-link {
    padding: 13px 14px;
  }
}
.HeaderPartenaire-header {
  position: fixed; 
  top: 0;
  left: 250px; 
  right: 0; 
  z-index: 50; 
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  background-color: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  font-family: 'Poppins', sans-serif;
  transition: left 0.3s ease;
}

.HeaderPartenaire-header.HeaderPartenaire-sidebar-collapsed {
  left: 70px;
}

/* Burger Menu Button - MODERNE ET STYLÉ */
.HeaderPartenaire-burger-btn {
  display: none;
  position: relative;
  width: 46px;
  height: 46px;
  border: none;
  background: transparent;
  border-radius: 12px;
  cursor: pointer;
  padding: 0;
  overflow: hidden;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.HeaderPartenaire-burger-btn::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0) 100%);
  opacity: 0;
  transition: opacity 0.3s;
}

.HeaderPartenaire-burger-btn::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  background: rgba(255, 255, 255, 0.3);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  /* transition: width 0.4s, height 0.4s; */
}

/* .HeaderPartenaire-burger-btn:hover {
  transform: translateY(-3px) scale(1.05);
  box-shadow: 0 6px 20px rgba(15, 68, 126, 0.4);
} */

.HeaderPartenaire-burger-btn:hover::before {
  opacity: 1;
}

.HeaderPartenaire-burger-btn:active {
  /* transform: translateY(0) scale(0.95); */
  box-shadow: 0 2px 8px rgba(15, 68, 126, 0.3);
}

.HeaderPartenaire-burger-btn:active::after {
  width: 120%;
  height: 120%;
}

/* Style de l'icône Menu dans le burger */
.HeaderPartenaire-burger-btn svg {
  position: relative;
  z-index: 1;
  color: #0F447E;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.HeaderPartenaire-burger-btn:hover svg {
  /* transform: scale(1.15) rotate(5deg); */
}

.HeaderPartenaire-burger-btn:active svg {
  transform: scale(0.9);
}

.HeaderPartenaire-search-container {
  flex: 1 1;
  max-width: 600px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.HeaderPartenaire-search-input-wrapper {
  position: relative;
  width: 100%;
}

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

.HeaderPartenaire-filter-btn {
  background: none;
  border: none;
  color: #555;
  font-size: 18px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.HeaderPartenaire-search-input {
  width: 100%;
  padding: 10px 15px 10px 40px;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  background-color: #f9f9f9;
}

.HeaderPartenaire-search-input:focus {
  outline: none;
  border-color: #0F447E;
  background-color: #fff;
}

.HeaderPartenaire-header-right {
  display: flex;
  align-items: center;
  gap: 15px;
}

.HeaderPartenaire-notification-icon {
  position: relative;
  font-size: 18px;
  color: #555;
  cursor: pointer;
}

.HeaderPartenaire-notification-badge {
  position: absolute;
  top: -8px;
  right: -8px;
  background-color: #e74a3b;
  color: white;
  font-size: 10px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
}

.HeaderPartenaire-user-profile {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}

.HeaderPartenaire-user-info {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.HeaderPartenaire-welcome-text {
  font-size: 12px;
  color: #777;
}

.HeaderPartenaire-user-role {
  font-size: 14px;
  font-weight: 600;
  color: #0F447E;
}

.HeaderPartenaire-user-avatar {
  width: 36px;
  height: 36px;
  background-color: #0F447E;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
}

.HeaderPartenaire-user-icon {
  font-size: 16px;
}

/* Dropdown Profil */
.HeaderPartenaire-dropdown {
  position: absolute;
  top: 110%;
  right: 0;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  margin-top: 8px;
  min-width: 160px;
  box-shadow: 0px 4px 8px rgba(0,0,0,0.1);
  z-index: 100;
}

.HeaderPartenaire-dropdown-item {
  width: 100%;
  padding: 10px 14px;
  display: flex;
  align-items: center;
  gap: 8px;
  background: none;
  border: none;
  cursor: pointer;
  font-size: 14px;
  color: #374151;
  text-align: left;
  font-family: 'Poppins', sans-serif;
}

.HeaderPartenaire-dropdown-item:hover {
  background-color: #f3f4f6;
}

.HeaderPartenaire-dropdown-icon {
  font-size: 16px;
  color: #6b7280;
}

/* Tablette */
@media (max-width: 992px) {
  .HeaderPartenaire-search-container {
    max-width: 300px;
  }
}

/* Mobile - LE HEADER PREND TOUTE LA LARGEUR */
@media (max-width: 768px) {
  .HeaderPartenaire-header {
    left: 0 !important; /* Plus de marge pour la sidebar */
    padding: 0 15px;
  }
  
  /* Afficher le burger menu */
  .HeaderPartenaire-burger-btn {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .HeaderPartenaire-search-container {
    max-width: 200px;
  }
  
  .HeaderPartenaire-user-info {
    display: none;
  }
}

/* Très petit écran */
@media (max-width: 576px) {
  .HeaderPartenaire-search-container {
    max-width: 150px;
  }
  
  .HeaderPartenaire-header {
    padding: 0 10px;
  }
}



/* Styles de base pour le conteneur principal */
.PartenaireStatsVue-container {
  width: 100%;
    max-width: 1920px;
  padding: 10px;
  box-sizing: border-box;

}


.password-input.dashboard-nip-error {
  border-color: #e30613;
}

/* Grille pour les cartes de statistiques */
.PartenaireStatsVue-stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  grid-gap: 12px;
  gap: 12px;
  max-width: 1920px;
  margin: 0 auto;
}

/* Style pour chaque carte de statistique */
.PartenaireStatsVue-stat-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: white;
  border-radius: 10px;
  padding: 16px 20px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
  border: 1px solid #f0f0f0;
  position: relative;
  overflow: hidden;
  transition: all 0.3s ease;
  height: 100%;
  min-height: 90px;
}

/* Effet au survol modifié pour être plus accessible sur mobile */
@media (hover: hover) {
  .PartenaireStatsVue-stat-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
  }
}

/* Bordure bleue en haut des cartes */
.PartenaireStatsVue-stat-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: #1e40af;
}

/* Animation au survol des cartes */

/* Contenu principal de la carte */
.PartenaireStatsVue-stat-content {
  flex: 1 1;
  display: flex;
  flex-direction: column;
}

/* En-tête de la carte avec titre et icône de visibilité */
.PartenaireStatsVue-stat-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

/* Style pour le titre des statistiques */
.PartenaireStatsVue-stat-title {
  font-size: 14px;
  font-weight: 500;
  color: #64748b;
  margin: 0;
}

/* Style pour la valeur principale */
.PartenaireStatsVue-stat-value {
  font-size: 24px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 10px;
}

/* Style pour la variation (positive ou négative) */
.PartenaireStatsVue-stat-variation {
  display: flex;
  align-items: center;
  font-size: 12px;
  font-weight: 500;
}

/* Variation positive (rouge) */
.PartenaireStatsVue-positive {
  color: #ef4444;
}

/* Variation positive - flèche vers le haut */
.PartenaireStatsVue-positive::before {
  content: '↑';
  display: inline-block;
  margin-right: 2px;
}

/* Variation négative (rouge) */
.PartenaireStatsVue-negative {
  color: #ef4444;
}

/* Variation négative - flèche vers le bas */
.PartenaireStatsVue-negative::before {
  content: '↓';
  display: inline-block;
  margin-right: 2px;
}

/* Container pour les icônes */
.PartenaireStatsVue-icon-container {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 6px;
  background-color: #f7fafc;
  color: #94a3b8;
  margin-left: 10px;
}

/* Styles pour l'icône */
.PartenaireStatsVue-icon {
  color: #94a3b8;
}

/* Bouton de visibilité (œil) */
.PartenaireStatsVue-visibility-toggle {
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  color: #94a3b8;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  transition: all 0.2s;
}

.PartenaireStatsVue-visibility-toggle:hover {
  background-color: #f1f5f9;
  color: #1e293b;
}

/* Styles pour la réactivité */
@media (max-width: 1200px) {
  .PartenaireStatsVue-stats-grid {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 12px;
    padding: 0 8px;
  }
}

@media (max-width: 768px) {
  .PartenaireStatsVue-container {
    padding: 8px;
  }
  
  .PartenaireStatsVue-stats-grid {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 10px;
  }
  
  .PartenaireStatsVue-stat-card {
    padding: 14px 16px;
  }
  
  .PartenaireStatsVue-stat-value {
    font-size: 22px;
    margin-bottom: 8px;
  }
  
  .PartenaireStatsVue-icon-container {
    width: 36px;
    height: 36px;
  }
}

@media (max-width: 480px) {
  .PartenaireStatsVue-stats-grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  
  .PartenaireStatsVue-stat-card {
    padding: 12px 14px;
  }
  
  .PartenaireStatsVue-stat-title {
    font-size: 13px;
  }
  
  .PartenaireStatsVue-stat-value {
    font-size: 20px;
    margin-bottom: 6px;
  }
  
  .PartenaireStatsVue-stat-variation {
    font-size: 11px;
  }
  
  .PartenaireStatsVue-icon-container {
    width: 32px;
    height: 32px;
  }
}
/* Styles pour le conteneur principal */
.DashboardSummary-container {
  padding: 20px;
  width: 100%;
    max-width: 1920px;
    box-sizing: border-box;
}

/* Grille pour les cartes de statistiques */
.DashboardSummary-grid {
 display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  grid-gap: 12px;
  gap: 12px;
  max-width: 1920px;
  margin: 0 auto;
}

/* Style pour chaque carte */
.DashboardSummary-card {
  background: white;
  border-radius: 10px;
  padding: 20px;
  display: flex;
  align-items: flex-start;
  gap: 15px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  position: relative;
  overflow: hidden;
}

/* Container pour les icônes */
.DashboardSummary-icon-container {
  padding: 12px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Style pour l'icône */
.DashboardSummary-icon {
  color: #1e293b;
}

/* Container pour le contenu textuel */
.DashboardSummary-content {
  flex: 1 1;
}

/* Style pour la valeur principale */
.DashboardSummary-value {
  font-size: 24px;
  font-weight: 600;
  color: #0F447E;
  margin-bottom: 4px;
}

/* Style pour le titre */
.DashboardSummary-title {
  font-size: 14px;
  color: #64748b;
}

.DashboardSummary-recent-items {
  margin-top: 15px;
  border-top: 1px solid #e2e8f0;
  padding-top: 15px;
}

.DashboardSummary-recent-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
}

.DashboardSummary-recent-item:not(:last-child) {
  border-bottom: 1px solid #f1f5f9;
}

.DashboardSummary-recent-image {
  width: 40px;
  height: 40px;
  border-radius: 6px;
  object-fit: cover;
}

.DashboardSummary-recent-info {
  flex: 1 1;
}

.DashboardSummary-recent-name {
  font-size: 13px;
  font-weight: 500;
  color: #0F447E;
  margin-bottom: 2px;
}

.DashboardSummary-recent-price {
  font-size: 12px;
  color: #64748b;
}

/* Styles pour la réactivité */
@media (max-width: 1200px) {
  .DashboardSummary-grid {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 14px;
  }
  
  .DashboardSummary-card {
    padding: 16px;
  }
  
  .DashboardSummary-icon-container {
    width: 44px;
    height: 44px;
    margin-right: 16px;
  }
  
  .DashboardSummary-value {
    font-size: 24px;
  }
}

@media (max-width: 768px) {
  .DashboardSummary-grid {
    grid-template-columns: 1fr;
  }
  
  .DashboardSummary-card {
    padding: 15px;
  }
  
  .DashboardSummary-icon-container {
    width: 40px;
    height: 40px;
    margin-right: 14px;
  }
  
  .DashboardSummary-value {
    font-size: 20px;
  }
  
  .DashboardSummary-title {
    font-size: 12px;
  }
}

@media (max-width: 480px) {
  .DashboardSummary-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  
  .DashboardSummary-card {
    padding: 12px;
  }
  
  .DashboardSummary-icon-container {
    width: 36px;
    height: 36px;
    margin-right: 12px;
  }
  
  .DashboardSummary-value {
    font-size: 20px;
  }
  
  .DashboardSummary-title {
    font-size: 12px;
  }
}
.Partenaire-accommodations-container {
  padding: 20px;
  width: 100%;
    max-width: 1920px;
}

.Partenaire-accommodations-grid {
 display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  grid-gap: 12px;
  gap: 12px;
  max-width: 1920px;
  margin: 0 auto;
}

.Partenaire-accommodations-grid.single-column {
  grid-template-columns: 1fr;
}

.Partenaire-appartements-column,
.Partenaire-hotels-column {
  width: 100%;
}

/* Styles responsifs */
@media (max-width: 992px) {
  .Partenaire-accommodations-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  
  .Partenaire-accommodations-grid.single-column {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .Partenaire-accommodations-container {
    padding: 15px;
  }
}

@media (max-width: 576px) {
  .Partenaire-accommodations-container {
    padding: 10px;
  }
}
.PartenaireAppartementSection-container {
  background-color: #fff;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  height: 100%;
}

.PartenaireAppartementSection-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 1px solid #e9ecef;
}

.PartenaireAppartementSection-header h2 {
  font-size: 20px;
  font-weight: 600;
  color: #0a3d62;
  margin: 0;
}

.PartenaireAppartementSection-list {
  margin-bottom: 20px;
}

.PartenaireAppartementSection-card {
  margin-bottom: 15px;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
}

.PartenaireAppartementSection-card-image {
  height: 160px;
  overflow: hidden;
}

.PartenaireAppartementSection-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.PartenaireAppartementSection-card-content {
  padding: 12px;
}

.PartenaireAppartementSection-card-content h3 {
  margin: 0 0 8px 0;
  font-size: 16px;
  font-weight: 600;
}

.PartenaireAppartementSection-location {
  color: #6c757d;
  font-size: 14px;
  margin-bottom: 8px;
}

.PartenaireAppartementSection-location i {
  margin-right: 5px;
}

.PartenaireAppartementSection-stats {
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  color: #E30613;
}

.PartenaireAppartementSection-stats span {
  display: flex;
  align-items: center;
}

.PartenaireAppartementSection-stats i {
  margin-right: 5px;
}

.PartenaireAppartementSection-view-all {
  display: flex;
  justify-content: center;
}

.PartenaireAppartementSection-view-all-button {
  background-color: transparent;
  color: #0a4b8c;
  border: 1px solid #0a4b8c;
  border-radius: 6px;
  padding: 8px 20px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

/* .PartenaireAppartementSection-view-all-button:hover {
  background-color: rgba(10, 75, 140, 0.1);
} */

.PartenaireAppartementSection-empty {
  padding: 30px 20px;
  text-align: center;
  background-color: #f8f9fa;
  border-radius: 8px;
  color: #6c757d;
}

@media (max-width: 992px) {
  .PartenaireAppartementSection-container {
    margin-bottom: 20px;
  }
}

@media (max-width: 576px) {
  .PartenaireAppartementSection-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .PartenaireAppartementSection-card-image {
    height: 140px;
  }
}
/* Style principal pour la page de profil partenaire */
.mon-profil-partenaire-page {
    min-height: 100vh;
    display: flex;
    width: 100%;
    background-color: #f5f7f9;
    margin-top: 30px;
}

.page-content {
    flex: 1 1;
    margin-left: 250px;
    padding-top: 70px;
    transition: margin-left 0.3s ease;
    width: calc(100% - 250px);
    box-sizing: border-box;
    overflow-x: hidden;

}

/* Quand le sidebar est collapsé sur DESKTOP */
.mon-profil-partenaire-page.sidebar-collapsed .page-content {
    margin-left: 70px;
    width: calc(100% - 70px);
}

/* Conteneur pour le contenu du dashboard */
.dashboard-content {
    padding: 0 20px;
    box-sizing: border-box;
}

/* ===============================================
   MOBILE VIEW - Le contenu prend toute la largeur
   =============================================== */
.mon-profil-partenaire-page.mobile-view .page-content {
    margin-left: 0 !important;
    width: 100% !important;
    padding-top: 80px;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
    .page-content {
        margin-left: 0 !important;
        width: 100% !important;
        padding-top: 80px;
    }

    .mon-profil-partenaire-page.sidebar-collapsed .page-content {
        margin-left: 0 !important;
        width: 100% !important;
    }

    .dashboard-content {
        padding: 0 15px;
    }
}

@media (max-width: 480px) {
    .dashboard-content {
        padding: 0 10px;
    }

    .page-content {
        padding-top: 75px;
    }
}

/* Styles spécifiques pour le composant ProfileCard */
.dashboard-content .profile-card-container {
    margin: 0;
    padding: 0;
}

/* Assurer que le ProfileCard s'adapte correctement */
.dashboard-content > *:first-child {
    margin-top: 0 !important;
}

/* Éliminer les marges excessives */
.dashboard-content > * {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;

}
/* Style principal pour la page des appartements partenaire */
.partenaire-appartement-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
}

.page-content {
  flex: 1 1;
  margin-left: 250px; 
  padding-top: 70px; 
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Quand le sidebar est collapsé sur DESKTOP */
.partenaire-appartement-page.sidebar-collapsed .page-content {
  margin-left: 70px;
  width: calc(100% - 70px);
}

/* Conteneur pour le contenu principal */
.dashboard-content {
  padding: 0 20px;
  box-sizing: border-box;
}

/* ===============================================
   MOBILE VIEW - Le contenu prend toute la largeur
   =============================================== */
.partenaire-appartement-page.mobile-view .page-content {
  margin-left: 0 !important;
  width: 100% !important;
  padding-top: 80px;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 0 !important;
    width: 100% !important;
    padding-top: 80px;
  }
  
  .partenaire-appartement-page.sidebar-collapsed .page-content {
    margin-left: 0 !important;
    width: 100% !important;
  }
  
  .dashboard-content {
    padding: 0 15px;
  }
}

@media (max-width: 480px) {
  .dashboard-content {
    padding: 0 10px;
  }
  
  .page-content {
    padding-top: 75px;
  }
}
:root {
  --sidebar-w: 280px;           /* largeur sidebar ouverte */
  --sidebar-w-collapsed: 20px;  /* largeur sidebar réduite */
}
/* Container principal */
.Partenaire-appartements-main-container {
  font-family: 'Poppins', sans-serif;
  padding: 20px;
    width: 100%;
  max-width: 1920px;
  margin: 0 auto;
}

/* Titre principal */
.Partenaire-appartements-title {
  font-size: 24px;
  font-weight: 600;
  color: #0F447E;
  margin-bottom: 20px;
  white-space: nowrap; /* Empêche le texte de se casser sur plusieurs lignes */
}

.Partenaire-appartements-title-highlight {
  color: #e63946;
}

/* Container de la liste */
.Partenaire-appartements-container {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  padding: 0;
  margin-top: 10px;
  overflow: hidden;
}

/* En-tête de la liste */
.Partenaire-appartements-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid #f0f0f0;
}

.Partenaire-appartements-section-title {
  font-size: 16px;
  font-weight: 600;
  color: #333;
  margin: 0;
}

/* Bouton d'ajout */
.Partenaire-appartements-add-btn {
  background-color: #0F447E;
  color: white;
  border: none;
  border-radius: 5px;
  padding: 8px 14px; /* Légèrement réduit */
  font-size: 13px; /* Légèrement réduit */
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
}

.Partenaire-appartements-add-btn:hover {
  background-color: #0F447E;
}

.Partenaire-appartements-plus-icon {
  margin-right: 5px;
  font-size: 16px;
  font-weight: bold;
}

/* Tableau avec barre de défilement */
.Partenaire-appartements-table-container {
  overflow-x: auto;
  max-height: 500px;
  overflow-y: auto;
  position: relative;
}

/* Indicateur de défilement horizontal pour mobile */
.Partenaire-appartements-table-container::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 60px;
  height: 20px;
  background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.8));
  pointer-events: none;
  animation: fadeInOut 1.5s infinite alternate;
  display: none;
}

@keyframes fadeInOut {
  from { opacity: 0.4; }
  to { opacity: 1; }
}

.Partenaire-appartements-table {
  width: 100%;
  border-collapse: collapse;
}

.Partenaire-appartements-table th,
.Partenaire-appartements-table td {
  padding: 15px;
  text-align: left;
  border-bottom: 1px solid #f0f0f0;
  font-size: 14px;
}

.Partenaire-appartements-table th {
  font-weight: 500;
  color: #0F447E;
  background-color: #fafafa;
  position: -webkit-sticky;
  position: sticky; /* Garde les en-têtes visibles lors du défilement */
  top: 0;
  z-index: 1;
}

.Partenaire-appartements-table tr:hover {
  background-color: #f9f9f9;
}

/* Cellule d'image */
.Partenaire-appartements-image-cell {
  width: 80px;
}

.Partenaire-appartements-appt-thumbnail {
  width: 60px;
  height: 60px;
  object-fit: cover;
  border-radius: 4px;
}

/* Options - Style badge */
.Partenaire-appartements-options-cell {
  min-width: 140px;
}

.Partenaire-appartements-options-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.Partenaire-appartements-badge {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
  background-color: #f0f4f9; /* Couleur de fond gris clair comme sur l'image */
  color: #666768;
}

.Partenaire-appartements-badge.active {
  background-color: #f0f4f9; /* Même couleur que les badges normaux */
  color: #666768;
}

/* Liens */
.Partenaire-appartements-links-cell {
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.Partenaire-appartements-link {
  color: #0F447E;
  text-decoration: none;
  font-size: 13px;
  transition: color 0.3s;
}

.Partenaire-appartements-link:hover {
  color: #e30613;
  text-decoration: underline;
}

/* Actions */
.Partenaire-appartements-actions-cell {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
}

.Partenaire-appartements-action-btn {
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  width: 30px;
  height: 30px;
  border-radius: 4px;
}

.Partenaire-appartements-view-btn {
  color: #4CAF50;
  background-color: #e8f5e9;
}

.Partenaire-appartements-edit-btn {
  color: #0F447E;
  background-color: #e9f5fb;
}

.Partenaire-appartements-delete-btn {
  color: #e30613;
  background-color: #ffebee;
}

/* Toggle Switch */
.Partenaire-appartements-toggle-container {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 22px;
}

.Partenaire-appartements-toggle-input {
  opacity: 0;
  width: 0;
  height: 0;
}

.Partenaire-appartements-toggle-label {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  border-radius: 22px;
  transition: .3s;
}

.Partenaire-appartements-toggle-label:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  border-radius: 50%;
  transition: .3s;
}

.Partenaire-appartements-toggle-input:checked + .Partenaire-appartements-toggle-label {
  background-color: #4CAF50;
}

.Partenaire-appartements-toggle-input:checked + .Partenaire-appartements-toggle-label:before {
  transform: translateX(24px);
}

/* Pagination */
.Partenaire-appartements-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 20px 0;
  gap: 5px;
}

.Partenaire-appartements-pagination-btn {
  background-color: #f0f4f9;
  border: none;
  color: #333;
  padding: 8px 12px;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.3s;
}

.Partenaire-appartements-pagination-btn:hover:not(.disabled) {
  background-color: #e9f5fb;
}

.Partenaire-appartements-pagination-btn.active {
  background-color: #0F447E;
  color: white;
}

.Partenaire-appartements-pagination-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Modal */
.Partenaire-appartements-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.Partenaire-appartements-modal-content {
  background-color: #fff;
  border-radius: 8px;
  width: 90%;
  max-width: 700px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

.Partenaire-appartements-modal-header {
  padding: 15px 20px;
  border-bottom: 1px solid #f0f0f0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.Partenaire-appartements-modal-header h3 {
  margin: 0;
  color: #0F447E;
  font-size: 18px;
  font-weight: 600;
}

.Partenaire-appartements-modal-close {
  background: transparent;
  border: none;
  font-size: 24px;
  cursor: pointer;
  color: #666;
}

.Partenaire-appartements-modal-body {
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.Partenaire-appartements-modal-image-container {
  width: 100%;
  max-height: 300px;
  overflow: hidden;
  border-radius: 6px;
}

.Partenaire-appartements-modal-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.Partenaire-appartements-modal-details {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.Partenaire-appartements-detail-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 8px;
}

.Partenaire-appartements-detail-label {
  font-weight: 600;
  color: #333;
  width: 150px;
}

.Partenaire-appartements-detail-value {
  color: #666;
}

.Partenaire-appartements-detail-link {
  color: #0F447E;
  text-decoration: none;
}

.Partenaire-appartements-detail-link:hover {
  text-decoration: underline;
}

.Partenaire-appartements-modal-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.Partenaire-appartements-detail-description {
  margin-top: 15px;
}

.Partenaire-appartements-detail-description h4 {
  margin-top: 0;
  margin-bottom: 10px;
  color: #333;
  font-size: 16px;
}

.Partenaire-appartements-detail-description p {
  margin: 0;
  color: #666;
  line-height: 1.5;
}

/* Responsive */
@media (max-width: 992px) {
  .Partenaire-appartements-table {
    min-width: 900px;
  }

  .Partenaire-appartements-modal-body {
    flex-direction: column;
  }
}

@media (max-width: 768px) {
  .Partenaire-appartements-header {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
  }

  .Partenaire-appartements-section-title {
    font-size: 14px;
  }

  .Partenaire-appartements-add-btn {
    padding: 5px 8px;
    font-size: 8px;
    white-space: nowrap;
    max-width: 130px;
  }

  .Partenaire-appartements-plus-icon {
    font-size: 12px;
    margin-right: 3px;
  }

  .Partenaire-appartements-main-container {
    padding: 10px;
  }

  .Partenaire-appartements-title {
    font-size: 18px;
  }

  /* Affiche l'indicateur de défilement sur mobile */
  .Partenaire-appartements-table-container::after {
    display: block;
  }

  /* Assure que le défilement horizontal est évident sur mobile */
  .Partenaire-appartements-table-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #0F447E #f0f0f0;
  }

  .Partenaire-appartements-table-container::-webkit-scrollbar {
    height: 6px;
  }

  .Partenaire-appartements-table-container::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
  }

  .Partenaire-appartements-table-container::-webkit-scrollbar-thumb {
    background: #0F447E;
    border-radius: 3px;
  }

  .Partenaire-appartements-modal-content {
    width: 95%;
  }

  .Partenaire-appartements-detail-label {
    width: 100%;
    margin-bottom: 2px;
  }
}

/* Styles pour le flou modal */
.Partenaire-appartements-main-container.modal-open {
  position: relative;
}

.Partenaire-appartements-main-container.modal-open::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 999;
}

.Partenaire-appartements-main-container.modal-open > *:not(.Partenaire-appartements-modal-overlay) {
  filter: blur(3px);
  transition: filter 0.3s ease;
  pointer-events: none;
}

/* S'assurer que le modal est au-dessus */
.Partenaire-appartements-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.Partenaire-appartements-modal-content {
  z-index: 1001;
  position: relative;
}

/* Styles pour les badges d'état */
.Partenaire-appartements-etat-badge {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
  display: inline-block;
}

.Partenaire-appartements-etat-badge.attente {
  background-color: #FFF3CD;
  color: #856404;
}

.Partenaire-appartements-etat-badge.publie {
  background-color: #D4EDDA;
  color: #155724;
}


/* Styles pour le chargement */
.Partenaire-appartements-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px;
  text-align: center;
}

.Partenaire-appartements-loading::before {
  content: '';
  width: 40px;
  height: 40px;
  border: 4px solid #f3f3f3;
  border-top: 4px solid #0F447E;
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin-bottom: 16px;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.Partenaire-appartements-loading {
  font-size: 16px;
  color: #666;
  font-weight: 500;
}

/* Styles pour les erreurs */
.Partenaire-appartements-error {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  text-align: center;
  background-color: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 8px;
  margin: 20px;
}

.Partenaire-appartements-error::before {
  content: '⚠️';
  font-size: 32px;
  margin-bottom: 12px;
  display: block;
}

.Partenaire-appartements-error {
  color: #e30613;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
}

/* Version alternative avec icône SVG pour l'erreur */
.Partenaire-appartements-error-alt {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 16px 20px;
  background-color: #fef2f2;
  border-left: 4px solid #e30613;
  border-radius: 4px;
  margin: 20px;
  color: #e30613;
  font-size: 14px;
  font-weight: 500;
}

.Partenaire-appartements-error-alt::before {
  content: '❌';
  font-size: 20px;
  flex-shrink: 0;
}
/* Cellule contenant l'image */
.Partenaire-appartements-image-cell {
  width: 100px;        /* largeur fixe de la cellule */
  height: 80px;        /* hauteur fixe de la cellule */
}

/* Image miniature */
.Partenaire-appartements-appt-thumbnail {
  object-fit: cover;   /* conserve le ratio et coupe au besoin */
  border-radius: 4px;  /* arrondir légèrement les coins */
  display: block;      /* élimine le petit espace sous l’image */
}

/* Responsive pour mobile */
@media (max-width: 768px) {
  .Partenaire-appartements-loading {
    padding: 40px 15px;
    font-size: 14px;
  }

  .Partenaire-appartements-loading::before {
    width: 32px;
    height: 32px;
    border-width: 3px;
  }

  .Partenaire-appartements-error {
    margin: 15px;
    padding: 30px 15px;
    font-size: 14px;
  }

  .Partenaire-appartements-error::before {
    font-size: 28px;
  }
   /* masquer toutes les colonnes sauf Image, Nom et Actions */
  .Partenaire-appartements-table th:not(.col-image):not(.col-nom):not(.col-actions),
  .Partenaire-appartements-table td:not(.col-image):not(.col-nom):not(.col-actions) {
    display: none !important;
  }

  /* table recalculée uniquement sur 3 colonnes */
  .Partenaire-appartements-table {
    width: 100% !important;
    min-width: 0 !important;
    min-width: initial !important;  /* supprime le min-width:900px qui créait le vide */
    table-layout: auto !important;
  }

  /* répartir les 3 colonnes visibles */
  .Partenaire-appartements-table .col-image   { width: 35%; }
  .Partenaire-appartements-table .col-nom     { width: 40%; }
  .Partenaire-appartements-table .col-actions { width: 25%; text-align: right; }
}





/* quand le sidebar est réduit */
.sidebar-collapsed .Partenaire-appartements-main-container {
  padding-left: 20px;
  padding-left: var(--sidebar-w-collapsed);
}


/* Message d'absence d'appartements */
.Partenaire-appartements-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px;
  text-align: center;
  background-color: #f8f9fa;
  border-radius: 8px;
  margin: 20px;
  color: #666;
  font-size: 16px;
  font-weight: 500;
}

.Partenaire-appartements-empty::before {
  content: '📦';
  font-size: 48px;
  margin-bottom: 16px;
  display: block;
  opacity: 0.5;
}

/* Responsive pour mobile */
@media (max-width: 768px) {
  .Partenaire-appartements-empty {
    padding: 40px 15px;
    margin: 15px;
    font-size: 14px;
  }

  .Partenaire-appartements-empty::before {
    font-size: 40px;
    margin-bottom: 12px;
  }
}


/* répartir les 3 colonnes visibles */
  .Partenaire-appartements-table .col-image   { width: 25%; }
  .Partenaire-appartements-table .col-nom     { width: 35%; }
  .Partenaire-appartements-table .col-actions { width: 40%; }

  /* Centrer le titre "Actions" */
  .Partenaire-appartements-table th.col-actions {
    text-align: center !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Forcer le centrage de la cellule d'actions */
  .Partenaire-appartements-table td.col-actions {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Centrer les boutons d'action horizontalement */
  .Partenaire-appartements-actions-cell {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
    width: 100% !important;
  }

  /* Réduire la taille des boutons d'action sur mobile */
  .Partenaire-appartements-action-btn {
    width: 28px !important;
    height: 28px !important;
    font-size: 13px !important;
    flex-shrink: 0;
  }

  .tahaga-action-btn {
    width: 28px !important;
    height: 28px !important;
    font-size: 13px !important;
    flex-shrink: 0;
  }
/* Style principal pour la page des hôtels partenaire */
.hotels-partenaire-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
}

.page-content {
  flex: 1 1;
  margin-left: 250px; 
  padding-top: 70px; 
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Quand le sidebar est collapsé sur DESKTOP */
.hotels-partenaire-page.sidebar-collapsed .page-content {
  margin-left: 70px;
  width: calc(100% - 70px);
}

/* Conteneur pour le contenu principal */
.dashboard-content {
  padding: 0 20px;
  box-sizing: border-box;
}

/* ===============================================
   MOBILE VIEW - Le contenu prend toute la largeur
   =============================================== */
.hotels-partenaire-page.mobile-view .page-content {
  margin-left: 0 !important;
  width: 100% !important;
  padding-top: 80px;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 0 !important;
    width: 100% !important;
    padding-top: 80px;
  }
  
  .hotels-partenaire-page.sidebar-collapsed .page-content {
    margin-left: 0 !important;
    width: 100% !important;
  }
  
  .dashboard-content {
    padding: 0 15px;
  }
}

@media (max-width: 480px) {
  .dashboard-content {
    padding: 0 10px;
  }
  
  .page-content {
    padding-top: 75px;
  }
}
/* Partenaire-hotels.css */

/* Container principal */
.Partenaire-hotels-main-container {
  font-family: 'Poppins', sans-serif;
  padding: 20px;
  max-width: 100%;
  margin: 0 auto;
}

/* Titre principal */
.Partenaire-hotels-title {
  font-size: 24px;
  font-weight: 600;
  color: #0e4c90;
  margin-bottom: 20px;
  white-space: nowrap;
}

.Partenaire-hotels-title-highlight {
  color: #e63946;
}

/* Container de la liste */
.Partenaire-hotels-container {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  padding: 0;
  margin-top: 10px;
  overflow: hidden;
}

/* En-tête de la liste */
.Partenaire-hotels-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid #f0f0f0;
}

.Partenaire-hotels-section-title {
  font-size: 16px;
  font-weight: 600;
  color: #333;
  margin: 0;
}

/* Bouton d'ajout */
.Partenaire-hotels-add-btn {
  background-color: #0e4c90;
  color: white;
  border: none;
  border-radius: 5px;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background-color 0.3s;
}

.Partenaire-hotels-add-btn:hover {
  background-color: #0d4583;
}

.Partenaire-hotels-plus-icon {
  margin-right: 5px;
  font-size: 16px;
  font-weight: bold;
}

/* Tableau avec barre de défilement */
.Partenaire-hotels-table-container {
  overflow-x: auto;
  max-height: 500px;
  overflow-y: auto;
  position: relative;
}

.Partenaire-hotels-table-container::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 60px;
  height: 20px;
  background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.8));
  pointer-events: none;
  animation: fadeInOut 1.5s infinite alternate;
  display: none;
}

@keyframes fadeInOut {
  from { opacity: 0.4; }
  to { opacity: 1; }
}

.Partenaire-hotels-table {
  width: 100%;
  border-collapse: collapse;
}

.Partenaire-hotels-table th, 
.Partenaire-hotels-table td {
  padding: 15px;
  text-align: left;
  border-bottom: 1px solid #f0f0f0;
  font-size: 14px;
}

.Partenaire-hotels-table th {
  font-weight: 500;
  color: #0d4583;
  background-color: #fafafa;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 1;
}

.Partenaire-hotels-table tr:hover {
  background-color: #f9f9f9;
}

/* Cellule d'image */
.Partenaire-hotels-image-cell {
  width: 80px;
}

.Partenaire-hotels-thumbnail {
  width: 60px;
  height: 60px;
  object-fit: cover;
  border-radius: 4px;
}

/* Options - Style badge */
.Partenaire-hotels-options-cell {
  min-width: 140px;
}

.Partenaire-hotels-options-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.Partenaire-hotels-badge {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
  background-color: #f0f4f9;
  color: #666768;
}

.Partenaire-hotels-badge.active {
  background-color: #f0f4f9;
  color: #666768;
}

/* Liens */
.Partenaire-hotels-links-cell {
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.Partenaire-hotels-link {
  color: #0e4c90;
  text-decoration: none;
  font-size: 13px;
  transition: color 0.3s;
}

.Partenaire-hotels-link:hover {
  color: #e63946;
  text-decoration: underline;
}

/* Actions */
.Partenaire-hotels-actions-cell {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
}

.Partenaire-hotels-action-btn {
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  width: 30px;
  height: 30px;
  border-radius: 4px;
}

.Partenaire-hotels-view-btn {
  color: #4CAF50;
  background-color: #e8f5e9;
}

.Partenaire-hotels-edit-btn {
  color: #0e4c90;
  background-color: #e9f5fb;
}

.Partenaire-hotels-delete-btn {
  color: #e63946;
  background-color: #ffebee;
}

/* Toggle Switch */
.Partenaire-hotels-toggle-container {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 22px;
}

.Partenaire-hotels-toggle-input {
  opacity: 0;
  width: 0;
  height: 0;
}

.Partenaire-hotels-toggle-label {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  border-radius: 22px;
  transition: .3s;
}

.Partenaire-hotels-toggle-label:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  border-radius: 50%;
  transition: .3s;
}

.Partenaire-hotels-toggle-input:checked + .Partenaire-hotels-toggle-label {
  background-color: #4CAF50;
}

.Partenaire-hotels-toggle-input:checked + .Partenaire-hotels-toggle-label:before {
  transform: translateX(24px);
}

/* Pagination */
.Partenaire-hotels-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 20px 0;
  gap: 5px;
}

.Partenaire-hotels-pagination-btn {
  background-color: #f0f4f9;
  border: none;
  color: #333;
  padding: 8px 12px;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.3s;
}

.Partenaire-hotels-pagination-btn:hover:not(.disabled) {
  background-color: #e9f5fb;
}

.Partenaire-hotels-pagination-btn.active {
  background-color: #0e4c90;
  color: white;
}

.Partenaire-hotels-pagination-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Modal */
.Partenaire-hotels-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.Partenaire-hotels-modal-content {
  background-color: #fff;
  border-radius: 8px;
  width: 90%;
  max-width: 700px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

.Partenaire-hotels-modal-header {
  padding: 15px 20px;
  border-bottom: 1px solid #f0f0f0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.Partenaire-hotels-modal-header h3 {
  margin: 0;
  color: #0e4c90;
  font-size: 18px;
  font-weight: 600;
}

.Partenaire-hotels-modal-close {
  background: transparent;
  border: none;
  font-size: 24px;
  cursor: pointer;
  color: #666;
}

.Partenaire-hotels-modal-body {
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.Partenaire-hotels-modal-image-container {
  width: 100%;
  max-height: 300px;
  overflow: hidden;
  border-radius: 6px;
}

.Partenaire-hotels-modal-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.Partenaire-hotels-modal-details {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.Partenaire-hotels-detail-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 8px;
}

.Partenaire-hotels-detail-label {
  font-weight: 600;
  color: #333;
  width: 150px;
}

.Partenaire-hotels-detail-value {
  color: #666;
}

.Partenaire-hotels-detail-link {
  color: #0e4c90;
  text-decoration: none;
}

.Partenaire-hotels-detail-link:hover {
  text-decoration: underline;
}

.Partenaire-hotels-modal-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.Partenaire-hotels-detail-description {
  margin-top: 15px;
}

.Partenaire-hotels-detail-description h4 {
  margin-top: 0;
  margin-bottom: 10px;
  color: #333;
  font-size: 16px;
}

.Partenaire-hotels-detail-description p {
  margin: 0;
  color: #666;
  line-height: 1.5;
}

/* Responsive */
@media (max-width: 992px) {
  .Partenaire-hotels-table {
    min-width: 900px;
  }
  
  .Partenaire-hotels-modal-body {
    flex-direction: column;
  }
}

@media (max-width: 768px) {
  .Partenaire-hotels-header {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
  }
  
  .Partenaire-hotels-section-title {
    font-size: 14px;
  }
  
  .Partenaire-hotels-add-btn {
    padding: 5px 8px;
    font-size: 8px;
    white-space: nowrap;
    max-width: 130px;
  }
  
  .Partenaire-hotels-plus-icon {
    font-size: 12px;
    margin-right: 3px;
  }
  
  .Partenaire-hotels-main-container {
    padding: 10px;
  }
  
  .Partenaire-hotels-title {
    font-size: 18px;
  }
  
  .Partenaire-hotels-table-container::after {
    display: block;
  }
  
  .Partenaire-hotels-table-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #0e4c90 #f0f0f0;
  }
  
  .Partenaire-hotels-table-container::-webkit-scrollbar {
    height: 6px;
  }
  
  .Partenaire-hotels-table-container::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
  }
  
  .Partenaire-hotels-table-container::-webkit-scrollbar-thumb {
    background: #0e4c90;
    border-radius: 3px;
  }
  
  .Partenaire-hotels-modal-content {
    width: 95%;
  }
  
  .Partenaire-hotels-detail-label {
    width: 100%;
    margin-bottom: 2px;
  }
}

/* Styles pour le flou modal */
.Partenaire-hotels-main-container.modal-open {
  position: relative;
}

.Partenaire-hotels-main-container.modal-open::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 999;
}

.Partenaire-hotels-main-container.modal-open > *:not(.Partenaire-hotels-modal-overlay) {
  filter: blur(3px);
  transition: filter 0.3s ease;
  pointer-events: none;
}

/* S'assurer que le modal est au-dessus */
.Partenaire-hotels-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.Partenaire-hotels-modal-content {
  z-index: 1001;
  position: relative;
}

/* Styles pour les badges d'état */
.Partenaire-hotels-etat-badge {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
  display: inline-block;
}

.Partenaire-hotels-etat-badge.attente {
  background-color: #FFF3CD;
  color: #856404;
}

.Partenaire-hotels-etat-badge.publie {
  background-color: #D4EDDA;
  color: #155724;
}
/* Style principal pour la page des réservations partenaire */
.reservations-partenaire-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
}

.page-content {
  flex: 1 1;
  margin-left: 250px; 
  padding-top: 70px; 
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Quand le sidebar est collapsé sur DESKTOP */
.reservations-partenaire-page.sidebar-collapsed .page-content {
  margin-left: 70px;
  width: calc(100% - 70px);
}

/* Conteneur pour le contenu principal */
.dashboard-content {
  padding: 0 20px;
  box-sizing: border-box;
}

/* ===============================================
   MOBILE VIEW - Le contenu prend toute la largeur
   =============================================== */
.reservations-partenaire-page.mobile-view .page-content {
  margin-left: 0 !important;
  width: 100% !important;
  padding-top: 80px;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 0 !important;
    width: 100% !important;
    padding-top: 80px;
  }
  
  .reservations-partenaire-page.sidebar-collapsed .page-content {
    margin-left: 0 !important;
    width: 100% !important;
  }
  
  .dashboard-content {
    padding: 0 15px;
  }
}

@media (max-width: 480px) {
  .dashboard-content {
    padding: 0 10px;
  }
  
  .page-content {
    padding-top: 75px;
  }
}
.ReservationAppartement-partenaire-container {
  max-width: 1920px;
  margin: 0 auto;
  font-family: 'Poppins', sans-serif;
  padding: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.ReservationAppartement-partenaire-header {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 30px;
  padding: 0 10px;
  width: 100%;
}

.ReservationAppartement-partenaire-icon {
  margin-right: 10px;
}

.ReservationAppartement-partenaire-title {
  font-size: 24px;
  font-weight: 600;
  display: flex;
  align-items: center;
  /* white-space: nowrap; */
  gap: 5px;
}

.ReservationAppartement-partenaire-mes-reservations {
  color: #0F447E;
}

.ReservationAppartement-partenaire-partenaire-text {
  color: #E30613;
}

.ReservationAppartement-partenaire-cards-container {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
  width: 100%;
}

.ReservationAppartement-partenaire-card {
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  width: calc(33.333% - 14px);
  max-width: 380px;
  background-color: white;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.ReservationAppartement-partenaire-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

.ReservationAppartement-partenaire-card-header {
  display: flex;
  border-bottom: 1px solid #e2e8f0;
  height: 110px;
}

.ReservationAppartement-partenaire-card-header-image {
  width: 110px;
  min-width: 110px;
  height: 110px;
  overflow: hidden;
}

.ReservationAppartement-partenaire-card-header-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ReservationAppartement-partenaire-card-header-info {
  flex: 1 1;
  background-color: #0F447E;
  color: white;
  padding: 12px;
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: space-between;
}

.ReservationAppartement-partenaire-title-container {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 7px;
}

.ReservationAppartement-partenaire-residence-name-container {
  flex: 1 1;
  min-width: 0;
  padding-right: 8px;
}

.ReservationAppartement-partenaire-residence-name {
  font-size: 18px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  display: flex;
  align-items: center;
  gap: 6px;
}

/* Icône de l'œil */
.ReservationAppartement-partenaire-eye-icon {
  cursor: pointer;
  opacity: 0.8;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.ReservationAppartement-partenaire-eye-icon:hover {
  opacity: 1;
  transform: scale(1.1);
}

.ReservationAppartement-partenaire-header-details {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-top: auto;
}

.ReservationAppartement-partenaire-info-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  height: 20px;
  overflow: hidden;
}

.ReservationAppartement-partenaire-info-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ReservationAppartement-partenaire-status {
  text-align: right;
  flex-shrink: 0;
}

.ReservationAppartement-partenaire-status-badge {
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  display: inline-block;
  color: white;
}

.ReservationAppartement-partenaire-card-body {
  padding: 20px;
}

.ReservationAppartement-partenaire-detail-row {
  display: flex;
  justify-content: space-between;
  padding: 10px 0;
  border-bottom: 1px solid #f0f0f0;
  align-items: center;
}

.ReservationAppartement-partenaire-detail-row:last-of-type {
  border-bottom: none;
  margin-bottom: 20px;
}

.ReservationAppartement-partenaire-label {
  color: #94a3b8;
  font-size: 14px;
}

.ReservationAppartement-partenaire-value {
  font-weight: 600;
  text-align: right;
  color: #0F447E;
}

.ReservationAppartement-partenaire-actions {
  display: flex;
  gap: 10px;
}

.ReservationAppartement-partenaire-approve-btn,
.ReservationAppartement-partenaire-cancel-btn {
  flex: 1 1;
  padding: 12px;
  border: none;
  border-radius: 6px;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  transition: all 0.2s ease;
}

.ReservationAppartement-partenaire-approve-btn {
  background-color: #b7e4c7;
  color: #2d6a4f;
}

.ReservationAppartement-partenaire-approve-btn:hover {
  background-color: #95d5b2;
}

.ReservationAppartement-partenaire-cancel-btn {
  background-color: #f87171;
  color: white;
}

.ReservationAppartement-partenaire-cancel-btn:hover {
  background-color: #E30613;
}

/* Style de pagination */
.ReservationAppartement-partenaire-pagination {
  display: flex;
  justify-content: center;
  margin-top: 30px;
  gap: 8px;
}

.ReservationAppartement-partenaire-pagination-btn {
  min-width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e0e0e0;
  background-color: white;
  color: #333;
  font-size: 14px;
  cursor: pointer;
  border-radius: 6px;
  transition: all 0.2s;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.ReservationAppartement-partenaire-pagination-btn:hover:not(:disabled) {
  background-color: #f0f0f0;
  transform: translateY(-1px);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
}

.ReservationAppartement-partenaire-pagination-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.ReservationAppartement-partenaire-pagination-active {
  background-color: #0F447E;
  color: white;
  border-color: #0F447E;
  font-weight: 600;
}

.ReservationAppartement-partenaire-pagination-active:hover {
  background-color: #0F447E;
}

/* Styles pour le popup */
.ReservationAppartement-partenaire-popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  padding: 20px;
}

.ReservationAppartement-partenaire-popup-content {
  background-color: white;
  border-radius: 12px;
  width: 100%;
  max-width: 600px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
  animation: fadeIn 0.3s ease-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.ReservationAppartement-partenaire-popup-header {
  background-color: #0F447E;
  color: white;
  padding: 16px 20px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.ReservationAppartement-partenaire-popup-title {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
}

.ReservationAppartement-partenaire-popup-close {
  background: none;
  border: none;
  color: white;
  font-size: 24px;
  cursor: pointer;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: background-color 0.2s ease;
}

.ReservationAppartement-partenaire-popup-close:hover {
  background-color: rgba(255, 255, 255, 0.2);
}

.ReservationAppartement-partenaire-popup-body {
  padding: 20px;
}

.ReservationAppartement-partenaire-popup-image-container {
  width: 100%;
  height: 200px;
  overflow: hidden;
  border-radius: 8px;
  margin-bottom: 20px;
}

.ReservationAppartement-partenaire-popup-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ReservationAppartement-partenaire-popup-info {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ReservationAppartement-partenaire-popup-status {
  margin-bottom: 10px;
}

.ReservationAppartement-partenaire-popup-detail {
  padding: 8px 0;
  border-bottom: 1px solid #f0f0f0;
  line-height: 1.5;
}
.ReservationAppartement-partenaire-popup-detailEmail {
  padding: 8px 0;
  border-bottom: 1px solid #f0f0f0;
  line-height: 1.5;
  display: none;
}
.ReservationAppartement-partenaire-popup-detailTel {
  padding: 8px 0;
  border-bottom: 1px solid #f0f0f0;
  line-height: 1.5;
  display: none;
}

.ReservationAppartement-partenaire-popup-detail:last-child {
  border-bottom: none;
}

.ReservationAppartement-partenaire-popup-actions {
  padding: 20px;
  display: flex;
  gap: 10px;
  border-top: 1px solid #e0e0e0;
}

/* Responsive design */
@media (max-width: 1100px) {
  .ReservationAppartement-partenaire-card {
    width: calc(50% - 10px);
    max-width: 450px;
  }
}

@media (max-width: 768px) {
  .ReservationAppartement-partenaire-container {
    padding: 15px;
    max-width: 95%;
    align-items: flex-start;
  }

  .ReservationAppartement-partenaire-header {
    justify-content: flex-start;
  }

  .ReservationAppartement-partenaire-title {
    font-size: 18px;
    justify-content: flex-start;
  }

  .ReservationAppartement-partenaire-category-tabs {
    justify-content: flex-start;
  }

  .ReservationAppartement-partenaire-cards-container {
    justify-content: flex-start;
  }

  .ReservationAppartement-partenaire-card {
    width: 100%;
  }

  .ReservationAppartement-partenaire-popup-content {
    width: 95%;
  }
}

@media (max-width: 576px) {
  .ReservationAppartement-partenaire-card-header {
    flex-direction: column;
    height: auto;
  }

  .ReservationAppartement-partenaire-card-header-image {
    width: 100%;
    height: 120px;
  }

  .ReservationAppartement-partenaire-card-header-info {
    height: auto;
  }

  .ReservationAppartement-partenaire-residence-name {
    white-space: normal;
    overflow: visible;
  }

  .ReservationAppartement-partenaire-title-container {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
  }

  .ReservationAppartement-partenaire-status {
    margin-top: 5px;
  }

  .ReservationAppartement-partenaire-header-details {
    margin-top: 10px;
  }

  .ReservationAppartement-partenaire-info-row {
    height: auto;
  }

  .ReservationAppartement-partenaire-info-text {
    white-space: normal;
  }

  .ReservationAppartement-partenaire-detail-row {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
  }

  .ReservationAppartement-partenaire-period-row {
    flex-direction: column;
    align-items: flex-start;
  }

  .ReservationAppartement-partenaire-period-row .ReservationAppartement-partenaire-value {
    text-align: left;
    margin-top: 5px;
  }

  .ReservationAppartement-partenaire-popup-actions {
    flex-direction: column;
  }
}

@media (max-width: 480px) {
  .ReservationAppartement-partenaire-title {
    font-size: 16px;
  }

  .ReservationAppartement-partenaire-icon {
    margin-right: 5px;
  }

  .ReservationAppartement-partenaire-actions {
    flex-direction: column;
  }

  .ReservationAppartement-partenaire-pagination-btn {
    min-width: 28px;
    height: 28px;
    font-size: 12px;
  }
}

/* Animation de chargement */
.ReservationAppartement-partenaire-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 200px;
  gap: 1rem;
  color: #0F447E;
}

.ReservationAppartement-partenaire-loading-circle {
  display: flex;
  justify-content: center;
  align-items: center;
}

.ReservationAppartement-partenaire-loading-spinner {
  width: 50px;
  height: 50px;
  border: 5px solid #f3f3f3;
  border-top: 5px solid #0F447E;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Styles pour les onglets */
.ReservationAppartement-partenaire-category-tabs {
  display: flex;
  justify-content: center;
  margin-bottom: 2rem;
  border-bottom: 1px solid #e5e7eb;
  padding: 0 10px;
  overflow-x: auto;
  scrollbar-width: none;
  width: 100%;
}

.ReservationAppartement-partenaire-category-tabs::-webkit-scrollbar {
  display: none;
}

.ReservationAppartement-partenaire-category-tab {
  padding: 0.8rem 1.2rem;
  font-size: 0.95rem;
  font-weight: 500;
  background: transparent;
  border: none;
  color: #6b7280;
  cursor: pointer;
  position: relative;
  transition: color 0.2s ease;
  white-space: nowrap;
  flex-shrink: 0;
}

.ReservationAppartement-partenaire-category-tab.active {
  color: #0F447E;
  font-weight: 600;
}

.ReservationAppartement-partenaire-category-tab.active::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  height: 2px;
  background-color: #0F447E;
}

.ReservationAppartement-partenaire-category-tab:hover {
  color: #0d3a6b;
}

.ReservationAppartement-partenaire-count {
  font-size: 0.85rem;
  font-weight: 500;
  margin-left: 0.3rem;
  color: #656565;
}

/* Message quand pas de résultats */
.ReservationAppartement-partenaire-no-results {
  width: 100%;
  text-align: center;
  padding: 2rem;
  color: #64748b;
  font-size: 1.1rem;
}

/* Boutons désactivés */
.ReservationAppartement-partenaire-approve-btn:disabled,
.ReservationAppartement-partenaire-cancel-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.ReservationAppartement-partenaire-approve-btn:disabled {
  background-color: #d1fae5;
}

.ReservationAppartement-partenaire-cancel-btn:disabled {
  background-color: #fee2e2;
}

/* Styles pour les boutons désactivés avec tooltip */
.ReservationAppartement-partenaire-actions .disabled-btn {
  position: relative;
  opacity: 0.6;
  cursor: not-allowed;
}

.ReservationAppartement-partenaire-actions .disabled-btn:hover::after {
  content: "Contacter le support";
  position: absolute;
  top: -35px;
  left: 50%;
  transform: translateX(-50%);
  background: #333;
  color: white;
  padding: 5px 10px;
  border-radius: 4px;
  font-size: 12px;
  white-space: nowrap;
  z-index: 10;
}

.ReservationAppartement-partenaire-actions .disabled-btn:hover::before {
  content: "";
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #333;
  z-index: 10;
}

/* Style pour le popup de contact support */
.ReservationAppartement-partenaire-support-popup {
  background-color: white;
  border-radius: 12px;
  width: 90%;
  max-width: 400px;
  overflow: hidden;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
  animation: fadeIn 0.3s ease-out;
}

.ReservationAppartement-partenaire-support-popup .ReservationAppartement-partenaire-popup-body {
  padding: 20px;
  text-align: center;
}

.ReservationAppartement-partenaire-support-popup .ReservationAppartement-partenaire-popup-body p {
  margin-bottom: 10px;
  line-height: 1.5;
}

/* Couleur pour le statut Initié */
.ReservationAppartement-partenaire-status-badge[style*="#93c5fd"] {
  background-color: #93c5fd !important;
  color: #0F447E;
}

.ReservationAppartement-partenaire-reject-btn {
  flex: 1 1;
  padding: 12px;
  border: none;
  border-radius: 6px;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  transition: all 0.2s ease;
  background-color: #e63946;
  color: white;
}

.ReservationAppartement-partenaire-reject-btn:hover {
  background-color: #e63946;
}

.ReservationAppartement-partenaire-reject-btn:disabled {
  background-color: #fef3c7;
  opacity: 0.6;
  cursor: not-allowed;
}

.ReservationAppartement-partenaire-status-badge[style*="#f59e0b"] {
  color: white;
}

.reservation-skeleton-grid {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}

.no-underline {
  text-decoration: none !important;
  display: inline-block;
}

/* Titre principal - même style que gestion clients */
.ReservationAppartement-partenaire-main-title {
  font-size: 24px;
  font-weight: 600;
  color: #0F447E;
  margin-bottom: 20px;
  padding: 0 10px;
  display: flex;
  align-items: center;
  white-space: nowrap;
  gap: 5px;
}

.ReservationAppartement-partenaire-main-title-highlight {
  color: #e63946;
}

/* Wrapper pour le contenu blanc avec bordure */
.ReservationAppartement-partenaire-content-wrapper {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  padding: 0;
  overflow: hidden;
}

/* Header à l'intérieur du wrapper */
.ReservationAppartement-partenaire-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid #f0f0f0;
  margin-bottom: 0;
}

.ReservationAppartement-partenaire-section-title {
  font-size: 16px;
  font-weight: 600;
  color: #0F447E;
  margin: 0;
}

.ReservationAppartement-partenaire-section-title-highlight {
  color: #e63946;
}

/* Ajustement des onglets */
.ReservationAppartement-partenaire-category-tabs {
  display: flex;
  justify-content: flex-start;
  margin-bottom: 0;
  border-bottom: 1px solid #e5e7eb;
  padding: 0 20px;
  overflow-x: auto;
  scrollbar-width: none;
  width: 100%;
  /* background-color: #fff; */
}

/* Ajustement du container de cartes */
.ReservationAppartement-partenaire-cards-container {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
  width: 100%;
  padding: 20px;
  /* background-color: #fff; */
}

/* Message vide avec le même style */
.ReservationAppartement-partenaire-no-results {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px;
  text-align: center;
  /* background-color: #f8f9fa; */
  border-radius: 8px;
  margin: 20px;
  color: #666;
  font-size: 16px;
  font-weight: 500;
  width: calc(100% - 40px);
}

.ReservationAppartement-partenaire-no-results::before {
  content: '📋';
  font-size: 48px;
  margin-bottom: 16px;
  display: block;
  opacity: 0.5;
}

/* Pagination à l'intérieur du wrapper */
.ReservationAppartement-partenaire-pagination {
  display: flex;
  justify-content: center;
  margin: 20px 0;
  padding-bottom: 20px;
  gap: 8px;
}

/* Responsive */
@media (max-width: 768px) {
  .ReservationAppartement-partenaire-main-title {
    font-size: 16px;
    padding: 0 5px;
  }

  .ReservationAppartement-partenaire-title {
    font-size: 16px;
  }

  .ReservationAppartement-partenaire-section-title {
    font-size: 14px;
  }

  .ReservationAppartement-partenaire-header {
    padding: 12px 15px;
  }

  .ReservationAppartement-partenaire-category-tabs {
    padding: 0 15px;
  }

  .ReservationAppartement-partenaire-cards-container {
    padding: 15px;
  }

  .ReservationAppartement-partenaire-no-results {
    padding: 40px 15px;
    margin: 15px;
    font-size: 14px;
    width: calc(100% - 30px);
  }
  
  .ReservationAppartement-partenaire-no-results::before {
    font-size: 40px;
    margin-bottom: 12px;
  }
}

@media (max-width: 480px) {
  .ReservationAppartement-partenaire-main-title {
    font-size: 14px;
  }

  .ReservationAppartement-partenaire-title {
    font-size: 19px;
  }

  .ReservationAppartement-partenaire-section-title {
    font-size: 13px;
  }

  .ReservationAppartement-partenaire-icon {
    margin-right: 5px;
  }
}

/* ==============================
Pagination add  amélioration
============================ */

/* Pagination améliorée */
.ReservationAppartement-partenaire-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 30px;
  gap: 6px;
  flex-wrap: wrap;
}

.ReservationAppartement-partenaire-pagination-btn {
  min-width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e0e0e0;
  background-color: white;
  color: #333;
  font-size: 14px;
  cursor: pointer;
  border-radius: 6px;
  transition: all 0.2s;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.ReservationAppartement-partenaire-pagination-btn:hover:not(:disabled) {
  background-color: #f0f0f0;
  transform: translateY(-1px);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
}

.ReservationAppartement-partenaire-pagination-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.ReservationAppartement-partenaire-pagination-active {
  background-color: #0F447E;
  color: white;
  border-color: #0F447E;
  font-weight: 600;
}

.ReservationAppartement-partenaire-pagination-active:hover {
  background-color: #002b63;
}

.ReservationAppartement-partenaire-pagination-ellipsis {
  padding: 0 8px;
  color: #666;
  font-weight: 600;
}

/* Responsive pour la pagination */
@media (max-width: 768px) {
  .ReservationAppartement-partenaire-pagination {
    gap: 4px;
  }
  
  .ReservationAppartement-partenaire-pagination-btn {
    min-width: 32px;
    height: 32px;
    font-size: 12px;
  }
  
  .ReservationAppartement-partenaire-pagination-ellipsis {
    padding: 0 6px;
    font-size: 12px;
  }
}

@media (max-width: 480px) {
  .ReservationAppartement-partenaire-pagination-btn {
    min-width: 28px;
    height: 28px;
    font-size: 11px;
  }
}


/* ============================================================================== */
/* Réduire seulement la taille des éléments spécifiques dans le card-body */
/* ============================================================================== */

.ReservationAppartement-partenaire-card-body {
  padding: 20px;
}

.ReservationAppartement-partenaire-detail-row {
  display: flex;
  justify-content: space-between;
  padding: 8px 0; /* Légèrement réduit */
  border-bottom: 1px solid #f0f0f0;
  align-items: center;
  font-size: 13px; /* Taille réduite */
}

.ReservationAppartement-partenaire-detail-row:last-of-type {
  border-bottom: none;
  margin-bottom: 15px; /* Légèrement réduit */
}

.ReservationAppartement-partenaire-label {
  color: #94a3b8;
  font-size: 12px; /* Taille réduite */
  white-space: nowrap; /* Empêche le retour à la ligne */
}

.ReservationAppartement-partenaire-value {
  font-weight: 600;
  text-align: right;
  color: #0F447E;
  font-size: 12px; /* Taille réduite */
  white-space: nowrap; /* Empêche le retour à la ligne */
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 60%; /* Limite la largeur pour éviter les débordements */
}

/* Pour les très petits écrans seulement */
@media (max-width: 480px) {
  .ReservationAppartement-partenaire-detail-row {
    font-size: 12px; /* Un peu plus petit sur mobile */
  }
  
  .ReservationAppartement-partenaire-label,
  .ReservationAppartement-partenaire-value {
    font-size: 11px; /* Un peu plus petit sur mobile */
  }
  
  /* S'assurer que les éléments restent sur une ligne même sur mobile */
  .ReservationAppartement-partenaire-detail-row {
    flex-direction: row; /* Toujours en ligne */
    align-items: center;
    gap: 5px;
  }
  
  .ReservationAppartement-partenaire-value {
    max-width: 55%; /* Ajusté pour mobile */
    text-align: right;
  }
}

/* Pour les écrans très étroits */
@media (max-width: 360px) {
  .ReservationAppartement-partenaire-detail-row {
    font-size: 11px;
  }
  
  .ReservationAppartement-partenaire-label,
  .ReservationAppartement-partenaire-value {
    font-size: 10px;
  }
}

/* Responsive pour la pagination */
@media (max-width: 768px) {
  .ReservationAppartement-partenaire-pagination {
    gap: 4px;
    justify-content: center; /* Centrer la pagination sur mobile */
    width: 100%;
  }
  
  .ReservationAppartement-partenaire-pagination-btn {
    min-width: 32px;
    height: 32px;
    font-size: 12px;
  }
  
  .ReservationAppartement-partenaire-pagination-ellipsis {
    padding: 0 6px;
    font-size: 12px;
  }
}
/* ============================
   Reservation Skeleton (Adapté au style Partenaire)
   ============================ */

.reservation-skeleton-card {
  position: relative;
  overflow: hidden;
}

/* Image gauche */
.ReservationAppartement-partenaire-card-header-image.shimmer {
  background-color: #e5e7eb;
  width: 110px;
  min-width: 110px;
  height: 110px;
  border-right: 1px solid #e2e8f0;
}

/* Zone info bleue */
.ReservationAppartement-partenaire-card-header-info.shimmer {
  flex: 1 1;
  background-color: #cbd5e1;
}

/* Lignes du corps */
.skeleton-line {
  height: 12px;
  border-radius: 4px;
  background-color: #e5e7eb;
  margin-bottom: 10px;
}

.skeleton-line.short {
  width: 40%;
}

.skeleton-line.medium {
  width: 70%;
}

.skeleton-line.long {
  width: 90%;
}

/* Bouton fantôme */
.skeleton-btn {
  width: 100%;
  height: 42px;
  border-radius: 6px;
  background-color: #e3e5e8;
  margin-top: 12px;
}

/* Effet shimmer */
.shimmer {
  position: relative;
  overflow: hidden;
}

.shimmer::after {
  content: "";
  position: absolute;
  top: 0;
  left: -150px;
  width: 150px;
  height: 100%;
  background: linear-gradient(
    to right,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.45) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  animation: shimmer 1.5s infinite;
}

@keyframes shimmer {
  0% {
    left: -150px;
  }
  100% {
    left: 100%;
  }
}

/* ============================
   Mise en page : 3 colonnes, responsive identique
   ============================ */
.ReservationAppartement-partenaire-cards-container {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}

.ReservationAppartement-partenaire-card {
  width: calc(33.333% - 14px);
  max-width: 380px;
  background-color: #fff;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

/* Responsive (identique à tes vraies cartes) */
@media (max-width: 1100px) {
  .ReservationAppartement-partenaire-card {
    width: calc(50% - 10px);
    max-width: 450px;
  }
}

@media (max-width: 768px) {
  .ReservationAppartement-partenaire-card {
    width: 100%;
  }
}

.ReservationHotel-partenaire-container {
  max-width: 1200px;
  margin: 0 auto;
  font-family: 'Poppins', sans-serif;
  padding: 20px;
}

.ReservationHotel-partenaire-header {
  display: flex;
  align-items: center;
  margin-bottom: 30px;
  padding: 0 10px;
}

.ReservationHotel-partenaire-icon {
  margin-right: 10px;
}

.ReservationHotel-partenaire-title {
  font-size: 24px;
  font-weight: 600;
}

.ReservationHotel-partenaire-mes-reservations {
  color: #003a85;
}

.ReservationHotel-partenaire-hotels {
  color: #E30613;
}

.ReservationHotel-partenaire-cards-container {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}

.ReservationHotel-partenaire-card {
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  width: calc(33.333% - 14px);
  max-width: 380px;
  background-color: white;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.ReservationHotel-partenaire-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

.ReservationHotel-partenaire-card-header {
  display: flex;
  border-bottom: 1px solid #e2e8f0;
  height: 110px;
}

.ReservationHotel-partenaire-card-header-image {
  width: 110px;
  min-width: 110px;
  height: 110px;
  overflow: hidden;
}

.ReservationHotel-partenaire-card-header-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ReservationHotel-partenaire-card-header-info {
  flex: 1 1;
  background-color: #0C447E;
  color: white;
  padding: 12px;
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: space-between;
}

.ReservationHotel-partenaire-title-container {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 7px;
}

.ReservationHotel-partenaire-hotel-name-container {
  flex: 1 1;
  min-width: 0;
  padding-right: 8px;
}

.ReservationHotel-partenaire-hotel-name {
  font-size: 18px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  display: flex;
  align-items: center;
  gap: 6px;
}

/* Icône de l'œil */
.ReservationHotel-partenaire-eye-icon {
  cursor: pointer;
  opacity: 0.8;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.ReservationHotel-partenaire-eye-icon:hover {
  opacity: 1;
  transform: scale(1.1);
}

.ReservationHotel-partenaire-header-details {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-top: auto;
}

.ReservationHotel-partenaire-info-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  height: 20px;
  overflow: hidden;
}

.ReservationHotel-partenaire-info-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ReservationHotel-partenaire-status {
  text-align: right;
  flex-shrink: 0;
}

.ReservationHotel-partenaire-status-badge {
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  display: inline-block;
  color: white;
}

.ReservationHotel-partenaire-card-body {
  padding: 20px;
}

.ReservationHotel-partenaire-detail-row {
  display: flex;
  justify-content: space-between;
  padding: 10px 0;
  border-bottom: 1px solid #f0f0f0;
  align-items: center;
}

.ReservationHotel-partenaire-detail-row:last-of-type {
  border-bottom: none;
  margin-bottom: 20px;
}

.ReservationHotel-partenaire-label {
  color: #94a3b8;
  font-size: 14px;
}

.ReservationHotel-partenaire-value {
  font-weight: 600;
  text-align: right;
  color: #0f3460;
}

.ReservationHotel-partenaire-actions {
  display: flex;
  gap: 10px;
}

.ReservationHotel-partenaire-approve-btn,
.ReservationHotel-partenaire-cancel-btn {
  flex: 1 1;
  padding: 12px;
  border: none;
  border-radius: 6px;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  transition: all 0.2s ease;
}

.ReservationHotel-partenaire-approve-btn {
  background-color: #b7e4c7;
  color: #2d6a4f;
}

.ReservationHotel-partenaire-approve-btn:hover {
  background-color: #95d5b2;
}

.ReservationHotel-partenaire-cancel-btn {
  background-color: #f87171;
  color: white;
}

.ReservationHotel-partenaire-cancel-btn:hover {
  background-color: #ef4444;
}

/* Style de pagination */
.ReservationHotel-partenaire-pagination {
  display: flex;
  justify-content: center;
  margin-top: 30px;
  gap: 8px;
}

.ReservationHotel-partenaire-pagination-btn {
  min-width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e0e0e0;
  background-color: white;
  color: #333;
  font-size: 14px;
  cursor: pointer;
  border-radius: 6px;
  transition: all 0.2s;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.ReservationHotel-partenaire-pagination-btn:hover:not(:disabled) {
  background-color: #f0f0f0;
  transform: translateY(-1px);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
}

.ReservationHotel-partenaire-pagination-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.ReservationHotel-partenaire-pagination-active {
  background-color: #003a85;
  color: white;
  border-color: #003a85;
  font-weight: 600;
}

.ReservationHotel-partenaire-pagination-active:hover {
  background-color: #002b63;
}

/* Styles pour le popup */
.ReservationHotel-partenaire-popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  padding: 20px;
}

.ReservationHotel-partenaire-popup-content {
  background-color: white;
  border-radius: 12px;
  width: 100%;
  max-width: 600px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
  animation: fadeIn 0.3s ease-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.ReservationHotel-partenaire-popup-header {
  background-color: #0C447E;
  color: white;
  padding: 16px 20px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.ReservationHotel-partenaire-popup-title {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
}

.ReservationHotel-partenaire-popup-close {
  background: none;
  border: none;
  color: white;
  font-size: 24px;
  cursor: pointer;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: background-color 0.2s ease;
}

.ReservationHotel-partenaire-popup-close:hover {
  background-color: rgba(255, 255, 255, 0.2);
}

.ReservationHotel-partenaire-popup-body {
  padding: 20px;
}

.ReservationHotel-partenaire-popup-image-container {
  width: 100%;
  height: 200px;
  overflow: hidden;
  border-radius: 8px;
  margin-bottom: 20px;
}

.ReservationHotel-partenaire-popup-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ReservationHotel-partenaire-popup-info {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ReservationHotel-partenaire-popup-status {
  margin-bottom: 10px;
}

.ReservationHotel-partenaire-popup-detail {
  padding: 8px 0;
  border-bottom: 1px solid #f0f0f0;
  line-height: 1.5;
}

.ReservationHotel-partenaire-popup-detail:last-child {
  border-bottom: none;
}

.ReservationHotel-partenaire-popup-actions {
  padding: 20px;
  display: flex;
  gap: 10px;
  border-top: 1px solid #e0e0e0;
}

/* Responsive design */
@media (max-width: 1100px) {
  .ReservationHotel-partenaire-card {
    width: calc(50% - 10px);
    max-width: 450px;
  }
}

@media (max-width: 768px) {
  .ReservationHotel-partenaire-container {
    padding: 15px;
    max-width: 95%;
  }
  
  .ReservationHotel-partenaire-title {
    font-size: 20px;
  }
  
  .ReservationHotel-partenaire-card {
    width: 100%;
  }
  
  .ReservationHotel-partenaire-popup-content {
    width: 95%;
  }
}

@media (max-width: 576px) {
  .ReservationHotel-partenaire-card-header {
    flex-direction: column;
    height: auto;
  }
  
  .ReservationHotel-partenaire-card-header-image {
    width: 100%;
    height: 120px;
  }
  
  .ReservationHotel-partenaire-card-header-info {
    height: auto;
  }
  
  .ReservationHotel-partenaire-hotel-name {
    white-space: normal;
    overflow: visible;
  }
  
  .ReservationHotel-partenaire-title-container {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  
  .ReservationHotel-partenaire-status {
    margin-top: 5px;
  }
  
  .ReservationHotel-partenaire-header-details {
    margin-top: 10px;
  }
  
  .ReservationHotel-partenaire-info-row {
    height: auto;
  }
  
  .ReservationHotel-partenaire-info-text {
    white-space: normal;
  }
  
  .ReservationHotel-partenaire-detail-row {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
  }
  
  .ReservationHotel-partenaire-period-row {
    flex-direction: column;
    align-items: flex-start;
  }
  
  .ReservationHotel-partenaire-period-row .ReservationHotel-partenaire-value {
    text-align: left;
    margin-top: 5px;
  }
  
  .ReservationHotel-partenaire-popup-actions {
    flex-direction: column;
  }
}

@media (max-width: 480px) {
  .ReservationHotel-partenaire-actions {
    flex-direction: column;
  }
  
  .ReservationHotel-partenaire-pagination-btn {
    min-width: 28px;
    height: 28px;
    font-size: 12px;
  }
}


/* Styles pour les onglets */
.ReservationHotel-partenaire-category-tabs {
  display: flex;
  margin-bottom: 2rem;
  border-bottom: 1px solid #e5e7eb;
  padding: 0 10px;
  overflow-x: auto;
  scrollbar-width: none;
}

.ReservationHotel-partenaire-category-tabs::-webkit-scrollbar {
  display: none;
}

.ReservationHotel-partenaire-category-tab {
  padding: 0.8rem 1.2rem;
  font-size: 0.95rem;
  font-weight: 500;
  background: transparent;
  border: none;
  color: #6b7280;
  cursor: pointer;
  position: relative;
  transition: color 0.2s ease;
  white-space: nowrap;
  flex-shrink: 0;
}

.ReservationHotel-partenaire-category-tab.active {
  color: #0F447E;
  font-weight: 600;
}

.ReservationHotel-partenaire-category-tab.active::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  height: 2px;
  background-color: #0F447E;
}

.ReservationHotel-partenaire-category-tab:hover {
  color: #0d3a6b;
}

.ReservationHotel-partenaire-count {
  font-size: 0.85rem;
  font-weight: 500;
  margin-left: 0.3rem;
  color: #656565;
}

/* Styles pour les boutons désactivés avec tooltip */
.ReservationHotel-partenaire-actions .disabled-btn {
  position: relative;
  opacity: 0.6;
  cursor: not-allowed;
}

.ReservationHotel-partenaire-actions .disabled-btn:hover::after {
  content: "Contacter le support";
  position: absolute;
  top: -35px;
  left: 50%;
  transform: translateX(-50%);
  background: #333;
  color: white;
  padding: 5px 10px;
  border-radius: 4px;
  font-size: 12px;
  white-space: nowrap;
  z-index: 10;
}

.ReservationHotel-partenaire-actions .disabled-btn:hover::before {
  content: "";
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #333;
  z-index: 10;
}

/* Style pour le popup de contact support */
.ReservationHotel-partenaire-support-popup {
  background-color: white;
  border-radius: 12px;
  width: 90%;
  max-width: 400px;
  overflow: hidden;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
  animation: fadeIn 0.3s ease-out;
}

.ReservationHotel-partenaire-support-popup .ReservationHotel-partenaire-popup-body {
  padding: 20px;
  text-align: center;
}

.ReservationHotel-partenaire-support-popup .ReservationHotel-partenaire-popup-body p {
  margin-bottom: 10px;
  line-height: 1.5;
}

/* Message quand pas de résultats */
.ReservationHotel-partenaire-no-results {
  width: 100%;
  text-align: center;
  padding: 2rem;
  color: #64748b;
  font-size: 1.1rem;
}

.ReservationHotel-partenaire-reject-btn {
  flex: 1 1;
  padding: 12px;
  border: none;
  border-radius: 6px;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  transition: all 0.2s ease;
  background-color: #f59e0b;
  color: white;
}

.ReservationHotel-partenaire-reject-btn:hover {
  background-color: #d97706;
}

.ReservationHotel-partenaire-status-badge[style*="#f59e0b"] {
  color: white;
}

/* Style pour le statut Refusée */
.ReservationHotel-partenaire-status-badge[style*="#f59e0b"] {
  background-color: #f59e0b !important;
  color: white;
}
/* Style principal pour la page des clients partenaire */
.clients-partenaire-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
}

.page-content {
  flex: 1 1;
  margin-left: 250px; 
  padding-top: 70px; 
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Quand le sidebar est collapsé sur DESKTOP */
.clients-partenaire-page.sidebar-collapsed .page-content {
  margin-left: 70px;
  width: calc(100% - 70px);
}

/* Conteneur pour le contenu principal */
.dashboard-content {
  padding: 0 20px;
  box-sizing: border-box;
}

/* ===============================================
   MOBILE VIEW - Le contenu prend toute la largeur
   =============================================== */
.clients-partenaire-page.mobile-view .page-content {
  margin-left: 0 !important;
  width: 100% !important;
  padding-top: 80px;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 0 !important;
    width: 100% !important;
    padding-top: 80px;
  }
  
  .clients-partenaire-page.sidebar-collapsed .page-content {
    margin-left: 0 !important;
    width: 100% !important;
  }
  
  .dashboard-content {
    padding: 0 15px;
  }
}

@media (max-width: 480px) {
  .dashboard-content {
    padding: 0 10px;
  }
  
  .page-content {
    padding-top: 75px;
  }
}
.ClientsPartenaireStats-container {
  padding: 20px;
  font-family: 'Poppins', sans-serif;
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
}

.ClientsPartenaireStats-header {
  margin-bottom: 15px;
}

.ClientsPartenaireStats-title {
  display: flex;
  align-items: center;
  font-size: 1.5rem;
  font-weight: 600;
  color: #0F447E;
  margin: 0;
  white-space: nowrap;
  gap: 5px;
}

.ClientsPartenaireStats-icon-chart {
  display: flex;
  align-items: center;
}

.ClientsPartenaireStats-partenaire-text {
  color: #E30613;
}

.ClientsPartenaireStats-cards-container {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  justify-content: space-between;
}

.ClientsPartenaireStats-card {
  background-color: #FFFFFF;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  padding: 20px;
  flex: 1 1;
  min-width: 180px;
  border: 1px solid #E0E0E0;
}

.ClientsPartenaireStats-card-content {
  display: flex;
  align-items: center;
}

.ClientsPartenaireStats-icon {
  background-color: #E3F2FD;
  border-radius: 8px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 15px;
}

.ClientsPartenaireStats-info {
  display: flex;
  flex-direction: column;
}

.ClientsPartenaireStats-value {
  font-size: 1.8rem;
  font-weight: 700;
  color: #0F447E;
  margin: 0;
}

.ClientsPartenaireStats-label {
  color: #757575;
  font-size: 0.9rem;
  margin: 0;
  white-space: nowrap;
}

/* Responsive design for tablets */
@media (max-width: 992px) {
  .ClientsPartenaireStats-cards-container {
    flex-wrap: wrap;
  }
  
  .ClientsPartenaireStats-card {
    min-width: 160px;
    flex-basis: calc(50% - 10px);
    margin-bottom: 10px;
  }
}

/* Responsive design for mobile */
@media (max-width: 768px) {
  .ClientsPartenaireStats-title {
    font-size: 1.1rem;
  }
  
  .ClientsPartenaireStats-icon-chart svg {
    width: 18px;
    height: 18px;
  }
}

@media (max-width: 576px) {
  .ClientsPartenaireStats-title {
    font-size: 1rem;
  }
  
  .ClientsPartenaireStats-icon-chart svg {
    width: 16px;
    height: 16px;
  }
  
  .ClientsPartenaireStats-cards-container {
    flex-direction: column;
  }
  
  .ClientsPartenaireStats-card {
    flex-basis: 100%;
    width: 100%;
  }
  
  .ClientsPartenaireStats-value {
    font-size: 1.5rem;
  }
}
/* Container principal */
.ListClientsPartenaireVue-main-container {
  font-family: 'Poppins', sans-serif;
  padding: 20px;
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
}

/* Titre principal */
.ListClientsPartenaireVue-main-title {
  font-size: 24px;
  font-weight: 600;
  color: #0e4c90;
  margin-bottom: 20px;
  white-space: nowrap;
}

.ListClientsPartenaireVue-main-title-highlight {
  color: #e63946;
}

/* Container de la liste */
.ListClientsPartenaireVue-container {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  padding: 0;
  margin-top: 10px;
  overflow: hidden;
}

/* En-tête de la liste */
.ListClientsPartenaireVue-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid #f0f0f0;
}

.ListClientsPartenaireVue-title {
  font-size: 16px;
  font-weight: 600;
  color: #0e4c90;
  margin: 0;
}

.ListClientsPartenaireVue-title-c {
  color: #e63946;
}

/* Tableau avec barre de défilement */
.ListClientsPartenaireVue-table-container {
  overflow-x: auto;
  max-height: 500px;
  overflow-y: auto;
  position: relative;
}

/* Style de la table */
.ListClientsPartenaireVue-table {
  width: 100%;
  border-collapse: collapse;
}

.ListClientsPartenaireVue-th, 
.ListClientsPartenaireVue-td {
  padding: 15px;
  text-align: left;
  border-bottom: 1px solid #f0f0f0;
  font-size: 14px;
}

.ListClientsPartenaireVue-th {
  font-weight: 500;
  color: #0d4583;
  background-color: #fafafa;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 1;
}

.ListClientsPartenaireVue-tr:hover {
  background-color: #f9f9f9;
}

.ListClientsPartenaireVue-tr:last-child .ListClientsPartenaireVue-td {
  border-bottom: none;
}

.ListClientsPartenaireVue-td {
  color: #333;
}

/* Style des actions */
.ListClientsPartenaireVue-actions {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
}

.ListClientsPartenaireVue-action-btn {
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  width: 30px;
  height: 30px;
  border-radius: 4px;
  transition: background-color 0.2s;
}

.ListClientsPartenaireVue-view-btn {
  color: #4CAF50;
  background-color: #e8f5e9;
}

.ListClientsPartenaireVue-view-btn:hover {
  background-color: rgba(76, 175, 80, 0.2);
}

/* Style de pagination */
.ListClientsPartenaireVue-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 20px 0;
  gap: 5px;
}

.ListClientsPartenaireVue-pagination-btn {
  background-color: #f0f4f9;
  border: none;
  color: #333;
  padding: 8px 12px;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.3s;
  min-width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
}

.ListClientsPartenaireVue-pagination-btn:hover:not(.disabled) {
  background-color: #e9f5fb;
}

.ListClientsPartenaireVue-pagination-btn.active {
  background-color: #0e4c90;
  color: white;
}

.ListClientsPartenaireVue-pagination-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Modal */
.ListClientsPartenaireVue-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.ListClientsPartenaireVue-modal-content {
  background-color: #fff;
  border-radius: 8px;
  width: 90%;
  max-width: 600px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

.ListClientsPartenaireVue-modal-header {
  padding: 15px 20px;
  border-bottom: 1px solid #f0f0f0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.ListClientsPartenaireVue-modal-header h3 {
  margin: 0;
  color: #0e4c90;
  font-size: 18px;
  font-weight: 600;
}

.ListClientsPartenaireVue-modal-close {
  background: transparent;
  border: none;
  font-size: 24px;
  cursor: pointer;
  color: #666;
}

.ListClientsPartenaireVue-modal-body {
  padding: 20px;
}

.ListClientsPartenaireVue-modal-details {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.ListClientsPartenaireVue-detail-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 8px;
}

.ListClientsPartenaireVue-detail-label {
  font-weight: 600;
  color: #333;
  width: 180px;
}

.ListClientsPartenaireVue-detail-value {
  color: #666;
  flex: 1 1;
}

/* Message d'absence de clients */
.ListClientsPartenaireVue-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px;
  text-align: center;
  background-color: #f8f9fa;
  border-radius: 8px;
  margin: 20px;
  color: #666;
  font-size: 16px;
  font-weight: 500;
}

.ListClientsPartenaireVue-empty::before {
  content: '👥';
  font-size: 48px;
  margin-bottom: 16px;
  display: block;
  opacity: 0.5;
}

/* Responsive */
@media (max-width: 992px) {
  .ListClientsPartenaireVue-table {
    min-width: 800px;
  }
}

@media (max-width: 768px) {
  .ListClientsPartenaireVue-main-container {
    padding: 10px;
  }
  
  .ListClientsPartenaireVue-main-title {
    font-size: 18px;
  }
  
  .ListClientsPartenaireVue-title {
    font-size: 14px;
  }
  
  /* IMPORTANT: Masquer les colonnes non essentielles sur mobile */
  .ListClientsPartenaireVue-th:not(:first-child):not(:last-child),
  .ListClientsPartenaireVue-td:not(:first-child):not(:last-child) {
    display: none;
  }
  
  /* Ajuster la largeur des colonnes visibles sur mobile */
  .ListClientsPartenaireVue-th:first-child,
  .ListClientsPartenaireVue-td:first-child {
    width: 70%;
    padding-left: 15px;
  }
  
  .ListClientsPartenaireVue-th:last-child,
  .ListClientsPartenaireVue-td:last-child {
    width: 30%;
    text-align: center;
    padding-right: 15px;
  }
  
  /* Centrer le titre "Actions" sur mobile */
  .ListClientsPartenaireVue-th:last-child {
    text-align: center !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  
  /* Forcer le centrage de la cellule d'actions */
  .ListClientsPartenaireVue-td:last-child {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  
  /* Centrer les boutons d'actions sur mobile */
  .ListClientsPartenaireVue-actions {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
  }
  
  /* Supprimer le défilement horizontal sur mobile */
  .ListClientsPartenaireVue-table-container {
    overflow-x: hidden;
  }
  
  .ListClientsPartenaireVue-table {
    min-width: 100%;
  }
  
  .ListClientsPartenaireVue-th, 
  .ListClientsPartenaireVue-td {
    padding: 12px 10px;
    font-size: 13px;
  }
  
  .ListClientsPartenaireVue-action-btn {
    width: 32px;
    height: 32px;
    font-size: 16px;
  }
  
  .ListClientsPartenaireVue-pagination {
    flex-wrap: wrap;
  }
  
  .ListClientsPartenaireVue-modal-content {
    width: 95%;
  }
  
  .ListClientsPartenaireVue-detail-label {
    width: 100%;
    margin-bottom: 2px;
  }
  
  .ListClientsPartenaireVue-empty {
    padding: 40px 15px;
    margin: 15px;
    font-size: 14px;
  }
  
  .ListClientsPartenaireVue-empty::before {
    font-size: 40px;
    margin-bottom: 12px;
  }
}

@media (max-width: 480px) {
  .ListClientsPartenaireVue-main-container {
    padding: 8px;
  }
  
  .ListClientsPartenaireVue-container {
    border-radius: 6px;
  }
  
  .ListClientsPartenaireVue-header {
    padding: 12px 15px;
  }
  
  .ListClientsPartenaireVue-th, 
  .ListClientsPartenaireVue-td {
    padding: 10px 8px;
    font-size: 12px;
  }
  
  .ListClientsPartenaireVue-th:first-child,
  .ListClientsPartenaireVue-td:first-child {
    padding-left: 12px;
  }
  
  .ListClientsPartenaireVue-th:last-child,
  .ListClientsPartenaireVue-td:last-child {
    padding-right: 12px;
  }
  
  .ListClientsPartenaireVue-pagination-btn {
    min-width: 28px;
    height: 28px;
    font-size: 12px;
    padding: 6px 8px;
  }
  
  .ListClientsPartenaireVue-modal-header {
    padding: 12px 15px;
  }
  
  .ListClientsPartenaireVue-modal-header h3 {
    font-size: 16px;
  }
  
  .ListClientsPartenaireVue-modal-body {
    padding: 15px;
  }
}

/* Optimisations pour très petits écrans */
@media (max-width: 320px) {
  .ListClientsPartenaireVue-main-title {
    font-size: 16px;
  }
  
  .ListClientsPartenaireVue-title {
    font-size: 13px;
  }
  
  .ListClientsPartenaireVue-th, 
  .ListClientsPartenaireVue-td {
    padding: 8px 6px;
    font-size: 11px;
  }
  
  .ListClientsPartenaireVue-action-btn {
    width: 28px;
    height: 28px;
    font-size: 14px;
  }
}
/* Style principal pour la page de détail client partenaire */
.client-detail-partenaire-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
  margin-top: 30px;
}

.page-content {
  flex: 1 1;
  margin-left: 250px;
  padding-top: 70px;
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Quand le sidebar est collapsé sur DESKTOP */
.client-detail-partenaire-page.sidebar-collapsed .page-content {
  margin-left: 70px;
  width: calc(100% - 70px);
}

/* Conteneur pour le contenu du dashboard */
.dashboard-content {
  padding: 0 20px;
  box-sizing: border-box;
}

/* ===============================================
   MOBILE VIEW - Le contenu prend toute la largeur
   =============================================== */
.client-detail-partenaire-page.mobile-view .page-content {
  margin-left: 0 !important;
  width: 100% !important;
  padding-top: 80px;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 0 !important;
    width: 100% !important;
    padding-top: 80px;
  }
  
  .client-detail-partenaire-page.sidebar-collapsed .page-content {
    margin-left: 0 !important;
    width: 100% !important;
  }
  
  .dashboard-content {
    padding: 0 15px;
  }
}

@media (max-width: 480px) {
  .dashboard-content {
    padding: 0 10px;
  }
  
  .page-content {
    padding-top: 75px;
  }
}
/* ClientDetailProfilCard-partenaire.css */
:root {
  --primary-blue: #0F447E;
  --text-gray: #707070;
  --active-green: #5ece5e;
  --inactive-red: #e30613;
  --card-background: #ffffff;
  --body-background: #f5f5f5;
  --border-radius: 8px;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-family: 'Poppins', sans-serif;
}

.ClientDetailProfilCard-partenaire-container {
  max-width: 1920px;
  margin: 0 auto;
  padding: 20px;
}

.ClientDetailProfilCard-partenaire-header {
  margin-bottom: 20px;
}

.ClientDetailProfilCard-partenaire-retour-btn {
  background: none;
  border: none;
  color: #0F447E;
  color: var(--primary-blue);
  font-size: 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  padding: 0;
  margin-bottom: 10px;
}

.ClientDetailProfilCard-partenaire-retour-icon {
  margin-right: 5px;
}

.ClientDetailProfilCard-partenaire-details-title {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 15px;
}

.ClientDetailProfilCard-partenaire-details-text {
  color: #0F447E;
  color: var(--primary-blue);
}

.ClientDetailProfilCard-partenaire-clients-text {
  color: #e30613;
}

.ClientDetailProfilCard-partenaire-card {
  background-color: #ffffff;
  background-color: var(--card-background);
  border-radius: 8px;
  border-radius: var(--border-radius);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  padding: 20px;
  display: flex;
  flex-direction: row;
}

.ClientDetailProfilCard-partenaire-avatar-container {
  padding: 20px;
  background-color: #f8f8f8;
  border-radius: 8px;
  border-radius: var(--border-radius);
  width: 200px;
  height: 220px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 30px;
}

.ClientDetailProfilCard-partenaire-avatar {
  width: 150px;
  height: 150px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.ClientDetailProfilCard-partenaire-person-icon {
  width: 100px;
  height: 100px;
  fill: #0F447E;
  fill: var(--primary-blue);
}

.ClientDetailProfilCard-partenaire-info {
  flex: 1 1;
}

.ClientDetailProfilCard-partenaire-info-row {
  display: flex;
  padding: 10px 0;
  border-bottom: 1px solid #f0f0f0;
  flex-wrap: wrap;
}

.ClientDetailProfilCard-partenaire-info-row:last-child {
  border-bottom: none;
}

.ClientDetailProfilCard-partenaire-info-label {
  width: 30%;
  min-width: 120px;
  color: #707070;
  color: var(--text-gray);
  font-size: 15px;
}

.ClientDetailProfilCard-partenaire-info-value {
  flex: 1 1;
  color: #0F447E;
  color: var(--primary-blue);
  font-weight: 500;
  font-size: 15px;
  word-break: break-word;
}

.ClientDetailProfilCard-partenaire-status-badge {
  color: white;
  padding: 5px 15px;
  border-radius: 4px;
  font-size: 14px;
}

.ClientDetailProfilCard-partenaire-status-badge.active {
  background-color: #5ece5e;
  background-color: var(--active-green);
}

.ClientDetailProfilCard-partenaire-status-badge.inactive {
  background-color: #e30613;
  background-color: var(--inactive-red);
}

/* Responsive styles */
@media screen and (max-width: 768px) {
  .ClientDetailProfilCard-partenaire-card {
    flex-direction: column;
  }
  
  .ClientDetailProfilCard-partenaire-avatar-container {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;
    padding: 15px;
  }
  
  .ClientDetailProfilCard-partenaire-avatar {
    width: 120px;
    height: 120px;
  }
  
  .ClientDetailProfilCard-partenaire-person-icon {
    width: 80px;
    height: 80px;
  }
  
  .ClientDetailProfilCard-partenaire-info-label {
    width: 40%;
    min-width: 120px;
  }
}

@media screen and (max-width: 480px) {
  .ClientDetailProfilCard-partenaire-container {
    padding: 10px;
  }
  
  .ClientDetailProfilCard-partenaire-details-title {
    font-size: 20px;
  }
  
  .ClientDetailProfilCard-partenaire-card {
    padding: 15px;
  }
  
  .ClientDetailProfilCard-partenaire-info-label {
    min-width: 100px;
    font-size: 14px;
  }
  
  .ClientDetailProfilCard-partenaire-info-value {
    font-size: 14px;
  }
}
.ClientStat-partenaire-container {
  width: 100%;
  max-width: 1920px;
  border-radius: 8px;
  box-sizing: border-box;
  font-family: 'Poppins', sans-serif;
  overflow-x: hidden;
}

.ClientStat-partenaire-header {
  display: flex;
  align-items: center;
  margin-bottom: 25px;
}

.ClientStat-partenaire-chart-icon {
  color: #0F447E;
  margin-right: 12px;
}

.ClientStat-partenaire-title {
  font-size: 24px;
  font-weight: 600;
  color: #0F447E;
  margin: 0;
}

.ClientStat-partenaire-client-text {
  color: #e30613;
}

.ClientStat-partenaire-cards-container {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}

.ClientStat-partenaire-card {
  background-color: white;
  border-radius: 12px;
  padding: 18px 22px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  display: flex;
  align-items: center;
  flex: 1 1;
  min-width: 200px;
}

.ClientStat-partenaire-icon-container {
  background-color: #f0f0f0;
  width: 48px;
  height: 48px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 15px;
  color: #0F447E;
}

.ClientStat-partenaire-info {
  display: flex;
  flex-direction: column;
}

.ClientStat-partenaire-number {
  font-size: 24px;
  font-weight: 700;
  color: #0F447E;
  margin: 0 0 5px 0;
}

.ClientStat-partenaire-description {
  font-size: 14px;
  color: #6c757d;
  margin: 0;
}

/* Responsive design */
@media (max-width: 768px) {
  .ClientStat-partenaire-cards-container {
    flex-direction: column;
  }
  
  .ClientStat-partenaire-card {
    width: 100%;
  }
  
  .ClientStat-partenaire-container {
    margin: 20px;
    padding: 15px;
  }
}

@media (max-width: 480px) {
  .ClientStat-partenaire-header {
    flex-direction: row;
    align-items: center;
  }
  
  .ClientStat-partenaire-title {
    font-size: 18px;
  }
  
  .ClientStat-partenaire-container {
    margin: 15px;
    padding: 10px;
  }
}
/* ClientsHistoriqueReservation-partenaire.css */

/* Conteneur principal */
.ClientsHistoriqueReservation-partenaire-container {
  width: 100%;
  max-width: 1920px;
  margin: 20px auto;
  padding: clamp(10px, 3vw, 15px);
  background: #ffffff;
  border: 1px solid #0f447e;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  box-sizing: border-box;
  font-family: 'Poppins', sans-serif;
  overflow-x: hidden;
}

/* En-tête principal */
.ClientsHistoriqueReservation-partenaire-header-main {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  padding: 0 0 16px 0;
  border-bottom: 1px solid #0c447e;
  margin-bottom: 20px;
  width: 100%;
  box-sizing: border-box;
  overflow-x: hidden;
}

.ClientsHistoriqueReservation-partenaire-icon {
  color: #0f447e;
  font-size: 22px;
  margin-right: 10px;
  flex-shrink: 0;
}

.ClientsHistoriqueReservation-partenaire-main-title {
  font-family: 'Poppins', sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: #0f447e;
  margin: 0;
  overflow-wrap: break-word;
}

.ClientsHistoriqueReservation-partenaire-highlight {
  color: #ef4444;
}

/* Contenu */
.ClientsHistoriqueReservation-partenaire-content {
  padding: 0;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #0c447e #f0f0f0;
  width: 100%;
  box-sizing: border-box;
}

/* Élément de réservation */
.ClientsHistoriqueReservation-partenaire-item {
  padding: 16px;
  border-bottom: 1px solid #eaeaea;
  margin: 0 0 15px 0;
  border-radius: 8px;
  background-color: #f9f9f9;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
  position: relative;
  width: 100%;
  box-sizing: border-box;
}

.ClientsHistoriqueReservation-partenaire-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  flex-wrap: wrap;
  gap: 10px;
  width: 100%;
  box-sizing: border-box;
}

.ClientsHistoriqueReservation-partenaire-title {
  font-size: clamp(14px, 4vw, 16px);
  font-weight: 600;
  color: #0c447e;
  margin: 0;
  overflow-wrap: break-word;
  max-width: 100%;
}

/* Styles des statuts */
.ClientsHistoriqueReservation-partenaire-status {
  padding: 4px 12px;
  border-radius: 50px;
  font-size: clamp(11px, 3vw, 12px);
  font-weight: 500;
  white-space: nowrap;
}

.ClientsHistoriqueReservation-partenaire-status-annulee {
  background-color: #fef2f2;
  color: #dc2626;
  border: 1px solid #fecaca;
}

.ClientsHistoriqueReservation-partenaire-status-rejetee {
  background-color: #fef2f2;
  color: #b91c1c;
  border: 1px solid #fca5a5;
}

.ClientsHistoriqueReservation-partenaire-status-confirmee {
  background-color: #f0fdf4;
  color: #16a34a;
  border: 1px solid #bbf7d0;
}

.ClientsHistoriqueReservation-partenaire-status-en-paiement {
  background-color: #f0fdf4;
  color: #58b175;
  border: 1px solid #bbf7d0;
}

.ClientsHistoriqueReservation-partenaire-status-en-attente {
  background-color: #fefce8;
  color: #ca8a04;
  border: 1px solid #fde047;
}

.ClientsHistoriqueReservation-partenaire-status-en-traitement {
  background-color: #eff6ff;
  color: #2563eb;
  border: 1px solid #bfdbfe;
}

.ClientsHistoriqueReservation-partenaire-status-remboursement {
  background-color: #eff6ff;
  color: #2563eb;
  border: 1px solid #bfdbfe;
}

/* Bouton Voir appartement */
.ClientsHistoriqueReservation-partenaire-view-btn {
  background-color: #ffffff;
  color: white;
  background-color: #0f447e;
  border: 1px solid #0f447e;
  padding: 4px 12px;
  border-radius: 50px;
  font-size: clamp(11px, 3vw, 12px);
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
  font-family: 'Poppins', sans-serif;
  outline: none;
  position: absolute;
  bottom: 16px;
  right: 16px;
  max-width: 100%;
}

.ClientsHistoriqueReservation-partenaire-view-btn:hover {
  background-color: #0f447e;
  color: white;
  border-color: #0f447e;
}

.ClientsHistoriqueReservation-partenaire-view-btn:disabled {
  background-color: #f5f5f5;
  color: #b0bec5;
  border-color: #b0bec5;
  cursor: not-allowed;
}

/* Détails de la réservation */
.ClientsHistoriqueReservation-partenaire-details {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  grid-gap: clamp(8px, 2vw, 12px);
  gap: clamp(8px, 2vw, 12px);
  margin-bottom: 40px;
  width: 100%;
  box-sizing: border-box;
}

.ClientsHistoriqueReservation-partenaire-detail {
  display: flex;
  flex-direction: column;
  max-width: 100%;
}

.ClientsHistoriqueReservation-partenaire-label {
  font-size: clamp(12px, 3vw, 13px);
  color: #5a6474;
  margin-bottom: 6px;
  overflow-wrap: break-word;
}

.ClientsHistoriqueReservation-partenaire-value {
  font-size: clamp(13px, 3.5vw, 14px);
  color: #333;
  font-weight: 500;
  overflow-wrap: break-word;
  max-width: 100%;
}

.ClientsHistoriqueReservation-partenaire-type {
  color: #0c447e;
}

/* État vide */
.ClientsHistoriqueReservation-partenaire-empty {
  padding: 40px 20px;
  text-align: center;
  color: #5a6474;
}

/* Chargement */
.ClientsHistoriqueReservation-partenaire-loading {
  padding: 40px 20px;
  text-align: center;
  color: #5a6474;
}

/* Erreur */
.ClientsHistoriqueReservation-partenaire-error {
  padding: 40px 20px;
  text-align: center;
  color: #dc2626;
}

/* Réactivité */
@media (max-width: 1024px) {
  .ClientsHistoriqueReservation-partenaire-details {
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  }
}

@media (max-width: 768px) {
  .ClientsHistoriqueReservation-partenaire-container {
    max-width: calc(100% - 60px);
  }

  .ClientsHistoriqueReservation-partenaire-details {
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  }
}

@media (max-width: 480px) {
  .ClientsHistoriqueReservation-partenaire-container {
    margin: 10px 0;
    width: 100%;
    max-width: 100%;
    padding: 10px;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .ClientsHistoriqueReservation-partenaire-details {
    grid-template-columns: 1fr;
    gap: 8px;
    max-width: 100%;
  }

  .ClientsHistoriqueReservation-partenaire-detail {
    flex-direction: row;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    max-width: 100%;
  }

  .ClientsHistoriqueReservation-partenaire-label {
    margin-bottom: 0;
    width: auto;
    min-width: 80px;
    font-size: clamp(11px, 3vw, 12px);
  }

  .ClientsHistoriqueReservation-partenaire-value {
    font-size: clamp(12px, 3.5vw, 13px);
  }

  .ClientsHistoriqueReservation-partenaire-view-btn {
    position: static;
    margin-top: 8px;
    width: 100%;
    text-align: center;
    max-width: 100%;
  }

  .ClientsHistoriqueReservation-partenaire-header {
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 100%;
  }

  .ClientsHistoriqueReservation-partenaire-title {
    font-size: clamp(13px, 4vw, 15px);
  }

  .ClientsHistoriqueReservation-partenaire-status {
    font-size: clamp(10px, 3vw, 11px);
  }
}
/* Style principal pour la page d'édition d'appartement */
.editing-appartement-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
}

.page-content {
  flex: 1 1;
  margin-left: 250px; 
  padding-top: 70px; 
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Quand le sidebar est collapsé sur DESKTOP */
.editing-appartement-page.sidebar-collapsed .page-content {
  margin-left: 70px;
  width: calc(100% - 70px);
}

/* Conteneur pour le contenu principal */
.dashboard-content {
  padding: 0 20px;
  box-sizing: border-box;
}

/* ===============================================
   MOBILE VIEW - Le contenu prend toute la largeur
   =============================================== */
.editing-appartement-page.mobile-view .page-content {
  margin-left: 0 !important;
  width: 100% !important;
  padding-top: 80px;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .page-content {
    margin-left: 0 !important;
    width: 100% !important;
    padding-top: 80px;
  }
  
  .editing-appartement-page.sidebar-collapsed .page-content {
    margin-left: 0 !important;
    width: 100% !important;
  }
  
  .dashboard-content {
    padding: 0 15px;
  }
}

@media (max-width: 480px) {
  .dashboard-content {
    padding: 0 10px;
  }
  
  .page-content {
    padding-top: 75px;
  }
}

/* ===============================================
   PAGE D'ERREUR - ACCÈS NON AUTORISÉ
   =============================================== */
.editing-appartement-error-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #f5f7f9 0%, #e9ecef 100%);
  padding: 2rem;
}

.error-content {
  background: white;
  padding: 3rem;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  text-align: center;
  max-width: 500px;
  width: 100%;
  animation: fadeInScale 0.4s ease-out;
}

@keyframes fadeInScale {
  from {
    opacity: 0;
    transform: scale(0.95);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.error-content h2 {
  color: #dc3545;
  font-size: 1.8rem;
  margin-bottom: 1rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.error-content h2::before {
  content: '⚠️';
  font-size: 2rem;
}

.error-content p {
  color: #6c757d;
  font-size: 1.1rem;
  margin-bottom: 2rem;
  line-height: 1.6;
}

.btn-return-login {
  padding: 0.875rem 2rem;
  background-color: #0f447e;
  color: white;
  border: none;
  border-radius: 8px;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
  display: inline-block;
  text-decoration: none;
}

.btn-return-login:hover {
  background-color: #0a2f5c;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(15, 68, 126, 0.3);
}

.btn-return-login:active {
  transform: translateY(0);
}

/* Responsive pour la page d'erreur */
@media (max-width: 768px) {
  .editing-appartement-error-page {
    padding: 1.5rem;
  }

  .error-content {
    padding: 2rem;
  }
  
  .error-content h2 {
    font-size: 1.5rem;
  }
  
  .error-content h2::before {
    font-size: 1.75rem;
  }
  
  .error-content p {
    font-size: 1rem;
  }
  
  .btn-return-login {
    width: 100%;
    padding: 1rem;
  }
}

@media (max-width: 480px) {
  .error-content {
    padding: 1.5rem;
  }
  
  .error-content h2 {
    font-size: 1.3rem;
    flex-direction: column;
    gap: 0.25rem;
  }
  
  .error-content p {
    font-size: 0.95rem;
    margin-bottom: 1.5rem;
  }
}
/* ================================
   Variables CSS
   ================================ */
:root {
  --primary-red: #e30613;
  --primary-blue: #0f447e;
  --light-blue: #1a5a9e;
  --dark-blue: #0a2f5c;
  --light-gray: #f8f9fa;
  --medium-gray: #e9ecef;
  --border-gray: #dee2e6;
  --text-dark: #212529;
  --text-medium: #6c757d;
  --text-light: #adb5bd;
  --success-green: #0f447e;
  --warning-orange: #ffc107;
  --error-red: #dc3545;
  --white: #ffffff;
  --shadow-light: 0 2px 4px rgba(0, 0, 0, 0.1);
  --shadow-medium: 0 4px 8px rgba(0, 0, 0, 0.15);
  --shadow-strong: 0 8px 16px rgba(0, 0, 0, 0.2);
  --radius-small: 6px;
  --radius-medium: 8px;
  --radius-large: 12px;
  --transition-fast: 0.2s ease;
  --transition-medium: 0.3s ease;
}

/* ================================
   Container Principal - CORRIGÉ
   ================================ */
.edit-appartement-container {
  width: 100%;
  min-height: 100vh;
  background-color: #f8f9fa;
  background-color: var(--light-gray);
  padding: 2rem 1rem;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}

.Ed-ajoutAppartementPopup-content {
  max-width: 1400px;
  width: 100%;
  margin: 0 auto;
  background-color: #ffffff;
  background-color: var(--white);
  border-radius: 12px;
  border-radius: var(--radius-large);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  box-shadow: var(--shadow-medium);
  padding: 2.5rem;
  min-height: auto;
}

/* ================================
   Header
   ================================ */
.edit-appartement-header {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 2px solid #dee2e6;
  border-bottom: 2px solid var(--border-gray);
}

.edit-appartement-back-btn {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1.25rem;
  background-color: #ffffff;
  background-color: var(--white);
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray);
  border-radius: 8px;
  border-radius: var(--radius-medium);
  color: #212529;
  color: var(--text-dark);
  font-size: 0.95rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
}

.edit-appartement-back-btn:hover {
  background-color: #f8f9fa;
  background-color: var(--light-gray);
  border-color: #0f447e;
  border-color: var(--primary-blue);
  color: #0f447e;
  color: var(--primary-blue);
  transform: translateX(-3px);
}

.edit-appartement-header h2 {
  font-size: 1.75rem;
  font-weight: 700;
  margin: 0;
}

.edit-appartement-text-blue {
  color: #0f447e;
  color: var(--primary-blue);
}

.edit-appartement-text-red {
  color: #e30613;
  color: var(--primary-red);
}

/* ================================
   Loading & Error States
   ================================ */
.edit-appartement-loading,
.edit-appartement-error {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 400px;
  padding: 3rem;
}

.edit-appartement-loading-spinner {
  width: 50px;
  height: 50px;
  border: 4px solid #dee2e6;
  border: 4px solid var(--border-gray);
  border-top-color: #0f447e;
  border-top-color: var(--primary-blue);
  border-radius: 50%;
  animation: edit-appartement-spin 0.8s linear infinite;
  margin-bottom: 1.5rem;
}

@keyframes edit-appartement-spin {
  to {
    transform: rotate(360deg);
  }
}

.edit-appartement-loading p {
  font-size: 1.1rem;
  color: #6c757d;
  color: var(--text-medium);
  font-weight: 500;
}

.edit-appartement-error h3 {
  color: #dc3545;
  color: var(--error-red);
  font-size: 1.5rem;
  margin-bottom: 1rem;
}

.edit-appartement-error p {
  color: #6c757d;
  color: var(--text-medium);
  margin-bottom: 1.5rem;
}

.edit-appartement-retry-btn {
  padding: 0.75rem 2rem;
  background-color: #0f447e;
  background-color: var(--primary-blue);
  color: #ffffff;
  color: var(--white);
  border: none;
  border-radius: 8px;
  border-radius: var(--radius-medium);
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.2s ease;
  transition: background-color var(--transition-fast);
}

.edit-appartement-retry-btn:hover {
  background-color: #0a2f5c;
  background-color: var(--dark-blue);
}

/* ================================
   Step Content
   ================================ */
.Ed-ajoutAppartementPopup-step-content {
  margin-bottom: 2rem;
}

.Ed-ajoutAppartementPopup-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  grid-gap: 1.5rem;
  gap: 1.5rem;
}

.Ed-ajoutAppartementPopup-form-group {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.Ed-ajoutAppartementPopup-full-width {
  grid-column: 1 / -1;
}

.Ed-ajoutAppartementPopup-form-group label {
  font-size: 0.95rem;
  font-weight: 600;
  color: #212529;
  color: var(--text-dark);
}

.Ed-ajoutAppartementPopup-required {
  color: #dc3545;
  color: var(--error-red);
  margin-left: 2px;
}

/* ================================
   Input Fields
   ================================ */
.Ed-ajoutAppartementPopup-form-group input[type="text"],
.Ed-ajoutAppartementPopup-form-group input[type="number"],
.Ed-ajoutAppartementPopup-form-group input[type="time"],
.Ed-ajoutAppartementPopup-form-group input[type="email"] {
  padding: 0.75rem 1rem;
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray);
  border-radius: 8px;
  border-radius: var(--radius-medium);
  font-size: 0.95rem;
  color: #212529;
  color: var(--text-dark);
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
  background-color: #ffffff;
  background-color: var(--white);
}

/* Supprime les flèches sur les navigateurs WebKit (Chrome, Safari, Edge) */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Supprime les flèches sur Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}

/* Centre le texte dans l'input */
input[type="number"] {
  text-align: center;
}

.Ed-ajoutAppartementPopup-form-group input:focus {
  outline: none;
  border-color: #0f447e;
  border-color: var(--primary-blue);
  box-shadow: 0 0 0 3px rgba(15, 68, 126, 0.1);
}

.Ed-ajoutAppartementPopup-form-group input::placeholder {
  color: #adb5bd;
  color: var(--text-light);
}

.Ed-ajoutAppartementPopup-form-group input:disabled {
  background-color: #f8f9fa;
  background-color: var(--light-gray);
  cursor: not-allowed;
  opacity: 0.6;
}

/* ================================
   Textarea
   ================================ */
.Ed-ajoutAppartementPopup-textarea {
  padding: 1rem;
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray);
  border-radius: 8px;
  border-radius: var(--radius-medium);
  font-size: 0.95rem;
  color: #212529;
  color: var(--text-dark);
  font-family: inherit;
  resize: vertical;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
  min-height: 120px;
}

.Ed-ajoutAppartementPopup-textarea:focus {
  outline: none;
  border-color: #0f447e;
  border-color: var(--primary-blue);
  box-shadow: 0 0 0 3px rgba(15, 68, 126, 0.1);
}

/* ================================
   Search Container & Dropdown
   ================================ */
.Ed-ajoutAppartementPopup-search-container {
  position: relative;
}

.Ed-ajoutAppartementPopup-search-input {
  position: relative;
  display: flex;
  align-items: center;
}

.Ed-ajoutAppartementPopup-search-input input {
  width: 100%;
  padding: 0.75rem 2.5rem 0.75rem 1rem;
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray);
  border-radius: 8px;
  border-radius: var(--radius-medium);
  font-size: 0.95rem;
  color: #212529;
  color: var(--text-dark);
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
}

.Ed-ajoutAppartementPopup-search-input input:focus {
  outline: none;
  border-color: #0f447e;
  border-color: var(--primary-blue);
  box-shadow: 0 0 0 3px rgba(15, 68, 126, 0.1);
}

.Ed-ajoutAppartementPopup-search-icon {
  position: absolute;
  right: 1rem;
  color: #6c757d;
  color: var(--text-medium);
  pointer-events: none;
}

.Ed-ajoutAppartementPopup-dropdown {
  position: absolute;
  top: calc(100% + 0.5rem);
  left: 0;
  right: 0;
  max-height: 300px;
  overflow-y: auto;
  background-color: #ffffff;
  background-color: var(--white);
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray);
  border-radius: 8px;
  border-radius: var(--radius-medium);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  box-shadow: var(--shadow-medium);
  z-index: 1000;
}

.Ed-ajoutAppartementPopup-dropdown-item {
  padding: 0.75rem 1rem;
  cursor: pointer;
  transition: background-color 0.2s ease;
  transition: background-color var(--transition-fast);
  font-size: 0.95rem;
  color: #212529;
  color: var(--text-dark);
}

.Ed-ajoutAppartementPopup-dropdown-item:hover {
  background-color: #f8f9fa;
  background-color: var(--light-gray);
  color: #0f447e;
  color: var(--primary-blue);
}

.Ed-ajoutAppartementPopup-no-results {
  color: #6c757d;
  color: var(--text-medium);
  font-style: italic;
  cursor: default;
}

.Ed-ajoutAppartementPopup-no-results:hover {
  background-color: transparent;
  color: #6c757d;
  color: var(--text-medium);
}

/* ================================
   Checkbox Styles
   ================================ */
.Ed-ajoutAppartementPopup-checkbox-label {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  cursor: pointer;
  font-size: 0.95rem;
  color: #212529;
  color: var(--text-dark);
  padding: 0.5rem 0;
  transition: color 0.2s ease;
  transition: color var(--transition-fast);
}

.Ed-ajoutAppartementPopup-checkbox-label:hover {
  color: #0f447e;
  color: var(--primary-blue);
}

.Ed-ajoutAppartementPopup-checkbox-label input[type="checkbox"] {
  display: none;
}

.Ed-ajoutAppartementPopup-checkbox-item input[type="checkbox"] {
  display: none;
}

.Ed-ajoutAppartementPopup-checkbox-custom {
  width: 20px;
  height: 20px;
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray);
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
  flex-shrink: 0;
}

.Ed-ajoutAppartementPopup-checkbox-label
  input[type="checkbox"]:checked
  + .Ed-ajoutAppartementPopup-checkbox-custom {
  background-color: #0f447e;
  background-color: var(--primary-blue);
  border-color: #0f447e;
  border-color: var(--primary-blue);
}

.Ed-ajoutAppartementPopup-checkbox-item
  input[type="checkbox"]:checked
  + .Ed-ajoutAppartementPopup-checkbox-custom {
  background-color: #0f447e;
  background-color: var(--primary-blue);
  border-color: #0f447e;
  border-color: var(--primary-blue);
}

.Ed-ajoutAppartementPopup-checkbox-label
  input[type="checkbox"]:checked
  + .Ed-ajoutAppartementPopup-checkbox-custom::after {
  content: "✓";
  color: #ffffff;
  color: var(--white);
  font-size: 14px;
  font-weight: bold;
}

.Ed-ajoutAppartementPopup-checkbox-item
  input[type="checkbox"]:checked
  + .Ed-ajoutAppartementPopup-checkbox-custom::after {
  content: "✓";
  color: #ffffff;
  color: var(--white);
  font-size: 14px;
  font-weight: bold;
}

.Ed-ajoutAppartementPopup-checkbox-list {
  display: flex;
  flex-direction: column;
}

.Ed-ajoutAppartementPopup-checkbox-item {
  padding: 0.75rem 1rem;
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  cursor: pointer;
  transition: background-color 0.2s ease;
  transition: background-color var(--transition-fast);
}

.Ed-ajoutAppartementPopup-checkbox-item:hover {
  background-color: #f8f9fa;
  background-color: var(--light-gray);
}

/* ================================
   Dropdown Variants
   ================================ */
.Ed-ajoutAppartementPopup-caracteristiques-dropdown,
.Ed-ajoutAppartementPopup-services-dropdown,
.Ed-ajoutAppartementPopup-rules-dropdown,
.Ed-ajoutAppartementPopup-policies-dropdown {
  max-height: 350px;
}

.rule-details {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.rule-name {
  font-weight: 600;
  color: #212529;
  color: var(--text-dark);
}

.rule-description {
  font-size: 0.85rem;
  color: #6c757d;
  color: var(--text-medium);
  line-height: 1.4;
}

/* ================================
   Languages Grid
   ================================ */
.Ed-ajoutAppartementPopup-languages-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 0.75rem;
  gap: 0.75rem;
}

/* ================================
   Amenities Grid
   ================================ */
.Ed-ajoutAppartementPopup-amenities-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 0.75rem;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

/* ================================
   Options Supplémentaires
   ================================ */
.Ed-ajoutAppartementPopup-options-container {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.Ed-ajoutAppartementPopup-add-option-container {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.Ed-ajoutAppartementPopup-add-option-btn {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #0f447e;
  background-color: var(--primary-blue);
  color: #ffffff;
  color: var(--white);
  border: none;
  border-radius: 8px;
  border-radius: var(--radius-medium);
  cursor: pointer;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
  flex-shrink: 0;
}

.Ed-ajoutAppartementPopup-add-option-btn:hover:not(.disabled) {
  background-color: #0a2f5c;
  background-color: var(--dark-blue);
  transform: scale(1.05);
}

.Ed-ajoutAppartementPopup-add-option-btn.disabled {
  background-color: #adb5bd;
  background-color: var(--text-light);
  cursor: not-allowed;
  opacity: 0.5;
}

.Ed-ajoutAppartementPopup-option-limit-badge {
  font-size: 0.85rem;
  color: #6c757d;
  color: var(--text-medium);
  font-style: italic;
}

.Ed-ajoutAppartementPopup-add-option-input {
  display: flex;
  gap: 0.5rem;
  flex: 1 1;
}

.Ed-ajoutAppartementPopup-add-option-input input {
  flex: 1 1;
  padding: 0.75rem 1rem;
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray);
  border-radius: 8px;
  border-radius: var(--radius-medium);
  font-size: 0.95rem;
}

.Ed-ajoutAppartementPopup-confirm-add-option {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #0f447e;
  background-color: var(--success-green);
  color: #ffffff;
  color: var(--white);
  border: none;
  border-radius: 8px;
  border-radius: var(--radius-medium);
  cursor: pointer;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
  flex-shrink: 0;
}

.Ed-ajoutAppartementPopup-confirm-add-option:hover {
  background-color: #0a2f5c;
  background-color: var(--dark-blue);
  transform: scale(1.05);
}

/* ================================
   Images Section
   ================================ */
.Ed-ajoutAppartementPopup-images-section {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.Ed-ajoutAppartementPopup-image-upload {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  background-color: #f8f9fa;
  background-color: var(--light-gray);
  border: 2px dashed #dee2e6;
  border: 2px dashed var(--border-gray);
  border-radius: 8px;
  border-radius: var(--radius-medium);
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
}

.Ed-ajoutAppartementPopup-image-upload:hover {
  border-color: #0f447e;
  border-color: var(--primary-blue);
  background-color: #e9ecef;
  background-color: var(--medium-gray);
}

.Ed-ajoutAppartementPopup-upload-btn {
  padding: 0.75rem 1.5rem;
  background-color: #0f447e;
  background-color: var(--primary-blue);
  color: #ffffff;
  color: var(--white);
  border: none;
  border-radius: 8px;
  border-radius: var(--radius-medium);
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
  white-space: nowrap;
}

.Ed-ajoutAppartementPopup-upload-btn:hover {
  background-color: #0a2f5c;
  background-color: var(--dark-blue);
}

.Ed-ajoutAppartementPopup-upload-btn:disabled {
  background-color: #adb5bd;
  background-color: var(--text-light);
  cursor: not-allowed;
  opacity: 0.6;
}

.Ed-ajoutAppartementPopup-image-upload span {
  color: #6c757d;
  color: var(--text-medium);
  font-size: 0.9rem;
}

.Ed-ajoutAppartementPopup-images-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  grid-gap: 1rem;
  gap: 1rem;
  margin-top: 1rem;
}

.Ed-ajoutAppartementPopup-image-preview-container {
  position: relative;
  aspect-ratio: 1;
}

.Ed-ajoutAppartementPopup-image-preview {
  width: 100%;
  height: 100%;
  border-radius: 8px;
  border-radius: var(--radius-medium);
  overflow: hidden;
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray);
  position: relative;
  background-color: #f8f9fa;
  background-color: var(--light-gray);
  display: flex;
  align-items: center;
  justify-content: center;
}

.Ed-ajoutAppartementPopup-image-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.Ed-ajoutAppartementPopup-empty {
  border: 2px dashed #dee2e6;
  border: 2px dashed var(--border-gray);
  background-color: #f8f9fa;
  background-color: var(--light-gray);
}

.Ed-ajoutAppartementPopup-empty-slot {
  font-size: 2rem;
  color: #adb5bd;
  color: var(--text-light);
  font-weight: 300;
}

.Ed-ajoutAppartementPopup-remove-image-btn {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  width: 30px;
  height: 30px;
  background-color: #dc3545;
  background-color: var(--error-red);
  color: #ffffff;
  color: var(--white);
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
  z-index: 10;
}

.Ed-ajoutAppartementPopup-remove-image-btn:hover {
  background-color: #c82333;
  transform: scale(1.1);
}

/* ===== PLAN DE TARIFICATION ===== */
.Ed-ajoutAppartementPopup-tarif-row {
  transition: none !important;
}

.Ed-ajoutAppartementPopup-periode-inputs input[type="number"] {
  transition: none !important;
}

.Ed-ajoutAppartementPopup-tarif-row {
  display: flex;
  flex-direction: column;
  margin-bottom: 16px;
  padding: 12px;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  background-color: #f9f9f9;
  width: 100%;
  box-sizing: border-box;
}

.Ed-ajoutAppartementPopup-tarif-content {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}

.Ed-ajoutAppartementPopup-periode-group,
.Ed-ajoutAppartementPopup-prix-group {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.Ed-ajoutAppartementPopup-label {
  font-size: 14px;
  font-weight: 500;
  color: #333;
  margin-bottom: 6px;
  text-align: left;
}

.Ed-ajoutAppartementPopup-periode-inputs,
.Ed-ajoutAppartementPopup-prix-inputs {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.Ed-ajoutAppartementPopup-periode-inputs input[type="number"],
.Ed-ajoutAppartementPopup-periode-inputs input[type="text"] {
  background-color: #f0f0f0;
  padding: 8px;
  border-radius: 4px;
  color: #545454;
  border: 1px solid #ccc;
}

.Ed-ajoutAppartementPopup-prix-inputs input[type="number"] {
  width: 80px;
  padding: 8px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 14px;
  text-align: center;
  align-items: center;
  -moz-appearance: textfield;
}

.Ed-ajoutAppartementPopup-prix-recevoir-inputs input[type="number"] {
  background-color: #f0f0f0;
  padding: 8px;
  border-radius: 4px;
  color: #545454;
  border: 1px solid #ccc;
  align-items: center;
}

/* Responsive : sur mobile, les champs passent en colonne */
@media (max-width: 768px) {
  .Ed-ajoutAppartementPopup-price-min-group {
    flex-direction: column;
    gap: 1rem;
  }

  .Ed-ajoutAppartementPopup-price-min-group
    .Ed-ajoutAppartementPopup-form-group {
    min-width: 100%;
  }
}

/* ===== CORRECTION TAILLE IMAGE MINIATURE ===== */

/* Conteneur de l'image miniature */
.Ed-ajoutAppartementPopup-image-preview-container {
  position: relative;
  width: 150px;
  /* Largeur fixe */
  height: 150px;
  /* Hauteur fixe */
  margin-top: 1rem;
}

/* Preview de l'image miniature */
.Ed-ajoutAppartementPopup-image-preview {
  width: 100%;
  height: 100%;
  border-radius: 8px;
  border-radius: var(--radius-medium);
  overflow: hidden;
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray);
  position: relative;
  background-color: #f8f9fa;
  background-color: var(--light-gray);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Image dans le preview */
.Ed-ajoutAppartementPopup-image-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Bouton de suppression */
.Ed-ajoutAppartementPopup-remove-image-btn {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  width: 30px;
  height: 30px;
  background-color: #dc3545;
  background-color: var(--error-red);
  color: #ffffff;
  color: var(--white);
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
  z-index: 10;
}

.Ed-ajoutAppartementPopup-remove-image-btn:hover {
  background-color: #c82333;
  transform: scale(1.1);
}

/* Slot vide avec bordure en pointillés */
.Ed-ajoutAppartementPopup-image-preview.Ed-ajoutAppartementPopup-empty {
  border: 2px dashed #dee2e6;
  border: 2px dashed var(--border-gray);
  background-color: #f8f9fa;
  background-color: var(--light-gray);
  max-width: 30%;
}

.Ed-ajoutAppartementPopup-empty-slot {
  font-size: 2rem;
  color: #adb5bd;
  color: var(--text-light);
  font-weight: 300;
}

/* ===== RESPONSIVE ===== */

/* Tablettes */
@media (max-width: 768px) {
  .Ed-ajoutAppartementPopup-images-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
  }

  .Ed-ajoutAppartementPopup-image-preview-container {
    width: 120px;
    height: 120px;
  }
}

/* Mobile */
@media (max-width: 480px) {
  .Ed-ajoutAppartementPopup-images-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
  }

  .Ed-ajoutAppartementPopup-image-preview-container {
    width: 100px;
    height: 100px;
  }

  .Ed-ajoutAppartementPopup-images-grid
    .Ed-ajoutAppartementPopup-image-preview-container {
    height: 100px;
  }
}

/* ===== ZONE D'UPLOAD ===== */
.Ed-ajoutAppartementPopup-image-upload {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  background-color: #f8f9fa;
  background-color: var(--light-gray);
  border: 2px dashed #dee2e6;
  border: 2px dashed var(--border-gray);
  border-radius: 8px;
  border-radius: var(--radius-medium);
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
}

.Ed-ajoutAppartementPopup-image-upload:hover {
  border-color: #0f447e;
  border-color: var(--primary-blue);
  background-color: #e9ecef;
  background-color: var(--medium-gray);
}

.Ed-ajoutAppartementPopup-upload-btn {
  padding: 0.75rem 1.5rem;
  background-color: #0f447e;
  background-color: var(--primary-blue);
  color: #ffffff;
  color: var(--white);
  border: none;
  border-radius: 8px;
  border-radius: var(--radius-medium);
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
  white-space: nowrap;
}

.Ed-ajoutAppartementPopup-upload-btn:hover {
  background-color: #0a2f5c;
  background-color: var(--dark-blue);
}

.Ed-ajoutAppartementPopup-upload-btn:disabled {
  background-color: #adb5bd;
  background-color: var(--text-light);
  cursor: not-allowed;
  opacity: 0.6;
}

.Ed-ajoutAppartementPopup-image-upload span {
  color: #6c757d;
  color: var(--text-medium);
  font-size: 0.9rem;
}

/* ================================
   Messages
   ================================ */
/* .edit-appartement-message {
  padding: 1rem 1.5rem;
  border-radius: var(--radius-medium);
  margin-bottom: 1.5rem;
  font-size: 0.95rem;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  animation: slideDown 0.3s ease;
} */

.edit-appartement-message {
  margin: 16px 0;
  padding: 12px 16px;
  border-radius: 8px;
  font-size: 14px;
  text-align: center;
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
}

.edit-appartement-message-success {
  background-color: #d4edda;
  color: #155724;
  border: 1px solid #c3e6cb;
}

.edit-appartement-message-error {
  background-color: #f8d7da;
  color: #721c24;
  border: 1px solid #f5c6cb;
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.edit-appartement-message-success {
  background-color: #d4edda;
  color: #155724;
  border: 2px solid #c3e6cb;
}

.edit-appartement-message-error {
  background-color: #f8d7da;
  color: #721c24;
  border: 2px solid #f5c6cb;
}

.edit-appartement-message-warning {
  background-color: #fff3cd;
  color: #856404;
  border: 2px solid #ffeaa7;
}

/* ================================
   Form Actions
   ================================ */
.edit-appartement-form-actions {
  display: flex;
  justify-content: flex-end;
  gap: 1rem;
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 2px solid #dee2e6;
  border-top: 2px solid var(--border-gray);
}

.edit-appartement-btn-annuler,
.edit-appartement-btn-enregistrer {
  padding: 0.875rem 2rem;
  border-radius: 8px;
  border-radius: var(--radius-medium);
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 140px;
}

.edit-appartement-btn-annuler {
  background-color: #ffffff;
  background-color: var(--white);
  color: #212529;
  color: var(--text-dark);
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray);
}

.edit-appartement-btn-annuler:hover {
  background-color: #f8f9fa;
  background-color: var(--light-gray);
  border-color: #6c757d;
  border-color: var(--text-medium);
}

.edit-appartement-btn-enregistrer {
  background-color: #0f447e;
  background-color: var(--primary-blue);
  color: #ffffff;
  color: var(--white);
}

.edit-appartement-btn-enregistrer:hover:not(:disabled) {
  background-color: #0a2f5c;
  background-color: var(--dark-blue);
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  box-shadow: var(--shadow-medium);
}

.edit-appartement-btn-enregistrer:disabled {
  background-color: #adb5bd;
  background-color: var(--text-light);
  cursor: not-allowed;
  opacity: 0.6;
}

.edit-appartement-spinner {
  width: 20px;
  height: 20px;
  border: 3px solid rgba(255, 255, 255, 0.3);
  border-top-color: #ffffff;
  border-top-color: var(--white);
  border-radius: 50%;
  animation: edit-appartement-spin 0.6s linear infinite;
}

/* ================================
   Footer & Pagination
   ================================ */
.edit-appartement-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 2px solid #dee2e6;
  border-top: 2px solid var(--border-gray);
  flex-wrap: wrap;
  gap: 1rem;
}

.edit-appartement-pagination {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.edit-appartement-nav-btn,
.edit-appartement-page-btn {
  padding: 0.75rem 1.25rem;
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray);
  background-color: #ffffff;
  background-color: var(--white);
  color: #212529;
  color: var(--text-dark);
  border-radius: 8px;
  border-radius: var(--radius-medium);
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.edit-appartement-nav-btn:hover:not(:disabled),
.edit-appartement-page-btn:hover {
  background-color: #f8f9fa;
  background-color: var(--light-gray);
  border-color: #0f447e;
  border-color: var(--primary-blue);
  color: #0f447e;
  color: var(--primary-blue);
}

.edit-appartement-nav-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.edit-appartement-page-btn.edit-appartement-active {
  background-color: #0f447e;
  background-color: var(--primary-blue);
  color: #ffffff;
  color: var(--white);
  border-color: #0f447e;
  border-color: var(--primary-blue);
}

.edit-appartement-btn-save-draft {
  padding: 0.875rem 2rem;
  background-color: #ffffff;
  background-color: var(--white);
  color: #0f447e;
  color: var(--primary-blue);
  border: 2px solid #0f447e;
  border: 2px solid var(--primary-blue);
  border-radius: 8px;
  border-radius: var(--radius-medium);
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 180px;
}

.edit-appartement-btn-save-draft:hover:not(:disabled) {
  background-color: #0f447e;
  background-color: var(--primary-blue);
  color: #ffffff;
  color: var(--white);
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  box-shadow: var(--shadow-medium);
}

.edit-appartement-btn-save-draft:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  background-color: #adb5bd;
  background-color: var(--text-light);
  border: 2px solid #adb5bd;
  border: 2px solid var(--text-light);
}

/* ================================
   Responsive Design
   ================================ */
@media (max-width: 768px) {
  .edit-appartement-container {
    padding: 1rem 0.5rem;
  }

  .Ed-ajoutAppartementPopup-content {
    padding: 1.5rem;
    border-radius: 8px;
    border-radius: var(--radius-medium);
  }

  .edit-appartement-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
  }

  .edit-appartement-header h2 {
    font-size: 1.5rem;
  }

  .Ed-ajoutAppartementPopup-form-grid {
    grid-template-columns: 1fr;
  }

  .Ed-ajoutAppartementPopup-languages-grid,
  .Ed-ajoutAppartementPopup-amenities-grid {
    grid-template-columns: 1fr;
  }

  .Ed-ajoutAppartementPopup-images-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .edit-appartement-footer {
    flex-direction: column;
    align-items: stretch;
  }

  .edit-appartement-pagination {
    justify-content: center;
    flex-wrap: wrap;
  }

  .edit-appartement-form-actions {
    flex-direction: column;
  }

  .edit-appartement-btn-annuler,
  .edit-appartement-btn-enregistrer,
  .edit-appartement-btn-save-draft {
    width: 100%;
  }

  .Ed-ajoutAppartementPopup-tarif-content {
    gap: 1rem;
  }

  .Ed-ajoutAppartementPopup-periode-inputs {
    flex-direction: column;
    align-items: stretch;
  }

  .Ed-ajoutAppartementPopup-periode-inputs span {
    display: none;
  }

  .Ed-ajoutAppartementPopup-prix-inputs,
  .Ed-ajoutAppartementPopup-prix-recevoir-inputs {
    flex-direction: column;
  }
}

@media (max-width: 480px) {
  .edit-appartement-container {
    padding: 0.5rem 0.25rem;
  }

  .Ed-ajoutAppartementPopup-content {
    padding: 1rem;
  }

  .edit-appartement-header h2 {
    font-size: 1.25rem;
  }

  .edit-appartement-back-btn {
    padding: 0.6rem 1rem;
    font-size: 0.9rem;
  }

  .Ed-ajoutAppartementPopup-form-group label {
    font-size: 0.9rem;
  }

  .Ed-ajoutAppartementPopup-images-grid {
    grid-template-columns: 1fr;
  }

  .edit-appartement-pagination {
    gap: 0.25rem;
  }

  .edit-appartement-nav-btn,
  .edit-appartement-page-btn {
    padding: 0.6rem 1rem;
    font-size: 0.85rem;
  }
}

/* ================================
   Scrollbar Customization
   ================================ */
.Ed-ajoutAppartementPopup-dropdown::-webkit-scrollbar {
  width: 8px;
}

.Ed-ajoutAppartementPopup-dropdown::-webkit-scrollbar-track {
  background: #f8f9fa;
  background: var(--light-gray);
  border-radius: 6px;
  border-radius: var(--radius-small);
}

.Ed-ajoutAppartementPopup-dropdown::-webkit-scrollbar-thumb {
  background: #adb5bd;
  background: var(--text-light);
  border-radius: 6px;
  border-radius: var(--radius-small);
  -webkit-transition: background 0.2s ease;
  transition: background 0.2s ease;
  -webkit-transition: background var(--transition-fast);
  transition: background var(--transition-fast);
}

.Ed-ajoutAppartementPopup-dropdown::-webkit-scrollbar-thumb:hover {
  background: #6c757d;
  background: var(--text-medium);
}

/* ================================
   Focus Visible for Accessibility
   ================================ */
button:focus-visible,
input:focus-visible,
textarea:focus-visible {
  outline: 3px solid #0f447e;
  outline: 3px solid var(--primary-blue);
  outline-offset: 2px;
}

/* ================================
   Print Styles
   ================================ */
@media print {
  .edit-appartement-back-btn,
  .edit-appartement-footer,
  .edit-appartement-form-actions,
  .Ed-ajoutAppartementPopup-remove-image-btn,
  .Ed-ajoutAppartementPopup-upload-btn,
  .Ed-ajoutAppartementPopup-add-option-btn,
  .Ed-ajoutAppartementPopup-confirm-add-option {
    display: none !important;
  }

  .edit-appartement-container {
    padding: 0;
  }

  .Ed-ajoutAppartementPopup-content {
    box-shadow: none;
    border: 1px solid #dee2e6;
    border: 1px solid var(--border-gray);
  }

  .Ed-ajoutAppartementPopup-form-grid {
    page-break-inside: avoid;
    break-inside: avoid;
  }
}

/* ================================
   Additional Utility Classes
   ================================ */
.edit-appartement-hidden {
  display: none !important;
}

.edit-appartement-visible {
  display: block !important;
}

.edit-appartement-text-center {
  text-align: center;
}

.edit-appartement-text-right {
  text-align: right;
}

.edit-appartement-mt-1 {
  margin-top: 0.5rem;
}

.edit-appartement-mt-2 {
  margin-top: 1rem;
}

.edit-appartement-mb-1 {
  margin-bottom: 0.5rem;
}

.edit-appartement-mb-2 {
  margin-bottom: 1rem;
}

/* ================================
   Phone Input Customization
   ================================ */
.Ed-ajoutAppartementPopup-form-group .react-tel-input {
  width: 100%;
}

.Ed-ajoutAppartementPopup-form-group .react-tel-input .form-control {
  width: 100%;
  height: 45px;
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray);
  border-radius: 8px;
  border-radius: var(--radius-medium);
  font-size: 0.95rem;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
}

.Ed-ajoutAppartementPopup-form-group .react-tel-input .form-control:focus {
  border-color: #0f447e;
  border-color: var(--primary-blue);
  box-shadow: 0 0 0 3px rgba(15, 68, 126, 0.1);
}

.Ed-ajoutAppartementPopup-form-group .react-tel-input .flag-dropdown {
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray);
  border-right: none;
  border-radius: 8px 0 0 8px;
  border-radius: var(--radius-medium) 0 0 var(--radius-medium);
  background-color: #ffffff;
  background-color: var(--white);
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
}

.Ed-ajoutAppartementPopup-form-group .react-tel-input .flag-dropdown:hover {
  background-color: #f8f9fa;
  background-color: var(--light-gray);
}

.Ed-ajoutAppartementPopup-form-group .react-tel-input .selected-flag {
  padding: 0 0 0 12px;
}

.Ed-ajoutAppartementPopup-form-group .react-tel-input .country-list {
  border-radius: 8px;
  border-radius: var(--radius-medium);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  box-shadow: var(--shadow-medium);
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray);
  max-height: 250px;
}

.Ed-ajoutAppartementPopup-form-group
  .react-tel-input
  .country-list
  .country:hover {
  background-color: #f8f9fa;
  background-color: var(--light-gray);
}

.Ed-ajoutAppartementPopup-form-group
  .react-tel-input
  .country-list
  .country.highlight {
  background-color: #0f447e;
  background-color: var(--primary-blue);
  color: #ffffff;
  color: var(--white);
}

/* ================================
   Drag and Drop Enhancement
   ================================ */
.Ed-ajoutAppartementPopup-image-upload.drag-over {
  border-color: #0f447e;
  border-color: var(--primary-blue);
  background-color: rgba(15, 68, 126, 0.05);
}

/* ================================
   Loading States for Buttons
   ================================ */
.edit-appartement-btn-loading {
  position: relative;
  pointer-events: none;
}

.edit-appartement-btn-loading::after {
  content: "";
  position: absolute;
  width: 16px;
  height: 16px;
  top: 50%;
  left: 50%;
  margin-left: -8px;
  margin-top: -8px;
  border: 2px solid transparent;
  border-top-color: currentColor;
  border-radius: 50%;
  animation: edit-appartement-spin 0.6s linear infinite;
}

/* ================================
   Tooltip Styles
   ================================ */
.edit-appartement-tooltip {
  position: relative;
  display: inline-block;
}

.edit-appartement-tooltip::before {
  content: attr(data-tooltip);
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  padding: 0.5rem 1rem;
  background-color: #212529;
  background-color: var(--text-dark);
  color: #ffffff;
  color: var(--white);
  font-size: 0.85rem;
  white-space: nowrap;
  border-radius: 6px;
  border-radius: var(--radius-small);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
  transition: opacity var(--transition-fast);
  z-index: 1000;
}

.edit-appartement-tooltip::after {
  content: "";
  position: absolute;
  bottom: calc(100% + 2px);
  left: 50%;
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-top-color: #212529;
  border-top-color: var(--text-dark);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
  transition: opacity var(--transition-fast);
}

.edit-appartement-tooltip:hover::before,
.edit-appartement-tooltip:hover::after {
  opacity: 1;
}

/* ================================
   Badge Styles
   ================================ */
.edit-appartement-badge {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  font-size: 0.85rem;
  font-weight: 600;
  border-radius: 12px;
  line-height: 1;
}

.edit-appartement-badge-primary {
  background-color: #0f447e;
  background-color: var(--primary-blue);
  color: #ffffff;
  color: var(--white);
}

.edit-appartement-badge-success {
  background-color: #0f447e;
  background-color: var(--success-green);
  color: #ffffff;
  color: var(--white);
}

.edit-appartement-badge-warning {
  background-color: #ffc107;
  background-color: var(--warning-orange);
  color: #212529;
  color: var(--text-dark);
}

.edit-appartement-badge-error {
  background-color: #dc3545;
  background-color: var(--error-red);
  color: #ffffff;
  color: var(--white);
}

/* ================================
   Empty State
   ================================ */
.edit-appartement-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 3rem 2rem;
  text-align: center;
  color: #6c757d;
  color: var(--text-medium);
}

.edit-appartement-empty-state-icon {
  font-size: 3rem;
  margin-bottom: 1rem;
  opacity: 0.5;
}

.edit-appartement-empty-state-title {
  font-size: 1.25rem;
  font-weight: 600;
  margin-bottom: 0.5rem;
  color: #212529;
  color: var(--text-dark);
}

.edit-appartement-empty-state-description {
  font-size: 0.95rem;
  max-width: 400px;
}

/* ================================
   Card Styles for Future Use
   ================================ */
.edit-appartement-card {
  background-color: #ffffff;
  background-color: var(--white);
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray);
  border-radius: 8px;
  border-radius: var(--radius-medium);
  padding: 1.5rem;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
}

.edit-appartement-card:hover {
  border-color: #0f447e;
  border-color: var(--primary-blue);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: var(--shadow-light);
}

.edit-appartement-card-header {
  font-size: 1.1rem;
  font-weight: 600;
  color: #212529;
  color: var(--text-dark);
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 2px solid #dee2e6;
  border-bottom: 2px solid var(--border-gray);
}

.edit-appartement-card-body {
  color: #6c757d;
  color: var(--text-medium);
  line-height: 1.6;
}

/* ================================
   Animation Classes
   ================================ */
@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes slideInFromRight {
  from {
    transform: translateX(20px);
    opacity: 0;
  }

  to {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes slideInFromLeft {
  from {
    transform: translateX(-20px);
    opacity: 0;
  }

  to {
    transform: translateX(0);
    opacity: 1;
  }
}

.edit-appartement-fade-in {
  animation: fadeIn 0.3s ease;
}

.edit-appartement-slide-in-right {
  animation: slideInFromRight 0.3s ease;
}

.edit-appartement-slide-in-left {
  animation: slideInFromLeft 0.3s ease;
}

/* ================================
   Dark Mode Support (Optional)
   ================================ */
@media (prefers-color-scheme: dark) {
  .edit-appartement-container.dark-mode {
    background-color: #1a1a1a;
  }

  .edit-appartement-container.dark-mode .Ed-ajoutAppartementPopup-content {
    background-color: #2d2d2d;
    color: #e0e0e0;
  }

  .edit-appartement-container.dark-mode input,
  .edit-appartement-container.dark-mode textarea {
    background-color: #3d3d3d;
    color: #e0e0e0;
    border-color: #4d4d4d;
  }

  .edit-appartement-container.dark-mode .Ed-ajoutAppartementPopup-dropdown {
    background-color: #3d3d3d;
    border-color: #4d4d4d;
  }

  .edit-appartement-container.dark-mode
    .Ed-ajoutAppartementPopup-dropdown-item:hover {
    background-color: #4d4d4d;
  }
}

/* ================================
   Smooth Transitions
   ================================ */
* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ================================
   Accessibility Improvements
   ================================ */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

/* ================================
   Additional Responsive Adjustments
   ================================ */
@media (min-width: 769px) and (max-width: 1024px) {
  .Ed-ajoutAppartementPopup-content {
    max-width: 900px;
    padding: 2rem;
  }

  .Ed-ajoutAppartementPopup-form-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1025px) and (max-width: 1440px) {
  .Ed-ajoutAppartementPopup-content {
    max-width: 1200px;
  }
}

/* ================================
   Performance Optimizations
   ================================ */
.edit-appartement-container *,
.edit-appartement-container *::before,
.edit-appartement-container *::after {
  box-sizing: border-box;
}

/* Optimize GPU acceleration for animations */
.edit-appartement-back-btn,
.edit-appartement-nav-btn,
.edit-appartement-page-btn,
.edit-appartement-btn-annuler,
.edit-appartement-btn-enregistrer,
.edit-appartement-btn-save-draft,
.Ed-ajoutAppartementPopup-upload-btn,
.Ed-ajoutAppartementPopup-add-option-btn,
.Ed-ajoutAppartementPopup-confirm-add-option,
.Ed-ajoutAppartementPopup-remove-image-btn {
  will-change: transform;
  transform: translateZ(0);
}

/* ================================
   High Contrast Mode Support
   ================================ */
@media (prefers-contrast: high) {
  .edit-appartement-container {
    border: 2px solid currentColor;
  }

  .Ed-ajoutAppartementPopup-content {
    border: 3px solid currentColor;
  }

  .Ed-ajoutAppartementPopup-form-group input,
  .Ed-ajoutAppartementPopup-textarea {
    border-width: 3px;
  }
}

/* ================================
   Reduced Motion Support
   ================================ */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .edit-appartement-loading-spinner,
  .edit-appartement-spinner {
    animation: none;
    border-top-color: transparent;
  }
}

/* ================================
   Custom Scrollbar for Container
   ================================ */
.edit-appartement-container::-webkit-scrollbar {
  width: 12px;
}

.edit-appartement-container::-webkit-scrollbar-track {
  background: #f8f9fa;
  background: var(--light-gray);
}

.edit-appartement-container::-webkit-scrollbar-thumb {
  background: #adb5bd;
  background: var(--text-light);
  border-radius: 6px;
  border: 3px solid #f8f9fa;
  border: 3px solid var(--light-gray);
}

.edit-appartement-container::-webkit-scrollbar-thumb:hover {
  background: #6c757d;
  background: var(--text-medium);
}

/* ================================
   Focus Trap for Modals/Overlays
   ================================ */
.edit-appartement-focus-trap {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

/* ================================
   Navigation Mobile - Cacher complètement
   ================================ */

@media (max-width: 768px) {
  .edit-appartement-nav-btn {
    display: none;
  }

  /* Centrer les boutons de pagination quand les flèches sont cachées */
  .edit-appartement-pagination {
    justify-content: center;
  }
}

/* ================================
   Optimisation Images Mobile
   ================================ */

.Ed-ajoutAppartementPopup-images-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  grid-gap: 1rem;
  gap: 1rem;
  margin-top: 1rem;
}

/* Conteneur d'image optimisé pour mobile */
.Ed-ajoutAppartementPopup-image-preview-container {
  position: relative;
  aspect-ratio: 1;
  transition: transform 0.2s ease;
}

.Ed-ajoutAppartementPopup-image-preview-container:hover {
  transform: scale(1.02);
}

.Ed-ajoutAppartementPopup-image-preview {
  width: 100%;
  height: 100%;
  border-radius: 8px;
  border-radius: var(--radius-medium);
  overflow: hidden;
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray);
  position: relative;
  background-color: #f8f9fa;
  background-color: var(--light-gray);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
}

.Ed-ajoutAppartementPopup-image-preview:hover {
  border-color: #0f447e;
  border-color: var(--primary-blue);
}

.Ed-ajoutAppartementPopup-image-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.Ed-ajoutAppartementPopup-image-preview:hover img {
  transform: scale(1.05);
}

/* Style pour les slots vides */
.Ed-ajoutAppartementPopup-empty {
  border: 2px dashed #dee2e6;
  border: 2px dashed var(--border-gray);
  background-color: #f8f9fa;
  background-color: var(--light-gray);
  cursor: pointer;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
}

.Ed-ajoutAppartementPopup-empty:hover {
  border-color: #0f447e;
  border-color: var(--primary-blue);
  background-color: #e9ecef;
  background-color: var(--medium-gray);
}

.Ed-ajoutAppartementPopup-empty-slot {
  font-size: 2rem;
  color: #adb5bd;
  color: var(--text-light);
  font-weight: 300;
  transition: color 0.2s ease;
  transition: color var(--transition-fast);
}

.Ed-ajoutAppartementPopup-empty:hover .Ed-ajoutAppartementPopup-empty-slot {
  color: #0f447e;
  color: var(--primary-blue);
}

/* Bouton de suppression optimisé */
.Ed-ajoutAppartementPopup-remove-image-btn {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  width: 28px;
  height: 28px;
  background-color: #dc3545;
  background-color: var(--error-red);
  color: #ffffff;
  color: var(--white);
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
  z-index: 10;
  font-size: 14px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: var(--shadow-light);
}

.Ed-ajoutAppartementPopup-remove-image-btn:hover {
  background-color: #c82333;
  transform: scale(1.1);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  box-shadow: var(--shadow-medium);
}

/* Zone d'upload optimisée */
.Ed-ajoutAppartementPopup-image-upload {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  background-color: #f8f9fa;
  background-color: var(--light-gray);
  border: 2px dashed #dee2e6;
  border: 2px dashed var(--border-gray);
  border-radius: 8px;
  border-radius: var(--radius-medium);
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
  flex-wrap: wrap;
}

.Ed-ajoutAppartementPopup-image-upload:hover {
  border-color: #0f447e;
  border-color: var(--primary-blue);
  background-color: #e9ecef;
  background-color: var(--medium-gray);
}

.Ed-ajoutAppartementPopup-upload-btn {
  padding: 0.75rem 1.5rem;
  background-color: #0f447e;
  background-color: var(--primary-blue);
  color: #ffffff;
  color: var(--white);
  border: none;
  border-radius: 8px;
  border-radius: var(--radius-medium);
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
  white-space: nowrap;
  flex-shrink: 0;
}

.Ed-ajoutAppartementPopup-upload-btn:hover {
  background-color: #0a2f5c;
  background-color: var(--dark-blue);
  transform: translateY(-1px);
}

/* Indicateur de statut */
.Ed-ajoutAppartementPopup-image-status {
  color: #6c757d;
  color: var(--text-medium);
  font-size: 0.9rem;
  flex: 1 1;
  min-width: 0;
}

/* Badge pour images sélectionnées */
.Ed-ajoutAppartementPopup-image-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background-color: #0f447e;
  background-color: var(--primary-blue);
  color: #ffffff;
  color: var(--white);
  border-radius: 6px;
  border-radius: var(--radius-small);
  font-size: 0.85rem;
  font-weight: 500;
}

/* Overlay pour images au survol */
.Ed-ajoutAppartementPopup-image-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.7);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.2s ease;
  transition: opacity var(--transition-fast);
  border-radius: 8px;
  border-radius: var(--radius-medium);
}

.Ed-ajoutAppartementPopup-image-preview-container:hover
  .Ed-ajoutAppartementPopup-image-overlay {
  opacity: 1;
}

.Ed-ajoutAppartementPopup-image-actions {
  display: flex;
  gap: 0.5rem;
}

.Ed-ajoutAppartementPopup-image-action-btn {
  width: 36px;
  height: 36px;
  background-color: #ffffff;
  background-color: var(--white);
  color: #212529;
  color: var(--text-dark);
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
}

.Ed-ajoutAppartementPopup-image-action-btn:hover {
  background-color: #0f447e;
  background-color: var(--primary-blue);
  color: #ffffff;
  color: var(--white);
  transform: scale(1.1);
}

/* ================================
   DRAG AND DROP - NOUVELLES CLASSES
   ================================ */

/* Container pour la miniature (taille fixe 150x150) */
.Ed-ajoutAppartementPopup-miniature-container {
  width: 150px;
  height: 150px;
  margin-top: 1rem;
  position: relative;
}

/* Wrapper scrollable pour la grille d'images */
.Ed-ajoutAppartementPopup-images-grid-wrapper {
  margin-top: 1rem;
  max-height: 600px;
  overflow-y: auto;
  padding: 0.5rem;
  border: 1px solid #dee2e6;
  border: 1px solid var(--border-gray);
  border-radius: 8px;
  border-radius: var(--radius-medium);
  background-color: #f8f9fa;
  background-color: var(--light-gray);
}

/* Scrollbar personnalisée pour le wrapper */
.Ed-ajoutAppartementPopup-images-grid-wrapper::-webkit-scrollbar {
  width: 8px;
}

.Ed-ajoutAppartementPopup-images-grid-wrapper::-webkit-scrollbar-track {
  background: #f8f9fa;
  background: var(--light-gray);
  border-radius: 6px;
  border-radius: var(--radius-small);
}

.Ed-ajoutAppartementPopup-images-grid-wrapper::-webkit-scrollbar-thumb {
  background: #adb5bd;
  background: var(--text-light);
  border-radius: 6px;
  border-radius: var(--radius-small);
}

.Ed-ajoutAppartementPopup-images-grid-wrapper::-webkit-scrollbar-thumb:hover {
  background: #6c757d;
  background: var(--text-medium);
}

/* Classe pour les éléments draggables */
.Ed-ajoutAppartementPopup-draggable {
  cursor: move;
  transition: transform 0.2s ease, opacity 0.2s ease, box-shadow 0.2s ease;
}

.Ed-ajoutAppartementPopup-draggable:hover {
  transform: scale(1.02);
  z-index: 10;
}

/* État pendant le drag */
.Ed-ajoutAppartementPopup-dragging {
  opacity: 0.5;
  transform: scale(0.95);
  cursor: grabbing !important;
}

/* Poignée de déplacement */
.Ed-ajoutAppartementPopup-drag-handle {
  position: absolute;
  top: 0.5rem;
  left: 0.5rem;
  background-color: rgba(15, 68, 126, 0.9);
  color: #ffffff;
  color: var(--white);
  padding: 0.3rem;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5;
  cursor: move;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: var(--shadow-light);
}

.Ed-ajoutAppartementPopup-drag-handle:hover {
  background-color: rgba(15, 68, 126, 1);
  transform: scale(1.1);
}

.Ed-ajoutAppartementPopup-draggable:active
  .Ed-ajoutAppartementPopup-drag-handle {
  cursor: grabbing;
}

/* Numéro d'ordre de l'image */
.Ed-ajoutAppartementPopup-image-number {
  position: absolute;
  bottom: 0.5rem;
  left: 0.5rem;
  background-color: rgba(15, 68, 126, 0.9);
  color: #ffffff;
  color: var(--white);
  padding: 0.3rem 0.6rem;
  border-radius: 4px;
  font-size: 0.75rem;
  font-weight: 700;
  z-index: 5;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: var(--shadow-light);
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
}

.Ed-ajoutAppartementPopup-image-preview-container:hover
  .Ed-ajoutAppartementPopup-image-number {
  background-color: rgba(15, 68, 126, 1);
  transform: scale(1.05);
}

/* Statut des images (texte) */
.Ed-ajoutAppartementPopup-image-status {
  color: #6c757d;
  color: var(--text-medium);
  font-size: 0.9rem;
  flex: 1 1;
  min-width: 0;
}

/* Modification de la grille pour supporter 30 images */
.Ed-ajoutAppartementPopup-images-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  grid-gap: 1rem;
  gap: 1rem;
  padding: 0.5rem;
}

/* Container d'image avec aspect ratio */
.Ed-ajoutAppartementPopup-image-preview-container {
  position: relative;
  aspect-ratio: 1;
}

/* Preview optimisé */
.Ed-ajoutAppartementPopup-image-preview {
  width: 100%;
  height: 100%;
  border-radius: 8px;
  border-radius: var(--radius-medium);
  overflow: hidden;
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray);
  position: relative;
  background-color: #ffffff;
  background-color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
}

.Ed-ajoutAppartementPopup-draggable:hover
  .Ed-ajoutAppartementPopup-image-preview {
  border-color: #0f447e;
  border-color: var(--primary-blue);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  box-shadow: var(--shadow-medium);
}

/* Image elle-même */
.Ed-ajoutAppartementPopup-image-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
  -webkit-user-select: none;
          user-select: none;
  -webkit-user-drag: none;
}

.Ed-ajoutAppartementPopup-image-preview:hover img {
  transform: scale(1.05);
}

/* Animation lors du drag over */
.Ed-ajoutAppartementPopup-image-preview-container[draggable="true"] {
  transition: all 0.2s ease;
}

/* Effet visuel pendant le survol lors du drag */
.Ed-ajoutAppartementPopup-draggable::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 3px dashed #0f447e;
  border: 3px dashed var(--primary-blue);
  border-radius: 8px;
  border-radius: var(--radius-medium);
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
}

.Ed-ajoutAppartementPopup-draggable.drag-over::after {
  opacity: 1;
}

/* ================================
   RESPONSIVE - DRAG AND DROP
   ================================ */

/* Tablettes */
@media (max-width: 768px) {
  .Ed-ajoutAppartementPopup-images-grid {
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 0.75rem;
  }

  .Ed-ajoutAppartementPopup-images-grid-wrapper {
    max-height: 500px;
  }

  .Ed-ajoutAppartementPopup-drag-handle,
  .Ed-ajoutAppartementPopup-image-number {
    padding: 0.25rem 0.4rem;
    font-size: 0.7rem;
  }

  .Ed-ajoutAppartementPopup-drag-handle svg {
    width: 16px;
    height: 16px;
  }
}

/* Mobile */
@media (max-width: 480px) {
  .Ed-ajoutAppartementPopup-images-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
  }

  .Ed-ajoutAppartementPopup-images-grid-wrapper {
    max-height: 400px;
    padding: 0.25rem;
  }

  .Ed-ajoutAppartementPopup-miniature-container {
    width: 120px;
    height: 120px;
  }

  /* Simplifier les contrôles sur mobile */
  .Ed-ajoutAppartementPopup-drag-handle {
    top: 0.25rem;
    left: 0.25rem;
    padding: 0.2rem;
  }

  .Ed-ajoutAppartementPopup-image-number {
    bottom: 0.25rem;
    left: 0.25rem;
    font-size: 0.65rem;
    padding: 0.2rem 0.4rem;
  }

  .Ed-ajoutAppartementPopup-remove-image-btn {
    width: 24px;
    height: 24px;
    top: 0.25rem;
    right: 0.25rem;
  }

  .Ed-ajoutAppartementPopup-remove-image-btn svg {
    width: 14px;
    height: 14px;
  }

  /* Réduire l'effet hover sur mobile */
  .Ed-ajoutAppartementPopup-draggable:hover {
    transform: none;
  }

  .Ed-ajoutAppartementPopup-image-preview:hover img {
    transform: none;
  }
}

/* ================================
   AMÉLIORATION DE PERFORMANCE
   ================================ */

/* Optimisation GPU pour les animations */
.Ed-ajoutAppartementPopup-draggable,
.Ed-ajoutAppartementPopup-drag-handle,
.Ed-ajoutAppartementPopup-image-number,
.Ed-ajoutAppartementPopup-remove-image-btn {
  will-change: transform;
  transform: translateZ(0);
}

/* Désactiver le drag sur les petits écrans tactiles si nécessaire */
@media (hover: none) and (pointer: coarse) {
  .Ed-ajoutAppartementPopup-draggable {
    cursor: default;
  }

  .Ed-ajoutAppartementPopup-drag-handle {
    cursor: default;
  }
}

/* ================================
   ACCESSIBILITÉ
   ================================ */

/* Focus visible pour le clavier */
.Ed-ajoutAppartementPopup-image-preview-container:focus-visible {
  outline: 3px solid #0f447e;
  outline: 3px solid var(--primary-blue);
  outline-offset: 3px;
  border-radius: 8px;
  border-radius: var(--radius-medium);
}

/* Réduire les animations pour les utilisateurs qui préfèrent */
@media (prefers-reduced-motion: reduce) {
  .Ed-ajoutAppartementPopup-draggable,
  .Ed-ajoutAppartementPopup-image-preview,
  .Ed-ajoutAppartementPopup-drag-handle,
  .Ed-ajoutAppartementPopup-image-number {
    transition: none !important;
  }

  .Ed-ajoutAppartementPopup-image-preview:hover img {
    transform: none;
  }
}

/* ================================
   ÉTATS SUPPLÉMENTAIRES
   ================================ */

/* État disabled pour le bouton d'upload quand limite atteinte */
.Ed-ajoutAppartementPopup-upload-btn:disabled {
  background-color: #adb5bd;
  background-color: var(--text-light);
  cursor: not-allowed;
  opacity: 0.6;
}

/* Message visuel quand la limite est atteinte */
.Ed-ajoutAppartementPopup-image-status.limit-reached {
  color: #ffc107;
  color: var(--warning-orange);
  font-weight: 600;
}

/* Grille vide */
.Ed-ajoutAppartementPopup-images-grid:empty::after {
  content: 'Aucune image ajoutée. Cliquez sur "Sélect. fichiers" pour commencer.';
  display: block;
  text-align: center;
  padding: 3rem 2rem;
  color: #adb5bd;
  color: var(--text-light);
  font-style: italic;
  grid-column: 1 / -1;
}

/* ================================
   DRAG AND DROP - NOUVELLES CLASSES
   ================================ */

/* Header avec label et bouton supprimer tout */
.Ed-ajoutAppartementPopup-images-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.5rem;
  gap: 1rem;
  flex-wrap: wrap;
}

.Ed-ajoutAppartementPopup-images-header label {
  margin: 0;
  flex: 1 1;
  min-width: 200px;
}

/* Bouton "Tout supprimer" */
.Ed-ajoutAppartementPopup-remove-all-btn {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background-color: #dc3545;
  background-color: var(--error-red);
  color: #ffffff;
  color: var(--white);
  border: none;
  border-radius: 8px;
  border-radius: var(--radius-medium);
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
  white-space: nowrap;
}

.Ed-ajoutAppartementPopup-remove-all-btn:hover {
  background-color: #c82333;
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  box-shadow: var(--shadow-medium);
}

.Ed-ajoutAppartementPopup-remove-all-btn:active {
  transform: translateY(0);
}

/* Texte desktop/mobile pour le bouton */
.Ed-ajoutAppartementPopup-remove-all-text-mobile {
  display: none;
}

.Ed-ajoutAppartementPopup-remove-all-text {
  display: inline;
}

/* Container pour la miniature (taille fixe 150x150) */
.Ed-ajoutAppartementPopup-miniature-container {
  width: 150px;
  height: 150px;
  margin-top: 1rem;
  position: relative;
}

/* Wrapper scrollable pour la grille d'images */
.Ed-ajoutAppartementPopup-images-grid-wrapper {
  margin-top: 1rem;
  max-height: 600px;
  overflow-y: auto;
  padding: 0.5rem;
  border: 1px solid #dee2e6;
  border: 1px solid var(--border-gray);
  border-radius: 8px;
  border-radius: var(--radius-medium);
  background-color: #f8f9fa;
  background-color: var(--light-gray);
}

/* Scrollbar personnalisée pour le wrapper */
.Ed-ajoutAppartementPopup-images-grid-wrapper::-webkit-scrollbar {
  width: 8px;
}

.Ed-ajoutAppartementPopup-images-grid-wrapper::-webkit-scrollbar-track {
  background: #f8f9fa;
  background: var(--light-gray);
  border-radius: 6px;
  border-radius: var(--radius-small);
}

.Ed-ajoutAppartementPopup-images-grid-wrapper::-webkit-scrollbar-thumb {
  background: #adb5bd;
  background: var(--text-light);
  border-radius: 6px;
  border-radius: var(--radius-small);
}

.Ed-ajoutAppartementPopup-images-grid-wrapper::-webkit-scrollbar-thumb:hover {
  background: #6c757d;
  background: var(--text-medium);
}

/* Classe pour les éléments draggables */
.Ed-ajoutAppartementPopup-draggable {
  cursor: move;
  transition: transform 0.2s ease, opacity 0.2s ease, box-shadow 0.2s ease;
}

.Ed-ajoutAppartementPopup-draggable:hover {
  transform: scale(1.02);
  z-index: 10;
}

/* État pendant le drag */
.Ed-ajoutAppartementPopup-dragging {
  opacity: 0.5;
  transform: scale(0.95);
  cursor: grabbing !important;
}

/* Poignée de déplacement */
.Ed-ajoutAppartementPopup-drag-handle {
  position: absolute;
  top: 0.5rem;
  left: 0.5rem;
  background-color: rgba(15, 68, 126, 0.9);
  color: #ffffff;
  color: var(--white);
  padding: 0.3rem;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5;
  cursor: move;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: var(--shadow-light);
}

.Ed-ajoutAppartementPopup-drag-handle:hover {
  background-color: rgba(15, 68, 126, 1);
  transform: scale(1.1);
}

.Ed-ajoutAppartementPopup-draggable:active
  .Ed-ajoutAppartementPopup-drag-handle {
  cursor: grabbing;
}

/* Numéro d'ordre de l'image */
.Ed-ajoutAppartementPopup-image-number {
  position: absolute;
  bottom: 0.5rem;
  left: 0.5rem;
  background-color: rgba(15, 68, 126, 0.9);
  color: #ffffff;
  color: var(--white);
  padding: 0.3rem 0.6rem;
  border-radius: 4px;
  font-size: 0.75rem;
  font-weight: 700;
  z-index: 5;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: var(--shadow-light);
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
}

.Ed-ajoutAppartementPopup-image-preview-container:hover
  .Ed-ajoutAppartementPopup-image-number {
  background-color: rgba(15, 68, 126, 1);
  transform: scale(1.05);
}

/* Statut des images (texte) */
.Ed-ajoutAppartementPopup-image-status {
  color: #6c757d;
  color: var(--text-medium);
  font-size: 0.9rem;
  flex: 1 1;
  min-width: 0;
}

/* Modification de la grille pour supporter 30 images */
.Ed-ajoutAppartementPopup-images-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  grid-gap: 1rem;
  gap: 1rem;
  padding: 0.5rem;
}

/* Container d'image avec aspect ratio */
.Ed-ajoutAppartementPopup-image-preview-container {
  position: relative;
  aspect-ratio: 1;
}

/* Preview optimisé */
.Ed-ajoutAppartementPopup-image-preview {
  width: 100%;
  height: 100%;
  border-radius: 8px;
  border-radius: var(--radius-medium);
  overflow: hidden;
  border: 2px solid #dee2e6;
  border: 2px solid var(--border-gray);
  position: relative;
  background-color: #ffffff;
  background-color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  transition: all var(--transition-fast);
}

.Ed-ajoutAppartementPopup-draggable:hover
  .Ed-ajoutAppartementPopup-image-preview {
  border-color: #0f447e;
  border-color: var(--primary-blue);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  box-shadow: var(--shadow-medium);
}

/* Image elle-même */
.Ed-ajoutAppartementPopup-image-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
  -webkit-user-select: none;
          user-select: none;
  -webkit-user-drag: none;
}

.Ed-ajoutAppartementPopup-image-preview:hover img {
  transform: scale(1.05);
}

/* Animation lors du drag over */
.Ed-ajoutAppartementPopup-image-preview-container[draggable="true"] {
  transition: all 0.2s ease;
}

/* Effet visuel pendant le survol lors du drag */
.Ed-ajoutAppartementPopup-draggable::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 3px dashed #0f447e;
  border: 3px dashed var(--primary-blue);
  border-radius: 8px;
  border-radius: var(--radius-medium);
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
}

.Ed-ajoutAppartementPopup-draggable.drag-over::after {
  opacity: 1;
}

/* ================================
   RESPONSIVE - DRAG AND DROP
   ================================ */

/* Tablettes */
@media (max-width: 768px) {
  .Ed-ajoutAppartementPopup-images-header {
    flex-direction: column;
    align-items: flex-start;
  }

  .Ed-ajoutAppartementPopup-images-header label {
    font-size: 0.9rem;
    min-width: 100%;
  }

  .Ed-ajoutAppartementPopup-remove-all-btn {
    width: 100%;
    justify-content: center;
    padding: 0.6rem 1rem;
  }

  .Ed-ajoutAppartementPopup-image-upload {
    flex-direction: column;
    align-items: stretch;
  }

  .Ed-ajoutAppartementPopup-upload-btn {
    width: 100%;
    padding: 0.8rem 1rem;
  }

  .Ed-ajoutAppartementPopup-image-status {
    text-align: center;
    padding: 0.5rem;
  }

  .Ed-ajoutAppartementPopup-images-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
  }

  .Ed-ajoutAppartementPopup-images-grid-wrapper {
    max-height: 500px;
  }

  .Ed-ajoutAppartementPopup-drag-handle,
  .Ed-ajoutAppartementPopup-image-number {
    padding: 0.25rem 0.4rem;
    font-size: 0.7rem;
  }

  .Ed-ajoutAppartementPopup-drag-handle svg {
    width: 16px;
    height: 16px;
  }
}

/* Mobile */
@media (max-width: 480px) {
  /* Optimisation du header */
  .Ed-ajoutAppartementPopup-images-header label {
    font-size: 0.85rem;
  }

  /* Bouton "Tout supprimer" version compacte */
  .Ed-ajoutAppartementPopup-remove-all-btn {
    font-size: 0.85rem;
    padding: 0.5rem 0.8rem;
  }

  .Ed-ajoutAppartementPopup-remove-all-text {
    display: none;
  }

  .Ed-ajoutAppartementPopup-remove-all-text-mobile {
    display: inline;
  }

  /* Zone d'upload optimisée mobile */
  .Ed-ajoutAppartementPopup-image-upload {
    padding: 0.75rem;
    gap: 0.75rem;
  }

  .Ed-ajoutAppartementPopup-upload-btn {
    font-size: 0.85rem;
    padding: 0.7rem 1rem;
  }

  .Ed-ajoutAppartementPopup-image-status {
    font-size: 0.8rem;
    line-height: 1.4;
  }

  /* Grille 2 colonnes sur mobile */
  .Ed-ajoutAppartementPopup-images-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
  }

  .Ed-ajoutAppartementPopup-images-grid-wrapper {
    max-height: 400px;
    padding: 0.25rem;
  }

  .Ed-ajoutAppartementPopup-miniature-container {
    width: 120px;
    height: 120px;
  }

  /* Simplifier les contrôles sur mobile */
  .Ed-ajoutAppartementPopup-drag-handle {
    top: 0.25rem;
    left: 0.25rem;
    padding: 0.2rem;
  }

  .Ed-ajoutAppartementPopup-drag-handle svg {
    width: 14px;
    height: 14px;
  }

  .Ed-ajoutAppartementPopup-image-number {
    bottom: 0.25rem;
    left: 0.25rem;
    font-size: 0.65rem;
    padding: 0.2rem 0.4rem;
  }

  .Ed-ajoutAppartementPopup-remove-image-btn {
    width: 24px;
    height: 24px;
    top: 0.25rem;
    right: 0.25rem;
  }

  .Ed-ajoutAppartementPopup-remove-image-btn svg {
    width: 14px;
    height: 14px;
  }

  /* Réduire l'effet hover sur mobile (performance) */
  .Ed-ajoutAppartementPopup-draggable:hover {
    transform: none;
  }

  .Ed-ajoutAppartementPopup-image-preview:hover img {
    transform: none;
  }

  /* Touch-friendly: augmenter la zone cliquable */
  .Ed-ajoutAppartementPopup-remove-image-btn,
  .Ed-ajoutAppartementPopup-drag-handle {
    min-width: 32px;
    min-height: 32px;
  }
}

/* ================================
   AMÉLIORATION DE PERFORMANCE
   ================================ */

/* Optimisation GPU pour les animations */
.Ed-ajoutAppartementPopup-draggable,
.Ed-ajoutAppartementPopup-drag-handle,
.Ed-ajoutAppartementPopup-image-number,
.Ed-ajoutAppartementPopup-remove-image-btn {
  will-change: transform;
  transform: translateZ(0);
}

/* Désactiver le drag sur les petits écrans tactiles si nécessaire */
@media (hover: none) and (pointer: coarse) {
  .Ed-ajoutAppartementPopup-draggable {
    cursor: default;
  }

  .Ed-ajoutAppartementPopup-drag-handle {
    cursor: default;
  }
}

/* ================================
   ACCESSIBILITÉ
   ================================ */

/* Focus visible pour le clavier */
.Ed-ajoutAppartementPopup-image-preview-container:focus-visible {
  outline: 3px solid #0f447e;
  outline: 3px solid var(--primary-blue);
  outline-offset: 3px;
  border-radius: 8px;
  border-radius: var(--radius-medium);
}

/* Réduire les animations pour les utilisateurs qui préfèrent */
@media (prefers-reduced-motion: reduce) {
  .Ed-ajoutAppartementPopup-draggable,
  .Ed-ajoutAppartementPopup-image-preview,
  .Ed-ajoutAppartementPopup-drag-handle,
  .Ed-ajoutAppartementPopup-image-number {
    transition: none !important;
  }

  .Ed-ajoutAppartementPopup-image-preview:hover img {
    transform: none;
  }
}

/* ================================
   ÉTATS SUPPLÉMENTAIRES
   ================================ */

/* État disabled pour le bouton d'upload quand limite atteinte */
.Ed-ajoutAppartementPopup-upload-btn:disabled {
  background-color: #adb5bd;
  background-color: var(--text-light);
  cursor: not-allowed;
  opacity: 0.6;
}

/* Message visuel quand la limite est atteinte */
.Ed-ajoutAppartementPopup-image-status.limit-reached {
  color: #ffc107;
  color: var(--warning-orange);
  font-weight: 600;
}

/* Grille vide */
.Ed-ajoutAppartementPopup-images-grid:empty::after {
  content: 'Aucune image ajoutée. Cliquez sur "Sélect. fichiers" pour commencer.';
  display: block;
  text-align: center;
  padding: 3rem 2rem;
  color: #adb5bd;
  color: var(--text-light);
  font-style: italic;
  grid-column: 1 / -1;
}

/* ===== PLAN DE TARIFICATION ===== */
.Ed-ajoutAppartementPopup-tarif-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 1.5rem;
  gap: 1.5rem;
  padding: 1.25rem;
  margin-bottom: 1rem;
  background-color: #f8f9fa;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  align-items: start;
  transition: none !important;
}

.Ed-ajoutAppartementPopup-tarif-content {
  display: contents;
}

.Ed-ajoutAppartementPopup-periode-group,
.Ed-ajoutAppartementPopup-prix-group,
.Ed-ajoutAppartementPopup-prix-recevoir-group {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.Ed-ajoutAppartementPopup-label {
  font-size: 13px;
  font-weight: 600;
  color: #333;
  margin-bottom: 4px;
  text-align: left;
}

.Ed-ajoutAppartementPopup-periode-inputs {
  display: flex;
  align-items: center;
  gap: 10px;
}

.Ed-ajoutAppartementPopup-periode-inputs input[type="number"],
.Ed-ajoutAppartementPopup-periode-inputs input[type="text"] {
  width: 70px;
  padding: 10px 12px;
  background-color: #ffffff;
  border: 1px solid #dee2e6;
  border-radius: 6px;
  color: #495057;
  font-size: 14px;
  text-align: center;
  transition: none !important;
  -moz-appearance: textfield;
}

.Ed-ajoutAppartementPopup-periode-inputs
  input[type="number"]::-webkit-outer-spin-button,
.Ed-ajoutAppartementPopup-periode-inputs
  input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.Ed-ajoutAppartementPopup-periode-inputs input:focus {
  outline: none;
  border-color: #0f447e;
  border-color: var(--primary-blue);
  box-shadow: 0 0 0 3px rgba(15, 68, 126, 0.1);
}

.Ed-ajoutAppartementPopup-periode-inputs span {
  font-size: 14px;
  color: #6c757d;
  font-weight: 500;
}

.Ed-ajoutAppartementPopup-prix-inputs {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.Ed-ajoutAppartementPopup-prix-inputs input[type="number"],
.Ed-ajoutAppartementPopup-prix-recevoir-inputs input[type="number"] {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #dee2e6;
  border-radius: 6px;
  font-size: 14px;
  text-align: center;
  -moz-appearance: textfield;
}

.Ed-ajoutAppartementPopup-prix-inputs input[type="number"] {
  background-color: #ffffff;
  color: #495057;
}

.Ed-ajoutAppartementPopup-prix-inputs input[type="number"]:focus {
  outline: none;
  border-color: #0f447e;
  border-color: var(--primary-blue);
  box-shadow: 0 0 0 3px rgba(15, 68, 126, 0.1);
}

.Ed-ajoutAppartementPopup-prix-recevoir-inputs input[type="number"] {
  background-color: #f0f0f0;
  color: #6c757d;
  cursor: not-allowed;
}

.Ed-ajoutAppartementPopup-prix-inputs
  input[type="number"]::-webkit-outer-spin-button,
.Ed-ajoutAppartementPopup-prix-inputs
  input[type="number"]::-webkit-inner-spin-button,
.Ed-ajoutAppartementPopup-prix-recevoir-inputs
  input[type="number"]::-webkit-outer-spin-button,
.Ed-ajoutAppartementPopup-prix-recevoir-inputs
  input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* ===== PRIX ET NOMBRE MINIMUM DE NUITS SUR LA MÊME LIGNE ===== */
.Ed-ajoutAppartementPopup-price-min-group {
  display: flex;
  gap: 1.5rem;
  align-items: flex-start;
  width: 100%;
}

.Ed-ajoutAppartementPopup-price-min-group .Ed-ajoutAppartementPopup-form-group {
  flex: 1 1;
  min-width: 0;
}

/* Responsive : tablette */
@media (max-width: 992px) {
  .Ed-ajoutAppartementPopup-tarif-row {
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
  }

  .Ed-ajoutAppartementPopup-prix-recevoir-group {
    grid-column: 1 / -1;
  }

  .Ed-ajoutAppartementPopup-price-min-group {
    gap: 1rem;
  }
}

/* Responsive : mobile */
@media (max-width: 768px) {
  .Ed-ajoutAppartementPopup-tarif-row {
    grid-template-columns: 1fr;
    gap: 1rem;
    padding: 1rem;
  }

  /* IMPORTANT: Forcer les inputs de période sur la même ligne avec labels visibles */
  .Ed-ajoutAppartementPopup-periode-inputs {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    gap: 20px;
  }

  .Ed-ajoutAppartementPopup-periode-inputs input[type="number"],
  .Ed-ajoutAppartementPopup-periode-inputs input[type="text"] {
    width: 80px !important;
    min-width: 90px;
    max-width: 80px;
    flex-shrink: 0;
    padding: 8px 6px;
  }

  .Ed-ajoutAppartementPopup-periode-inputs span {
    flex-shrink: 0;
    font-size: 12px;
    font-weight: 500;
    color: #6c757d;
    white-space: nowrap;
    display: inline-block !important;
  }

  .Ed-ajoutAppartementPopup-price-min-group {
    flex-direction: column;
    gap: 1rem;
  }

  .Ed-ajoutAppartementPopup-price-min-group
    .Ed-ajoutAppartementPopup-form-group {
    width: 100%;
    min-width: 100%;
  }
}
/* ================================
   End of CSS
   ================================ */

.apat-history-page {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 30px;
  align-items: center;
  justify-items: start;
  padding: 0 40px;
  margin-top: 8px;
}

.apat-history-content-wrapper {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  justify-items: start;
  padding: 0 12px;
}

.apat-history-page-content {
  flex: 1 1;
  margin-left: 250px;
  padding-top: 70px;
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  max-width: 1024px;
  box-sizing: border-box;
  overflow-x: hidden;
}

.apat-history-page-content-collapsed {
  margin-left: 70px;
  width: calc(100% - 70px);
}

.apat-history-page-header {
  display: flex;
  gap: 12px;
  justify-items: center;
  align-items: center;
  width: 100%;
  background-color: #fff;
  padding: 16px 20px;
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.04);
}

.apat-history-page-header p {
  margin: 0;
}

.apat-history-infos {
  display: flex;
  gap: 8px;
  justify-items: center;
  align-items: center;
  font-size: 0.78rem;
  color: #8e8989;
  margin-top: 2px;
}

.apat-history-infos-container {
  display: flex;
  width: -webkit-fit-content;
  width: fit-content;
  gap: 12px;
  justify-items: center;
  align-items: center;
}

.apat-history-infos-state {
  color: #0f447e;
  font-weight: 600;
  font-size: 10px;
  border: 1px solid #0f447e;
  background-color: #0f447e20;
  border-radius: 12px;
  padding: 2px 8px;
}

.apat-history-infos-link {
  color: #0f447e;
  cursor: pointer;
  text-decoration: none;
  font-size: small;
  font-weight: 600;
}

.apat-history-page-title {
  font-size: 1.1rem;
  color: #0f447e;
  font-weight: 600;
}

.apat-history-page-highlight {
  color: #e30613;
}

.apat-history-page-body {
  background-color: #fff;
  width: 100%;
  border-radius: 10px;
  padding: 30px 20px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04), 2px 0 10px rgba(0, 0, 0, 0.03),
    -2px 0 10px rgba(0, 0, 0, 0.03);
}

.apat-history-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background-color: transparent;
  border: none;
  color: #0f447e;
  font-size: 2rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
  margin-bottom: 10px;
}

.apat-history-back-btn:hover {
  color: #0d3661;
  transform: translateX(-1px);
}

.apat-history-back-icon {
  font-size: 32px;
}

.apat-history-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 4rem 0;
  text-align: center;
  color: #939ba3;
  font-size: 1rem;
  gap: 12px;
}

.apat-history-empty-icon {
  font-size: 2.5rem;
  color: #a7aeb6;
}

@media (max-width: 768px) {
  .apat-history-page-content-collapsed {
    margin-left: 0;
    width: 100%;
  }

  .apat-history-page-content {
    flex: 1 1;
    margin-left: 0px;
    width: 100%;
  }

  .apat-history-content-wrapper {
    padding: 0 12px;
  }

  .apat-history-page {
    padding: 0 20px;
  }
}

@media (max-width: 640px) {
  .apat-history-page {
    padding: 0 12px;
  }
}
@media (max-width: 486px) {
  .apat-history-infos-state {
    display: none;
  }

  .apat-history-page-title {
    font-size: 0.9rem;
  }

  .apat-history-back-icon {
    font-size: 24px;
  }
}

@media (max-width: 360px) {
  .apat-history-page {
    padding: 0 8px;
  }
}

.apat-created-history-card {
  width: 100%;
  background: #14539715;
  border-radius: 12px;
  padding: 20px;
  border: 1px solid #0f447e33;
  margin: auto;
}

.apat-history-header {
  display: flex;
  width: 100%;
  align-items: start;
  justify-content: space-between;
}

.apat-history-user-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.apt-created-hitory-user-avatar {
  background-color: #e30613bb;
  color: white;
  font-weight: 600;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  margin-right: 12px;
}

.apat-history-user-info {
  flex-grow: 1;
}

.user-name {
  font-weight: 500;
  font-size: 0.83rem;
  color: #333;
}

.apat-history-user-dot {
  color: #757474;
  margin: 0 6px;
}

.apat-history-action-desc {
  font-size: 0.81rem;
  margin-left: 4px;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.apat-history-action-timestamp {
  display: flex;
  gap: 8px;
  justify-items: center;
  align-items: center;
  font-size: 0.78rem;
  color: #8e8989;
  margin-top: 2px;
}

.apat-history-action-timestamp-p {
  margin: 0;
  padding: 0;
}

.apat-history-status-label {
  background: #007bff22;
  color: #007bff;
  font-weight: 500;
  font-size: 0.65rem;
  padding: 4px 12px;
  border-radius: 12px;
  text-transform: uppercase;
}

.apat-created-history-status-label {
  background: #0f447e;
  color: #fff;
  font-weight: 500;
  font-size: 0.65rem;
  padding: 4px 12px;
  border-radius: 12px;
  text-transform: uppercase;
}

.apat-history-admin {
  color: #ff4d00;
  background-color: #ff4d0020;
}

.apat-history-agent {
  color: #7b3fe4;
  background-color: #7b3fe420;
}

.apat-history-client {
  color: #ea00ff;
  background-color: #ea00ff20;
}

.apat-history-user {
  color: #007bff;
  background-color: #007bff20;
}

.apat-history-body-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.apat-history-body {
  background-color: #12073f04;
  border: 1px solid #12073f10;
  border-radius: 8px;
  padding: 8px 14px;
}

.apat-history-body-title {
  margin: 0;
  font-size: 0.8rem;
  font-weight: 400;
  color: #6c6b6b;
  margin-bottom: 5px;
}

.status-change {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  gap: 12px;
  margin-bottom: 8px;
  height: -webkit-fit-content;
  height: fit-content;
}

.apat-history-status-item {
  padding: 5px 10px;
  border-radius: 4px;
  font-size: 0.8rem;
  align-content: center;
}

.apat-history-old-status {
  -webkit-text-decoration: line-through solid #e13939 1px;
          text-decoration: line-through solid #e13939 1px;
  color: #302f2f;
  background-color: #fbf8f8;
  border: 1px solid #f3dbdb;
}

.apat-history-old-new-status {
  background-color: #ebf4ee;
  color: #1d6721;
  border: 1px solid #bae8bd;
}

.apt-history-arrow {
  color: #0f447eee;
  font-size: 14px;
  align-content: center;
}


@media (max-width: 640px) {
  .apt-created-hitory-user-avatar {
    display: none;
  }
}
.pricing-diff-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.pricing-title {
  font-size: 0.8rem;
  font-weight: 600;
  margin-bottom: 8px;
  color: #e30613cc;
}

.period-card {
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.pricing-row {
  display: flex;
  gap: 24px;
}

.pricing-column {
  flex: 1 1;
  padding: 8px;
  border-radius: 6px;

  background: #f9f9f9;
}

.pricing-column-before {
  background-color: #fbf8f8aa;
  border: 1px solid #f3dbdb;
}

.pricing-column-after {
  background-color: #ebf4ee80;
  border: 1px solid #bae8bd;
}

.pricing-column h5 {
  margin-bottom: 8px;
  font-weight: 600;
  font-size: 0.8rem;
  color: #504e4e;
  text-transform: uppercase;
}

.price-item {
  display: flex;
  justify-content: space-between;
  margin-bottom: 4px;
  font-size: 14px;
}

.price-item .field {
  font-size: 0.8rem;
  font-weight: 500;
  color: #6c6b6b;
}

.price-item .value {
  font-weight: 600;
  font-size: 0.75rem;
  color: rgb(75, 74, 74)
}

.price-item .strike {
  text-decoration: line-through;
  color: red;
}

.apat-history-card {
  width: 100%;
  background: #f9fdff;
  border-radius: 12px;
  padding: 20px;
  border: 1px solid #ebe7e7ee;
  margin: auto;
}

.apat-history-header {
  display: flex;
  width: 100%;
  align-items: start;
  justify-content: space-between;
}

.apat-history-user-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.apt-hitory-user-avatar {
  background-color: #0f447ee1;
  color: white;
  font-weight: 600;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  margin-right: 12px;
}

.apat-history-user-info {
  flex-grow: 1;
}

.user-name {
  font-weight: 500;
  font-size: 0.83rem;
  color: #333;
}

.apat-history-user-dot {
  color: #757474;
  margin: 0 6px;
}

.apat-history-action-desc {
  font-size: 0.81rem;
  margin-left: 4px;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.apat-history-action-timestamp {
  display: flex;
  gap: 8px;
  justify-items: center;
  align-items: center;
  font-size: 0.78rem;
  color: #8e8989;
  margin-top: 2px;
}

.apat-history-action-timestamp-p {
  margin: 0;
  padding: 0;
}

.apat-history-status-label {
  background: #007bff22;
  color: #007bff;
  font-weight: 500;
  font-size: 0.65rem;
  padding: 4px 12px;
  border-radius: 12px;
  text-transform: uppercase;
}

.apat-history-number-of-changes {
  background: #e3061320;
  color: #e30613;
  font-weight: 500;
  font-size: 0.65rem;
  padding: 4px 12px;
  border-radius: 12px;
  text-transform: uppercase;
}

.apat-history-admin {
  color: #ff4d00;
  background-color: #ff4d0020;
}

.apat-history-agent {
  color: #7b3fe4;
  background-color: #7b3fe420;
}

.apat-history-client {
  color: #ea00ff;
  background-color: #ea00ff20;
}

.apat-history-user {
  color: #007bff;
  background-color: #007bff20;
}

.apat-history-body-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.apat-history-body {
  background-color: #12073f04;
  border: 1px solid #12073f10;
  border-radius: 8px;
  padding: 8px 14px;
}

.apat-history-body-title {
  margin: 0;
  font-size: 0.8rem;
  font-weight: 400;
  color: #6c6b6b;
  margin-bottom: 5px;
}

.status-change {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  gap: 12px;
  margin-bottom: 8px;
  height: -webkit-fit-content;
  height: fit-content;
}

.apat-history-status-item {
  padding: 5px 10px;
  border-radius: 4px;
  font-size: 0.8rem;
  align-content: center;
}

.apat-history-old-status {
  -webkit-text-decoration: line-through solid #e13939 1px;
          text-decoration: line-through solid #e13939 1px;
  color: #302f2f;
  background-color: #fbf8f8;
  border: 1px solid #f3dbdb;
}

.apat-history-old-new-status {
  background-color: #ebf4ee;
  color: #1d6721;
  border: 1px solid #bae8bd;
}

.apt-history-arrow {
  color: #0f447eee;
  font-size: 14px;
  align-content: center;
}

.apat-history-status-mod-container {
  display: flex;
  gap: 8px;
}

@media (max-width: 924px) {
  .apat-history-header {
    flex-direction: column;
    gap: 4px;
    margin-bottom: 16px;
    align-items: start;
    justify-content: start;
  }
}

@media (max-width: 640px) {
  .apt-hitory-user-avatar {
    display: none;
  }

  .status-change {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }

  .apt-history-arrow {
    display: none;
  }
}

.timeline-container {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 24px;
  border-radius: 20px;
}

.timeline-item {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 16px;
}

.timeline-line {
  position: absolute;
  top: 12px;
  width: 2px;
  height: 100%;
  background: #e0e0e0;
  z-index: 0;
}

.timeline-dot {
  position: relative;
  z-index: 2;
  margin-left: -4px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: #0f447e;
  border: 2px solid #d3d3d3;
  flex-shrink: 0;
  margin-top: 0;
}

@media (max-width: 992px) {
  .timeline-dot {
    display: none;
  }
  .timeline-line {
    display: none;
  }
}

.dashboard-wrapper {
    display: flex;
    flex-direction: column;
    min-height: 100vh; /* Assure que le wrapper prend toute la hauteur de la fenêtre */
    background: #ffffff; /* Fond global */
  }
  
  .main-content {
    margin-top: 90px; /* Hauteur de la Topbar (60px + 30px) */
    margin-left: 260px; /* Largeur du Sidebar */
    padding: 20px;
    flex: 1 1; /* Permet à main-content de prendre tout l'espace disponible */
    box-sizing: border-box;
    /* Retire overflow-y et height pour laisser le défilement au niveau du wrapper */
  }
  
  .lists-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 20px;
    gap: 20px;
    width: calc(100% - 300px); /* 260px (Sidebar) + 20px (marge gauche) + 20px (marge droite) */
    margin-left: 280px; /* 260px (Sidebar) + 20px (marge gauche) */
    margin-right: 20px;
    margin-top: 20px;
    margin-bottom: 80px;
  }
  
  .dashboard-footer {
    width: calc(100% - 260px);
    margin-left: 260px;
    padding: 20px;
    background: #FFFFFF;
    text-align: center;
    font-family: 'Poppins', sans-serif;
    color: #656565;
    font-size: 14px;
    /* Retire position: fixed pour laisser le footer dans le flux naturel */
    /* position: fixed; */
    /* bottom: 0; */
    /* left: 0; */
    /* z-index: 10; */
  }
  
  /* Responsive */
  @media (min-width: 1200px) {
    .main-content {
      margin-left: 280px;
      margin-top: 90px; /* 60px (hauteur de base) + 30px (padding-top) */
    }
  
    .lists-container {
      width: calc(100% - 320px); /* 280px (Sidebar) + 20px (marge gauche) + 20px (marge droite) */
      margin-left: 300px;
      margin-right: 20px;
    }
  
    .dashboard-footer {
      width: calc(100% - 280px);
      margin-left: 280px;
      padding: 25px;
      font-size: 16px;
    }
  }
  
  @media (max-width: 1024px) {
    .main-content {
      margin-left: 240px;
      margin-top: 90px; /* 60px (hauteur de base) + 30px (padding-top) */
    }
  
    .lists-container {
      width: calc(100% - 280px); /* 240px (Sidebar) + 20px (marge gauche) + 20px (marge droite) */
      margin-left: 260px;
      margin-right: 20px;
    }
  
    .dashboard-footer {
      width: calc(100% - 240px);
      margin-left: 240px;
      padding: 18px;
      font-size: 13px;
    }
  }
  
  @media (max-width: 768px) {
    .main-content {
      margin-left: 200px;
      margin-top: 65px; /* 50px (hauteur de base) + 15px (padding-top) */
    }
  
    .lists-container {
      grid-template-columns: 1fr; /* Passe à 1 colonne */
      width: calc(100% - 240px); /* 200px (Sidebar) + 20px (marge gauche) + 20px (marge droite) */
      margin-left: 220px;
      margin-right: 20px;
    }
  
    .dashboard-footer {
      width: calc(100% - 200px);
      margin-left: 200px;
      padding: 15px;
      font-size: 12px;
    }
  }
  
  @media (max-width: 480px) {
    .main-content {
      margin-left: 180px;
      margin-top: 55px; /* 45px (hauteur de base) + 10px (padding-top) */
    }
  
    .lists-container {
      width: calc(100% - 220px); /* 180px (Sidebar) + 20px (marge gauche) + 20px (marge droite) */
      margin-left: 200px;
      margin-right: 20px;
    }
  
    .dashboard-footer {
      width: calc(100% - 180px);
      margin-left: 180px;
      padding: 10px;
      font-size: 10px;
    }
  }
/* Import Poppins font */

/* Variables globales */
:root {
  --primary-color: #0c447e;
  --primary-gradient: linear-gradient(135deg, #0c447e 0%, #1e5a9e 100%);
  --secondary-color: #1e5a9e;
  --success-color: #22c55e;
  --error-color: #ef4444;
  --text-primary: #1f2937;
  --text-secondary: #6b7280;
  --border-color: #e5e7eb;
  --background-light: #f9fafb;
  --shadow-sm: 0 4px 12px rgba(12, 68, 126, 0.15);
  --shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.1);
  --border-radius: 16px;
  --transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* Reset et styles de base */
* {
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* Wrapper responsive */
.AbonnementPay-wrapper {
  min-height: 100vh;
  background: linear-gradient(135deg, #f8faff 0%, #e8f2ff 50%, #f0f8ff 100%);
  padding: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Container principal */
.AbonnementPay-container {
  background: white;
  border-radius: 20px;
  width: 100%;
  max-width: 800px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  box-shadow: var(--shadow-lg);
  overflow: hidden;
  opacity: 0;
  animation: fadeIn 0.6s ease-out forwards;
}

/* Animations */
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes slideDown {
  from {
    transform: translateY(-30px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes slideUp {
  from {
    transform: translateY(30px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(12, 68, 126, 0.4);
  }
  70% {
    box-shadow: 0 0 0 10px rgba(12, 68, 126, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(12, 68, 126, 0);
  }
}

.animate-fade-in {
  animation: fadeIn 0.6s ease-out forwards;
}
.animate-slide-down {
  animation: slideDown 0.5s ease-out forwards;
}
.animate-slide-up {
  animation: slideUp 0.5s ease-out forwards;
  opacity: 0;
}

.delay-100 {
  animation-delay: 0.1s;
}
.delay-200 {
  animation-delay: 0.2s;
}
.delay-300 {
  animation-delay: 0.3s;
}
.delay-400 {
  animation-delay: 0.4s;
}

/* En-tête - STYLE CONSERVÉ */
.AbonnementPay-header {
  background: linear-gradient(135deg, #0c447e 0%, #1e5a9e 100%);
  background: var(--primary-gradient);
  padding: 2rem;
  color: white;
}

.AbonnementPay-plan-summary {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.AbonnementPay-plan-icon {
  flex-shrink: 0;
}

.AbonnementPay-plan-info {
  flex: 1 1;
}

.AbonnementPay-plan-info h3 {
  font-size: 1.25rem;
  font-weight: 700;
  margin: 0 0 0.25rem 0;
  letter-spacing: -0.025em;
}

.AbonnementPay-plan-info p {
  font-size: 0.875rem;
  opacity: 0.9;
  margin: 0;
  font-weight: 400;
}

.AbonnementPay-plan-price {
  text-align: right;
  flex-shrink: 0;
}

.AbonnementPay-amount {
  font-size: 2rem;
  font-weight: 800;
  display: block;
  letter-spacing: -0.05em;
}

.AbonnementPay-currency {
  font-size: 0.875rem;
  opacity: 0.9;
  font-weight: 500;
}

/* Contenu principal */
.AbonnementPay-content {
  padding: 2rem;
}

.AbonnementPay-layout {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 2rem;
  gap: 2rem;
}

.AbonnementPay-section {
  opacity: 0;
}

.AbonnementPay-section-title {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1f2937;
  color: var(--text-primary);
  margin: 0 0 1.5rem 0;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.AbonnementPay-section-title svg {
  color: #0c447e;
  color: var(--primary-color);
}

/* Formulaire */
.AbonnementPay-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 1rem;
  gap: 1rem;
}

.AbonnementPay-form-grid.has-error {
  gap: 2rem;
}

.AbonnementPay-form-group {
  position: relative;
}

.AbonnementPay-form-group-full {
  grid-column: 1 / -1;
}

.AbonnementPay-form-group input {
  width: 100%;
  padding: 1rem;
  border: 2px solid #e5e7eb;
  border: 2px solid var(--border-color);
  border-radius: 12px;
  font-size: 0.875rem;
  font-weight: 400;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  transition: var(--transition);
  background: #f9fafb;
  background: var(--background-light);
  box-sizing: border-box;
}

.AbonnementPay-form-group input:focus {
  outline: none;
  border-color: #0c447e;
  border-color: var(--primary-color);
  background: white;
  box-shadow: 0 0 0 3px rgba(12, 68, 126, 0.1);
}

.AbonnementPay-form-group input.input-error {
  border-color: #ef4444;
  border-color: var(--error-color);
  background: #fef2f2;
}

.AbonnementPay-error {
  position: absolute;
  top: 100%;
  left: 0;
  font-size: 0.75rem;
  color: #ef4444;
  color: var(--error-color);
  margin-top: 0.2rem;
  font-weight: 500;
}

/* Méthodes de paiement */
.AbonnementPay-payment-methods {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.AbonnementPay-payment-method {
  display: block;
  cursor: pointer;
  border: 2px solid #e5e7eb;
  border: 2px solid var(--border-color);
  border-radius: 16px;
  border-radius: var(--border-radius);
  padding: 1rem;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  transition: var(--transition);
  background: #f9fafb;
  background: var(--background-light);
}

.AbonnementPay-payment-method:hover {
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.AbonnementPay-payment-method.selected {
  border-color: #0c447e;
  border-color: var(--primary-color);
  background: rgba(12, 68, 126, 0.05);
  box-shadow: 0 4px 12px rgba(12, 68, 126, 0.15);
  box-shadow: var(--shadow-sm);
  animation: pulse 1.5s ease-in-out;
}

.AbonnementPay-payment-method input {
  display: none;
}

.AbonnementPay-payment-content {
  display: flex;
  align-items: center;
  gap: 1rem;
}

/* Logos de paiement */
.AbonnementPay-payment-logo-container {
  flex-shrink: 0;
}

.AbonnementPay-payment-icon {
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 700;
  color: white;
  flex-shrink: 0;
}

/* Logo PayPal - 80x32px */
.AbonnementPay-payment-logo-container .AbonnementPay-payment-icon {
  width: 80px;
  height: 32px;
  font-size: 0.875rem;
}

.AbonnementPay-payment-icons-group {
  display: flex;
  gap: 0.5rem;
}

/* Logos Mobile Money et Cartes - 32x24px chacun */
.AbonnementPay-payment-icons-group .AbonnementPay-payment-icon {
  width: 32px;
  height: 24px;
  font-size: 0.625rem;
}

/* Couleurs des logos */
.AbonnementPay-payment-icon.paypal {
  background: #0070ba;
}
.AbonnementPay-payment-icon.momo {
  background: #ffcc00;
  color: #000;
}
.AbonnementPay-payment-icon.flooz {
  background: #ff6b35;
}
.AbonnementPay-payment-icon.tmoney {
  background: #1a1a1a;
}
.AbonnementPay-payment-icon.visa {
  background: #1a1f71;
}
.AbonnementPay-payment-icon.mastercard {
  background: #eb001b;
}

.AbonnementPay-payment-info {
  flex: 1 1;
}

.AbonnementPay-payment-name {
  font-size: 0.875rem;
  font-weight: 600;
  color: #1f2937;
  color: var(--text-primary);
  display: block;
  margin-bottom: 0.125rem;
}

.AbonnementPay-payment-desc {
  font-size: 0.75rem;
  color: #6b7280;
  color: var(--text-secondary);
  font-weight: 400;
}

/* Section total */
.AbonnementPay-total-section {
  background: linear-gradient(135deg, #f8f9ff 0%, #e8f2ff 100%);
  border-radius: 16px;
  border-radius: var(--border-radius);
  padding: 1.5rem;
  margin-top: 2rem;
  opacity: 0;
}

.AbonnementPay-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.5rem;
  font-size: 1rem;
  font-weight: 600;
  color: #1f2937;
  color: var(--text-primary);
}

.AbonnementPay-total-price {
  display: flex;
  align-items: baseline;
  gap: 0.25rem;
}

.AbonnementPay-total-amount {
  font-size: 1.75rem;
  font-weight: 800;
  color: #0c447e;
  color: var(--primary-color);
  letter-spacing: -0.05em;
}

.AbonnementPay-total-currency {
  font-size: 1rem;
  font-weight: 600;
  color: #0c447e;
  color: var(--primary-color);
}

/* Bouton de paiement */
.AbonnementPay-btn-pay {
  width: 100%;
  padding: 1.125rem 1.5rem;
  background: linear-gradient(135deg, #0c447e 0%, #1e5a9e 100%);
  background: var(--primary-gradient);
  color: white;
  border: none;
  border-radius: 14px;
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  transition: var(--transition);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  position: relative;
  overflow: hidden;
}

.AbonnementPay-btn-pay:hover:not(:disabled) {
  transform: translateY(-3px);
  box-shadow: 0 8px 25px rgba(12, 68, 126, 0.4);
}

.AbonnementPay-btn-pay:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

.AbonnementPay-loading {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}

.AbonnementPay-spinner {
  width: 20px;
  height: 20px;
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-top: 2px solid white;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

/* Sécurité */
.AbonnementPay-security {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin-top: 1.25rem;
  font-size: 0.75rem;
  color: #6b7280;
  color: var(--text-secondary);
  opacity: 0;
}

.AbonnementPay-notification {
  position: fixed;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  padding: 15px 30px;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  z-index: 1000;
  font-size: 16px;
  color: #fff;
  animation: slideIn 0.3s ease-out;
  margin-top: 10px; /* Espace au-dessus de la notification */
}

.AbonnementPay-notification.success {
  background-color: #22c55e; /* Vert pour succès */
}

.AbonnementPay-notification.error {
  background-color: #ef4444; /* Rouge pour erreur */
}

/* La notification disparaît après un certain temps */
.AbonnementPay-notification {
  opacity: 1;
  transition: opacity 0.5s ease-out;
}

.AbonnementPay-notification.exit {
  opacity: 0;
}

.AbonnementPay-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.AbonnementPay-modal {
  background: #fff;
  border-radius: 12px;
  padding: 20px;
  width: 90%;
  max-width: 400px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
  text-align: center;
  animation: popIn 0.3s ease-out;
}

.AbonnementPay-modal.success {
  border: 2px solid #22c55e;
}

.AbonnementPay-modal.error {
  border: 2px solid #ef4444;
}

.AbonnementPay-modal-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
}

.AbonnementPay-modal-content p {
  margin: 0;
  font-size: 18px;
  color: #333;
  white-space: pre-wrap; /* Permet les sauts de ligne avec \n */
}

@keyframes popIn {
  from {
    opacity: 0;
    transform: scale(0.8);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.AbonnementPay-modal {
  opacity: 1;
  transition: opacity 0.3s ease-out;
}

.AbonnementPay-modal-overlay {
  opacity: 1;
  transition: opacity 0.3s ease-out;
}

/* Responsive Design */
@media (min-width: 768px) {
  .AbonnementPay-wrapper {
    padding: 2rem;
  }

  .AbonnementPay-layout {
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
  }

  .AbonnementPay-header {
    padding: 2.5rem;
  }

  .AbonnementPay-content {
    padding: 3rem;
  }

  .AbonnementPay-plan-info h3 {
    font-size: 1.5rem;
  }

  .AbonnementPay-plan-info p {
    font-size: 1rem;
  }

  .AbonnementPay-amount {
    font-size: 2.5rem;
  }

  .AbonnementPay-currency {
    font-size: 1rem;
  }

  .AbonnementPay-section-title {
    font-size: 1.25rem;
  }

  .AbonnementPay-form-group input {
    font-size: 1rem;
    padding: 1.125rem;
  }

  .AbonnementPay-payment-name {
    font-size: 1rem;
  }

  .AbonnementPay-payment-desc {
    font-size: 0.875rem;
  }

  .AbonnementPay-total-amount {
    font-size: 2.25rem;
  }

  .AbonnementPay-btn-pay {
    font-size: 1.125rem;
  }
}

/* PopupAbonnementValidation.css */

.PopupAbonnementValidation-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  padding: 20px;
  animation: PopupAbonnementValidation-fadeIn 0.3s ease-out;
}

.PopupAbonnementValidation-closing {
  animation: PopupAbonnementValidation-fadeOut 0.3s ease-out;
}

@keyframes PopupAbonnementValidation-fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes PopupAbonnementValidation-fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

.PopupAbonnementValidation-container {
  background: white;
  border-radius: 24px;
  max-width: 520px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  position: relative;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
  animation: PopupAbonnementValidation-slideUp 0.3s ease-out;
}

.PopupAbonnementValidation-success {
  border-top: 4px solid #10B981;
}

.PopupAbonnementValidation-error {
  border-top: 4px solid #EF4444;
}

@keyframes PopupAbonnementValidation-slideUp {
  from {
    transform: translateY(30px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

.PopupAbonnementValidation-close {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 40px;
  height: 40px;
  border: none;
  background: rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  z-index: 1001;
}

.PopupAbonnementValidation-close:hover {
  background: rgba(0, 0, 0, 0.2);
  transform: scale(1.1);
}

.PopupAbonnementValidation-header {
  text-align: center;
  padding: 50px 32px 32px;
  background: linear-gradient(135deg, #f8f9ff 0%, #e8f2ff 100%);
  border-radius: 24px 24px 0 0;
}

.PopupAbonnementValidation-success .PopupAbonnementValidation-header {
  background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
}

.PopupAbonnementValidation-error .PopupAbonnementValidation-header {
  background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%);
}

.PopupAbonnementValidation-icon {
  margin-bottom: 24px;
  display: flex;
  justify-content: center;
  animation: PopupAbonnementValidation-iconBounce 0.6s ease-out;
}

@keyframes PopupAbonnementValidation-iconBounce {
  0% {
    transform: scale(0.3);
    opacity: 0;
  }
  50% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

.PopupAbonnementValidation-title {
  font-size: 32px;
  font-weight: 700;
  margin: 0 0 16px 0;
  line-height: 1.2;
}

.PopupAbonnementValidation-success .PopupAbonnementValidation-title {
  color: #10B981;
}

.PopupAbonnementValidation-error .PopupAbonnementValidation-title {
  color: #EF4444;
}

.PopupAbonnementValidation-subtitle {
  font-size: 16px;
  color: #666;
  line-height: 1.6;
  margin: 0;
  max-width: 400px;
  margin-left: auto;
  margin-right: auto;
}

.PopupAbonnementValidation-details {
  padding: 32px;
}

.PopupAbonnementValidation-plan-info {
  background: linear-gradient(135deg, #f8f9ff 0%, #e8f2ff 100%);
  border-radius: 16px;
  padding: 24px;
  margin-bottom: 24px;
  border: 1px solid #e0e7ff;
}

.PopupAbonnementValidation-plan-badge {
  display: inline-flex;
  align-items: center;
  background: #0C447E;
  color: white;
  padding: 8px 16px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 16px;
}

.PopupAbonnementValidation-plan-summary {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.PopupAbonnementValidation-price-line,
.PopupAbonnementValidation-duration-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.PopupAbonnementValidation-price-label,
.PopupAbonnementValidation-duration-label {
  font-size: 14px;
  color: #666;
  font-weight: 500;
}

.PopupAbonnementValidation-price-value {
  font-size: 18px;
  font-weight: 700;
  color: #0C447E;
}

.PopupAbonnementValidation-duration-value {
  font-size: 16px;
  font-weight: 600;
  color: #0C447E;
}

.PopupAbonnementValidation-benefits {
  background: white;
  border-radius: 16px;
  padding: 24px;
  border: 1px solid #e5e7eb;
}

.PopupAbonnementValidation-benefits-title {
  font-size: 18px;
  font-weight: 700;
  color: #0C447E;
  margin: 0 0 16px 0;
}

.PopupAbonnementValidation-benefit-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.PopupAbonnementValidation-benefit {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  color: #374151;
  font-weight: 500;
}

.PopupAbonnementValidation-actions {
  padding: 0 32px 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.PopupAbonnementValidation-btn {
  width: 100%;
  padding: 16px 24px;
  border: none;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.PopupAbonnementValidation-btn::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transition: left 0.5s;
}

.PopupAbonnementValidation-btn:hover::before {
  left: 100%;
}

.PopupAbonnementValidation-btn-primary {
  background: linear-gradient(135deg, #10B981 0%, #059669 100%);
  color: white;
  box-shadow: 0 4px 15px rgba(16, 185, 129, 0.3);
}

.PopupAbonnementValidation-error .PopupAbonnementValidation-btn-primary {
  background: linear-gradient(135deg, #EF4444 0%, #DC2626 100%);
  box-shadow: 0 4px 15px rgba(239, 68, 68, 0.3);
}

.PopupAbonnementValidation-btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(16, 185, 129, 0.4);
}

.PopupAbonnementValidation-error .PopupAbonnementValidation-btn-primary:hover {
  box-shadow: 0 8px 25px rgba(239, 68, 68, 0.4);
}

.PopupAbonnementValidation-btn-secondary {
  background: linear-gradient(135deg, #f8f9ff 0%, #e8f2ff 100%);
  color: #0C447E;
  border: 2px solid #0C447E;
}

.PopupAbonnementValidation-btn-secondary:hover {
  background: #0C447E;
  color: white;
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(12, 68, 126, 0.3);
}

.PopupAbonnementValidation-footer {
  text-align: center;
  padding: 0 32px 32px;
  color: #666;
  font-size: 14px;
}

.PopupAbonnementValidation-link {
  color: #0C447E;
  text-decoration: none;
  font-weight: 600;
}

.PopupAbonnementValidation-link:hover {
  text-decoration: underline;
}

/* Responsive Design */

/* Mobile Portrait - Très petit écran */
@media (max-width: 360px) {
  .PopupAbonnementValidation-overlay {
    padding: 8px;
    align-items: flex-start;
    padding-top: 20px;
  }

  .PopupAbonnementValidation-container {
    border-radius: 16px;
    max-height: calc(100vh - 40px);
    width: 100%;
  }

  .PopupAbonnementValidation-close {
    top: 12px;
    right: 12px;
    width: 32px;
    height: 32px;
  }

  .PopupAbonnementValidation-header {
    padding: 30px 16px 20px;
    border-radius: 16px 16px 0 0;
  }

  .PopupAbonnementValidation-icon svg {
    width: 48px;
    height: 48px;
  }

  .PopupAbonnementValidation-title {
    font-size: 22px;
  }

  .PopupAbonnementValidation-subtitle {
    font-size: 14px;
  }

  .PopupAbonnementValidation-details {
    padding: 20px 16px;
  }

  .PopupAbonnementValidation-plan-info,
  .PopupAbonnementValidation-benefits {
    padding: 16px;
    margin-bottom: 16px;
  }

  .PopupAbonnementValidation-benefits-title {
    font-size: 16px;
  }

  .PopupAbonnementValidation-benefit {
    font-size: 13px;
  }

  .PopupAbonnementValidation-actions {
    padding: 0 16px 20px;
    gap: 10px;
  }

  .PopupAbonnementValidation-btn {
    padding: 14px 18px;
    font-size: 12px;
    border-radius: 10px;
  }

  .PopupAbonnementValidation-footer {
    padding: 0 16px 20px;
    font-size: 12px;
  }
}

/* Mobile Portrait */
@media (min-width: 361px) and (max-width: 480px) {
  .PopupAbonnementValidation-overlay {
    padding: 12px;
    align-items: flex-start;
    padding-top: 30px;
  }

  .PopupAbonnementValidation-container {
    border-radius: 18px;
    max-height: calc(100vh - 60px);
  }

  .PopupAbonnementValidation-header {
    padding: 40px 20px 24px;
    border-radius: 18px 18px 0 0;
  }

  .PopupAbonnementValidation-icon svg {
    width: 56px;
    height: 56px;
  }

  .PopupAbonnementValidation-title {
    font-size: 26px;
  }

  .PopupAbonnementValidation-subtitle {
    font-size: 15px;
  }

  .PopupAbonnementValidation-details {
    padding: 24px 20px;
  }

  .PopupAbonnementValidation-plan-info,
  .PopupAbonnementValidation-benefits {
    padding: 20px;
  }

  .PopupAbonnementValidation-actions {
    padding: 0 20px 24px;
  }

  .PopupAbonnementValidation-btn {
    padding: 15px 20px;
    font-size: 13px;
  }

  .PopupAbonnementValidation-footer {
    padding: 0 20px 24px;
    font-size: 13px;
  }
}

/* Mobile Landscape & Petites tablettes */
@media (min-width: 481px) and (max-width: 768px) {
  .PopupAbonnementValidation-overlay {
    padding: 16px;
  }

  .PopupAbonnementValidation-container {
    border-radius: 20px;
    max-height: 90vh;
    max-width: 480px;
  }

  .PopupAbonnementValidation-header {
    padding: 42px 28px 28px;
    border-radius: 20px 20px 0 0;
  }

  .PopupAbonnementValidation-title {
    font-size: 28px;
  }

  .PopupAbonnementValidation-details {
    padding: 28px;
  }

  .PopupAbonnementValidation-actions {
    padding: 0 28px 28px;
  }

  .PopupAbonnementValidation-footer {
    padding: 0 28px 28px;
  }
}

/* Tablettes */
@media (min-width: 769px) and (max-width: 1024px) {
  .PopupAbonnementValidation-container {
    max-width: 560px;
  }

  .PopupAbonnementValidation-actions {
    flex-direction: row;
    gap: 16px;
  }

  .PopupAbonnementValidation-btn {
    flex: 1 1;
    padding: 16px 20px;
  }
}

/* Desktop */
@media (min-width: 1025px) {
  .PopupAbonnementValidation-container {
    max-width: 580px;
  }

  .PopupAbonnementValidation-actions {
    flex-direction: row;
    gap: 20px;
  }

  .PopupAbonnementValidation-btn {
    flex: 1 1;
    padding: 18px 24px;
    font-size: 14px;
  }

  .PopupAbonnementValidation-btn:hover {
    transform: translateY(-2px);
  }
}

/* Très grand écran */
@media (min-width: 1440px) {
  .PopupAbonnementValidation-container {
    max-width: 620px;
  }

  .PopupAbonnementValidation-header {
    padding: 60px 40px 40px;
  }

  .PopupAbonnementValidation-title {
    font-size: 36px;
  }

  .PopupAbonnementValidation-subtitle {
    font-size: 18px;
  }

  .PopupAbonnementValidation-details {
    padding: 40px;
  }

  .PopupAbonnementValidation-plan-info,
  .PopupAbonnementValidation-benefits {
    padding: 28px;
  }

  .PopupAbonnementValidation-actions {
    padding: 0 40px 40px;
  }

  .PopupAbonnementValidation-footer {
    padding: 0 40px 40px;
    font-size: 16px;
  }
}

/* Orientation Portrait spécifique */
@media (orientation: portrait) and (max-height: 600px) {
  .PopupAbonnementValidation-overlay {
    align-items: flex-start;
    padding-top: 10px;
  }

  .PopupAbonnementValidation-container {
    max-height: calc(100vh - 20px);
  }

  .PopupAbonnementValidation-header {
    padding: 25px 24px 20px;
  }

  .PopupAbonnementValidation-title {
    font-size: 24px;
  }

  .PopupAbonnementValidation-details {
    padding: 20px 24px;
  }

  .PopupAbonnementValidation-actions {
    padding: 0 24px 20px;
  }

  .PopupAbonnementValidation-footer {
    padding: 0 24px 20px;
  }
}

/* Orientation Landscape sur mobile */
@media (orientation: landscape) and (max-height: 500px) {
  .PopupAbonnementValidation-overlay {
    align-items: flex-start;
    padding: 8px;
  }

  .PopupAbonnementValidation-container {
    max-height: calc(100vh - 16px);
    max-width: 90vw;
  }

  .PopupAbonnementValidation-header {
    padding: 20px 24px 16px;
  }

  .PopupAbonnementValidation-icon svg {
    width: 48px;
    height: 48px;
  }

  .PopupAbonnementValidation-title {
    font-size: 24px;
  }

  .PopupAbonnementValidation-subtitle {
    font-size: 14px;
  }

  .PopupAbonnementValidation-details {
    padding: 16px 24px;
  }

  .PopupAbonnementValidation-plan-info,
  .PopupAbonnementValidation-benefits {
    padding: 16px;
    margin-bottom: 12px;
  }

  .PopupAbonnementValidation-actions {
    flex-direction: row;
    gap: 12px;
    padding: 0 24px 16px;
  }

  .PopupAbonnementValidation-btn {
    flex: 1 1;
    padding: 12px 16px;
    font-size: 12px;
  }

  .PopupAbonnementValidation-footer {
    padding: 0 24px 16px;
    font-size: 12px;
  }
}
/* Style principal pour la page 404 Admin */
.Admin404-page {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
}

.Admin404-page-content {
  flex: 1 1;
  margin-left: 250px; 
  padding-top: 70px; 
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Quand le sidebar est collapsé */
.Admin404-page.sidebar-collapsed .Admin404-page-content {
  margin-left: 70px; /* Largeur du sidebar collapsé */
  width: calc(100% - 70px);
}

/* Conteneur pour le contenu 404 */
.Admin404-container {
  padding: 20px;
  box-sizing: border-box;
  text-align: center;
  margin-top: 50px;
}

.Admin404-title {
  font-size: 2.5rem;
  color: #333;
  margin-bottom: 20px;
}

.Admin404-message {
  font-size: 1.2rem;
  color: #666;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .Admin404-page-content {
    margin-left: 60px !important; /* Largeur du sidebar en mobile */
    width: calc(100% - 60px) !important;
  }
}
/* Style principal pour le composant 404 admin */
.AdminComponent404-container {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: calc(100vh - 150px);
  padding: 20px;
  background-color: #f5f7f9;
}

.AdminComponent404-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 800px;
  background-color: white;
  border-radius: 15px;
  padding: 40px;
  box-shadow: 0 6px 30px rgba(0, 0, 0, 0.05);
  text-align: center;
}

.AdminComponent404-error-number {
  font-size: 120px;
  font-weight: bold;
  color: #3f51b5;
  margin-bottom: 20px;
  text-shadow: 2px 4px 4px rgba(0, 0, 0, 0.1);
  background: linear-gradient(45deg, #3f51b5, #2196f3);
  /* -webkit-background-clip: text; */
  /* -webkit-text-fill-color: transparent; */
}

.AdminComponent404-message {
  margin: 20px 0;
}

.AdminComponent404-message h1 {
  font-size: 32px;
  font-weight: 500;
  color: #333;
  margin-bottom: 10px;
}

.AdminComponent404-message p {
  font-size: 16px;
  color: #777;
  margin-bottom: 30px;
}

.AdminComponent404-actions {
  display: flex;
  gap: 15px;
  margin-top: 20px;
}

.AdminComponent404-button {
  padding: 10px 24px;
  font-size: 16px;
  border-radius: 5px;
  cursor: pointer;
  transition: all 0.2s ease;
  font-weight: 500;
  border: none;
}

.AdminComponent404-button-primary {
  background-color: #3f51b5;
  color: white;
}

.AdminComponent404-button-primary:hover {
  background-color: #303f9f;
  box-shadow: 0 4px 12px rgba(63, 81, 181, 0.3);
}

.AdminComponent404-button-secondary {
  background-color: white;
  color: #3f51b5;
  border: 1px solid #3f51b5;
}

.AdminComponent404-button-secondary:hover {
  background-color: #f5f7ff;
  box-shadow: 0 4px 12px rgba(63, 81, 181, 0.1);
}

/* Animation illustration */
.AdminComponent404-illustration {
  position: relative;
  width: 200px;
  height: 200px;
  margin: 20px 0;
}

.AdminComponent404-circle {
  position: absolute;
  width: 160px;
  height: 160px;
  background-color: #f0f3ff;
  border-radius: 50%;
  z-index: 0;
  top: 20px;
  left: 20px;
}

.AdminComponent404-clip {
  position: absolute;
  width: 160px;
  height: 160px;
  overflow: hidden;
  border-radius: 50%;
  z-index: 1;
  top: 20px;
  left: 20px;
  animation: pulse 3s infinite alternate;
}

.AdminComponent404-paper {
  width: 120px;
  height: 120px;
  background-color: white;
  border-radius: 50%;
  position: absolute;
  top: 20px;
  left: 20px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.AdminComponent404-face {
  position: relative;
  width: 100%;
  height: 100%;
}

.AdminComponent404-eyes {
  display: flex;
  justify-content: center;
  gap: 30px;
  position: absolute;
  top: 40px;
  width: 100%;
}

.AdminComponent404-eye {
  width: 20px;
  height: 20px;
  background-color: #3f51b5;
  border-radius: 50%;
  animation: blink 3s infinite;
}

.AdminComponent404-mouth {
  position: absolute;
  width: 60px;
  height: 20px;
  border-radius: 0 0 20px 20px;
  top: 70px;
  left: 30px;
}

.AdminComponent404-sad {
  border-top: 4px solid #3f51b5;
  border-radius: 50% 50% 0 0;
  transform: rotate(180deg);
}

@keyframes blink {
  0%, 45%, 55%, 100% {
    transform: scaleY(1);
  }
  50% {
    transform: scaleY(0.1);
  }
}

@keyframes pulse {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .AdminComponent404-content {
    padding: 20px;
  }
  
  .AdminComponent404-error-number {
    font-size: 90px;
  }
  
  .AdminComponent404-message h1 {
    font-size: 24px;
  }
  
  .AdminComponent404-actions {
    flex-direction: column;
  }
}
/* Style principal pour la page 404 partenaire */
.Partenaire404Page-container {
  min-height: 100vh;
  display: flex;
  width: 100%;
  background-color: #f5f7f9;
}

.Partenaire404Page-content {
  flex: 1 1;
  margin-left: 250px; 
  padding-top: 70px; 
  transition: margin-left 0.3s ease;
  width: calc(100% - 250px);
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Quand le sidebar est collapsé */
.Partenaire404Page-sidebar-collapsed .Partenaire404Page-content {
  margin-left: 70px; /* Largeur du sidebar collapsé */
  width: calc(100% - 70px);
}

/* Conteneur pour le contenu principal */
.Partenaire404Page-main-content {
  padding: 0 20px;
  box-sizing: border-box;
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .Partenaire404Page-content {
    margin-left: 60px !important; /* Largeur du sidebar en mobile */
    width: calc(100% - 60px) !important;
  }
  
  .Partenaire404Page-main-content {
    padding: 0 10px;
  }
}

@media (max-width: 480px) {
  .Partenaire404Page-main-content {
    padding: 0 5px;
  }
}
/* Style principal pour le composant 404 des partenaires */
.PartenaireComponent404-container {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: calc(100vh - 150px);
  padding: 20px;
  background-color: #f5f7f9;
}

.PartenaireComponent404-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 800px;
  background-color: white;
  border-radius: 15px;
  padding: 40px;
  box-shadow: 0 6px 30px rgba(0, 0, 0, 0.05);
  text-align: center;
}

.PartenaireComponent404-error-number {
  font-size: 120px;
  font-weight: bold;
  color: #3f51b5;
  margin-bottom: 20px;
  text-shadow: 2px 4px 4px rgba(0, 0, 0, 0.1);
  background: linear-gradient(45deg, #3f51b5, #2196f3);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.PartenaireComponent404-message {
  margin: 20px 0;
}

.PartenaireComponent404-message h1 {
  font-size: 32px;
  font-weight: 500;
  color: #333;
  margin-bottom: 10px;
}

.PartenaireComponent404-message p {
  font-size: 16px;
  color: #777;
  margin-bottom: 30px;
}

.PartenaireComponent404-actions {
  display: flex;
  gap: 15px;
  margin-top: 20px;
}

.PartenaireComponent404-button {
  padding: 10px 24px;
  font-size: 16px;
  border-radius: 5px;
  cursor: pointer;
  transition: all 0.2s ease;
  font-weight: 500;
  border: none;
}

.PartenaireComponent404-button-primary {
  background-color: #3f51b5;
  color: white;
}

.PartenaireComponent404-button-primary:hover {
  background-color: #303f9f;
  box-shadow: 0 4px 12px rgba(63, 81, 181, 0.3);
}

.PartenaireComponent404-button-secondary {
  background-color: white;
  color: #3f51b5;
  border: 1px solid #3f51b5;
}

.PartenaireComponent404-button-secondary:hover {
  background-color: #f5f7ff;
  box-shadow: 0 4px 12px rgba(63, 81, 181, 0.1);
}

/* Animation illustration */
.PartenaireComponent404-illustration {
  position: relative;
  width: 200px;
  height: 200px;
  margin: 20px 0;
}

.PartenaireComponent404-circle {
  position: absolute;
  width: 160px;
  height: 160px;
  background-color: #f0f3ff;
  border-radius: 50%;
  z-index: 0;
  top: 20px;
  left: 20px;
}

.PartenaireComponent404-clip {
  position: absolute;
  width: 160px;
  height: 160px;
  overflow: hidden;
  border-radius: 50%;
  z-index: 1;
  top: 20px;
  left: 20px;
  animation: pulse 3s infinite alternate;
}

.PartenaireComponent404-paper {
  width: 120px;
  height: 120px;
  background-color: white;
  border-radius: 50%;
  position: absolute;
  top: 20px;
  left: 20px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.PartenaireComponent404-face {
  position: relative;
  width: 100%;
  height: 100%;
}

.PartenaireComponent404-eyes {
  display: flex;
  justify-content: center;
  gap: 30px;
  position: absolute;
  top: 40px;
  width: 100%;
}

.PartenaireComponent404-eye {
  width: 20px;
  height: 20px;
  background-color: #3f51b5;
  border-radius: 50%;
  animation: blink 3s infinite;
}

.PartenaireComponent404-mouth {
  position: absolute;
  width: 60px;
  height: 20px;
  border-radius: 0 0 20px 20px;
  top: 70px;
  left: 30px;
}

.PartenaireComponent404-sad {
  border-top: 4px solid #3f51b5;
  border-radius: 50% 50% 0 0;
  transform: rotate(180deg);
}

@keyframes blink {
  0%, 45%, 55%, 100% {
    transform: scaleY(1);
  }
  50% {
    transform: scaleY(0.1);
  }
}

@keyframes pulse {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
}

/* Style responsive pour les appareils mobiles */
@media (max-width: 768px) {
  .PartenaireComponent404-content {
    padding: 20px;
  }
  
  .PartenaireComponent404-error-number {
    font-size: 90px;
  }
  
  .PartenaireComponent404-message h1 {
    font-size: 24px;
  }
  
  .PartenaireComponent404-actions {
    flex-direction: column;
  }
}
.Admin404-container {
  /* Styles de base pour le conteneur principal */
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #f5f5f5;
}

.Admin404-title {
  font-size: 2rem;
  color: #333;
}

.Admin404-message {
  font-size: 1.2rem;
  color: #666;
  margin-top: 1rem;
}
/* Container principal */
.MaintenanceComponent-container {
  font-family: 'Poppins', sans-serif;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  background-color: #f9f9f9;
  padding: 20px;
}

/* Contenu central */
.MaintenanceComponent-content {
  max-width: 600px;
  width: 100%;
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.08);
  padding: 40px;
  text-align: center;
  margin-bottom: 20px;
}

/* Icône principale */
.MaintenanceComponent-icon-container {
  background-color: rgba(14, 76, 144, 0.1);
  width: 100px;
  height: 100px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto 30px;
}

.MaintenanceComponent-icon {
  font-size: 40px;
  color: #0e4c90;
}

/* Titre */
.MaintenanceComponent-title {
  font-size: 28px;
  font-weight: 600;
  color: #0e4c90;
  margin: 0 0 20px;
}

.MaintenanceComponent-title-accent {
  color: #e63946;
}

/* Message principal */
.MaintenanceComponent-message {
  font-size: 16px;
  color: #555;
  line-height: 1.6;
  margin-bottom: 30px;
}

/* Carte d'information */
.MaintenanceComponent-info-card {
  background-color: #f5f5f5;
  border-radius: 8px;
  padding: 20px;
  margin-bottom: 30px;
}

.MaintenanceComponent-info-item {
  display: flex;
  align-items: flex-start;
  text-align: left;
  margin-bottom: 15px;
}

.MaintenanceComponent-info-item:last-child {
  margin-bottom: 0;
}

.MaintenanceComponent-info-icon {
  color: #0e4c90;
  font-size: 20px;
  margin-right: 15px;
  margin-top: 3px;
}

.MaintenanceComponent-info-title {
  font-size: 16px;
  font-weight: 500;
  color: #333;
  margin: 0 0 5px;
}

.MaintenanceComponent-info-text {
  font-size: 14px;
  color: #555;
  margin: 0;
}

/* Barre de progression */
.MaintenanceComponent-progress {
  margin-top: 20px;
}

.MaintenanceComponent-progress-bar {
  height: 8px;
  background-color: #eaeaea;
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 10px;
}

.MaintenanceComponent-progress-fill {
  height: 100%;
  width: 65%;
  background-color: #0e4c90;
  border-radius: 4px;
  animation: progress 2s ease-in-out infinite alternate;
}

.MaintenanceComponent-progress-text {
  font-size: 13px;
  color: #666;
  margin: 0;
}

/* Footer */
.MaintenanceComponent-footer {
  color: #777;
  font-size: 13px;
}

/* Animation pour la barre de progression */
@keyframes progress {
  0% {
    width: 55%;
  }
  100% {
    width: 75%;
  }
}

/* Responsive design */
@media (max-width: 768px) {
  .MaintenanceComponent-content {
    padding: 30px;
  }
  
  .MaintenanceComponent-icon-container {
    width: 80px;
    height: 80px;
    margin-bottom: 20px;
  }
  
  .MaintenanceComponent-icon {
    font-size: 32px;
  }
  
  .MaintenanceComponent-title {
    font-size: 24px;
  }
  
  .MaintenanceComponent-message {
    font-size: 15px;
  }
}

@media (max-width: 480px) {
  .MaintenanceComponent-container {
    padding: 15px;
  }
  
  .MaintenanceComponent-content {
    padding: 25px;
  }
  
  .MaintenanceComponent-icon-container {
    width: 70px;
    height: 70px;
  }
  
  .MaintenanceComponent-icon {
    font-size: 28px;
  }
  
  .MaintenanceComponent-title {
    font-size: 22px;
    margin-bottom: 15px;
  }
  
  .MaintenanceComponent-info-card {
    padding: 15px;
  }
  
  .MaintenanceComponent-info-icon {
    font-size: 18px;
  }
  
  .MaintenanceComponent-info-title {
    font-size: 15px;
  }
  
  .MaintenanceComponent-info-text {
    font-size: 13px;
  }
}
.cc-container {
  max-width: 780px;
  margin: 0 auto 20px auto;
  padding: 25px 30px;
  background: var(--bg-white);
  border-radius: 14px;
  box-shadow: var(--shadow-medium);
  display: flex;
  flex-direction: column;
}

.cc-title {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 8px;
}

.cc-description {
  font-size: 0.95rem;
  line-height: 1.5;
  color: var(--text-secondary);
  margin-bottom: 12px; /* reduce this to reduce space */
}

.cc-buttons {
  display: flex;
  gap: 16px;
  margin-top: 10px;
}

.cc-accept,
.cc-decline {
  padding: 10px 22px;
  border-radius: 10px;
  font-weight: 600;
  cursor: pointer;
  border: none;
  transition: all 0.2s ease-in-out;
}

/* Accept button */
.cc-accept {
  background: var(--primary-color);
  color: white;
}

.cc-accept:hover {
  background: var(--primary-hover);
}

/* Decline button */
.cc-decline {
  background: transparent;
  border: 2px solid var(--primary-color);
  color: var(--primary-color);
}

.cc-decline:hover {
  background: var(--bg-light);
}

.cc-container {
  position: fixed;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);

  max-width: 780px;
  width: calc(100% - 40px);

  padding: 25px 30px;
  background: var(--bg-white);
  border-radius: 14px;
  box-shadow: var(--shadow-medium);

  display: flex;
  flex-direction: column;
  z-index: 99999;
}


/*# sourceMappingURL=main.362392fe.css.map*/