.main-content-signup {min-height: 100vh;width: 100%;background: var(--card);border: 1px solid var(--border);padding: 2rem;display: flex;/*justify-content: center;*/align-items: center;flex-direction: column;}

/* --- COUNTRY SELECT --- */
.country-selected {flex: 1;display: flex;align-items: center;gap: 10px;padding: 22px 14px 0px 14px;color: var(--text);font-size: 16px;cursor: pointer;}
.country-selected span {color: var(--text3);}
.country-selected.active span {color: var(--text);}
.country-selected img {width: 20px;height: 14px;border-radius: 3px;}
.country-dropdown {position: absolute;top: calc(100% + 6px);left: 0;width: 100%;background: var(--card);border: 1px solid var(--border);border-radius: 10px;display: none;z-index: 100;}
.country-dropdown.open {display: block;}
.country-search-container {position: relative;}
.country-search-container i {position: absolute;left: 10px;top: 50%;transform: translateY(-50%);color: var(--text3);}
.country-search {width: 100%;padding: 10px 12px 10px 35px;border: none;border-bottom: 1px solid var(--border);border-top-left-radius: 10px;border-top-right-radius: 10px;background: var(--bg3);color: var(--text);outline: none;}
.country-list {max-height: 180px;overflow-y: auto;}
.country-item {display: flex;align-items: center;gap: 10px;padding: 10px 15px;cursor: pointer;color: var(--text2);transition: background 0.2s, color 0.2s;}
.country-item img {width: 18px;height: 12px;border-radius: 2px;}
.country-item:hover {background: var(--bg3);color: var(--text);}
.country-item.selected {background: rgba(202, 162, 75, 0.2);border: 1px solid var(--border2);color: var(--text);}
.country-select.open .custom-input-wrapper {border-color: var(--border2);}
.country-select.active .custom-input-label, .country-select.open .custom-input-label {top: 8px;font-size: 12px;color: var(--text2);transform: none;}
.country-list::-webkit-scrollbar {width: 8px;}
.country-list::-webkit-scrollbar-thumb {background: var(--bg3);border-radius: 4px;}

/* --- GENDER SELECT --- */
.gender-selected {flex: 1;display: flex;align-items: center;gap: 8px;padding: 22px 14px 0 14px;font-size: 16px;cursor: pointer;color: #eee;}
.gender-selected span {color: #777;}
.gender-selected.active span {color: #eee;}
.gender-selected i.gender-icon {font-size: 18px;}
.gender-dropdown { position: absolute; top: calc(100% + 6px); left: 0; width: 100%; background: #1f2024; border: 1px solid #444; border-radius: 10px; display: none; z-index: 100;}
.gender-dropdown.open { display: block; }
.gender-list { display: flex; flex-direction: column; }
.gender-item { padding: 10px 15px; cursor: pointer; display: flex; align-items: center; gap: 10px; color: #d7d7db; }
.gender-item i { font-size: 16px; }
.gender-item:hover { background: #2a2b30; }
.gender-select.active .custom-input-label, .gender-select.open .custom-input-label {top: 8px;font-size: 12px;color: #bbb;transform: none;}
.gender-text-blue { color: #3498db; }
.gender-text-pink { color: #e91e63; }
.gender-text-purple { color: #9b59b6; }

/* --- TERMS CHECKBOX --- */
.checkbox-group {display: flex;align-items: center;margin-top: 15px;}
.checkbox-group input[type="checkbox"] {display: none;}
.checkbox-card {display: flex;align-items: center;gap: 10px;cursor: pointer;user-select: none;}
.checkbox-card .check-bg {width: 24px;height: 24px;background-color: var(--bg3);border: 2px solid var(--border);border-radius: 6px;display: flex;justify-content: center;align-items: center;transition: all 0.2s ease;}
.checkbox-card .checkmark {width: 16px;height: 16px;stroke-dasharray: 22;stroke-dashoffset: 22;transition: stroke-dashoffset 0.3s ease;}
.checkbox-group input[type="checkbox"]:checked + .checkbox-card .check-bg {background-color: var(--gold);border-color: var(--gold);}
.checkbox-group input[type="checkbox"]:checked + .checkbox-card .checkmark {stroke-dashoffset: 0;}
.checkbox-card .checkmark path {stroke-dasharray: 22;stroke-dashoffset: 22;stroke: var(--bg4);fill: none;stroke-linecap: round;stroke-linejoin: round;transition: stroke-dashoffset 0.3s ease;opacity: 0;}
.checkbox-group input[type="checkbox"]:checked + .checkbox-card .checkmark path {stroke-dashoffset: 0;opacity: 1;}
.checkbox-terms-text {font-size: 14px;color: var(--text);}
.checkbox-terms-text a {color: var(--gold);text-decoration: none;transition: 0.2s;}
.checkbox-terms-text a:hover {color: var(--gold-bright);text-decoration: underline;}