/*
Theme Name: Jeddah Dabab
Theme URI: https://jeddahdabab.com/
Author: JeddahDabab
Description: قالب عربي احترافي متخصص لمواقع خدمات النقل والتوصيل - دباب نقل عفش جدة. خفيف وسريع ومتوافق مع السيو، بدعم كامل للاتجاه من اليمين لليسار.
Version: 1.4.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: jeddahdabab
Tags: rtl-language-support, custom-logo, custom-menu, featured-images, translation-ready, blog, business
*/

/* ==========================================================================
   1. المتغيرات والأساسيات
   ========================================================================== */
:root{
  --jd-navy:#0A254D;
  --jd-navy-deep:#061A36;
  --jd-navy-soft:#14356B;
  --jd-orange:#FD610B;
  --jd-orange-dark:#C24E08;
  --jd-orange-light:#FFEDE2;
  --jd-sky:#EAF0F7;
  --jd-bg:#F5F7FA;
  --jd-ink:#12212E;
  --jd-muted:#4A5B6B;
  --jd-line:#E3EAF2;
  --jd-wa:#1FA855;
  --jd-radius:10px;
  --jd-max:1280px;
  --jd-font:'Tajawal','Cairo','Noto Kufi Arabic',system-ui,'Segoe UI',Tahoma,Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:hidden;max-width:100vw}
body{
  margin:0;font-family:var(--jd-font);font-size:17px;line-height:1.9;
  color:var(--jd-ink);background:#fff;overflow-x:hidden;
}
img,svg,video,iframe{max-width:100%;height:auto;display:block}
a{color:var(--jd-navy);transition:color .18s ease,background .18s ease,opacity .18s ease}
a:hover{color:var(--jd-orange)}
h1,h2,h3,h4{line-height:1.4;margin:0 0 14px;font-weight:800;color:var(--jd-ink)}
p{margin:0 0 16px}
ul,ol{margin:0 0 16px;padding-inline-start:22px}
table{border-collapse:collapse;width:100%}
:focus-visible{outline:3px solid var(--jd-orange);outline-offset:2px}
.jd-skip{position:absolute;right:-9999px;top:0;background:#fff;padding:10px 16px;z-index:99999}
.jd-skip:focus{right:10px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}

.jd-container{max-width:var(--jd-max);margin:0 auto;padding-inline:16px;width:100%}
.jd-section,.jd-page{overflow-x:clip}
.jd-section{padding:clamp(34px,5vw,58px) 0}
.jd-section--alt{background:var(--jd-bg)}
.jd-section--navy{background:var(--jd-navy);color:#fff}
.jd-section--navy h2,.jd-section--navy h3{color:#fff}

.jd-eyebrow{display:inline-block;background:var(--jd-sky);color:var(--jd-navy);font-size:13px;font-weight:800;padding:6px 14px;border-radius:5px;margin-bottom:12px}
.jd-eyebrow--orange{background:var(--jd-orange-light);color:var(--jd-orange-dark)}
.jd-eyebrow--solid{background:var(--jd-orange);color:#fff}
.jd-h2{font-size:clamp(23px,3.7vw,34px);margin-bottom:10px}
.jd-lead{color:var(--jd-muted);max-width:880px;margin-bottom:26px}
.jd-section--navy .jd-lead{color:#B6CBE2}

/* ==========================================================================
   2. الأزرار
   ========================================================================== */
.jd-btn{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-weight:800;
  font-size:17px;padding:14px 26px;border-radius:9px;border:0;cursor:pointer;line-height:1.4}
.jd-btn--call{background:var(--jd-orange);color:#fff}
.jd-btn--call:hover{background:var(--jd-orange-dark);color:#fff}
.jd-btn--wa{background:var(--jd-wa);color:#fff}
.jd-btn--wa:hover{background:#178744;color:#fff}
.jd-btn--light{background:#fff;color:var(--jd-orange-dark)}
.jd-btn--dark{background:var(--jd-navy);color:#fff}
.jd-btn--dark:hover{background:var(--jd-navy-deep);color:#fff}
.jd-btn--sm{font-size:16px;padding:11px 20px}
.jd-btns{display:flex;flex-wrap:wrap;gap:11px}

/* ==========================================================================
   3. الهيدر
   ========================================================================== */
.jd-topbar{background:var(--jd-navy-deep);padding:9px 0;font-size:14px;color:#B9C9DC}
.jd-topbar .jd-container{display:flex;flex-wrap:wrap;gap:8px 22px;align-items:center;justify-content:space-between}
.jd-topbar-info{display:flex;flex-wrap:wrap;gap:6px 18px}
.jd-topbar a{color:#fff;text-decoration:none;font-weight:800;font-size:15px}
.jd-topbar a span{color:var(--jd-orange)}

.jd-header{background:#fff;border-bottom:1px solid var(--jd-line);position:sticky;top:0;z-index:900}
.admin-bar .jd-header{top:32px}
.jd-header .jd-container{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;justify-content:space-between;padding-block:10px}
.jd-logo{flex:0 0 auto;display:flex;align-items:center}
.jd-logo img{height:clamp(54px,7vw,76px);width:auto;max-width:260px}
.jd-logo a{display:block;line-height:0}
.jd-logo .jd-logo-text{font-size:24px;font-weight:800;color:var(--jd-navy);text-decoration:none}

.jd-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:2px 4px;align-items:center}
.jd-nav a{display:block;color:var(--jd-navy);text-decoration:none;font-size:16px;font-weight:700;padding:8px 11px;border-radius:6px;white-space:nowrap}
.jd-nav a:hover,.jd-nav .current-menu-item>a{background:var(--jd-sky);color:var(--jd-orange-dark)}
.jd-nav .sub-menu{display:none;position:absolute;background:#fff;border:1px solid var(--jd-line);
  border-radius:8px;padding:8px;min-width:210px;box-shadow:0 8px 26px rgba(10,37,77,.13);flex-direction:column;z-index:950}
.jd-nav li{position:relative}
.jd-nav li:hover>.sub-menu{display:flex}
.jd-header-cta{display:flex;flex-wrap:wrap;gap:8px}

.jd-toggle{display:none;background:var(--jd-navy);color:#fff;border:0;border-radius:8px;
  padding:11px 16px;font-family:inherit;font-size:16px;font-weight:800;cursor:pointer}
#jd-menu-check{display:none}

/* ==========================================================================
   4. الهيرو وشريط الأرقام
   ========================================================================== */
.jd-hero{background:var(--jd-navy) center/cover no-repeat;padding:clamp(34px,6vw,72px) 0}
.jd-hero-box{max-width:760px;background:rgba(10,37,77,.90);border-radius:14px;padding:clamp(22px,4vw,40px)}
.jd-hero h1{font-size:clamp(26px,5vw,44px);color:#fff;margin-bottom:14px}
.jd-hero h1 span{color:#FFB27A}
.jd-hero p{font-size:clamp(16px,2.3vw,19px);color:#C7D9EC;margin-bottom:24px}

.jd-stats{background:var(--jd-navy-deep);padding:clamp(18px,3vw,26px) 0}
.jd-stats .jd-container{display:flex;flex-wrap:wrap;gap:14px}
.jd-stat{flex:1 1 150px;text-align:center;padding:8px}
.jd-stat b{display:block;font-size:clamp(21px,3.4vw,29px);font-weight:800;color:var(--jd-orange)}
.jd-stat span{font-size:14px;color:#A9BDD4}

/* ==========================================================================
   5. الشبكات والبطاقات
   ========================================================================== */
.jd-grid{display:flex;flex-wrap:wrap;gap:16px}
.jd-col{flex:1 1 300px;min-width:260px}
.jd-col--sm{flex:1 1 230px;min-width:210px}
.jd-col--lg{flex:1 1 340px;min-width:290px}

.jd-card{background:#fff;border-radius:var(--jd-radius);overflow:hidden;transition:transform .18s ease}
.jd-card--side:hover{transform:translateY(-3px)}
.jd-section--alt .jd-card{background:#fff}
.jd-section:not(.jd-section--alt) .jd-card{background:var(--jd-bg)}
.jd-card-body{padding:20px}
.jd-card h3{font-size:20px;color:var(--jd-navy);margin-bottom:10px}
.jd-card p{font-size:16px;color:var(--jd-muted)}
.jd-card ul{font-size:15px;color:var(--jd-muted);margin:0}
.jd-card img{width:100%;height:190px;object-fit:cover}
.jd-card--top{border-top:4px solid var(--jd-navy)}
.jd-card--top-o{border-top:4px solid var(--jd-orange)}
.jd-card--side{border-inline-start:4px solid var(--jd-orange);display:block;text-decoration:none;color:var(--jd-ink);padding:18px}
.jd-card--side b{display:block;font-size:19px;margin-bottom:5px}
.jd-card--side span{font-size:15px;color:var(--jd-muted)}
.jd-icon{font-size:25px;margin-bottom:8px}

.jd-step{background:var(--jd-bg);border-radius:var(--jd-radius);padding:22px}
.jd-step b.jd-num{display:inline-flex;align-items:center;justify-content:center;background:var(--jd-orange);
  color:#fff;width:38px;height:38px;border-radius:50%;font-size:18px;margin-bottom:12px}
.jd-step h3{font-size:18px;margin-bottom:8px}
.jd-step p{font-size:15px;color:var(--jd-muted);margin:0}

.jd-chips{display:flex;flex-wrap:wrap;gap:9px}
.jd-chip{background:var(--jd-navy-soft);color:#fff;text-decoration:none;font-size:15px;padding:9px 16px;border-radius:6px}
.jd-chip:hover{background:var(--jd-orange);color:#fff}

/* ==========================================================================
   6. الجداول والتنبيهات
   ========================================================================== */
.jd-scroll{overflow-x:auto;margin-bottom:18px}
.jd-table{min-width:560px;font-size:16px;background:#fff}
.jd-table thead tr{background:var(--jd-navy);color:#fff}
.jd-table th{padding:13px 14px;text-align:start;font-weight:800}
.jd-table td{padding:12px 14px;border-bottom:1px solid var(--jd-line)}
.jd-table tbody tr:nth-child(odd){background:var(--jd-bg)}
.jd-table .jd-price{font-weight:700;color:var(--jd-orange-dark)}
.jd-table .jd-best{color:var(--jd-orange-dark);font-weight:700}

.jd-note{border-inline-start:5px solid var(--jd-navy);background:var(--jd-sky);border-radius:7px;padding:16px 18px;margin-bottom:14px}
.jd-note--warn{border-color:var(--jd-orange);background:var(--jd-orange-light)}
.jd-note strong{color:var(--jd-navy)}
.jd-note--warn strong{color:var(--jd-orange-dark)}

.jd-info{width:100%;max-width:620px;height:auto;margin:26px auto;border-radius:var(--jd-radius);box-shadow:0 6px 24px rgba(10,37,77,.10)}
.jd-gallery{display:flex;flex-wrap:wrap;gap:12px}
.jd-gallery img{flex:1 1 280px;width:100%;height:220px;object-fit:cover;border-radius:9px}

.jd-faq-item{background:#fff;border-radius:9px;padding:18px;margin-bottom:12px}
.jd-section--alt .jd-faq-item{background:#fff}
.jd-faq-item h3{font-size:18px;margin-bottom:8px;color:var(--jd-ink)}
.jd-faq-item p{font-size:16px;color:var(--jd-muted);margin:0}

/* ==========================================================================
   7. المدونة والمقالات
   ========================================================================== */
.jd-page{padding:clamp(28px,4vw,48px) 0}
.jd-crumbs{font-size:14px;color:var(--jd-muted);margin-bottom:16px}
.jd-crumbs a{text-decoration:none}
.jd-entry{max-width:900px}
.jd-entry h1{font-size:clamp(25px,4.4vw,38px);margin-bottom:14px}
.jd-meta{font-size:14px;color:var(--jd-muted);margin-bottom:20px}
.jd-thumb{border-radius:var(--jd-radius);margin-bottom:24px;width:100%}
.jd-content h2{font-size:clamp(22px,3.4vw,30px);margin:34px 0 14px;padding-bottom:10px;border-bottom:3px solid var(--jd-orange);display:inline-block}
.jd-content h3{font-size:clamp(19px,2.6vw,23px);margin:26px 0 10px;color:var(--jd-navy)}
.jd-content img{border-radius:var(--jd-radius);margin:20px 0}
.jd-content table{margin:20px 0;font-size:16px;display:block;overflow-x:auto;white-space:nowrap;max-width:100%}
.jd-content table td,.jd-content table th{white-space:normal}
.jd-content>div[style*="overflow-x"]{max-width:100%}
.jd-content th{background:var(--jd-navy);color:#fff;padding:12px 14px;text-align:start}
.jd-content td{padding:11px 14px;border-bottom:1px solid var(--jd-line)}
.jd-content blockquote{margin:20px 0;padding:16px 20px;background:var(--jd-sky);border-inline-start:5px solid var(--jd-orange);border-radius:7px}
.jd-content blockquote p:last-child{margin:0}

.jd-posts{display:flex;flex-wrap:wrap;gap:20px}
.jd-post{flex:1 1 300px;min-width:260px;background:#fff;border:1px solid var(--jd-line);border-radius:var(--jd-radius);overflow:hidden;display:flex;flex-direction:column}
.jd-post img{width:100%;height:190px;object-fit:cover}
.jd-post-body{padding:18px;display:flex;flex-direction:column;flex:1}
.jd-post h2{font-size:20px;margin-bottom:8px}
.jd-post h2 a{text-decoration:none}
.jd-post p{font-size:15px;color:var(--jd-muted);flex:1}
.jd-more{color:var(--jd-orange-dark);font-weight:800;text-decoration:none;font-size:15px}

.jd-pagination{margin-top:30px;display:flex;flex-wrap:wrap;gap:8px}
.jd-pagination .page-numbers{display:inline-block;padding:10px 16px;border-radius:8px;background:var(--jd-bg);text-decoration:none;font-weight:700}
.jd-pagination .current{background:var(--jd-navy);color:#fff}

/* ==========================================================================
   8. الدعوة والفوتر
   ========================================================================== */
.jd-cta{background:linear-gradient(135deg,var(--jd-orange) 0%,var(--jd-orange-dark) 100%);
  padding:clamp(30px,5vw,52px) 0;text-align:center;color:#fff}
.jd-cta h2{color:#fff;font-size:clamp(23px,4vw,34px)}
.jd-cta p{color:#FFE6D6;font-size:clamp(15px,2.3vw,18px);margin-bottom:22px}
.jd-cta .jd-btns{justify-content:center}

.jd-footer{background:var(--jd-navy);color:#C7D6E7;padding:clamp(32px,5vw,56px) 0 0}
.jd-footer .jd-grid{gap:30px}
.jd-footer img.jd-flogo{height:70px;width:auto;max-width:280px;margin-bottom:16px}
.jd-footer p{font-size:16px;color:#B6C8DC}
.jd-footer h3{font-size:18px;color:#fff;margin-bottom:14px;padding-bottom:9px;border-bottom:2px solid var(--jd-orange);display:inline-block}
.jd-footer ul{list-style:none;margin:0;padding:0}
.jd-footer li{margin-bottom:9px}
.jd-footer li a{color:#B6C8DC;text-decoration:none;font-size:15px}
.jd-footer li a:hover{color:var(--jd-orange)}
.jd-ftags{display:flex;flex-wrap:wrap;gap:7px}
.jd-ftag{background:#123561;color:#DCE8F5;font-size:13px;padding:6px 12px;border-radius:16px}
.jd-fphone{display:block;color:#fff;text-decoration:none;font-size:21px;font-weight:800;margin-bottom:8px}
.jd-copy{margin-top:32px;padding:18px 0;border-top:1px solid #16375F;display:flex;flex-wrap:wrap;
  gap:10px 20px;align-items:center;justify-content:space-between;font-size:14px;color:#8FA6BF}
.jd-copy a{color:#8FA6BF;text-decoration:none;margin-inline-start:16px}

.jd-sticky{position:fixed;bottom:0;inset-inline:0;z-index:9999;display:flex;box-shadow:0 -2px 14px rgba(0,0,0,.28)}
.jd-sticky a{flex:1 1 50%;display:flex;align-items:center;justify-content:center;gap:8px;
  color:#fff;text-decoration:none;font-size:17px;font-weight:800;padding:14px 6px}
.jd-sticky .jd-s-call{background:var(--jd-orange)}
.jd-sticky .jd-s-wa{background:var(--jd-wa)}
.jd-sticky-space{height:58px}

/* ==========================================================================
   9. الاستجابة للجوال
   ========================================================================== */
@media (max-width:960px){
  .jd-header .jd-container{justify-content:space-between}
  .jd-toggle{display:block;order:2}
  .jd-header-cta{order:3;width:100%;justify-content:center}
  .jd-nav{order:4;width:100%;max-height:0;overflow:hidden;transition:max-height .3s ease}
  #jd-menu-check:checked ~ .jd-container .jd-nav{max-height:720px}
  .jd-nav ul{flex-direction:column;align-items:stretch;gap:2px;padding-top:8px;border-top:1px solid var(--jd-line);margin-top:8px}
  .jd-nav a{padding:12px 10px}
  .jd-nav .sub-menu{position:static;display:flex;box-shadow:none;border:0;padding:0 0 0 14px}
}
@media (max-width:640px){
  body{font-size:16px}
  .jd-topbar{font-size:13px}
  .jd-topbar-info span:nth-child(2){display:none}
  .jd-card img{height:170px}
  .jd-gallery img{height:190px}
  .jd-hero-box{background:rgba(10,37,77,.94)}
}
@media print{.jd-sticky,.jd-header,.jd-footer,.jd-cta{display:none}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ==========================================================================
   10. كتلة الأحياء في الفوتر وصفحة الأحياء
   ========================================================================== */
.jd-hoods-block{margin-top:34px;padding-top:26px;border-top:1px solid #16375F}
.jd-hoods-block h3{font-size:19px;color:#fff;margin:0 0 4px;border:0;padding:0;display:block}
.jd-hoods-block>p{font-size:14px;color:#8FA6BF;margin:0 0 18px}
.jd-hoods-region{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:flex-start;margin-bottom:14px}
.jd-hoods-label{flex:0 0 62px;font-size:13px;font-weight:800;color:var(--jd-orange);
  background:#123561;border-radius:5px;padding:5px 10px;text-align:center}
.jd-hoods-links{flex:1 1 260px;display:flex;flex-wrap:wrap;gap:5px 4px}
.jd-hoods-links a{color:#9FB6CE;text-decoration:none;font-size:13.5px;padding:3px 8px;border-radius:5px;line-height:1.7}
.jd-hoods-links a:hover{background:var(--jd-orange);color:#fff}

.jd-region-title{font-size:clamp(20px,3vw,26px);margin:34px 0 16px;padding-bottom:10px;
  border-bottom:3px solid var(--jd-orange);display:inline-block}
.jd-region-title span{color:var(--jd-muted);font-size:17px;font-weight:500}
.jd-hood-grid{display:flex;flex-wrap:wrap;gap:11px;margin-bottom:10px}
.jd-hood{flex:1 1 210px;min-width:190px;background:var(--jd-bg);border-inline-start:4px solid var(--jd-orange);
  border-radius:9px;padding:14px 16px;text-decoration:none;color:var(--jd-ink);transition:transform .16s ease}
.jd-hood:hover{transform:translateY(-2px);background:var(--jd-sky);color:var(--jd-ink)}
.jd-hood b{display:block;font-size:17px;font-weight:800;color:var(--jd-navy);margin-bottom:2px}
.jd-hood span{font-size:13px;color:var(--jd-muted)}
@media (max-width:640px){
  .jd-hoods-label{flex:0 0 100%;text-align:start;max-width:70px}
  .jd-hoods-links a{font-size:13px}
}

/* ==========================================================================
   11. قائمة الأحياء المطوية في الفوتر
   ========================================================================== */
.jd-hoods-all{margin-top:16px;border:1px solid #16375F;border-radius:9px;overflow:hidden}
.jd-hoods-all summary{list-style:none;cursor:pointer;padding:13px 16px;background:#0D2B57;
  color:#fff;font-weight:800;font-size:15px;display:flex;align-items:center;gap:8px;justify-content:space-between}
.jd-hoods-all summary::-webkit-details-marker{display:none}
.jd-hoods-all summary::after{content:'▾';color:var(--jd-orange);font-size:18px}
.jd-hoods-all[open] summary::after{content:'▴'}
.jd-hoods-all summary:hover{background:#123561}
.jd-hoods-all .jd-hoods-body{padding:16px}
.jd-count{background:var(--jd-orange);color:#fff;font-size:12px;font-weight:800;
  padding:3px 9px;border-radius:12px;margin-inline-start:6px}
@media (max-width:640px){
  body{font-size:16px}
  .jd-table{min-width:100%!important;font-size:14px}
  .jd-table th,.jd-table td{padding:9px 8px}
  .jd-scroll{margin-inline:-4px}
  .jd-hero-box{padding:18px 14px}
  .jd-info{max-width:100%}
}