/*
Copyrights © Arb4Host Network
/*
Template: newsplus
Theme Name: salahovic
Version: 0.01
*/

:root {
    --widget-spacing: 20px;
}

    
@media (min-width: 576px) {
    :root {
        --widget-padding: 30px;
        --post-width: 200px;
    }
}

.footer-navigation-outer { order: 1; }

.content { flex-grow: 1; }
.sidebar-side { position: sticky; bottom: 0px; align-self: flex-end; }

.site-header { background-color: #FFFFFF; box-shadow: 0px 0px 5px rgba(0,0,0,0.2); }
.header-logo-2 img { width: auto; max-height: 60px; }
.header-search-2 form { max-width: 300px; margin-right: auto; margin-left: 0px; }
.site-header .toggle-button a { display: inline-block; padding: 10px var(--widget-padding); font-size: 1.5em; }

.top-navigation .menu > li > a { padding: 10px; }
.main-navigation .sub-menu-inner { box-shadow: none; }
.main-navigation .sub-menu { width: 250px; box-shadow: 0px 0px 10px rgba(0,0,0,0.5); }
.main-navigation .menu > li:not(.menu-item-has-posts):last-child .sub-menu-outer { right: 0px; left: 0px; }

.mobile-menu, .site-footer.light-color { background: #232932; }


.site-section, .widget-inner { box-shadow: 0px 0px 4px rgba(0,0,0,0.1); }


.widget.featured-widget .widget-inner {
    background: #202020;
    background-image: repeating-linear-gradient(90deg, #222222, #222222 20px, #242424 20px, #242424 40px, #262626 40px, #262626 60px);
}
.widget.featured-widget:not(.has-title) .widget-inner { border: none; }


.widget-title i { margin-left: 20px; font-size: 2em; }

.site-main .widget-header { text-align: center; }
.site-main .widget-title { margin-top: -7px; padding: 10px var(--widget-padding); }
.site-main .widget-title::before, .site-main .widget-title::after { content: ""; position: absolute; top: 0px; border: 5px solid #000000; }
.site-main .widget-title::before { right: -10px; border-right-color: transparent; border-top-color: transparent; }
.site-main .widget-title::after { left: -10px; border-left-color: transparent; border-top-color: transparent; }

.widget.sections-widget .widget-inner .widget-area { padding: var(--widget-padding); }
.widget.sections-widget .widget-inner .widget-inner { background: #F8F8F8; border-right: 2px solid #EEEEEE; }
.widget.sections-widget .widget-inner .widget-inner .widget-header { margin: calc(var(--widget-padding) * -1); margin-bottom: var(--widget-padding); padding: 10px 0px; border-bottom: 1px solid #EEEEEE;  text-align: initial; }
.widget.sections-widget .widget-inner .widget-inner .widget-title { margin: 0px; background: transparent; }
.widget.sections-widget .widget-inner .widget-inner .widget-title::before, .widget.sections-widget .widget-inner .widget-inner .widget-title::after { display: none; }
.widget.sections-widget .widget-inner .widget-inner .widget-title, .widget.sections-widget .widget-inner .widget-inner .widget-title a { color: var(--link-color); }
.widget.sections-widget .widget-inner .widget-inner .widget-title a:hover, .widget.sections-widget .widget-inner .widget-inner .widget-title a:focus { color: var(--link-hover-color); }


.posts.grid_f .posts-inner { position: relative; display: grid; grid-gap: 5px; grid-template-columns: repeat(6, 1fr); }
.posts.grid_f .featured-heading { grid-column: span 2; }
.posts.grid_f .thumb-wrap { min-height: 200px; }
.posts.grid_f .title { position: absolute; right: 0px; bottom: 0px; left: 0px; padding: 10px; background: rgba(0,0,0,0.8); color: #FFFFFF; transform: translateY(120%); }
.posts.grid_f .overlay { background: rgba(0,0,0,0.3); visibility: visible; transition: 0s; }
.posts.grid_f .post { background: #FFFFFF; overflow: hidden; }
.posts.grid_f .post:hover { margin: -10px; padding: 10px; box-shadow: 0px 0px 10px rgba(0,0,0,0.4); z-index: 50; }
.posts.grid_f .post:hover .title { transform: translateY(0); }
.posts.grid_f .featured-heading { font-family: Droid Arabic Kufi !important; font-size: 30px; font-weight: normal; color: #FFFFFF; text-shadow: 1px 1px 0px #000000; }
.posts.grid_f .featured-heading > * { padding: 10px; }



@media (max-width: 991px) {
    .posts.grid_f .posts-inner { grid-template-columns: repeat(2, 1fr); }
    .posts.grid_f .featured-heading { grid-area: 1 / -1 / 1 / 1 }
    .posts.grid_f .title { transform: translateY(0); }
}
@media (min-width: 992px) {
    .widget.sections-widget .widget-inner .widget-area { display: block !important; column-count: 3; column-gap: 0; }
    .widget.sections-widget .widget-inner .widget-area .widget { -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; }
    
    .posts.grid_f .posts-inner .post:nth-child(1), .posts.grid_f .posts-inner .post:nth-child(4), .posts.grid_f .posts-inner .post:nth-child(7), .posts.grid_f .posts-inner .post:nth-child(7), .posts.grid_f .posts-inner .post:nth-child(10), .posts.grid_f .posts-inner .post:nth-child(13) { grid-column: span 2; }
    .posts.grid_f .posts-inner .post:nth-child(1) .title, .posts.grid_f .posts-inner .post:nth-child(4) .title, .posts.grid_f .posts-inner .post:nth-child(7) .title, .posts.grid_f .posts-inner .post:nth-child(10) .title, .posts.grid_f .posts-inner .post:nth-child(13) .title { transform: translateY(-1px); font-size: 1.5em; }
    
}

.terms.style3 li { -webkit-flex-basis: 100%; flex-basis: 100%; flex-grow: 1; margin: 5px 0px; box-shadow: none; }
.terms.style3 li.dummy { display: none; }
.terms.style3 li a { padding: 0px; }


.page-load-status { position: fixed; right: 0px; bottom: 0px; z-index: 500; display: none; }
.page-load-status .infinite-scroll-request { padding: 10px 20px; background: rgba(0,0,0,0.8); font-size: 2em; color: #FFFFFF; display: none; }

.page-load-status-2 { text-align: center; }
.page-load-status-2 .infinite-scroll-request { padding: 10px 20px; font-size: 1.2em; display: none; }


.side-related { flex-basis: 200px; flex-shrink: 0; line-height: 1.8; margin-bottom: 20px; }
.side-related-inner { position: sticky; top: 130px; background: #F8f8f8; border-radius: 4px; }
.side-posts-header { font-size: 1.2em; padding: 10px; border-bottom: 2px solid #EEEEEE; }
.side-related ul { margin: 0px; padding: 0px; list-style: none; }
.side-related li { padding: 10px; border-bottom: 1px solid #EEEEEE; }
.side-related li:last-child { border-bottom: none; }
.side-related a { display: inline-block; }

.post-image-inner { margin-right: 0px; margin-left: 0px; }


body:not(.page) .breadcrumbsX { margin-bottom: 10px; padding: 5px 20px; background: #f8f8f8; border-radius: 4px; }
body:not(.page) .breadcrumbs { display: block; }
.breadcrumbs a { display: inline-block; margin: 0px 2px; }
.breadcrumbs a::after { content: "/"; margin-right: 5px; font-size: 0.7em; opacity: 0.5; }
.breadcrumbs a:last-child:after { display: none; }



.post-content { min-width: 0px; }

.child-terms { margin: -2px; margin-bottom: var(--widget-padding); }
.child-terms ul { margin: 0px; padding: 0px; list-style: none; }
.child-terms li { margin: 2px; background-color: var(--main-color); }
.child-terms li a { padding: 5px 20px; background-color: rgba(255,255,255,0.9); border: 1px solid rgba(0,0,0,0.1); }
.child-terms li a:hover { background-color: rgba(255,255,255,0.7); }
.child-terms li:not(.title) { margin-top: 0px; margin-bottom: 0px; background: transparent; border: none; }

.post-content h1:not(.plain), .post-content h2:not(.plain), .post-content h3:not(.plain), .post-content h4:not(.plain), .post-content h5:not(.plain), .post-content h6:not(.plain) { border-top: none; border-right: 2px solid var(--main-color); background: #EEEEEE; }

/* ✅ [MODERNIZED] Replaced the Font Awesome star icon with a high-performance inline SVG. */
body:not(.page-id-143688) .posts:not(.slider) .post.sticky::before {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512' fill='%23FFFFFF'%3E%3Cpath d='M316.9 18C311.6 7 300.4 0 288.1 0s-23.4 7-28.8 18L195 150.3 51.4 171.5c-12 1.8-22 10.2-25.7 21.7s-.7 24.2 7.9 32.7L137.8 329 113.2 474.7c-2 12 3 24.2 12.9 31.3s23 8 33.8 2.3l128.3-68.5 128.3 68.5c10.8 5.7 23.9 4.9 33.8-2.3s14.9-19.3 12.9-31.3L438.5 329l104.2-101.5c8.6-8.5 11.7-21.2 7.9-32.7s-13.7-19.9-25.7-21.7L381.2 150.3 316.9 18z'/%3E%3C/svg%3E");
    font-family: initial; /* Reset font family */
    position: absolute;
    top: 1px;
    left: 1px;
    padding: 5px;
    z-index: 20;
    line-height: 1;
    background: #C03B3BCC;
    color: #FFFFFF;
    width: 1.3em; /* Set width for the SVG */
    height: 1.3em; /* Set height for the SVG */
}


.ml-pre-entry-wrapper { margin-bottom: 30px; padding: 20px; background: #F8f8f8; border: 1px solid rgba(0,0,0,0.1); }
.ml-pre-entry-wrapper .title {  font-size: 1.3em; }
.ml-pre-entry-wrapper ul { margin: 0px; list-style: square; }
.ml-pre-entry-wrapper a { transition: 0.4s; }
.ml-pre-entry-wrapper a:hover { padding-right: 5px; }

.mobile-menuX { max-height: 70vh; overflow-y: auto; }

.scroll-top-btn { position: fixed; }
.scroll-top-btn a { position: relative; display: inline-block; padding: 10px; }
.scroll-top-btn a::before, .scroll-top-btn a::after { content: ""; position: absolute; top: 3px; width: 20px; height: 100%; background: var(--main-color); }
.scroll-top-btn a::before { transform: skew(-15deg); right: -10px; background: var(--main-color); }
.scroll-top-btn a::after { transform: skew(15deg); left: -10px; background: var(--main-color); }

a.scrollup { position: fixed; bottom: 20px; right: 20px; z-index: 400; padding: 15px; border-radius: 5px; background: rgba(0,0,0,0.3); color: #444444; display: none !important; opacity: 0.7; }
a.scrollup:hover { color: #111111; }
a.scrollup span { font-size: 40px; }

.main-post-meta { margin-bottom: 20px; padding: 15px; background: #F8F8F8; border-right: 2px solid #DDDDDD; }
.main-post-meta .meta-item::after { content: "|"; }


.post-ratings { display: inline; }


@media (max-width: 575px) {
    .entry-content { text-align: initial; }
}


.posts-list { display: inline-block; }
.posts-list ul { list-style: none; }


.top-ad, .bottom-ad {
    text-align: center;
    margin: 10px 0;
}

.top-ad img, .bottom-ad img {
    max-width: 100%;
}

.download-link {
    background: #6089D6;
    color: #fff;
    padding: 10px 20px;
    border-radius: 5px;
    font-size: 25px;
    margin: 10px 0;
}

.download-linkhover {
    background: #5387e8;
    color: #fff;
}

.download-page {
    text-align: center;
}

.download-page p {
    font-size: 20px;
}

.download-page table {
    margin: 0 auto;
    text-align: right;
    min-width: 50%;
}

.ad-area img {
    max-width: 100%;
    height: auto;
}

.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* تمييز الروابط داخل المقالات مع الحفاظ على الخط السفلي */
.entry-content a,
.entry-content a:visited {
    color: #0000ff; /* اللون الأزرق */
    text-decoration: underline !important; /* إجبار الخط السفلي */
}

/* عند تمرير الماوس */
.entry-content a:hover {
    color: #0033cc; /* أزرق أغمق */
    text-decoration: underline !important;
}

/* استثناء روابط جدول المحتويات: لون أزرق بدون خط */
.entry-content .toc_list a {
    color: #0000ff !important; /* أزرق */
    text-decoration: none !important; /* بدون خط */
}

/* --- Modern Scroll-to-Top Button --- */
.scrollup {
  position: fixed;
  bottom: 20px;
  right: 20px;
  display: inline-block;
  padding: 10px 15px;
  background-color: #333;
  color: #fff;
  border-radius: 4px;
  z-index: 1000;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.4s, visibility 0.4s;
}

.scrollup.show {
  opacity: 1;
  visibility: visible;
}

.scrollup svg {
  width: 1em;
  height: 1em;
  vertical-align: middle;
}
/*
 * Final Fix: Remove conflicting decorative elements from widget titles
 * that have our new SVG icons.
*/
.widget-title a[href*="/category/"]::before,
.widget-title a[href*="/category/"]::after {
    display: none !important;
}
/*
 * ===================================================================
 * ✅ Final & Robust Fix for Post Grid Layout
 * ===================================================================
*/

/* This makes the image's container a reference point */
.posts .thumb-wrap {
    position: relative;
    overflow: hidden; /* Hides any part of the image that overflows */
}

/* This makes the image fill its container completely */
.posts .thumb-wrap img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; /* Makes the image cover the area without distortion */
    object-position: center; /* Ensures the image is centered */
}

.post-content blockquote {
  position: relative;
  padding: 15px 60px;
  background-color: #c0e2ed;
  border-right: 3px solid rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  margin: 1.5rem 0;
  font-style: normal;       /* يلغي الميل */
  font-family: inherit;     /* ياخد نفس الخط بتاع القالب */
  font-size: inherit;       /* ياخد نفس حجم النص */
  line-height: inherit;     /* يحافظ على نفس المسافة بين الأسطر */
  color: inherit;           /* نفس لون النص */
}

.post-content blockquote::before,
.post-content blockquote::after {
  position: absolute;
  font-size: 40px;
  font-weight: bold;
  opacity: 0.2;
  color: #000;
  line-height: 1;
  font-family: inherit;     /* نفس الخط بتاع القالب */
}

.post-content blockquote::before {
  content: "“";  /* علامة تنصيص افتتاحية */
  top: 5px;
  right: 15px;
}

.post-content blockquote::after {
  content: "”";  /* علامة تنصيص ختامية */
  bottom: 0;
  left: 15px;
}

.post-content blockquote p:last-of-type {
  margin-bottom: 0;
}