/*
 * Projeye özel stiller.
 * Tema dosyaları (app/dist/app.css, app/bootstrap) DEĞİŞTİRİLMEZ; temanın
 * getirmediği ekranlar ve bileşenler yalnızca burada tanımlanır.
 *
 * Renkler temanın paletinden alınmıştır:
 *   koyu zemin  #0e1927
 *   vurgu (altın) #e6c9a2
 */

/* ---------------------------------------------------------------
   BAŞLIK YAZI TİPİ — "Audrey" ailesinin yeniden tanımı

   Temanın başlık fontu Audrey (assets/font/Audrey-*.otf) Türkçeyi
   RENDER EDEMİYOR ve bunu iki ayrı şekilde yapıyor:

     • Ğ ı İ ş Ş  → fontun cmap'inde hiç yok. Tarayıcı harf harf yedek
       fonta düşüyor; bu yüzden bu harfler çevrelerinden farklı ve daha
       ince görünüyordu.
     • Ç Ö Ü ç ö ü → cmap'te "var" görünüyor ama glif çizimleri BOŞ.
       Font sahiplendiği için tarayıcı yedeğe düşmüyor ve bu harfler
       ekranda hiç çıkmıyordu (ör. menüdeki "MENÜ" yazısı "MEN" oluyordu).

   Çözüm: tema dosyalarına dokunulmuyor. Bu dosya app.css'ten SONRA
   yüklendiği için, aynı aile/ağırlık/aralık ile yapılan bu @font-face
   tanımları temanınkini geçersiz kılar. Böylece app.css içindeki 18 ayrı
   "font-family: Audrey" kuralının hiçbirini değiştirmek gerekmez ve
   ileride eklenecek tema sayfaları da kendiliğinden doğru fontu alır.

   Kullanılan font: Playfair Display (SIL Open Font License), Audrey'e
   yakın yüksek kontrastlı klasik serif. Değiştirmek için yalnızca
   aşağıdaki iki src yolunu değiştirmek yeterlidir.
   --------------------------------------------------------------- */

/* Ağırlıklar temanın bildirdikleriyle (400 ve 500) BİREBİR aynı verilir.
   Aksi halde tarayıcı, tam eşleşen tema yüzünü aralık bildiren bu yüze
   tercih edebiliyor ve geçersiz kılma çalışmıyor. */

@font-face {
    font-family: "Audrey";
    src: url("../font/playfair-latin.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    /* latin: Ç ç Ö ö Ü ü ve ASCII burada */
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
                   U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
                   U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Audrey";
    src: url("../font/playfair-latin-ext.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    /* latin-ext: Ğ ğ İ ı Ş ş burada */
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
                   U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF,
                   U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Audrey";
    src: url("../font/playfair-latin.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
                   U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
                   U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Audrey";
    src: url("../font/playfair-latin-ext.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
                   U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF,
                   U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
    --r-dark: #0e1927;
    --r-accent: #e6c9a2;
    --r-muted: #8a94a2;
    --r-line: rgba(230, 201, 162, .25);
    --r-success: #2e9e4f;
    --r-error: #d0342c;
    --r-info: #2f6fdb;
}

/* ---------------------------------------------------------------
   LOGO ÖLÇÜSÜ

   Tema, logoya hiçbir yerde boyut vermez; kendi PNG'lerinin ölçüsüne
   (yaklaşık 190x46) güvenir. Panelden bunlardan büyük bir logo yüklenince
   görsel doğal boyutunda basılıyor ve üst çubuğu şişirip iletişim
   bilgilerini dışarı itiyordu.

   Bu yüzden logonun görüneceği her yere üst sınır konur. Sınırlar tema
   logolarının kendi ölçülerinin üstünde seçilmiştir: varsayılan tema
   görselleri hâlâ birebir eskisi gibi görünür, yalnızca daha büyük
   yüklemeler çerçeveye sığdırılır.

   height/width "auto" bırakılır ki logonun en-boy oranı korunsun.
   --------------------------------------------------------------- */
.top-bar-2 .header__logo img,
.header__logo img,
.sidebar-content > img,
.footer .widget.logo img {
    width: auto;
    height: auto;
    object-fit: contain;
}

.top-bar-2 .header__logo img,
.header__logo img {
    max-height: 50px;
    max-width: 220px;
}

.sidebar-content > img {
    max-height: 56px;
    max-width: 100%;
}

.footer .widget.logo img {
    max-height: 56px;
    max-width: 200px;
}

/* ---------------------------------------------------------------
   İşlem bildirimleri (_Notifications.cshtml)
   Header sabit olduğu için şerit üstte, menünün altında durur.
   --------------------------------------------------------------- */
.site-alerts {
    position: fixed;
    top: 90px;
    right: 20px;
    z-index: 1200;
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: min(420px, calc(100vw - 40px));
}

.site-alert {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 4px;
    border-left: 3px solid var(--r-info);
    background: var(--r-dark);
    color: #fff;
    font-size: 15px;
    line-height: 1.45;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .28);
}

.site-alert--success { border-left-color: var(--r-success); }
.site-alert--error   { border-left-color: var(--r-error); }

.site-alert__close {
    margin-left: auto;
    padding: 0;
    border: 0;
    background: none;
    color: var(--r-accent);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}

/* ---------------------------------------------------------------
   Form doğrulama
   Tema form hatası için bir görünüm getirmiyor.
   --------------------------------------------------------------- */
.field-error,
.form-errors {
    display: block;
    color: #ff8f86;
    font-size: 13px;
    line-height: 1.4;
}

.field-error:not(:empty) { margin-top: 6px; }

.form-errors:not(:empty) {
    margin-bottom: 16px;
    padding: 10px 14px;
    border-left: 3px solid var(--r-error);
    background: rgba(208, 52, 44, .1);
}

.form-errors ul { margin: 0; padding-left: 18px; }

/* Rezervasyon kutusundaki alanlar tema formuyla aynı yükseklikte dursun. */
.opening-book select.form-control { appearance: none; }

/* ---------------------------------------------------------------
   Menü sayfası (/menu)
   Anasayfadaki sekmeli bölümün aksine kategoriler alt alta listelenir.
   --------------------------------------------------------------- */
.menu-list-page { padding: 100px 0; }

.menu-list-page .menu-group + .menu-group { margin-top: 70px; }

.menu-list-page .menu-group .block-text { margin-bottom: 30px; }

.menu-list-page .menu-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 60px;
}

@media (max-width: 767px) {
    .menu-list-page { padding: 60px 0; }
    .menu-list-page .menu-list { grid-template-columns: 1fr; gap: 0; }
}

/* ---------------------------------------------------------------
   Blog listesi ve yazı detayı
   --------------------------------------------------------------- */
.blog-list-page,
.blog-detail-page { padding: 100px 0; }

.mb-30 { margin-bottom: 30px; }

.blog-detail .image { margin-bottom: 30px; }
.blog-detail .image img { width: 100%; border-radius: 4px; }

.blog-detail .meta-line {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 20px;
    padding: 0;
    list-style: none;
    color: var(--r-muted);
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.blog-detail .lead {
    margin-bottom: 24px;
    font-size: 18px;
    line-height: 1.7;
}

.blog-detail .content { line-height: 1.8; }
.blog-detail .content p { margin-bottom: 18px; }
.blog-detail .content img { max-width: 100%; height: auto; }

/* ---------------------------------------------------------------
   Galeri sayfası
   --------------------------------------------------------------- */
.s-gallery { padding: 100px 0; }

.s-gallery .ig-box {
    position: relative;
    overflow: hidden;
    border-radius: 4px;
}

.s-gallery .ig-box img {
    width: 100%;
    height: 320px;
    object-fit: cover;
    transition: transform .5s ease;
}

.s-gallery .ig-box:hover img { transform: scale(1.06); }

/* ---------------------------------------------------------------
   Kurumsal sayfa içeriği ve rezervasyon sayfası
   --------------------------------------------------------------- */
.s-page-content { padding: 90px 0; }

.page-content { line-height: 1.85; }
.page-content p { margin-bottom: 18px; }
.page-content h2,
.page-content h3,
.page-content h4 { margin: 32px 0 14px; }
.page-content ul { padding-left: 20px; margin-bottom: 18px; }

.reservation-page { padding: 90px 0; }

/* ---------------------------------------------------------------
   Hata sayfası
   --------------------------------------------------------------- */
.s-error { padding: 140px 0; }

.s-error .error-code {
    font-size: clamp(80px, 18vw, 180px);
    line-height: 1;
    color: var(--r-accent);
}

.s-error .wrap-btn {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: center;
    margin-top: 30px;
}

.s-error .ref-code { margin-top: 30px; color: var(--r-muted); font-size: 13px; }

/* ---------------------------------------------------------------
   Ortak
   --------------------------------------------------------------- */
.empty-note {
    padding: 60px 0;
    text-align: center;
    color: var(--r-muted);
}