/* Base */
#slider-country-panel-aside.open { display: block; width: 400px; }
body.aside-country-panel-open > form > main:after { content: ''; position: fixed; display: block; inset: 0; background: #0000004d; z-index: 999; overflow: hidden; }

/* Header */
.supersprint-aside-country-panel-container { color: #FFF; }
.supersprint-aside-country-panel-container.mobile { position: absolute; top: 0; left: 0; padding: 25px 30px; width: 100%; height: 100%; background: var(--primary-color); overflow: auto; transition: .25s; transform: translateX(100%); }
.supersprint-aside-country-panel-container.mobile.open { transform: translateX(0); }
.supersprint-aside-country-panel-header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; }
.supersprint-aside-country-panel-title { font-size: 20px; text-transform: uppercase; }
.supersprint-aside-country-panel-close { display: block; background: none; border: none; cursor: pointer; }
.supersprint-aside-country-panel-close-icon { display: block; fill: #FFF; width: 30px; height: 30px; transition: .2s ease-in-out; }
.supersprint-aside-country-panel-search { display: block; margin-top: 25px; padding: 15px 0; width: 100%; color: #FFF; font-size: 18px; background: transparent; border: none; border-bottom: 1px solid #454545; outline: none; }
.supersprint-aside-country-panel-search::-webkit-search-cancel-button { display: none; }

/* Content */
.supersprint-aside-country-panel-wrapper { margin: 25px 0; }
.supersprint-aside-country-panel-loader { display: block; margin: 50px auto 0; width: 75px; filter: invert(100%); }
.supersprint-aside-country-panel-group-container { margin-bottom: 25px; padding-bottom: 25px; border-bottom: 1px solid #454545; }
.supersprint-aside-country-panel-group-title { margin-bottom: 25px; display: block; color: var(--secondary-color); font-size: 22px; text-transform: uppercase; }
.supersprint-aside-country-panel-country { display: flex; margin-bottom: 25px; color: #FFF; align-items: center; transition: .3s ease-in-out; }
.supersprint-aside-country-panel-country-image { display: block; margin-right: 10px; width: 17px; height: unset; flex: 0 0 auto; }
.supersprint-aside-country-panel-country-title { font-size: 18px; letter-spacing: .75px; flex: 1 1 auto; }
.supersprint-aside-country-panel-country-languages { display: flex; margin-left: 15px; }
.supersprint-aside-country-panel-country-language { margin-left: 15px; padding-left: 15px; color: #FFF; font-size: 16px; font-weight: 500; text-transform: uppercase; border-left: 1px solid #ccc; }
.supersprint-aside-country-panel-country-language:first-child { margin-left: 0; padding-left: 0; border-left: 0; }
.supersprint-aside-country-panel-group-container.search-off,
.supersprint-aside-country-panel-country.search-off { display: none; }

@media (pointer:fine) {
    .supersprint-aside-country-panel-country:hover { text-shadow: 0 0 2px #FFF; }
    .supersprint-aside-country-panel-close-icon:hover { transform: rotate(180deg); }
}