@charset "UTF-8"; .bg_grid { position: absolute; width: 100%; height: 100%; z-index: 0; } body.aifo-bg-primary { position: relative; } .bg_top { position: absolute; inset: 0; width: 100%; height: 870px; z-index: -1; background: #000; } #affliate-register-question .has-error { border-left: 3px solid var(--aifo-orange); padding-left: 12px; } #affliate-register-question button:disabled { opacity: 0.4; cursor: not-allowed; } #affliate-register-question .modal-overlay { display: none; margin: auto; } #affliate-register-question .questionnaire-modal { border-radius: 20px; padding: 40px; max-width: 712px; width: 100%; max-height: unset; position: relative; margin: auto; } #affliate-register-question .main-container { position: relative; z-index: 2; width: 100%; min-height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 40px 16px; } #affliate-register-question .questionnaire-card { border-radius: 20px; max-width: 780px; width: 100%; max-height: calc(100% - 80px); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; overflow: hidden; background: rgba(20, 20, 20, 0.92); overflow: hidden; } #affliate-register-question .card-content { padding: 36px; } #affliate-register-question .back-button { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; text-decoration: none; margin-bottom: 32px; cursor: pointer; border: none; background: transparent; padding: 0; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } #affliate-register-question .back-icon { width: 22px; height: 22px; background: var(--aifo-orange); border-radius: 5px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; color: white; font-size: 14px; font-weight: bold; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } #affliate-register-question .back-button:hover .back-icon { -webkit-box-shadow: 0 0 12px rgba(249, 135, 21, 0.4); box-shadow: 0 0 12px rgba(249, 135, 21, 0.4); } #affliate-register-question .back-text { color: #F9F9F9; font-size: 16px; font-weight: 500; } #affliate-register-question .question-section { margin-bottom: 26px; } #affliate-register-question .question-title { color: #ffffff; font-size: 17px; font-weight: 600; line-height: 1.4; margin-bottom: 16px; } #affliate-register-question .options-container { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; } #affliate-register-question .custom-checkbox { position: relative; padding-left: 0; margin-bottom: 0; } #affliate-register-question .custom-checkbox label { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; cursor: pointer; color: #ffffff; font-size: 14px; font-weight: 300; line-height: 1.4; padding: 10px 4px; background: transparent; border: none; border-radius: 8px; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: manipulation; touch-action: manipulation; -webkit-tap-highlight-color: transparent; } #affliate-register-question .custom-checkbox label:hover { opacity: 0.8; } #affliate-register-question .custom-checkbox input[type=checkbox], #affliate-register-question .custom-checkbox input[type=radio] { position: absolute; opacity: 0; } #affliate-register-question .checkbox-custom { min-width: 18px; width: 18px; height: 18px; background: #2a2a2a; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 4px; margin-right: 10px; margin-top: 1px; position: relative; -webkit-transition: unset; transition: unset; -ms-flex-negative: 0; flex-shrink: 0; } #affliate-register-question .checkbox-custom::after { content: "✓"; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%) scale(0); transform: translate(-50%, -50%) scale(0); color: white; font-size: 12px; font-weight: bold; } #affliate-register-question .custom-checkbox input[type=checkbox]:checked + label .checkbox-custom, #affliate-register-question .custom-checkbox input[type=radio]:checked + label .checkbox-custom, #affliate-register-question .custom-checkbox label.is-checked .checkbox-custom { background: #F98715; border-color: #F98715; } #affliate-register-question .custom-checkbox input[type=checkbox]:checked + label .checkbox-custom::after, #affliate-register-question .custom-checkbox input[type=radio]:checked + label .checkbox-custom::after, #affliate-register-question .custom-checkbox label.is-checked .checkbox-custom::after { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } #affliate-register-question .error-message { color: var(--aifo-orange); font-size: 13px; margin-top: 8px; display: none; } #affliate-register-question .cta-section { padding: 24px 36px; background: rgba(20, 20, 20, 0.95); border-top: 1px solid rgba(255, 255, 255, 0.08); } #affliate-register-question .cta-button { width: 100%; height: 54px; background: #F98715; color: #ffffff; font-size: 19px; font-weight: 600; border: none; border-radius: 11px; cursor: pointer; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; -webkit-box-shadow: 0 4px 14px rgba(249, 135, 21, 0.15); box-shadow: 0 4px 14px rgba(249, 135, 21, 0.15); } #affliate-register-question .cta-button:hover:not(:disabled) { background: #ff9a2e; -webkit-box-shadow: 0 10px 24px rgba(249, 135, 21, 0.35); box-shadow: 0 10px 24px rgba(249, 135, 21, 0.35); -webkit-transform: translateY(-1px); transform: translateY(-1px); } #affliate-register-question .cta-button:disabled { opacity: 0.5; cursor: not-allowed; } #affliate-register-question .questionnaire-modal { padding: 0px; } #affliate-register-question .page-wrapper { position: relative; z-index: 2; min-height: 100%; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 40px 20px; overflow-y: auto; } #affliate-register-question .form-card { background: -webkit-gradient(linear, left top, left bottom, from(#141414), to(#0F0F10)); background: linear-gradient(180deg, #141414 0%, #0F0F10 100%); border-radius: 24px; border: 1px solid rgba(255, 255, 255, 0.1); -webkit-box-shadow: 0 20px 60px rgba(0, 0, 0, 0.45); box-shadow: 0 20px 60px rgba(0, 0, 0, 0.45); max-width: 820px; width: 92%; padding: 32px 40px; margin: auto; } @media (max-width: 767px) { #affliate-register-question .form-card { padding: 20px 18px; } } #affliate-register-question .form-card::-webkit-scrollbar { width: 8px; } #affliate-register-question .form-card::-webkit-scrollbar-track { background: rgba(255, 255, 255, 0.05); border-radius: 4px; } #affliate-register-question .form-card::-webkit-scrollbar-thumb { background: rgba(249, 135, 21, 0.5); border-radius: 4px; } #affliate-register-question .form-card::-webkit-scrollbar-thumb:hover { background: rgba(249, 135, 21, 0.7); } #affliate-register-question .back-button { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; cursor: pointer; margin-bottom: 28px; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } #affliate-register-question .back-icon { width: 28px; height: 28px; background: var(--aifo-orange); border-radius: 6px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } #affliate-register-question .back-button:hover .back-icon { background: var(--aifo-orange-hover); -webkit-box-shadow: 0 4px 12px rgba(249, 135, 21, 0.3); box-shadow: 0 4px 12px rgba(249, 135, 21, 0.3); } #affliate-register-question .back-text { color: #F9F9F9; font-size: 15px; font-weight: 500; } #affliate-register-question .question-block { margin-bottom: 28px; } #affliate-register-question .question-title { font-size: 16px; font-weight: 600; color: #F1F1F1; margin-bottom: 14px; line-height: 1.4; } #affliate-register-question .checkbox-option { position: relative; margin-bottom: 12px; } #affliate-register-question .checkbox-option label { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; cursor: pointer; padding: 0; background: transparent; border: none; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } #affliate-register-question .checkbox-option label:hover .checkbox-custom { border-color: rgba(249, 135, 21, 0.6); } #affliate-register-question .checkbox-option input[type=checkbox] { position: absolute; opacity: 0; cursor: pointer; } #affliate-register-question .checkbox-label { color: rgba(255, 255, 255, 0.78); font-size: 15px; font-weight: 400; } #affliate-register-question .form-input { background: #101010; border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 6px; padding: 14px 16px; color: #F9F9F9; font-size: 15px; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; height: 24px; } #affliate-register-question .form-input:focus { outline: none; border-color: #F98715; -webkit-box-shadow: 0 0 0 3px rgba(249, 135, 21, 0.15); box-shadow: 0 0 0 3px rgba(249, 135, 21, 0.15); } #affliate-register-question .form-input::-webkit-input-placeholder { color: rgba(255, 255, 255, 0.38); } #affliate-register-question .form-input::-moz-placeholder { color: rgba(255, 255, 255, 0.38); } #affliate-register-question .form-input:-ms-input-placeholder { color: rgba(255, 255, 255, 0.38); } #affliate-register-question .form-input::-ms-input-placeholder { color: rgba(255, 255, 255, 0.38); } #affliate-register-question .form-input::placeholder { color: rgba(255, 255, 255, 0.38); } #affliate-register-question .platform-input-wrapper { position: relative; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } #affliate-register-question .platform-input-wrapper input { padding-left: 44px; } #affliate-register-question .input-icon { position: absolute; left: 14px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); pointer-events: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } #affliate-register-question .input-icon svg { display: block; } #affliate-register-question .platform-selector { position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 180px; flex: 0 0 180px; } #affliate-register-question .platform-select { width: 100%; background: #101010; border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 12px; padding: 14px 40px 14px 16px; color: #F9F9F9; font-size: 15px; line-height: 1.4; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; cursor: pointer; appearance: none; -webkit-appearance: none; -moz-appearance: none; } #affliate-register-question .platform-select:focus { outline: none; border-color: #F98715; -webkit-box-shadow: 0 0 0 3px rgba(249, 135, 21, 0.15); box-shadow: 0 0 0 3px rgba(249, 135, 21, 0.15); } #affliate-register-question .platform-selector::after { content: ""; position: absolute; right: 16px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid rgba(255, 255, 255, 0.6); pointer-events: none; } @media (max-width: 991px) { #affliate-register-question .platform-selector { -webkit-box-flex: 0; -ms-flex: 0 0 160px; flex: 0 0 160px; } } @media (max-width: 767px) { #affliate-register-question .platform-selector { width: 100%; } } #affliate-register-question .links-title { font-size: 16px; font-weight: 600; color: #F1F1F1; } #affliate-register-question .add-platform-link { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 6px; color: #F98715; font-size: 14px; font-weight: 500; cursor: pointer; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } #affliate-register-question .add-platform-link:hover { color: #FF9830; text-decoration: underline; } #affliate-register-question .links-row { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 12px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #affliate-register-question .links-row-buttons { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 12px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (max-width: 991px) and (min-width: 768px) { #affliate-register-question .links-row { gap: 10px; } #affliate-register-question .btn-attach { padding: 14px 16px; font-size: 13px; } } @media (max-width: 767px) { #affliate-register-question .form-card { max-height: 86vh; overflow-y: auto; } #affliate-register-question .links-row { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 12px; } #affliate-register-question .platform-input-wrapper { width: 100%; } #affliate-register-question .btn-attach { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } #affliate-register-question .btn-delete { -ms-flex-negative: 0; flex-shrink: 0; width: 48px; } #affliate-register-question .question-title { font-size: 16px; } #affliate-register-question .checkbox-label { font-size: 14px; } } #affliate-register-question .btn-attach { background: #F98715; border: none; border-radius: 12px; color: white; font-size: 14px; font-weight: 600; padding: 14px 20px; line-height: 1.4; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; cursor: pointer; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; white-space: nowrap; } #affliate-register-question .btn-attach:hover { background: #FF9830; -webkit-box-shadow: 0 4px 12px rgba(249, 135, 21, 0.3); box-shadow: 0 4px 12px rgba(249, 135, 21, 0.3); } #affliate-register-question .btn-delete { width: 48px; background: transparent; border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 12px; padding: 14px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; cursor: pointer; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; -ms-flex-negative: 0; flex-shrink: 0; } #affliate-register-question .btn-delete:hover { border-color: #F98715; background: rgba(249, 135, 21, 0.1); } #affliate-register-question .btn-submit { width: 100%; height: 60px; background: #F98715; border: none; border-radius: 14px; color: white; font-size: 20px; font-weight: 700; cursor: pointer; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; margin-top: 36px; text-transform: none; } #affliate-register-question .btn-submit:hover { background: #FF9830; -webkit-box-shadow: 0 6px 20px rgba(249, 135, 21, 0.4); box-shadow: 0 6px 20px rgba(249, 135, 21, 0.4); -webkit-transform: translateY(-2px); transform: translateY(-2px); } #affliate-register-question .btn-submit:active { -webkit-transform: translateY(0); transform: translateY(0); } #affliate-register-question .mixed-input-row { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 130px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #affliate-register-question .mixed-input-row .checkbox-option { -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; margin-bottom: 0; } #affliate-register-question .mixed-input-row .form-input { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } @media (max-width: 767px) { #affliate-register-question .mixed-input-row { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 12px; } #affliate-register-question .mixed-input-row .checkbox-option, #affliate-register-question .mixed-input-row .form-input { width: 100%; } } #affliate-register-question .file-name { font-size: 13px; color: rgba(255, 255, 255, 0.6); margin-top: 8px; display: none; } #affliate-register-question .file-name.show { display: block; } #affliate-register-question .platform-box { max-width: 760px; } #affliate-register-question .platform-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; margin-bottom: 12px; } #affliate-register-question .platform-input-wrap { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; position: relative; } #affliate-register-question .platform-input { height: 48px; padding-left: 48px; background: #0d0d0d; border: 1px solid #2a2a2a; color: #fff; border-radius: 10px; } #affliate-register-question .platform-input:focus { border-color: #ff8a00; -webkit-box-shadow: none; box-shadow: none; } #affliate-register-question .platform-icon { position: absolute; left: 14px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); color: #aaa; font-size: 18px; cursor: pointer; } #affliate-register-question .platform-icon:hover { color: #ff8a00; } #affliate-register-question .platform-dropdown { position: absolute; top: 52px; left: 0; right: 0; background: #121212; border: 1px solid #2a2a2a; border-radius: 10px; z-index: 100; display: none; } #affliate-register-question .platform-search { padding: 8px; border-bottom: 1px solid #2a2a2a; } #affliate-register-question .platform-search-input { width: 100%; height: 34px; background: #0d0d0d; border: 1px solid #2a2a2a; color: #fff; border-radius: 6px; padding: 0 10px; } #affliate-register-question .platform-list { max-height: 180px; overflow: auto; } #affliate-register-question .platform-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; padding: 10px 14px; cursor: pointer; } #affliate-register-question .platform-item i { width: 20px; text-align: center; font-size: 16px; } #affliate-register-question .platform-item:hover { background: #1f1f1f; } #affliate-register-question .platform-item.disabled { opacity: 0.4; cursor: not-allowed; } #affliate-register-question .platform-empty { padding: 12px; text-align: center; color: #777; display: none; } #affliate-register-question .btn-attach { height: 40px; background: #ff8a00; border-radius: 8px; white-space: nowrap; } #affliate-register-question .btn-attach.attached { background: #2ecc71; } #affliate-register-question .file-input { display: none; } #affliate-register-question .upload-progress { width: 120px; height: 6px; background: #2a2a2a; border-radius: 4px; overflow: hidden; display: none; } #affliate-register-question .upload-bar { height: 100%; width: 0%; background: #ff8a00; } #affliate-register-question .btn-delete { background: none; border: none; color: #777; font-size: 18px; } #affliate-register-question .btn-delete:hover { color: #ff4d4f; } #affliate-register-question .add-platform { color: #ff8a00; cursor: pointer; } .login-page { padding: 0; height: auto; } #questionnaireModalStep1.modal-overlay { display: block; } .question-section.has-error { border-left: 3px solid var(--aifo-orange); } .error-focus { -webkit-animation: errorPulse 1.2s ease; animation: errorPulse 1.2s ease; } @-webkit-keyframes errorPulse { 0% { background: rgba(255, 77, 79, 0.15); } 100% { background: transparent; } } @keyframes errorPulse { 0% { background: rgba(255, 77, 79, 0.15); } 100% { background: transparent; } }