/* ==========================================================================
   NOTIFORGE — ZEN TASARIMI ("Organik & Zen Stüdyo")
   Uygulamanın genel görünümü: yeşil/krem bulanık zemin, cam kartlar, yüzen nav.
   Açık / Koyu mod yalnızca Profil'den seçilir; bu dosya iki modun renklerini
   cam (yarı saydam) yüzeylerle ezer. theme.css'ten SONRA yüklenir.
   ========================================================================== */

/* ---------- AÇIK MOD ---------- */
:root,
:root[data-theme="light"] {
    --bg-primary:   #e4ecdc;
    --surface:      #f4f7ef;   /* opak: modal, menü, açılır liste güvenle okunur */
    --surface-2:    #e8eee1;
    --surface-3:    #dbe5d3;
    --border:       rgba(45, 90, 67, .14);
    --border-strong:rgba(45, 90, 67, .22);

    --text:         #1f2d27;
    --text-muted:   #566660;
    --text-faint:   #62706a;   /* kartlarda 4.5:1 üstü */

    --accent:        #2f6b4c;
    --accent-hover:  #245640;
    --accent-text:   #2f6b4c;
    --accent-ink:    #1d4a33;
    --accent-soft:   rgba(47, 107, 76, .12);
    --accent-soft-2: rgba(47, 107, 76, .2);

    --accent-rgb:  47, 107, 76;
    --surface-rgb: 255, 255, 255;
    --bg-rgb:      228, 236, 220;

    --shadow-color: 40, 80, 58;
    --shadow-sm: 0 2px 10px rgba(var(--shadow-color), .08);
    --shadow-md: 0 8px 24px rgba(var(--shadow-color), .12);
    --shadow-lg: 0 18px 44px rgba(var(--shadow-color), .18);

    --overlay: rgba(24, 40, 32, .42);

    --glass-blur:   blur(18px) saturate(1.2);
    --glass-surface:rgba(255, 255, 255, .72);
    --glass-line:   rgba(255, 255, 255, .75);
    --glass-card:   rgba(255, 255, 255, .78);
    --glass-bar:    rgba(255, 255, 255, .8);
    --glass-edge:   rgba(255, 255, 255, .85);
    --zen-glow-1:   rgba(255, 250, 225, .85);
    --zen-glow-2:   rgba(160, 205, 170, .55);
    --zen-glow-3:   rgba(130, 185, 150, .45);
}

/* ---------- KOYU MOD ---------- */
:root[data-theme="dark"] {
    --bg-primary:   #0e1412;
    --surface:      #1a2420;
    --surface-2:    #223029;
    --surface-3:    #2b3b33;
    --border:       rgba(255, 255, 255, .09);
    --border-strong:rgba(255, 255, 255, .16);
    --text-faint:   #8d9a95;   /* koyu kartlarda 4.5:1 üstü */

    --bg-rgb:      14, 20, 18;
    --surface-rgb: 30, 42, 37;

    --shadow-color: 0, 0, 0;

    --glass-surface:rgba(30, 42, 37, .72);
    --glass-line:   rgba(255, 255, 255, .09);
    --glass-card:   rgba(40, 56, 49, .72);
    --glass-bar:    rgba(24, 34, 30, .82);
    --glass-edge:   rgba(255, 255, 255, .12);
    --zen-glow-1:   rgba(70, 110, 85, .35);
    --zen-glow-2:   rgba(50, 100, 72, .35);
    --zen-glow-3:   rgba(40, 85, 62, .3);
}

/* Zemin: yumuşak yeşil ışık lekeleri */
body {
    background-color: var(--bg-primary);
    background-image:
        radial-gradient(60% 40% at 15% 0%, var(--zen-glow-1) 0, transparent 70%),
        radial-gradient(55% 45% at 100% 30%, var(--zen-glow-2) 0, transparent 70%),
        radial-gradient(70% 50% at 0% 100%, var(--zen-glow-3) 0, transparent 70%);
    background-attachment: fixed;
}

/* Cam kartlar */
.card,
.home-thought-card,
.home-schedule-card,
.home-recent-card {
    background: var(--glass-surface);
    -webkit-backdrop-filter: var(--glass-blur);
    backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-line);
    border-radius: 22px;
    box-shadow: var(--shadow-sm);
}
.home-thought-card:focus-within {
    border-color: rgba(var(--accent-rgb), .45);
    box-shadow: 0 8px 26px rgba(var(--accent-rgb), .14);
}
.feed-item-card {
    background: var(--glass-card);
    border: 1px solid var(--glass-edge);
    border-radius: 16px;
    box-shadow: 0 1px 6px rgba(var(--shadow-color), .06);
}

/* Sıradaki tekrar: koyu yeşil cam, açık yazı */
.home-next-review-card {
    background: linear-gradient(135deg, rgba(47, 107, 76, .92), rgba(36, 86, 64, .92));
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 22px;
    box-shadow: var(--shadow-md);
}

/* Üst bar */
body > header {
    background: rgba(var(--bg-rgb), .45);
    -webkit-backdrop-filter: var(--glass-blur);
    backdrop-filter: var(--glass-blur);
    border-bottom: 1px solid var(--glass-edge);
}

/* ==========================================================================
   DİĞER SAYFALAR — Kütüphane, Sohbet, Tekrar, Profil, Modallar
   ========================================================================== */

/* --- Kütüphane --- */
.lib-note-card,
.lib-folder-card,
.lib-search-pill,
.lib-synthesis-card {
    background: var(--glass-card);
    -webkit-backdrop-filter: var(--glass-blur);
    backdrop-filter: var(--glass-blur);
    border-color: var(--glass-edge);
    box-shadow: 0 2px 10px rgba(var(--shadow-color), .07);
}
.lib-note-card { border-radius: 20px; }
.lib-folder-card {
    border-radius: 16px;
    border-left: 4px solid var(--folder-color);
    background: color-mix(in srgb, var(--folder-color) 7%, var(--glass-card));
}
.lib-search-pill:focus-within { border-color: rgba(var(--accent-rgb), .5); }
.lib-folder-card.active {
    background: color-mix(in srgb, var(--folder-color) 16%, var(--glass-card));
    border-color: var(--folder-color);
    border-left-width: 4px;
    box-shadow: 0 3px 12px color-mix(in srgb, var(--folder-color) 25%, transparent);
}

/* --- Sohbet --- */
.chat-view-wrapper { background: transparent; }
.chat-header-bar {
    background: var(--glass-bar);
    -webkit-backdrop-filter: var(--glass-blur);
    backdrop-filter: var(--glass-blur);
    border-bottom: 1px solid var(--glass-edge);
}
.ai-msg .chat-msg-bubble {
    background: var(--glass-card);
    -webkit-backdrop-filter: var(--glass-blur);
    backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-edge);
    border-radius: 20px 20px 20px 6px;
    box-shadow: 0 2px 10px rgba(var(--shadow-color), .08);
}
.user-msg .chat-msg-bubble { border-radius: 20px 20px 6px 20px; }
.chat-input-pill {
    background: var(--glass-bar);
    -webkit-backdrop-filter: var(--glass-blur);
    backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-edge);
    border-radius: 999px;
    box-shadow: 0 8px 26px rgba(var(--shadow-color), .14);
}
.chat-input-pill:focus-within { border-color: rgba(var(--accent-rgb), .5); }
.chat-mini-card,
.chat-ref-card {
    background: var(--glass-card);
    border-color: var(--glass-edge);
    border-left-color: var(--accent);
    border-radius: 14px;
}

/* --- Tekrar --- */
.rv-card,
.review-analytics,
.qm-card {
    background: var(--glass-surface);
    -webkit-backdrop-filter: var(--glass-blur);
    backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-line);
    border-radius: 22px;
}
.qm-card { background: var(--surface); }

/* --- Modallar: opak yüzey, yumuşak köşe --- */
.modal-card,
.cal-card {
    background: var(--surface);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    border: 1px solid var(--glass-edge);
    border-radius: 26px;
}
.note-modal-card, .task-modal-card, .word-modal-card { background: var(--surface); }
.modal-overlay { -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }

/* Mobilde detay modalı alt sayfa (bottom sheet): alt köşe/kenar yuvarlaması olmasın */
@media (max-width: 620px) {
    .modal-card.note-modal-card,
    .modal-card.task-modal-card,
    .modal-card.word-modal-card {
        border-radius: 24px 24px 0 0;
        border-left: 0;
        border-right: 0;
        border-bottom: 0;
        max-height: 94vh;
        max-height: 94dvh;
    }
}


/* --- Dokunma alanı: görünür boyut aynı, tıklanabilir alan en az 44px --- */
.lib-icon-action-btn,
.lib-folder-edit-btn,
.chat-pill-icon-btn,
.chat-header-refresh-btn,
.chat-header-back-btn,
.modal-close {
    position: relative;
}
.lib-icon-action-btn::after,
.lib-folder-edit-btn::after,
.chat-pill-icon-btn::after,
.chat-header-refresh-btn::after,
.chat-header-back-btn::after,
.modal-close::after {
    content: "";
    position: absolute;
    top: 50%; left: 50%;
    width: max(100%, 44px);
    height: max(100%, 44px);
    transform: translate(-50%, -50%);
}