/* ===================================================================================

* Theme Name: Barsi Child
* Theme URI: https://themexriver.com/wp/barsi
* Author: ThemeXriver
* Author URI: https://themeforest.net/user/themexriver
* Description: Architecture & Interior WordPress Theme
* Version: 1.0.0
* Template: barsi
* Text Domain: barsi-child
* License: GNU General Public License version 3.0
* License URI: http://www.gnu.org/licenses/gpl-3.0.html
* Tags: one-column, right-sidebar, left-sidebar, custom-menu, featured-images, post-formats, sticky-post, translation-ready
* Tested up to: 6.6
* Requires PHP: 7.4

* We encourage you to create Child theme for any modifications you will want to do.

* Why use Child theme?

* Because of barsi updates we may provide for this theme that will overwrite your
* modifications and all your custom work.

* If you are not familiar with Child Themes, you can read about it here:
* http://codex.wordpress.org/Child_Themes
* http://wp.tutsplus.com/tutorials/theme-development/child-themes-basics-and-creating-child-themes-in-wordpress/

====================================================================================== */

/* ==========================================================================
   GLOBAL PAGE HEADER BANNER (.breadcrumb-area)
   Shared by every inner page's title banner (About, Infrastructure, etc.).
   Home page does not use this component.
   ========================================================================== */
@media (min-width: 1380px) {
  .breadcrumb-area > .container {
    max-width: 1352px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}
@media (min-width: 1200px) and (max-width: 1379px) {
  .breadcrumb-area > .container {
    max-width: 100% !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

.breadcrumb-area {
  position: relative;
  height: 547px;
  padding: 0 !important;
}
.breadcrumb-area > .container {
  position: relative;
  height: 100%;
}
.breadcrumb-wrap {
  position: relative;
  height: 100%;
  display: block;
}
.breadcrumb-title,
.breadcrumb-title * {
  text-transform: none !important;
}
.breadcrumb-title {
  position: absolute;
  left: 0;
  top: 307px;
  font-family: "Albert Sans", sans-serif;
  font-size: 70px;
  font-weight: 700;
  color: #f8f8f9 !important;
  margin: 0;
  line-height: 1.05;
}
.breadcrumb-list {
  position: absolute;
  right: 0;
  top: 487px;
  width: auto;
  height: auto;
  min-height: 60px;
  background-color: #f8f8f9 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 30px !important;
  margin: 0 !important;
  border-radius: 0 !important;
  z-index: 5;
  white-space: nowrap;
}
.breadcrumb-list-shape {
  display: none !important;
}
.breadcrumb-list ul.bread-crumb {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;
}
.breadcrumb-list ul.bread-crumb li,
.breadcrumb-list ul.bread-crumb li * {
  font-family: "Space Grotesk", sans-serif;
  font-size: 18px;
  font-weight: 500;
  color: #2d2d2d !important;
  text-transform: none !important;
}
.breadcrumb-list ul.bread-crumb li a {
  display: inline-block;
}
.breadcrumb-list ul.bread-crumb li a:hover {
  color: #f5821f !important;
}
/* Figma 88:1041 uses the theme's orange chevron as the separator — no extra slash */

@media (max-width: 991px) {
  .breadcrumb-area {
    height: 350px;
  }
  .breadcrumb-title {
    top: 150px;
    font-size: 48px;
  }
  .breadcrumb-list {
    top: 260px;
  }
}

@media (max-width: 767px) {
  .breadcrumb-area {
    height: auto;
    padding: 100px 0 60px !important;
  }
  .breadcrumb-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
    height: auto;
  }
  .breadcrumb-title {
    position: static;
    font-size: 36px;
    text-align: center;
  }
  .breadcrumb-list {
    position: static;
    right: 0;
    top: auto;
    width: auto;
    height: auto;
    min-height: 45px;
    background-color: #f8f8f9 !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 20px !important;
    margin: 0 !important;
    border-radius: 0 !important;
    z-index: 5;
    white-space: nowrap;
  }
  .breadcrumb-list ul.bread-crumb li,
  .breadcrumb-list ul.bread-crumb li * {
    font-size: 16px;
  }
}

/* ==========================================================================
   BLOG LISTING META OVERRIDES
   Hides author name and comment counts from standard blog post listings.
   ========================================================================== */
.bs-blog-page-3-item-single .item-meta .meta-item:nth-child(1),
.bs-blog-page-3-item-single .item-meta .meta-item:nth-child(2) {
  display: none !important;
}

/* ==========================================================================
   PAGINATION STYLING OVERRIDES
   Highlights the current/active page number in the listing pagination.
   ========================================================================== */
.bs-pagination .page-numbers.current {
  background-color: #f5821f !important;
  color: #ffffff !important;
  cursor: default;
}

/* ==========================================================================
   BLOG PAGES RESPONSIVE PADDING (LISTING & DETAILS)
   Sets vertical padding to: 80px (laptop/desktop), 60px (tablet), 40px (mobile)
   ========================================================================== */
.bs-blog-page-2-area,
.bs-blog-details-area {
  padding-top: 80px !important;
  padding-bottom: 80px !important;
}

@media (max-width: 991px) {
  .bs-blog-page-2-area,
  .bs-blog-details-area {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
  }
}

@media (max-width: 767px) {
  .bs-blog-page-2-area,
  .bs-blog-details-area {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
}

/* ==========================================================================
   SIDEBAR RECENT POSTS WIDGET OVERRIDES
   Hides categories from the sidebar recent posts items.
   ========================================================================== */
.tx-recent-posts .item-meta .categories {
  display: none !important;
}

/* ==========================================================================
   BLOG DETAIL HEADER BANNER OVERRIDES
   Removes author (admin), comment count, and publication date from the banner.
   ========================================================================== */
.bs-blog-details-meta {
  display: none !important;
}

/* ==========================================================================
   BREADCRUMB AREA PADDING OVERRIDES
   Pushes the breadcrumb contents down to prevent overlapping with the main header.
   ========================================================================== */
.breadcrumb-area:is(.has-blog-details) {
  padding-top: 20px !important;
}

/* ==========================================================================
   GLOBAL CONTENT LINK STYLING
   Highlights standard body/paragraph text links across the site.
   Excludes utility links, headers, nav menus, and buttons.
   ========================================================================== */
p a,
.tx-page-content li a,
.log-blog-details-text li a,
.tx-page-content a,
.log-blog-details-text a {
  color: #f5821f;
  text-decoration: none;
  border-bottom: 1px solid rgba(245, 130, 31, 0.3);
  transition: all 0.2s ease-in-out;
}

p a:hover,
.tx-page-content li a:hover,
.log-blog-details-text li a:hover,
.tx-page-content a:hover,
.log-blog-details-text a:hover {
  color: #d86d14;
  border-bottom-color: #d86d14;
}

/* Reset/exclude buttons, navigation menus, and pagination from text highlights */
p a.item-btn,
p a.mrb-btn-product,
p a.mrb-btn-contact-fallback,
p a.btn,
p a.button,
p a.page-numbers,
.bs-header-4-action-link a,
.bs-navigation a,
.tx-pagination a,
.brand-logo a,
.menu-item a,
.nav-menu a,
.sub-menu a,
/* Contact-info items (email / phone) are mailto: and tel: links wrapped in a
   <p>, so the `p a` rule above was drawing its orange underline under them.
   They read as plain contact details, not body-copy links. */
p a.item-disc,
.bs-core-feature-6-wrap a,
.bs-contact-info-area a,
.tx_contact_info a {
  border-bottom: none !important;
}

/* ==========================================================================
   RESPONSIVE SIDEBAR RECENT POSTS WIDGET OVERRIDES

   Thumbnail shape: 16/9, not the square this used to force. Every featured
   image on the site is landscape (1.89:1 for the current posts, 2.08 and 2.42
   for the older ones), so a 1:1 crop threw away nearly half the picture —
   whatever the post was actually about ended up outside the frame. At 16/9 a
   1.89:1 image loses about 6%, i.e. it reads as the whole image, while the
   tile stays a solid rectangle with no letterboxing.
   ========================================================================== */
.bs-sidebar-blog-single {
  display: flex !important;
  align-items: flex-start !important;
  gap: 16px !important;
  grid-template-columns: none !important; /* Disables the parent grid */
}

.bs-sidebar-blog-single .item-img {
  width: 112px !important;
  height: auto !important;
  aspect-ratio: 16 / 9;
  flex-shrink: 0 !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  margin-bottom: 0 !important;
}

/* The widget wraps the image in <a class="d-inline-block img-cover">. That
   anchor is inline-block with no height of its own, so the img's height:100%
   had no definite parent to resolve against and silently fell back to auto:
   the picture rendered at its natural ratio inside the taller box and sat in
   the TOP HALF of the tile, with dead space beneath it. object-fit never got
   a chance to run, because the element box already matched the image ratio.

   Giving the anchor a real block box completes the percentage chain, so
   height:100% resolves and object-fit:cover finally fills the tile. */
.bs-sidebar-blog-single .item-img > a {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  line-height: 0 !important;
}

.bs-sidebar-blog-single .item-img img {
  width: 100% !important;
  height: 100% !important;
  /* Beats barsi-extra.css's min-height:160px, which would otherwise force the
     image far taller than its tile and re-create the overflow. */
  min-height: 0 !important;
  object-fit: cover !important;
  display: block !important;
}

.bs-sidebar-blog-single .content {
  flex-grow: 1 !important;
}

.bs-sidebar-blog-single .item-meta {
  margin-bottom: 6px !important;
  font-size: 13px !important;
}

.bs-sidebar-blog-single .title {
  font-size: 16px !important;
  line-height: 1.4 !important;
  margin-top: 4px !important;
  font-weight: 600 !important;
}

/* Add spacing when the sidebar wraps below the main content on tablets/mobiles */
@media (max-width: 991px) {
  .tx-sidebarWrapper.bs-blog-page-sidebar {
    margin-top: 60px !important;
  }
}