.Toastify{
    padding: 0px;
}

/* Country/phone-code dropdown list — stronger separation from the page
   behind it, plus a slim custom scrollbar instead of the native OS one. */
.country-dropdown-list {
    background-color: #fff !important;
    /* !important: nice-select.css's ".nice-select.open .list" rule is more
       specific than this single-class selector and would otherwise win,
       forcing border:0 and a near-invisible shadow. */
    border: 1px solid rgba(68, 68, 68, 0.25) !important;
    box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.18), 0px 2px 6px rgba(0, 0, 0, 0.08) !important;
    border-radius: 10px !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(45, 51, 225, 0.35) transparent;
}

.country-dropdown-list::-webkit-scrollbar {
    width: 6px;
}

.country-dropdown-list::-webkit-scrollbar-track {
    background: transparent;
}

.country-dropdown-list::-webkit-scrollbar-thumb {
    background-color: rgba(45, 51, 225, 0.35);
    border-radius: 6px;
}

.country-dropdown-list::-webkit-scrollbar-thumb:hover {
    background-color: rgba(45, 51, 225, 0.55);
}

/* Darker than the default nice-select hover (#f6f6f6), for clearer feedback. */
.country-dropdown-list .option:hover,
.country-dropdown-list .option.keyboard-active {
    background-color: #e4e4e4;
    color: rgba(45, 51, 225, 1);
}

/* The currently-selected country gets its own distinct tint so it doesn't
   look like a plain hover — darker still when also hovered/keyboard-active. */
.country-dropdown-list .option.selected,
.country-dropdown-list .option.selected.focus {
    background-color: rgba(45, 51, 225, 0.12);
    color: rgba(45, 51, 225, 1);
}

.country-dropdown-list .option.selected:hover,
.country-dropdown-list .option.selected.keyboard-active {
    background-color: rgba(45, 51, 225, 0.22);
}