/* === Shabnam (TTF) === */
@font-face{
  font-family:"Shabnam";
  src: url("../fonts/Shabnam-Light.ttf") format("truetype");
  font-weight:300; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Shabnam";
  src: url("../fonts/Shabnam-Regular.ttf") format("truetype");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Shabnam";
  src: url("../fonts/Shabnam-Medium.ttf") format("truetype");
  font-weight:500; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Shabnam";
  src: url("../fonts/Shabnam-Bold.ttf") format("truetype");
  font-weight:700; font-style:normal; font-display:swap;
}
/* اختیاری */
@font-face{
  font-family:"Shabnam";
  src: url("../fonts/Shabnam-ExtraBold.ttf") format("truetype");
  font-weight:800; font-style:normal; font-display:swap;
}

/* === Shabnam FD (ارقام فارسی) — اختیاری === */
@font-face{
  font-family:"Shabnam FD";
  src: url("../fonts/Shabnam-FD-Regular.ttf") format("truetype");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Shabnam FD";
  src: url("../fonts/Shabnam-FD-Bold.ttf") format("truetype");
  font-weight:700; font-style:normal; font-display:swap;
}


/* راست‌چین سراسری */
html{scroll-behavior:smooth}
html,body{direction:rtl}
*{margin:0;padding:0;box-sizing:border-box}

/* نسخهٔ معمولی */
body{
  font-family:"Shabnam",-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;
  background:linear-gradient(135deg,#1c1c1e 0%,#1C1C1E 100%);
  min-height:100vh;display:flex;justify-content:center;align-items:center;padding:20px;
  color:#fff;text-align:right;
}

/* اگر ارقام فارسی می‌خواهید: */
/*
body{
  font-family:"Shabnam FD","Shabnam",-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;
  ...
}
*/


/* کانتینر */
.container{
  max-width:480px;width:100%;background:#1c1c1e;border-radius:40px;
  padding:50px 30px 40px;box-shadow:0 30px 60px rgba(0,0,0,.5);
  position:relative;overflow:hidden
}
.container::before{
  content:'';position:absolute;top:0;left:0;right:0;height:4px;
  background:linear-gradient(90deg,#c9a961,#f4e4c1,#c9a961)
}



/* هدر */

/* متن فقط برای صفحه‌خوان‌ها (مخفی بصری) */
.visually-hidden{
  position:absolute!important;
  width:1px;height:1px;margin:-1px;border:0;padding:0;
  white-space:nowrap;clip-path:inset(50%);clip:rect(0 0 0 0);overflow:hidden;
}

/* بلوک لوگو */
.logo{ text-align:center; margin-bottom:35px; }

/* اندازه و چینش لوگو تصویری */
.brand-logo{
  display:block;
  max-width:150px;   /* مطابق width ویژگی img */
  width:100%;
  height:auto;
  margin:0 auto 8px; /* وسط‌چین + فاصله پایین */
}

/* واکنش‌گرا: سایز کوچکتر روی موبایل */
@media (max-width:480px){
  .brand-logo{ max-width:180px; }
}

.logo h1{
  font-size:48px;font-weight:300;letter-spacing:8px;color:#fff;text-transform:lowercase;margin-bottom:8px
}
.tagline{font-size:13px;color:#bbb;letter-spacing:.5px}

/* شبکه اجتماعی */
.social-icons{display:flex;justify-content:center;gap:20px;margin:30px 0;padding:0 10px}
.social-icons a{
  width:45px;height:45px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:#2c2c2e;color:#c9a961;font-size:18px;text-decoration:none;transition:all .3s ease;border:1px solid #3a3a3c
}
.social-icons a:hover{
  background:#c9a961;color:#1c1c1e;transform:translateY(-3px);
  box-shadow:0 5px 15px rgba(201,169,97,.3)
}

/* لینک‌ها */
.links-container{margin-top:35px;
/*border-bottom: 1px solid #3a3a3c;*/
padding-bottom:10px;
}
.link-item{
  background:#2c2c2e;border:1.5px solid #3a3a3c;border-radius:15px;padding:18px 25px;margin-bottom:15px;
  display:flex;align-items:center;gap:18px;text-decoration:none;color:#fff;transition:all .3s ease;position:relative;overflow:hidden;
  animation:fadeIn .5s ease forwards;opacity:0
}
.link-item::before{
  content:'';position:absolute;right:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#c9a961,#f4e4c1);
  transform:scaleY(0);transition:transform .3s ease
}
.link-item:hover{border-color:#c9a961;transform:translateX(-5px);box-shadow:0 5px 20px rgba(201,169,97,.2)}
.link-item:hover::before{transform:scaleY(1)}
.link-icon{
  width:40px;height:40px;background:linear-gradient(135deg,#3a3a3c,#2c2c2e);border-radius:10px;display:flex;align-items:center;justify-content:center;
  font-size:18px;color:#c9a961;flex-shrink:0
}
.link-content{flex:1}
.link-title{font-size:16px;font-weight:700;color:#fff;margin-bottom:2px}
.link-subtitle{font-size:12px;color:#bbb}

/* منو */
.menu-section{
  margin-top:35px;
  padding-top:2px;
  text-align:right;            /* کل سکشن راست‌چین بماند */
}

.menu-title{
  font-size:18px;
  font-weight:800;
  color:#fff;
  margin-bottom:20px;
  display:flex;
  align-items:center;
  gap:8px;
  border-top: 1px solid #3a3a3c;
  padding-top: 44px;

  /* کل ردیف را RTL کن تا "شروع" = راست باشد */
  direction: rtl;

  /* ترتیب: primero آیکن، بعد متن (آیکن سمت راستِ متن) */
  flex-direction: row;

  /* در RTL، flex-start یعنی چسبیدن به راست */
  justify-content: flex-start;

  text-align: right;
  width: 100%;
}

.menu-title i{
  color:#c9a961;
  /* اطمینان از عدم وجود حاشیه مزاحم */
  margin:0 !important;
}


/* کاروسل — راست‌چین */
.carousel-container{position:relative;overflow:hidden;border-radius:20px}
.carousel-wrapper{
  display:flex;transition:transform .5s cubic-bezier(.4,0,.2,1);
  /* برای محاسبات حرکت، مسیر داخلی LTR می‌ماند تا ترنزلیت دقیق بماند */
  direction:ltr;
}

/* جلوگیری از دراگ و انتخاب تصویر در کاروسل */
.carousel-container img {
  -webkit-user-drag: none;
  user-select: none;
  pointer-events: auto; /* لازم داریم کلیک/سواپ به دست ما برسد */
}


.menu-card{min-width:100%;background:#2c2c2e;border-radius:20px;overflow:hidden;border:1px solid #3a3a3c}
.menu-card-image{width:100%;height:280px;object-fit:cover;background:linear-gradient(135deg,#3a3a3c,#2c2c2e)}
.menu-card-content{padding:20px}
.menu-card-title{font-size:20px;font-weight:800;color:#fff;margin-bottom:8px}
.menu-card-description{font-size:13px;color:#bbb;line-height:1.8;margin-bottom:15px}
.menu-card-footer{display:flex;justify-content:space-between;align-items:center}
.menu-card-price{font-size:20px;font-weight:900;color:#c9a961}
/* --- FIX: inherit font for controls --- */
button, input, select, textarea { font: inherit; }

/* اگر کلاس اختصاصی داری، همین‌جا نگه دار */
.details-button{
  font-family: inherit;   /* اجباری با ارث‌گیری */
  background: linear-gradient(135deg,#c9a961,#b89554);
  color:#1c1c1e; border:none; padding:10px 24px; border-radius:10px;
  font-size:14px; font-weight:800; cursor:pointer; transition:all .3s ease;
}
.details-button:hover{ transform: translateY(-2px); box-shadow:0 5px 15px rgba(201,169,97,.3); }

/* ناوبری کاروسل — در RTL: قبلی راست، بعدی چپ */
.carousel-nav{
  position:absolute;top:50%;transform:translateY(-50%);background:rgba(201,169,97,.9);color:#1c1c1e;border:none;width:40px;height:40px;
  border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:18px;transition:all .3s ease;z-index:10
}
.carousel-nav:hover{background:#c9a961;transform:translateY(-50%) scale(1.1)}
.carousel-nav.prev{right:15px}
.carousel-nav.next{left:15px}
.carousel-indicators{ direction: rtl; }


/* اندیکاتورها */
.carousel-indicators{display:flex;justify-content:center;gap:8px;margin-top:20px}
.indicator{width:8px;height:8px;border-radius:50%;background:#3a3a3c;cursor:pointer;transition:all .3s ease}
.indicator.active{background:#c9a961;width:24px;border-radius:4px}

/* انیمیشن‌ها */
@keyframes fadeIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.link-item:nth-child(1){animation-delay:.1s}
.link-item:nth-child(2){animation-delay:.2s}
.link-item:nth-child(3){animation-delay:.3s}
.link-item:nth-child(4){animation-delay:.4s}
.link-item:nth-child(5){animation-delay:.5s}
.link-item:nth-child(6){animation-delay:.4s}


/* واکنش‌گرا */
@media (max-width:480px){
  .container{padding:40px 25px 35px;border-radius:30px}
  .logo h1{font-size:42px}
  .carousel-nav{width:35px;height:35px;font-size:16px}
  .carousel-nav.prev{right:10px}
  .carousel-nav.next{left:10px}
}


/* استایل جدید برای آیکون‌ها که حالا به تصاویر تبدیل می‌شوند */
.link-icon {
  width: 70px; /* سایز ثابت برای تصویر */
  height: 70px;
  border-radius: 50%; /* گوشه‌های گرد */
  overflow: hidden; /* برای پنهان کردن هر قسمت اضافی تصویر */
  display: flex;
  align-items: center;
  justify-content: center;
}

.link-icon img {
  width: 100%; /* تصویر به اندازه‌ی مربعی که درونش هست تنظیم می‌شود */
  height: 100%;
  object-fit: cover; /* تصویر به‌طور کامل پوشش داده می‌شود */
}


.menu-card-price {
  display: flex;                /* استفاده از فِلِکس برای چیدمان */
  justify-content: flex-end;    /* چسباندن محتوا به سمت راست */
  align-items: center;          /* تراز کردن عمودی محتوا */
}

.menu-card-price .price {
  font-size: 20px;
  font-weight: 900;
  color: #c9a961;
  margin-left: 5px;  /* فاصله بین قیمت و تومان */
}

.menu-card-price .currency {
  font-size: 16px;  /* سایز کوچک‌تر برای تومان */
  font-weight: 400; /* وزن خط کمتر برای تومان */
  color: #c9a961;   /* رنگ مشابه قیمت */

}



/* ===== Modal (RTL) ===== */
.menu-modal{ position: fixed; inset: 0; display: none; direction: rtl; z-index: 1000; }
.menu-modal.is-open{ display: block; }
.menu-modal__backdrop{ position: absolute; inset: 0; background: rgba(0,0,0,.6); backdrop-filter: blur(2px); }
.menu-modal__dialog{
  position: relative; max-width: 720px; width: calc(100% - 32px);
  margin: 40px auto; background: #1f1f21; border-radius: 20px;
  border: 1px solid #3a3a3c; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,.5);
}
.menu-modal__close{
  position: absolute; top: 10px; left: 10px; width: 40px; height: 40px; border: 0;
  border-radius: 10px; background: #2c2c2e; color: #fff; cursor: pointer;
}
.menu-modal__close:hover{ background:#3a3a3c }
.menu-modal__media img{ display:block; width:100%; height: 320px; object-fit: cover; background:#2c2c2e; }
.menu-modal__body{ padding: 18px 18px 22px; }
.menu-modal__title{ margin: 0 0 12px; font-size: 20px; font-weight: 800; color:#fff; }
.menu-modal__row{ display: grid; grid-template-columns: 130px 1fr; gap: 8px; align-items: start; margin-bottom: 10px; }
.menu-modal__label{ color:#c9a961; font-weight: 700; font-size: 13px; display: inline-flex; gap:6px; align-items:center; }
.menu-modal__value{ margin: 0; color:#ddd; line-height:1.9; font-size:14px; }
@media (max-width: 520px){
  .menu-modal__dialog{ margin: 20px auto; }
  .menu-modal__media img{ height: 240px; }
  .menu-modal__row{ grid-template-columns: 1fr; }
}




/* دکمه بالا رفتن */
.scroll-to-top {
  position: fixed;
  bottom: 30px;
  right: 30px;
  background-color: #c9a961; /* رنگ پس‌زمینه */
  color: #fff; /* رنگ آیکون */
  border: none;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  font-size: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 5px 15px rgba(0,0,0,0.3);
  transition: opacity 0.5s ease, transform 0.3s ease;
  opacity: 0; /* ابتدا دکمه مخفی است */
  visibility: hidden; /* دکمه قابل رویت نیست */
}

/* تغییر رنگ هنگام hover */
.scroll-to-top:hover {
  background-color: #f4e4c1;
  transform: scale(1.1);
}

.scroll-to-top:focus {
  outline: none;
}

.sub-menu-title{
  font-size:18px;
  font-weight:800;
  color:#fff;
  margin-bottom:20px;
  display:flex;
  align-items:center;
  gap:8px;
}
	
	
.sub-menu-section {
  margin-top: 30px;
}

.sub-menu-title {
  font-size: 16px;
  font-weight: 700;
  color: #c9a961;
  margin: 15px 0 12px;
  padding-right: 8px;
  border-right: 3px solid #c9a961;
}


.menu-card-image {
  -webkit-user-drag: none;
  user-drag: none;
  pointer-events: auto;
    width: 100%;
  height: 280px; /* ← این خط حیاتی است */
  object-fit: cover;
  background-color: #2c2c2e; /* پس‌زمینهٔ جایگزین برای زمانی که عکس لود نشود */
  display: block;*/
}




/* پیام پایان بخش — افقی، زیبا و هماهنگ با تم */
.end-of-section-message {
  position: fixed;
  bottom: 80px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(28, 28, 30, 0.85);
  color: #c9a961;
  padding: 10px 16px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.5px;
  backdrop-filter: blur(4px);
  border: 1px solid #3a3a3c;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.4s ease, visibility 0.4s;
  text-align: center;
  /* --- تغییر اصلی: اجازهٔ رفتن به خط بعد --- */
  white-space: normal;
  word-wrap: break-word;
  max-width: 90%;
  pointer-events: none;
}

.end-of-section-message.show {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  cursor: pointer;
}

.end-of-section-message.show:hover {
  background: rgba(44, 44, 46, 0.95);
  transform: translateX(-50%) translateY(-2px);
}

/* برای صفحات بسیار کوچک (مثلاً زیر 320px) */
@media (max-width: 320px) {
  .end-of-section-message {
    font-size: 13px;
    padding: 8px 12px;
    bottom: 75px;
  }
}