/* انطلاقة: هيدر وتذييل قالب مهارتي على كل صفحات الموقع.
   الألوان الأساسية تُضبط من أداة التخصيص (انظر الدليل)، وهذا الملف يضيف ما لا تتيحه الإعدادات. */

/* header: 76px bar, logo 44px, menu items as small leaf pills like the design.
   !important only where the customizer prints its own inline values (heights, colors, active background). */
body #main-header{background:#08332D!important;box-shadow:none;transition:box-shadow .3s}
body #main-header.mh-fixed-header,body #main-header.main-header-fixed{box-shadow:0 12px 30px -18px rgba(0,0,0,.6)}
body #main-header .mh_logo{height:76px!important;line-height:76px!important;display:inline-flex;align-items:center}
body #main-header .mh_logo img{max-height:44px!important;width:auto;padding:0!important;vertical-align:middle}
/* menu and icons share one 76px row, centered whatever line-height the customizer sets */
body #main-header #mh-top-navigation{display:flex!important;align-items:center;height:76px}
body #main-header .mh-top-navigation-icons{display:flex!important;align-items:center;gap:10px;height:76px;float:none!important}
body #main-header #mh_top_search,body #main-header .mh-top-cta,body #main-header .mh-top-navigation-icons>.mobile-menu-trigger-icon{line-height:1!important;top:0!important;margin:0!important}
body #main-header #top-menu{display:flex;align-items:center;height:76px}
body #main-header #top-menu>li{padding:0 1px!important;margin:0!important;background:none!important;line-height:normal;height:76px;display:flex;align-items:center}
body #main-header #top-menu>li>a{font:500 15px/1.6 "IBM Plex Sans Arabic",Tahoma,sans-serif!important;color:#B5D6D0!important;background:transparent!important;padding:7px 13px!important;border-radius:14px 3px 14px 3px;transition:color .2s,background .2s}
body #main-header #top-menu>li>a .mhc-menu-item-link-head{line-height:inherit!important;font:inherit!important;color:inherit!important;margin:0}
body #main-header #top-menu>li>a:hover,body #main-header #top-menu>li:hover>a,body #main-header #top-menu>li.current-menu-item>a,body #main-header #top-menu>li.current-menu-ancestor>a{color:#fff!important;background:rgba(255,255,255,.08)!important}
body #main-header #top-menu>li.menu-item-has-children>a::after{display:none!important}
body #main-header #top-menu>li>a::before{display:none!important}
/* dropdown */
body #main-header #top-menu li ul.sub-menu{right:0;top:calc(100% - 10px);border:0!important;border-top:0!important;border-radius:20px 4px 20px 4px;padding:8px!important;background:#fff!important;box-shadow:0 24px 48px -20px rgba(8,51,45,.45)!important;width:230px}
body #main-header #top-menu li ul.sub-menu li{padding:0!important;width:100%;position:relative}
/* third level opens beside its parent item (to the left in RTL); the transparent strip keeps hover while the mouse crosses the gap */
body #main-header #top-menu li li>ul.sub-menu{top:-8px;right:calc(100% + 6px);left:auto}
body #main-header #top-menu li li>ul.sub-menu::before{content:"";position:absolute;top:0;bottom:0;right:-14px;width:14px}
body #main-header #top-menu li li.menu-item-has-children>a{padding-left:28px!important}
/* left-pointing chevron drawn in CSS (the theme's icon glyph differs between versions) */
body #main-header #top-menu li li.menu-item-has-children>a::after{content:""!important;position:absolute;left:14px!important;top:50%!important;width:7px;height:7px;border:solid #5B6866;border-width:0 0 1.6px 1.6px;transform:translateY(-50%) rotate(45deg);font-size:0}
body #main-header #top-menu li li.menu-item-has-children:hover>a::after{border-color:#0E5D52}
body #main-header #top-menu li ul.sub-menu a,body #main-header #top-menu li.no-mega-menu>ul.sub-menu li:first-child a,body #main-header #top-menu li.no-mega-menu>ul.sub-menu li:last-child a{font:500 14.5px/1.6 "IBM Plex Sans Arabic",Tahoma,sans-serif!important;color:#13201E!important;background:transparent!important;padding:9px 12px!important;border-radius:12px 3px 12px 3px;width:100%;box-sizing:border-box}
body #main-header #top-menu li ul.sub-menu a .mhc-menu-item-link-head{font:inherit!important;color:inherit!important;line-height:inherit!important}
body #main-header #top-menu li ul.sub-menu a:hover,body #main-header #top-menu li ul.sub-menu li.current-menu-item>a{background:#E6F4F1!important;color:#0E5D52!important}
/* call to action (تطوّع معنا) */
body #main-header .mh-top-navigation-icons .mh-top-cta{margin-inline-start:14px!important}
body #main-header .mh-top-cta a{background:#fff!important;color:#08332D!important;border:0!important;border-radius:14px 3px 14px 3px!important;font:700 15px/1.6 "IBM Plex Sans Arabic",Tahoma,sans-serif!important;padding:9px 18px!important;opacity:1!important}
body #main-header .mh-top-cta a:hover{background:#8EE0D1!important;color:#08332D!important}
body #main-header .mh_search_icon{color:#fff}
body #main-header .sandwich-inner,body #main-header .sandwich-inner::before,body #main-header .sandwich-inner::after{background-color:#fff}


/* theme footer: only the copyright bar remains under the plugin's columns */
body #main-footer{background:#08332D;color:#B5D6D0;font-family:"IBM Plex Sans Arabic",Tahoma,sans-serif}
body #main-footer a{color:#B5D6D0}
body #main-footer a:hover{color:#fff}
body.intq-has-footer #footer-widgets{display:none}
body #footer-bottom{background:transparent;border-top:1px solid rgba(255,255,255,.1)}

/* footer columns (printed by the plugin above the theme footer) */
.intq-ftr{background:#08332D;color:#B5D6D0;position:relative;overflow:hidden;font:15px/1.8 "IBM Plex Sans Arabic",Tahoma,sans-serif;direction:rtl;text-align:right}
.intq-ftr .fb{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.intq-ftr .fb path{fill:none;stroke-linecap:round}
.intq-ftr-in{position:relative;max-width:1220px;margin-inline:auto;display:grid;grid-template-columns:1.3fr 1fr 1fr 1.2fr;gap:36px;padding:64px max(16px,env(safe-area-inset-right,0px)) 32px max(16px,env(safe-area-inset-left,0px))}
.intq-ftr-in>div{min-width:0}
.intq-ftr-logo{height:48px;width:auto;max-width:100%;margin-bottom:14px;display:block}
.intq-ftr p{margin:0;color:#B5D6D0}
.intq-ftr h4{color:#fff;font:700 16px/1.6 "Noto Kufi Arabic",Tahoma,sans-serif;margin:0 0 12px;padding:0}
.intq-ftr ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.intq-ftr li{display:flex;gap:8px;padding:0;margin:0}
.intq-ftr li::before{content:none!important}
.intq-ftr a{color:#B5D6D0;text-decoration:none}
.intq-ftr a:hover{color:#fff}
.intq-ftr .ltr{direction:ltr;unicode-bidi:isolate}
.intq-ftr .ico{width:1em;height:1em;flex:none;margin-top:6px;color:#8EE0D1;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.intq-ftr-soc{display:flex;gap:8px;margin-top:16px}
.intq-ftr-soc a{width:40px;height:40px;border-radius:14px 3px 14px 3px;display:grid;place-items:center;background:rgba(255,255,255,.08);color:#fff}
.intq-ftr-soc a:hover{background:#1C9D8B}
.intq-ftr-soc .ico{margin:0;color:#fff;width:18px;height:18px}
@media (max-width:1080px){.intq-ftr-in{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.intq-ftr-in{grid-template-columns:minmax(0,1fr)}}

/* back-to-top button (Mharty's .mhc_scroll_top takes the theme accent colour; this gives it the site's identity) */
body .mhc_scroll_top{box-sizing:border-box;width:46px!important;height:46px!important;padding:0!important;line-height:46px!important;font-size:18px;background:#08332D!important;color:#fff!important;border:1px solid rgba(142,224,209,.35);border-radius:14px 3px 14px 3px!important;box-shadow:0 14px 30px -12px rgba(8,51,45,.6);transition:background .25s}
body .mhc_scroll_top:hover{background:#1C9D8B!important}

/* pinned header: Mharty pins it with JS (switching #main-header / .header-container to position:fixed and offsetting the page),
   which makes the page jump on phones. When pinning is on in the customizer, the header is pinned with CSS sticky instead:
   it never leaves the flow, so nothing below it moves. #page-container's overflow:hidden would disable sticky, so it becomes clip. */
body:is(.mh_fixed_top,.mh_fixed_scroll) #page-container{overflow:visible!important;overflow-x:clip!important;padding-top:0!important}
body:is(.mh_fixed_top,.mh_fixed_scroll) .header-container{position:sticky!important;top:0;z-index:999;transform:none!important;animation:none!important;opacity:1!important}
body:is(.mh_fixed_top,.mh_fixed_scroll) #main-header{position:relative!important;top:auto!important;transform:none!important}
body.admin-bar:is(.mh_fixed_top,.mh_fixed_scroll) .header-container{top:32px}
@media (max-width:782px){body.admin-bar:is(.mh_fixed_top,.mh_fixed_scroll) .header-container{top:46px}}
@media (max-width:600px){body.admin-bar:is(.mh_fixed_top,.mh_fixed_scroll) .header-container{top:0}}

/* phone menu: the open-state X sits on the light panel, so it must not stay white like the closed burger */
body #main-header .sandwich.is-active .sandwich-inner,body #main-header .sandwich.is-active .sandwich-inner::before,body #main-header .sandwich.is-active .sandwich-inner::after,body .mh-app-nav .sandwich-inner,body .mh-app-nav .sandwich-inner::before,body .mh-app-nav .sandwich-inner::after{background-color:#13201E}
