.country-list,.phoneCode-list{position: relative;}
.phone-code{display: none;border-radius: 8px;overflow: hidden;padding: 12px;height: 306px;position: absolute;top: 62px;width: 204px;box-shadow: 0px 10px 14px #0000005E;background-color: var(--v-white);z-index: 999;}
.phone-code .phoneCode-results{height: 240px;overflow-y: scroll;padding-bottom: 20px;}
.phone-code .phoneCode-results::-webkit-scrollbar-thumb,
.country-code .results::-webkit-scrollbar-thumb{background-color: rgba(227, 87, 40, 1);width: 4px;}
.phone-code .phoneCode-results .phoneCode-results-option{ cursor: pointer;font-size: var(--fs-16);color: var(--v-black);min-height: 35px;display: flex;align-items: center; padding-inline-start:8px; text-align: start;}
.phone-code .phoneCode-results .phoneCode-results-option span:nth-of-type(1){ color: var(--v-black); margin-inline-end:10px;}
.phone-code .phoneCode-results .phoneCode-results-option span:nth-of-type(2){color:var(--v-grey);}
.phone-code .phoneCode-results .phoneCode-results-option:hover,
.country-code .results .results-option:hover,
.country-code .results .results-option.active,
.phone-code .phoneCode-results .phoneCode-results-option.active{background-color: var(--v-grey-light1);}
.phone-code #phoneCode-search,
.country-code #country-search{width: 100%;height: 44px;border: none;outline: none; border-radius: 4px;margin-bottom: 12px;background-color: var(--v-grey-light2); padding-top: 4px !important;  padding-inline-end:42px !important; padding-inline-start:12px !important; }
.phone-code #phoneCode-search:hover,
.country-code #country-search:hover{background-color: #ECECEC;}
.phone-code #phoneCode-search:focus,
.country-code #country-search:focus{border-radius: 4px 4px 0px 0px;}
.phone-code #phoneCode-search:focus ~ .phoneCode-search-bottom,
.country-code #country-search:focus ~ .country-search-bottom{width: calc(100% - 24px);}
.phone-code .phoneCode-search-bottom{display: block;width: 0;height: 1px;transition: all 0.4s;background-color: var(--v-orange);position: absolute;top: 56px; inset-inline-start:12px; } 

.country-code{display: none;border-radius: 8px;overflow: hidden;padding: 12px;height: 309px;position: absolute;top: 62px;width: 100%;box-shadow: 0px 10px 14px #0000005E;background-color: var(--v-white);z-index: 999;}
.country-code .country-search-bottom{display: block;width: 0;height: 1px;transition: all 0.4s;background-color: var(--v-orange);position: absolute;top: 56px;left: 12px;} 
.country-code .results{height: 229px;overflow-y: scroll;padding-bottom: 10px;}
.country-code .results .results-option{ cursor: pointer;font-size: var(--fs-16);color: var(--v-black);height: 35px;line-height: 35px;white-space: nowrap; padding-inline-start:8px; text-align: start;}
.country-code .search-icon,
.phone-code .search-icon { position: absolute; top: 16px; inset-inline-end:24px; display: flex; justify-content: space-around; align-items: center; width: 36px; height: 36px; }

.country-code .search-icon img,
.phone-code .search-icon img { z-index: 9; position: relative; transform: translate(-1px, -1px); }
.country-code .search-icon::after,
.phone-code .search-icon::after { z-index: 1; content: ''; display: block; position: absolute; width: 0px; height: 0px; background: var(--v-grey-light4); border-radius: 50%; top: 50%; left: 50%; transform: translate(-50%,-50%); opacity: 0; transition: all 0.3s; }
.country-code .search-icon:hover:after,
.phone-code .search-icon:hover:after { width: 36px; height: 36px; opacity: 1; }

.country-code .no-data,
.phone-code .phoneCode-no-data{width: 100%; text-align: center;display: none; position: absolute; top: 70px; left: 50%; transform: translateX(-50%); color: var(--v-grey-dark); }


.popup-wrapper { position: fixed; width: 100%; height: 100vh; background-color: rgba(0, 0, 0, .8); top: 0; left: 0; z-index: 9999; display: none; }
.popup-wrapper .inner { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; }
.popup-wrapper .popup { position: relative; background: var(--v-white); width: 80%; max-width: 500px; display: flex; align-items: center; flex-direction: column; padding: 40px 20px; border-radius: 8px; }
.popup-wrapper .popup p.text-box { font-size: var(--fs-24); color: var(--v-black); text-align: center; margin-bottom: 0; }
.popup-wrapper .popup img.btn-close { position: absolute; width: 40px; height: 40px; right: 10px; top: 5px; cursor: pointer; }

/* ! vantagemarekts|2026-04-13 10:40:00 ! */