html,body{height:100%;margin:0}ul{padding:0;margin:0;list-style:none}.btn{margin:5px;padding:5px;align-self:center;cursor:pointer}.btn:disabled{cursor:not-allowed;opacity:.5}.btn:disabled:hover{background-color:var(--yellow-500);color:#000;border-color:var(--yellow-500)}.btn-primary{background-color:var(--yellow-500);color:#000;border-color:var(--yellow-500);border-radius:7px;font-family:var(--font-subtitle);padding:5px;font-size:15px}.btn-primary:hover{background-color:#000;color:var(--yellow-500);border-color:#000}.main-title{grid-column:1;justify-self:center;font-family:var(--font-title);color:var(--yellow-500);font-size:clamp(1.3rem,1.5vw,1.8rem)}@keyframes spin{to{transform:rotate(360deg)}}.spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.2);border-top-color:var(--yellow-500);border-radius:50%;animation:spin .8s linear infinite}.sports-filters{margin:3px;align-self:center}select,select::picker(select){appearance:base-select;font-family:var(--font-subtitle);color:var(--yellow-500);background-color:#000;border:1px solid var(--yellow-500);border-radius:4px;padding:5px;cursor:pointer;font-size:clamp(12px,2vw,16px)}@media(min-width:769px){.main-title{grid-column:2;justify-self:center;font-family:var(--font-title);color:var(--yellow-500);font-size:5vh}}:root{--yellow-50: #fffdf5;--yellow-100: #fff9db;--yellow-200: #fff3bf;--yellow-300: #ffec99;--yellow-400: #ffe066;--yellow-500: #ffd43b;--yellow-600: #fcc419;--yellow-700: #fab005;--yellow-800: #f59f00;--yellow-900: #e67700;--black-almost: #1a1a1a;--font-title: "Gravitas One", sans-serif;--font-subtitle: "Montserrat", sans-serif;--font-body: "Inter", sans-serif}.layout{position:relative;height:100vh;width:100vw;overflow:hidden;--header-height: clamp(80px, 10vh, 100px)}.header{position:absolute;top:0;left:0;right:0;z-index:10;display:grid;grid-template-columns:1fr 1fr;padding:10px;height:var(--header-height)}.main{position:absolute;inset:0;z-index:1}.filters{position:absolute;top:var(--header-height);margin-top:10px;z-index:10}.footer{position:absolute;bottom:18px;left:8px;z-index:10}.footer-container{font-family:var(--font-subtitle);color:var(--yellow-500);font-size:3vh}@media(min-width:769px){.filters{left:50%;transform:translate(-50%)}.header{grid-template-columns:1fr 50vw 1fr}}.login-container{position:relative;grid-column:3;justify-self:end;align-items:center}.login-modale-btn{background-color:transparent;color:var(--yellow-500);border:none;font-size:8vh}.login-modale-btn:hover{transform:translate(-1px,-1px);text-shadow:1px 1px 0 var(--yellow-500)}.formGroup{display:flex;flex-direction:column;gap:5px;margin-bottom:10px}.custom-input{padding:8px;border:1px solid var(--yellow-500);border-radius:4px;background-color:transparent;color:var(--yellow-300)}.custom-input:focus{outline:none;border:none}.btn-login-container{display:flex;justify-content:center}.toggle-register-btn{background-color:transparent;color:var(--yellow-500);border:none;font-size:14px;margin-top:15px}.toggle-register-btn:hover{text-decoration:underline}.form-wrapper{overflow:hidden}.slide-up-enter-active,.slide-up-leave-active{transition:all .4s ease}.slide-up-enter-from{transform:translateY(40px);opacity:0}.slide-up-enter-to,.slide-up-leave-from{transform:translateY(0);opacity:1}.slide-up-leave-to{transform:translateY(-40px);opacity:0}.error-message{animation:fadeOut 3s forwards;border:1px solid red;color:red}@keyframes fadeOut{0%{opacity:1}80%{opacity:1}to{opacity:0}}.map-wrapper,#map{height:100%;width:100%}.map-blur{filter:blur(3px)}.map-overlay{position:absolute;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;background-color:#0006;border-radius:inherit}.sport-marker{width:14px;height:14px;background:var(--yellow-300);border-radius:50%;border:2px solid white;box-shadow:0 0 0 2px #0000004d;transition:all .2s ease}.selected-marker{background:var(--yellow-500);transform:scale(1.4);box-shadow:0 0 0 4px #fff9}.bloc-modale{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:11}.overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#0009}.modale{position:relative;background:#000;color:var(--yellow-500);border-radius:10px;box-shadow:0 2px 4px var(--yellow-300);width:clamp(140px,22vw,500px);padding:30px;border:1px solid var(--yellow-300);font-family:var(--font-subtitle)}.modale-title{text-align:center;font-size:4vh;margin-bottom:20px}.user-wrapper{position:relative;display:inline-block;padding-right:clamp(5px,1vw,20px);padding-top:clamp(15px,1vw,20px);justify-self:center}.user-container{display:flex;flex-direction:row-reverse;align-items:center;justify-content:flex-end;cursor:pointer;padding-right:8px;overflow:hidden;color:var(--yellow-500);font-size:clamp(20px,5vw,30px)}.user-container .username{opacity:0;margin-left:0;transition:opacity .3s ease,margin-left .3s ease;white-space:nowrap}.user-wrapper:hover .username{opacity:1;margin-left:8px}.user-wrapper:hover{border:3px solid var(--yellow-500);border-radius:7px;background-color:transparent;padding:5px}.menu-container{position:absolute;top:100%;right:0;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .25s ease,transform .25s ease}.user-wrapper:hover .menu-container{opacity:1;transform:translateY(0);pointer-events:auto}.menu-list{list-style:none;padding:0;margin:0;align-items:flex-end}.menu-item{padding-top:clamp(5px,1vw,20px);color:var(--yellow-500);font-size:clamp(15px,3vh,25px);cursor:pointer;font-family:var(--font-subtitle)}.menu-item:hover{background:#ffffff0d;transform:translate(4px)}.popup{position:fixed;bottom:20px;left:50%;transform:translate(-50%);z-index:1100;border:1px solid var(--yellow-500);background-color:#000;color:var(--yellow-500);border-radius:5px;padding:clamp(8px,1vw,10px);animation:slideUp .5s ease-out}.retour-user{display:grid;grid-template-columns:1fr 24px;align-items:start;padding-right:4px;min-width:100px}@keyframes slideUp{0%{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%)}}.btn-close-retour-user{background:none;border:none;color:var(--yellow-500);font-size:18px;align-self:start;padding:0;line-height:1;cursor:pointer}.message-retour-user{font-family:var(--font-subtitle);font-size:14px;padding-top:10px}.menu-sport-element{display:grid;grid-template-rows:auto 50px 100px;gap:5px;min-width:100px}.btn-close-menu-sport-element{background:none;border:none;color:var(--yellow-500);font-size:18px}.first-line-menu-sport-element{display:flex;justify-content:space-between;font-family:var(--font-subtitle);font-size:16px}.second-line-menu-sport-element{font-family:var(--font-subtitle);font-size:14px}.third-line-menu-sport-element{display:flex;flex-direction:column;justify-content:center;align-items:center;font-family:var(--font-subtitle);font-size:8px;gap:2px;padding:3px}.third-line-menu-sport-element .a{width:100%}@media(min-width:769px){.third-line-menu-sport-element{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;font-family:var(--font-subtitle);font-size:14px;gap:5px;padding:10px}.third-line-menu-sport-element .a{width:auto}.menu-sport-element{display:grid;grid-template-rows:auto 50px 50px;gap:5px;min-width:35vw}}.favoris-container{display:flex;flex-direction:column;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1100;border:1px solid var(--yellow-500);background-color:#000;color:var(--yellow-500);border-radius:5px;padding:10px;animation:appears .3s ease-out;height:clamp(275px,50vh,500px);width:clamp(200px,35vw,250px)}.favoris-list{display:flex;flex-direction:column;gap:5px;height:100%;overflow-y:auto;flex:1}.btn-close-favoris-container{background:none;border:none;color:var(--yellow-500);font-size:18px}.first-line-favoris-container{display:flex;justify-content:space-between;font-family:var(--font-subtitle);font-size:16px}.favori-item{display:grid;grid-template-columns:50% 50%;padding:12px 15px;margin-top:10px;border:1px solid var(--yellow-500);border-radius:6px;background:#111}.favori-info{display:flex;flex-direction:column}.favori-name{font-weight:600;font-size:14px}.favori-sport{font-size:12px;opacity:.7}.button-container{display:flex;justify-content:flex-end;align-items:center}@keyframes appears{0%{opacity:0}to{opacity:1}}@media(min-width:769px){.favoris-container{top:50%;left:20px;transform:translateY(-50%)}}