/* ============================================
   Register Page Styles
   Extracted from style.css
   ============================================ */

.register-page {
    margin-top: 3em
}

.register-page #register-page-user-email .icon {
    vertical-align: text-bottom
}

.register-page .card UL {
    margin-top: 2em;
    margin-bottom: 3em
}

.register-page h3 {
    font-size: 36px !important;
    font-weight: 600 !important;
    margin: 50px 0 50px 0 !important
}

.register-page h4 {
    margin: 0 !important
}

.register-page ul li {
    list-style-type: none;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    align-content: flex-start;
    flex-flow: row wrap;
    margin-left: -10px;
    margin-right: -10px
}

.register-page ul {
    margin: 0 10px;
    padding: 0
}

.register-page .form-field-v30 {
    margin-bottom: 30px
}

.register-page input,
.register-page select,
.register-page textarea {
    width: 100% !important;
    max-width: 100% !important;
    border: 1px solid #aaa;
    background-color: #fff;
    box-shadow: inset 0 2px 2px #fafafa, 0 0 0 #62aef7
}

.register-page .form-help-text {
    color: #666;
    margin: 5px 0 0;
    font-size: 14px
}

.register-page label {
    font-weight: 700
}

.register-page .custom-dropdown-container {
    width: 100%
}

.register-page .custom-option-header-value {
    min-width: 43px;
    width: 100%;
    margin-right: -20px !important
}

.register-page .custom-option {
    list-style-type: decimal;
    padding-left: 10px;
    width: 94%;
    margin-left: 10px;
    padding-right: 10px
}

.register-page .custom-option LI,
.register-page #user_group_city {
    cursor: pointer
}

/* ----------------------------------------
   Register Page V2
   ---------------------------------------- */

.register-page-v2 {
    background: #f7f7f7
}

.register-page-v2 .register-page {
    max-width: 560px;
    margin: 0 auto;
    padding: 89px 20px 48px;
    margin-top: 0
}

.register-page-v2 .login-register-block {
    max-width: 100%;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e8e8e8;
    padding: 28px;
    margin-bottom: 16px
}

.register-page-v2 .login-register-block .block-content {
    padding: 0
}

.register-page-v2 .login-register-block .form-field {
    margin-bottom: 16px
}

.register-page-v2 #register-page-user-email {
    font-size: 14px;
    font-weight: 500;
    color: #555;
    margin: 0 0 20px;
    padding: 8px 14px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: #f5f5f5;
    border-radius: 20px;
    border: 1px solid #e8e8e8
}

.register-page-v2 #register-page-user-email .icon {
    font-size: 15px;
    color: #999;
    line-height: 1;
    position: relative;
    top: -1px
}

.register-page-v2 .login-register-block input[type="email"],
.register-page-v2 .login-register-block input[type="password"] {
    height: 46px !important;
    border-radius: 8px;
    border: 1px solid #ddd;
    font-size: 15px;
    padding: 0 14px 0 42px !important;
    box-shadow: none;
    transition: border-color .2s, box-shadow .2s;
    background-color: #fff
}

.register-page-v2 .login-register-block input[type="email"]:focus,
.register-page-v2 .login-register-block input[type="password"]:focus {
    border-color: #82d305;
    box-shadow: 0 0 0 3px rgba(0, 132, 137, 0.1);
    outline: none
}

.register-page-v2 .login-register-block .input-overlay-symbol-text_left {
    top: 14px;
    left: 12px;
    color: #999
}

.register-page-v2 .register-card {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e8e8e8;
    padding: 32px;
    border-top: none;
    margin-bottom: 24px
}

.register-page-v2 .register-card h4 {
    font-size: 18px;
    font-weight: 700;
    color: #1a1a1a;
    margin: 0 0 20px !important
}

.register-page-v2 .register-card .full-width h4 {
    margin-top: 28px !important
}

.register-page-v2 .register-card .full-width {
    margin-bottom: 0
}

.register-page-v2 .register-page ul li {
    flex-direction: column;
    margin-left: 0;
    margin-right: 0;
    gap: 6px
}

.register-page-v2 .register-page .row-1-4,
.register-page-v2 .register-page .row-1-3,
.register-page-v2 .register-page .row-1-2 {
    width: 100%;
    padding: 0
}

.register-page-v2 .register-page .row-1-10 {
    width: 100%;
    padding: 0
}

.register-page-v2 .register-page label {
    font-size: 14px;
    color: #333;
    font-weight: 600;
    margin-bottom: 0;
    display: block
}

.register-page-v2 .register-page .register-card input,
.register-page-v2 .register-page .register-card select,
.register-page-v2 .register-page .register-card textarea {
    height: 46px;
    border-radius: 8px;
    border: 1px solid #ddd;
    font-size: 15px;
    padding: 0 14px;
    box-shadow: none;
    transition: border-color .2s, box-shadow .2s;
    background-color: #fff
}

.register-page-v2 .register-page .register-card input:focus,
.register-page-v2 .register-page .register-card select:focus {
    border-color: #82d305;
    box-shadow: 0 0 0 3px rgba(0, 132, 137, 0.1);
    outline: none
}

.register-page-v2 .register-page .form-field-v30 {
    margin-bottom: 24px
}

.register-page-v2 .register-field-row {
    display: flex;
    gap: 10px;
    width: 100%
}

.register-page-v2 .register-field-col {
    min-width: 0
}

.register-page-v2 .register-field-col input {
    width: 100%
}

.register-page-v2 .register-page .form-help-text {
    font-size: 13px;
    color: #999;
    margin-top: 6px
}

.register-page-v2 .register-page #enter-group-data {
    display: block;
    width: 100%;
    text-align: center;
    background: #82d305;
    color: #000;
    height: 48px;
    line-height: 48px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: background .2s, opacity .2s;
    padding: 0
}

.register-page-v2 .register-page #enter-group-data:hover {
    background: #74bc04
}

.register-page-v2 .register-page #enter-group-data.disabled {
    opacity: .4;
    cursor: not-allowed
}

.register-page-v2 .register-card ul {
    margin: 0 !important;
    padding: 0 !important
}

.register-page-v2 #register-page-checkbox-display-professional-data {
    margin-top: 12px;
    margin-bottom: 0
}

.register-page-v2 #register-page-checkbox-display-professional-data label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
    cursor: pointer
}

.register-page-v2 .page-content>form>ul {
    padding: 0 !important;
    margin: 0 !important;
    list-style: none
}

.register-page-v2 .page-content>form>ul>li {
    list-style: none;
    margin: 0;
    padding: 0
}

.register-page-v2 .page-content>form>ul>li>.row-1-2 {
    width: 100%;
    padding: 0
}

.register-page-v2 .intl-tel-input {
    width: 100%
}

.register-page-v2 .register-page .custom-phone-input {
    padding-left: 90px !important
}

.register-page-v2 .register-page input[type="file"] {
    height: auto;
    padding: 12px 16px;
    border: 1.5px dashed #ccc;
    border-radius: 10px;
    background: #fafafa;
    cursor: pointer;
    font-size: 14px;
    transition: border-color .15s, background .15s
}

.register-page-v2 .register-page input[type="file"]:hover {
    border-color: #82d305;
    background: #f0fafa
}

.register-page-v2 .register-page .agency-search-label {
    margin-bottom: 12px
}

.register-page-v2 .register-claim-banner {
    position: relative;
    padding-right: 48px
}

/* ----------------------------------------
   Shared input styles (register-page)
   ---------------------------------------- */

.register-page input[type="text"],
.register-page input[type="email"],
.register-page input[type="password"],
.register-page input[type="number"],
.register-page select {
    height: 48px !important;
    padding: 12px 14px !important;
    border: 1px solid #b0b0b0 !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    background: #fff;
    box-sizing: border-box
}

.register-page textarea {
    padding: 12px 14px !important;
    border: 1px solid #b0b0b0 !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    background: #fff;
    box-sizing: border-box;
    resize: vertical;
    line-height: 1.5
}

.register-page input:focus,
.register-page select:focus,
.register-page textarea:focus {
    border-color: #222 !important;
    outline: none;
    box-shadow: 0 0 0 1px #222
}

.register-page .btn-normal,
.register-page .btn-red {
    height: 48px;
    border-radius: 8px !important;
    font-size: 16px !important;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center
}

.register-page .input-overlay-symbol-text_left~input {
    padding-left: 42px !important
}

.register-page .input-overlay-symbol-text_left {
    top: 14px !important
}

/* ----------------------------------------
   Media Queries
   ---------------------------------------- */

@media (max-width:600px) {
    .register-page-v2 .register-page {
        padding: 69px 16px 32px
    }

    .register-page-v2 .register-card {
        padding: 20px
    }

    .register-page-v2 .login-register-block {
        padding: 20px
    }
}

/* Extracted from style.css */
.register-hero {
    text-align: center;
    margin-bottom: 20px
}

.register-hero h1 {
    font-size: 28px;
    font-weight: 700;
    color: #1a1a1a;
    margin: 0 0 8px;
    letter-spacing: -0.3px
}

.register-hero p {
    font-size: 15px;
    color: #777;
    margin: 0
}

.register-claim-banner {
    background: #f0fafa;
    border: 1.5px solid #b8dfe0;
    border-radius: 12px;
    padding: 28px 32px;
    margin-bottom: 28px;
    text-align: center
}

.register-claim-banner strong {
    display: block;
    font-size: 18px;
    color: #1a1a1a;
    margin-bottom: 10px;
    line-height: 1.35
}

.register-claim-banner span {
    display: block;
    font-size: 14px;
    color: #666;
    line-height: 1.5
}

.claim-summary-card {
    background: #fafafa;
    border: 1px solid #f0f0f0;
    border-radius: 12px;
    padding: 28px;
    margin-bottom: 28px
}

.claim-summary-card h4 {
    font-size: 16px;
    font-weight: 700;
    color: #1a1a1a;
    margin: 0 0 20px !important;
    padding-bottom: 14px;
    border-bottom: 1px solid #eee
}

.claim-summary-row {
    display: flex;
    gap: 16px;
    padding: 12px 0;
    border-bottom: 1px solid #f0f0f0;
    font-size: 14px;
    line-height: 1.5
}

.claim-summary-row:last-child {
    border-bottom: none
}

.claim-summary-label {
    color: #888;
    flex-shrink: 0;
    min-width: 110px
}

.claim-summary-value {
    color: #333;
    font-weight: 500;
    flex: 1;
    text-align: right;
    word-break: break-word
}

.register-type-toggle {
    display: flex;
    gap: 10px;
    margin-top: 8px;
    margin-bottom: 0
}

.register-type-option {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border: 2px solid #e8e8e8;
    border-radius: 10px;
    cursor: pointer;
    transition: all .15s ease;
    background: #fff
}

.register-type-option:hover {
    border-color: #ccc
}

.register-type-option.selected {
    border-color: #82d305;
    background: #f0fafa
}

.register-type-icon {
    flex-shrink: 0;
    color: #666;
    line-height: 1
}

.register-type-option.selected .register-type-icon {
    color: #82d305
}

.register-type-text strong {
    display: block;
    font-size: 15px;
    color: #1a1a1a
}

.register-type-text span {
    font-size: 13px;
    color: #999
}

.register-step-indicator {
    display: flex;
    justify-content: center;
    padding: 8px 0
}

.step-line {
    width: 2px;
    height: 24px;
    background: #ddd;
    border-radius: 1px
}

#register-type-business-type {
    margin-top: 16px
}

.register-step2-card {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e8e8e8;
    padding: 24px 28px;
    margin-bottom: 16px
}

.agency-search-wrapper {
    margin-top: 0
}

.agency-search-input-wrap {
    position: relative
}

.agency-search-input-wrap input {
    width: 100%;
    padding: 12px 14px 12px 40px;
    border: 2px solid #e8e8e8;
    border-radius: 10px;
    font-size: 15px;
    outline: none;
    transition: border-color .15s;
    box-sizing: border-box
}

.agency-search-input-wrap input:focus {
    border-color: #82d305
}

.agency-search-icon {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: #999;
    line-height: 1
}

#agency-search-clear {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #999;
    cursor: pointer;
    line-height: 1;
    padding: 4px;
    border-radius: 50%;
    transition: background .15s, color .15s
}

#agency-search-clear:hover {
    background: #f0f0f0;
    color: #333
}

#agency-search-results {
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    margin-top: 6px;
    max-height: 280px;
    overflow-y: auto;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08)
}

.agency-result-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    cursor: pointer;
    border-bottom: 1px solid #f0f0f0;
    transition: background .1s
}

.agency-result-item:last-child {
    border-bottom: none
}

.agency-result-item:hover {
    background: #f0fafa
}

.agency-result-item.claimed {
    opacity: .5;
    cursor: default
}

.agency-result-item.claimed:hover {
    background: transparent
}

.agency-result-name {
    font-weight: 500;
    color: #1a1a1a;
    font-size: 14px;
    flex: 1;
    min-width: 0
}

.agency-result-city {
    color: #999;
    font-size: 13px;
    white-space: nowrap;
    flex-shrink: 0
}

.agency-result-claimed {
    color: #cc0000;
    font-size: 12px;
    font-style: italic
}

#agency-search-not-found {
    margin-top: 12px;
    text-align: center
}

.agency-not-found-msg {
    background: #f9f9f9;
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    padding: 16px 20px;
    text-align: center
}

.agency-not-found-msg p {
    margin: 0 0 4px;
    font-size: 14px;
    color: #555
}

.agency-not-found-msg p:last-child {
    margin-bottom: 0
}

.agency-not-found-msg a {
    color: #82d305;
    font-weight: 600;
    text-decoration: none
}

.agency-not-found-msg a:hover {
    text-decoration: underline
}

.claim-remove-btn {
    position: absolute;
    right: 16px;
    top: 16px;
    font-size: 22px;
    color: #999;
    text-decoration: none;
    line-height: 1;
    cursor: pointer;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all .15s
}

.claim-remove-btn:hover {
    color: #333;
    background: rgba(0, 0, 0, 0.06)
}

#dynamic-claim-block {
    margin-top: 20px
}

.claim-document-section {
    margin-top: 8px
}

.claim-document-label {
    font-size: 14px;
    color: #333;
    font-weight: 600;
    display: block;
    margin-bottom: 12px
}

#register-step-back {
    margin-bottom: 12px;
    display: none;
    align-items: center;
    justify-content: space-between
}

#register-step-back:not(.display-none) {
    display: flex
}

#register-back-btn {
    color: #555;
    font-size: 14px;
    text-decoration: none;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 4px
}

#register-back-btn:hover {
    color: #222
}

#register-step-type-label {
    font-size: 13px;
    color: #888;
    font-weight: 500
}

#icon-no-profile-image {
    display: inline-flex;
    align-items: center;
    line-height: 1
}


#phone-input-wrapper input::placeholder,
.custom-phone-input::placeholder {
    color: #ccc !important
}

#phone-input-wrapper input::-webkit-input-placeholder,
.custom-phone-input::-webkit-input-placeholder {
    color: #ccc !important
}

#phone-input-wrapper input::-moz-placeholder,
.custom-phone-input::-moz-placeholder {
    color: #ccc !important
}



@media (max-width:600px) {
    .register-hero h1 {
            font-size: 24px
        }
    .register-step2-card {
            padding: 20px
        }
    .register-type-toggle {
            flex-direction: column;
            gap: 8px
        }
    .register-type-option {
            padding: 12px 14px
        }
    #agency-search-results {
            max-height: 220px
        }
    .agency-result-item {
            padding: 10px 14px
        }
}