/* منوی ریلی کلیسا — استایل سمت کاربر */

:root{
  --chnav-rail:#1B1C1E;
  --chnav-accent:#6FAF8C;
  --chnav-ink:#17181A;
  --chnav-ink-2:rgba(23,24,26,.62);
  --chnav-ink-3:rgba(23,24,26,.42);
  --chnav-glass:rgba(255,255,255,.62);
  --chnav-edge:rgba(255,255,255,.60);
  --chnav-blur:16px;
  --chnav-dim:.75;
  --chnav-zoom:1.012;
  --chnav-icon:21px;
  --chnav-btn:44px;
  --chnav-radius:26px;
  --chnav-gap:4px;
  --chnav-logo:26px;
  --chnav-ease:cubic-bezier(.22,.61,.36,1);
}

/* ───── محو شدن صفحه ───── */
/* کلاس مستقیم روی عناصر گذاشته می‌شود، نه با سلکتور فرزند —
   اینطور قالب نمی‌تواند خنثی‌اش کند و نوار مدیریت هم استثنا می‌شود. */
.chnav-dimmable{
  transition:filter .5s var(--chnav-ease),opacity .5s var(--chnav-ease),transform .5s var(--chnav-ease);
}
body.chnav-open .chnav-dimmable,
body.chnav-books-open .chnav-dimmable{
  filter:blur(var(--chnav-blur)) saturate(.85)!important;
  opacity:var(--chnav-dim)!important;
  transform:scale(var(--chnav-zoom))!important;
}


/* ───── بازنشانی دکمه‌ها ─────
   قالب‌های وردپرس معمولاً برای <button> رنگ و کادر تحمیل می‌کنند.
   این بلوک هر استایل بیرونی را خنثی می‌کند. */
.chnav-rail button,
.chnav-veil button:not(.chnav-chip):not([type="submit"]),
.chnav-books button{
  -webkit-appearance:none!important;appearance:none!important;
  background:transparent!important;
  background-image:none!important;
  border:0!important;
  border-radius:0;
  box-shadow:none!important;
  text-shadow:none!important;
  text-transform:none!important;
  letter-spacing:normal!important;
  font-family:inherit!important;
  min-width:0!important;min-height:0!important;
  margin:0!important;
  line-height:1!important;
  cursor:pointer;
}
.chnav-rail button:hover,.chnav-rail button:focus,
.chnav-veil button:not(.chnav-chip):not([type="submit"]):hover,
.chnav-veil button:not(.chnav-chip):not([type="submit"]):focus,
.chnav-books button:hover,.chnav-books button:focus{
  box-shadow:none!important;
  border:0!important;
  outline:none;
}
.chnav-rail button::-moz-focus-inner,
.chnav-veil button::-moz-focus-inner,
.chnav-books button::-moz-focus-inner,
.chnav-veil input::-moz-focus-inner{border:0!important;padding:0!important}

/* ───── ریل ───── */
.chnav-rail{
  position:fixed;top:50%;transform:translateY(-50%);z-index:99990;
  display:flex;flex-direction:column;gap:12px;align-items:center;
  max-height:calc(100vh - 32px);overflow-y:auto;scrollbar-width:none;
  direction:rtl;
}
.chnav-rail::-webkit-scrollbar{display:none}
.chnav-pill{
  background:var(--chnav-rail);border-radius:var(--chnav-radius);padding:10px 8px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;flex:none;
  box-shadow:0 18px 40px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.10);
}
.chnav-mark{
  width:var(--chnav-btn);height:var(--chnav-btn);display:grid;place-items:center;flex:none;
  opacity:.95;transition:opacity .25s;
}
.chnav-mark:hover{opacity:1}
.chnav-mark img{width:var(--chnav-logo);height:var(--chnav-logo);object-fit:contain;display:block}
.chnav-sep{width:20px;height:1px;background:rgba(255,255,255,.16);margin:8px 0;flex:none}
.chnav-sep-sm{margin:5px 0}
#chnavNav{display:flex;flex-direction:column;gap:var(--chnav-gap);align-items:center}

.chnav-btn{
  position:relative;width:var(--chnav-btn);height:var(--chnav-btn);padding:0!important;
  border-radius:calc(var(--chnav-radius) * .5)!important;display:grid;place-items:center;cursor:pointer;flex:none;
  color:rgba(255,255,255,.62);transition:color .25s,background .25s;
  text-decoration:none;
}
.chnav-btn svg{
  width:var(--chnav-icon);height:var(--chnav-icon);fill:none;stroke:currentColor;
  stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;
}
.chnav-rail .chnav-btn:hover,
.chnav-rail .chnav-btn:focus-visible{
  color:#fff!important;background:rgba(255,255,255,.12)!important;outline:none;
}
.chnav-btn:focus-visible{box-shadow:0 0 0 2px rgba(255,255,255,.85)}
.chnav-rail .chnav-btn.is-current{color:#fff!important;background:rgba(255,255,255,.14)!important}
.chnav-btn.is-current::before{
  content:"";position:absolute;top:50%;transform:translateY(-50%);
  width:3px;height:16px;border-radius:2px;background:var(--chnav-accent);
}
.chnav-rail[data-side="right"] .chnav-btn.is-current::before{right:-9px}
.chnav-rail[data-side="left"] .chnav-btn.is-current::before{left:-9px}

/* ───── پرده ───── */
.chnav-veil{
  position:fixed;inset:0;z-index:99980;pointer-events:none;
  display:flex;align-items:center;justify-content:center;
  opacity:0;transition:opacity .4s var(--chnav-ease);
  font-family:'Vazirmatn',system-ui,sans-serif;text-align:center;direction:rtl;
}
body.chnav-open .chnav-veil{opacity:1;pointer-events:auto}
.chnav-veil-in{transform:translateY(14px);transition:transform .5s var(--chnav-ease);padding:0 24px}
body.chnav-open .chnav-veil-in{transform:none}
.chnav-veil-title{
  font-family:'Vazirmatn',sans-serif;font-weight:200;
  font-size:clamp(34px,6.2vw,68px);line-height:1.5;color:var(--chnav-ink);margin:0;
}
.chnav-veil-title a{color:inherit;text-decoration:none;display:inline-block;transition:opacity .25s}
.chnav-veil-title a:hover{opacity:.62}
.chnav-veil-desc{margin-top:6px;font-size:15px;color:var(--chnav-ink-2);font-weight:300}
.chnav-veil-sub{margin-top:26px;display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.chnav-veil .chnav-veil-sub a,
.chnav-veil .chnav-veil-sub button.chnav-chip{
  -webkit-appearance:none!important;appearance:none!important;
  background:var(--chnav-glass)!important;
  background-image:none!important;
  border:1px solid var(--chnav-edge)!important;
  box-shadow:none!important;text-shadow:none!important;
  text-transform:none!important;letter-spacing:normal!important;
  min-width:0!important;min-height:0!important;margin:0!important;
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  padding:8px 18px!important;border-radius:999px!important;
  font-size:14px;color:var(--chnav-ink)!important;
  text-decoration:none;cursor:pointer;font-family:inherit!important;
  font-weight:300;line-height:1.6!important;
  transition:background .25s,transform .25s;
}
.chnav-veil .chnav-veil-sub a:hover,
.chnav-veil .chnav-veil-sub button.chnav-chip:hover{
  background:#fff!important;transform:translateY(-2px);
}
.chnav-veil-sub a:focus-visible,
.chnav-veil-sub button.chnav-chip:focus-visible,
.chnav-veil-title a:focus-visible{outline:2px solid var(--chnav-ink);outline-offset:3px}

/* ───── لوگوی پرده ───── */
.chnav-veil-logo{
  position:absolute;bottom:34px;display:block;
  opacity:0;transform:translateY(10px);
  transition:opacity .5s var(--chnav-ease) .1s,transform .5s var(--chnav-ease) .1s;
}
body.chnav-open .chnav-veil-logo{opacity:.72;transform:none}
a.chnav-veil-logo:hover{opacity:1}
.chnav-veil-logo img{
  width:var(--chnav-vlogo,64px);height:auto;max-height:calc(var(--chnav-vlogo,64px) * 1.4);
  object-fit:contain;display:block;
}
.chnav-vl-center{left:50%;transform:translateX(-50%) translateY(10px)}
body.chnav-open .chnav-vl-center{transform:translateX(-50%)}
.chnav-vl-right{right:44px}
.chnav-vl-left{left:44px}
@media(max-width:900px){
  .chnav-veil-logo{bottom:110px}
  .chnav-vl-right{right:24px}
  .chnav-vl-left{left:24px}
}

/* ───── توضیح پاپ‌آپ سفارشی ───── */
.chnav-books-desc{
  font-size:13px;font-weight:300;color:var(--chnav-ink-2);
  padding:0 24px 4px;line-height:1.9;
}
.chnav-blist a.chnav-noteless b{display:none}

/* ───── بازنشانی ورودی‌ها ───── */
.chnav-veil input,
.chnav-books input{
  -webkit-appearance:none!important;appearance:none!important;
  box-shadow:none!important;text-transform:none!important;
  letter-spacing:normal!important;min-height:0!important;margin:0!important;
  font-family:inherit!important;
}

/* ───── فرم جست‌وجو ───── */
.chnav-search-form{margin-top:26px;display:flex;justify-content:center;gap:10px}
.chnav-search-form input{
  width:min(420px,72vw);border:1px solid var(--chnav-edge);background:var(--chnav-glass);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-radius:999px;padding:14px 22px;font-family:inherit;font-size:15px;font-weight:300;
  color:var(--chnav-ink);outline:none;text-align:right;
}
.chnav-search-form input:focus{background:#fff}
.chnav-veil .chnav-search-form button{
  -webkit-appearance:none!important;appearance:none!important;
  background:var(--chnav-rail)!important;
  background-image:none!important;
  color:#fff!important;border:0!important;
  box-shadow:none!important;text-shadow:none!important;
  text-transform:none!important;letter-spacing:normal!important;
  min-width:0!important;min-height:0!important;margin:0!important;
  font-family:inherit!important;cursor:pointer;
  border-radius:999px!important;padding:0 26px!important;
  font-size:14px;line-height:1!important;transition:transform .25s;
}
.chnav-search-form button:hover{transform:translateY(-2px)}

/* ───── فهرست کتاب‌ها ───── */
.chnav-books{
  position:fixed;inset:0;z-index:99985;display:flex;align-items:center;justify-content:center;
  padding:5vh 110px;opacity:0;pointer-events:none;transition:opacity .4s var(--chnav-ease);
  direction:rtl;font-family:'Vazirmatn',system-ui,sans-serif;
}
body.chnav-books-open .chnav-books{opacity:1;pointer-events:auto}
.chnav-books-panel{
  width:min(1040px,100%);max-height:86vh;display:flex;flex-direction:column;overflow:hidden;
  background:rgba(255,255,255,.72);border:1px solid var(--chnav-edge);border-radius:26px;
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  box-shadow:0 30px 70px rgba(0,0,0,.18);
  transform:translateY(18px);transition:transform .45s var(--chnav-ease);
}
body.chnav-books-open .chnav-books-panel{transform:none}
.chnav-books-head{
  display:flex;align-items:center;gap:14px;padding:20px 24px;
  border-bottom:1px solid rgba(23,24,26,.10);
}
.chnav-books .chnav-books-back,
.chnav-books .chnav-books-close{
  width:36px!important;height:36px!important;flex:none;
  border-radius:10px!important;display:grid;place-items:center;
  padding:0!important;color:var(--chnav-ink-3)!important;
  transition:color .25s,background .25s;
}
.chnav-books .chnav-books-back:hover,
.chnav-books .chnav-books-close:hover{
  color:var(--chnav-ink)!important;
  background:rgba(23,24,26,.06)!important;
}
.chnav-books-back:focus-visible,.chnav-books-close:focus-visible{
  outline:2px solid var(--chnav-ink);outline-offset:2px;
}
.chnav-books-back svg,.chnav-books-close svg{
  width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round;
}
.chnav-books-title{font-size:21px;font-weight:400;color:var(--chnav-ink);line-height:1.5}
.chnav-books-count{font-size:12px;font-weight:300;color:var(--chnav-ink-3)}
.chnav-books-find{
  margin-right:auto;width:min(240px,32vw);border:1px solid var(--chnav-edge);
  background:rgba(255,255,255,.5);border-radius:999px;padding:10px 16px;
  font-family:inherit;font-size:14px;font-weight:300;color:var(--chnav-ink);outline:none;
}
.chnav-books-find:focus{background:#fff}
.chnav-books-body{overflow-y:auto;padding:20px 24px 28px}
.chnav-bgroup{margin-bottom:22px}
.chnav-bgroup h4{
  font-size:12px;font-weight:300;color:var(--chnav-ink-3);
  margin:0 0 8px;padding-right:12px;
}
.chnav-blist{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:2px}
.chnav-blist a{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:9px 12px;border-radius:12px;font-size:14.5px;font-weight:300;
  color:var(--chnav-ink);text-decoration:none;transition:background .2s;
}
.chnav-blist a:hover{background:#fff}
.chnav-blist a b{font-weight:300;font-size:11.5px;color:var(--chnav-ink-3);white-space:nowrap}

/* ───── موبایل ───── */
/* ───── نشانگر اسکرول در موبایل ───── */
.chnav-scroll-hint{display:none}

@media(max-width:900px){
  .chnav-rail{position:fixed}
  .chnav-scroll-hint{
    display:grid;place-items:center;position:absolute;top:0;bottom:0;width:30px;
    pointer-events:none;z-index:3;color:#fff;opacity:0;
    transition:opacity .3s var(--chnav-ease);
  }
  .chnav-scroll-hint.is-on{opacity:.9}
  .chnav-scroll-hint svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
  .chnav-hint-start{right:0;border-radius:0 var(--chnav-radius) var(--chnav-radius) 0;
    background:linear-gradient(to left,var(--chnav-rail) 45%,transparent)}
  .chnav-hint-end{left:0;border-radius:var(--chnav-radius) 0 0 var(--chnav-radius);
    background:linear-gradient(to right,var(--chnav-rail) 45%,transparent)}

  .chnav-rail{
    top:auto!important;bottom:14px;right:50%!important;left:auto!important;
    transform:translateX(50%);flex-direction:row;max-width:calc(100vw - 24px);max-height:none;
  }
  .chnav-pill{
    flex-direction:row;padding:8px;overflow-x:auto;max-width:100%;
    justify-content:flex-start;position:relative;
    scrollbar-width:none;scroll-behavior:smooth;
  }
  .chnav-pill::-webkit-scrollbar{display:none}
  #chnavNav{flex-direction:row;gap:var(--chnav-gap)}
  .chnav-mark{display:none}
  .chnav-sep{display:none}
  .chnav-sep-sm{display:block;width:1px;height:22px;margin:0 5px;align-self:center;flex:none}
  #chnavNav{flex-direction:row}
  .chnav-btn.is-current::before{
    right:50%!important;left:auto!important;top:auto;bottom:-7px;
    transform:translateX(50%);width:16px;height:3px;
  }
  .chnav-books{padding:12px 12px 100px}
  .chnav-books-head{flex-wrap:wrap}
  .chnav-books-find{width:100%;order:3;margin-right:0}
  .chnav-blist{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
}

@media(prefers-reduced-motion:reduce){
  body.chnav-open .chnav-dimmable,
  body.chnav-books-open .chnav-dimmable{
    filter:none!important;transform:none!important;opacity:.4!important;
  }
  *{transition-duration:.001s!important;animation:none!important}
}
