/* Giriş ve kayıt sayfalarının ortak eklemeleri: tema düğmesi, şifremi unuttum penceresi ve karanlık tema.
   Tema tercihi panelle aynı "panel.theme" anahtarında tutulur; karanlık modda html'e dark-style eklenir. */

/* ── Tema düğmesi ─────────────────────────────── */
.db-theme-toggle {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 20;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(255, 255, 255, .7);
    border-radius: 12px;
    background: rgba(255, 255, 255, .78);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 8px 20px -10px rgba(10, 34, 64, .3);
    color: #45526b;
    font-size: 1.2rem;
    cursor: pointer;
    transition: background-color .15s ease, color .15s ease, transform .15s ease;
}

.db-theme-toggle:hover {
    background: #fff;
    color: #0a4a87;
    transform: translateY(-1px);
}

.db-theme-toggle:focus-visible {
    outline: 2px solid #2f7fd1;
    outline-offset: 2px;
}

/* ── Şifremi unuttum penceresi ───────────────── */
#forgotModal .modal-dialog {
    max-width: 420px;
}

#forgotModal .modal-content {
    overflow: visible;
    border: none;
    border-radius: 24px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 30px 70px -20px rgba(10, 34, 64, .32);
}

#forgotModal .db-modal-head {
    display: flex;
    align-items: flex-start;
    gap: .85rem;
    padding: 1.6rem 1.5rem .5rem;
}

#forgotModal .db-modal-icon {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 13px;
    background: #eaf1f9;
    color: #0a4a87;
    font-size: 1.3rem;
}

#forgotModal .db-modal-title {
    margin: 0;
    color: #1b2a3d;
    font-size: 1.1rem;
    font-weight: 700;
}

#forgotModal .db-modal-sub {
    margin: .2rem 0 0;
    color: #6b7688;
    font-size: .84rem;
    line-height: 1.5;
}

#forgotModal .btn-close {
    position: static !important;
    top: auto !important;
    right: auto !important;
    flex-shrink: 0;
    margin: 0 0 0 auto !important;
    transform: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
    opacity: .5;
}

#forgotModal .btn-close:hover {
    opacity: .9;
}

#forgotModal .db-modal-body {
    padding: 1rem 1.5rem 1.6rem;
}

#forgotModal .form-label {
    color: #45526b;
    font-size: .83rem;
    font-weight: 500;
}

#forgotModal .form-control {
    padding-top: .65rem;
    padding-bottom: .65rem;
    border: 1.5px solid #e4e8f2;
    border-radius: 12px;
    background: #fff;
    color: #1b2a3d;
}

#forgotModal .form-control:focus {
    border-color: #2f7fd1;
    box-shadow: 0 0 0 4px rgba(47, 127, 209, .14);
}

#forgotModal .form-control.is-invalid {
    border-color: #d94848;
    background-image: none;
    box-shadow: 0 0 0 3px rgba(217, 72, 72, .12);
}

#forgotModal .iti {
    display: block;
    width: 100%;
}

#forgotModal .db-field-error {
    display: flex;
    align-items: flex-start;
    gap: .3rem;
    margin-top: .4rem;
    color: #c03a3a;
    font-size: .78rem;
    font-weight: 500;
}

#forgotModal .db-field-error[hidden] {
    display: none;
}

#forgotModal .btn-primary {
    padding-top: .75rem;
    padding-bottom: .75rem;
    border-color: #0a4a87;
    border-radius: 12px;
    background: linear-gradient(135deg, #2f7fd1 0%, #0a4a87 100%);
    box-shadow: 0 10px 22px -6px rgba(10, 74, 135, .5);
    font-weight: 600;
}

#forgotModal .btn-primary:hover,
#forgotModal .btn-primary:focus {
    border-color: #06305a;
    background: linear-gradient(135deg, #0a4a87 0%, #06305a 100%);
}

#forgotModal .btn-primary:disabled {
    opacity: .7;
}

#forgotModal .db-result {
    padding: .5rem 0 .25rem;
    text-align: center;
}

#forgotModal .db-result-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    margin-bottom: .9rem;
    border-radius: 50%;
    background: #e6f6ed;
    color: #1f9254;
    font-size: 1.8rem;
}

#forgotModal .db-result-icon.is-info {
    background: #eaf1f9;
    color: #0a4a87;
}

#forgotModal .db-result p {
    margin: 0 0 1.25rem;
    color: #45526b;
    font-size: .9rem;
    line-height: 1.55;
}

/* iti ülke listesi pencerenin dışına (body) eklenir */
.iti--container {
    z-index: 2000;
}

/* ── Form doğrulama (ui-validate.js; panelin custom.css kurallarının giriş/kayıt karşılığı) ── */
.ui-required {
    margin-left: .1rem;
    color: #d94848;
    font-weight: 700;
}

.ui-feedback {
    display: flex;
    align-items: flex-start;
    gap: .3rem;
    margin-top: .35rem;
    color: #c03a3a;
    font-size: .76rem;
    font-weight: 500;
    line-height: 1.35;
    text-align: left;
    animation: ui-feedback-in .18s ease-out;
}

.ui-feedback i {
    flex-shrink: 0;
    margin-top: .05rem;
    font-size: .9rem;
}

@keyframes ui-feedback-in {
    from { opacity: 0; transform: translateY(-3px); }
    to { opacity: 1; transform: none; }
}

#formAuth .form-control.is-invalid,
#formAuth textarea.is-invalid {
    border-color: #d94848 !important;
    background-image: none !important;
    box-shadow: 0 0 0 3px rgba(217, 72, 72, .12) !important;
}

#formAuth .input-group:has(> .is-invalid) .input-group-text {
    border-color: #d94848 !important;
}

#formAuth .input-group > .form-control.is-invalid {
    box-shadow: none !important;
}

#formAuth .input-group:has(> .is-invalid) {
    border-radius: 12px;
    box-shadow: 0 0 0 3px rgba(217, 72, 72, .12);
}

#formAuth select.is-invalid + .select2-container .select2-selection {
    border-color: #d94848 !important;
    box-shadow: 0 0 0 3px rgba(217, 72, 72, .12) !important;
}

#formAuth .form-check-input.is-invalid {
    border-color: #d94848 !important;
}

/* Şifre alanı grubunun alt boşluğu hata mesajının altına taşınır */
#formAuth .input-group.mb-4:has(+ .ui-feedback) {
    margin-bottom: 0 !important;
}

#formAuth .input-group + .ui-feedback {
    margin-bottom: 1.5rem;
}

#formAuth .form-check + .ui-feedback {
    margin: -.35rem 0 .6rem;
}

.ui-shake {
    animation: ui-shake .32s cubic-bezier(.36, .07, .19, .97);
}

@keyframes ui-shake {
    0%, 100% { transform: translateX(0); }
    20% { transform: translateX(-4px); }
    40% { transform: translateX(4px); }
    60% { transform: translateX(-3px); }
    80% { transform: translateX(2px); }
}

@media (prefers-reduced-motion: reduce) {
    .ui-shake,
    .ui-feedback {
        animation: none;
    }
}

/* ═══════════════════════════════════════════════
   KARANLIK TEMA
   ═══════════════════════════════════════════════ */
html.dark-style body {
    background: #0f141b;
}

html.dark-style .db-page {
    background:
        radial-gradient(circle at 12% 8%, rgba(74, 147, 232, .14), transparent 42%),
        radial-gradient(circle at 88% 92%, rgba(99, 102, 241, .14), transparent 45%),
        linear-gradient(160deg, #0f141b 0%, #121822 55%, #151827 100%);
}

html.dark-style .db-orb {
    opacity: .22;
}

html.dark-style .db-orb-3 {
    opacity: .1;
}

html.dark-style .db-card {
    border-color: rgba(255, 255, 255, .06);
    background: rgba(24, 30, 39, .86);
    box-shadow: 0 30px 70px -20px rgba(0, 0, 0, .6), 0 2px 6px rgba(0, 0, 0, .3), inset 0 1px 0 rgba(255, 255, 255, .04);
}

html.dark-style .db-logo-wrap svg path {
    fill: #8bbcf8 !important;
}

html.dark-style .db-card h3 {
    color: #e6ebf2;
}

html.dark-style .db-card > p {
    color: #8793a4;
}

html.dark-style #formAuth .form-label,
html.dark-style #formAuth .form-check-label,
html.dark-style #forgotModal .form-label {
    color: #b5bfcc;
}

html.dark-style #formAuth .form-control,
html.dark-style #formAuth textarea.form-control,
html.dark-style #formAuth .input-group-text,
html.dark-style #verificationModal .form-control,
html.dark-style #verificationModal .input-group-text,
html.dark-style #verificationModal .modal-body .form-control,
html.dark-style #forgotModal .form-control {
    border-color: #2a3342;
    background: #121820;
    color: #e6ebf2;
}

html.dark-style #formAuth .form-control::placeholder,
html.dark-style #verificationModal .form-control::placeholder,
html.dark-style #forgotModal .form-control::placeholder {
    color: #667285;
}

html.dark-style #formAuth .input-group-text,
html.dark-style #verificationModal .input-group-text {
    color: #8793a4;
}

html.dark-style #formAuth .form-control:focus,
html.dark-style #verificationModal .form-control:focus,
html.dark-style #forgotModal .form-control:focus {
    border-color: #4a93e8;
    box-shadow: 0 0 0 4px rgba(74, 147, 232, .18);
}

html.dark-style #formAuth .forgot_password {
    color: #74aef5;
}

html.dark-style #formAuth .forgot_password:hover,
html.dark-style #formAuth .forgot_password:focus {
    color: #a9cdfa;
}

html.dark-style .db-card .register-link,
html.dark-style .db-card .auth-link {
    color: #a5a8fb;
}

/* Telefon alanı (intl-tel-input) */
html.dark-style .iti__selected-dial-code {
    color: #e6ebf2;
}

html.dark-style .iti__arrow {
    border-top-color: #8793a4;
}

html.dark-style .iti__arrow--up {
    border-bottom-color: #8793a4;
}

html.dark-style .iti__dropdown-content,
html.dark-style .iti__country-list {
    border-color: #2a3342;
    background: #181e27;
    color: #e6ebf2;
}

html.dark-style .iti__search-input {
    border-color: #2a3342;
    background: #121820;
    color: #e6ebf2;
}

html.dark-style .iti__country.iti__highlight {
    background-color: #1e2531;
}

html.dark-style .iti__dial-code {
    color: #8793a4;
}

/* Onay kutuları (kayıt) */
html.dark-style #formAuth .form-check-input {
    border-color: #3a4658 !important;
    background-color: #121820 !important;
}

html.dark-style #formAuth .form-check-input:checked {
    border-color: #3a86e0 !important;
    background-color: #3a86e0 !important;
}

/* Select2 (kayıt) */
html.dark-style .select2-container--default .select2-selection--single,
html.dark-style .select2-container--default .select2-selection {
    border-color: #2a3342 !important;
    background: #121820 !important;
}

html.dark-style .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #e6ebf2 !important;
}

html.dark-style .select2-dropdown {
    border-color: #2a3342 !important;
    background: #181e27 !important;
    box-shadow: 0 20px 45px -12px rgba(0, 0, 0, .6) !important;
}

html.dark-style .select2-search--dropdown .select2-search__field,
html.dark-style .select2-container--default .select2-search--dropdown .select2-search__field {
    border-color: #2a3342 !important;
    background: #121820 !important;
    color: #e6ebf2 !important;
}

html.dark-style .select2-results__option {
    color: #e6ebf2;
}

/* Pencereler */
html.dark-style .modal-backdrop.show {
    background: rgba(4, 7, 12, .6);
}

html.dark-style #verificationModal .modal-content,
html.dark-style #kvkkModal .modal-content,
html.dark-style #forgotModal .modal-content {
    background: rgba(24, 30, 39, .98);
    box-shadow: 0 30px 70px -20px rgba(0, 0, 0, .65), inset 0 1px 0 rgba(255, 255, 255, .04);
}

html.dark-style #verificationModal .modal-title,
html.dark-style #kvkkModal .modal-title,
html.dark-style #kvkkModal .modal-body h1,
html.dark-style #kvkkModal .modal-body h2,
html.dark-style #kvkkModal .modal-body h3,
html.dark-style #kvkkModal .modal-body h4,
html.dark-style #kvkkModal .modal-body h5,
html.dark-style #kvkkModal .modal-body h6,
html.dark-style #forgotModal .db-modal-title {
    color: #e6ebf2;
}

html.dark-style #verificationModal .modal-body,
html.dark-style #verificationModal .modal-body .resultMessage,
html.dark-style #kvkkModal .modal-body,
html.dark-style #forgotModal .db-modal-sub,
html.dark-style #forgotModal .db-result p {
    color: #b5bfcc;
}

html.dark-style #verificationModal .btn-close,
html.dark-style #kvkkModal .btn-close,
html.dark-style #forgotModal .btn-close {
    filter: invert(1) grayscale(1);
}

html.dark-style #kvkkModal .kvkk-actions {
    border-top-color: #2a3342;
}

html.dark-style #kvkkModal .btn-secondary {
    border-color: #2a3342;
    background: #1e2531;
    color: #b5bfcc;
}

html.dark-style #kvkkModal .btn-secondary:hover {
    background: #252e3b;
    color: #e6ebf2;
}

html.dark-style #forgotModal .db-modal-icon,
html.dark-style #forgotModal .db-result-icon.is-info {
    background: rgba(94, 162, 245, .14);
    color: #8bbcf8;
}

html.dark-style #forgotModal .db-result-icon {
    background: rgba(52, 199, 120, .14);
    color: #63d69a;
}

html.dark-style #forgotModal .db-field-error {
    color: #ff9b9b;
}

html.dark-style .swal2-popup {
    background: rgba(24, 30, 39, .98) !important;
    box-shadow: 0 30px 70px -20px rgba(0, 0, 0, .65) !important;
}

html.dark-style .swal2-popup .swal2-title {
    color: #e6ebf2 !important;
}

html.dark-style .swal2-popup .swal2-html-container,
html.dark-style .swal2-popup .swal2-content {
    color: #b5bfcc !important;
}

html.dark-style .swal2-icon.swal2-success [class^=swal2-success-circular-line],
html.dark-style .swal2-icon.swal2-success .swal2-success-fix {
    background-color: #181e27 !important;
}

html.dark-style .db-theme-toggle {
    border-color: rgba(255, 255, 255, .08);
    background: rgba(24, 30, 39, .8);
    color: #b5bfcc;
}

html.dark-style .db-theme-toggle:hover {
    background: #1e2531;
    color: #f7c27d;
}

html.dark-style .ui-feedback {
    color: #ff9b9b;
}

html.dark-style .ui-required {
    color: #f07b7b;
}