/*
Theme Name: Yasguard News
Theme URI: https://yasguard.ir
Author: Yasguard
Description: قالب خبری اختصاصی یاس گارد
Version: 1.0.0
Text Domain: yasguard-news
*/

@font-face{
  font-family:"Vazirmatn";
  src:url("assets/fonts/Vazirmatn.ttf") format("truetype");
  font-display:swap;
}

:root{
  --brand:#4361ee;
  --brand2:#3a56d4;
  --bg:#f6f8ff;
  --card:#ffffff;
  --text:#0f172a;
  --muted:#64748b;
  --border:rgba(15,23,42,.10);
  --shadow:0 14px 40px rgba(2,6,23,.08);
  --r:24px;
  --singleMax:1080px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Vazirmatn, Tahoma, Arial, sans-serif;
  direction:rtl;
  background:linear-gradient(180deg,var(--bg),#fff 420px);
  color:var(--text);
  padding-bottom:18px;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
@media(max-width:640px){
  body{padding-bottom:14px}
}

a{color:inherit}
img{max-width:100%;height:auto}
button,input,select,textarea{font-family:inherit}

.container{
  width:100%;
  max-width:1140px;
  margin:0 auto;
  padding:0 16px;
}

body.single .container{
  max-width:1320px;
  padding:0 12px;
}
@media(max-width:640px){
  body.single .container{padding:0 10px}
}

.card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--r);
  box-shadow:var(--shadow);
}

.notice{
  padding:14px;
  color:var(--muted);
  line-height:1.9;
}

.sectionTitle{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:14px 16px;
  border-bottom:1px solid var(--border);
}
.sectionTitle h2{margin:0;font-size:16px;font-weight:900}
.sectionTitle .link{color:var(--brand);text-decoration:none;font-size:13px;font-weight:800}

.siteTop{
  position:sticky;
  top:0;
  z-index:50;
  background:linear-gradient(135deg,var(--brand),var(--brand2));
  box-shadow:0 12px 30px rgba(15,23,42,.12);
  padding:14px 0;
}
body.admin-bar .siteTop{top:32px}
@media(max-width:782px){body.admin-bar .siteTop{top:46px}}

.siteTop + .container{margin-top:18px}
@media(max-width:640px){.siteTop + .container{margin-top:14px}}

.brandBox{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
  text-decoration:none;
  color:#fff;
}
.logo{
  width:46px;
  height:46px;
  border-radius:16px;
  background:linear-gradient(135deg,rgba(67,97,238,.98),rgba(46,196,182,.62));
  box-shadow:0 14px 30px rgba(67,97,238,.18);
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.55);
  flex:0 0 auto;
}
.logo svg{width:26px;height:26px}

.brandText{line-height:1.12;min-width:0}
.brandText .t1{
  font-weight:950;
  font-size:15px;
  letter-spacing:-.2px;
  color:#fff;
}
.brandText .t2{
  color:rgba(255,255,255,.85);
  font-weight:900;
  font-size:13px;
  margin-top:4px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:min(560px,78vw);
}

.posts{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  padding:14px;
}
@media(max-width:980px){
  .posts{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  .posts{grid-template-columns:1fr}
}

.postCard{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:12px;
  border-radius:18px;
  border:1px solid var(--border);
  background:rgba(248,249,252,.92);
  height:100%;
  min-width:0;
}

.postCardThumb{
  width:100%;
  aspect-ratio:16/9;
  border-radius:16px;
  overflow:hidden;
  background:linear-gradient(135deg,rgba(67,97,238,.22),rgba(58,86,212,.10));
  border:1px solid rgba(67,97,238,.15);
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
}
.postCardThumb img{width:100%;height:100%;object-fit:cover;display:block}

.postCardBody{
  flex:1;
  display:flex;
  flex-direction:column;
  min-width:0;
}

.postCardTitle{
  margin:0 0 8px;
  font-weight:900;
  font-size:15px;
  line-height:1.9;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.postCardTitle a{text-decoration:none}

.postMeta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  color:var(--muted);
  font-size:12px;
  margin-bottom:8px;
}

.postMeta .views{display:inline-flex;align-items:center;gap:6px}
.postMeta .viewsNum{font-weight:900;min-width:2.2em;display:inline-block}
.postMeta .views.loading .viewsNum{opacity:.7}

.pill{
  display:inline-flex;
  align-items:center;
  padding:4px 10px;
  border-radius:999px;
  border:1px solid rgba(67,97,238,.22);
  background:rgba(67,97,238,.10);
  color:var(--brand2);
  font-weight:800;
  text-decoration:none;
  font-size:12px;
}

.postExcerpt{
  margin:0;
  color:#24314d;
  line-height:1.95;
  font-size:13px;
  flex:1;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  overflow-wrap:anywhere;
  word-break:break-word;
}

.readMore{
  margin-top:auto;
  width:100%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(67,97,238,.22);
  background:rgba(67,97,238,.10);
  color:var(--brand2);
  text-decoration:none;
  font-weight:900;
  font-size:13px;
}

.pagination{padding:0 14px 14px;display:flex;justify-content:center}
.nav-links{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.page-numbers{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:40px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.80);
  text-decoration:none;
  color:var(--text);
  font-weight:800;
}
.page-numbers.current{
  background:rgba(67,97,238,.12);
  border-color:rgba(67,97,238,.22);
  color:var(--brand2);
}

.article{padding:18px}

.breadcrumbs{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  color:var(--muted);
  font-size:13px;
  font-weight:900;
  margin-bottom:10px;
}
.breadcrumbs a{text-decoration:none;color:var(--brand2);font-weight:800}

.articleCover,
.singleInfoBox,
.entryBox,
.navPost,
.commentsBox{
  width:calc(100% - 8px);
  max-width:var(--singleMax);
  margin-left:auto;
  margin-right:auto;
}

@media(max-width:640px){
  .articleCover,
  .singleInfoBox,
  .entryBox,
  .navPost,
  .commentsBox{
    width:calc(100% - 6px);
    max-width:100%;
  }
}

.articleCover{
  margin-top:14px;
  margin-bottom:12px;
  border-radius:20px;
  overflow:hidden;
  border:1px solid var(--border);
  background:#fff;
}
.articleCover img{width:100%;height:auto;display:block}

.singleInfoBox{
  margin-top:12px;
  padding:14px 16px;
  border-radius:18px;
  border:1px solid var(--border);
  background:rgba(248,249,252,.94);
  text-align:center;
}
.singleTitle{
  margin:0 0 10px;
  font-size:20px;
  font-weight:900;
  line-height:1.8;
}
.singleInfoBox .postMeta{
  margin:0;
  justify-content:center;
}
.singleTax{
  margin-top:10px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:center;
}

.entryBox{
  margin-top:12px;
  padding:18px;
  border-radius:18px;
  border:1px solid var(--border);
  background:rgba(246,247,250,.97);
  overflow:hidden;
}
.entryBox .entry{font-size:15px;line-height:2.1}
.entryBox .entry p{margin:0 0 14px}
.entryBox .entry p:last-child{margin-bottom:0}

.entryBox .entry,
.entryBox .entry *{
  max-width:100%;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.entryBox a{
  overflow-wrap:anywhere;
  word-break:break-word;
}
.entryBox pre,
.entryBox code{
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.entryBox figure.wp-block-table,
.entryBox .wp-block-table{
  overflow-x:auto;
  max-width:100%;
}

.navPost{
  margin-top:12px;
  display:flex;
  gap:10px;
}
.navPost a{
  flex:1 1 0;
  min-width:0;
  text-decoration:none;
  border:1px solid rgba(67,97,238,.18);
  border-radius:18px;
  background:linear-gradient(135deg,rgba(67,97,238,.10),rgba(255,255,255,.86));
  padding:12px;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.navPost a:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 30px rgba(2,6,23,.08);
  border-color:rgba(67,97,238,.24);
}
.navPost b{
  display:block;
  font-weight:900;
}
.navPost .npTitle{
  margin-top:6px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

@media(max-width:640px){
  .navPost{flex-wrap:nowrap}
  .navPost a{padding:10px}
  .navPost b,.navPost .npTitle{text-align:center}
  .navPost .npTitle{font-size:12px}
}

.commentsBox{
  margin-top:12px;
  margin-bottom:14px;
  padding:16px;
  border-radius:18px;
  border:1px solid var(--border);
  background:rgba(248,249,252,.94);
}

.commentNotice{
  margin-bottom:12px;
  padding:12px 14px;
  border-radius:16px;
  border:1px solid rgba(46,196,182,.25);
  background:rgba(46,196,182,.10);
  color:#0b1227;
  font-weight:900;
  line-height:1.9;
}

.commentsTitle{
  margin:0 0 12px;
  font-weight:900;
  font-size:16px;
}

.commentList{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:10px;
}

.comment-body{
  border:1px solid var(--border);
  background:rgba(255,255,255,.80);
  border-radius:18px;
  padding:12px;
}

.comment-meta{
  font-size:12px;
  color:var(--muted);
}

.comment-author{
  font-weight:900;
  color:var(--text);
}

.comment-content{
  margin-top:8px;
  line-height:1.95;
  font-size:13px;
  color:#24314d;
  overflow-wrap:anywhere;
  word-break:break-word;
}

.comment-reply-link{
  display:inline-flex;
  margin-top:10px;
  padding:8px 10px;
  border-radius:14px;
  border:1px solid rgba(67,97,238,.22);
  background:rgba(67,97,238,.10);
  color:var(--brand2);
  text-decoration:none;
  font-weight:900;
  font-size:12px;
}

#respond{margin-top:14px}
#respond label{display:block;font-weight:900;font-size:13px;margin-bottom:8px}
#respond input[type="text"],
#respond textarea{
  width:100%;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid var(--border);
  outline:none;
  background:#fff;
}
#respond .form-submit input[type="submit"]{
  width:100%;
  height:44px;
  border-radius:14px;
  border:1px solid rgba(67,97,238,.22);
  background:rgba(67,97,238,.10);
  color:var(--brand2);
  font-weight:900;
  cursor:pointer;
}

.entryBox blockquote,
.entryBox .wp-block-quote{
  margin:14px 0;
  padding:14px 14px 14px 18px;
  border-radius:18px;
  border:1px solid rgba(67,97,238,.18);
  background:linear-gradient(135deg,rgba(67,97,238,.08),rgba(46,196,182,.06),rgba(255,255,255,.92));
  color:#0b1227;
  position:relative;
  line-height:2.05;
  font-weight:800;
}

.entryBox blockquote:before,
.entryBox .wp-block-quote:before{
  content:"“";
  position:absolute;
  right:14px;
  top:6px;
  font-size:44px;
  line-height:1;
  opacity:.18;
  font-weight:900;
}

.entryBox blockquote p,
.entryBox .wp-block-quote p{
  margin:0 0 10px;
}

.entryBox blockquote p:last-child,
.entryBox .wp-block-quote p:last-child{
  margin-bottom:0;
}

.entryBox blockquote cite,
.entryBox .wp-block-quote cite,
.entryBox .wp-block-quote__citation{
  display:block;
  margin-top:10px;
  color:rgba(15,23,42,.70);
  font-size:13px;
  font-weight:900;
}

.entryBox blockquote cite:before,
.entryBox .wp-block-quote cite:before,
.entryBox .wp-block-quote__citation:before{
  content:"— ";
}

.entryBox blockquote.has-text-align-center,
.entryBox .wp-block-quote.has-text-align-center{
  text-align:center;
}

.entryBox blockquote.has-text-align-left,
.entryBox .wp-block-quote.has-text-align-left{
  direction:ltr;
  text-align:left;
}

.pageLoader{
  position:fixed;
  inset:0;
  z-index:99999;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,var(--brand),var(--brand2));
  color:#fff;
  transition:opacity .25s ease, visibility .25s ease;
  opacity:1;
  visibility:visible;
}
.pageLoader.hidden{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
.plBox{
  text-align:center;
  padding:18px;
}
.plLogo{
  width:58px;
  height:58px;
  border-radius:18px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.38);
  display:grid;
  place-items:center;
  margin:0 auto 12px;
  box-shadow:0 16px 40px rgba(0,0,0,.12);
}
.plLogo svg{width:30px;height:30px}
.plT1{font-weight:950;font-size:16px;letter-spacing:-.2px}
.plT2{margin-top:6px;opacity:.88;font-weight:800;font-size:13px}
.plSpin{
  width:44px;
  height:44px;
  border:4px solid rgba(255,255,255,.18);
  border-top-color:#fff;
  border-radius:50%;
  margin:14px auto 0;
  animation:plSpin 1s linear infinite;
}
@keyframes plSpin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}

.commentList,
.commentList li,
.commentList ul,
.commentList ol{
  list-style:none;
  margin:0;
  padding:0;
}

.commentList{
  display:grid;
  gap:12px;
}

.commentList > li.comment{
  border:1px solid var(--border);
  background:rgba(255,255,255,.80);
  border-radius:18px;
  padding:14px;
}

.commentList > li.comment > .comment-body{
  border:0;
  background:transparent;
  border-radius:0;
  padding:0;
}

.commentList > li.comment > ul.children{
  margin-top:12px;
  padding-right:14px;
  border-right:2px solid rgba(67,97,238,.18);
  display:grid;
  gap:10px;
}

.commentList > li.comment > ul.children > li.comment{
  border:1px solid rgba(15,23,42,.10);
  background:rgba(248,249,252,.92);
  border-radius:16px;
  padding:12px;
}

.commentList > li.comment > ul.children > li.comment > .comment-body{
  border:0;
  background:transparent;
  padding:0;
}

.commentList li::marker{content:"";}