/* v1.2: Override parent Customizer palette, including its inline styles. */
:root {
 --sp-primary:#8b0000 !important;
 --sp-primary2:#7a0000 !important;
 --sp-gradient1:linear-gradient(110deg,#510915 0%,#8b0000 55%,#b20a13 100%) !important;
 --sp-gradient2:linear-gradient(110deg,#28070e 0%,#590c1b 55%,#7a0000 100%) !important;
}
#header-section .navigator-wrapper,
#header-section .nav-area,
#header-section .navbar-area,
#header-section .theme-mobile-nav {
 background:linear-gradient(105deg,#e00000 0%,#a00009 28%,#660019 70%,#320812 100%) !important;
}
#header-section .navbar-area,
#header-section .theme-mobile-nav,
#header-section .navigator-wrapper,
#header-section .sticky-menu {position:relative !important;top:auto !important;}
/* Breadcrumb background is assigned dynamically by parent PHP. */
body.single .breadcrumb-area {
 background-image:url('images/wrapper-bg.jpg') !important;
 background-position:center center !important;
 background-size:cover !important;
 background-attachment:scroll !important;
}
body.single .breadcrumb-area:before {background-color:rgba(12,3,8,.18) !important;opacity:1 !important;}

/* v1.3 brighter original-style navigation */
:root{--sp-gradient1:linear-gradient(105deg,#ec0000,#a00009 50%,#620015)!important;--sp-primary:#c0000c!important;--sp-primary2:#7a0018!important}
#header-section .nav-area:before,#header-section .navbar-area:before{pointer-events:none}
body.single-post .breadcrumb-area,body.single .breadcrumb-area,body.single-post .breadcrumb-section,body.single .breadcrumb-section{background-image:url('images/wrapper-bg.jpg')!important;background-position:center!important;background-size:cover!important}

/* v1.4.3: Keep the brighter header but restore the parent-style dark dropdown. */
#header-section .nav-area, #header-section .navbar-area, #header-section .navigator-wrapper {
 background:linear-gradient(100deg,#f00000 0%,#b00000 12%,#710008 45%,#3c0009 100%)!important;
}
/* Restrict red hover treatment to top-level items, not submenu items. */
#header-section .nav-area .menu > li:hover,
#header-section .navbar-area .menu > li:hover { background:#ed0000!important; }
#header-section .nav-area .sub-menu,
#header-section .navbar-area .sub-menu,
#header-section .nav-area .dropdown-menu,
#header-section .navbar-area .dropdown-menu,
#header-section .nav-area ul ul,
#header-section .navbar-area ul ul { background:#101010!important; }
#header-section .nav-area ul ul li,
#header-section .navbar-area ul ul li { background:#101010!important; }
#header-section .nav-area ul ul li:hover,
#header-section .navbar-area ul ul li:hover,
#header-section .nav-area ul ul li.current-menu-item,
#header-section .navbar-area ul ul li.current-menu-item { background:#1a1a1a!important; }
#header-section .nav-area ul ul li a,
#header-section .navbar-area ul ul li a { color:#fff!important; }
#header-section .nav-area ul ul li:hover > a,
#header-section .navbar-area ul ul li:hover > a { color:#ef3434!important; }

/* v1.4.4: Original-style bright red navigation states and left-aligned dropdown. */
#header-section .nav-area .menu > li:hover,
#header-section .navbar-area .menu > li:hover,
#header-section .nav-area .menu > li:focus-within,
#header-section .navbar-area .menu > li:focus-within {
 background:linear-gradient(90deg,#f00000 0%,#fb0000 65%,#b50000 100%)!important;
}
#header-section .nav-area .menu > li,
#header-section .navbar-area .menu > li {position:relative;}
#header-section .nav-area .menu > li > ul,
#header-section .navbar-area .menu > li > ul,
#header-section .nav-area .menu > li > .dropdown-menu,
#header-section .navbar-area .menu > li > .dropdown-menu {
 left:0!important;right:auto!important;transform:none!important;margin-left:0!important;
 border-left:2px solid #ed0000!important;
}
#header-section .nav-area ul ul li,
#header-section .navbar-area ul ul li {border-left:0!important;}
#header-section .nav-area ul ul li:hover,
#header-section .navbar-area ul ul li:hover,
#header-section .nav-area ul ul li:focus-within,
#header-section .navbar-area ul ul li:focus-within {
 border-left:0!important;box-shadow:inset 2px 0 #fff!important;background:#101010!important;
}
#header-section .nav-area ul ul li:hover > a,
#header-section .navbar-area ul ul li:hover > a,
#header-section .nav-area ul ul li:focus-within > a,
#header-section .navbar-area ul ul li:focus-within > a {color:#ff1515!important;}

/* v1.4.5: Use the actual NEOM menu markup (.menu-wrap and .dropdown-menu).
   Earlier rules targeted .menu and therefore missed the navigation. */
@media (min-width: 992px) {
  #header-section .navbar-area .menubar ul.menu-wrap > li:hover > a,
  #header-section .navbar-area .menubar ul.menu-wrap > li:focus-within > a {
    background: linear-gradient(90deg, #ff0800 0%, #f00000 70%, #c60000 100%) !important;
    color: #fff !important;
  }
  #header-section .navbar-area .menubar ul.menu-wrap > li > .dropdown-menu {
    left: 0 !important;
    right: auto !important;
    margin-left: 0 !important;
    border-left: 2px solid #f00000 !important;
    background: #101010 !important;
    padding: 0 !important;
  }
  #header-section .navbar-area .menubar .dropdown-menu > li {
    border-left: 0 !important;
    box-shadow: none !important;
  }
  #header-section .navbar-area .menubar .dropdown-menu > li > a {
    background: transparent !important;
    color: #fff !important;
  }
  #header-section .navbar-area .menubar .dropdown-menu > li:hover > a,
  #header-section .navbar-area .menubar .dropdown-menu > li:focus-within > a {
    background: #101010 !important;
    color: #ff1717 !important;
    box-shadow: inset 2px 0 0 #fff !important;
  }
}

/* v1.4.6: NEOM applies transparent WebKit text fill on dropdown hover.
   Override that inherited text effect, not just the CSS color. */
@media (min-width: 992px) {
  #header-section .navbar-area .menubar .menu-wrap .dropdown-menu li:hover > a,
  #header-section .navbar-area .menubar .menu-wrap .dropdown-menu li:focus-within > a,
  #header-section .navbar-area .menubar .menu-wrap .dropdown-menu li.focus > a {
    background: #101010 !important;
    background-image: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    -webkit-text-fill-color: #ff0800 !important;
    color: #ff0800 !important;
  }
}

/* v1.5.5: related-story sidebar on single articles only. */
.single-post .ur-more-stories {background:#151515;color:#fff;padding:0 0 12px;}
.single-post .ur-more-stories__heading {background:#790013;color:#fff;font-size:17px;line-height:1.4;margin:0 0 16px;padding:12px 16px;text-transform:uppercase;}
.single-post .ur-more-stories__item {display:block;margin:0 0 20px;text-decoration:none;color:#fff;}
.single-post .ur-more-stories__thumb,.single-post .ur-more-stories__placeholder {display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#292929;margin-bottom:7px;}
.single-post .ur-more-stories__title {display:block;color:#fff;font-size:15px;line-height:1.4;font-weight:700;}
.single-post .ur-more-stories__item:hover .ur-more-stories__title {color:#ff0800;}


/* v1.5.10: Restore normal menu background for active ancestors, not hover. */
@media (min-width: 992px) {
  #header-section .navbar-area .menubar ul.menu-wrap > li.current-menu-ancestor:not(:hover):not(:focus-within),
  #header-section .navbar-area .menubar ul.menu-wrap > li.current-menu-parent:not(:hover):not(:focus-within),
  #header-section .navbar-area .menubar ul.menu-wrap > li.current-menu-ancestor:not(:hover):not(:focus-within) > a,
  #header-section .navbar-area .menubar ul.menu-wrap > li.current-menu-parent:not(:hover):not(:focus-within) > a {
    background: transparent !important;
    background-image: none !important;
  }
}
/* YouTube Gutenberg blocks: keep the iframe in document flow and at 16:9.
   Do not position it absolutely, and remove any aspect-ratio spacer. */
.single-post figure.wp-block-embed.is-provider-youtube .wp-block-embed__wrapper {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: auto !important;
  padding: 0 !important;
}
.single-post figure.wp-block-embed.is-provider-youtube .wp-block-embed__wrapper::before {
  display: none !important;
  content: none !important;
}
.single-post figure.wp-block-embed.is-provider-youtube .wp-block-embed__wrapper > iframe {
  position: static !important;
  display: block !important;
  inset: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
}

/* v1.5.11: centre YouTube embeds at 80% of article width on desktop. */
@media (min-width: 768px) {
  .single-post figure.wp-block-embed.is-provider-youtube {
    width: 80% !important;
    max-width: 80% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}
@media (max-width: 767px) {
  .single-post figure.wp-block-embed.is-provider-youtube {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* v1.5.12: category archive styles only */
body.category .breadcrumb-area, body.category .breadcrumb-section {
 background-image:url('images/wrapper-bg.jpg') !important;
 background-position:center !important;background-size:cover !important;
}
body.category .neom-content {padding-top:0!important;}
body.category .ur-archive {padding-top:42px;}
body.category .ur-archive .ur-section__head h1 {
 font-size:clamp(23px,2.6vw,34px)!important;line-height:1.15!important;
 color:#fff!important;font-style:normal!important;font-weight:800!important;
 margin:0!important;letter-spacing:-.02em;
}
body.category .ur-archive .ur-section__head h1::before {content:'//';color:#df1c25;margin-right:12px;}
body.category .ur-archive .ur-card-grid {grid-template-columns:repeat(3,minmax(0,1fr));}
body.category .ur-archive-pagination {margin:36px 0 0;}
body.category .ur-archive-pagination ul.page-numbers {
 list-style:none;display:flex;justify-content:center;flex-wrap:wrap;gap:9px;padding:0;margin:0;
}
body.category .ur-archive-pagination a,body.category .ur-archive-pagination span {
 display:inline-block;padding:9px 14px;background:#1c1c1c;border:1px solid #383838;
 color:#fff;text-decoration:none;
}
body.category .ur-archive-pagination .current,
body.category .ur-archive-pagination a:hover {background:#85000b;border-color:#85000b;}
@media(max-width:950px) and (min-width:681px) {
 body.category .ur-archive .ur-card-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:680px) {
 body.category .ur-archive .ur-card-grid {grid-template-columns:1fr;}
 body.category .ur-archive {padding-top:24px;}
}

/* v1.5.13: Fill the entire header strip, including the right of the search icon.
   Apply gradient to full-width header rather than only the inner navbar. */
#header-section {
  width:100% !important;
  max-width:none !important;
  background:linear-gradient(105deg,#e00000 0%,#a00009 28%,#660019 70%,#320812 100%) !important;
}
#header-section .navigator-wrapper {
  width:100% !important;
  max-width:none !important;
}

/* v1.5.14: No persistent red highlight on top-level category menu items.
   Keep the existing red effect for actual mouse hover only. */
@media (min-width: 992px) {
  #header-section .navbar-area .menubar ul.menu-wrap > li:not(:hover),
  #header-section .navbar-area .menubar ul.menu-wrap > li:not(:hover) > a {
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }
}

/* v1.5.15: single-post taxonomy links at the end of the article. */
body.single-post article.post-items .post-content > .cat-links {display:inline-block;margin:20px 14px 0 0;}
body.single-post article.post-items .post-content > .tag-links {display:inline-block;margin:20px 0 0;}

/* v1.5.17: expanded Spotify players only; YouTube and other embeds untouched. */
body.single-post figure.wp-block-embed.is-provider-spotify,
body.single-post figure.wp-block-embed-spotify {
  width: 70% !important;
  max-width: 560px !important;
  margin: 24px auto 30px !important;
}
body.single-post figure.wp-block-embed.is-provider-spotify .wp-block-embed__wrapper,
body.single-post figure.wp-block-embed-spotify .wp-block-embed__wrapper {
  position: static !important;
  height: auto !important;
  padding: 0 !important;
  aspect-ratio: auto !important;
}
body.single-post figure.wp-block-embed.is-provider-spotify .wp-block-embed__wrapper::before,
body.single-post figure.wp-block-embed-spotify .wp-block-embed__wrapper::before {
  display: none !important;
  content: none !important;
}
body.single-post iframe[src*="open.spotify.com/embed"] {
  display: block !important;
  position: static !important;
  width: 70% !important;
  max-width: 560px !important;
  height: 352px !important;
  min-height: 352px !important;
  margin: 24px auto 30px !important;
  aspect-ratio: auto !important;
}
body.single-post figure.wp-block-embed.is-provider-spotify iframe[src*="open.spotify.com/embed"],
body.single-post figure.wp-block-embed-spotify iframe[src*="open.spotify.com/embed"] {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}
@media (max-width: 767px) {
  body.single-post figure.wp-block-embed.is-provider-spotify,
  body.single-post figure.wp-block-embed-spotify,
  body.single-post iframe[src*="open.spotify.com/embed"] {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* v1.5.19: featured image above single-post content, never an overlay. */
body.single-post article.post-items > figure.ur-single-featured-image {
  display:block !important;
  position:relative !important;
  inset:auto !important;
  float:none !important;
  width:100% !important;
  height:auto !important;
  margin:0 0 0 !important;
  padding:0 !important;
  overflow:hidden;
  background:none !important;
}
body.single-post article.post-items > figure.ur-single-featured-image img {
  display:block !important;
  position:static !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  object-fit:contain !important;
  opacity:1 !important;
  transform:none !important;
}
body.single-post article.post-items > figure.ur-single-featured-image::before,
body.single-post article.post-items > figure.ur-single-featured-image::after {
  content:none !important;
  display:none !important;
}
