/*
Theme Name: Safiya Story Pro
Theme URI: https://safiyastory.com/
Author: OpenAI
Description: قالب ووردبريس عربي للروايات مع الفصول والأبواب وصفحات قراءة مهيأة للنصوص الطويلة.
Version: 2.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
Text Domain: safiya-story-pro
*/

:root{
  --bg:#08111e;
  --bg-soft:#0d1830;
  --panel:#101c2d;
  --panel-2:#12233a;
  --text:#f5efe7;
  --muted:#c9c2b7;
  --line:rgba(255,255,255,.1);
  --gold:#dfb35a;
  --gold-2:#f4d28a;
  --shadow:0 18px 45px rgba(0,0,0,.28);
  --radius:22px;
  --radius-sm:14px;
  --content-width:1180px;
  --reading-width:860px;
  --font-main: "Tahoma","Segoe UI","Arial",sans-serif;
}

*,
*::before,
*::after{box-sizing:border-box}

html{scroll-behavior:smooth}

body{
  margin:0;
  background:
    radial-gradient(circle at top center, rgba(223,179,90,.12), transparent 28%),
    linear-gradient(180deg, #07111d 0%, #091527 35%, #08111e 100%);
  color:var(--text);
  font-family:var(--font-main);
  line-height:1.9;
  direction:rtl;
}

a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
.wp-site-blocks{padding:0}
.screen-reader-text{position:absolute;right:-9999px}

.site-header{
  position:sticky;
  top:0;
  z-index:50;
  backdrop-filter: blur(16px);
  background:rgba(6,12,23,.78);
  border-bottom:1px solid var(--line);
}
.site-header__inner{
  width:min(100% - 32px, var(--content-width));
  margin-inline:auto;
  min-height:76px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.branding{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.branding__title{
  font-size:1.55rem;
  font-weight:800;
  letter-spacing:.02em;
}
.branding__tagline{
  color:var(--muted);
  font-size:.92rem;
}
.main-navigation ul{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  list-style:none;
  margin:0;
  padding:0;
}
.main-navigation a{
  display:inline-flex;
  padding:10px 16px;
  border-radius:999px;
  color:#f4ede2;
  transition:.2s ease;
}
.main-navigation a:hover,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_item > a{
  background:rgba(223,179,90,.14);
  color:var(--gold-2);
}

.site-main{min-height:60vh}
.container,
.section__inner,
.archive-wrap,
.taxonomy-wrap,
.page-wrap,
.reading-wrap,
.single-door-wrap,
.archive-header__inner,
.hero__inner{
  width:min(100% - 32px, var(--content-width));
  margin-inline:auto;
}

.hero{
  position:relative;
  min-height:72vh;
  overflow:hidden;
  border-bottom:1px solid var(--line);
}
.hero__media{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  transform:scale(1.03);
}
.hero__overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(5,10,19,.2) 0%, rgba(5,10,19,.55) 45%, rgba(5,10,19,.92) 100%),
    linear-gradient(90deg, rgba(7,13,24,.88) 0%, rgba(7,13,24,.45) 45%, rgba(7,13,24,.82) 100%);
}
.hero__inner{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:28px;
  align-items:end;
  padding:110px 0 60px;
  min-height:72vh;
}
.hero__card,
.hero__side{
  background:rgba(7,14,25,.5);
  border:1px solid rgba(255,255,255,.1);
  border-radius:30px;
  box-shadow:var(--shadow);
  backdrop-filter:blur(16px);
}
.hero__card{padding:34px}
.hero__eyebrow,
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 14px;
  border-radius:999px;
  background:rgba(223,179,90,.14);
  color:var(--gold-2);
  font-size:.95rem;
  margin-bottom:20px;
}
.hero h1{
  margin:0 0 14px;
  font-size:clamp(2.5rem, 5vw, 4.8rem);
  line-height:1.1;
}
.hero__lead{
  margin:0;
  max-width:720px;
  color:#f2eadf;
  font-size:1.08rem;
}
.hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:28px;
}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 20px;
  border-radius:999px;
  border:1px solid transparent;
  font-weight:700;
  transition:transform .18s ease, background .2s ease, color .2s ease, border-color .2s ease;
}
.button:hover{transform:translateY(-1px)}
.button--primary{
  background:linear-gradient(135deg, var(--gold), #c48b2c);
  color:#1b1306;
}
.button--secondary{
  border-color:rgba(255,255,255,.16);
  background:rgba(255,255,255,.06);
  color:#f7f0e6;
}
.button--ghost{
  border-color:rgba(223,179,90,.32);
  color:var(--gold-2);
  background:rgba(223,179,90,.08);
}
.hero__stats{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
  margin-top:32px;
}
.stat-box{
  padding:16px;
  border-radius:20px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
}
.stat-box strong{
  display:block;
  font-size:1.6rem;
  margin-bottom:4px;
}
.stat-box span{color:var(--muted);font-size:.95rem}
.hero__side{
  padding:24px;
  display:grid;
  gap:16px;
  align-self:end;
}
.glass-card{
  padding:20px;
  border-radius:24px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.07);
}
.glass-card h3{
  margin:0 0 10px;
  font-size:1.14rem;
}
.glass-card p{margin:0;color:var(--muted)}

.section{
  padding:56px 0;
}
.section--tight{padding-top:42px}
.section__head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:20px;
  margin-bottom:24px;
}
.section__title{
  margin:0 0 6px;
  font-size:2rem;
}
.section__lead{
  margin:0;
  color:var(--muted);
}
.cards-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:20px;
}
.card,
.archive-card,
.toc-card,
.chapter-side-card,
.empty-state,
.feature-banner{
  background:linear-gradient(180deg, rgba(16,28,45,.92) 0%, rgba(12,23,38,.95) 100%);
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.card{padding:22px}
.card__meta{
  color:var(--gold-2);
  font-size:.94rem;
  margin-bottom:10px;
}
.card__title{
  margin:0 0 12px;
  font-size:1.3rem;
  line-height:1.4;
}
.card__excerpt{
  margin:0;
  color:var(--muted);
}
.card__footer{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}
.card__chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:14px;
}
.chip{
  display:inline-flex;
  padding:7px 12px;
  background:rgba(223,179,90,.09);
  border:1px solid rgba(223,179,90,.18);
  border-radius:999px;
  color:var(--gold-2);
  font-size:.9rem;
}

.feature-banner{
  padding:26px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.feature-banner h3{margin:0 0 10px}
.feature-banner p{margin:0;color:var(--muted)}

.archive-header{
  padding:56px 0 28px;
  border-bottom:1px solid var(--line);
}
.archive-header__inner{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.archive-header h1{
  margin:0;
  font-size:clamp(2rem, 4vw, 3.2rem);
}
.archive-header p{
  margin:0;
  color:var(--muted);
}
.archive-toolbar{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:18px;
}
.archive-wrap,
.taxonomy-wrap{
  padding:34px 0 56px;
}
.archive-list{
  display:grid;
  gap:18px;
}
.archive-card{
  padding:22px;
  display:grid;
  grid-template-columns:120px 1fr auto;
  gap:18px;
  align-items:center;
}
.archive-card__count{
  display:grid;
  gap:6px;
  text-align:center;
}
.archive-card__count strong{
  font-size:2rem;
  color:var(--gold-2);
}
.archive-card__meta{color:var(--gold-2)}
.archive-card__excerpt{color:var(--muted);margin:10px 0 0}
.archive-card__actions{display:flex;flex-wrap:wrap;gap:10px}

.reading-header{
  padding:40px 0 22px;
  border-bottom:1px solid var(--line);
}
.reading-header__inner{
  width:min(100% - 32px, var(--reading-width));
  margin-inline:auto;
}
.reading-header h1{
  margin:12px 0 10px;
  font-size:clamp(2rem, 4vw, 3.3rem);
  line-height:1.25;
}
.reading-header__lead{
  margin:0;
  color:var(--muted);
  font-size:1.05rem;
}
.reading-meta{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}
.reading-wrap{
  width:min(100% - 32px, 1180px);
  display:grid;
  grid-template-columns:minmax(0, 1fr) 300px;
  gap:26px;
  padding:30px 0 60px;
}
.single-article,
.single-door-article{
  width:100%;
  max-width:var(--reading-width);
  padding:30px;
  background:rgba(8,17,30,.76);
  border:1px solid rgba(255,255,255,.09);
  border-radius:28px;
  box-shadow:var(--shadow);
}
.entry-content,
.door-content{
  font-size:1.12rem;
  color:#f3eee6;
}
.entry-content p,
.door-content p{
  margin:0 0 18px;
}
.entry-content .dialogue,
.door-content .dialogue{
  color:var(--gold-2);
  padding-inline-start:12px;
  border-inline-start:2px solid rgba(223,179,90,.4);
}
.chapter-door-heading,
.door-content h3{
  margin:38px 0 18px;
  padding:16px 18px;
  font-size:1.28rem;
  line-height:1.6;
  color:#ffedc2;
  background:rgba(223,179,90,.08);
  border:1px solid rgba(223,179,90,.18);
  border-radius:18px;
  scroll-margin-top:110px;
}
.toc-card,
.chapter-side-card{
  padding:22px;
  position:sticky;
  top:100px;
}
.toc-card h3,
.chapter-side-card h3{
  margin:0 0 14px;
  font-size:1.12rem;
}
.toc-list,
.meta-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:10px;
}
.toc-list a,
.meta-list li{
  display:block;
  padding:12px 14px;
  border-radius:14px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.06);
  color:#f5efe4;
}
.toc-list a:hover{background:rgba(223,179,90,.1);color:var(--gold-2)}
.side-stack{display:grid;gap:18px}
.related-doors{
  margin-top:30px;
}
.related-doors__grid{
  display:grid;
  gap:14px;
}
.related-door{
  padding:18px;
  border-radius:18px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.07);
}
.related-door h4{margin:0 0 8px;font-size:1.03rem}
.related-door p{margin:0;color:var(--muted)}
.single-nav{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-top:28px;
}
.single-nav a{
  display:block;
  padding:18px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
}
.single-nav strong{display:block;margin-bottom:8px;color:var(--gold-2)}
.empty-state{
  padding:28px;
  text-align:center;
  color:var(--muted);
}
.page-wrap{
  padding:50px 0 60px;
}
.page-content{
  max-width:880px;
  padding:30px;
  margin-inline:auto;
  background:rgba(8,17,30,.76);
  border:1px solid rgba(255,255,255,.09);
  border-radius:28px;
  box-shadow:var(--shadow);
}

.site-footer{
  margin-top:24px;
  border-top:1px solid var(--line);
  background:rgba(3,8,16,.7);
}
.site-footer__inner{
  width:min(100% - 32px, var(--content-width));
  margin-inline:auto;
  padding:24px 0 34px;
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:center;
  color:var(--muted);
}
.site-footer__links{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.admin-note{
  margin-top:14px;
  padding:14px 16px;
  border-radius:14px;
  background:#fff8e5;
  color:#3b2b08;
  border:1px solid #f1d181;
}

@media (max-width: 1100px){
  .hero__inner,
  .reading-wrap,
  .feature-banner{
    grid-template-columns:1fr;
  }
  .cards-grid{grid-template-columns:repeat(2, minmax(0,1fr))}
  .archive-card{grid-template-columns:100px 1fr}
  .archive-card__actions{grid-column:1/-1}
  .toc-card,
  .chapter-side-card{position:static}
}

@media (max-width: 680px){
  .site-header__inner{min-height:68px}
  .hero{min-height:auto}
  .hero__inner{padding:96px 0 40px}
  .cards-grid{grid-template-columns:1fr}
  .hero__stats,
  .single-nav{grid-template-columns:1fr}
  .archive-card{grid-template-columns:1fr}
  .site-footer__inner,
  .section__head{flex-direction:column;align-items:flex-start}
  .single-article,
  .single-door-article,
  .page-content{padding:22px}
  .entry-content,
  .door-content{font-size:1.04rem}
}
