@import url('../css/lingo-logo.css');
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');

/* Büyüteç — tasarım değişkenleri */
:root {
    --bu-bg: #e8edf3;
    --bu-bg-subtle: #f4f7fa;
    --bu-surface: #ffffff;
    --bu-primary: #32435e;
    --bu-primary-dark: #2a3849;
    --bu-text: #1e293b;
    --bu-text-muted: #64748b;
    --bu-border: rgba(50, 67, 94, 0.12);
    --bu-shadow: 0 4px 24px rgba(50, 67, 94, 0.08);
    --bu-shadow-lg: 0 12px 40px rgba(50, 67, 94, 0.12);
    --bu-radius: 12px;
    --bu-radius-sm: 8px;
    --bu-accent: #d97706;
    --bu-accent-soft: rgba(217, 119, 6, 0.12);
    --bu-danger: #dc2626;
    --bu-success: #059669;
    --bu-info-bg: #fffbeb;
    --bu-info-border: #fcd34d;
    --bu-info-text: #92400e;
}

/* Özel İmleç Stilleri - En Üstte */
* {
    cursor: url('../assets/slimicons/orange-pointer.svg'), auto !important;
}

*[style*="cursor: pointer"], 
*[style*="cursor:pointer"], 
a, 
button, 
input[type="button"], 
input[type="submit"], 
.clickable,
[onclick],
[role="button"] {
    cursor: url('../assets/slimicons/orange-hand-pointer.svg'), auto !important;
}

/* Evrensel Kutu Modeli */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Ana gövde */
body {
    margin: 0;
    padding: 60px 0 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
    line-height: 1.55;
    color: var(--bu-text);
    background: linear-gradient(165deg, #eef2f7 0%, var(--bu-bg) 45%, #dfe6ef 100%);
    overflow-x: hidden;
}

.buyutec-app {
    width: 100%;
    max-width: 920px;
    margin: 0 auto;
    padding: clamp(1rem, 3vw, 1.75rem) clamp(0.75rem, 3vw, 1.25rem) clamp(2.5rem, 5vw, 3.5rem);
    display: flex;
    flex-direction: column;
    gap: clamp(1rem, 2.5vw, 1.35rem);
    box-sizing: border-box;
}

/* Araç üst barı — logo ortada, site chrome (lingo-logo.css) */
.user-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 60px;
    z-index: 1000;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    padding: 8px 20px;
    box-sizing: border-box;
    max-width: none;
    margin: 0;
    background: var(--site-chrome-bg-alpha, rgba(50, 67, 94, 0.98)) !important;
    border-bottom: 1px solid var(--site-chrome-border, rgba(255, 255, 255, 0.12)) !important;
    box-shadow: var(--site-chrome-shadow, 0 2px 8px rgba(0, 0, 0, 0.18));
    color: var(--site-chrome-text, rgba(255, 255, 255, 0.88));
}

.user-header-left {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.user-header-right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    min-width: 0;
}

.user-header .logo-container-header {
    display: flex;
    align-items: center;
    justify-content: center;
    justify-self: center;
}

.user-header .header-logo-img {
    display: block;
    object-position: center;
}

.user-header #username-display {
    font-weight: 500;
    font-size: 0.9rem;
    color: var(--site-chrome-text, rgba(255, 255, 255, 0.88)) !important;
    margin: 0;
    max-width: min(220px, 36vw);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.user-header .araclarim-back,
.user-header .tool-watermark-btn {
    --tool-watermark-color: #ffffff;
    --araclarim-back-color: #ffffff;
}

/* Paneller ve çalışma alanı */
.container,
.container2,
.hold-button-wrapper,
.image-container {
    width: 100%;
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}

.buyutec-app .container,
.buyutec-app .container2 {
    margin: 0;
    padding: clamp(1.15rem, 3vw, 1.6rem);
    color: var(--bu-text);
    background: var(--bu-surface);
    border: 1px solid var(--bu-border);
    border-radius: var(--bu-radius);
    box-shadow: var(--bu-shadow);
    text-align: left;
}

.buyutec-app .container2 {
    background: var(--bu-bg-subtle);
}

.buyutec-eyebrow {
    margin: 0 0 0.35rem;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--bu-text-muted);
}

.buyutec-app .main-title {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: clamp(1.35rem, 4vw, 1.85rem);
    color: var(--bu-primary);
    text-transform: none;
    text-shadow: none;
    letter-spacing: -0.02em;
    margin: 0 0 0.5rem;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.65rem;
    line-height: 1.25;
}

.buyutec-lead {
    margin: 0 0 1.25rem;
    font-size: 0.95rem;
    color: var(--bu-text-muted);
    max-width: 42rem;
}

.title-icon {
    width: 1.75rem;
    height: 1.75rem;
    flex-shrink: 0;
    opacity: 0.85;
    filter: none;
}

.buyutec-app h3 {
    font-family: 'Poppins', sans-serif;
    color: var(--bu-primary);
    font-weight: 600;
    font-size: 1.15rem;
    margin: 0 0 1rem;
    text-transform: none;
    letter-spacing: -0.01em;
}

.buyutec-field {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.buyutec-field label {
    margin: 0;
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--bu-text-muted);
}

.buyutec-workspace {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    width: 100%;
    max-width: 920px;
    margin: 0 auto;
}

.buyutec-workspace-actions {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}

/* Form elemanları */
textarea,
.buyutec-app select {
    width: 100%;
    padding: 0.7rem 0.85rem;
    border: 1px solid var(--bu-border);
    border-radius: var(--bu-radius-sm);
    font-family: 'Poppins', sans-serif;
    font-size: 0.95rem;
    line-height: 1.5;
    margin-bottom: 0;
    box-sizing: border-box;
    color: var(--bu-text);
    background-color: var(--bu-surface);
    box-shadow: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

textarea {
    min-height: 120px;
    max-height: 260px;
    resize: vertical;
}

.buyutec-app select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%2332435e' d='M6 8L0 0h12z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.85rem center;
    padding-right: 2.25rem;
}

textarea:focus,
.buyutec-app select:focus {
    border-color: var(--bu-primary);
    outline: none;
    box-shadow: 0 0 0 3px rgba(50, 67, 94, 0.12);
}

/* Butonlar */
.buyutec-app button,
.buyutec-app .secondary-button {
    font-family: 'Poppins', sans-serif;
    text-transform: none;
    font-size: 0.9rem;
    font-weight: 600;
    padding: 0.55rem 1.1rem;
    border: 1px solid transparent;
    border-radius: var(--bu-radius-sm);
    box-shadow: none;
    background-color: var(--bu-primary);
    color: #fff;
    cursor: url('../assets/slimicons/orange-hand-pointer.svg'), auto !important;
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    text-align: center;
    text-decoration: none;
    min-width: auto;
    transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}

.buyutec-app button:hover,
.buyutec-app .secondary-button:hover {
    background-color: var(--bu-primary-dark);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(50, 67, 94, 0.2);
}

.buyutec-app button:active,
.buyutec-app .secondary-button:active {
    transform: translateY(0);
    box-shadow: none;
}

#speechToggle {
    background-color: var(--bu-accent);
    color: #fff;
}
#speechToggle.recognizing {
    background-color: var(--bu-danger);
    color: #fff;
}

.buyutec-app .btn-muted,
#clearAll {
    background-color: #94a3b8;
    color: #fff;
}
.buyutec-app .btn-muted:hover,
#clearAll:hover {
    background-color: #64748b;
}

.analysis-controls .analyze-button {
    background-color: var(--bu-primary);
}
.analysis-controls .analyze-button:hover {
    background-color: var(--bu-primary-dark);
}

.buyutec-app .btn-secondary,
.secondary-button {
    background-color: var(--bu-surface);
    color: var(--bu-primary);
    border: 1px solid var(--bu-border);
}
.buyutec-app .btn-secondary:hover,
.secondary-button:hover {
    background-color: var(--bu-bg-subtle);
    color: var(--bu-primary-dark);
    box-shadow: 0 2px 8px rgba(50, 67, 94, 0.1);
}

#holdButton {
    padding: 0.85rem 1.5rem;
    font-size: 1rem;
    border-radius: var(--bu-radius-sm);
    background-color: var(--bu-danger);
    color: #fff;
    user-select: none;
    -webkit-user-select: none;
}
#holdButton:active {
    background-color: #b91c1c;
}

#showModalButton {
    font-size: 0.85rem;
    padding: 0.5rem 1rem;
    background-color: var(--bu-bg-subtle);
    color: var(--bu-primary);
    border: 1px solid var(--bu-border);
}

.show-speech-button {
    width: 100%;
    margin: 1rem 0 0;
    padding: 0.65rem 1rem;
    font-size: 0.9rem;
    background: var(--bu-bg-subtle);
    color: var(--bu-primary);
    border: 1px dashed var(--bu-border);
    border-radius: var(--bu-radius-sm);
    box-shadow: none;
    display: block;
}
.show-speech-button:hover {
    background: var(--bu-accent-soft);
    border-color: var(--bu-accent);
    color: var(--bu-primary-dark);
}
.show-speech-button.active {
    background: var(--bu-primary);
    color: #fff;
    border-style: solid;
}

/* Büyüteç çalışma alanı */
.image-container {
    position: relative;
    margin: 0;
    border: 1px solid var(--bu-border);
    border-radius: var(--bu-radius);
    overflow: hidden;
    box-shadow: var(--bu-shadow-lg);
    background: linear-gradient(145deg, #f8fafc 0%, #eef2f7 100%);
    width: 100%;
    max-width: 920px;
    aspect-ratio: 16 / 9;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: min(52vh, 420px);
    cursor: none !important;
}

/* Image container içindeki tüm elementler için imleci gizle */
.image-container * {
    cursor: none !important;
}

/* Resim */
#zoomableImage {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    cursor: none !important;
    border-radius: 0;
    touch-action: none; /* Kaydırma gibi varsayılan dokunma eylemlerini engelle */
    object-fit: contain; /* Resmi konteyner içinde tam olarak göster */
    object-position: center; /* Resmi merkeze hizala */
}

#magnifier {
    position: absolute;
    pointer-events: none;
    width: min(280px, 42vw);
    height: min(280px, 42vw);
    border: 3px solid var(--bu-accent);
    border-radius: 50%;
    display: none;
    background-color: rgba(255, 255, 255, 0.75);
    background-repeat: no-repeat;
    box-shadow: 0 8px 32px rgba(50, 67, 94, 0.25), inset 0 0 0 1px rgba(255, 255, 255, 0.5);
    cursor: none !important;
}

.buyutec-app label:not(.info-box__toggle) {
    display: block;
    font-family: 'Poppins', sans-serif;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--bu-text-muted);
    margin: 0 0 0.35rem;
    text-align: left;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.buyutec-analysis-output,
#wordAnalysisLabel {
    display: block;
    font-family: 'Poppins', sans-serif;
    font-size: 0.92rem;
    color: var(--bu-text);
    background: var(--bu-bg-subtle);
    padding: 1rem 1.1rem;
    border: 1px solid var(--bu-border);
    border-radius: var(--bu-radius-sm);
    white-space: pre-wrap;
    text-align: left;
    word-wrap: break-word;
    margin-top: 1rem;
    line-height: 1.65;
    min-height: 2.5rem;
}
#wordAnalysisLabel strong {
    color: var(--bu-danger);
    font-weight: 600;
}

/* Bilgi kutusu */
.buyutec-app .info-box.important-notes {
    margin: 0 0 1rem;
    padding: 0;
    border: 1px solid var(--bu-info-border);
    border-radius: var(--bu-radius-sm);
    background: var(--bu-info-bg);
    font-size: 0.88rem;
    overflow: hidden;
}

.info-box__toggle {
    margin: 0;
    padding: 0.85rem 2.5rem 0.85rem 1rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--bu-info-text);
    cursor: pointer;
    position: relative;
    user-select: none;
    border-bottom: 1px solid transparent;
    transition: background 0.2s ease;
}
.info-box__toggle:hover {
    background: rgba(252, 211, 77, 0.25);
}
.info-box.is-open .info-box__toggle {
    border-bottom-color: var(--bu-info-border);
}

.info-box__toggle .toggle-icon {
    position: absolute;
    right: 0.85rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.25rem;
    line-height: 1;
    font-weight: 400;
}

.info-box__content {
    display: none;
    margin: 0;
    padding: 0.75rem 1.1rem 1rem;
    padding-left: 1.35rem;
    list-style: disc;
    color: var(--bu-info-text);
}
.info-box__content li {
    margin-bottom: 0.45rem;
}
.info-box__content ul {
    margin: 0.35rem 0 0.5rem;
    padding-left: 1.15rem;
}
.info-box__footer {
    margin-top: 0.65rem;
    padding-top: 0.65rem;
    border-top: 1px solid var(--bu-info-border);
    list-style: none;
}
.info-box__footer a {
    color: var(--bu-primary);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.buyutec-speech {
    margin-top: 0.5rem;
    padding-top: 1rem;
    border-top: 1px solid var(--bu-border);
}

.buyutec-app .button-group {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.65rem;
}

.buyutec-app .analysis-controls {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.65rem 0.75rem;
    align-items: end;
    margin-bottom: 0.5rem;
}
.buyutec-app .analysis-controls label {
    grid-column: 1 / -1;
}

.buyutec-app .message-box {
    padding: 0.85rem 1rem;
    border-radius: var(--bu-radius-sm);
    background: var(--bu-accent-soft);
    border: 1px solid rgba(217, 119, 6, 0.25);
    color: var(--bu-primary);
    font-size: 0.9rem;
    text-align: center;
    min-height: 0;
}
.buyutec-app .message-box:empty {
    display: none;
}

/* Modal Stili */
.modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(52, 76, 100, 0.8); /* Dark Blue/Gray overlay */
    padding: 20px;
    box-sizing: border-box;
}

.modal-content {
    background-color: var(--bu-surface);
    color: var(--bu-text);
    margin: 5% auto;
    padding: clamp(1.25rem, 4vw, 2rem);
    border: 1px solid var(--bu-border);
    border-radius: var(--bu-radius);
    width: 90%;
    max-width: 720px;
    box-shadow: var(--bu-shadow-lg);
    position: relative;
}

.close-button {
    font-family: 'Poppins', sans-serif;
    color: var(--bu-text-muted);
    background-color: var(--bu-bg-subtle);
    border: 1px solid var(--bu-border);
    border-radius: 50%;
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    font-size: 1.35rem;
    font-weight: 600;
    line-height: 1;
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: url('../assets/slimicons/orange-hand-pointer.svg'), auto !important;
    box-shadow: none;
}

.close-button:hover {
    background-color: #fee2e2;
    color: var(--bu-danger);
    border-color: rgba(220, 38, 38, 0.3);
}

.close-button:focus {
    outline: 2px solid var(--bu-primary);
    outline-offset: 2px;
}

.modal-content h2 {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    color: var(--bu-primary);
    text-transform: none;
    font-size: 1.35rem;
    margin: 0 2rem 0.75rem 0;
}
.modal-content h3 {
    font-family: 'Poppins', sans-serif;
    color: var(--bu-primary);
    font-weight: 600;
    font-size: 1.05rem;
    margin-top: 1.25rem;
    margin-bottom: 0.5rem;
    text-transform: none;
}

/* Modal Liste Madde İşareti */
.modal-content ul li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.6em;
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 8px solid #f8af0d; /* Palette Orange/Yellow bullet */
}

/* Modal Vurgu */
.modal-content strong {
    color: #e7262d; /* Palette Red */
    font-weight: 700;
}

/* Analiz tabloları */
.table-container {
    margin: 1.25rem auto;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    background-color: var(--bu-surface);
    border: 1px solid var(--bu-border);
    border-radius: var(--bu-radius-sm);
    padding: 0.75rem;
    box-sizing: border-box;
    box-shadow: var(--bu-shadow);
}

table {
    width: 100%;
    min-width: 500px;
    border-collapse: collapse;
    color: var(--bu-text);
}

th, td {
    padding: 0.65rem 0.75rem;
    text-align: center;
    border: 1px solid var(--bu-border);
    font-size: 0.9rem;
    vertical-align: middle;
    font-family: 'Poppins', sans-serif;
    background-color: var(--bu-surface);
}

th {
    background-color: var(--bu-primary);
    color: #fff;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0.02em;
}

tr:nth-child(even) td {
    background-color: var(--bu-bg-subtle);
}

.highlighted, td span[style*="color: red"] {
    color: var(--bu-danger) !important;
    font-weight: 600;
}

.statistics {
    background-color: var(--bu-bg-subtle);
    padding: 1rem 1.15rem;
    border: 1px solid var(--bu-border);
    border-radius: var(--bu-radius-sm);
    margin-top: 1rem;
    text-align: left;
    line-height: 1.7;
    font-family: 'Poppins', sans-serif;
    box-shadow: none;
}

.statistics strong {
    color: var(--bu-primary);
    font-weight: 600;
}

/* Yeni Buton Konteyneri */
.hold-button-wrapper {
    text-align: center;
    margin-top: 25px;
    margin-bottom: 15px;
}

/* Yeni Rapor Hazırlama/Yazdırma Butonu */
#preparePdfButton {
    margin-top: 1rem;
    background-color: var(--bu-primary);
    color: #fff;
    border: none;
    box-shadow: var(--bu-shadow);
}
#preparePdfButton:hover {
    background-color: var(--bu-primary-dark);
}

/* --- Responsive Stiller --- */

@media (max-width: 992px) {
    h1 { font-size: 2.8em; }
    button { font-size: 1.1em; padding: 9px 22px; }
    #holdButton { font-size: 1.3em; padding: 11px 28px; }
    .modal-content { max-width: 650px; padding: 25px 30px; }
    .close-button { width: 35px; height: 35px; line-height: 30px; font-size: 24px; top: -12px; right: -12px; }
    #magnifier { width: 160px; height: 160px; }
    .image-container {
        width: 95vw;
        aspect-ratio: 4/3;
        min-height: 350px;
        cursor: none !important; /* İmleci gizle */
    }
    
    .image-container * {
        cursor: none !important;
    }
}

@media (max-width: 768px) {
    body { padding: 0 10px; }
     h1 { font-size: 2.5em; }
     h3 { font-size: 1.3em; }
     button { font-size: 1em; padding: 8px 18px; min-width: 120px; }
     #holdButton { font-size: 1.2em; padding: 10px 25px; min-width: 180px; }
     textarea, select { font-size: 0.95em; }
     label { font-size: 1em; }
    .image-container {
         min-height: 300px;
         cursor: none !important; /* İmleci gizle */
    }
    
    .image-container * {
        cursor: none !important;
    }
    #magnifier { width: 140px; height: 140px; }
     .modal-content h2 { font-size: 1.8em; }
     .modal-content h3 { font-size: 1.2em; }
     .modal-content p, .modal-content li { font-size: 0.95em; }
     .close-button { width: 35px; height: 35px; line-height: 30px; font-size: 24px; top: -12px; right: -12px;}
    th, td { font-size: 0.9em; padding: 8px 10px; }
    table { min-width: 400px; }
    .statistics { padding: 12px 15px; }
    
    body {
        padding-top: 56px;
    }

    .user-header {
        height: 56px;
        padding: 8px 12px;
    }

    .user-header #username-display {
        font-size: 0.82rem;
        max-width: min(160px, 42vw);
    }

}

@media (max-width: 576px) {
    body { padding: 0 5px; }
    h1 { font-size: 2em; }
    h3 { font-size: 1.2em; }
     button, #clearAll, .analysis-controls .analyze-button, #holdButton, #showModalButton {
        width: 100%;
        margin: 5px 0;
        font-size: 1.1em;
        padding: 10px 20px;
    }
    .button-group { flex-direction: column; }
    
    #magnifier { width: 110px; height: 110px; border-width: 4px; }
    .modal-content { padding: 15px 20px; }
    .modal-content h2 { font-size: 1.6em; }
    .modal-content h3 { font-size: 1.1em; }
    .close-button { width: 30px; height: 30px; line-height: 26px; font-size: 20px; border-width: 2px; top: -10px; right: -10px;}
    label { font-size: 0.95em; }
    select, textarea { font-size: 0.9em; }
    th, td { font-size: 0.85em; padding: 6px 8px; border-width: 1px; }
    .statistics { font-size: 0.9em; line-height: 1.6; padding: 10px 12px; }
    .hold-button-wrapper { margin: 10px auto 10px auto; }
    
    .user-header #username-display {
        font-size: 0.75rem;
        max-width: min(120px, 38vw);
    }
}

/* Footer Stilleri (Tam genişlik için ayarlar) */
footer {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    margin-top: 40px; /* Üstteki elemanla boşluk */
    box-sizing: border-box; /* Padding'in genişliği etkilememesi için */
    /* Footer içeriği için padding ../css/footer.css içinde olabilir veya buraya eklenebilir */
    /* Örneğin: padding-left: 10px; padding-right: 10px; */
}

/* --- Splash Screen Modernized --- */
.splash-screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #f6f8fb 0%, #e2e8f0 100%);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.6s;
}

.splash-screen.fade-out {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.splash-content {
    text-align: center;
    animation: splashEntrance 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes splashEntrance {
    from {
        opacity: 0;
        transform: scale(0.9) translateY(20px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.splash-logo {
    margin-bottom: 20px;
    display: inline-block;
}

.splash-logo .logo-circle {
    width: 100px;
    height: 100px;
    background: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 25px rgba(52, 76, 100, 0.15);
    position: relative;
    overflow: hidden;
}

.logo-inner {
    position: relative;
    z-index: 2;
}

.logo-icon {
    width: 50px;
    height: 50px;
    object-fit: contain;
}

.splash-title {
    margin-bottom: 30px;
}

.title-main {
    font-family: 'Oswald', sans-serif;
    font-size: 2.5rem;
    color: #344c64;
    margin: 0 0 10px 0;
    letter-spacing: -0.5px;
    text-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.title-subtitle {
    font-size: 1.1rem;
    color: #6b7280;
    margin: 0;
    font-weight: 400;
}

.splash-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
}

.loading-spinner {
    width: 40px;
    height: 40px;
    border: 3px solid rgba(52, 76, 100, 0.1);
    border-radius: 50%;
    border-top-color: #344c64;
    animation: spin 1s linear infinite;
}

.loading-text {
    font-size: 0.9rem;
    color: #577399;
    font-weight: 500;
    letter-spacing: 1px;
    text-transform: uppercase;
    animation: pulseText 2s infinite ease-in-out;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

@keyframes pulseText {
    0%, 100% { opacity: 0.6; }
    50% { opacity: 1; }
}

    /* Parçacıklar kaldırıldı - minimal tasarım için */
    .particles {
        display: none;
    }

    /* Animasyonlar */
    @keyframes fadeInUp {
        from { opacity: 0; transform: translateY(30px); }
        to { opacity: 1; transform: translateY(0); }
    }

    @keyframes gradientShift {
        0% { background-position: 0% 50%; }
        50% { background-position: 100% 50%; }
        100% { background-position: 0% 50%; }
    }

    @keyframes backgroundPulse {
        0%, 100% { opacity: 0.3; }
        50% { opacity: 0.6; }
    }

    @keyframes logoGradientShift {
        0% { background-position: 0% 50%; }
        50% { background-position: 100% 50%; }
        100% { background-position: 0% 50%; }
    }

    @keyframes logoRotate {
        0% { transform: rotate(0deg); }
        100% { transform: rotate(360deg); }
    }

    @keyframes logoGlow {
        0%, 100% { opacity: 0.2; transform: scale(1); }
        50% { opacity: 0.4; transform: scale(1.1); }
    }

    @keyframes logoIconScale {
        0%, 100% { transform: scale(1); }
        50% { transform: scale(1.1); }
    }

    @keyframes logoIconGlow {
        0%, 100% { filter: drop-shadow(0 0 20px rgba(52, 76, 100, 0.4)); }
        50% { filter: drop-shadow(0 0 30px rgba(52, 76, 100, 0.7)); }
    }

    @keyframes logoFloat {
        0%, 100% { transform: translateY(0px); }
        50% { transform: translateY(-10px); }
    }

    @keyframes logoPulse {
        0%, 100% { transform: scale(1); }
        50% { transform: scale(1.05); }
    }

    @keyframes logoRing {
        0% { transform: scale(1); opacity: 0.3; }
        50% { transform: scale(1.1); opacity: 0.1; }
        100% { transform: scale(1.2); opacity: 0; }
    }

    @keyframes titleGradientShift {
        0% { background-position: 0% 50%; }
        50% { background-position: 100% 50%; }
        100% { background-position: 0% 50%; }
    }

    @keyframes titleGlow {
        from { 
            text-shadow: 0 0 20px rgba(255, 255, 255, 0.4), 0 0 40px rgba(255, 255, 255, 0.2);
            filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.6)) drop-shadow(0 0 20px rgba(255, 255, 255, 0.3));
        }
        to { 
            text-shadow: 0 0 40px rgba(255, 255, 255, 0.8), 0 0 80px rgba(255, 255, 255, 0.5);
            filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.6)) drop-shadow(0 0 50px rgba(255, 255, 255, 0.6));
        }
    }

    @keyframes subtitleFade {
        from { opacity: 0.7; }
        to { opacity: 1; }
    }

    @keyframes spin {
        0% { transform: rotate(0deg); }
        100% { transform: rotate(360deg); }
    }

    @keyframes spinnerGlow {
        0%, 100% { box-shadow: 0 0 20px rgba(248, 175, 13, 0.3); }
        50% { box-shadow: 0 0 30px rgba(248, 175, 13, 0.6); }
    }

    @keyframes loadingPulse {
        0%, 100% { opacity: 0.6; }
        50% { opacity: 1; }
    }

    /* Parçacık Animasyonları */
    @keyframes particleFloat1 {
        0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.6; }
        25% { transform: translate(20px, -30px) scale(1.2); opacity: 1; }
        50% { transform: translate(-10px, -50px) scale(0.8); opacity: 0.8; }
        75% { transform: translate(30px, -20px) scale(1.1); opacity: 0.9; }
    }

    @keyframes particleFloat2 {
        0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.5; }
        33% { transform: translate(-25px, 20px) scale(1.3); opacity: 1; }
        66% { transform: translate(15px, -40px) scale(0.7); opacity: 0.7; }
    }

    @keyframes particleFloat3 {
        0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.4; }
        20% { transform: translate(40px, -25px) scale(1.4); opacity: 0.9; }
        40% { transform: translate(-20px, -60px) scale(0.6); opacity: 0.6; }
        60% { transform: translate(25px, 15px) scale(1.1); opacity: 0.8; }
        80% { transform: translate(-35px, -10px) scale(0.9); opacity: 0.7; }
    }

    @keyframes particleFloat4 {
        0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.7; }
        30% { transform: translate(-30px, -35px) scale(1.2); opacity: 1; }
        60% { transform: translate(20px, -20px) scale(0.8); opacity: 0.5; }
        90% { transform: translate(-15px, 25px) scale(1.1); opacity: 0.8; }
    }

    @keyframes particleFloat5 {
        0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.6; }
        25% { transform: translate(35px, -15px) scale(1.3); opacity: 0.9; }
        50% { transform: translate(-25px, -45px) scale(0.7); opacity: 0.4; }
        75% { transform: translate(15px, 30px) scale(1.0); opacity: 0.8; }
    }

    @keyframes particleFloat6 {
        0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.5; }
        40% { transform: translate(-20px, -30px) scale(1.1); opacity: 0.8; }
        80% { transform: translate(30px, -10px) scale(0.9); opacity: 0.6; }
    }

    /* Responsive Tasarım */
    @media (max-width: 768px) {     
        .splash-content { padding: 0 2rem; }
        .logo-circle { width: 140px; height: 140px; }
        .logo-inner { width: 90px; height: 90px; }
        .logo-icon { width: 3.5rem; height: 3.5rem; }
        .title-main { font-size: 3.2rem; letter-spacing: 1px; }
        .title-subtitle { font-size: 1.1rem; }
        .loading-spinner { width: 45px; height: 45px; }
        .loading-text { font-size: 1rem; }
    }

    @media (max-width: 480px) {      
        .splash-content { padding: 0 1rem; }
        .logo-circle { width: 120px; height: 120px; }
        .logo-inner { width: 80px; height: 80px; }
        .logo-icon { width: 3rem; height: 3rem; }
        .title-main { font-size: 2.8rem; letter-spacing: 1px; }
        .title-subtitle { font-size: 1rem; }
        .splash-logo { margin-bottom: 1.5rem; }
        .splash-title { margin-bottom: 1.5rem; }
        .loading-spinner { width: 40px; height: 40px; }
        .loading-text { font-size: 0.9rem; }
    }