:root{
  --toprak:#A8482E;
  --toprak-dark:#7C331F;
  --zeytin:#5B6B3D;
  --zeytin-dark:#414C2C;
  --kum:#F3EEE2;
  --murekkep:#2B2420;
  --altin:#C08A34;
  --beyaz:#FFFFFF;
  --murekkep-soft:#6B6053;
  --cizgi:#E4DCC9;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{background:var(--kum);color:var(--murekkep);font-family:'Work Sans',sans-serif;line-height:1.6;}
h1,h2,h3{font-family:'Fraunces',serif;font-weight:600;color:var(--murekkep);}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px;}

.mozaik-serit{
  height:14px;
  background-image:
    linear-gradient(45deg, var(--toprak) 25%, transparent 25%),
    linear-gradient(-45deg, var(--toprak) 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, var(--altin) 75%),
    linear-gradient(-45deg, transparent 75%, var(--altin) 75%);
  background-size:14px 14px;
  background-position:0 0, 0 7px, 7px -7px, -7px 0px;
  background-color:var(--zeytin);
}

header{background:var(--beyaz);border-bottom:1px solid var(--cizgi);}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;gap:16px;flex-wrap:wrap;}
.marka{display:flex;align-items:center;gap:12px;}
.marka-simge{width:44px;height:44px;border-radius:50%;background:var(--toprak);color:var(--beyaz);display:flex;align-items:center;justify-content:center;font-family:'Fraunces',serif;font-weight:600;font-size:18px;}
.marka-baslik{font-family:'Fraunces',serif;font-weight:600;font-size:17px;}
.marka-alt{font-size:12px;color:var(--murekkep-soft);}
nav{display:flex;gap:26px;font-size:14px;font-weight:500;}
nav a{color:var(--murekkep-soft);}
nav a:hover, nav a.aktif{color:var(--toprak);}

.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;border-radius:6px;font-weight:500;font-size:14px;line-height:1.5;border:1px solid transparent;cursor:pointer;font-family:inherit;}
.btn-toprak{background:var(--toprak);color:var(--beyaz);}
.btn-toprak:hover{background:var(--toprak-dark);}
.btn-outline{background:transparent;border-color:var(--murekkep);color:var(--murekkep);}
.btn-zeytin{background:var(--zeytin);color:var(--beyaz);}
.btn-zeytin:hover{background:var(--zeytin-dark);}
.btn-sm{padding:8px 14px;font-size:12px;}
.btn-tam{width:100%;justify-content:center;}

.sayfa-baslik{padding:48px 24px 8px;}
.sayfa-baslik h1{font-size:30px;margin-bottom:6px;}
.sayfa-baslik p{color:var(--murekkep-soft);font-size:14px;}

.hero{padding:64px 24px;}
.hero-inner{display:grid;grid-template-columns:1.1fr 0.9fr;gap:56px;align-items:center;}
.eyebrow{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--zeytin-dark);margin-bottom:14px;display:block;}
.hero h1{font-size:40px;line-height:1.15;margin-bottom:16px;}
.hero p.lead{font-size:16px;color:var(--murekkep-soft);max-width:480px;margin-bottom:26px;}
.hero-panel{background:var(--zeytin);border-radius:14px;padding:32px;color:var(--kum);aspect-ratio:4/3;display:flex;flex-direction:column;justify-content:space-between;}
.hero-panel .rakam{font-family:'Fraunces',serif;font-size:44px;font-weight:600;}
.hero-panel .rakam-etiket{font-size:13px;opacity:.85;margin-top:2px;}
.hero-panel-alt{border-top:1px solid rgba(255,255,255,.25);padding-top:16px;font-size:14px;opacity:.9;}

section{padding:16px 24px;}
.bolum-baslik{font-size:24px;margin-bottom:6px;}
.bolum-alt{color:var(--murekkep-soft);font-size:14px;margin-bottom:28px;}

.kategori-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.kategori-kart{background:var(--beyaz);border:1px solid var(--cizgi);border-radius:10px;padding:22px;}
.kategori-simge{width:38px;height:38px;border-radius:8px;background:var(--kum);display:flex;align-items:center;justify-content:center;margin-bottom:14px;color:var(--toprak);font-size:15px;font-weight:600;}
.kategori-kart h3{font-size:16px;margin-bottom:6px;}
.kategori-kart p{font-size:13px;color:var(--murekkep-soft);}

.urun-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.urun-kart{background:var(--beyaz);border:1px solid var(--cizgi);border-radius:10px;overflow:hidden;display:flex;flex-direction:column;}
.urun-gorsel{position:relative;aspect-ratio:1/1;flex:none;background:linear-gradient(135deg,var(--kum),#E7DEC8);display:flex;align-items:center;justify-content:center;color:var(--murekkep-soft);font-size:12px;overflow:hidden;}
.urun-gorsel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.urun-detay{padding:16px;display:flex;flex-direction:column;gap:10px;flex:1;}
.urun-detay h3{font-family:'Work Sans',sans-serif;font-weight:600;font-size:14px;}
.urun-detay .aciklama{font-size:12px;color:var(--murekkep-soft);flex:1;}
.urun-alt{display:flex;align-items:center;justify-content:space-between;}
.fiyat{font-family:'Fraunces',serif;font-weight:600;font-size:15px;}
.stok-yok{font-size:11px;color:var(--toprak-dark);font-weight:600;}

.form-alan{margin-bottom:18px;}
.form-alan label{display:block;font-size:13px;font-weight:500;margin-bottom:6px;}
.form-alan input, .form-alan textarea, .form-alan select{
  width:100%;padding:11px 12px;border:1px solid var(--cizgi);border-radius:6px;
  font-family:inherit;font-size:14px;background:var(--beyaz);color:var(--murekkep);
}
.form-alan textarea{resize:vertical;min-height:90px;}
.form-alan input:focus, .form-alan textarea:focus, .form-alan select:focus{outline:2px solid var(--zeytin);outline-offset:1px;}

.kart{background:var(--beyaz);border:1px solid var(--cizgi);border-radius:12px;padding:24px;}
.uyari{background:#F6E9DE;border:1px solid var(--altin);color:#5C3E12;padding:14px 16px;border-radius:8px;font-size:13px;margin-bottom:20px;}
.hata{background:#FBE4E1;border:1px solid var(--toprak);color:var(--toprak-dark);padding:14px 16px;border-radius:8px;font-size:13px;margin-bottom:20px;}

.tablo{width:100%;border-collapse:collapse;font-size:14px;}
.tablo th{text-align:left;font-size:12px;color:var(--murekkep-soft);text-transform:uppercase;letter-spacing:.04em;padding:10px 8px;border-bottom:1px solid var(--cizgi);}
.tablo td{padding:12px 8px;border-bottom:1px solid var(--cizgi);}

.rozet{display:inline-block;padding:4px 10px;border-radius:20px;font-size:11px;font-weight:600;}
.rozet-beklemede{background:#F6E9DE;color:#8A5A16;}
.rozet-onaylandi{background:#E4EEDA;color:var(--zeytin-dark);}
.rozet-hazirlaniyor{background:#DEE9F6;color:#2C557C;}
.rozet-tamamlandi{background:#D9EEE0;color:#1F6B41;}
.rozet-iptal{background:#FBE4E1;color:var(--toprak-dark);}

footer{background:var(--murekkep);color:#E7DEC8;padding:48px 24px 28px;margin-top:32px;}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px;margin-bottom:32px;}
.footer-grid h4{font-size:13px;text-transform:uppercase;letter-spacing:.06em;margin-bottom:14px;color:#C9BFA9;}
.footer-grid p, .footer-grid a{font-size:14px;color:#D8CFBB;display:block;margin-bottom:8px;}
.footer-alt{border-top:1px solid rgba(255,255,255,.12);padding-top:20px;font-size:12px;color:#A69C87;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;}

@media(max-width:860px){
  .hero-inner{grid-template-columns:1fr;}
  .kategori-grid{grid-template-columns:1fr;}
  .urun-grid{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:1fr;}
  nav{display:none;}
}

/* --- Kargo durum rozetleri --- */
.rozet-kargoda{background:#E8E3F6;color:#4A3A85;}
.rozet-teslim_edildi{background:#D9EEE0;color:#1F6B41;}

/* --- Logo --- */
.marka-logo{height:44px;width:auto;max-width:160px;object-fit:contain;display:block;}

/* --- Karşılama görseli --- */
.hero-gorsel{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:4/3;}
.hero-gorsel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}

/* --- Etkinlik kartları --- */
.etkinlik-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:24px;}
.etkinlik-kart{background:var(--beyaz);border:1px solid var(--cizgi);border-radius:10px;overflow:hidden;display:flex;flex-direction:column;}
.etkinlik-gorsel{position:relative;background:var(--kum);aspect-ratio:16/9;flex:none;overflow:hidden;display:flex;align-items:center;justify-content:center;color:var(--murekkep-soft);font-size:13px;}
.etkinlik-gorsel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}
.etkinlik-gorsel .rozet{position:absolute;top:10px;left:10px;box-shadow:0 1px 4px rgba(0,0,0,.15);}
.etkinlik-detay{padding:18px;display:flex;flex-direction:column;gap:6px;}
.etkinlik-detay h3{font-size:16px;}
.etkinlik-detay .aciklama{font-size:13px;color:var(--murekkep-soft);}
.etkinlik-tarih{font-size:12px;font-weight:600;color:var(--toprak-dark);text-transform:uppercase;letter-spacing:.03em;}

/* --- Etkinlik durum rozetleri --- */
.rozet-yakinda{background:#DEE9F6;color:#2C557C;}
.rozet-suan{background:#E4EEDA;color:var(--zeytin-dark);}
.rozet-bitti{background:#EEEAE2;color:#8B8272;}

@media(max-width:860px){
  .etkinlik-grid{grid-template-columns:1fr;}
}

/* --- Sayfa içi bağlantılarda yumuşak kaydırma --- */
html{scroll-behavior:smooth;}
#hakkimizda, #iletisim, #etkinlikler{scroll-margin-top:24px;}

/* --- Tek tıkla kopyalanabilir takip numarası --- */
.kopya-btn{
  display:inline-flex;align-items:center;gap:4px;
  background:var(--kum);border:1px dashed var(--cizgi);border-radius:6px;
  padding:3px 8px;font-family:inherit;font-size:12px;color:var(--murekkep);
  cursor:pointer;letter-spacing:.02em;
}
.kopya-btn:hover{border-color:var(--toprak);color:var(--toprak-dark);}
.kopya-btn.kopyalandi{background:#E4EEDA;border-color:#BCD3A4;color:var(--zeytin-dark);}

/* ================= Mobil uyarlama ================= */
@media(max-width:860px){
  /* Menü: gizlemek yerine yatay kaydırılabilir şerit */
  nav{display:flex;order:3;width:100%;overflow-x:auto;gap:20px;padding:6px 0 2px;scrollbar-width:none;}
  nav::-webkit-scrollbar{display:none;}
  nav a{white-space:nowrap;}

  .hero{padding:36px 24px;}
  .hero h1{font-size:28px;}
  .sayfa-baslik h1{font-size:24px;}

  /* Kart ızgaraları: tek kart sergilenen, parmakla kaydırılan slider */
  .urun-grid,.etkinlik-grid,.kategori-grid{
    display:flex;overflow-x:auto;gap:14px;padding:4px 2px 10px;
    scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;
  }
  .urun-grid::-webkit-scrollbar,.etkinlik-grid::-webkit-scrollbar,.kategori-grid::-webkit-scrollbar{display:none;}
  .urun-grid>*,.etkinlik-grid>*{flex:0 0 85%;min-width:85%;scroll-snap-align:center;}
  .kategori-grid>*{flex:0 0 72%;min-width:72%;scroll-snap-align:center;}

  /* Çift kolonlu sayfalar alt alta (Hesabım, sipariş, ürün detay...) */
  .mobil-tek{display:block !important;}
  .mobil-tek>*{margin-bottom:20px;}

  /* Tablolar kart içinde yana kaydırılabilir */
  .tablo{display:block;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch;}
  .tablo td,.tablo th{white-space:nowrap;}

  .footer-alt{flex-direction:column;text-align:center;}
}

/* Admin panel mobil: özet kartları alt alta, formlardaki ikili alanlar tek kolon */
@media(max-width:860px){
  .ozet-kartlar{display:grid !important;grid-template-columns:1fr 1fr !important;}
  .form-alan input, .form-alan textarea, .form-alan select{font-size:16px;} /* iOS'ta odaklanınca zoom yapmasın */
}

/* ================= Masaüstü slider (ana sayfa kartları) ================= */
.kaydirak{
  display:flex;overflow-x:auto;gap:20px;padding:4px 2px 12px;
  scroll-snap-type:x mandatory;scroll-behavior:smooth;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.kaydirak::-webkit-scrollbar{display:none;}
.urun-grid.kaydirak>*{flex:0 0 calc(25% - 15px);min-width:calc(25% - 15px);scroll-snap-align:start;}
.etkinlik-grid.kaydirak>*{flex:0 0 calc(33.333% - 14px);min-width:calc(33.333% - 14px);scroll-snap-align:start;}
.kategori-grid.kaydirak>*{flex:0 0 calc(33.333% - 14px);min-width:calc(33.333% - 14px);scroll-snap-align:start;}

.kaydirak-sarici{position:relative;}
.kaydirak-ok{
  position:absolute;top:50%;transform:translateY(-50%);
  width:38px;height:38px;border-radius:50%;
  background:var(--beyaz);border:1px solid var(--cizgi);
  box-shadow:0 2px 10px rgba(0,0,0,.14);
  font-size:22px;line-height:1;cursor:pointer;z-index:5;
  color:var(--murekkep);display:flex;align-items:center;justify-content:center;
}
.kaydirak-ok:hover{border-color:var(--toprak);color:var(--toprak);}
.kaydirak-ok-geri{left:-16px;}
.kaydirak-ok-ileri{right:-16px;}

@media(max-width:860px){
  /* Mobilde tek kart görünümü korunur, oklar gizlenir (parmakla kaydırılır) */
  .kaydirak-ok{display:none;}
  .urun-grid.kaydirak>*,.etkinlik-grid.kaydirak>*{flex:0 0 85%;min-width:85%;scroll-snap-align:center;}
  .kategori-grid.kaydirak>*{flex:0 0 72%;min-width:72%;scroll-snap-align:center;}
}

/* ====== Admin tabloları: mobilde sadeleşmiş görünüm ======
   Gereksiz sütunlar (.mobil-gizle) gizlenir; tüm bilgiler satırdaki
   mevcut "Detay"/"Düzenle" butonundan görülür. */
@media(max-width:860px){
  .admin-main .tablo{display:table;width:100%;white-space:normal;overflow:visible;}
  .admin-main .tablo th,
  .admin-main .tablo td{white-space:normal;padding:10px 6px;overflow-wrap:anywhere;}
  .admin-main .tablo .mobil-gizle{display:none;}
  /* İşlem sütunu: butonların yazısı kırılmasın, sütun kadar yer kaplasın */
  .admin-main .tablo td:last-child{width:1%;}
  .admin-main .tablo .btn{white-space:nowrap;overflow-wrap:normal;}
  .admin-main .tablo .btn-sm{padding:7px 9px;font-size:11px;}
  .admin-main .tablo .islem-butonlari{gap:4px;}
  .admin-main .tablo td:last-child{white-space:nowrap;}
  .admin-main .tablo .sayi{white-space:nowrap;width:1%;}
}

/* İşlem sütunundaki butonlar (form içindekiler dahil) hep yan yana dursun */
.islem-butonlari{display:flex;gap:6px;align-items:center;}
.islem-butonlari form{display:inline-flex;}

/* Sipariş detayındaki ürün tablosu: mobilde birim fiyat ürün adının altına iner */
.birim-mobil{display:none;}
@media(max-width:860px){
  .admin-main .tablo-kalem{font-size:13px;}
  .admin-main .tablo-kalem th,
  .admin-main .tablo-kalem td{padding:10px 4px;}
  .admin-main .tablo-kalem th:not(:first-child),
  .admin-main .tablo-kalem td:not(:first-child){white-space:nowrap;text-align:right;width:1%;}
  .birim-mobil{display:block;font-size:11px;color:var(--murekkep-soft);margin-top:2px;}
}