/*
Theme Name:    Twenty Twenty-Five Child
Template:      twentytwentyfive
Version:        1.0
Text Domain:   twentytwentyfive-child
*/

/* ============================================================
   أناقتكِ — anakatk.com
   ملف style.css الرئيسي للقالب الفرعي المعدل تقنياً (بدون اتصالات خارجية)
   ============================================================ */

/* ============================================================
   0. CSS VARIABLES
   ============================================================ */
:root {
  /* الذهبي */
  --g1: #FBF7EC;
  --g2: #EDD89A;
  --g3: #C9A84C;
  --g4: #A07820;
  --g5: #7A5A10;
  --g6: #4B3608;

  /* الكريمي */
  --cream:  #FAF7F0;
  --cream2: #F0EAD6;

  /* نصوص */
  --td: #2C1F06;
  --tm: #5A4020;
  --wh: #FFFFFF;

  /* تحريك */
  --tr: 0.22s cubic-bezier(.4,0,.2,1);

  /* هوية الموقع (للتوافق والسرعة القصوى) */
  --aq-gold:        #b8955a;
  --aq-gold-dark:   #9d7d47;
  --aq-gold-light:  #d4bc93;
  --aq-cream:       #faf8f5;
  --aq-cream-mid:   #f2ede4;
  --aq-cream-dark:  #e8dfd0;
  --aq-ink:         #1a1611;
  --aq-ink-mid:     #6b5e4e;
  --aq-border:      #e8dfd0;
}

/* ============================================================
   1. RESET & BASE
   ============================================================ */
html, body {
  overflow-x: hidden;
  margin:  0;
  padding: 0;
  width:   100%;
  scroll-behavior: smooth;
}

body {
  direction:   rtl;
  font-size:   18px;
  line-height: 1.8;
  background-color: var(--cream);
  color:       var(--td);
  -webkit-font-smoothing: antialiased;
}

/* العناوين */
h1, h2, h3, h4, h5, h6 {
  font-weight: 700;
  color:       var(--td);
  line-height: 1.4;
  margin-top: 0;
  margin-bottom: 1rem;
}
h4 { font-size: 22px; }
h5 { font-size: 18px; color: var(--g4); }
h6 { font-size: 16px; text-transform: uppercase; }

/* ============================================================
   2. WORDPRESS BLOCKS — ضبط عام وآمن للـ SEO والسرعة
   ============================================================ */
.wp-site-blocks,
.is-layout-constrained {
  max-width:  100%;
  overflow-x: hidden;
}

.entry-content img,
.entry-content iframe { max-width: 100% !important; height: auto !important; }

.entry-content table,
article table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }

.wp-block-image img { transition: transform 0.6s ease, opacity 0.6s ease; }
.wp-block-image img:hover { transform: scale(1.03); opacity: .9; }

/* ============================================================
   3. DYNAMIC LUXURY LOOP
   ============================================================ */
.dynamic-luxury-loop .wp-block-post {
  display: flex !important; flex-direction: row !important;
  align-items: center !important; justify-content: flex-start !important;
  gap: 20px !important; width: 100% !important;
  margin-bottom: 25px !important; background: transparent !important;
}
.dynamic-luxury-loop .wp-block-post-featured-image {
  width: 140px !important; height: 95px !important;
  flex-shrink: 0 !important; margin: 0 !important; order: 0 !important;
}
.dynamic-luxury-loop .wp-block-post-featured-image img {
  width: 100% !important; height: 100% !important;
  object-fit: cover !important; border-radius: 8px !important;
}
.dynamic-luxury-loop .wp-block-post > .wp-block-group {
  flex: 1 !important; display: flex !important; flex-direction: column !important;
  gap: 6px !important; text-align: right !important; order: 1 !important;
}
.dynamic-luxury-loop .wp-block-post-categories a {
  color: #B8901A !important; font-size: 12px !important;
  font-weight: 600 !important; text-decoration: none !important;
}
.dynamic-luxury-loop .wp-block-post-title { margin: 0 !important; font-size: 15px !important; line-height: 1.5 !important; font-weight: normal !important; }
.dynamic-luxury-loop .wp-block-post-title a { color: #333 !important; text-decoration: none !important; }
.dynamic-luxury-loop .wp-block-post-date { font-size: 11px !important; color: #888 !important; }

/* ============================================================
   4. ARCHIVE LUXURY GRID
   ============================================================ */
.archive-luxury-grid .wp-block-post-template {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 30px !important; width: 100% !important;
  padding: 20px 0 !important; list-style: none !important;
}
.archive-luxury-grid .wp-block-post {
  display: flex !important; flex-direction: column !important;
  align-items: center !important; text-align: center !important;
  background: #ffffff !important; border-radius: 12px !important;
  overflow: hidden !important; margin: 0 !important; width: 100% !important;
}
.archive-luxury-grid .wp-block-post-featured-image { width: 100% !important; height: 200px !important; margin: 0 0 15px 0 !important; }
.archive-luxury-grid .wp-block-post-featured-image img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
.archive-luxury-grid .wp-block-post > .wp-block-group,
.archive-luxury-grid .wp-block-post div[class*="wp-block-group"] {
  padding: 0 20px 20px 20px !important;
  display: flex !important; flex-direction: column !important;
  align-items: center !important; justify-content: center !important;
  gap: 8px !important; width: 100% !important; box-sizing: border-box !important;
}
.archive-luxury-grid .wp-block-post-title { font-size: 17px !important; font-weight: 600 !important; margin: 0 !important; }
.archive-luxury-grid .wp-block-post-title a { color: #4a1c1c !important; text-decoration: none !important; }
.archive-luxury-grid .wp-block-post-date { font-size: 11.5px !important; color: #888 !important; }
.archive-luxury-grid .wp-block-post-excerpt { font-size: 13.5px !important; color: #555 !important; line-height: 1.6 !important; }

/* ============================================================
   5. NEWSLETTER
   ============================================================ */
.ank-pure-newsletter { width: 100%; max-width: 500px; margin: 0 auto; direction: rtl; }
.ank-newsletter-form { display: flex; gap: 12px; align-items: center; width: 100%; }
.ank-pure-newsletter input {
  flex-grow: 1; padding: 12px 15px;
  border: 1px solid #c5a880; background: transparent; color: #ffffff;
  outline: none; font-size: 14px;
  transition: all 0.3s ease; text-align: right;
}
.ank-pure-newsletter input::placeholder { color: #c5a880 !important; opacity: 0.7; }
.ank-pure-newsletter input:focus { border-color: #e39255; }
.ank-pure-newsletter button {
  padding: 12px 25px; background: #c5a880; color: #1f1607;
  font-weight: bold; border: none; cursor: pointer;
  font-size: 14px;
  white-space: nowrap; transition: all 0.3s ease;
}
.ank-pure-newsletter button:hover { background: #e39255; color: #fff; }
#ank-success-notification { color: #c5a880; margin-top: 15px; font-size: 14px; text-align: center; }

/* ============================================================
   6. ARCHIVE PAGE — صفحة الأرشيف
   ============================================================ */
.archive-title {
  text-align:   center;
  color:        #4a2c2a;
  font-size:    2.5rem;
  margin-bottom: 10px;
  position:     relative;
}
.archive-title::after {
  content: ''; display: block;
  width: 60px; height: 2px;
  background: var(--g3);
  margin: 15px auto;
}

/* بطاقة المقال داخل الأرشيف */
.wp-block-post {
  background: #fff;
  border: 1px solid #f2ece4;
  transition: transform 0.3s ease;
  overflow: hidden;
}
.wp-block-post:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0,0,0,.05); }
.wp-block-post-featured-image img { width: 100%; height: 250px !important; object-fit: cover; }
.wp-block-post-title a {
  color: #4a2c2a !important; text-decoration: none;
  font-size: 1.2rem !important; font-weight: bold;
  padding: 15px; display: block;
}
.wp-block-post-title a:hover { color: var(--g3) !important; }

/* ============================================================
   7. MEDIA QUERIES
   ============================================================ */
@media (max-width: 768px) {
  .wp-site-blocks, .is-layout-constrained {
    padding-right: 10px !important;
    padding-left:  10px !important;
    box-sizing: border-box !important;
  }
  .entry-content, .wp-block-post-content {
    width: 100% !important;
    max-width: 100% !important;
    padding-right: 10px !important;
    padding-left: 10px !important; 
    margin-right: auto !important;
    margin-left: auto !important;
    text-align: right !important;
    box-sizing: border-box !important;
  }
  .dynamic-luxury-loop .wp-block-post {
    flex-direction: column !important; 
    align-items: flex-start !important;
    gap: 12px !important; 
    padding: 0 10px !important;
  }
  .dynamic-luxury-loop .wp-block-post-featured-image { 
    width: 100% !important; 
    height: 160px !important; 
  }
  .archive-luxury-grid .wp-block-post-template { 
    grid-template-columns: 1fr !important; 
    padding: 10px 10px !important; 
    gap: 25px !important; 
  }
  .archive-luxury-grid .wp-block-post-featured-image { 
    height: 180px !important; 
  }
}

@media (max-width: 480px) {
  .ank-newsletter-form { flex-direction: column; gap: 12px; }
  .ank-pure-newsletter input, .ank-pure-newsletter button { width: 100%; text-align: center; }
}


.wp-block-template-part > header, 
.wp-block-template-part-header {
    margin-top: 0 !important;
    padding-top: 0 !important;
}


/* ============================================================
   11. MOBILE TOP BAR OPTIMIZATION — تحسين التوب بار للهاتف فقط
   ============================================================ */
@media (max-width: 768px) {
  /* تقليل الحشو الداخلي للشريط العلوي لزيادة المساحة الأفقية */
  header .wp-block-row {
    padding-right: 8px !important;
    padding-left: 8px !important;
    gap: 5px !important; /* تقريب الكتلة اليمنى من الكتلة اليسرى */
  }

  /* منع انقسام الكلمات المركبة مثل (تواصلكي استثنائي) لسطرين */
  header .wp-block-navigation-item__content,
  header .wp-block-navigation-item a {
    white-space: nowrap !important;
    font-size: 12px !important; /* تصغير الخط قليلاً ليناسب الشاشة */
  }

  /* تقريب روابط القائمة المصغرة من بعضها جداً */
  header .wp-block-navigation__container {
    gap: 8px !important; 
  }

  /* تقريب أيقونات السوشيال من بعضها لتصبح في سطر واحد وبدون قفز */
  header .wp-block-social-links {
    gap: 6px !important; 
    justify-content: flex-end !important;
  }

  /* تصغير حجم أيقونات السوشيال خفيفاً لتكفي المساحة */
  header .wp-block-social-links .wp-block-social-link svg {
    width: 16px !important;
    height: 16px !important;
  }
  
  /* تصغير زر جديد قليلاً على الهاتف */
  header .wp-block-button__link {
    padding: 4px 8px !important;
    font-size: 12px !important;
  }
}