@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&family=Nunito:wght@400;600;700&display=swap');

body[data-theme="kitty"] {
    --bg-color: #FFF5F7;
    --container-bg: #FFF5F7;
    --header-bg: #FFB6C1;
    --header-text: #4B2E2E;
    --text-color: #4B2E2E;
    --border-color: #FFC0CB;
    --day-bg: #FFF5F7;
    --accent-color: #FF4D6D;
    --accent-glow: rgba(255, 77, 109, 0.12);
    --button-bg: #FFB6C1;
    --button-hover: #FFC0CB;
    --progress-bg: #F3F4F6;
    --progress-fill: #FF4D6D;
    --pomodoro-bg: #FFF5F7;
    --pomodoro-accent: #FF4D6D;
    --task-bg: #FFF5F7;
    --task-completed-bg: #F3F4F6;
    --theme-controls-bg: #FFF5F7;
    --countdown-bg: #FFF5F7;
    --countdown-fill: #FF4D6D;
    --instagram-bg: #FFB6C1;
    font-family: "Poppins", "Nunito", sans-serif;
    color: #4B2E2E;
    background:
        radial-gradient(circle at top left, rgba(255, 182, 193, 0.22) 0, transparent 22%),
        radial-gradient(circle at bottom right, rgba(255, 192, 203, 0.18) 0, transparent 20%),
        #FFF5F7;
    overflow-x: hidden;
}

body[data-theme="kitty"]::before,
body[data-theme="kitty"]::after {
    content: "";
    position: fixed;
    inset: auto;
    pointer-events: none;
    z-index: 0;
    border-radius: 999px;
    background: rgba(255, 182, 193, 0.14);
    filter: blur(2px);
}

body[data-theme="kitty"]::before {
    width: 120px;
    height: 120px;
    top: 7%;
    left: 3%;
}

body[data-theme="kitty"]::after {
    width: 84px;
    height: 84px;
    right: 5%;
    bottom: 8%;
}

body[data-theme="kitty"],
body[data-theme="kitty"] * {
    box-sizing: border-box;
}

body[data-theme="kitty"] .container,
body[data-theme="kitty"] header,
body[data-theme="kitty"] .quote-container,
body[data-theme="kitty"] #yks-countdown-container,
body[data-theme="kitty"] .subject-reminder-banner,
body[data-theme="kitty"] .study-insight-card,
body[data-theme="kitty"] .day-cell,
body[data-theme="kitty"] .theme-controls,
body[data-theme="kitty"] .auth-section,
body[data-theme="kitty"] .pomodoro-content,
body[data-theme="kitty"] .notes-modal-content,
body[data-theme="kitty"] .support-modal-content,
body[data-theme="kitty"] #profile-modal .profile-modal-content,
body[data-theme="kitty"] .notes-editor-panel,
body[data-theme="kitty"] .notes-list-panel,
body[data-theme="kitty"] .support-compose-panel,
body[data-theme="kitty"] .support-messages-panel,
body[data-theme="kitty"] .support-section,
body[data-theme="kitty"] .profile-avatar-section,
body[data-theme="kitty"] .profile-stat-card,
body[data-theme="kitty"] .profile-title-card,
body[data-theme="kitty"] .profile-note-card,
body[data-theme="kitty"] .support-message-card {
    background: #FFF5F7 !important;
    border: 1px solid rgba(255, 192, 203, 0.82) !important;
    border-radius: 24px !important;
    box-shadow: 0 14px 28px rgba(75, 46, 46, 0.05) !important;
    color: #4B2E2E !important;
}

body[data-theme="kitty"] .container {
    max-width: 100%;
    overflow-x: hidden;
    border-radius: 24px;
    box-shadow: 0 18px 42px rgba(75, 46, 46, 0.06) !important;
}

body[data-theme="kitty"] header {
    position: relative;
    overflow: hidden;
    background: linear-gradient(180deg, #FFB6C1 0%, #FFF5F7 100%) !important;
}

body[data-theme="kitty"] header::after {
    content: "";
    position: absolute;
    top: 18px;
    right: 18px;
    width: 58px;
    height: 32px;
    pointer-events: none;
    background:
        radial-gradient(circle at 24% 50%, rgba(255, 77, 109, 0.22) 0 36%, transparent 37%),
        radial-gradient(circle at 76% 50%, rgba(255, 77, 109, 0.22) 0 36%, transparent 37%),
        radial-gradient(circle at 50% 50%, rgba(255, 77, 109, 0.26) 0 13%, transparent 14%);
}

body[data-theme="kitty"] .quote-container,
body[data-theme="kitty"] #yks-countdown-container {
    background: linear-gradient(180deg, rgba(255, 182, 193, 0.18) 0%, #FFF5F7 100%) !important;
}

body[data-theme="kitty"] h1,
body[data-theme="kitty"] h2,
body[data-theme="kitty"] h3,
body[data-theme="kitty"] .support-titlebox h2,
body[data-theme="kitty"] .notes-panel-header h3,
body[data-theme="kitty"] #profile-modal .profile-modal-header h2 {
    color: #4B2E2E !important;
    font-family: "Poppins", "Nunito", sans-serif;
    font-weight: 600;
    letter-spacing: -0.01em;
}

body[data-theme="kitty"] .quote-text,
body[data-theme="kitty"] .quote-author,
body[data-theme="kitty"] .profile-member-since,
body[data-theme="kitty"] .support-modal-subtitle,
body[data-theme="kitty"] .support-card-meta,
body[data-theme="kitty"] .support-message-body,
body[data-theme="kitty"] .support-reply-text,
body[data-theme="kitty"] .notes-panel-header p,
body[data-theme="kitty"] .profile-title-card p,
body[data-theme="kitty"] .profile-note-card .note-card-content,
body[data-theme="kitty"] .header-stats > span,
body[data-theme="kitty"] .subject-hint {
    color: #4B2E2E !important;
}

body[data-theme="kitty"] button,
body[data-theme="kitty"] .profile-chip,
body[data-theme="kitty"] #instagram-link,
body[data-theme="kitty"] .leaderboard-tab {
    min-height: 44px;
    border: none !important;
    border-radius: 999px !important;
    background: #FFB6C1 !important;
    color: #4B2E2E !important;
    box-shadow: 0 10px 22px rgba(75, 46, 46, 0.05) !important;
    transition: transform 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

body[data-theme="kitty"] button:hover,
body[data-theme="kitty"] .profile-chip:hover,
body[data-theme="kitty"] #instagram-link:hover,
body[data-theme="kitty"] .leaderboard-tab:hover {
    background: #FFC0CB !important;
    transform: scale(1.03);
    box-shadow: 0 12px 24px rgba(75, 46, 46, 0.07) !important;
}

body[data-theme="kitty"] .theme-button {
    min-width: 44px;
    min-height: 44px;
    border-radius: 18px !important;
    background: #FFF5F7 !important;
    color: #4B2E2E !important;
}

body[data-theme="kitty"] .theme-button.active,
body[data-theme="kitty"] .leaderboard-tab.active,
body[data-theme="kitty"] .support-pill.unread,
body[data-theme="kitty"] .support-pill.private {
    background: #FFC0CB !important;
    color: #4B2E2E !important;
}

body[data-theme="kitty"] #support-submit-btn,
body[data-theme="kitty"] #save-btn,
body[data-theme="kitty"] #start-pause-btn,
body[data-theme="kitty"] #profile-save-btn,
body[data-theme="kitty"] #my-note-save-btn,
body[data-theme="kitty"] #leaderboard-toggle-btn {
    background: #FF4D6D !important;
    color: #FFF5F7 !important;
}

body[data-theme="kitty"] #support-submit-btn:hover,
body[data-theme="kitty"] #save-btn:hover,
body[data-theme="kitty"] #start-pause-btn:hover,
body[data-theme="kitty"] #profile-save-btn:hover,
body[data-theme="kitty"] #my-note-save-btn:hover,
body[data-theme="kitty"] #leaderboard-toggle-btn:hover {
    background: #FFB6C1 !important;
    color: #4B2E2E !important;
}

body[data-theme="kitty"] .profile-field-group input,
body[data-theme="kitty"] .profile-field-group textarea,
body[data-theme="kitty"] .profile-track-select,
body[data-theme="kitty"] .support-compose-fields textarea,
body[data-theme="kitty"] .support-reply-box textarea,
body[data-theme="kitty"] .notes-editor-fields input,
body[data-theme="kitty"] .notes-editor-fields textarea,
body[data-theme="kitty"] .question-input-box input,
body[data-theme="kitty"] .pomodoro-time-inputs input {
    max-width: 100%;
    min-height: 48px;
    border-radius: 18px !important;
    border: 1px solid rgba(255, 192, 203, 0.92) !important;
    background: #FFF5F7 !important;
    color: #4B2E2E !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92);
}

body[data-theme="kitty"] .header-controls,
body[data-theme="kitty"] .header-stats,
body[data-theme="kitty"] .subject-reminder-actions,
body[data-theme="kitty"] .study-insight-controls,
body[data-theme="kitty"] .support-card-actions,
body[data-theme="kitty"] .timer-controls,
body[data-theme="kitty"] .notes-editor-actions,
body[data-theme="kitty"] .profile-modal-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

body[data-theme="kitty"] .header-stats > span {
    white-space: normal;
    border-radius: 999px;
    background: #FFF5F7 !important;
}

body[data-theme="kitty"] .main-content,
body[data-theme="kitty"] #schedule-container,
body[data-theme="kitty"] .schedule-grid,
body[data-theme="kitty"] .study-insight-card,
body[data-theme="kitty"] .pomodoro-content,
body[data-theme="kitty"] .notes-modal-content,
body[data-theme="kitty"] .support-modal-content,
body[data-theme="kitty"] #profile-modal .profile-modal-content {
    max-width: 100%;
    overflow-x: hidden !important;
}

body[data-theme="kitty"] .study-insight-card {
    width: min(1120px, calc(100% - 24px)) !important;
    padding: 18px 18px 16px !important;
}

body[data-theme="kitty"] .week-nav {
    gap: 12px !important;
    background: linear-gradient(180deg, rgba(255, 182, 193, 0.18) 0%, #FFF5F7 100%) !important;
}

body[data-theme="kitty"] .week-nav h3 {
    font-size: clamp(18px, 5vw, 28px) !important;
    color: #4B2E2E !important;
    text-shadow: none !important;
    overflow-wrap: anywhere;
}

body[data-theme="kitty"] .pomodoro-content {
    width: min(100%, 620px) !important;
    max-width: 100%;
    padding: clamp(20px, 4vw, 32px) !important;
    border-radius: 28px !important;
    background: #FFF5F7 !important;
    box-shadow: 0 18px 34px rgba(75, 46, 46, 0.07) !important;
}

body[data-theme="kitty"] .pomodoro-content h2 {
    padding: 0 54px 0 0 !important;
    margin-bottom: 16px !important;
    font-size: clamp(18px, 5vw, 28px) !important;
    color: #FF4D6D !important;
    text-shadow: none !important;
}

body[data-theme="kitty"] .pomodoro-close-btn {
    top: 14px !important;
    right: 14px !important;
    width: 44px !important;
    height: 44px !important;
    border-radius: 16px !important;
    background: #FFC0CB !important;
    color: #4B2E2E !important;
    box-shadow: 0 10px 20px rgba(75, 46, 46, 0.05) !important;
}

body[data-theme="kitty"] .pomodoro-time-inputs {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px !important;
    align-items: stretch;
    max-width: 100%;
    margin-bottom: 16px !important;
}

body[data-theme="kitty"] .pomodoro-time-inputs span {
    display: none !important;
}

body[data-theme="kitty"] .pomodoro-time-inputs input {
    width: 100% !important;
    min-width: 0 !important;
    padding: 12px 10px !important;
    font-size: clamp(14px, 4vw, 16px) !important;
}

body[data-theme="kitty"] .timer-display {
    margin: 14px 0 10px !important;
    font-size: clamp(34px, 12vw, 72px) !important;
    line-height: 0.95 !important;
    letter-spacing: -0.03em !important;
    color: #FF4D6D !important;
    text-shadow: none !important;
    overflow-wrap: anywhere;
}

body[data-theme="kitty"] .timer-controls {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px !important;
    align-items: stretch;
    margin-top: 18px !important;
}

body[data-theme="kitty"] .timer-controls > div,
body[data-theme="kitty"] .timer-controls > div button,
body[data-theme="kitty"] .timer-controls button {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 48px !important;
    height: auto !important;
    position: static !important;
}

body[data-theme="kitty"] .timer-controls button {
    font-size: clamp(14px, 4vw, 16px) !important;
    padding: 12px 14px !important;
}

body[data-theme="kitty"] .notes-list,
body[data-theme="kitty"] .support-messages-list,
body[data-theme="kitty"] #profile-modal .profile-notes-list,
body[data-theme="kitty"] #profile-modal .profile-titles-list {
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 182, 193, 0.9) transparent;
}

body[data-theme="kitty"] .notes-list::-webkit-scrollbar,
body[data-theme="kitty"] .support-messages-list::-webkit-scrollbar,
body[data-theme="kitty"] #profile-modal .profile-notes-list::-webkit-scrollbar,
body[data-theme="kitty"] #profile-modal .profile-titles-list::-webkit-scrollbar {
    width: 8px;
}

body[data-theme="kitty"] .notes-list::-webkit-scrollbar-thumb,
body[data-theme="kitty"] .support-messages-list::-webkit-scrollbar-thumb,
body[data-theme="kitty"] #profile-modal .profile-notes-list::-webkit-scrollbar-thumb,
body[data-theme="kitty"] #profile-modal .profile-titles-list::-webkit-scrollbar-thumb {
    background: rgba(255, 182, 193, 0.9);
    border-radius: 999px;
}

body[data-theme="kitty"] .support-card-actions button,
body[data-theme="kitty"] .notes-editor-actions button,
body[data-theme="kitty"] .profile-modal-actions button {
    flex: 1 1 160px;
}

body[data-theme="kitty"] .support-card-top,
body[data-theme="kitty"] .note-card-footer {
    gap: 10px;
}

body[data-theme="kitty"] .day-cell {
    min-height: 420px;
}

body[data-theme="kitty"] .countdown-value strong {
    color: #FF4D6D !important;
}

body[data-theme="kitty"] .countdown-circle-fill {
    stroke: #FF4D6D !important;
}

body[data-theme="kitty"] .countdown-circle-bg {
    stroke: #F3F4F6 !important;
}

@media (max-width: 768px) {
    body[data-theme="kitty"] .main-content {
        padding: 0 12px 16px 12px !important;
    }

    body[data-theme="kitty"] .header-controls > *,
    body[data-theme="kitty"] .subject-reminder-actions > *,
    body[data-theme="kitty"] .study-insight-controls > *,
    body[data-theme="kitty"] .support-card-actions > *,
    body[data-theme="kitty"] .notes-editor-actions > *,
    body[data-theme="kitty"] .profile-modal-actions > * {
        width: 100%;
    }

    body[data-theme="kitty"] .study-insight-card,
    body[data-theme="kitty"] .subject-reminder-banner,
    body[data-theme="kitty"] .quote-container,
    body[data-theme="kitty"] #yks-countdown-container,
    body[data-theme="kitty"] .notes-modal-content,
    body[data-theme="kitty"] .support-modal-content,
    body[data-theme="kitty"] #profile-modal .profile-modal-content {
        padding: 16px !important;
    }

    body[data-theme="kitty"] .day-cell {
        min-height: 360px;
        padding: 12px 10px !important;
    }
}

@media (max-width: 480px) {
    body[data-theme="kitty"] .container {
        border-radius: 18px !important;
    }

    body[data-theme="kitty"] .header-stats,
    body[data-theme="kitty"] .theme-controls {
        width: 100%;
    }

    body[data-theme="kitty"] .header-stats > span,
    body[data-theme="kitty"] .theme-controls > *,
    body[data-theme="kitty"] .week-nav button {
        width: 100%;
    }

    body[data-theme="kitty"] .week-nav {
        grid-template-columns: 1fr !important;
    }

    body[data-theme="kitty"] .week-nav h3 {
        grid-column: auto !important;
        order: -1;
    }

    body[data-theme="kitty"] .pomodoro-content {
        padding: 18px 14px 16px !important;
        border-radius: 24px !important;
    }

    body[data-theme="kitty"] .pomodoro-content h2 {
        padding-right: 44px !important;
        text-align: left;
    }

    body[data-theme="kitty"] .pomodoro-time-inputs {
        grid-template-columns: 1fr !important;
    }

    body[data-theme="kitty"] .timer-controls {
        grid-template-columns: 1fr !important;
    }

    body[data-theme="kitty"] .timer-display {
        font-size: clamp(30px, 13vw, 44px) !important;
    }

    body[data-theme="kitty"] .support-card-top,
    body[data-theme="kitty"] .note-card-footer {
        flex-direction: column;
        align-items: stretch;
    }
}

/* ===================================================
   LEADERBOARD TABLET/MOBIL DOKUNMA DÜZELTMELERİ
   - Kapatma butonu daha büyük dokunma alanı
   - Animasyon iPad için daha hızlı
   =================================================== */

/* Kapatma butonu - dokunma alanı büyütüldü */
.close-leaderboard {
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 10px 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    -webkit-tap-highlight-color: transparent !important;
    touch-action: manipulation !important;
}

/* iPad ve tablet - animasyonu hızlandır */
@media (max-width: 1024px) {
    .leaderboard-panel {
        transition: right 0.22s ease !important;
        -webkit-overflow-scrolling: touch;
    }

    .close-leaderboard {
        min-width: 48px !important;
        min-height: 48px !important;
        font-size: 1.4em !important;
    }
}

/* Mobil */
@media (max-width: 600px) {
    .leaderboard-panel {
        transition: right 0.18s ease !important;
    }
}

/* ===================================================
   LEADERBOARD PERFORMANS - TABLET/MOBIL
   right animasyonu yerine transform kullan (GPU hızlı)
   =================================================== */

.leaderboard-panel {
    right: 0 !important;
    transform: translateX(100%) !important;
    transition: transform 0.22s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    will-change: transform !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain !important;
}

.leaderboard-panel.open {
    transform: translateX(0) !important;
}

.leaderboard-list {
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain !important;
}

.leaderboard-avatar {
    content-visibility: auto !important;
}

/* Kapatma butonu - büyük dokunma alanı */
.close-leaderboard {
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 10px 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
}

@media (max-width: 1024px) {
    .leaderboard-panel {
        width: min(420px, 95vw) !important;
    }
    .leaderboard-tab {
        padding: 12px 8px !important;
        font-size: 1em !important;
    }
    .leaderboard-item {
        padding: 10px 8px !important;
    }
    .close-leaderboard {
        min-width: 48px !important;
        min-height: 48px !important;
    }
}