/*
Theme Name: نبض - Nabd News
Theme URI: https://example.com/nabd-news
Author: Custom Build
Author URI: https://example.com
Description: قالب ووردبريس احترافي لمواقع الأخبار والمدونات العربية، مبني للسرعة القصوى، متوافق مع معايير السيو وGoogle Discover، ومزود بمساحات إعلانية مدروسة لا تؤثر على تجربة القارئ. خطوط Cairo وTajawal مستضافة محلياً، Schema.org JSON-LD، Open Graph، صور مهيأة للـ Discover (1200px+)، وكود خفيف بدون أي مكتبات JS ثقيلة.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Tested up to: 6.6
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: nabd-news
Tags: news, blog, rtl, custom-colors, custom-menu, featured-images, translation-ready
*/

/* =========================================================
   1) FONT FACES — مستضافة محلياً (لا طلبات خارجية = سرعة أعلى)
   ========================================================= */
@font-face{
  font-family:"Cairo";
  src:url("assets/fonts/cairo-arabic-400-normal.woff2") format("woff2");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Cairo";
  src:url("assets/fonts/cairo-arabic-700-normal.woff2") format("woff2");
  font-weight:700; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Cairo";
  src:url("assets/fonts/cairo-arabic-900-normal.woff2") format("woff2");
  font-weight:900; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Tajawal";
  src:url("assets/fonts/tajawal-arabic-400-normal.woff2") format("woff2");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Tajawal";
  src:url("assets/fonts/tajawal-arabic-500-normal.woff2") format("woff2");
  font-weight:500; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Tajawal";
  src:url("assets/fonts/tajawal-arabic-700-normal.woff2") format("woff2");
  font-weight:700; font-style:normal; font-display:swap;
}

/* =========================================================
   2) TOKENS — نظام الألوان والقياسات
   ========================================================= */
:root{
  --ink:#12161F;
  --ink-soft:#232837;
  --paper:#FAFAF8;
  --paper-raised:#FFFFFF;
  --line:#E7E5DF;
  --red:#D6293A;
  --red-dark:#B01F2E;
  --gold:#C9A227;
  --gray:#6B7280;
  --gray-light:#9AA0A6;

  --font-display:"Cairo",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-body:"Tajawal",system-ui,-apple-system,"Segoe UI",sans-serif;

  --radius:6px;
  --container:1200px;
  --gap:24px;
}

/* =========================================================
   3) RESET أساسي وخفيف
   ========================================================= */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.75;
  direction:rtl;
  text-align:right;
}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
ul{margin:0;padding:0;list-style:none;}
button{font-family:inherit;cursor:pointer;}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px;}

h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:900;
  line-height:1.25;
  margin:0 0 .5em;
}

.container{max-width:var(--container);margin:0 auto;padding:0 20px;}
.screen-reader-text{position:absolute;left:-9999px;}

/* =========================================================
   4) HEADER
   ========================================================= */
.site-header{background:var(--ink);color:#fff;}
.site-header__bar{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 0;gap:20px;
}
.site-branding{display:flex;align-items:center;gap:12px;}
.site-title{
  font-family:var(--font-display);font-weight:900;font-size:28px;color:#fff;
}
.site-title span{color:var(--gold);}
.site-description{font-size:12px;color:var(--gray-light);margin-top:2px;}

.main-navigation{display:flex;}
.main-navigation ul{display:flex;gap:4px;flex-wrap:wrap;}
.main-navigation a{
  display:block;padding:10px 14px;font-weight:700;font-size:15px;
  border-bottom:3px solid transparent;transition:border-color .2s,color .2s;
}
.main-navigation a:hover,
.main-navigation .current-menu-item>a{
  color:var(--gold);border-bottom-color:var(--gold);
}

.menu-toggle{display:none;background:none;border:2px solid #fff;color:#fff;border-radius:var(--radius);padding:8px 12px;}
.header-search{display:flex;align-items:center;}
.header-search input[type=search]{
  background:var(--ink-soft);border:1px solid #333a4a;color:#fff;
  border-radius:var(--radius);padding:8px 12px;font-family:var(--font-body);
}

/* شريط العاجل — العنصر المميز */
.breaking-ticker{
  background:var(--red);color:#fff;overflow:hidden;
}
.breaking-ticker__inner{display:flex;align-items:center;}
.breaking-ticker__label{
  flex:0 0 auto;background:var(--red-dark);font-family:var(--font-display);
  font-weight:900;font-size:13px;padding:9px 18px;white-space:nowrap;
  display:flex;align-items:center;gap:6px;
}
.breaking-ticker__label::before{content:"";width:8px;height:8px;border-radius:50%;background:#fff;animation:pulse-dot 1.4s infinite;}
@keyframes pulse-dot{0%,100%{opacity:1;}50%{opacity:.25;}}

.breaking-ticker__track{overflow:hidden;flex:1;position:relative;}
.breaking-ticker__list{
  display:flex;gap:48px;white-space:nowrap;width:max-content;
  animation:ticker-scroll 35s linear infinite;padding:9px 24px 9px 0;
}
.breaking-ticker:hover .breaking-ticker__list{animation-play-state:paused;}
.breaking-ticker__list a{font-size:14px;font-weight:500;}
@keyframes ticker-scroll{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}
@media (prefers-reduced-motion:reduce){
  .breaking-ticker__list{animation:none;overflow-x:auto;}
  .breaking-ticker__label::before{animation:none;}
}

/* =========================================================
   5) شبكة الصفحة الرئيسية (Hero + Grid)
   ========================================================= */
.home-hero{display:grid;grid-template-columns:1.6fr 1fr;gap:var(--gap);margin:32px 0;}
.hero-main{position:relative;border-radius:var(--radius);overflow:hidden;background:var(--ink);color:#fff;}
.hero-main img{aspect-ratio:16/9;object-fit:cover;width:100%;}
.hero-main__overlay{
  position:absolute;inset:auto 0 0 0;padding:28px 24px;
  background:linear-gradient(to top, rgba(18,22,31,.95), transparent);
}
.hero-side{display:flex;flex-direction:column;gap:var(--gap);}
.hero-side .post-card{flex:1;}

.eyebrow{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--font-display);font-weight:700;font-size:12px;
  color:var(--red);text-transform:uppercase;letter-spacing:.03em;margin-bottom:8px;
}
.eyebrow.gold{color:var(--gold);}

.section-heading{
  display:flex;align-items:center;gap:16px;margin:48px 0 20px;
}
.section-heading h2{font-size:22px;margin:0;white-space:nowrap;}
.section-heading::after{content:"";flex:1;height:2px;background:var(--line);}

.posts-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap);
}
.post-card{background:var(--paper-raised);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
.post-card__thumb{aspect-ratio:16/10;overflow:hidden;background:var(--line);}
.post-card__thumb img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease;}
.post-card:hover .post-card__thumb img{transform:scale(1.05);}
.post-card__body{padding:14px 16px 18px;}
.post-card h3{font-size:17px;margin:6px 0 8px;}
.post-card h3 a:hover{color:var(--red);}
.post-meta{font-size:12px;color:var(--gray);display:flex;gap:10px;flex-wrap:wrap;}
.post-meta .cat-pill{
  background:var(--red);color:#fff;padding:2px 9px;border-radius:99px;
  font-weight:700;font-size:11px;
}

/* =========================================================
   6) تخطيط عمودين (محتوى + سايدبار)
   ========================================================= */
.layout-with-sidebar{display:grid;grid-template-columns:2.4fr 1fr;gap:40px;align-items:start;margin:32px 0 60px;}
.widget-area{display:flex;flex-direction:column;gap:28px;position:sticky;top:24px;}
.widget{background:var(--paper-raised);border:1px solid var(--line);border-radius:var(--radius);padding:20px;}
.widget h3{font-size:16px;border-bottom:2px solid var(--gold);padding-bottom:10px;margin-bottom:14px;}
.most-read-list{display:flex;flex-direction:column;gap:14px;}
.most-read-list li{display:flex;gap:12px;align-items:flex-start;}
.most-read-list .num{
  font-family:var(--font-display);font-weight:900;font-size:22px;color:var(--gold);
  min-width:28px;
}
.most-read-list a{font-size:14px;font-weight:700;line-height:1.5;}

/* =========================================================
   7) صفحة المقال المفرد
   ========================================================= */
.single-post-header{margin:32px 0 20px;max-width:840px;}
.single-post-header h1{font-size:32px;}
.single-featured-image{border-radius:var(--radius);overflow:hidden;margin-bottom:28px;}
.single-featured-image img{aspect-ratio:16/9;object-fit:cover;width:100%;}

.entry-content{max-width:760px;font-size:18px;line-height:1.9;}
.entry-content p{margin:0 0 1.4em;}
.entry-content > p:first-of-type::first-letter{
  font-family:var(--font-display);font-weight:900;color:var(--gold);
  font-size:64px;float:right;line-height:.8;margin-left:10px;margin-top:6px;
}
.entry-content h2{font-size:24px;margin-top:1.6em;}
.entry-content h3{font-size:20px;margin-top:1.4em;}
.entry-content img{border-radius:var(--radius);margin:1.4em 0;}
.entry-content blockquote{
  border-right:4px solid var(--gold);margin:1.6em 0;padding:4px 20px;
  font-style:italic;color:var(--ink-soft);background:#fff;
}
.entry-content a{color:var(--red-dark);text-decoration:underline;}

.share-bar{display:flex;gap:10px;margin:28px 0;flex-wrap:wrap;}
.share-bar a{
  border:1px solid var(--line);border-radius:99px;padding:8px 18px;font-size:13px;font-weight:700;
}

/* =========================================================
   8) مساحات الإعلانات — مصممة لتندمج دون إزعاج القارئ
   ========================================================= */
.ad-slot{
  margin:28px auto;text-align:center;
  max-width:100%;
}
.ad-slot__label{font-size:10px;color:var(--gray-light);letter-spacing:.08em;margin-bottom:6px;text-transform:uppercase;}
.ad-slot--header{margin:0 0 0;background:var(--paper);}
.ad-slot--incontent{max-width:760px;}
.ad-slot--sidebar{min-height:250px;}

/* =========================================================
   9) الفوتر
   ========================================================= */
.site-footer{background:var(--ink);color:var(--gray-light);margin-top:60px;}
.footer-columns{
  display:grid;grid-template-columns:repeat(4,1fr);gap:32px;padding:48px 0 24px;
}
.footer-columns h3{color:#fff;font-size:15px;margin-bottom:16px;}
.footer-columns a{font-size:14px;line-height:2.2;}
.footer-columns a:hover{color:var(--gold);}
.footer-bottom{
  border-top:1px solid var(--ink-soft);padding:18px 0;font-size:13px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
}
.social-icons{display:flex;gap:10px;}
.social-icons a{
  width:34px;height:34px;border-radius:50%;border:1px solid var(--ink-soft);
  display:flex;align-items:center;justify-content:center;font-size:14px;
}

/* =========================================================
   10) الترقيم / التنقل بين الصفحات
   ========================================================= */
.pagination{display:flex;gap:8px;justify-content:center;margin:40px 0;flex-wrap:wrap;}
.pagination a,.pagination span{
  padding:8px 14px;border:1px solid var(--line);border-radius:var(--radius);font-weight:700;font-size:14px;
}
.pagination .current{background:var(--ink);color:#fff;border-color:var(--ink);}

/* =========================================================
   11) نموذج التعليقات
   ========================================================= */
#comments{margin-top:48px;max-width:760px;}
.comment-form input,.comment-form textarea{
  width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:var(--radius);
  font-family:var(--font-body);margin-bottom:14px;background:#fff;
}
.comment-form .submit{
  background:var(--red);color:#fff;border:none;padding:10px 24px;border-radius:var(--radius);font-weight:700;
}

/* =========================================================
   12) استجابة الموبايل
   ========================================================= */
@media (max-width:900px){
  .home-hero{grid-template-columns:1fr;}
  .posts-grid{grid-template-columns:repeat(2,1fr);}
  .layout-with-sidebar{grid-template-columns:1fr;}
  .widget-area{position:static;}
  .footer-columns{grid-template-columns:1fr 1fr;}
  .main-navigation{
    display:none;position:absolute;inset-inline:0;top:100%;background:var(--ink);
    flex-direction:column;padding:10px 20px 20px;z-index:50;
  }
  .main-navigation.is-open{display:flex;}
  .main-navigation ul{flex-direction:column;}
  .menu-toggle{display:block;}
  .site-header__bar{position:relative;flex-wrap:wrap;}
}
@media (max-width:560px){
  .posts-grid{grid-template-columns:1fr;}
  .footer-columns{grid-template-columns:1fr;}
  .single-post-header h1{font-size:24px;}
  .entry-content{font-size:16.5px;}
}
