/* =========================================================
   SINGLE POST (Premium RTL, No frameworks)
   ========================================================= */
.single-post{ overflow-x: clip; }
@supports not (overflow: clip){ .single-post{ overflow-x: hidden; } }
.single-post *, .single-post *::before, .single-post *::after{ box-sizing: border-box; }
.single-post img, .single-post svg, .single-post iframe, .single-post video{ max-width: 100%; height: auto; }

/* Reading progress */
.reading-progress{
  position: sticky;
  top: 0;
  z-index: 9999;
  height: 4px;
  background: rgba(15,23,42,.06);
}
.reading-progress__bar{
  display:block;
  height: 100%;
  width: 0%;
  background: rgba(240,48,48,.92);
}

/* HERO */
.single-hero{
  position: relative;
  padding: clamp(24px, 3.6vw, 64px) 0;
  overflow: clip;
}
.single-hero__bg{ position:absolute; inset:0; pointer-events:none; z-index:0; }
.single-hero__mesh,.single-hero__grid,.single-hero__noise{ position:absolute; inset:0; }
.single-hero__mesh{
  background:
    radial-gradient(900px 520px at 15% 25%, rgba(240,48,48,.16), transparent 60%),
    radial-gradient(900px 520px at 85% 30%, rgba(48,64,96,.16), transparent 60%),
    linear-gradient(180deg, #ffffff 0%, #fbfbfc 100%);
}
.single-hero__grid{
  opacity: .32;
  background:
    linear-gradient(to right, rgba(15,23,42,.06) 1px, transparent 1px) 0 0/44px 44px,
    linear-gradient(to bottom, rgba(15,23,42,.06) 1px, transparent 1px) 0 0/44px 44px;
  mask-image: radial-gradient(closest-side at 50% 36%, #000 0%, transparent 78%);
  -webkit-mask-image: radial-gradient(closest-side at 50% 36%, #000 0%, transparent 78%);
}
.single-hero__noise{
  opacity: .08;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E");
  background-size: 180px 180px;
  mix-blend-mode: multiply;
}

.single-hero__inner{
  position: relative;
  z-index: 1;
  direction: rtl;
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 14px;
  align-items: start;
}

/* Breadcrumb */
.crumbs{ grid-column: 1 / -1; }
.crumbs__list{ margin:0; padding:0; list-style:none; display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.crumbs__item{ display:flex; align-items:center; gap:10px; }
.crumbs__item:not(:last-child)::after{ content:"/"; opacity:.45; }
.crumbs__link{ font-weight: 900; color: rgba(15,23,42,.70); }
.crumbs__link:hover{ color:#0f172a; text-decoration: underline; }
.crumbs__current{ font-weight: 1000; color:#0f172a; }

.single-metaTop{
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-bottom: 10px;
}
.pill{
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(48,64,96,.05);
  font-weight: 1000;
  color:#0f172a;
}
.meta{ font-weight: 900; color: rgba(15,23,42,.62); font-size: 12.5px; }
.meta.dot{ opacity:.65; }

.single-title{
  margin: 0 0 10px;
  font-size: clamp(22px, 2.5vw, 40px);
  line-height: 1.15;
  color: #0f172a;
  font-weight: 1000;
}
.single-excerpt{
  margin: 0 0 12px;
  color: rgba(15,23,42,.74);
  font-weight: 750;
  line-height: 1.95;
  max-width: 90ch;
}

.single-actions{ display:flex; flex-wrap:wrap; gap: 10px; }
.sbtn{
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.70);
  font-weight: 1000;
  color: rgba(15,23,42,.82);
}
.sbtn:hover{ border-color: rgba(240,48,48,.28); background: rgba(240,48,48,.06); }

.single-hero__media{
  border-radius: 26px;
  overflow: hidden;
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 18px 54px rgba(15,23,42,.10);
  background: rgba(48,64,96,.06);
  margin: 0;
}
.single-hero__media img{ width:100%; height:auto; display:block; }

/* Body layout */
.single-body{ padding: clamp(22px, 3.2vw, 64px) 0; }
.single-body__inner{
  direction: rtl;
  display:grid;
  grid-template-columns: 1fr 360px;
  gap: clamp(14px, 2.4vw, 28px);
  align-items:start;
}

/* TOC */
.toc{
  border-radius: 22px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.86);
  box-shadow: 0 18px 54px rgba(15,23,42,.08);
  padding: 12px;
  margin-bottom: 12px;
}
.toc__head{ display:flex; justify-content: space-between; gap:10px; align-items:center; }
.toc__title{ margin:0; font-weight:1000; color:#0f172a; font-size: 14.5px; }
.toc__toggle{
  height: 40px;
  padding: 0 12px;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(48,64,96,.05);
  font-weight: 1000;
  cursor: pointer;
}
.toc__toggle:hover{ background: rgba(240,48,48,.06); border-color: rgba(240,48,48,.18); }
.toc__list{
  margin: 10px 0 0;
  padding: 0 18px 0 0;
  display:grid;
  gap: 8px;
}
.toc__list a{
  font-weight: 900;
  color: rgba(15,23,42,.80);
  line-height: 1.7;
}
.toc__list a:hover{ text-decoration: underline; }
.toc__list a.is-active{ color: #F03030; }

/* Article content typography */
.content{
  border-radius: 26px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.86);
  box-shadow: 0 18px 54px rgba(15,23,42,.08);
  padding: 16px;
}

/* Headings */
.content h2, .content h3, .content h4{
  color: #0f172a;
  font-weight: 1000;
  line-height: 1.3;
  margin-top: 18px;
}
.content p, .content li{
  color: rgba(15,23,42,.74);
  font-weight: 750;
  line-height: 2.0;
  font-size: 16px;
}
.content a{ color: #304060; font-weight: 1000; text-decoration: underline; }
.content a:hover{ color: #0f172a; }

.content blockquote{
  margin: 16px 0;
  padding: 14px;
  border-radius: 22px;
  border: 1px solid rgba(240,48,48,.18);
  background: rgba(240,48,48,.06);
}
.content blockquote p{ margin:0; }

.content table{
  width: 100%;
  border-collapse: collapse;
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid rgba(15,23,42,.10);
}
.content th, .content td{
  padding: 10px;
  border-bottom: 1px solid rgba(15,23,42,.08);
  text-align: right;
}
.content th{
  background: rgba(48,64,96,.05);
  font-weight: 1000;
}
.content .wp-block-image img{
  border-radius: 18px;
  border: 1px solid rgba(15,23,42,.10);
}

/* Bottom */
.post-bottom{
  margin-top: 12px;
  display:grid;
  gap: 12px;
}
.tags{ display:flex; flex-wrap:wrap; gap: 10px; align-items:center; }
.tags__label{ font-weight: 1000; color: rgba(15,23,42,.70); }
.tag{
  padding: 9px 10px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(48,64,96,.05);
  font-weight: 1000;
  color: rgba(15,23,42,.82);
}
.tag:hover{ border-color: rgba(240,48,48,.28); background: rgba(240,48,48,.06); }

.shareRow{ display:flex; flex-wrap:wrap; gap: 10px; align-items:center; }
.shareRow__label{ font-weight:1000; color: rgba(15,23,42,.70); }
.shareRow__link{ font-weight:1000; color: rgba(15,23,42,.82); text-decoration: underline; }

.author-box{
  margin-top: 14px;
  border-radius: 26px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.86);
  box-shadow: 0 18px 54px rgba(15,23,42,.08);
  padding: 14px;
}
.author-box__inner{ display:flex; gap: 12px; align-items:flex-start; }
.author-box__avatar img{ border-radius: 18px; }
.author-box__name{ margin: 0 0 6px; font-weight: 1000; color:#0f172a; }
.author-box__bio{ margin: 0; color: rgba(15,23,42,.70); font-weight: 750; line-height: 1.9; }

.post-nav{
  margin-top: 14px;
  display:flex;
  flex-wrap:wrap;
  gap: 10px;
  justify-content: space-between;
}
.post-nav__item a{
  display:inline-flex;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.70);
  font-weight: 1000;
  color: rgba(15,23,42,.82);
}
.post-nav__item a:hover{ border-color: rgba(240,48,48,.28); background: rgba(240,48,48,.06); }

/* Sidebar */
.single-side{ display:grid; gap: 12px; position: sticky; top: 16px; align-self: start; }
.side-card{
  border-radius: 22px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.86);
  box-shadow: 0 18px 54px rgba(15,23,42,.08);
  padding: 14px;
}
.side-card--cta{
  border-color: rgba(240,48,48,.20);
  background: rgba(240,48,48,.04);
}
.side-title{ margin:0 0 10px; font-weight:1000; color:#0f172a; font-size: 14.5px; }
.side-text{ margin:0 0 12px; color: rgba(15,23,42,.70); font-weight:750; line-height:1.85; }
.side-actions{ display:flex; flex-wrap:wrap; gap: 10px; }

.side-list{ margin:0; padding:0; list-style:none; display:grid; gap: 9px; }
.side-list a{ font-weight: 900; color: rgba(15,23,42,.80); line-height:1.6; }
.side-list a:hover{ text-decoration: underline; }

.toc-mini__list{
  margin: 0;
  padding: 0 18px 0 0;
  display:grid;
  gap: 8px;
}
.toc-mini__list a{
  font-weight: 900;
  color: rgba(15,23,42,.80);
  line-height: 1.7;
}
.toc-mini__list a.is-active{ color: #F03030; }

/* Responsive */
@media (max-width: 1100px){
  .single-hero__inner{ grid-template-columns: 1fr; }
  .single-body__inner{ grid-template-columns: 1fr; }
  .single-side{ position: static; }
}
