/* ============================================
   MeSite — Sinema teması · yönetim (admin.html)
   atolye-app.css'ten SONRA yüklenir. Sınıf ve id
   adları değişmedi; sayfanın kendi betiği birebir çalışır.
   ============================================ */

.shell { min-height: 100vh; display: flex; flex-direction: column; }
.console {
    flex: 1 1 auto;
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    padding: clamp(22px, 3.4vw, 44px) var(--yan) clamp(44px, 5vw, 72px);
}

.brandline {
    display: inline-flex;
    align-items: baseline;
    gap: 11px;
    margin-bottom: clamp(24px, 3.4vw, 40px);
    color: var(--ak);
}
.brandline:hover { color: var(--ak); }
.brandline span {
    font-family: var(--baslik);
    font-weight: 700;
    font-size: 25px;
    line-height: 1;
    letter-spacing: .03em;
    text-transform: uppercase;
}
.brandline small {
    font-family: var(--baslik);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--zemin);
    background: var(--canon);
    padding: 4px 9px;
}

/* ---------- Kartlar / kapılar ---------- */

.card {
    padding: clamp(22px, 3vw, 36px);
    border: 1px solid var(--cizgi-kart);
    background: var(--yuzey);
}
#gateLogin.card, #gateDenied.card { max-width: 520px; }
#gateDenied.card { border-color: rgba(255, 122, 77, .35); }

.card__title {
    margin: 0;
    font-family: var(--baslik);
    font-weight: 700;
    font-size: clamp(28px, 3.6vw, 46px);
    line-height: 1;
    letter-spacing: -.015em;
    text-transform: uppercase;
    color: var(--ak);
    text-wrap: pretty;
}
.card__lead {
    margin: 16px 0 0;
    max-width: 64ch;
    font-size: 15.5px;
    line-height: 1.75;
    color: var(--metin);
    text-wrap: pretty;
}
.card__lead strong { color: var(--ak); font-weight: 600; }
/* Yalnızca kapı kartlarının kendi çağrı düğmesi — panel içindeki
   araç çubuğu ve tablo düğmeleri bu boşluğu almamalı. */
#gateLogin > .btn, #gateDenied > .btn { margin-top: 20px; }
.c-mail { color: var(--krem); }

/* ---------- Sayaçlar ---------- */

.stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 152px), 1fr));
    gap: 14px;
    margin-top: clamp(22px, 3vw, 32px);
}
.stat {
    padding: 20px 22px;
    border: 1px solid var(--cizgi-kart);
    background: var(--kart);
}
.stat--invited { border-top: 2px solid var(--canon); }
.stat--waiting { border-top: 2px solid var(--krem); }
.stat__n {
    font-family: var(--baslik);
    font-size: 40px;
    font-weight: 700;
    line-height: 1;
    color: var(--ak);
}
.stat--invited .stat__n { color: var(--canon-ac); }
.stat--waiting .stat__n { color: var(--krem); }
.stat__l {
    margin-top: 6px;
    font-family: var(--baslik);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--metin-soluk);
}

/* ---------- Araçlar ---------- */

.tools { display: flex; gap: 10px; flex-wrap: wrap; margin-top: clamp(20px, 2.6vw, 28px); }
.tools .input { flex: 1 1 200px; min-width: 0; padding: 13px 15px; font-size: 15px; }
.tools select.input { flex: 0 0 auto; width: auto; min-width: 168px; }
.tools .btn { flex: 0 0 auto; padding: 13px 22px; }

/* ---------- Tablo ---------- */

.tblwrap { margin-top: 18px; border: 1px solid var(--cizgi-kart); background: var(--kart); overflow-x: auto; }
.tbl { width: 100%; border-collapse: collapse; font-size: 15px; min-width: 560px; }
.tbl thead th {
    text-align: left;
    padding: 11px 16px;
    border-bottom: 1px solid var(--cizgi);
    background: var(--zemin);
    font-family: var(--baslik);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--metin-soluk);
    white-space: nowrap;
}
.tbl tbody td {
    padding: 13px 16px;
    border-bottom: 1px solid rgba(255, 255, 255, .07);
    color: var(--metin);
    vertical-align: middle;
}
.tbl tbody tr:last-child td { border-bottom: none; }
.tbl tbody tr:hover { background: var(--kart-ust); }
.tbl td:first-child { color: var(--ak); }
.tbl td:last-child { text-align: right; white-space: nowrap; }
.tbl .btn { padding: 9px 16px; font-size: 13px; }

/* Durum etiketleri — davetDurumu() şu sınıfları basıyor:
   chip--spark (bekliyor) · chip--canon (kullanıldı)
   chip--champion (eski davet / süresi doldu) · chip--absolute (davetli)
   Tabloda dolu değil, çerçeveli okunuyorlar. */
.tbl .chip { background: none; border: 1px solid rgba(255, 255, 255, .3); color: var(--metin); }
.tbl .chip--spark { border-color: rgba(240, 226, 205, .45); color: var(--krem); }
.tbl .chip--canon { border-color: rgba(127, 212, 168, .5); color: var(--jade); }
.tbl .chip--champion { border-color: rgba(255, 122, 77, .55); color: var(--champion-ac); }
.tbl .chip--absolute { border-color: rgba(91, 140, 255, .5); color: var(--canon-ac); }

.c-time { font-size: 13.5px; color: #8b929c; white-space: nowrap; }
.c-note { margin-top: 4px; font-size: 12px; line-height: 1.5; color: var(--metin-soluk); }
/* td olarak kalmalı: display:flex hücreyi tablo düzeninden çıkarıp
   satır yüksekliğine uzamasını ve alt çizginin hizalanmasını bozuyor. */
.c-act { white-space: nowrap; }
.c-act .btn + .btn { margin-left: 8px; }

.empty { margin: 18px 0 0; font-size: 14.5px; color: var(--metin-soluk); }

.msg { margin-top: 16px; font-size: 14.5px; line-height: 1.7; color: var(--metin); }
.msg:empty { display: none; }
.msg.is-bad { color: var(--danger); }
.msg.is-good { color: var(--jade); }
.msg.is-warn { color: var(--krem); }

/* ---------- Davet bağlantısı ---------- */

.linkbox {
    margin-top: 16px;
    padding: 18px;
    border: 1px solid rgba(240, 226, 205, .32);
    background: rgba(240, 226, 205, .06);
}
.linkbox p { margin: 0; font-size: 14px; line-height: 1.7; color: #c3c9d1; }
.linkbox strong { color: var(--krem); font-weight: 600; }
.linkbox .input { margin-top: 11px; padding: 13px 15px; color: var(--krem); font-size: 14.5px; }

.footnote {
    margin: clamp(24px, 3vw, 34px) 0 0;
    padding-top: 18px;
    border-top: 1px solid var(--cizgi);
    font-size: 13px;
    line-height: 1.7;
    color: var(--metin-soluk);
}
.footnote code { color: var(--krem); background: rgba(240, 226, 205, .08); padding: 2px 6px; font-size: 12.5px; }

.backlink {
    display: inline-block;
    margin-top: clamp(24px, 3vw, 34px);
    font-family: var(--baslik);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--metin-soluk);
    transition: color .25s;
}
.backlink:hover { color: var(--ak); }