/**
 * Acilci Mobile Theme — sade, hızlı, app-imsi.
 * Tasarım dili: Expo iskeletindeki PostCard mantığı. Light/dark otomatik.
 */

/* ===== Tema değişkenleri ===== */
:root {
    --am-bg: #FFFFFF;
    --am-bg-alt: #F8FAFC;
    --am-card: #FFFFFF;
    --am-text: #0B1220;
    --am-text-muted: #475569;
    --am-text-subtle: #94A3B8;
    --am-border: #E2E8F0;
    --am-brand: #E11D2A;
    --am-spotify: #1DB954;
    --am-radius-sm: 8px;
    --am-radius-md: 12px;
    --am-radius-lg: 16px;
    --am-radius-pill: 999px;
    --am-shadow: 0 1px 2px rgba(15, 23, 42, .06), 0 4px 16px rgba(15, 23, 42, .04);
}

@media (prefers-color-scheme: dark) {
    :root {
        --am-bg: #0B1220;
        --am-bg-alt: #111827;
        --am-card: #111827;
        --am-text: #F8FAFC;
        --am-text-muted: #CBD5E1;
        --am-text-subtle: #64748B;
        --am-border: #1F2937;
        --am-shadow: 0 2px 8px rgba(0, 0, 0, .3);
    }
}

/* ===== Safety net — Elementor Pro Theme Builder sızıntılarını gizle ===== */
/* Filter ile location'lar kapatılıyor ama yine de bir şey sızarsa CSS ile garanti gizle. */
body.am-body header.elementor-location-header,
body.am-body footer.elementor-location-footer,
body.am-body div.elementor-location-header,
body.am-body div.elementor-location-footer,
body.am-body .elementor-template,
body.am-body .elementor-popup-modal,
body.am-body #elementor-device-mode,
body.am-body .ekit-template-content-markup,
body.am-body .e-loop-item,
body.am-body .elementor-section.elementor-top-section:not(.am-allow) {
    display: none !important;
}

/* Hello Elementor varsayılan header/footer (Theme Builder yoksa fallback) */
body.am-body > header.site-header,
body.am-body > footer.site-footer,
body.am-body > .site-header,
body.am-body > .site-footer {
    display: none !important;
}

/* ===== Phosphor ikon helper ===== */
.am-icon {
    display: inline-block;
    vertical-align: -0.125em;
    flex: 0 0 auto;
    /* SVG'lerin renk kontrolü: stroke ve fill currentColor.
       Phosphor regular weight stroke-based, fill weight fill-based. */
}
.am-icon use { pointer-events: none; }
.am-icon--white   { color: #fff; }
.am-icon--spotify { color: #1DB954; }
.am-icon--brand   { color: var(--am-brand); }
.am-icon--muted   { color: var(--am-text-muted); }

/* ===== Reset ve gövde ===== */
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body.am-body {
    margin: 0;
    background: var(--am-bg);
    color: var(--am-text);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 16px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    padding-bottom: env(safe-area-inset-bottom);
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--am-brand); text-decoration: none; }
button { font-family: inherit; cursor: pointer; }
hr.am-divider {
    border: 0;
    border-top: 1px solid var(--am-border);
    margin: 24px 0;
}

/* ===== Header ===== */
.am-header {
    position: sticky;
    top: 0;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: var(--am-bg);
    border-bottom: 1px solid var(--am-border);
    padding-top: calc(12px + env(safe-area-inset-top));
}
.am-header__logo img { height: 32px; width: auto; }
.am-header__actions { display: flex; gap: 4px; align-items: center; }
.am-icon-btn {
    width: 40px; height: 40px;
    display: inline-flex; align-items: center; justify-content: center;
    border: 0; border-radius: var(--am-radius-pill);
    background: transparent; color: var(--am-text);
}
.am-icon-btn:active { background: var(--am-bg-alt); }
.am-avatar-sm { width: 28px; height: 28px; border-radius: 50%; }

/* ===== Article ===== */
.am-article { background: var(--am-bg); }
.am-article__cover {
    width: 100%;
    aspect-ratio: 1 / 1;     /* tam kare */
    background: var(--am-bg-alt);
    overflow: hidden;
}
.am-article__cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;       /* tam genişlikte 1:1, gerekirse kırp */
    display: block;
}
.am-article__inner { padding: 20px 16px 32px; max-width: 720px; margin: 0 auto; }

.am-cat-tag {
    display: inline-block;
    color: var(--am-brand);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.2px;
    text-decoration: none;
    margin-bottom: 8px;
}

.am-article__title {
    margin: 0 0 12px;
    font-size: 28px;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: -0.5px;
    color: var(--am-text);
}

.am-article__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 16px;
    font-size: 13px;
    color: var(--am-text-subtle);
}
.am-article__meta-text {
    flex: 1;
    min-width: 0;
}
.am-article__meta-actions {
    display: inline-flex;
    gap: 6px;
    flex: 0 0 auto;
}
.am-meta-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 10px;
    background: var(--am-bg-alt);
    color: var(--am-text);
    border: 1px solid var(--am-border);
    border-radius: var(--am-radius-pill);
    font-weight: 600;
    font-size: 12px;
    line-height: 1;
}
.am-meta-btn:active { background: var(--am-border); }
.am-meta-btn[data-am-saved="1"] {
    background: var(--am-brand);
    color: #fff;
    border-color: var(--am-brand);
}

/* ===== Yazar / Seslendiren kartları ===== */
.am-people {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 16px 0;
}
.am-person-row {
    display: flex;
    align-items: stretch;
    gap: 8px;
}
.am-person {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    background: var(--am-bg-alt);
    border: 1px solid var(--am-border);
    border-radius: var(--am-radius-md);
    text-align: left;
    min-width: 0;
}
.am-person__spotify-btn {
    flex: 0 0 auto;
    width: 56px;
    background: var(--am-spotify);
    border: 0;
    border-radius: var(--am-radius-md);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    box-shadow: 0 2px 6px rgba(29, 185, 84, .25);
}
.am-person__spotify-btn:active { transform: scale(.96); }
.am-person:active { background: var(--am-border); }
.am-person__avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    object-fit: cover;
    flex: 0 0 auto;
    background: var(--am-border);
}
.am-person__avatar--placeholder { background: linear-gradient(135deg, var(--am-brand), #7c2d12); }
.am-person__text { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.am-person__label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.8px;
    color: var(--am-text-subtle);
    text-transform: uppercase;
}
.am-person__name {
    font-size: 15px;
    font-weight: 700;
    color: var(--am-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ===== Spotify dinle butonu ===== */
.am-listen-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    background: var(--am-spotify);
    color: #fff;
    border-radius: var(--am-radius-pill);
    font-weight: 700;
    text-decoration: none;
    margin: 16px 0;
    box-shadow: var(--am-shadow);
}
.am-listen-btn:active { transform: scale(.98); }
.am-listen-btn small { opacity: .8; font-weight: 500; }

/* ===== Aksiyon butonları (Kaydet, Paylaş) ===== */
.am-actions {
    display: flex;
    gap: 8px;
    margin: 16px 0;
}
.am-action-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 16px;
    background: var(--am-bg-alt);
    color: var(--am-text);
    border: 1px solid var(--am-border);
    border-radius: var(--am-radius-pill);
    font-weight: 600;
    font-size: 14px;
}
.am-action-btn:active { background: var(--am-border); }
.am-action-btn[data-am-saved="1"] {
    background: var(--am-brand);
    color: #fff;
    border-color: var(--am-brand);
}

/* ===== İçerik — WP HTML ===== */
.am-content {
    font-size: 17px;
    line-height: 1.65;
    color: var(--am-text);
}
.am-content p { margin: 0 0 16px; }
.am-content h1, .am-content h2, .am-content h3, .am-content h4 {
    margin: 28px 0 12px;
    line-height: 1.3;
    color: var(--am-text);
    letter-spacing: -0.3px;
}
.am-content h1 { font-size: 26px; font-weight: 800; }
.am-content h2 { font-size: 22px; font-weight: 800; }
.am-content h3 { font-size: 19px; font-weight: 700; }
.am-content h4 { font-size: 17px; font-weight: 700; }
.am-content a { color: var(--am-brand); text-decoration: underline; text-underline-offset: 2px; }
.am-content blockquote {
    margin: 16px 0;
    padding: 8px 16px;
    border-left: 3px solid var(--am-brand);
    color: var(--am-text-muted);
    font-style: italic;
}
.am-content ul, .am-content ol { padding-left: 22px; margin: 0 0 16px; }
.am-content li { margin-bottom: 6px; }
.am-content img { border-radius: var(--am-radius-md); margin: 12px 0; }
.am-content figure { margin: 16px 0; }
.am-content figcaption {
    font-size: 13px;
    color: var(--am-text-subtle);
    text-align: center;
    margin-top: 6px;
    font-style: italic;
}
.am-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 16px 0;
    font-size: 14px;
    display: block;
    overflow-x: auto;
}
.am-content table th, .am-content table td {
    border: 1px solid var(--am-border);
    padding: 8px 10px;
    text-align: left;
}
.am-content table th {
    background: var(--am-bg-alt);
    font-weight: 700;
}
.am-content code {
    background: var(--am-bg-alt);
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 14px;
}
.am-content pre {
    background: var(--am-bg-alt);
    padding: 12px;
    border-radius: var(--am-radius-md);
    overflow-x: auto;
    font-size: 13px;
}
.am-content iframe { max-width: 100%; border-radius: var(--am-radius-md); }

/* ===== Etiketler ===== */
.am-tags {
    margin-top: 28px;
    padding-top: 20px;
    border-top: 1px solid var(--am-border);
}
.am-tags__label {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.2px;
    color: var(--am-text-subtle);
    margin-bottom: 10px;
}
.am-tags__list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.am-tag {
    display: inline-block;
    padding: 6px 12px;
    background: var(--am-bg-alt);
    color: var(--am-text-muted);
    border: 1px solid var(--am-border);
    border-radius: var(--am-radius-pill);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}

/* ===== Abonelik banner (faz 2) ===== */
.am-subscribe-banner {
    margin: 24px 0;
    padding: 20px;
    background: linear-gradient(135deg, var(--am-brand), #7c2d12);
    color: #fff;
    border-radius: var(--am-radius-lg);
    text-align: center;
}
.am-subscribe-banner__head {
    font-size: 18px;
    font-weight: 800;
    margin-bottom: 6px;
}
.am-subscribe-banner p {
    margin: 0 0 14px;
    opacity: .9;
    font-size: 14px;
}

/* ===== Yorumlar ===== */
.am-comments {
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid var(--am-border);
}
.am-comments .comments-title { font-size: 18px; font-weight: 800; margin: 0 0 16px; }
.am-comments .comment-list { list-style: none; padding: 0; margin: 0; }
.am-comments .comment-list li { padding: 14px 0; border-bottom: 1px solid var(--am-border); }
.am-comments .comment-author { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.am-comments .comment-author img { width: 36px; height: 36px; border-radius: 50%; }
.am-comments .comment-author cite { font-style: normal; font-weight: 700; }
.am-comments .comment-meta { font-size: 12px; color: var(--am-text-subtle); margin-bottom: 8px; }
.am-comments textarea, .am-comments input[type="text"], .am-comments input[type="email"], .am-comments input[type="url"] {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--am-border);
    border-radius: var(--am-radius-md);
    background: var(--am-bg-alt);
    color: var(--am-text);
    font-size: 15px;
    font-family: inherit;
    margin-bottom: 10px;
}
.am-comments .submit, .am-comments input[type="submit"] {
    padding: 12px 24px;
    background: var(--am-brand);
    color: #fff;
    border: 0;
    border-radius: var(--am-radius-pill);
    font-weight: 700;
    font-size: 14px;
}

/* ===== Footer ===== */
.am-footer {
    padding: 32px 16px 80px;
    text-align: center;
    background: var(--am-bg-alt);
    border-top: 1px solid var(--am-border);
    margin-top: 24px;
}
.am-footer__brand {
    font-size: 22px;
    font-weight: 800;
    color: var(--am-brand);
    letter-spacing: -0.5px;
}
.am-footer__tagline {
    font-size: 13px;
    color: var(--am-text-muted);
    font-style: italic;
    margin: 4px 0 16px;
}
.am-footer__social {
    display: flex;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}
.am-footer__social-btn {
    width: 40px; height: 40px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%;
    background: var(--am-bg);
    color: var(--am-text-muted);
    border: 1px solid var(--am-border);
}
.am-footer__copy { font-size: 12px; color: var(--am-text-subtle); }

/* Markalı sosyal renkler */
.am-social--twitter:active   { background: #1DA1F2; color: #fff; border-color: #1DA1F2; }
.am-social--instagram:active { background: #E4405F; color: #fff; border-color: #E4405F; }
.am-social--facebook:active  { background: #1877F2; color: #fff; border-color: #1877F2; }
.am-social--linkedin:active  { background: #0A66C2; color: #fff; border-color: #0A66C2; }
.am-social--youtube:active   { background: #FF0000; color: #fff; border-color: #FF0000; }
.am-social--spotify:active   { background: #1DB954; color: #fff; border-color: #1DB954; }

/* ===== Pill butonlar (genel) ===== */
.am-btn-pill {
    display: inline-block;
    padding: 12px 22px;
    border-radius: var(--am-radius-pill);
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
    border: 0;
    cursor: pointer;
}
.am-btn-primary { background: var(--am-brand); color: #fff; }
.am-btn-secondary { background: var(--am-bg-alt); color: var(--am-text); border: 1px solid var(--am-border); }

/* ===== Dialoglar ===== */
.am-search-dialog, .am-menu-dialog, .am-person-dialog {
    border: 0;
    padding: 0;
    margin: 0;
    background: transparent;
    width: 100%;
    max-width: 100%;
    height: 100%;
    max-height: 100%;
}
.am-search-dialog::backdrop, .am-menu-dialog::backdrop, .am-person-dialog::backdrop {
    background: rgba(11, 18, 32, .55);
    backdrop-filter: blur(4px);
}

.am-search-dialog[open] {
    position: fixed;
    top: 0; left: 0; right: 0;
    height: auto;
    background: var(--am-bg);
    padding: calc(12px + env(safe-area-inset-top)) 16px 12px;
    border-bottom: 1px solid var(--am-border);
    box-shadow: 0 8px 24px rgba(0,0,0,.15);
}
.am-search-form {
    display: flex;
    align-items: center;
    gap: 8px;
}
.am-search-form input[type="search"] {
    flex: 1;
    border: 0;
    background: var(--am-bg-alt);
    color: var(--am-text);
    padding: 12px 16px;
    border-radius: var(--am-radius-pill);
    font-size: 16px;
    font-family: inherit;
}
.am-search-form input[type="search"]:focus { outline: 2px solid var(--am-brand); }

.am-menu-dialog[open] {
    position: fixed;
    top: 0; right: 0; bottom: 0;
    width: 86%;
    max-width: 320px;
    height: 100%;
    background: var(--am-bg);
    margin-left: auto;
    padding: 0;
    transform: translateX(0);
    box-shadow: -8px 0 32px rgba(0,0,0,.2);
}
.am-menu-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: calc(14px + env(safe-area-inset-top)) 16px 14px;
    border-bottom: 1px solid var(--am-border);
}
.am-menu-nav {
    display: flex;
    flex-direction: column;
    padding: 8px 0;
}
.am-menu-nav a {
    padding: 14px 20px;
    color: var(--am-text);
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px solid var(--am-border);
}
.am-menu-nav a:active { background: var(--am-bg-alt); }
.am-menu-nav hr { border: 0; border-top: 1px solid var(--am-border); margin: 8px 0; }

.am-person-dialog[open] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: transparent;
    padding: 0;
}
.am-person-dialog__inner {
    width: 100%;
    max-width: 420px;
    background: var(--am-card);
    border-radius: 22px 22px 0 0;
    padding: 24px 20px calc(24px + env(safe-area-inset-bottom));
    position: relative;
}
.am-person-dialog__close {
    position: absolute;
    top: 8px; right: 8px;
    color: var(--am-text-muted);
}
.am-person-dialog__body {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 8px;
}
.am-person-dialog__avatar {
    width: 96px; height: 96px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--am-border);
    margin-bottom: 4px;
}
.am-person-dialog__label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.2px;
    color: var(--am-text-subtle);
}
.am-person-dialog__name {
    margin: 0;
    font-size: 22px;
    font-weight: 800;
    color: var(--am-text);
}
.am-person-dialog__role {
    font-size: 13px;
    color: var(--am-brand);
    font-weight: 600;
}
.am-person-dialog__desc {
    font-size: 14px;
    color: var(--am-text-muted);
    line-height: 1.5;
    margin: 8px 0 16px;
}
.am-person-dialog__link[hidden] { display: none; }

/* Tablet üstü — single sayfada içeriği biraz daraltıp okunaklı tut */
@media (min-width: 720px) {
    .am-article__title { font-size: 32px; }
}

/* ===== Anasayfa / Feed ===== */
.am-feed {
    max-width: 720px;
    margin: 0 auto;
    padding: 12px 16px 32px;
}
.am-feed__separator {
    height: 1px;
    background: var(--am-border);
    margin: 16px 0;
}
.am-feed__empty {
    text-align: center;
    color: var(--am-text-muted);
    padding: 64px 16px;
}

/* ===== Hero kart ===== */
.am-hero {
    display: block;
    text-decoration: none;
    color: inherit;
    background: var(--am-card);
    border: 1px solid var(--am-border);
    border-radius: var(--am-radius-lg);
    overflow: hidden;
    box-shadow: var(--am-shadow);
    margin-bottom: 16px;
}
.am-hero:active { transform: scale(.99); }
.am-hero__media {
    position: relative;
    aspect-ratio: 16 / 10;
    background: var(--am-bg-alt);
}
.am-hero__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.am-hero__spotify-badge {
    position: absolute;
    right: 12px;
    bottom: 12px;
    width: 44px; height: 44px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(11, 18, 32, .7);
    backdrop-filter: blur(8px);
    cursor: pointer;
}
.am-hero__body { padding: 18px 18px 20px; }
.am-hero__title {
    margin: 8px 0 6px;
    font-size: 22px;
    line-height: 1.25;
    font-weight: 800;
    letter-spacing: -0.4px;
    color: var(--am-text);
    /* en fazla 3 satır */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.am-hero__excerpt {
    margin: 0;
    color: var(--am-text-muted);
    font-size: 14px;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.am-hero__byline {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 14px;
}
.am-byline-avatar {
    width: 32px; height: 32px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--am-border);
    flex: 0 0 auto;
}
.am-byline-avatar--sm { width: 18px; height: 18px; }
.am-byline-name {
    font-size: 13px;
    font-weight: 700;
    color: var(--am-text);
}
.am-byline-meta {
    font-size: 12px;
    color: var(--am-text-subtle);
}

/* ===== Standart post kartı ===== */
.am-card {
    display: flex;
    gap: 12px;
    text-decoration: none;
    color: inherit;
    padding: 12px;
    background: var(--am-card);
    border: 1px solid var(--am-border);
    border-radius: var(--am-radius-md);
    margin-bottom: 10px;
}
.am-card:active { background: var(--am-bg-alt); }
.am-card__thumb {
    width: 96px;
    height: 96px;
    flex: 0 0 96px;
    border-radius: var(--am-radius-sm);
    overflow: hidden;
    background: var(--am-bg-alt);
}
.am-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.am-card__thumb--placeholder {
    background: linear-gradient(135deg, var(--am-bg-alt), var(--am-border));
}
.am-card__body {
    flex: 1;
    min-width: 0; /* metin kırılması için */
    display: flex;
    flex-direction: column;
}
.am-card__title {
    margin: 4px 0 6px;
    font-size: 15px;
    line-height: 1.3;
    font-weight: 700;
    color: var(--am-text);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.am-card__meta {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: auto;
    font-size: 12px;
    color: var(--am-text-subtle);
}
.am-card__meta-text {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.am-card__spotify {
    flex: 0 0 auto;
    cursor: pointer;
}

/* ===== Load more butonu ===== */
.am-load-more {
    display: block;
    width: 100%;
    margin: 20px 0 8px;
    padding: 14px;
    background: var(--am-bg-alt);
    color: var(--am-text);
    border: 1px solid var(--am-border);
    border-radius: var(--am-radius-pill);
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
}
.am-load-more:active { background: var(--am-border); }
.am-load-more[disabled] { opacity: .6; cursor: default; }
.am-load-more.am-load-more--loading::after {
    content: '…';
    margin-left: 6px;
}

/* Tablet üstü ayarlamalar */
@media (min-width: 720px) {
    .am-hero__title { font-size: 26px; }
    .am-card__thumb { width: 120px; height: 120px; flex-basis: 120px; }
    .am-card__title { font-size: 16px; }
}

/* ===== Spotify in-page player (sticky mini, non-modal) ===== */
/* dialog.show() ile non-modal: backdrop yok, sayfa scroll'u devam eder,
   kullanıcı yazıyı okurken müzik çalmaya devam eder. */
.am-spotify-dialog {
    border: 0;
    padding: 0;
    margin: 0;
    background: transparent;
    width: auto;
    height: auto;
    max-width: none;
    max-height: none;
    inset: auto;
    overflow: visible;
}
.am-spotify-dialog[open] {
    position: fixed;
    bottom: calc(12px + env(safe-area-inset-bottom));
    left: 12px;
    right: 12px;
    width: auto;
    max-width: 600px;
    margin: 0 auto;
    z-index: 1000;
    /* slide-up animasyonu */
    animation: am-spotify-slidein .25s cubic-bezier(.2,.8,.2,1);
}
@keyframes am-spotify-slidein {
    from { transform: translateY(120%); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}
.am-spotify-dialog__inner {
    width: 100%;
    background: var(--am-card);
    border: 1px solid var(--am-border);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0,0,0,.25);
}
.am-spotify-dialog__head {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 6px 6px 6px 12px;
    border-bottom: 1px solid var(--am-border);
    min-height: 36px;
}
.am-spotify-dialog__title {
    flex: 1;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 700;
    font-size: 12px;
    color: var(--am-text);
    min-width: 0;
}
.am-spotify-dialog__title span[data-am-spotify-title] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.am-spotify-dialog__open { display: none; } /* mini player'da gizli, başlığa basınca açabiliriz ileride */
.am-spotify-dialog [data-am-spotify-open] {
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: var(--am-radius-pill);
    background: transparent;
    color: var(--am-text-muted);
    text-decoration: none;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.am-spotify-dialog [data-am-spotify-open] .am-icon { transform: rotate(135deg); /* upward arrow */ }
.am-spotify-dialog__head .am-icon-btn { width: 32px; height: 32px; }
.am-spotify-dialog__body {
    background: var(--am-card);
    line-height: 0;
}
.am-spotify-dialog__body iframe {
    display: block;
    width: 100%;
    border: 0;
}

/* ===== Arama sayfası ===== */
.am-search { background: var(--am-bg); }
.am-search__results-wrap {
    max-width: 720px;
    margin: 0 auto;
    padding: 12px 16px 32px;
}
.am-search__title {
    margin: 8px 0 4px;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -0.4px;
    color: var(--am-text);
}
.am-search__count {
    margin: 0 0 14px;
    font-size: 13px;
    color: var(--am-text-muted);
}
.am-search__results {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.am-search__results > .am-card { margin-bottom: 0; }
.am-search__empty {
    padding: 64px 16px;
    text-align: center;
    color: var(--am-text-muted);
}
.am-search__empty p { margin: 0 0 6px; }

/* Sticky search bar */
.am-search-bar {
    position: sticky;
    top: 64px; /* header'ın altına */
    z-index: 40;
    background: var(--am-bg);
    border-bottom: 1px solid var(--am-border);
    padding: 10px 16px;
}
.am-search-bar__row {
    display: flex;
    gap: 8px;
    align-items: stretch;
}
.am-search-bar__input-wrap {
    flex: 1;
    position: relative;
    display: flex;
    align-items: center;
}
.am-search-bar__icon {
    position: absolute;
    left: 12px;
    pointer-events: none;
    display: inline-flex;
    align-items: center;
}
.am-search-bar__input {
    flex: 1;
    width: 100%;
    border: 1px solid var(--am-border);
    background: var(--am-bg-alt);
    color: var(--am-text);
    padding: 10px 36px 10px 36px;
    border-radius: var(--am-radius-pill);
    font-size: 15px;
    font-family: inherit;
    -webkit-appearance: none;
    appearance: none;
}
.am-search-bar__input:focus {
    outline: 2px solid var(--am-brand);
    outline-offset: -1px;
    background: var(--am-bg);
}
.am-search-bar__input::-webkit-search-cancel-button { display: none; }
.am-search-bar__clear {
    position: absolute;
    right: 8px;
    width: 24px; height: 24px;
    border: 0;
    background: var(--am-text-subtle);
    color: #fff;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.am-search-bar__clear[hidden] { display: none; }
.am-search-bar__filter-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 0 14px;
    border: 1px solid var(--am-border);
    background: var(--am-bg-alt);
    color: var(--am-text);
    border-radius: var(--am-radius-pill);
    font-weight: 600;
    font-size: 14px;
    position: relative;
}
.am-search-bar__filter-btn:active { background: var(--am-border); }
.am-search-bar__filter-label { font-size: 13px; }
.am-search-bar__filter-badge {
    position: absolute;
    top: 4px; right: 4px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    background: var(--am-brand);
    color: #fff;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.am-search-bar__filter-badge[hidden] { display: none; }
.am-search-bar__chips {
    display: flex;
    gap: 6px;
    margin-top: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 2px; /* scroll shadow için */
}
.am-search-bar__chips:empty { display: none; }
.am-search-bar__chips::-webkit-scrollbar { display: none; }

/* Chip */
.am-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 6px 4px 10px;
    background: var(--am-bg-alt);
    border: 1px solid var(--am-border);
    border-radius: var(--am-radius-pill);
    font-size: 12px;
    font-weight: 600;
    color: var(--am-text);
    flex: 0 0 auto;
}
.am-chip__label {
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.am-chip__remove {
    border: 0;
    background: transparent;
    width: 22px; height: 22px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--am-text-muted);
    flex: 0 0 auto;
}
.am-chip__remove:active { background: var(--am-border); }

/* Filter modal — bottom-sheet, full height */
.am-filter-dialog {
    border: 0;
    padding: 0;
    margin: 0;
    background: transparent;
    width: 100%;
    max-width: 100%;
    height: 100%;
    max-height: 100%;
}
.am-filter-dialog::backdrop {
    background: rgba(11, 18, 32, .55);
    backdrop-filter: blur(4px);
}
.am-filter-dialog[open] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}
.am-filter-dialog__inner {
    width: 100%;
    max-width: 600px;
    height: 86vh;
    background: var(--am-card);
    border-radius: 22px 22px 0 0;
    display: flex;
    flex-direction: column;
    padding-bottom: env(safe-area-inset-bottom);
    box-shadow: 0 -8px 32px rgba(0,0,0,.25);
}
.am-filter-dialog__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 12px 14px 20px;
    border-bottom: 1px solid var(--am-border);
}
.am-filter-dialog__title { font-size: 16px; font-weight: 800; }
.am-filter-dialog__tabs {
    display: flex;
    border-bottom: 1px solid var(--am-border);
    background: var(--am-bg);
}
.am-filter-tab {
    flex: 1;
    padding: 14px 8px;
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    font-weight: 700;
    font-size: 13px;
    color: var(--am-text-muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
.am-filter-tab--active {
    color: var(--am-text);
    border-bottom-color: var(--am-brand);
}
.am-filter-dialog__panels {
    flex: 1;
    overflow: hidden;
    display: flex;
}
.am-filter-panel {
    flex: 1;
    display: none;
    flex-direction: column;
    min-height: 0;
}
.am-filter-panel--active { display: flex; }
.am-filter-panel__search {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--am-border);
}
.am-filter-panel__search input[type="search"] {
    flex: 1;
    border: 0;
    background: transparent;
    color: var(--am-text);
    font-size: 15px;
    font-family: inherit;
    outline: none;
}
.am-filter-panel__list {
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
.am-filter-loading,
.am-filter-empty {
    padding: 32px 20px;
    text-align: center;
    color: var(--am-text-muted);
    font-size: 14px;
}
.am-filter-item {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border: 0;
    background: transparent;
    color: var(--am-text);
    font-size: 14px;
    font-family: inherit;
    text-align: left;
    border-bottom: 1px solid var(--am-border);
}
.am-filter-item:active { background: var(--am-bg-alt); }
.am-filter-item--active {
    background: rgba(225, 29, 42, 0.08); /* brand %8 */
    color: var(--am-brand);
    font-weight: 700;
}
.am-filter-item__avatar {
    width: 28px; height: 28px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--am-border);
    flex: 0 0 auto;
}
.am-filter-item__label {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.am-filter-item__count {
    flex: 0 0 auto;
    font-size: 12px;
    color: var(--am-text-subtle);
    font-weight: 600;
}
.am-filter-item--active .am-filter-item__count { color: var(--am-brand); }
.am-filter-dialog__foot {
    display: flex;
    gap: 8px;
    padding: 12px 16px;
    border-top: 1px solid var(--am-border);
    background: var(--am-card);
}
.am-filter-dialog__foot .am-btn-pill { flex: 1; }

/* Skeleton (loading) */
.am-search__skeleton[hidden] { display: none; }
.am-search__skeleton {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 12px;
}
.am-skeleton-card {
    display: flex;
    gap: 12px;
    padding: 12px;
    background: var(--am-card);
    border: 1px solid var(--am-border);
    border-radius: var(--am-radius-md);
}
.am-skeleton-card__thumb {
    width: 96px; height: 96px;
    flex: 0 0 96px;
    border-radius: var(--am-radius-sm);
    background: linear-gradient(90deg, var(--am-bg-alt) 0%, var(--am-border) 50%, var(--am-bg-alt) 100%);
    background-size: 200% 100%;
    animation: am-skeleton-shimmer 1.4s linear infinite;
}
.am-skeleton-card__body { flex: 1; min-width: 0; padding-top: 4px; }
.am-skeleton-line {
    height: 12px;
    background: linear-gradient(90deg, var(--am-bg-alt) 0%, var(--am-border) 50%, var(--am-bg-alt) 100%);
    background-size: 200% 100%;
    animation: am-skeleton-shimmer 1.4s linear infinite;
    border-radius: 4px;
    margin-bottom: 8px;
}
.am-skeleton-line--xs { width: 30%; height: 10px; }
.am-skeleton-line--sm { width: 40%; height: 10px; }
.am-skeleton-line--md { width: 70%; }
@keyframes am-skeleton-shimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ===== Kategori chip carousel (header altı) ===== */
.am-cat-chips {
    display: flex;
    gap: 8px;
    padding: 10px 16px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    background: var(--am-bg);
    border-bottom: 1px solid var(--am-border);
    white-space: nowrap;
}
.am-cat-chips::-webkit-scrollbar { display: none; }
.am-cat-chip {
    display: inline-flex;
    align-items: center;
    padding: 6px 14px;
    background: var(--am-bg-alt);
    color: var(--am-text-muted);
    border: 1px solid var(--am-border);
    border-radius: var(--am-radius-pill);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    flex: 0 0 auto;
    transition: background .15s, color .15s;
}
.am-cat-chip:active { background: var(--am-border); }
.am-cat-chip--active {
    background: var(--am-text);
    color: var(--am-bg);
    border-color: var(--am-text);
}

/* ===== Bottom tab bar ===== */
.am-tabs {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 100;
    display: flex;
    background: var(--am-bg);
    border-top: 1px solid var(--am-border);
    padding-bottom: env(safe-area-inset-bottom);
    box-shadow: 0 -2px 12px rgba(0,0,0,.04);
}
.am-tab {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding: 8px 4px 6px;
    background: transparent;
    border: 0;
    color: var(--am-text-subtle);
    text-decoration: none;
    font-family: inherit;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.am-tab:active { background: var(--am-bg-alt); }
.am-tab__label { font-size: 10px; font-weight: 700; letter-spacing: 0.2px; }
.am-tab--active { color: var(--am-brand); }

/* Body — bottom tabs SADECE açıksa altta yer aç */
body.am-has-bottom-tabs {
    padding-bottom: calc(64px + env(safe-area-inset-bottom));
}

/* Spotify mini player bottom tabs üstüne otursun (sadece tabs açıksa) */
body.am-has-bottom-tabs .am-spotify-dialog[open] {
    bottom: calc(64px + env(safe-area-inset-bottom) + 12px);
}

/* ===== Footer link grubu (WP nav menü tree) ===== */
.am-footer__links {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    margin: 16px 0;
    text-align: center;
    font-size: 13px;
}
.am-footer__link {
    color: var(--am-text-muted);
    text-decoration: none;
    font-weight: 600;
}
.am-footer__link:active { color: var(--am-brand); }

.am-footer__group {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    width: 100%;
    max-width: 320px;
    padding-top: 12px;
    border-top: 1px solid var(--am-border);
}
.am-footer__group:first-of-type { border-top: 0; padding-top: 0; }
.am-footer__group-title {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    color: var(--am-text);
    margin-bottom: 2px;
}
.am-footer__group .am-footer__link {
    font-size: 13px;
    font-weight: 500;
}

/* ===== Kayıtlı yazılar sayfası ===== */
.am-saved { background: var(--am-bg); }
.am-saved__inner {
    max-width: 720px;
    margin: 0 auto;
    padding: 20px 16px 32px;
}
.am-saved__title {
    margin: 0 0 6px;
    font-size: 24px;
    font-weight: 800;
    letter-spacing: -0.4px;
    color: var(--am-text);
}
.am-saved__count {
    margin: 0 0 16px;
    font-size: 13px;
    color: var(--am-text-muted);
}
.am-saved__list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.am-saved__list .am-card { margin-bottom: 0; }
.am-saved__empty {
    text-align: center;
    padding: 48px 20px;
}
.am-saved__empty .am-icon {
    margin-bottom: 16px;
    opacity: .6;
}
.am-saved__empty[hidden] { display: none; }
.am-saved__empty h2 {
    margin: 0 0 12px;
    font-size: 18px;
    color: var(--am-text);
    font-weight: 800;
}
.am-saved__empty p {
    margin: 0 0 20px;
    color: var(--am-text-muted);
    line-height: 1.5;
}

/* Kayıtlı kartlardaki "X" remove butonu */
.am-saved-remove {
    border: 0;
    background: transparent;
    width: 28px; height: 28px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--am-text-subtle);
    flex: 0 0 auto;
    cursor: pointer;
}
.am-saved-remove:active { background: var(--am-border); color: var(--am-brand); }

/* search-bar position fix — chips eklenince search bar header+chips altına */
.am-search-bar { top: 0; } /* search.php'de chips yok, search bar header altına yapışır */

/* ===== Collapsible alt menü (hamburger içinde Yasal Belgeler) ===== */
.am-menu-collapsible {
    border-bottom: 1px solid var(--am-border);
}
.am-menu-collapsible > summary {
    list-style: none;
    cursor: pointer;
    padding: 14px 20px;
    font-size: 16px;
    font-weight: 600;
    color: var(--am-text);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.am-menu-collapsible > summary::-webkit-details-marker { display: none; }
.am-menu-collapsible > summary::marker { content: ''; }
.am-menu-collapsible[open] > summary {
    color: var(--am-brand);
}
.am-menu-collapsible[open] .am-collapsible-caret {
    transform: rotate(90deg);
}
.am-collapsible-caret {
    transition: transform .2s ease;
}
.am-menu-collapsible__body {
    background: var(--am-bg-alt);
    padding: 4px 0 8px;
}
.am-menu-collapsible__body a {
    padding: 12px 20px 12px 36px;
    font-size: 14px;
    color: var(--am-text-muted);
    border-bottom: 0;
}
.am-menu-collapsible__body a:active {
    background: var(--am-border);
    color: var(--am-text);
}

/* ===== Statik sayfa (page.php) ===== */
.am-page { background: var(--am-bg); }
.am-page__cover {
    background: var(--am-bg-alt);
}
.am-page__cover img {
    width: 100%;
    height: auto;
    max-height: 50vh;
    object-fit: contain;
    display: block;
    margin: 0 auto;
}
.am-page__inner {
    max-width: 720px;
    margin: 0 auto;
    padding: 20px 16px 32px;
}
.am-page__title {
    margin: 0 0 16px;
    font-size: 28px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.5px;
    color: var(--am-text);
}
/* Page content Elementor markup içerebilir — sadece taşma kontrolü */
.am-page__content {
    overflow-x: hidden;
}
.am-page__content img,
.am-page__content video,
.am-page__content iframe {
    max-width: 100%;
    height: auto;
}
