/* Hero/layout: critical CSS in — duplicate removed for CLS */ .home-light-page .floating-yt-btn { width: 52px !important; height: 52px !important; border-radius: 50% !important; } /* YouTube Shorts modal — home.css 16:9 kurallarını ezer */ .home-light-page .yt-modal-overlay { background: radial-gradient(ellipse at 50% 30%, rgba(15, 23, 42, 0.55) 0%, rgba(2, 6, 23, 0.88) 100%) !important; backdrop-filter: blur(16px) saturate(120%) !important; -webkit-backdrop-filter: blur(16px) saturate(120%) !important; z-index: 12000 !important; align-items: center !important; justify-content: center !important; padding: 1rem !important; } .home-light-page .yt-modal-overlay.active { opacity: 1 !important; visibility: visible !important; } .home-light-page .yt-modal-container { position: relative !important; width: auto !important; max-width: none !important; min-height: auto !important; aspect-ratio: auto !important; overflow: visible !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; background: transparent !important; animation: none !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; margin: 0 !important; padding: 0 !important; } .home-light-page .yt-modal-close { position: absolute !important; top: 10px !important; right: 10px !important; width: 40px !important; height: 40px !important; border-radius: 50% !important; border: 2px solid rgba(255, 255, 255, 0.5) !important; background: rgba(15, 23, 42, 0.9) !important; color: #fff !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; z-index: 12 !important; cursor: pointer !important; box-shadow: 0 10px 22px rgba(0, 0, 0, 0.35) !important; transition: background .2s ease, transform .2s ease, border-color .2s ease, box-shadow .2s ease !important; backdrop-filter: blur(12px) !important; -webkit-backdrop-filter: blur(12px) !important; font-size: 1rem !important; } .home-light-page .yt-modal-close:hover { background: rgba(225, 29, 72, 0.92) !important; border-color: rgba(254, 202, 202, 0.95) !important; transform: scale(1.08) !important; box-shadow: 0 12px 26px rgba(225, 29, 72, 0.35) !important; } .home-light-page .yt-modal-shell { display: flex !important; align-items: center !important; justify-content: center !important; gap: clamp(.65rem, 2vw, 1rem) !important; } .home-light-page .yt-modal-card { position: relative !important; width: min(calc((100dvh - 2rem) * 9 / 16), 92vw) !important; max-width: 400px !important; background: linear-gradient(165deg, #121a2e 0%, #0a0f1c 100%) !important; border: 1px solid rgba(148, 163, 184, 0.22) !important; border-radius: 20px !important; box-shadow: 0 24px 48px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.06) inset !important; overflow: hidden !important; max-height: calc(100dvh - 2rem) !important; } .home-light-page .yt-modal-header { width: 100% !important; max-width: none !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: .75rem !important; padding: .85rem 3.35rem .65rem 1rem !important; background: linear-gradient(180deg, rgba(79, 70, 229, 0.12) 0%, transparent 100%) !important; border-bottom: 1px solid rgba(148, 163, 184, 0.15) !important; box-sizing: border-box !important; } .home-light-page .yt-modal-header h4 { margin: 0 !important; font-size: .92rem !important; font-weight: 600 !important; color: #f1f5f9 !important; letter-spacing: .02em !important; } .home-light-page .yt-modal-header span { font-size: .78rem !important; font-weight: 600 !important; color: #cbd5e1 !important; background: rgba(15, 23, 42, 0.55) !important; border: 1px solid rgba(148, 163, 184, 0.25) !important; border-radius: 999px !important; padding: .28rem .6rem !important; white-space: nowrap !important; } .home-light-page .yt-gallery-wrap { position: relative !important; width: 100% !important; max-width: none !important; aspect-ratio: 9 / 16 !important; margin: 0 !important; border-radius: 0 0 16px 16px !important; overflow: hidden !important; background: #000 !important; box-shadow: none !important; border: none !important; } .home-light-page .yt-gallery-track { display: flex; width: 100%; height: 100%; transition: transform .35s ease; } .home-light-page .yt-gallery-slide { min-width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; } .home-light-page .yt-gallery-slide iframe { width: 100%; height: 100%; border: 0; background: #000; display: block; } .home-light-page .yt-player-slot { width: 100%; height: 100%; background: #000; } .home-light-page .yt-player-slot iframe { width: 100% !important; height: 100% !important; border: 0 !important; } .home-light-page .yt-gallery-nav { position: static !important; flex-shrink: 0 !important; transform: none !important; width: 44px !important; height: 44px !important; border-radius: 50% !important; border: 1px solid rgba(255, 255, 255, 0.22) !important; background: rgba(15, 23, 42, 0.72) !important; color: #fff !important; cursor: pointer !important; z-index: 2 !important; backdrop-filter: blur(8px) !important; -webkit-backdrop-filter: blur(8px) !important; transition: background .2s ease, border-color .2s ease, transform .2s ease !important; } .home-light-page .yt-gallery-nav:hover { background: rgba(79, 70, 229, 0.85) !important; border-color: rgba(165, 180, 252, 0.55) !important; transform: scale(1.06) !important; } .home-light-page .yt-gallery-dots { position: absolute !important; left: 0 !important; right: 0 !important; bottom: 12px !important; display: flex !important; justify-content: center !important; gap: 7px !important; z-index: 4 !important; padding: 6px 10px !important; background: linear-gradient(0deg, transparent, rgba(0, 0, 0, 0.75) 55%, transparent) !important; } .home-light-page .yt-gallery-dots .yt-dot { pointer-events: auto !important; } .home-light-page .yt-dot { width: 8px; height: 8px; border-radius: 50%; border: 0; background: rgba(255,255,255,.45); cursor: pointer; transition: transform .2s ease, background-color .2s ease; } .home-light-page .yt-dot.active { background: #ffffff; transform: scale(1.2); } /* ===== Modallar – Aydınlık Tema ===== */ .home-light-page .popup-overlay { background: rgba(15, 23, 42, 0.42) !important; backdrop-filter: blur(8px) !important; -webkit-backdrop-filter: blur(8px) !important; } .home-light-page .popup-overlay .popup-container { background: #ffffff !important; border: 1px solid rgba(148, 163, 184, 0.35) !important; border-radius: 20px !important; box-shadow: 0 28px 60px rgba(15, 23, 42, 0.18), 0 0 0 1px rgba(255,255,255,0.8) inset !important; animation: none !important; position: relative !important; top: auto !important; left: auto !important; transform: scale(0.96) translateY(16px) !important; } .home-light-page .popup-overlay.active .popup-container { transform: scale(1) translateY(0) !important; } .home-light-page .popup-overlay .popup-container::before { height: 3px !important; background: linear-gradient(90deg, #4f46e5, #7c3aed, #a78bfa) !important; } .home-light-page .popup-header { background: linear-gradient(180deg, #f8faff 0%, #ffffff 100%) !important; border-bottom: 1px solid #e2e8f0 !important; padding: 1.35rem 1.75rem 1.1rem !important; } .home-light-page .popup-title, .home-light-page .login-popup .popup-title, .home-light-page .forgot-password-popup .popup-header .popup-title, .home-light-page .register-popup .popup-title { color: #0f172a !important; background: none !important; -webkit-text-fill-color: #0f172a !important; text-fill-color: #0f172a !important; font-weight: 700 !important; } .home-light-page .popup-title i, .home-light-page .login-popup .popup-title i { color: #4f46e5 !important; -webkit-text-fill-color: #4f46e5 !important; filter: none !important; } .home-light-page .popup-subtitle, .home-light-page .register-popup .popup-subtitle { color: #64748b !important; } .home-light-page .popup-close { background: #f1f5f9 !important; border: 1px solid #e2e8f0 !important; color: #475569 !important; border-radius: 10px !important; } .home-light-page .popup-close:hover { background: #fee2e2 !important; border-color: #fecaca !important; color: #dc2626 !important; } .home-light-page .popup-content, .home-light-page .login-popup .popup-content, .home-light-page .login-popup .login-popup-body, .home-light-page .register-popup .popup-content, .home-light-page .forgot-password-popup .popup-content { background: #ffffff !important; color: #334155 !important; padding: 1.5rem 1.75rem 1.75rem !important; } .home-light-page .login-form .form-input, .home-light-page .forgot-password-popup .form-input, .home-light-page .register-popup .form-input, .home-light-page .popup-overlay .form-input { background: #f8fafc !important; border: 1.5px solid #cbd5e1 !important; color: #0f172a !important; } .home-light-page .login-form .form-input::placeholder, .home-light-page .forgot-password-popup .form-input::placeholder, .home-light-page .register-popup .form-input::placeholder { color: #94a3b8 !important; } .home-light-page .login-form .form-input:focus, .home-light-page .forgot-password-popup .form-input:focus, .home-light-page .register-popup .form-input:focus { border-color: #6366f1 !important; background: #ffffff !important; box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.12) !important; } .home-light-page .login-form .input-icon, .home-light-page .forgot-password-popup .input-icon { color: #6366f1 !important; } .home-light-page .login-form .remember-me, .home-light-page .login-form .remember-text { color: #475569 !important; } .home-light-page .login-form .forgot-password, .home-light-page .forgot-password-popup .back-to-login a, .home-light-page .popup-footer .auth-link, .home-light-page .popup-footer .auth-link a { color: #4f46e5 !important; } .home-light-page .popup-footer { border-top: 1px solid #e2e8f0 !important; background: #f8fafc !important; } .home-light-page .popup-footer .auth-link { color: #64748b !important; } .home-light-page .social-btn, .home-light-page .social-login-section .social-btn { background: #ffffff !important; border: 1px solid #e2e8f0 !important; color: #334155 !important; box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06) !important; } .home-light-page .social-btn:hover { background: #f8fafc !important; border-color: #c7d2fe !important; } .home-light-page .divider-line { background: #e2e8f0 !important; } .home-light-page .divider-text { color: #94a3b8 !important; } .home-light-page .login-error { background: #fef2f2 !important; border: 1px solid #fecaca !important; color: #b91c1c !important; } .home-light-page .login-success, .home-light-page .register-success, .home-light-page .forgot-success { background: #ecfdf5 !important; border: 1px solid #a7f3d0 !important; color: #047857 !important; } .home-light-page .register-error, .home-light-page .forgot-error { background: #fef2f2 !important; border: 1px solid #fecaca !important; color: #b91c1c !important; } .home-light-page .forgot-password-popup .forgot-description { color: #64748b !important; } .home-light-page #loginPopup.popup-overlay.active, .home-light-page #registerPopup.popup-overlay.active { display: flex !important; align-items: center !important; justify-content: center !important; padding: max(.75rem, env(safe-area-inset-top)) max(.75rem, env(safe-area-inset-right)) max(.75rem, env(safe-area-inset-bottom)) max(.75rem, env(safe-area-inset-left)) !important; } .home-light-page .popup-overlay .popup-container.login-popup { background: #ffffff !important; border: 1px solid rgba(148, 163, 184, 0.35) !important; width: min(94vw, 26rem) !important; max-width: min(94vw, 26rem) !important; max-height: min(88dvh, 720px) !important; height: auto !important; border-radius: 22px !important; box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.85) inset, 0 22px 45px rgba(15, 23, 42, 0.14), 0 8px 16px rgba(15, 23, 42, 0.06) !important; display: grid !important; grid-template-columns: 1fr !important; grid-template-rows: auto minmax(0, 1fr) auto !important; overflow: hidden !important; min-height: 0 !important; margin: 0 !important; position: relative !important; top: auto !important; left: auto !important; transform: none !important; } .home-light-page .popup-overlay.active .popup-container.login-popup { transform: none !important; } .home-light-page .login-popup .popup-content, .home-light-page .login-popup .login-popup-body { flex: 1 1 auto !important; min-height: 0 !important; overflow-x: hidden !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch !important; overscroll-behavior: contain !important; } .home-light-page .login-popup .popup-header, .home-light-page .login-popup .popup-footer, .home-light-page .login-popup .login-popup-footer { flex-shrink: 0 !important; } .home-light-page .login-popup .login-popup-footer { border-top: 1px solid #eef2f7 !important; background: #ffffff !important; padding: .65rem 1.35rem .75rem !important; text-align: center !important; } .home-light-page .popup-overlay .popup-container.register-popup { background: #ffffff !important; border: none !important; width: min(94vw, 26rem) !important; max-width: min(94vw, 26rem) !important; max-height: min(88dvh, 720px) !important; height: auto !important; border-radius: 22px !important; box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.85) inset, 0 22px 45px rgba(15, 23, 42, 0.14), 0 8px 16px rgba(15, 23, 42, 0.06) !important; display: grid !important; grid-template-columns: 1fr !important; grid-template-rows: auto minmax(0, 1fr) auto auto !important; padding: 0 !important; position: relative !important; top: auto !important; left: auto !important; transform: none !important; margin: 0 !important; } .home-light-page .popup-overlay.active .popup-container.register-popup { transform: none !important; } .home-light-page .popup-overlay .popup-container.register-popup::before { content: '' !important; display: block !important; height: 3px !important; background: linear-gradient(90deg, #4f46e5, #7c3aed, #a78bfa) !important; animation: none !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; z-index: 3 !important; border-radius: 18px 18px 0 0 !important; } .home-light-page .register-popup .popup-header { padding: .75rem 1.35rem .65rem !important; flex-shrink: 0 !important; border-bottom: 1px solid #eef2f7 !important; background: linear-gradient(180deg, #fafbff 0%, #ffffff 100%) !important; display: flex !important; align-items: flex-start !important; justify-content: space-between !important; gap: .75rem !important; } .home-light-page .register-popup .popup-header .header-content { flex: 1 1 auto !important; min-width: 0 !important; } .home-light-page .register-popup .popup-close { width: 34px !important; height: 34px !important; border-radius: 10px !important; border: 1px solid #e2e8f0 !important; background: #ffffff !important; color: #64748b !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; line-height: 1 !important; transition: background .15s ease, color .15s ease, border-color .15s ease !important; } /* FA subset gecikse bile kapat ikonu görünsün (Unicode ×) */ .home-light-page .register-popup .popup-close i { font-style: normal !important; font-size: 1.2rem !important; line-height: 1 !important; width: 1em !important; text-align: center !important; font-family: system-ui, -apple-system, "Segoe UI", sans-serif !important; font-weight: 500 !important; } .home-light-page .register-popup .popup-close i:before { content: "\00d7" !important; font-family: inherit !important; font-weight: inherit !important; font-style: normal !important; } .home-light-page .register-popup .popup-close:hover { background: #f1f5f9 !important; color: #334155 !important; border-color: #cbd5e1 !important; } .home-light-page .register-popup .register-popup-body { padding: .15rem 1.35rem .85rem !important; flex: 1 1 auto !important; min-height: 0 !important; max-height: none !important; overflow-x: hidden !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch !important; overscroll-behavior: contain !important; } .home-light-page .register-popup .register-popup-actions { flex-shrink: 0 !important; padding: 0 1.35rem .75rem !important; border-top: none !important; background: #ffffff !important; box-shadow: none !important; } .home-light-page .register-popup .reg-actions-panel { display: none !important; } .home-light-page .register-popup .reg-actions-panel.is-active { display: block !important; } .home-light-page .register-popup .register-popup-actions .step-actions { display: flex !important; justify-content: stretch !important; align-items: stretch !important; gap: .65rem !important; margin: 0 !important; padding: 0 !important; width: 100% !important; } .home-light-page .register-popup .reg-actions-panel[data-actions-step="1"] .step-actions { justify-content: center !important; align-items: center !important; flex-direction: row !important; gap: 0 !important; } .home-light-page .register-popup .reg-actions-panel[data-actions-step="1"] .btn-next { width: min(100%, 260px) !important; margin: 0 auto !important; } .home-light-page .register-popup .reg-actions-panel[data-actions-step="2"] .step-actions-row, .home-light-page .register-popup .reg-actions-panel[data-actions-step="3"] .step-actions-row { flex-direction: row !important; align-items: stretch !important; justify-content: space-between !important; gap: .65rem !important; } .home-light-page .register-popup .reg-actions-panel[data-actions-step="2"] .btn-prev, .home-light-page .register-popup .reg-actions-panel[data-actions-step="3"] .btn-prev { order: 0 !important; flex: 0 1 38% !important; width: auto !important; max-width: 11rem !important; } .home-light-page .register-popup .reg-actions-panel[data-actions-step="2"] .btn-next, .home-light-page .register-popup .reg-actions-panel[data-actions-step="3"] .btn-submit { order: 0 !important; flex: 1 1 auto !important; width: auto !important; max-width: none !important; } .home-light-page .register-popup .reg-step-skip-row { display: flex !important; justify-content: center !important; margin: 0 0 .4rem !important; padding: 0 !important; } .home-light-page .register-popup .reg-step-skip-row .btn-skip { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: .35rem !important; min-height: auto !important; padding: .25rem .5rem !important; border: none !important; background: transparent !important; color: #64748b !important; font-size: .78rem !important; font-weight: 600 !important; box-shadow: none !important; cursor: pointer !important; transition: color .15s ease !important; } .home-light-page .register-popup .reg-step-skip-row .btn-skip:hover { color: #4f46e5 !important; background: transparent !important; transform: none !important; } .home-light-page .register-popup .reg-oauth-step1 { margin-bottom: .85rem !important; padding-bottom: .75rem !important; border-bottom: 1px solid #f1f5f9 !important; } .home-light-page #registerPopup[data-reg-step="2"] .register-popup-body, .home-light-page #registerPopup[data-reg-step="3"] .register-popup-body { padding-top: .35rem !important; } .home-light-page #registerPopup[data-reg-step="2"] .register-popup-actions, .home-light-page #registerPopup[data-reg-step="3"] .register-popup-actions { border-top: 1px solid #eef2f7 !important; padding-top: .65rem !important; margin-top: 0 !important; background: #ffffff !important; } .home-light-page .register-popup .form-step[data-step="2"] .reg-step-intro { margin-bottom: .65rem !important; padding: .45rem .6rem !important; font-size: .74rem !important; } .home-light-page .register-popup .form-step[data-step="2"] .form-grid { margin-bottom: .65rem !important; gap: .65rem .85rem !important; } .home-light-page .register-popup .form-step[data-step="2"] .form-group.full-width { margin-bottom: 0 !important; } .home-light-page .register-popup .form-step[data-step="2"] .input-validation { display: none !important; } .home-light-page .register-popup .form-step[data-step="2"] .form-input, .home-light-page .register-popup .form-step[data-step="2"] select.form-input, .home-light-page .register-popup .form-step[data-step="2"] .form-input:valid, .home-light-page .register-popup .form-step[data-step="2"] .form-input:invalid { border-color: #dbe2ea !important; background: #ffffff !important; box-shadow: none !important; color: #0f172a !important; } .home-light-page .register-popup .form-step[data-step="2"] .form-input:focus, .home-light-page .register-popup .form-step[data-step="2"] select.form-input:focus { border-color: #818cf8 !important; box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12) !important; } .home-light-page .register-popup .form-step[data-step="2"] select.form-input { cursor: pointer !important; appearance: auto !important; } .home-light-page .register-popup .form-step[data-step="2"] .form-textarea { min-height: 68px !important; max-height: 120px !important; resize: vertical !important; } .home-light-page .register-popup .form-step[data-step="2"] .textarea-counter { font-size: .68rem !important; color: #94a3b8 !important; text-align: right !important; margin-top: .2rem !important; } .home-light-page .register-popup .reg-step3-content { gap: 0 !important; min-height: 0 !important; } .home-light-page .register-popup .form-step[data-step="3"] .reg-step-intro-terms { margin-bottom: .55rem !important; padding: .45rem .6rem !important; font-size: .74rem !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-section { margin: 0 !important; padding: 0 !important; border: none !important; display: flex !important; flex-direction: column !important; gap: 0 !important; min-height: 0 !important; } .home-light-page .register-popup .reg-terms-section-label, .home-light-page .register-popup .reg-consents-label { margin: 0 0 .4rem !important; padding: 0 !important; font-size: .7rem !important; font-weight: 700 !important; letter-spacing: .04em !important; text-transform: uppercase !important; color: #94a3b8 !important; } .home-light-page .register-popup .reg-terms-accordions { display: flex !important; flex-direction: column !important; gap: .4rem !important; max-height: min(200px, 34vh) !important; overflow-x: hidden !important; overflow-y: auto !important; padding-right: .15rem !important; margin-bottom: 0 !important; } .home-light-page .register-popup .reg-terms-accordions::-webkit-scrollbar { width: 4px !important; } .home-light-page .register-popup .reg-terms-accordions::-webkit-scrollbar-thumb { background: #cbd5e1 !important; border-radius: 999px !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-preview { margin: 0 !important; flex-shrink: 0 !important; border-radius: 10px !important; overflow: hidden !important; background: #ffffff !important; border: 1px solid #e2e8f0 !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-preview.expanded { border-color: #c7d2fe !important; box-shadow: 0 2px 8px rgba(79, 70, 229, 0.08) !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-preview-header { display: flex !important; align-items: center !important; gap: .5rem !important; padding: .5rem .65rem !important; min-height: 38px !important; background: #f8fafc !important; color: #1e293b !important; font-size: .78rem !important; font-weight: 600 !important; cursor: pointer !important; user-select: none !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-preview-header:hover { background: #f1f5f9 !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-preview-header i:first-child { color: #4f46e5 !important; width: 1rem !important; text-align: center !important; flex-shrink: 0 !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-preview-header span { flex: 1 1 auto !important; min-width: 0 !important; text-align: left !important; color: #334155 !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-preview-header .terms-arrow { color: #64748b !important; font-size: .68rem !important; flex-shrink: 0 !important; transition: transform .2s ease !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-preview.expanded .terms-arrow { transform: rotate(180deg) !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-preview:not(.expanded) .terms-preview-content { display: none !important; max-height: 0 !important; padding: 0 !important; overflow: hidden !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-preview.expanded .terms-preview-content { display: block !important; padding: .55rem .65rem .6rem !important; max-height: min(150px, 28vh) !important; overflow-x: hidden !important; overflow-y: auto !important; background: #ffffff !important; border-top: 1px solid #eef2f7 !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-preview-content p, .home-light-page .register-popup .form-step[data-step="3"] .terms-preview-content li { font-size: .74rem !important; line-height: 1.5 !important; color: #334155 !important; text-align: left !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-preview-content p { margin: 0 0 .4rem !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-preview-content p strong, .home-light-page .register-popup .form-step[data-step="3"] .terms-preview-content li strong { color: #0f172a !important; font-weight: 600 !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-preview-content ul { margin: .25rem 0 0 !important; padding-left: 1.05rem !important; list-style: disc !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-preview-content li { margin-bottom: .3rem !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-preview-content .terms-note { margin-top: .45rem !important; padding-top: .4rem !important; border-top: 1px dashed #e2e8f0 !important; font-size: .72rem !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-preview-content .terms-note a { color: #4f46e5 !important; font-weight: 600 !important; } .home-light-page .register-popup .form-step[data-step="3"] .checkbox-group { display: flex !important; flex-direction: column !important; gap: .4rem !important; margin: 0 !important; padding: 0 !important; } .home-light-page .register-popup .form-step[data-step="3"] .checkbox-item { display: flex !important; align-items: flex-start !important; gap: 0 !important; margin: 0 !important; padding: .5rem .6rem !important; background: #f8fafc !important; border: 1px solid #e2e8f0 !important; border-radius: 10px !important; cursor: pointer !important; transition: border-color .15s ease, background .15s ease !important; } .home-light-page .register-popup .form-step[data-step="3"] .checkbox-item:hover { border-color: #c7d2fe !important; background: #f5f7ff !important; } .home-light-page .register-popup .reg-consents-panel { margin-top: .15rem !important; padding: .65rem !important; border-radius: 12px !important; border: 1px solid #e2e8f0 !important; background: #fafbfc !important; } .home-light-page .register-popup .reg-consents-head { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: .5rem !important; margin-bottom: .5rem !important; flex-wrap: wrap !important; } .home-light-page .register-popup .reg-consents-head .reg-consents-label { margin: 0 !important; } .home-light-page .register-popup .reg-consents-head .accept-all-btn { margin: 0 !important; flex-shrink: 0 !important; } .home-light-page .register-popup .reg-consents-optional { margin-top: .55rem !important; padding-top: .55rem !important; border-top: 1px solid #e2e8f0 !important; } .home-light-page .register-popup .reg-optional-consent-label { margin: 0 0 .4rem !important; font-size: .68rem !important; font-weight: 600 !important; color: #94a3b8 !important; text-transform: uppercase !important; letter-spacing: .04em !important; } .home-light-page .register-popup .form-step[data-step="3"] .checkbox-item.optional { background: #ffffff !important; border: 1px solid #e2e8f0 !important; border-style: solid !important; } .home-light-page .register-popup .form-step[data-step="3"] .checkbox-item input[type="checkbox"] { position: absolute !important; opacity: 0 !important; width: 0 !important; height: 0 !important; pointer-events: none !important; } .home-light-page .register-popup .form-step[data-step="3"] .checkbox-label { display: flex !important; align-items: flex-start !important; gap: .55rem !important; width: 100% !important; margin: 0 !important; padding: 0 !important; cursor: pointer !important; text-align: left !important; font-size: .8rem !important; line-height: 1.5 !important; color: #1e293b !important; -webkit-text-fill-color: #1e293b !important; } .home-light-page .register-popup .form-step[data-step="3"] .checkbox-text { flex: 1 1 auto !important; min-width: 0 !important; text-align: left !important; word-break: break-word !important; color: #1e293b !important; -webkit-text-fill-color: #1e293b !important; font-size: .8rem !important; font-weight: 400 !important; line-height: 1.5 !important; } .home-light-page .register-popup .form-step[data-step="3"] .checkbox-custom { width: 18px !important; height: 18px !important; min-width: 18px !important; margin-top: .1rem !important; border: 1.5px solid #94a3b8 !important; background: #ffffff !important; border-radius: 5px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; } .home-light-page .register-popup .form-step[data-step="3"] .checkbox-custom i { font-size: 9px !important; color: transparent !important; transform: scale(0) !important; transition: transform .15s ease, color .15s ease !important; } .home-light-page .register-popup .form-step[data-step="3"] .checkbox-item input:checked + .checkbox-label .checkbox-custom { background: #4f46e5 !important; border-color: #4f46e5 !important; box-shadow: none !important; } .home-light-page .register-popup .form-step[data-step="3"] .checkbox-item input:checked + .checkbox-label .checkbox-custom i { color: #ffffff !important; transform: scale(1) !important; } .home-light-page .register-popup .form-step[data-step="3"] .checkbox-label a { color: #4f46e5 !important; font-weight: 600 !important; text-decoration: none !important; } .home-light-page .register-popup .form-step[data-step="3"] .checkbox-label a:hover { text-decoration: underline !important; } .home-light-page .register-popup .form-step[data-step="3"] .accept-all-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: .4rem !important; padding: .45rem .9rem !important; border-radius: 8px !important; border: 1px solid #c7d2fe !important; background: #eef2ff !important; color: #4338ca !important; font-size: .75rem !important; font-weight: 700 !important; cursor: pointer !important; transition: background .15s ease, border-color .15s ease !important; } .home-light-page .register-popup .form-step[data-step="3"] .accept-all-btn:hover { background: #e0e7ff !important; border-color: #a5b4fc !important; } .home-light-page .register-popup .form-step[data-step="3"] .accept-all-btn.all-accepted { background: #dcfce7 !important; border-color: #86efac !important; color: #15803d !important; } .home-light-page .register-popup .reg-grid-contact, .home-light-page .register-popup .reg-grid-name { align-items: start !important; } .home-light-page .register-popup .register-popup-body::-webkit-scrollbar { width: 5px !important; } .home-light-page .register-popup .register-popup-body::-webkit-scrollbar-thumb { background: #cbd5e1 !important; border-radius: 999px !important; } .home-light-page .register-popup .reg-section-oauth.reg-oauth-step1 { padding-bottom: 0 !important; margin-bottom: 0 !important; border-bottom: none !important; } .home-light-page .register-popup .register-popup-footer { flex-shrink: 0 !important; margin: 0 !important; padding: .6rem 1.35rem .75rem !important; border-top: 1px solid #f1f5f9 !important; background: #fafbfc !important; text-align: center !important; box-shadow: none !important; } .home-light-page .register-popup .register-popup-footer .auth-link { margin: 0 !important; font-size: .84rem !important; color: #64748b !important; line-height: 1.4 !important; } .home-light-page .register-popup .register-popup-footer .auth-link a { color: #4f46e5 !important; font-weight: 700 !important; text-decoration: none !important; } .home-light-page .register-popup .register-popup-footer .auth-link a:hover { color: #4338ca !important; text-decoration: underline !important; } .home-light-page .register-popup .social-login-section { margin-bottom: 0 !important; } .home-light-page .register-popup .social-divider { margin: .55rem 0 .65rem !important; } .home-light-page .register-popup .social-divider .divider-text { font-size: .68rem !important; color: #94a3b8 !important; text-transform: uppercase !important; letter-spacing: .06em !important; } .home-light-page .register-popup .social-btn { min-height: 40px !important; padding: .45rem .8rem !important; font-size: .84rem !important; border-radius: 10px !important; border: 1px solid #e2e8f0 !important; box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important; } .home-light-page .register-popup .popup-title { font-size: 1.22rem !important; line-height: 1.2 !important; font-weight: 800 !important; color: #0f172a !important; letter-spacing: -.02em !important; } .home-light-page .register-popup .popup-subtitle { font-size: .8rem !important; color: #64748b !important; margin-top: .15rem !important; } .home-light-page .register-popup .form-step:not(.active) { display: none !important; } .home-light-page .register-popup .form-step.active { display: flex !important; flex-direction: column !important; width: 100% !important; } .home-light-page .register-popup .form-step.active .step-content { flex: 1 1 auto !important; min-height: 0 !important; display: flex !important; flex-direction: column !important; gap: 0 !important; } .home-light-page .register-popup .register-form { display: flex !important; flex-direction: column !important; gap: 0 !important; } .home-light-page .register-popup .form-label { color: #334155 !important; font-size: .8125rem !important; font-weight: 600 !important; margin-bottom: .4rem !important; display: block !important; } .home-light-page .register-popup .form-label .required { color: #e11d48 !important; } .home-light-page .register-popup .form-grid { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; gap: 1rem 1.1rem !important; align-items: start !important; margin-bottom: 1rem !important; } .home-light-page .register-popup .form-group { margin: 0 !important; min-width: 0 !important; } .home-light-page .register-popup .form-input { width: 100% !important; min-height: 44px !important; padding: .6rem .8rem !important; border-radius: 11px !important; font-size: .9rem !important; box-sizing: border-box !important; border: 1px solid #dbe2ea !important; background: #ffffff !important; color: #0f172a !important; transition: border-color .15s ease, box-shadow .15s ease, background .15s ease !important; } .home-light-page .register-popup .form-input:focus { border-color: #818cf8 !important; background: #ffffff !important; box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.14) !important; outline: none !important; } .home-light-page .register-popup .form-input::placeholder { color: #94a3b8 !important; opacity: 1 !important; } .home-light-page .register-popup .input-wrapper { width: 100% !important; } .home-light-page .register-popup .password-field-box.form-group { margin-top: 0 !important; margin-bottom: 0 !important; } .home-light-page .reg-member-exists-overlay { position: fixed; inset: 0; z-index: 12050; display: flex; align-items: center; justify-content: center; padding: max(.75rem, env(safe-area-inset-top)) max(.75rem, env(safe-area-inset-right)) max(.75rem, env(safe-area-inset-bottom)) max(.75rem, env(safe-area-inset-left)); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .28s ease, visibility .28s ease; } .home-light-page .reg-member-exists-overlay.is-open { opacity: 1; visibility: visible; pointer-events: auto; } .home-light-page .reg-member-exists-backdrop { position: absolute; inset: 0; background: rgba(15, 23, 42, 0.55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); } .home-light-page .reg-member-exists-dialog { position: relative; z-index: 1; width: min(100%, 400px); max-height: min(90dvh, 100%); overflow-y: auto; padding: 1.35rem 1.25rem 1.15rem; border-radius: 20px; background: #ffffff; border: 1px solid rgba(79, 70, 229, 0.18); box-shadow: 0 24px 60px rgba(15, 23, 42, 0.2), 0 0 0 1px rgba(255, 255, 255, 0.8) inset; text-align: center; transform: translateY(12px) scale(0.97); transition: transform .32s cubic-bezier(0.16, 1, 0.3, 1); } .home-light-page .reg-member-exists-overlay.is-open .reg-member-exists-dialog { transform: translateY(0) scale(1); } .home-light-page .reg-member-exists-icon-wrap { position: relative; width: 64px; height: 64px; margin: 0 auto .85rem; display: flex; align-items: center; justify-content: center; } .home-light-page .reg-member-exists-icon-ring { position: absolute; inset: 0; border-radius: 50%; background: linear-gradient(135deg, rgba(79, 70, 229, 0.15), rgba(225, 29, 72, 0.1)); animation: regMemberPulse 2.4s ease-in-out infinite; } .home-light-page .reg-member-exists-icon { position: relative; font-size: 1.65rem; color: #4f46e5; } @keyframes regMemberPulse { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.08); opacity: 0.85; } } .home-light-page .reg-member-exists-title { margin: 0 0 .35rem; font-size: 1.12rem; font-weight: 700; color: #1e293b; line-height: 1.3; } .home-light-page .reg-member-exists-lead { margin: 0 0 .9rem; font-size: .84rem; color: #64748b; line-height: 1.45; } .home-light-page .reg-member-exists-fields { display: flex; flex-direction: column; gap: .5rem; margin-bottom: .85rem; width: 100%; } .home-light-page .reg-member-exists-field-card { display: flex; flex-direction: column; align-items: center; gap: .35rem; padding: .7rem .85rem; border-radius: 12px; background: linear-gradient(180deg, #f8fafc, #f1f5f9); border: 1px solid #e2e8f0; } .home-light-page .reg-member-exists-field-badge { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: #6366f1; background: rgba(99, 102, 241, 0.12); padding: .2rem .5rem; border-radius: 999px; } .home-light-page .reg-member-exists-field-value { font-size: .95rem; font-weight: 600; color: #0f172a; word-break: break-all; } .home-light-page .reg-member-exists-desc { margin: 0 0 .75rem; font-size: .8rem; color: #475569; line-height: 1.55; text-align: left; } .home-light-page .reg-member-exists-tips { list-style: none; margin: 0 0 1rem; padding: 0; text-align: left; font-size: .76rem; color: #64748b; } .home-light-page .reg-member-exists-tips li { display: flex; align-items: flex-start; gap: .45rem; margin-bottom: .4rem; line-height: 1.4; } .home-light-page .reg-member-exists-tips li i { color: #10b981; margin-top: .15rem; flex-shrink: 0; } .home-light-page .reg-member-exists-actions { display: flex; flex-direction: column; gap: .5rem; } .home-light-page .reg-member-exists-btn { width: 100%; min-height: 46px; border-radius: 12px; font-size: .9rem; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: .45rem; transition: transform .15s ease, box-shadow .15s ease, filter .15s ease; } .home-light-page .reg-member-exists-btn-primary { border: none; color: #fff; background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 70%, #e11d48 100%); box-shadow: 0 8px 20px rgba(79, 70, 229, 0.28); } .home-light-page .reg-member-exists-btn-primary:hover { filter: brightness(1.04); transform: translateY(-1px); } .home-light-page .reg-member-exists-btn-ghost { border: 1px solid #e2e8f0; background: #fff; color: #475569; } .home-light-page .reg-member-exists-btn-ghost:hover { background: #f8fafc; border-color: #cbd5e1; } .home-light-page .register-popup .btn-next.is-checking { opacity: .85; pointer-events: none; } .home-light-page .register-popup .btn-next.is-checking .btn-text::before { content: ''; display: inline-block; width: .9em; height: .9em; margin-right: .4em; border: 2px solid rgba(255,255,255,.35); border-top-color: #fff; border-radius: 50%; vertical-align: -0.15em; animation: regBtnSpin .7s linear infinite; } @keyframes regBtnSpin { to { transform: rotate(360deg); } } @media (max-width: 640px) { .home-light-page .reg-member-exists-overlay { align-items: center !important; justify-content: center !important; padding: max(.65rem, env(safe-area-inset-top)) max(.65rem, env(safe-area-inset-right)) max(.65rem, env(safe-area-inset-bottom)) max(.65rem, env(safe-area-inset-left)) !important; } .home-light-page .reg-member-exists-dialog { width: min(96vw, 24rem) !important; max-width: min(96vw, 24rem) !important; border-radius: 18px !important; align-self: center !important; } } .home-light-page .register-popup .form-group.has-field-availability { margin-bottom: .15rem !important; } .home-light-page .register-popup .reg-field-availability { display: flex !important; align-items: flex-start !important; gap: .45rem !important; width: 100% !important; max-width: 100% !important; margin: .45rem 0 0 !important; padding: .5rem .6rem !important; border-radius: 10px !important; font-size: .74rem !important; line-height: 1.45 !important; box-sizing: border-box !important; position: static !important; right: auto !important; bottom: auto !important; transform: none !important; white-space: normal !important; word-wrap: break-word !important; overflow-wrap: anywhere !important; pointer-events: auto !important; opacity: 1 !important; border: 1px solid transparent !important; } .home-light-page .register-popup .reg-field-availability > i { flex-shrink: 0 !important; margin-top: .1rem !important; font-size: .85rem !important; } .home-light-page .register-popup .reg-field-availability .reg-avail-body { flex: 1 !important; min-width: 0 !important; display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: .25rem .5rem !important; } .home-light-page .register-popup .reg-field-availability .reg-avail-msg { flex: 1 1 100% !important; min-width: 0 !important; } .home-light-page .register-popup .reg-field-availability.availability-status--available { color: #047857 !important; background: #ecfdf5 !important; border-color: #a7f3d0 !important; } .home-light-page .register-popup .reg-field-availability.availability-status--available > i { color: #10b981 !important; } .home-light-page .register-popup .reg-field-availability.availability-status--taken { color: #991b1b !important; background: #fef2f2 !important; border-color: #fecaca !important; } .home-light-page .register-popup .reg-field-availability.availability-status--taken > i { color: #dc2626 !important; } .home-light-page .register-popup .reg-field-availability.availability-status--loading { color: #4338ca !important; background: #eef2ff !important; border-color: #c7d2fe !important; } .home-light-page .register-popup .reg-field-availability .reg-avail-login-link { color: #4f46e5 !important; font-weight: 700 !important; font-size: .74rem !important; text-decoration: none !important; white-space: nowrap !important; } .home-light-page .register-popup .reg-field-availability .reg-avail-login-link:hover { text-decoration: underline !important; color: #4338ca !important; } .home-light-page .register-popup .reg-grid-contact .form-group, .home-light-page .register-popup .reg-grid-name .form-group { overflow: visible !important; } .home-light-page .register-popup .reg-phone-verified-note { margin-top: .4rem !important; } .home-light-page .register-popup .reg-form-alerts { margin: 0 0 .65rem !important; display: flex !important; flex-direction: column !important; gap: .4rem !important; } .home-light-page .register-popup .reg-form-alerts .register-error, .home-light-page .register-popup .reg-form-alerts .register-success { display: none !important; align-items: flex-start !important; gap: .5rem !important; margin: 0 !important; padding: .55rem .7rem !important; border-radius: 10px !important; font-size: .8rem !important; line-height: 1.4 !important; } .home-light-page .register-popup .reg-form-alerts .register-error[style*="flex"], .home-light-page .register-popup .reg-form-alerts .register-success[style*="flex"] { display: flex !important; } .home-light-page .register-popup .reg-form-alerts i { margin-top: .1rem !important; flex-shrink: 0 !important; } .home-light-page .register-popup .reg-phone-verified-note { display: flex !important; align-items: center !important; gap: .35rem !important; margin: .35rem 0 0 !important; padding: 0 !important; font-size: .72rem !important; font-weight: 600 !important; color: #16a34a !important; } .home-light-page .register-popup .reg-phone-verified-note[hidden] { display: none !important; } .home-light-page .register-popup .reg-phone-verified-note i { font-size: .75rem !important; } .home-light-page .register-popup .form-input.phone-verified { border-color: #86efac !important; background: #f0fdf4 !important; } @keyframes wzoopAutofillStart { from { opacity: 1; } to { opacity: 1; } } .home-light-page .register-popup input:-webkit-autofill, .home-light-page .register-popup select:-webkit-autofill, .home-light-page .register-popup textarea:-webkit-autofill { animation-name: wzoopAutofillStart; animation-duration: 0.001s; } .home-light-page .register-popup .input-wrapper.valid .form-input { border-color: #86efac !important; } .home-light-page .register-popup .input-wrapper.invalid .form-input { border-color: #fca5a5 !important; } .home-light-page .register-popup .reg-step-intro { margin: 0 0 .85rem !important; padding: .5rem .65rem !important; border-radius: 10px !important; background: #f8fafc !important; border: 1px solid #e2e8f0 !important; color: #64748b !important; font-size: .76rem !important; line-height: 1.45 !important; text-align: left !important; } .home-light-page .register-popup .reg-step-intro-terms { background: #eef2ff !important; border-color: #c7d2fe !important; color: #4338ca !important; } .home-light-page .register-popup .form-label { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: .35rem .5rem !important; } .home-light-page .register-popup .optional-tag { display: inline-block !important; font-size: .62rem !important; font-weight: 600 !important; color: #64748b !important; margin: 0 !important; padding: .12rem .4rem !important; border-radius: 4px !important; background: #f1f5f9 !important; border: 1px solid #e2e8f0 !important; line-height: 1.2 !important; text-transform: lowercase !important; } .home-light-page .register-popup .form-step[data-step="2"] .form-group { position: relative !important; z-index: 1 !important; } .home-light-page .register-popup .form-step[data-step="2"] .form-group:has(select:focus), .home-light-page .register-popup .form-step[data-step="2"] .form-group:has(select:active) { z-index: 12 !important; } .home-light-page .register-popup .form-step[data-step="2"] .form-group.full-width { z-index: 1 !important; } .home-light-page .register-popup select.form-input, .home-light-page .register-popup .form-step[data-step="2"] select.form-input { appearance: none !important; -webkit-appearance: none !important; -moz-appearance: none !important; background-color: #ffffff !important; color: #0f172a !important; border: 1px solid #dbe2ea !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: right .7rem center !important; background-size: 1rem !important; padding-right: 2.15rem !important; cursor: pointer !important; } .home-light-page .register-popup select.form-input:focus, .home-light-page .register-popup .form-step[data-step="2"] select.form-input:focus { border-color: #818cf8 !important; box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12) !important; background-color: #ffffff !important; color: #0f172a !important; } .home-light-page .register-popup select.form-input option, .home-light-page .register-popup .form-step[data-step="2"] select.form-input option { background: #ffffff !important; color: #0f172a !important; } .home-light-page .register-popup .form-step[data-step="3"] .checkbox-item.is-invalid { border-color: #fca5a5 !important; background: #fef2f2 !important; animation: regCheckboxShake .35s ease !important; } @keyframes regCheckboxShake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } } .home-light-page .register-popup .reg-progress-minimal { margin: 0 0 1rem !important; padding: 0 !important; background: transparent !important; border: none !important; } .home-light-page .register-popup .reg-progress-minimal-meta { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: .75rem !important; margin-bottom: .5rem !important; } .home-light-page .register-popup .reg-progress-badge { font-size: .72rem !important; font-weight: 800 !important; color: #4f46e5 !important; background: #eef2ff !important; padding: .2rem .55rem !important; border-radius: 999px !important; line-height: 1.2 !important; flex-shrink: 0 !important; } .home-light-page .register-popup .reg-progress-step-name { font-size: .8rem !important; font-weight: 600 !important; color: #64748b !important; text-align: right !important; line-height: 1.3 !important; } .home-light-page .register-popup .reg-progress-track { height: 6px !important; background: #e8edf3 !important; border-radius: 999px !important; overflow: hidden !important; } .home-light-page .register-popup .reg-progress-fill, .home-light-page .register-popup #progressFill { display: block !important; height: 100% !important; min-width: 0 !important; background: linear-gradient(90deg, #4f46e5, #7c3aed) !important; border-radius: 999px !important; transition: width .35s ease !important; box-shadow: none !important; position: static !important; } .home-light-page .register-popup .reg-progress-track[data-step="1"] #progressFill { width: 33.333% !important; } .home-light-page .register-popup .reg-progress-track[data-step="2"] #progressFill { width: 66.666% !important; } .home-light-page .register-popup .reg-progress-track[data-step="3"] #progressFill { width: 100% !important; } .home-light-page .register-popup .reg-progress-steps-sr { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .home-light-page .register-popup .progress-steps .step { opacity: 1 !important; } .home-light-page .register-popup .terms-preview { background: #f8fafc !important; border: 1px solid #e2e8f0 !important; } .home-light-page .register-popup .terms-preview-header { color: #334155 !important; background: #f1f5f9 !important; } .home-light-page .register-popup .terms-preview-content { color: #475569 !important; } .home-light-page .register-popup .terms-preview-content p strong, .home-light-page .register-popup .terms-preview-content li strong { color: #1e293b !important; } .home-light-page .register-popup .checkbox-label { color: #1e293b !important; -webkit-text-fill-color: #1e293b !important; } .home-light-page .register-popup .checkbox-text { color: #1e293b !important; -webkit-text-fill-color: #1e293b !important; } .home-light-page .register-popup .btn-next, .home-light-page .register-popup .btn-submit, .home-light-page .login-popup .login-submit-btn, .home-light-page .forgot-password-popup .login-submit-btn { background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%) !important; color: #ffffff !important; border: none !important; border-radius: 12px !important; } .home-light-page .register-popup .btn-next:hover, .home-light-page .register-popup .btn-submit:hover, .home-light-page .login-popup .login-submit-btn:hover, .home-light-page .forgot-password-popup .login-submit-btn:hover { background: linear-gradient(135deg, #4338ca 0%, #6d28d9 100%) !important; box-shadow: 0 10px 24px rgba(79, 70, 229, 0.28) !important; } /* —— Giriş modalı gelişmiş düzen —— */ .home-light-page .login-auth-block { display: flex; flex-direction: column; gap: 0; } .home-light-page .login-form.login-form-enhanced { gap: 0 !important; } .home-light-page .login-field-label { display: block; font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #64748b; margin: 0 0 .4rem; } .home-light-page .login-field-label--inner { margin-top: 0; margin-bottom: .35rem; } .home-light-page .login-field-hint { font-size: .72rem; color: #94a3b8; margin: .35rem 0 0; line-height: 1.4; } .home-light-page .login-identifier-group { margin-bottom: 0 !important; position: relative; } .home-light-page .login-identifier-group.is-invalid .form-input { border-color: #f87171 !important; background: #fffbfb !important; box-shadow: 0 0 0 3px rgba(248, 113, 113, 0.15) !important; } .home-light-page .login-identifier-group.is-valid .form-input { border-color: #86efac !important; } .home-light-page .login-password-block { display: flex; flex-direction: column; gap: .35rem; } .home-light-page .login-password-group { position: relative; margin-bottom: 0 !important; min-height: 3rem; } .home-light-page .login-password-group .input-icon { position: absolute !important; left: .875rem !important; top: 50% !important; transform: translateY(-50%) !important; margin: 0 !important; height: 1.25rem; display: flex; align-items: center; justify-content: center; pointer-events: none; z-index: 2; } .home-light-page .login-pw-toggle { position: absolute; right: .5rem; top: 50%; transform: translateY(-50%); z-index: 3; width: 2.25rem; height: 2.25rem; border: none; border-radius: 8px; background: transparent; color: #64748b; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; } .home-light-page .login-pw-toggle:hover { color: #4f46e5; background: #eef2ff; } .home-light-page .login-password-input { display: block; width: 100%; min-height: 3rem; height: 3rem; padding: 0 2.75rem 0 2.65rem !important; line-height: 1.25 !important; box-sizing: border-box; } .home-light-page .login-form-options { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .5rem; margin-top: .65rem; padding-top: 0; } .home-light-page .login-identifier-group .form-input { min-height: 3rem; height: 3rem; padding-top: 0 !important; padding-bottom: 0 !important; line-height: 1.25 !important; box-sizing: border-box; } .home-light-page .login-identifier-group .input-icon { top: 50% !important; transform: translateY(-50%) !important; } .home-light-page .login-section-label { font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #64748b; margin: 1rem 0 .45rem; } .home-light-page .login-methods-hint { font-size: .72rem; color: #4f46e5; background: #eef2ff; border: 1px solid #c7d2fe; border-radius: 8px; padding: .4rem .6rem; margin: .5rem 0 0; line-height: 1.35; } .home-light-page .login-methods-placeholder { display: flex; align-items: flex-start; gap: .65rem; margin: 1rem 0 .25rem; padding: .85rem .95rem; border-radius: 12px; border: 1px dashed #cbd5e1; background: #f8fafc; color: #64748b; } .home-light-page .login-methods-placeholder[hidden] { display: none !important; } .home-light-page .login-methods-placeholder.is-checking { border-color: #c7d2fe; background: #eef2ff; color: #4338ca; } .home-light-page .login-methods-placeholder__icon { flex-shrink: 0; width: 2rem; height: 2rem; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; background: #e2e8f0; color: #64748b; font-size: .95rem; } .home-light-page .login-methods-placeholder.is-checking .login-methods-placeholder__icon { background: #c7d2fe; color: #4338ca; } .home-light-page .login-methods-placeholder.is-not-found { border-color: #fecaca; border-style: solid; background: #fef2f2; color: #b91c1c; } .home-light-page .login-methods-placeholder.is-not-found .login-methods-placeholder__icon { background: #fecaca; color: #b91c1c; } .home-light-page .login-methods-placeholder__text { margin: 0; font-size: .78rem; line-height: 1.45; padding-top: .2rem; } .home-light-page .login-methods-stage[hidden] { display: none !important; } .home-light-page .login-methods-stage { animation: loginPanelIn .24s ease-out; } .home-light-page .login-method-tab.is-unavailable, .home-light-page .login-method-tab:disabled { opacity: .42; cursor: not-allowed; pointer-events: none; filter: grayscale(0.45); } .home-light-page .login-method-tab.is-unavailable .login-method-tab__label { color: #94a3b8; } .home-light-page .login-method-tabs-wrap { margin: 0 0 .65rem; -webkit-overflow-scrolling: touch; } .home-light-page .login-form-enhanced .login-method-tabs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .3rem; padding: .3rem; background: #f1f5f9; border-radius: 14px; border: 1px solid #e2e8f0; margin: 0; } .home-light-page .login-method-tab { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .25rem; min-height: 3.35rem; padding: .4rem .2rem; border: none; border-radius: 11px; background: transparent; color: #475569; cursor: pointer; transition: background .2s, color .2s, box-shadow .2s, transform .15s; opacity: 1; } .home-light-page .login-method-tab.is-unavailable { opacity: .42; } .home-light-page .login-method-tab.is-unavailable:not(.active) .login-method-tab__icon { filter: grayscale(0.45); } .home-light-page .login-method-tab:not(.active):not(.is-unavailable):hover { background: rgba(255, 255, 255, 0.85); color: #334155; } .home-light-page .login-method-tab__icon { display: flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; border-radius: 8px; font-size: .9rem; transition: background .2s, color .2s; } .home-light-page .login-method-tab__label { font-size: .62rem; font-weight: 700; line-height: 1.1; letter-spacing: .01em; white-space: nowrap; } .home-light-page .login-method-tab:hover:not(:disabled):not(.active) { background: rgba(255, 255, 255, 0.55); color: #475569; } .home-light-page .login-method-tab.active { background: #ffffff; color: #4f46e5; box-shadow: 0 2px 10px rgba(79, 70, 229, 0.12), 0 1px 3px rgba(15, 23, 42, 0.06); outline: 2px solid rgba(99, 102, 241, 0.35); outline-offset: -1px; } .home-light-page .login-method-tab.active .login-method-tab__icon { background: linear-gradient(135deg, #eef2ff 0%, #e0e7ff 100%); color: #4f46e5; } .home-light-page .login-method-tab:disabled { opacity: .38; cursor: not-allowed; filter: grayscale(0.4); } .home-light-page .login-method-body { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 14px; padding: .85rem .9rem; min-height: 7.5rem; margin-bottom: .75rem; } .home-light-page .login-method-body:has(#loginPanelPattern.active) { min-height: 17rem; } .home-light-page .login-method-panels { position: relative; min-height: 8rem; } .home-light-page .login-method-panel { display: none; animation: loginPanelIn .22s ease-out; } .home-light-page .login-method-panel.active { display: block; } .home-light-page .login-method-panel[hidden] { display: none !important; } .home-light-page .login-method-unavailable { font-size: .76rem; color: #b45309; background: #fffbeb; border: 1px solid #fde68a; border-radius: 10px; padding: .45rem .6rem; margin: 0 0 .65rem; line-height: 1.4; } .home-light-page .login-target-masked { margin: .35rem 0 0; font-size: .78rem; font-weight: 600; color: #4f46e5; } .home-light-page .login-captcha-notice { display: flex; align-items: center; gap: .45rem; font-size: .76rem; color: #4338ca; background: #eef2ff; border: 1px solid #c7d2fe; border-radius: 10px; padding: .4rem .55rem; margin-bottom: .45rem; } .home-light-page .login-captcha-notice[hidden] { display: none !important; } @keyframes loginPanelIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } } .home-light-page .login-panel-desc-row { display: flex; align-items: flex-start; justify-content: space-between; gap: .5rem; margin-bottom: .65rem; } .home-light-page .login-panel-desc-row .login-panel-desc { margin: 0; flex: 1; } .home-light-page .login-pattern-progress { flex-shrink: 0; font-size: .68rem; font-weight: 700; color: #64748b; background: #fff; border: 1px solid #e2e8f0; border-radius: 999px; padding: .2rem .55rem; white-space: nowrap; } .home-light-page .login-pattern-progress.is-ready { color: #059669; border-color: #a7f3d0; background: #ecfdf5; } .home-light-page .login-panel-desc { font-size: .78rem; color: #64748b; margin: 0 0 .75rem; line-height: 1.45; display: flex; align-items: flex-start; gap: .4rem; } .home-light-page .login-panel-desc i { color: #6366f1; margin-top: .15rem; flex-shrink: 0; } .home-light-page .login-info-card { display: flex; align-items: flex-start; gap: .75rem; padding: .65rem .75rem; background: #ffffff; border: 1px solid #e2e8f0; border-radius: 12px; } .home-light-page .login-info-card--compact { padding: .5rem .65rem; margin-bottom: .65rem; } .home-light-page .login-info-card__icon { flex-shrink: 0; width: 2.25rem; height: 2.25rem; display: flex; align-items: center; justify-content: center; border-radius: 10px; background: linear-gradient(135deg, #eef2ff 0%, #e0e7ff 100%); color: #4f46e5; font-size: 1rem; } .home-light-page .login-info-card__text strong { display: block; font-size: .82rem; color: #0f172a; margin-bottom: .2rem; } .home-light-page .login-info-card__text p { margin: 0; font-size: .76rem; color: #64748b; line-height: 1.45; } .home-light-page .login-pattern-stage { position: relative; width: min(100%, 15.5rem); min-height: 15.5rem; margin: 0 auto .5rem; } .home-light-page .login-pattern-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.1rem; padding: .5rem; touch-action: none; position: relative; z-index: 2; user-select: none; -webkit-user-select: none; } .home-light-page .login-pattern-dot { width: 3rem; height: 3rem; border-radius: 50%; border: 2px solid #cbd5e1; background: #fff; cursor: pointer; transition: border-color .15s, background .15s, box-shadow .15s, transform .15s; box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06); } .home-light-page .login-pattern-dot.is-active { border-color: #4f46e5; background: #eef2ff; box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2); transform: scale(1.06); } .home-light-page .login-pattern-canvas { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1; } .home-light-page .login-pattern-stage.login-pattern-shake { animation: loginPatternShake .45s ease-in-out; } @keyframes loginPatternShake { 0%, 100% { transform: translateX(0); } 20% { transform: translateX(-6px); } 40% { transform: translateX(6px); } 60% { transform: translateX(-4px); } 80% { transform: translateX(4px); } } .home-light-page .login-identifier-group.is-checking .input-icon::after { content: ''; position: absolute; right: -1.6rem; top: 50%; width: 14px; height: 14px; margin-top: -7px; border: 2px solid #c7d2fe; border-top-color: #4f46e5; border-radius: 50%; animation: loginIdSpin .7s linear infinite; } .home-light-page .login-identifier-group .input-icon { position: relative; } @keyframes loginIdSpin { to { transform: rotate(360deg); } } .home-light-page .login-link-btn { display: flex; align-items: center; justify-content: center; gap: .35rem; width: 100%; margin: .25rem auto 0; padding: .35rem; border: none; background: none; color: #64748b; font-size: .75rem; font-weight: 600; cursor: pointer; transition: color .15s; } .home-light-page .login-link-btn:hover { color: #4f46e5; } .home-light-page .login-face-wrap { position: relative; display: block; width: 100%; max-width: 100%; margin: 0 auto; padding: 0; font: inherit; text-align: left; appearance: none; -webkit-appearance: none; border-radius: 12px; overflow: hidden; background: #1e293b; aspect-ratio: 4/3; border: 2px dashed #475569; cursor: pointer; transition: border-color .2s, box-shadow .2s; } .home-light-page .login-face-wrap:hover { border-color: #818cf8; box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.12); } .home-light-page .login-face-wrap.is-live { border-style: solid; border-color: #4f46e5; } .home-light-page .login-face-wrap.is-live .login-face-placeholder { opacity: 0; pointer-events: none; } .home-light-page .login-face-live-badge { position: absolute; top: .5rem; right: .5rem; z-index: 3; display: inline-flex; align-items: center; gap: .3rem; font-size: .65rem; font-weight: 700; color: #fff; background: rgba(220, 38, 38, 0.85); padding: .2rem .45rem; border-radius: 999px; text-transform: uppercase; letter-spacing: .03em; } .home-light-page .login-face-live-badge i { font-size: .4rem; animation: loginFacePulse 1.2s ease-in-out infinite; } @keyframes loginFacePulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } } .home-light-page .login-face-video { width: 100%; height: 100%; object-fit: cover; display: block; } .home-light-page .login-face-placeholder { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem; color: #94a3b8; font-size: .78rem; background: linear-gradient(160deg, #1e293b 0%, #0f172a 100%); transition: opacity .25s; z-index: 1; } .home-light-page .login-face-placeholder i { font-size: 1.75rem; opacity: .7; } .home-light-page .face-enroll-mirror { transform: scaleX(-1); } .home-light-page .face-enroll-overlay { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 2; } .home-light-page .face-enroll-guide { margin: 0 0 .55rem; font-size: .78rem; line-height: 1.45; color: #64748b; } .home-light-page .face-enroll-quality { display: flex; align-items: center; gap: .55rem; margin-bottom: .55rem; } .home-light-page .face-enroll-quality__bar { flex: 1; height: .35rem; border-radius: 999px; background: #e2e8f0; overflow: hidden; } .home-light-page .face-enroll-quality__fill { display: block; height: 100%; width: 0; border-radius: inherit; background: #ef4444; transition: width .2s ease, background .2s ease; } .home-light-page .face-enroll-quality__fill.is-warn { background: #f59e0b; } .home-light-page .face-enroll-quality__fill.is-good { background: #22c55e; } .home-light-page .face-enroll-quality__text { font-size: .72rem; color: #64748b; flex: 1.2; line-height: 1.35; } .home-light-page .login-feedback { min-height: 0; margin-bottom: .5rem; } .home-light-page .login-feedback .login-error, .home-light-page .login-feedback .login-success { margin: 0 0 .5rem !important; padding: .6rem .75rem !important; border-radius: 10px !important; font-size: .8rem !important; line-height: 1.4 !important; display: flex !important; align-items: flex-start !important; gap: .5rem !important; } .home-light-page .login-feedback .login-error i, .home-light-page .login-feedback .login-success i { flex-shrink: 0; margin-top: .1rem; } .home-light-page .login-form-enhanced .login-submit-btn { margin-top: 0 !important; min-height: 48px !important; font-size: .92rem !important; font-weight: 700 !important; letter-spacing: .02em !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: .5rem !important; } .home-light-page .login-submit-btn__icon { display: inline-flex; font-size: 1rem; opacity: .95; } .home-light-page .login-methods-hint.is-warn { color: #b45309; background: #fffbeb; border-color: #fcd34d; } .home-light-page .login-form-enhanced .form-options { margin-top: .15rem; padding-top: 0; } .home-light-page .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; } @media (max-width: 520px) { .home-light-page .login-method-tabs-wrap { margin-left: -.15rem; margin-right: -.15rem; padding: 0 .15rem; overflow-x: auto; scrollbar-width: none; } .home-light-page .login-method-tabs-wrap::-webkit-scrollbar { display: none; } .home-light-page .login-form-enhanced .login-method-tabs { display: flex; flex-wrap: nowrap; min-width: min(100%, 22.5rem); width: max-content; max-width: none; } .home-light-page .login-method-tab { flex: 0 0 3.75rem; min-width: 3.75rem; min-height: 3.35rem; } .home-light-page .login-method-body { min-height: 5.75rem; padding: .65rem; } .home-light-page .login-method-body:has(#loginPanelPattern.active) { min-height: 14rem; } .home-light-page .login-pattern-dot { width: 2.65rem; height: 2.65rem; } .home-light-page .login-pattern-grid { gap: .85rem; } } .home-light-page .register-popup .btn-prev, .home-light-page .register-popup .btn-skip { background: #f8fafc !important; border: 1px solid #e2e8f0 !important; color: #475569 !important; } .home-light-page .password-field-box { margin: 0 !important; } .home-light-page .register-popup .step-content { padding: 0 !important; } .home-light-page .register-popup .register-popup-actions .btn-next, .home-light-page .register-popup .register-popup-actions .btn-submit { width: 100% !important; min-width: 0 !important; min-height: 48px !important; padding: .7rem 1.25rem !important; font-weight: 700 !important; font-size: .92rem !important; letter-spacing: .01em !important; box-shadow: 0 6px 18px rgba(79, 70, 229, 0.25) !important; border-radius: 12px !important; justify-content: center !important; } .home-light-page .register-popup .register-popup-actions .btn-prev, .home-light-page .register-popup .btn-skip { min-height: 46px !important; padding: .6rem 1rem !important; border-radius: 11px !important; font-size: .88rem !important; } .home-light-page .reg-password-block { width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; overflow: hidden !important; } .home-light-page .reg-password-block .strength-fill { display: none !important; } .home-light-page .reg-password-input-row { position: relative !important; display: flex !important; align-items: stretch !important; width: 100% !important; max-width: 100% !important; min-height: 44px !important; margin: 0 !important; padding: 0 !important; border: 1.5px solid #cbd5e1 !important; border-radius: 11px !important; background: #f8fafc !important; overflow: hidden !important; box-sizing: border-box !important; } .home-light-page .reg-password-input-row:focus-within { border-color: #6366f1 !important; background: #ffffff !important; box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.12) !important; } .home-light-page .reg-pwd-icon { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 40px !important; flex-shrink: 0 !important; color: #6366f1 !important; font-size: .88rem !important; background: transparent !important; } .home-light-page .reg-pwd-input { flex: 1 1 auto !important; width: 0 !important; min-width: 0 !important; min-height: 42px !important; margin: 0 !important; padding: .55rem .35rem .55rem 0 !important; border: none !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; font-size: .875rem !important; } .home-light-page .reg-pwd-input:focus { outline: none !important; box-shadow: none !important; } .home-light-page .reg-pwd-actions { display: flex !important; align-items: center !important; gap: 4px !important; flex-shrink: 0 !important; padding: 0 6px 0 2px !important; } .home-light-page .reg-pwd-actions .password-toggle, .home-light-page .reg-pwd-actions .password-generate-btn { position: static !important; top: auto !important; right: auto !important; transform: none !important; width: 30px !important; height: 30px !important; min-width: 30px !important; border-radius: 8px !important; border: 1px solid #e2e8f0 !important; background: #ffffff !important; color: #64748b !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; padding: 0 !important; font-size: .8rem !important; flex-shrink: 0 !important; } .home-light-page .reg-pwd-actions .password-generate-btn { background: #eef2ff !important; border-color: #c7d2fe !important; color: #4f46e5 !important; } .home-light-page .reg-pwd-actions .password-generate-btn:hover { background: #e0e7ff !important; color: #4338ca !important; } .home-light-page .reg-pwd-actions .password-toggle:hover { background: #f1f5f9 !important; color: #334155 !important; } .home-light-page .reg-pwd-actions .password-generate-btn.generated { background: #dcfce7 !important; border-color: #86efac !important; color: #16a34a !important; } .home-light-page .input-wrapper:has(.password-generate-btn) .password-toggle, .home-light-page .reg-password-input-row .password-toggle, .home-light-page .reg-password-input-row .password-generate-btn { position: static !important; right: auto !important; top: auto !important; transform: none !important; } .home-light-page .reg-password-meta { margin-top: .65rem !important; padding-top: .65rem !important; border-top: 1px solid #f1f5f9 !important; width: 100% !important; box-sizing: border-box !important; } .home-light-page .reg-sms-mini-overlay, .home-light-page .login-sms-overlay, .home-light-page .login-email-overlay { position: fixed !important; inset: 0 !important; z-index: 10060 !important; display: none !important; align-items: center !important; justify-content: center !important; padding: 1rem !important; } .home-light-page .reg-sms-mini-overlay.is-open { display: flex !important; } .home-light-page .reg-sms-mini-backdrop { position: absolute !important; inset: 0 !important; background: rgba(15, 23, 42, 0.45) !important; backdrop-filter: blur(4px) !important; -webkit-backdrop-filter: blur(4px) !important; } .home-light-page .reg-sms-mini-dialog { position: relative !important; z-index: 1 !important; width: min(100%, 400px) !important; animation: regSmsMiniIn .28s cubic-bezier(.22, 1, .36, 1) !important; } @keyframes regSmsMiniIn { from { opacity: 0; transform: scale(.94) translateY(10px); } to { opacity: 1; transform: scale(1) translateY(0); } } .home-light-page .reg-sms-mini-close { position: absolute !important; top: .55rem !important; right: .55rem !important; z-index: 2 !important; width: 32px !important; height: 32px !important; border: none !important; border-radius: 8px !important; background: #f1f5f9 !important; color: #64748b !important; cursor: pointer !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; transition: background .15s ease, color .15s ease !important; } .home-light-page .reg-sms-mini-close:hover { background: #e2e8f0 !important; color: #334155 !important; } .home-light-page .reg-sms-verify { margin: 0 !important; padding: .85rem 1rem .75rem !important; border-radius: 14px !important; border: 1px solid #e2e8f0 !important; background: #ffffff !important; box-shadow: 0 16px 40px rgba(15, 23, 42, 0.16) !important; display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 0 !important; } .home-light-page .reg-sms-verify.is-verified { border-color: #86efac !important; background: #f0fdf4 !important; } .home-light-page .reg-sms-verify.is-error { border-color: #fecaca !important; background: #fef2f2 !important; } .home-light-page .reg-sms-verify-head { display: flex !important; flex-wrap: wrap !important; align-items: flex-start !important; justify-content: space-between !important; gap: .2rem .5rem !important; margin-bottom: .45rem !important; padding-right: 1.5rem !important; } .home-light-page .reg-sms-verify-head-left { display: flex !important; flex-direction: column !important; gap: .2rem !important; min-width: 0 !important; } .home-light-page .reg-sms-phone-display { font-size: .72rem !important; font-weight: 600 !important; color: #64748b !important; letter-spacing: .02em !important; } .home-light-page .reg-sms-verify-title { font-size: .8rem !important; font-weight: 700 !important; color: #334155 !important; } .home-light-page .reg-sms-verify-title i { color: #4f46e5 !important; margin-right: .35rem !important; } .home-light-page .reg-sms-status { font-size: .72rem !important; font-weight: 600 !important; color: #64748b !important; margin: 0 0 .5rem !important; line-height: 1.35 !important; } .home-light-page .reg-sms-verify.is-sending .reg-sms-status { color: #4f46e5 !important; } .home-light-page .reg-sms-code-label { display: block !important; font-size: .75rem !important; font-weight: 600 !important; color: #334155 !important; margin: 0 0 .35rem !important; } .home-light-page .reg-sms-verify.is-verified .reg-sms-status { color: #16a34a !important; } .home-light-page .reg-sms-verify.is-error .reg-sms-status { color: #dc2626 !important; } .home-light-page .reg-sms-actions, .home-light-page .reg-sms-code-row { display: flex !important; flex-wrap: wrap !important; gap: .5rem !important; align-items: stretch !important; } .home-light-page .reg-sms-code-row { margin-top: .55rem !important; } .home-light-page .reg-sms-code-row.is-locked { opacity: .55 !important; pointer-events: none !important; } .home-light-page .reg-sms-btn.loading { pointer-events: none !important; opacity: .7 !important; } .home-light-page .reg-sms-btn.loading i { animation: regSmsSpin .7s linear infinite !important; } @keyframes regSmsSpin { to { transform: rotate(360deg); } } .home-light-page .reg-sms-code-input { width: 100% !important; min-height: 46px !important; margin-bottom: .55rem !important; letter-spacing: .18em !important; text-align: center !important; font-weight: 700 !important; font-size: 1.05rem !important; } .home-light-page .reg-sms-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: .4rem !important; padding: .55rem .85rem !important; border-radius: 10px !important; font-size: .78rem !important; font-weight: 700 !important; border: none !important; cursor: pointer !important; white-space: nowrap !important; } .home-light-page .reg-sms-btn-send { background: #eef2ff !important; color: #4f46e5 !important; border: 1px solid #c7d2fe !important; } .home-light-page .reg-sms-btn-confirm { width: 100% !important; min-height: 44px !important; margin: 0 auto !important; background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%) !important; color: #fff !important; box-shadow: 0 6px 16px rgba(79, 70, 229, 0.28) !important; } .home-light-page .reg-sms-resend { display: block !important; width: 100% !important; margin: .45rem auto 0 !important; padding: .35rem !important; border: none !important; background: transparent !important; color: #4f46e5 !important; font-size: .72rem !important; font-weight: 600 !important; text-align: center !important; cursor: pointer !important; text-decoration: underline !important; text-underline-offset: 2px !important; } .home-light-page .reg-sms-resend:disabled { color: #94a3b8 !important; cursor: not-allowed !important; text-decoration: none !important; } .home-light-page .reg-sms-btn:disabled { opacity: .55 !important; cursor: not-allowed !important; } .home-light-page .reg-sms-hint { margin: .35rem 0 0 !important; font-size: .68rem !important; color: #94a3b8 !important; line-height: 1.4 !important; text-align: center !important; } .home-light-page .sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .home-light-page .reg-strength-row { display: flex !important; align-items: center !important; gap: .55rem !important; width: 100% !important; margin-bottom: .4rem !important; } .home-light-page .reg-strength-meter { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 4px !important; flex: 1 1 auto !important; min-width: 0 !important; max-width: none !important; } .home-light-page .reg-strength-seg { height: 5px !important; border-radius: 999px !important; background: #e2e8f0 !important; transition: background .25s ease, transform .2s ease !important; } .home-light-page .reg-strength-meter[data-level="1"] .reg-strength-seg:nth-child(1) { background: #f87171 !important; } .home-light-page .reg-strength-meter[data-level="2"] .reg-strength-seg:nth-child(-n+2) { background: #fb923c !important; } .home-light-page .reg-strength-meter[data-level="3"] .reg-strength-seg:nth-child(-n+3) { background: #facc15 !important; } .home-light-page .reg-strength-meter[data-level="4"] .reg-strength-seg { background: linear-gradient(90deg, #22c55e, #4ade80) !important; } .home-light-page .reg-strength-label, .home-light-page #regStrengthLabel { font-size: .62rem !important; font-weight: 700 !important; color: #64748b !important; white-space: nowrap !important; letter-spacing: .04em !important; text-transform: uppercase !important; flex-shrink: 0 !important; min-width: 4.5rem !important; text-align: right !important; } .home-light-page .reg-strength-row:has(.reg-strength-meter[data-level="1"]) .reg-strength-label, .home-light-page .reg-strength-row:has(.reg-strength-meter[data-level="1"]) #regStrengthLabel { color: #dc2626 !important; } .home-light-page .reg-strength-row:has(.reg-strength-meter[data-level="2"]) .reg-strength-label, .home-light-page .reg-strength-row:has(.reg-strength-meter[data-level="2"]) #regStrengthLabel { color: #ea580c !important; } .home-light-page .reg-strength-row:has(.reg-strength-meter[data-level="3"]) .reg-strength-label, .home-light-page .reg-strength-row:has(.reg-strength-meter[data-level="3"]) #regStrengthLabel { color: #ca8a04 !important; } .home-light-page .reg-strength-row:has(.reg-strength-meter[data-level="4"]) .reg-strength-label, .home-light-page .reg-strength-row:has(.reg-strength-meter[data-level="4"]) #regStrengthLabel { color: #16a34a !important; } .home-light-page .reg-password-chips { display: flex !important; flex-wrap: wrap !important; gap: .35rem !important; width: 100% !important; max-width: 100% !important; } .home-light-page .reg-pwd-chip { display: inline-flex !important; align-items: center !important; gap: .28rem !important; padding: .2rem .45rem !important; border-radius: 999px !important; font-size: .65rem !important; font-weight: 600 !important; color: #64748b !important; background: #f8fafc !important; border: 1px solid #e2e8f0 !important; transition: all .2s ease !important; max-width: 100% !important; box-sizing: border-box !important; } .home-light-page .reg-pwd-chip i { font-size: .35rem !important; color: #cbd5e1 !important; } .home-light-page .reg-pwd-chip.valid { color: #15803d !important; background: #ecfdf5 !important; border-color: #86efac !important; } .home-light-page .reg-pwd-chip.valid i { color: #22c55e !important; } .home-light-page .contact-item { background: #f8fafc !important; border: 1px solid #e2e8f0 !important; } .home-light-page .contact-item:hover { background: #f1f5f9 !important; } .home-light-page .contact-label { color: #64748b !important; } .home-light-page .contact-value { color: #0f172a !important; } .home-light-page .contact-project-info { margin-top: 1rem !important; padding: .9rem 1rem !important; border-radius: 12px !important; background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%) !important; border: 1px solid #dbe4ff !important; display: flex !important; align-items: flex-start !important; gap: .65rem !important; color: #475569 !important; } .home-light-page .contact-project-info i { color: #4f46e5 !important; margin-top: .15rem !important; } .home-light-page .contact-project-info p { margin: 0 !important; font-size: .85rem !important; line-height: 1.55 !important; color: #475569 !important; } .home-light-page .contact-project-info strong { color: #1e293b !important; font-weight: 700 !important; } .home-light-page .logout-success-popup .popup-content h4, .home-light-page .logout-success-popup .popup-content p { color: #334155 !important; } /* Kayıt 2/3 — home.css koyu tema / --text-white ezmesi */ .home-light-page .register-popup .checkbox-text, .home-light-page .register-popup .reg-consents-panel .checkbox-label, .home-light-page .register-popup .reg-consents-panel .checkbox-label .checkbox-text { color: #1e293b !important; -webkit-text-fill-color: #1e293b !important; } .home-light-page .register-popup .reg-consents-panel .checkbox-text a { color: #4f46e5 !important; font-weight: 600 !important; text-decoration: none !important; } .home-light-page .register-popup .reg-consents-panel .checkbox-text a:hover { text-decoration: underline !important; color: #4338ca !important; } .home-light-page .register-popup .form-step[data-step="3"] .reg-consents-required .checkbox-item { background: #ffffff !important; border: 1px solid #e2e8f0 !important; box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03) !important; } .home-light-page .register-popup .reg-step-skip-row { margin-bottom: .35rem !important; } .home-light-page .register-popup .reg-step-skip-row .btn-skip { font-size: .74rem !important; } .home-light-page #registerPopup[data-reg-step="2"] .register-popup-actions .btn-prev, .home-light-page #registerPopup[data-reg-step="3"] .register-popup-actions .btn-prev { min-height: 46px !important; font-size: .88rem !important; font-weight: 600 !important; } .home-light-page #registerPopup[data-reg-step="2"] .register-popup-actions .btn-next, .home-light-page #registerPopup[data-reg-step="3"] .register-popup-actions .btn-submit { min-height: 46px !important; font-size: .9rem !important; } /* home.css karanlık kayıt stillerini ez */ .home-light-page .popup-overlay .popup-container.register-popup, .home-light-page .register-popup.popup-container { background: #ffffff !important; color: #0f172a !important; } .home-light-page .register-popup .popup-title { color: #0f172a !important; -webkit-text-fill-color: #0f172a !important; background: none !important; } .home-light-page .register-popup .popup-subtitle { color: #64748b !important; } .home-light-page .register-popup .popup-content, .home-light-page .register-popup .register-popup-body { background: #ffffff !important; } .home-light-page .register-popup .progress-steps .step { opacity: 1 !important; } .home-light-page .register-popup .form-progress { padding: 0 !important; border: none !important; background: transparent !important; } @media (min-width: 641px) { .home-light-page .register-popup .reg-actions-panel[data-actions-step="2"] .step-actions, .home-light-page .register-popup .reg-actions-panel[data-actions-step="3"] .step-actions { flex-direction: row !important; justify-content: space-between !important; align-items: center !important; } .home-light-page .register-popup .reg-actions-panel[data-actions-step="2"] .btn-prev, .home-light-page .register-popup .reg-actions-panel[data-actions-step="3"] .btn-prev { order: 0 !important; width: auto !important; min-width: 7.5rem !important; } .home-light-page .register-popup .reg-actions-panel[data-actions-step="2"] .btn-next, .home-light-page .register-popup .reg-actions-panel[data-actions-step="3"] .btn-submit { order: 0 !important; width: auto !important; min-width: 9rem !important; flex: 1 !important; max-width: 14rem !important; } } @media (max-width: 768px) { .home-light-page .popup-overlay .popup-container.login-popup, .home-light-page .popup-overlay .popup-container.register-popup { display: grid !important; grid-template-columns: 1fr !important; } .home-light-page .popup-overlay .popup-container.login-popup { grid-template-rows: auto minmax(0, 1fr) auto !important; } .home-light-page .popup-overlay .popup-container.register-popup { grid-template-rows: auto minmax(0, 1fr) auto auto !important; } } /* Giriş & Kayıt — tablet / mobil ortalanmış modal */ @media (max-width: 768px) { .home-light-page #loginPopup.popup-overlay.active, .home-light-page #registerPopup.popup-overlay.active { display: flex !important; align-items: center !important; justify-content: center !important; min-height: 100dvh !important; padding: max(.75rem, env(safe-area-inset-top)) max(.75rem, env(safe-area-inset-right)) max(.75rem, env(safe-area-inset-bottom)) max(.75rem, env(safe-area-inset-left)) !important; overflow-y: auto !important; overscroll-behavior: contain !important; -webkit-overflow-scrolling: touch !important; } .home-light-page #loginPopup .popup-container.login-popup, .home-light-page #registerPopup .popup-container.register-popup, .home-light-page .popup-overlay .popup-container.register-popup { display: grid !important; grid-template-columns: 1fr !important; width: min(94vw, 26rem) !important; max-width: min(94vw, 26rem) !important; max-height: min(88dvh, 720px) !important; height: auto !important; min-height: 0 !important; margin: auto !important; flex-shrink: 0 !important; border-radius: 20px !important; border: 1px solid rgba(148, 163, 184, 0.35) !important; box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.88) inset, 0 24px 52px rgba(15, 23, 42, 0.18), 0 10px 20px rgba(15, 23, 42, 0.08) !important; transform: scale(0.98) translateY(6px) !important; overflow: hidden !important; } .home-light-page #loginPopup .popup-container.login-popup { grid-template-rows: auto minmax(0, 1fr) auto !important; } .home-light-page #registerPopup .popup-container.register-popup { grid-template-rows: auto minmax(0, 1fr) auto auto !important; } .home-light-page #loginPopup.popup-overlay.active .popup-container.login-popup, .home-light-page #registerPopup.popup-overlay.active .popup-container.register-popup { transform: scale(1) translateY(0) !important; } .home-light-page #loginPopup .popup-container.login-popup::before, .home-light-page #registerPopup .popup-container.register-popup::before, .home-light-page .popup-overlay .popup-container.register-popup::before { border-radius: 20px 20px 0 0 !important; } .home-light-page .login-popup .login-popup-body, .home-light-page .register-popup .register-popup-body { grid-row: auto !important; flex: unset !important; min-height: 0 !important; max-height: none !important; overflow-y: auto !important; overflow-x: hidden !important; -webkit-overflow-scrolling: touch !important; overscroll-behavior: contain !important; } .home-light-page .register-popup .form-grid { grid-template-columns: 1fr !important; gap: .65rem !important; margin-bottom: .65rem !important; } .home-light-page .register-popup .form-group { min-height: 0 !important; } .home-light-page .register-popup .register-popup-body { padding: .55rem 1.15rem .85rem !important; } .home-light-page .register-popup .register-popup-actions, .home-light-page .register-popup .register-popup-footer { padding-left: 1.15rem !important; padding-right: 1.15rem !important; flex-shrink: 0 !important; } .home-light-page .login-popup .popup-header, .home-light-page .register-popup .popup-header { padding: .85rem 1.15rem .65rem !important; flex-shrink: 0 !important; } .home-light-page .login-popup .login-popup-body { padding: .7rem 1.15rem .85rem !important; } .home-light-page .login-popup .login-popup-footer, .home-light-page .register-popup .register-popup-footer { position: static !important; margin-top: 0 !important; padding: .6rem 1.15rem calc(.75rem + env(safe-area-inset-bottom, 0px)) !important; border-top: 1px solid #eef2f7 !important; background: #ffffff !important; text-align: center !important; } .home-light-page .register-popup .register-popup-actions { padding: .65rem 1.15rem .65rem !important; box-shadow: 0 -4px 16px rgba(15, 23, 42, 0.05) !important; border-top: 1px solid #eef2f7 !important; background: #ffffff !important; } .home-light-page .register-popup .reg-progress-minimal { margin-bottom: .55rem !important; } .home-light-page .register-popup .reg-progress-minimal-meta { margin-bottom: .35rem !important; } .home-light-page .login-methods-placeholder { margin: .65rem 0 .15rem !important; padding: .72rem .82rem !important; } .home-light-page .login-methods-placeholder__text { font-size: .74rem !important; line-height: 1.45 !important; } .home-light-page .login-field-hint { font-size: .74rem !important; line-height: 1.42 !important; } .home-light-page .login-form.login-form-enhanced { gap: 0 !important; } .home-light-page .login-popup .social-login-section.social-top { margin-bottom: 0 !important; } .home-light-page .login-popup .social-divider { margin: .55rem 0 !important; } .home-light-page .login-method-tabs-wrap { margin-left: 0 !important; margin-right: 0 !important; padding: 0 !important; } .home-light-page .login-method-tab { flex: 0 0 3.75rem !important; min-width: 3.75rem !important; min-height: 3.35rem !important; } .home-light-page .login-method-tab__label { font-size: .58rem !important; } .home-light-page .login-method-body { min-height: 5.75rem !important; padding: .65rem !important; margin-bottom: .55rem !important; } .home-light-page .login-method-body:has(#loginPanelPattern.active) { min-height: 14rem !important; } .home-light-page .login-popup .login-submit-btn { min-height: 50px !important; width: 100% !important; border-radius: 14px !important; } } /* Giriş & Kayıt modalları — küçük mobil ince ayar */ @media (max-width: 640px) { .home-light-page #loginPopup.popup-overlay.active, .home-light-page #registerPopup.popup-overlay.active { align-items: center !important; justify-content: center !important; padding: max(.65rem, env(safe-area-inset-top)) max(.65rem, env(safe-area-inset-right)) max(.65rem, env(safe-area-inset-bottom)) max(.65rem, env(safe-area-inset-left)) !important; } .home-light-page #loginPopup .popup-container.login-popup, .home-light-page #registerPopup .popup-container.register-popup, .home-light-page .popup-overlay .popup-container.register-popup { width: min(96vw, 24rem) !important; max-width: min(96vw, 24rem) !important; max-height: min(90dvh, 680px) !important; border-radius: 18px !important; } .home-light-page #loginPopup .popup-container.login-popup::before, .home-light-page #registerPopup .popup-container.register-popup::before, .home-light-page .popup-overlay .popup-container.register-popup::before { border-radius: 18px 18px 0 0 !important; } .home-light-page .login-popup .popup-title, .home-light-page .register-popup .popup-title { font-size: 1.08rem !important; line-height: 1.25 !important; } .home-light-page .register-popup .popup-subtitle { font-size: .76rem !important; } .home-light-page .login-popup .popup-header, .home-light-page .register-popup .popup-header { padding: .85rem 1rem .65rem !important; } .home-light-page .login-popup .login-popup-body { padding: .65rem 1rem .75rem !important; } .home-light-page .login-popup .login-popup-footer { padding: .55rem 1rem calc(.7rem + env(safe-area-inset-bottom, 0px)) !important; } .home-light-page .register-popup .register-popup-body { padding: .45rem 1rem .7rem !important; } .home-light-page .register-popup .register-popup-actions { padding: .6rem 1rem .6rem !important; } .home-light-page .register-popup .register-popup-footer { padding: .5rem 1rem calc(.65rem + env(safe-area-inset-bottom, 0px)) !important; } .home-light-page .login-popup .social-btn, .home-light-page .register-popup .social-btn { min-height: 48px !important; width: 100% !important; font-size: .88rem !important; border-radius: 12px !important; } .home-light-page .login-popup .login-submit-btn, .home-light-page .register-popup .btn-next, .home-light-page .register-popup .btn-submit { min-height: 50px !important; width: 100% !important; font-size: .94rem !important; font-weight: 600 !important; border-radius: 14px !important; } .home-light-page .login-form .form-input, .home-light-page .register-popup .form-input { min-height: 48px !important; font-size: 16px !important; border-radius: 12px !important; } .home-light-page .login-popup .form-options { flex-wrap: wrap !important; gap: .5rem !important; align-items: center !important; } .home-light-page .login-popup .popup-close, .home-light-page .register-popup .popup-close { width: 38px !important; height: 38px !important; border-radius: 11px !important; } .home-light-page .login-popup .social-divider, .home-light-page .register-popup .social-divider { margin: .55rem 0 !important; } .home-light-page .register-popup .register-popup-header .header-content { min-width: 0 !important; } .home-light-page .reg-sms-mini-overlay { padding: .5rem !important; align-items: center !important; justify-content: center !important; } .home-light-page .reg-sms-mini-dialog { width: min(100%, calc(100vw - 1rem)) !important; max-height: min(88dvh, 100%) !important; border-radius: 18px !important; } .home-light-page .register-popup .form-progress.reg-progress-compact { margin-bottom: .7rem !important; } .home-light-page .register-popup .form-label { font-size: .78rem !important; margin-bottom: .35rem !important; } .home-light-page .register-popup .reg-actions-panel[data-actions-step="1"] .step-actions { flex-direction: column !important; } .home-light-page .register-popup .reg-actions-panel[data-actions-step="1"] .btn-next { width: 100% !important; max-width: none !important; } .home-light-page .register-popup .reg-actions-panel[data-actions-step="2"] .step-actions-row, .home-light-page .register-popup .reg-actions-panel[data-actions-step="3"] .step-actions-row { flex-direction: row !important; gap: .5rem !important; } .home-light-page .register-popup .reg-actions-panel[data-actions-step="2"] .btn-prev, .home-light-page .register-popup .reg-actions-panel[data-actions-step="3"] .btn-prev { flex: 0 1 40% !important; width: auto !important; min-width: 0 !important; max-width: none !important; min-height: 48px !important; } .home-light-page .register-popup .reg-actions-panel[data-actions-step="2"] .btn-next, .home-light-page .register-popup .reg-actions-panel[data-actions-step="3"] .btn-submit { flex: 1 1 auto !important; width: auto !important; min-width: 0 !important; max-width: none !important; min-height: 48px !important; } .home-light-page .register-popup .form-step[data-step="2"] .form-grid { grid-template-columns: 1fr !important; gap: .55rem !important; } .home-light-page .register-popup .reg-terms-accordions { max-height: min(180px, 30vh) !important; } .home-light-page .register-popup .form-step[data-step="3"] .terms-preview.expanded .terms-preview-content { max-height: min(130px, 26vh) !important; } .home-light-page .register-popup .reg-progress-minimal { margin-bottom: .75rem !important; } .home-light-page .reg-strength-row { flex-wrap: wrap !important; gap: .4rem !important; } .home-light-page .reg-strength-label, .home-light-page #regStrengthLabel { font-size: .62rem !important; width: 100% !important; text-align: left !important; } .home-light-page .reg-password-chips { justify-content: flex-start !important; flex-wrap: wrap !important; gap: .35rem !important; } } @media (max-width: 968px) { .home-light-page .hero-content-grid { grid-template-columns: 1fr !important; gap: 2rem !important; } .home-light-page .hero-main-content, .home-light-page .content-inner { text-align: center !important; max-width: 100% !important; margin: 0 auto !important; } .home-light-page .hero-main-title { max-width: none !important; margin-left: auto !important; margin-right: auto !important; } .home-light-page .hero-logo, .home-light-page .hero-logo .logo-wrapper { justify-content: center !important; } .home-light-page .hero-description .main-desc { margin-left: auto !important; margin-right: auto !important; } .home-light-page .hero-actions, .home-light-page .light-feature-pills { justify-content: flex-start !important; flex-direction: column !important; align-items: stretch !important; width: 100% !important; } .home-light-page .hero-copyright { text-align: center !important; } .home-light-page .phone-mockup { transform: scale(0.88) !important; } .home-light-page .hero-phone-preview { min-height: min(500px, 56vh) !important; } .home-light-page .popup-overlay:not(#registerPopup) .popup-container { width: 94vw !important; max-height: 92vh !important; overflow-y: auto !important; } .home-light-page .yt-modal-overlay { padding: .5rem !important; } .home-light-page .yt-modal-card { width: min(94vw, calc((100dvh - 1.2rem) * 9 / 16)) !important; max-width: 370px !important; border-radius: 16px !important; max-height: calc(100dvh - 1.2rem) !important; } .home-light-page .yt-modal-shell { gap: .5rem !important; } .home-light-page .yt-gallery-nav { width: 38px !important; height: 38px !important; } .home-light-page .yt-modal-close { top: 8px !important; right: 8px !important; width: 36px !important; height: 36px !important; } } @media (max-width: 520px) { .home-light-page .yt-modal-shell { display: grid !important; grid-template-columns: 1fr 1fr !important; width: min(95vw, calc((100dvh - 1rem) * 9 / 16)) !important; max-width: 100% !important; gap: .5rem !important; align-items: center !important; } .home-light-page .yt-modal-card { grid-column: 1 / -1 !important; width: 100% !important; max-width: none !important; max-height: calc(100dvh - 1rem) !important; border-radius: 14px !important; } .home-light-page .yt-modal-header { padding: .75rem 3rem .55rem .85rem !important; } .home-light-page .yt-modal-header h4 { font-size: .82rem !important; } .home-light-page .yt-modal-header span { font-size: .72rem !important; padding: .22rem .5rem !important; } .home-light-page .yt-modal-close { width: 34px !important; height: 34px !important; top: 7px !important; right: 7px !important; border-width: 2px !important; font-size: .88rem !important; } .home-light-page .yt-gallery-nav { position: static !important; transform: none !important; width: 38px !important; height: 38px !important; justify-self: center !important; } .home-light-page .yt-gallery-nav:hover { transform: scale(1.06) !important; } .home-light-page .yt-prev { grid-column: 1 !important; justify-self: end !important; } .home-light-page .yt-next { grid-column: 2 !important; justify-self: start !important; } .home-light-page .hero-main-title { font-size: clamp(1.75rem, 8.5vw, 2.35rem) !important; } .home-light-page .hero-actions .action-btn { width: 100% !important; min-width: 0 !important; max-width: 100% !important; flex: 0 0 auto !important; box-sizing: border-box !important; height: 58px !important; min-height: 58px !important; border-radius: 16px !important; font-size: 1.02rem !important; font-weight: 700 !important; } } /* ========================================================================== MOBILE CANONICAL (≤768px) — tek kaynak, çakışmaları ezer ========================================================================== */ @media (max-width: 768px) { html:has(body.home-light-page), body.home-light-page.single-page-layout { height: 100dvh !important; min-height: 100dvh !important; overflow: hidden !important; position: relative !important; } #main-content { min-height: 100dvh !important; height: 100dvh !important; } .home-light-page .hero-meta-links, .home-light-page .hero-phone-preview { display: none !important; } .home-light-page .hero-fullscreen { flex: 1 !important; display: flex !important; flex-direction: column !important; height: 100dvh !important; min-height: 100dvh !important; padding-top: max(env(safe-area-inset-top, 0px), 0.25rem) !important; overflow: hidden !important; } .home-light-page .hero-container { flex: 1 !important; display: flex !important; align-items: center !important; justify-content: center !important; min-height: 0 !important; max-width: 100% !important; overflow-x: hidden !important; contain: layout style !important; padding: max(env(safe-area-inset-top, 0px), clamp(0.65rem, 3vh, 1.25rem)) 1.15rem calc(4.25rem + env(safe-area-inset-bottom, 0px)) !important; } .home-light-page .hero-content-grid, .home-light-page .hero-main-content { flex: 0 1 auto !important; justify-content: center !important; align-items: center !important; min-height: 0 !important; height: auto !important; } .home-light-page .content-inner { flex: 0 1 auto !important; justify-content: center !important; align-items: center !important; max-width: min(100%, 26rem) !important; min-height: 0 !important; gap: clamp(0.72rem, 2vh, 1rem) !important; transform: none !important; margin-top: 0 !important; contain: layout style !important; } .home-light-page .hero-logo { margin: 0 0 clamp(0.1rem, 0.45vh, 0.3rem) !important; min-height: calc(min(88vw, 320px) * 109 / 320) !important; } .home-light-page .hero-logo .hero-brand-logo { width: min(88vw, 320px) !important; max-width: 320px !important; max-height: none !important; height: auto !important; aspect-ratio: 320 / 109 !important; } .home-light-page .hero-main-title { font-family: 'Inter', 'Inter Fallback', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important; min-height: clamp(3.6em, 16vw, 4.6em) !important; } .home-light-page .hero-description .main-desc { min-height: 3.1em !important; } .home-light-page .hero-actions { flex-direction: column !important; flex-wrap: nowrap !important; align-items: stretch !important; width: 100% !important; justify-content: flex-start !important; gap: 0.78rem !important; min-height: calc(116px + 0.78rem) !important; } .home-light-page .hero-actions .action-btn { width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: 58px !important; min-height: 58px !important; border-radius: 16px !important; font-size: 1.02rem !important; font-weight: 700 !important; } .home-light-page .hero-actions .action-btn.primary-action { box-shadow: 0 10px 28px rgba(46, 58, 110, 0.28) !important; } .home-light-page .hero-actions .action-btn.secondary-action { box-shadow: 0 6px 18px rgba(46, 58, 110, 0.1) !important; } .home-light-page .floating-side-btns { left: 50% !important; right: auto !important; bottom: calc(0.85rem + env(safe-area-inset-bottom, 0px)) !important; transform: translateX(-50%) !important; } .home-light-page .floating-yt-btn { width: 58px !important; height: 58px !important; box-shadow: 0 12px 32px rgba(79, 70, 229, 0.38) !important; transition: none !important; animation: ytBtnFloatMobile 4.5s ease-in-out infinite !important; will-change: transform !important; contain: layout style paint !important; } .home-light-page .floating-yt-btn::before, .home-light-page .floating-shop-btn::before { display: none !important; animation: none !important; } .home-light-page .floating-side-btns { transition: none !important; will-change: transform !important; } .home-light-page .hero-actions .action-btn .btn-content i { min-width: 1.08rem !important; width: 1.08rem !important; text-align: center !important; flex-shrink: 0 !important; } .home-light-page .action-btn { transition: transform 0.2s ease, opacity 0.2s ease !important; } .home-light-page #loginPopup.popup-overlay.active, .home-light-page #registerPopup.popup-overlay.active { display: flex !important; align-items: center !important; justify-content: center !important; } .home-light-page #loginPopup .popup-container.login-popup, .home-light-page #registerPopup .popup-container.register-popup { display: grid !important; width: min(94vw, 26rem) !important; max-width: min(94vw, 26rem) !important; max-height: min(88dvh, 720px) !important; } } @media (max-width: 480px) { .home-light-page .hero-container { padding: clamp(0.55rem, 1.6vh, 0.85rem) 1rem calc(4rem + env(safe-area-inset-bottom, 0px)) !important; } .home-light-page .floating-yt-btn { width: 54px !important; height: 54px !important; } .home-light-page .hero-logo .hero-brand-logo { width: min(92vw, 300px) !important; max-width: 300px !important; } /* Kayıt modalı — küçük telefonlarda alt sheet */ .home-light-page #registerPopup.popup-overlay.active { align-items: flex-end !important; justify-content: center !important; padding: 0 !important; padding-top: env(safe-area-inset-top, 0px) !important; } .home-light-page #registerPopup .popup-container.register-popup, .home-light-page .popup-overlay .popup-container.register-popup { width: 100% !important; max-width: 100% !important; height: auto !important; max-height: min(96dvh, 100svh) !important; min-height: 0 !important; border-radius: 20px 20px 0 0 !important; margin: 0 !important; overflow: hidden !important; } .home-light-page #registerPopup .popup-container.register-popup::before, .home-light-page .popup-overlay .popup-container.register-popup::before { border-radius: 20px 20px 0 0 !important; } .home-light-page .register-popup .popup-subtitle { display: none !important; } .home-light-page .register-popup .popup-header { padding: .7rem 1rem .5rem !important; } .home-light-page .register-popup .register-popup-body { padding: .35rem 1rem .55rem !important; } .home-light-page .register-popup .reg-oauth-step1 { margin-bottom: .55rem !important; padding-bottom: .5rem !important; } .home-light-page .register-popup .register-popup-actions { padding: .55rem 1rem calc(.45rem + env(safe-area-inset-bottom, 0px)) !important; } .home-light-page .register-popup .register-popup-footer { padding: .45rem 1rem calc(.55rem + env(safe-area-inset-bottom, 0px)) !important; } .home-light-page .reg-sms-mini-overlay { align-items: flex-end !important; padding: 0 !important; } .home-light-page .reg-sms-mini-dialog { width: 100% !important; max-width: 100% !important; max-height: min(92dvh, 100svh) !important; border-radius: 18px 18px 0 0 !important; overflow: auto !important; -webkit-overflow-scrolling: touch !important; } } /* Kısa yükseklik (yatay telefon / küçük cihaz) */ @media (max-height: 700px) { .home-light-page #loginPopup.popup-overlay.active, .home-light-page #registerPopup.popup-overlay.active { align-items: stretch !important; padding: max(.35rem, env(safe-area-inset-top)) max(.35rem, env(safe-area-inset-right)) max(.35rem, env(safe-area-inset-bottom)) max(.35rem, env(safe-area-inset-left)) !important; } .home-light-page #loginPopup .popup-container.login-popup, .home-light-page #registerPopup .popup-container.register-popup, .home-light-page .popup-overlay .popup-container.register-popup { width: min(100%, 28rem) !important; max-width: 100% !important; max-height: none !important; height: 100% !important; border-radius: 14px !important; } .home-light-page .register-popup .popup-subtitle, .home-light-page .login-popup .popup-subtitle { display: none !important; } .home-light-page .register-popup .popup-header, .home-light-page .login-popup .popup-header { padding: .55rem .9rem .4rem !important; } .home-light-page .register-popup .popup-title, .home-light-page .login-popup .popup-title { font-size: 1rem !important; } .home-light-page .register-popup .register-popup-body { padding: .25rem .9rem .45rem !important; } .home-light-page .register-popup .reg-oauth-step1 { margin-bottom: .4rem !important; padding-bottom: .35rem !important; } .home-light-page .register-popup .social-btn { min-height: 40px !important; font-size: .8rem !important; } .home-light-page .register-popup .form-input { min-height: 42px !important; } .home-light-page .register-popup .register-popup-actions { padding: .4rem .9rem .4rem !important; } .home-light-page .register-popup .btn-next, .home-light-page .register-popup .btn-submit { min-height: 44px !important; font-size: .88rem !important; } .home-light-page .register-popup .password-req-grid { gap: .1rem .5rem !important; } .home-light-page .reg-sms-mini-dialog { max-height: min(94dvh, 100%) !important; } }