@import"https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap";:root{--header-text: #111517;--secondary-background: #ffffff;--primary-background: #fafafa;--placeholder-text: #c4c4c4;--primary-text: #111517;--error-text: #a03525;--error-background: #e8f4f8;--shadow-sm: 0 .125rem .25rem rgba(0, 0, 0, .075);--shadow-md: 0 .25rem .5rem rgba(0, 0, 0, .1);--shadow-lg: 0 .5rem 1rem rgba(0, 0, 0, .15);--shadow-xl: 0 1rem 2rem rgba(0, 0, 0, .2)}[data-theme=dark]{--header-text: #ffffff;--secondary-background: #2b3844;--primary-background: #202c36;--placeholder-text: #ffffff;--primary-text: #ffffff;--error-text: #ff6b6b;--error-background: #2b2d2e;--shadow-sm: 0 .125rem .25rem rgba(0, 0, 0, .3);--shadow-md: 0 .25rem .5rem rgba(0, 0, 0, .4);--shadow-lg: 0 .5rem 1rem rgba(0, 0, 0, .5);--shadow-xl: 0 1rem 2rem rgba(0, 0, 0, .6)}*,*:after,*:before{box-sizing:border-box}.nunito-font-300{font-family:Nunito Sans;font-weight:300}.nunito-font-600{font-family:Nunito Sans;font-weight:600}.nunito-font-800{font-family:Nunito Sans;font-weight:800}body{margin:0;padding:0;background-color:var(--primary-background)}body *{transition:background-color .7s ease-in-out}.app{min-width:20rem;min-height:100vh;background-color:var(--primary-background);color:var(--primary-text)}.home-page{max-width:90rem;min-width:20rem;margin:0 auto;display:flex;flex-direction:column;gap:3rem;padding:3rem 1rem;background-color:var(--primary-background);color:var(--primary-text)}h1{padding:0 1rem;font-size:.875rem}.page-header{width:100%;background-color:var(--secondary-background);box-shadow:var(--shadow-sm);position:sticky;top:0;z-index:100}.header{display:flex;align-items:center;justify-content:space-between;color:var(--primary-text);padding-inline:1rem;background-color:var(--secondary-background);height:5rem;max-width:90rem;margin:0 auto}.header a{color:var(--header-text);text-decoration:none;transition:opacity .2s ease,transform .2s ease;cursor:pointer;display:inline-block}.header a:hover{opacity:.7;transform:scale(1.02)}.header a:active{transform:scale(.98)}.header a:focus-visible{outline:2px solid var(--primary-text);outline-offset:4px;border-radius:.25rem}.darkMode{display:flex;align-items:center;gap:.1rem}.dark-btn{background-color:var(--secondary-background);color:var(--header-text);border:none;cursor:pointer;transition:opacity .2s ease}.dark-btn:hover{opacity:.7}.dark-btn:focus-visible{outline:2px solid var(--primary-text);outline-offset:2px}.filter-tools-home{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:2.5rem;width:100%}.search-area{display:flex;align-items:center;gap:1.5rem;height:3rem;background-color:var(--secondary-background);padding-left:1.75rem;width:21.5rem;border-radius:.5rem;box-shadow:var(--shadow-sm);transition:box-shadow .2s ease}.search-area:focus-within{box-shadow:0 0 0 2px var(--primary-text)}.search-icon{color:var(--placeholder-text)}#search{border:0;font-size:.75rem;padding-block:.75rem;width:100%;background-color:var(--secondary-background);color:var(--primary-text);outline:none}::placeholder{color:var(--placeholder-text);padding-inline:.5rem}input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{display:none}.search-failed{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:50vh;padding:2rem}.search-failed-content{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:3rem 2rem;background-color:var(--secondary-background);border-radius:.5rem;box-shadow:var(--shadow-md);max-width:28rem;text-align:center;animation:fadeIn .3s ease-in}.search-failed-icon{font-size:4rem;color:var(--placeholder-text);opacity:.5;margin-bottom:.5rem}.search-failed-title{font-size:1.5rem;font-weight:800;color:var(--primary-text);margin:0}.search-failed-text{color:var(--primary-text);font-weight:600;font-size:1rem;margin:0;line-height:1.5}.search-failed-suggestion{color:var(--placeholder-text);font-size:.875rem;margin:0;font-weight:400}.search-failed-button{margin-top:1rem;padding:.75rem 1.5rem;background-color:var(--primary-text);color:var(--secondary-background);border:none;border-radius:.375rem;font-weight:600;font-size:.875rem;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,opacity .2s ease;box-shadow:var(--shadow-sm)}.search-failed-button:hover{transform:translateY(-.125rem);box-shadow:var(--shadow-md);opacity:.9}.search-failed-button:active{transform:translateY(0)}.search-failed-button:focus-visible{outline:2px solid var(--primary-text);outline-offset:2px}.go-back{background-color:var(--secondary-background)}.fetch-failed-page{display:flex;justify-content:center;align-items:center;min-height:80vh;padding:2rem;background-color:var(--primary-background)}.fetch-failed-content{display:flex;flex-direction:column;align-items:center;text-align:center;gap:1.5rem;padding:4rem 3rem;background-color:var(--secondary-background);border-radius:.5rem;box-shadow:var(--shadow-lg);max-width:32rem;animation:fadeIn .3s ease-in}.fetch-failed-icon{font-size:5rem;color:#e74c3c;opacity:.9;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.9}50%{opacity:.5}}.fetch-failed-title{font-size:2rem;font-weight:800;color:var(--primary-text);margin:0;line-height:1.2}.fetch-failed-message{font-size:1rem;color:var(--primary-text);margin:0;line-height:1.6;font-weight:400}.fetch-failed-suggestion{font-size:.875rem;color:var(--placeholder-text);margin:0;font-weight:400}.fetch-failed-actions{display:flex;gap:1rem;margin-top:1rem;flex-wrap:wrap;justify-content:center}.fetch-failed-button{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.875rem 2rem;border:none;border-radius:.375rem;font-weight:600;font-size:.9375rem;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,opacity .2s ease;text-decoration:none;font-family:inherit}.fetch-failed-button.primary{background-color:var(--primary-text);color:var(--secondary-background);box-shadow:var(--shadow-sm)}.fetch-failed-button.primary:hover{transform:translateY(-.125rem);box-shadow:var(--shadow-md);opacity:.9}.fetch-failed-button.secondary{background-color:transparent;color:var(--primary-text);border:2px solid var(--primary-text);box-shadow:none}.fetch-failed-button.secondary:hover{transform:translateY(-.125rem);background-color:var(--primary-text);color:var(--secondary-background)}.fetch-failed-button:active{transform:translateY(0)}.fetch-failed-button:focus-visible{outline:2px solid var(--primary-text);outline-offset:2px}.button-icon{font-size:1.25rem}.filter-area{display:flex;align-items:center;justify-content:flex-start;width:12.5rem;background-color:var(--secondary-background);height:3rem;padding-left:1.5rem;position:relative;border-radius:.5rem;box-shadow:var(--shadow-sm);transition:box-shadow .2s ease}.filter-area:focus-within{box-shadow:0 0 0 2px var(--primary-text)}.select-filter{width:10rem;background-color:var(--secondary-background);color:var(--primary-text);border-style:none;cursor:pointer;outline:none;transition:opacity .2s ease}.select-filter:hover{opacity:.8}.card{width:16.5rem;height:21rem;display:flex;flex-direction:column;background-color:var(--secondary-background);color:var(--primary-text);border-radius:.5rem;transition:transform .2s ease,box-shadow .2s ease;cursor:pointer;box-shadow:var(--shadow-sm);overflow:hidden}.card:hover{transform:translateY(-.5rem);box-shadow:var(--shadow-lg)}.card:focus-within{outline:2px solid var(--primary-text);outline-offset:2px}.card-home{display:flex;flex-wrap:wrap;gap:2.5rem;justify-content:center}.cardClass img{width:16.5rem;height:10rem;object-fit:cover;border-radius:.375rem .375rem 0 0}.cardClass{display:flex;flex-direction:column;height:100%}.card-text{margin-left:1.5rem;margin-right:1.5rem;padding-bottom:1.5rem;padding-top:1.5rem;flex:1;display:flex;flex-direction:column;gap:.5rem}.card-text h2{margin:0 0 .5rem}.card-text p{margin:0;font-size:.875rem}.not-found-page{display:flex;flex-direction:column;gap:2rem;align-items:center}.shadow{box-shadow:var(--shadow-sm)}.details-main{max-width:90rem;margin:0 auto;background-color:var(--primary-background)}.details-section{display:flex;flex-direction:column;padding:2.5rem 1.75rem 3.875rem;background-color:var(--primary-background);color:var(--primary-text)}.detail-area{font-size:.875rem}.detail-area>h2{margin-top:2.75rem}.details-content img{max-width:100%}.details-loading{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:60vh;padding:2rem}.back-button{display:flex;align-items:center;justify-content:center;margin:2.5rem 0 4rem;border-radius:.375rem;width:6.5rem;height:2rem;gap:.75rem;background-color:var(--secondary-background);transition:transform .2s ease,box-shadow .2s ease;box-shadow:var(--shadow-sm)}.back-button:hover{transform:translateY(-.125rem);box-shadow:var(--shadow-md)}.back-button:focus-visible{outline:2px solid var(--primary-text);outline-offset:2px}.react-icon{font-size:large}.details-item{font-family:Nunito Sans,sans-serif;font-weight:600}.details-item span{font-family:Nunito Sans,sans-serif;font-weight:300}.details-mid{display:flex;flex-direction:column;gap:2rem;margin-bottom:2rem}.detail-border{display:flex;flex-direction:column}.border-countries{display:flex;gap:1rem;flex-wrap:wrap;color:var(--primary-text)}a:-webkit-any-link{color:var(--primary-text);cursor:pointer;text-decoration:none;transition:opacity .2s ease}a:focus-visible{outline:2px solid var(--primary-text);outline-offset:2px;border-radius:.25rem}.border-links{display:flex;padding:0 .75rem;border-radius:.375rem;text-decoration:none;background-color:var(--secondary-background);box-shadow:var(--shadow-sm);transition:transform .2s ease,box-shadow .2s ease}.border-links:hover{transform:translateY(-.125rem);box-shadow:var(--shadow-md)}.border-links:focus-visible{outline:2px solid var(--primary-text);outline-offset:2px}.loading-container{display:flex;justify-content:center;align-items:center;min-height:50vh;padding:2rem}.loading{text-align:center;width:18rem;background-color:var(--secondary-background);border-radius:.5rem;box-shadow:var(--shadow-md);animation:fadeIn .3s ease-in}.loading-card{display:flex;flex-direction:column;align-items:center;gap:1.5rem;padding:4rem 3rem}.loading-card svg{font-size:3rem;animation:spin 1s linear infinite;color:var(--primary-text)}.loading-card p{font-size:1rem;font-weight:600;margin:0;color:var(--primary-text)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.skeleton{opacity:.7;animation:skeleton-loading}.skeleton-card{width:100%;border-radius:.375rem}@keyframes skeleton-loading{0%{background-color:#a3b8c2}to{background-color:#f0f3f5}}@media (40rem <= width < 56rem){.home-page,.header{padding-inline:2rem}.card-home{gap:2.5rem}.details-main{width:100%}.details-content{display:flex;gap:4rem}.details-content img{min-width:18rem}.detail-area h2{margin:0}.filter-tools-home{flex-wrap:nowrap;justify-content:space-between}.search-area{padding-left:1.75rem;width:28rem}}@media (56rem <= width < 62rem){.home-page,.header{padding-inline:3rem}.card-home{gap:2.5rem}.details-main{width:100%}.details-content{display:flex;gap:6rem}.details-content img{min-width:20rem}.detail-area h2{margin:0}.filter-tools-home{flex-wrap:nowrap;justify-content:space-between}.search-area{padding-left:1.75rem;width:30rem}}@media (62rem <= width < 75rem){.home-page{padding-inline:3rem}.header{padding-inline:4rem}.card-home{gap:3rem}.details-main{width:100%}.details-content{display:flex;gap:6rem}.details-mid{flex-direction:row;gap:5rem;margin-bottom:2rem}.details-content img{width:30rem}.detail-area h2{margin:0}.detail-area+div{display:flex}.filter-tools-home{justify-content:space-between}.search-area{padding-left:1.75rem;width:30rem}}@media (width >= 75rem){.home-page,.header{padding-inline:5rem}.card-home{gap:3rem}.details-main{width:100%}.details-content{display:flex;gap:9rem}.details-mid{flex-direction:row;gap:7rem;margin-bottom:2rem}.details-content img{width:35rem}.detail-area h2{margin:0}.detail-area+div{display:flex}.filter-tools-home{justify-content:space-between}.search-area{padding-left:1.75rem;width:30rem}}
