@import"https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap";*{margin:0;padding:0;box-sizing:border-box;border:0;font:inherit;vertical-align:baseline}html,body{height:100%;line-height:1;font-family:Nunito Sans,sans-serif;background-color:#fafafa}ol,ul{list-style:none}table{border-collapse:collapse;border-spacing:0}a{text-decoration:none;color:inherit}:root{--bg-color: hsl(0, 0%, 99%);--element-bg: hsl(0, 100%, 100%);--text-color: hsl(200, 15%, 8%);--input-bg: hsl(0, 100%, 100%);--input-shadow: 0 2px 8px rgba(0, 0, 0, .05);--placeholder-color: hsl(0, 0%, 50%)}html.dark{--bg-color: hsl(207, 26%, 17%);--element-bg: hsl(209, 23%, 22%);--text-color: hsl(0, 100%, 100%);--input-bg: hsl(209, 23%, 22%);--input-shadow: 0 1px 3px rgba(0, 0, 0, .171);--placeholder-color: hsl(0, 0%, 80%)}html,body{height:100%;line-height:1;font-family:Nunito Sans,sans-serif;background-color:var(--bg-color);color:var(--text-color);transition:background-color .3s ease,color .3s ease}.countriesPage{width:100%;height:100vh;display:flex;flex-direction:column;align-items:center;gap:32px}.filtersAndCards{width:90vw;display:flex;flex-direction:column;gap:48px}.filters{display:flex;justify-content:space-between}.filters Input{width:500px}.filterBar{width:300px}.countriesCard{display:flex;flex-wrap:wrap;gap:48px;justify-content:center}@media (max-width: 1024px){.filters{gap:32px;flex-direction:column}.filters input{width:100%}.filterBar{width:50%}}.countryCard{background-color:var(--element-bg);min-height:300px;border-radius:8px;width:248px;box-shadow:var(--input-shadow)}.flagContainer{height:160px;width:100%;border-top-left-radius:8px;border-top-right-radius:8px;overflow:hidden}.flagContainer img{width:100%;height:100%;object-fit:cover;display:block}.informationsCountryCard{padding:16px;display:flex;flex-direction:column;gap:24px}.nameCountryCard{font-weight:800;flex-wrap:wrap}.informationCard{font-weight:600}.otherInformationsCard{display:flex;flex-direction:column;justify-content:center;gap:8px;font-size:14px}.menu{background-color:var(--element-bg);display:flex;justify-content:space-between;align-items:center;width:100%;padding:16px 32px;box-shadow:var(--input-shadow)}.menu h1{font-weight:800;font-size:24px}.menu p{font-weight:600}.darkModeToggle{background-color:transparent;border:none;color:var(--text-color);display:flex;align-items:center;gap:8px;font-weight:600;cursor:pointer;font-family:inherit;padding:4px 8px;border-radius:4px;transition:background-color .3s ease}.dark .iconMoon{color:#fff}.spinnerLoading{height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:var(--element-bg)}.textLoading{margin-top:16px;font-size:18px;font-weight:600;color:var(--text-color)}.input{padding:8px;box-shadow:var(--input-shadow);color:var(--text-color);border:none;outline:none;border-radius:4px;background-color:var(--element-bg)}.input::placeholder{color:var(--text-color)}.countryDetailContainer{display:flex;flex-direction:column;gap:32px;padding:48px}.countryDetailContent{display:flex;justify-content:flex-start;gap:48px;overflow:visible}.countryImage{width:100%;max-width:600px;height:auto;border-radius:8px;transition:box-shadow .3s ease,transform .3s ease;object-fit:contain}.informationsCountryDetailAndTitle{display:flex;flex-direction:column;justify-content:center;gap:48px}.informationsCountryDetailAndTitle h1{font-size:24px;font-weight:800}.informationsCountryDetail{display:flex;gap:100px;padding:0}.informationsCountryDetail div{display:flex;flex-direction:column;gap:16px}.information{font-weight:600}.bordersCountryInformation{display:flex;gap:8px;flex-direction:column}.bordersCountry{display:flex;flex-direction:row;gap:16px;flex-wrap:wrap}@media (max-width: 1024px){.countryDetailContent{flex-direction:column}.countryImage{width:100%}.informationsCountryDetail{flex-direction:column;gap:48px}}.button{box-shadow:0 2px 8px #00000042;padding:8px;width:100px;display:flex;gap:4px;justify-content:center;align-items:center;transition:background-color .3s ease,transform .2s ease,box-shadow .2s ease}.button:hover{cursor:pointer;background-color:#d4d4d4b6;transform:translateY(-2px);box-shadow:0 4px 10px #0000001a}