.tp-section-title-span-padding span {
    padding-left: 175px;
    display: block;
}

.header-main-menu nav ul li.wp-menu-item-last .submenu:not(.tp-mega-menu) {
    left: 0;
}

.tp-shop-details-left-wrap .tp-shop-details-left-thumb img {
    width: 100%;
}

.liko-dark-active div .elementor-heading-title,
.liko-dark-active div .elementor-heading-title a span {
    color: var(--tp-common-white) !important;
}

.liko-dark-active div .tp-el-footer-links ul li a {
    -webkit-text-fill-color: var(--tp-common-white) !important;
    color: var(--tp-common-white) !important;
}

.liko-dark-active .sidebar__widget.widget_tag_cloud .tagcloud a {
    color: var(--tp-common-white);
    border: 1px solid rgba(245, 247, 245, 0.1);
}

.liko-dark-active .sidebar__widget.widget_tag_cloud .tagcloud a:hover {
    color: var(--tp-common-black);
    border-color: var(--tp-common-white);
    background: var(--tp-common-white);
}

.liko-dark-active .project-details-1-navigation span {
    color: var(--tp-common-white);
}

.liko-dark-active .comment-reply-title {
    color: var(--tp-common-white);
}

.liko-dark-active p.logged-in-as a {
    color: var(--tp-common-white);
}

.liko-dark-active .sidebar__search input {
    border-bottom: 1px solid rgba(245, 247, 245, 0.14) !important;
    color: var(--tp-common-white);
    background: transparent;
    border: 0px;
}

.liko-dark-active .sidebar__search input:focus {
    border-bottom: 1px solid var(--tp-common-white) !important;
}

.liko-dark-active .liko-breadcrumb-padding {
    background: #121212;
    background-color: #121212;
}

.liko-dark-active .tp-login-remember label {
    color: rgba(255, 255, 255, 0.6);
}

.liko-dark-active .tp-login-input-label label {
    color: var(--tp-common-white);
}

.liko-dark-active .wc-block-cart-items thead tr {
    background: var(--tp-common-white);
    padding: 30px;
}

.liko-dark-active .wc-block-cart-items thead tr th {
    padding: 8px 16px 8px 16px;
}

.liko-dark-active .wc-block-cart-items thead tr .wc-block-cart-items__header-product {
    visibility: visible;
}

.liko-dark-active .wc-block-cart-item__wrap a,
.liko-dark-active .wc-block-cart-item__wrap ins {
    color: var(--tp-common-white);
}

.liko-dark-active .wc-block-cart-item__wrap del {
    color: #818487 !important;
    margin-right: 10px;
}

.liko-dark-active .wc-block-components-quantity-selector {
    background: var(--tp-common-white);
}

.liko-dark-active .wc-block-cart-item__wrap button.wc-block-cart-item__remove-link {
    color: #ebebeb !important;
}

.liko-dark-active .wc-block-cart-item__total .wc-block-components-product-price {
    color: var(--tp-common-white);
}

.liko-dark-active .wc-block-components-totals-wrapper {
    border-top: 1px solid rgba(245, 247, 245, 0.1);
}

.liko-dark-active .wp-block-woocommerce-cart-order-summary-totals-block {
    border-top: 1px solid #E0E2E3;
}

.liko-dark-active .wc-block-components-totals-item__label {
    color: var(--tp-common-white);
}

/* General Dark Mode Styles for Background and Text */
.liko-dark-active body,
.liko-dark-active #page {
    /* Apply global dark background only to body and #page */
    background-color: var(--tp-common-black) !important;
    /* RE-ADDED !important for base page background */
    color: #DDDDDD;
    /* Softer off-white text color */
}

/* More specific text color overrides - REMOVING !important to allow more specific styles to take precedence */
.liko-dark-active p,
.liko-dark-active li,
.liko-dark-active label,
/* For form labels */
.liko-dark-active td,
/* For table cells */
.liko-dark-active th,
/* For table headers */
.liko-dark-active div:not([class*="elementor-"]):not([class*="tp-"]):not([class*="nice-select"]):not([class*="pswp"]):not([class*="cartmini"]):not([class*="cart"]):not([class*="header"]):not([class*="footer"]):not([class*="sidebar"]):not([class*="search"]):not([class*="postbox"]):not([class*="comment"]):not([class*="navigation"]):not([class*="pagination"]):not([class*="form"]):not([class*="shop"]):not([class*="product"]):not([class*="woocommerce"])

/* More exclusions */
    {
    color: #DDDDDD;
    /* Softer off-white text color */
}

/* Ensure spans that are not icons or special elements also get dark mode text color - REMOVING !important */
.liko-dark-active span:not([class*="icon"]):not([class*="fa-"]):not([class*="dashicons"]):not([class*="badge"]):not([class*="label"]):not([class*="woocommerce-Price-currencySymbol"]) {
    color: #DDDDDD;
    /* Softer off-white text color */
}

/* Ensure specific custom widgets like liko-process-widget (and their direct containers) remain transparent */
.liko-dark-active .elementor-widget-container:has(.liko-process-widget-unique-wrapper),
.liko-dark-active .liko-process-widget-unique-wrapper {
    background-color: transparent !important;
}

/* The text colors within .liko-process-widget-unique-wrapper are already defined in the user's provided CSS for light text on dark cards */


/* Custom Dark Mode Toggle Button Styles */
.back-to-top-wrapper {
    /* relative context is needed to place the toggle absolutely */
    position: relative;
}

#hover-dark-mode-toggle {
    display: none;
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 10px;
    width: 44px;
    height: 44px;
    background: var(--tp-common-white);
    box-shadow: 0px 8px 16px rgba(3, 4, 28, 0.3);
    color: var(--tp-common-black);
    border-radius: 50%;
    border: none;
    padding: 0;
    /* Reset browser button padding */
    cursor: pointer;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    opacity: 0;
    visibility: hidden;
    z-index: 99;
}

/* Invisible bridge to catch the mouse between back-to-top and dark mode toggle */
#hover-dark-mode-toggle::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 30px;
    background: transparent;
}

@media (max-width: 767px) {
    #hover-dark-mode-toggle {
        display: flex;
        align-items: center;
        justify-content: center;
        opacity: 1;
        visibility: visible;
    }
}

.back-to-top-wrapper:hover #hover-dark-mode-toggle,
#hover-dark-mode-toggle:hover {
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
    visibility: visible;
}

#hover-dark-mode-toggle.visible {
    opacity: 1;
    visibility: visible;
    display: flex;
    align-items: center;
    justify-content: center;
}

#hover-dark-mode-toggle:hover {
    filter: brightness(0.9);
    -webkit-transform: translateX(-50%) translateY(-4px);
    -moz-transform: translateX(-50%) translateY(-4px);
    -ms-transform: translateX(-50%) translateY(-4px);
    -o-transform: translateX(-50%) translateY(-4px);
    transform: translateX(-50%) translateY(-4px);
}

#hover-dark-mode-toggle .dark-mode-icon {
    font-size: 20px;
    display: inline-block;
    -webkit-transform: translateY(-2px);
    -moz-transform: translateY(-2px);
    -ms-transform: translateY(-2px);
    -o-transform: translateY(-2px);
    transform: translateY(-2px);
}

/* Dark mode styles for the new toggle button */
.liko-dark-active #hover-dark-mode-toggle {
    background: var(--tp-common-black);
    color: var(--tp-common-white);
    box-shadow: 0px 8px 16px rgba(245, 247, 245, 0.1);
}

.liko-dark-active #hover-dark-mode-toggle:hover {
    background: #333;
}

/* Dark theme background for Liko Animated Image Widget */
.liko-dark-active .elementor-widget-tp-animated-image>.elementor-widget-container,
.liko-dark-active .elementor-widget-tp-animated-image .liko-animated-img,
.liko-dark-active .elementor-widget-tp-animated-image .tp-award-2-shape,
.liko-dark-active .elementor-widget-tp-animated-image .tp-about-2-right-thumb {
    background-color: var(--tp-common-black) !important;
}

/* Dark theme background for Liko Video Play (MP4) Widget */
.liko-dark-active .elementor-widget-tp-video-play-mp4>.elementor-widget-container,
.liko-dark-active .elementor-widget-tp-video-play-mp4 .tp-video-area,
.liko-dark-active .elementor-widget-tp-video-play-mp4 .tp-video-wrap,
.liko-dark-active .elementor-widget-tp-video-play-mp4 .tp-hero-bottom-img-wrap {
    background-color: var(--tp-common-black) !important;
}

/* Dark theme background for Liko Portfolio Slider when active/scrolled */
.liko-dark-active .tp-project-2-area.tpproject.addclass {
    background-color: var(--tp-common-black);
}

/* =========================================================================
   Blog Archive - Wide Layout & Search/Filter Bar
========================================================================= */

/* Search & Filter Bar Container */
.tp-blog-search-filter-bar {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    background: var(--tp-common-white);
    padding: 20px 30px;
    border-radius: 8px;
    box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.05);
    margin-bottom: 30px;
    gap: 30px;
}

/* Search Input - Left Side */
.tp-blog-search-form {
    flex: 1 1 auto;
    max-width: 500px;
}

.tp-blog-search-input-wrap {
    position: relative;
    width: 100%;
}

.tp-blog-search-field {
    width: 100%;
    height: 50px;
    background: #f5f6f8;
    border: 1px solid transparent;
    border-radius: 5px;
    padding: 0 45px 0 20px;
    color: var(--tp-common-black);
    font-size: 15px;
    transition: all 0.3s ease-out 0s;
}

.tp-blog-search-field:focus {
    border-color: var(--tp-theme-primary);
    background: transparent;
    outline: none;
}

.tp-blog-search-submit {
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    color: #8C8F94;
    font-size: 18px;
    padding: 0;
    line-height: 1;
    transition: 0.3s;
}

.tp-blog-search-submit:hover {
    color: var(--tp-theme-primary);
}

/* Dropdown Filters - Right Side */
.tp-blog-filters {
    display: flex;
    flex: 0 0 auto;
    gap: 15px;
}

.tp-blog-filter-dropdown select {
    height: 50px;
    background: #f5f6f8;
    border: 1px solid transparent;
    border-radius: 5px;
    padding: 0 40px 0 20px;
    color: var(--tp-common-black);
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%238C8F94%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: right 15px top 50%;
    background-size: 10px auto;
    transition: all 0.3s;
}

.tp-blog-filter-dropdown select:focus,
.tp-blog-filter-dropdown select:hover {
    border-color: var(--tp-theme-primary);
    background-color: transparent;
    outline: none;
}

/* Wide Layout Adjustments */
.tp-blog-wide-layout .postbox__item {
    padding: 0;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.03);
    background: var(--tp-common-white);
    transition: 0.3s;
}

.tp-blog-wide-layout .postbox__item:hover {
    box-shadow: 0px 15px 40px rgba(0, 0, 0, 0.08);
    transform: translateY(-5px);
}

.tp-blog-wide-layout .postbox__thumb img {
    border-radius: 10px 10px 0 0;
    width: 100%;
    height: 450px;
    object-fit: cover;
}

.tp-blog-wide-layout .postbox__content {
    padding: 40px 50px;
}

.tp-blog-wide-layout .postbox__title {
    font-size: 32px;
    line-height: 1.3;
    margin-bottom: 20px;
}

@media (max-width: 991px) {
    .tp-blog-wide-layout .postbox__thumb img {
        height: 350px;
    }

    .tp-blog-wide-layout .postbox__content {
        padding: 30px;
    }

    .tp-blog-wide-layout .postbox__title {
        font-size: 26px;
    }
}

@media (max-width: 767px) {

    /* Stack search and filters vertically on small screens */
    .tp-blog-search-filter-bar {
        flex-direction: column;
        flex-wrap: wrap;
        padding: 20px;
        gap: 15px;
    }

    .tp-blog-search-form {
        max-width: 100%;
        width: 100%;
    }

    .tp-blog-filters {
        width: 100%;
        justify-content: space-between;
    }

    .tp-blog-filter-dropdown {
        flex: 1;
    }

    .tp-blog-filter-dropdown select {
        width: 100%;
    }
}

@media (max-width: 575px) {
    .tp-blog-filters {
        flex-direction: column;
    }

    .tp-blog-wide-layout .postbox__thumb img {
        height: 250px;
    }

    .tp-blog-wide-layout .postbox__content {
        padding: 20px;
    }

    .tp-blog-wide-layout .postbox__title {
        font-size: 20px;
    }
}

/* --- Dark Mode Additions --- */
.liko-dark-active .tp-blog-search-filter-bar {
    background: #1a1a1a;
    box-shadow: 0px 5px 20px rgba(255, 255, 255, 0.02);
}

.liko-dark-active .tp-blog-search-field,
.liko-dark-active .tp-blog-filter-dropdown select {
    background: #242424;
    color: var(--tp-common-white);
    border-color: #333;
}

.liko-dark-active .tp-blog-search-field::placeholder {
    color: #8C8F94;
}

.liko-dark-active .tp-blog-search-field:focus,
.liko-dark-active .tp-blog-filter-dropdown select:focus,
.liko-dark-active .tp-blog-filter-dropdown select:hover {
    border-color: var(--tp-common-white);
    background: transparent;
}

.liko-dark-active .tp-blog-wide-layout .postbox__item {
    background: #1a1a1a;
    box-shadow: 0px 5px 20px rgba(255, 255, 255, 0.02);
}

.liko-dark-active .tp-blog-wide-layout .postbox__item:hover {
    box-shadow: 0px 15px 40px rgba(255, 255, 255, 0.05);
}

.liko-dark-active .tp-blog-wide-layout .postbox__title a {
    color: var(--tp-common-white);
}

.liko-dark-active .tp-blog-wide-layout .postbox__title a:hover {
    color: #DDDDDD;
    /* slightly dimmer on hover in dark mode */
}

/* ==========================================================================
   JOURNAL GRID ARCHIVE STYLES
   ========================================================================== */

/* Journal Header Area */
.tp-journal-header {
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding-bottom: 15px;
}

.tp-journal-title {
    font-size: 24px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin: 0;
    color: var(--tp-common-black);
}

/* Inline Category Tabs */
.tp-journal-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.tp-journal-tab {
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    color: #777;
    position: relative;
    padding-bottom: 18px;
    transition: color 0.3s ease;
}

.tp-journal-tab:hover {
    color: var(--tp-theme-primary);
}

.tp-journal-tab.active {
    color: var(--tp-common-black);
}

.tp-journal-tab.active::after {
    content: '';
    position: absolute;
    bottom: -1px; /* Align with header border */
    left: 0;
    width: 100%;
    height: 2px;
    background-color: var(--tp-theme-primary);
}

/* Journal Grid Cards */
.tp-journal-grid-item {
    /* Base Grid settings */
}

/* Make Read More buttons strictly rectangular */
.tp-journal-card .tp-btn,
.tp-journal-card .tp-btn-border,
.tp-journal-card .tp-postbox-btn {
    border-radius: 0 !important;
}

/* Adjust search bar padding for new layout */
.tp-journal-filter-bar {
    padding: 20px 0;
    background: transparent;
    border: none;
    box-shadow: none;
    border-bottom: 1px solid rgba(0,0,0,0.05);
}
.tp-journal-filter-bar .tp-blog-search-form {
    max-width: 400px;
}

/*
 * DARK MODE FOR JOURNAL GRID
 */
.liko-dark-active .tp-journal-header {
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

.liko-dark-active .tp-journal-title {
    color: var(--tp-common-white);
}

.liko-dark-active .tp-journal-tab {
    color: #999;
}

.liko-dark-active .tp-journal-tab:hover {
    color: var(--tp-theme-primary);
}

.liko-dark-active .tp-journal-tab.active {
    color: var(--tp-common-white);
}

.liko-dark-active .tp-journal-filter-bar {
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

.liko-dark-active .tp-journal-card {
    background: #1a1a1a;
    border: 1px solid #2a2a2a;
}
.liko-dark-active .tp-journal-card .tp-postbox-title a {
    color: var(--tp-common-white);
}
.liko-dark-active .tp-journal-card .tp-postbox-title a:hover {
    color: var(--tp-theme-primary);
}
.liko-dark-active .tp-journal-card .tp-postbox-text {
    color: #999;
}




/* Force Read More button (tp-btn-border-lg) to be strictly rectangular in the Journal Grid */
.tp-journal-card .tp-btn-border-lg {
    border-radius: 0 !important;
}




/* ==========================================================================
   JOURNAL GRID REFINEMENTS (V2)
   ========================================================================== */

/* Typography & Header adjustments */
.tp-journal-header {
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding-bottom: 0; /* Removing padding to allow tabs to sit directly on the line */
}

.tp-journal-title {
    font-size: 28px;
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
    margin: 0;
    color: var(--tp-common-black);
}

/* Browser-style Category Tabs */
.tp-journal-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 5px; /* Tighter gap for browser tabs */
    align-items: flex-end;
}

.tp-journal-tab {
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    color: #888;
    background-color: transparent;
    padding: 12px 24px;
    border-radius: 8px 8px 0 0;
    border: 1px solid transparent;
    border-bottom: none;
    transition: all 0.3s ease;
    margin-bottom: -1px; /* Pull down to overlay the header border */
}

.tp-journal-tab:hover {
    color: var(--tp-common-black);
    background-color: rgba(0,0,0,0.03);
}

.tp-journal-tab.active {
    color: var(--tp-common-black);
    background-color: #fff;
    border-color: rgba(0,0,0,0.1);
}

.tp-journal-tab.active::after {
    display: none; /* Remove previous underline style */
}

/* Post Cards Refinements */
.tp-journal-card .postbox__thumb img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    border-radius: 4px; /* Slight rounding for images if desired, or 0 */
}

.tp-journal-card .tp-postbox-title {
    font-size: 22px;
    line-height: 1.3;
    margin-top: 15px;
    margin-bottom: 10px;
}

/* Dark Mode Overrides for V2 */
.liko-dark-active .tp-journal-header {
    border-bottom: 1px solid rgba(255,255,255,0.1);
}
.liko-dark-active .tp-journal-title {
    color: var(--tp-common-white);
}
.liko-dark-active .tp-journal-tab:hover {
    color: var(--tp-common-white);
    background-color: rgba(255,255,255,0.05);
}
.liko-dark-active .tp-journal-tab.active {
    color: var(--tp-common-white);
    background-color: #1a1a1a;
    border-color: rgba(255,255,255,0.1);
}




/* ==========================================================================
   JOURNAL GRID REFINEMENTS (V3)
   ========================================================================== */

/* 1. Shrink the main Breadcrumb heading for the Blog page and align it left */
body.blog .breadcrumb__area {
    padding-top: 60px !important;
    padding-bottom: 30px !important;
}
body.blog .breadcrumb__content {
    text-align: left !important;
}
body.blog .breadcrumb__title {
    font-size: 36px !important;
    margin-bottom: 0 !important;
}

/* 2. Fix Browser Tabs Spacing and Colors */
.tp-journal-header {
    margin-top: -15px; /* Pull tabs closer to the top breadcrumb area if needed */
}

.tp-journal-tabs {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 8px; /* Force gap for modern browsers */
    margin-bottom: 20px;
}

.tp-journal-tab {
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    color: #666 !important;
    background-color: #f0f0f0 !important; /* Distinct light tab color */
    padding: 12px 20px !important;
    border-radius: 6px 6px 0 0 !important; /* Top rounding like browser tab */
    margin-right: 6px; /* Fallback spacer for strict layout engines */
    margin-bottom: 0 !important;
    border: 1px solid #e0e0e0 !important;
    border-bottom: none !important;
    transition: all 0.2s ease;
}

.tp-journal-tab:hover {
    background-color: #e8e8e8 !important;
    color: var(--tp-common-black) !important;
}

.tp-journal-tab.active {
    background-color: #fff !important; /* Active tab matches content background */
    color: var(--tp-common-black) !important;
    border-color: #e0e0e0 !important;
    box-shadow: 0 -2px 5px rgba(0,0,0,0.02) !important;
}

/* 3. Dark Mode Support for the new precise Browser Tabs and Breadcrumb */
.liko-dark-active body.blog .breadcrumb__area {
    background-color: #111 !important; /* Match dark background */
}
.liko-dark-active .tp-journal-tab {
    background-color: #222 !important;
    border-color: #333 !important;
    color: #aaa !important;
}
.liko-dark-active .tp-journal-tab:hover {
    background-color: #2a2a2a !important;
    color: #fff !important;
}
.liko-dark-active .tp-journal-tab.active {
    background-color: #191919 !important; /* Match dark theme body */
    border-color: #333 !important;
    color: #fff !important;
    box-shadow: 0 -2px 5px rgba(0,0,0,0.1) !important;
}




/* ==========================================================================
   JOURNAL GRID REFINEMENTS (V4 - Minimal Text Tabs)
   ========================================================================== */

/* Remove browser tab look, return to clean text tabs with bottom border */
.tp-journal-tabs {
    gap: 30px; /* Wider gap for text tabs */
    margin-bottom: 0;
    justify-content: flex-start; /* Align left per new screenshot */
    border-bottom: 1px solid rgba(0,0,0,0.1); /* Single continuous line under tabs */
    padding-bottom: 0;
    width: 100%;
}

.tp-journal-tab {
    font-size: 13px !important;
    font-weight: 500 !important;
    text-transform: uppercase;
    color: #888 !important;
    background-color: transparent !important;
    padding: 0 0 15px 0 !important;
    border: none !important;
    border-radius: 0 !important;
    margin-right: 0;
    margin-bottom: -1px !important; /* Overlap the container border-bottom */
    transition: color 0.3s ease;
    position: relative;
}

.tp-journal-tab:hover {
    color: var(--tp-common-black) !important;
    background-color: transparent !important;
}

/* Active tab state */
.tp-journal-tab.active {
    color: var(--tp-common-black) !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* The active underline indicator */
.tp-journal-tab.active::after {
    display: block !important;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: var(--tp-theme-primary); /* Assuming primary is black/dark blue based on theme */
    z-index: 2;
}

/* Adjust search bar top margin to match screenshot spacing */
.tp-journal-filter-bar {
    margin-top: 20px;
    border-bottom: none !important; /* Remove bottom border from search bar area itself if it had one */
}

/* Dark Mode Overrides */
.liko-dark-active .tp-journal-tabs {
    border-bottom: 1px solid rgba(255,255,255,0.1);
}
.liko-dark-active .tp-journal-tab {
    background-color: transparent !important;
    color: #888 !important;
}
.liko-dark-active .tp-journal-tab:hover {
    background-color: transparent !important;
    color: #fff !important;
}
.liko-dark-active .tp-journal-tab.active {
    background-color: transparent !important;
    color: #fff !important;
    box-shadow: none !important;
}
.liko-dark-active .tp-journal-tab.active::after {
    background-color: #fff; /* White underline in dark mode */
}




/* ==========================================================================
   JOURNAL GRID REFINEMENTS (V5 - Post Cards Visuals)
   ========================================================================== */

/* 1. Image Ratio & Card Hover Animation */
.tp-journal-card {
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.tp-journal-card:hover {
    transform: translateY(-8px);
}

.tp-journal-card .postbox__thumb {
    overflow: hidden;
    border-radius: 4px; /* Slight modern rounding */
}

.tp-journal-card .postbox__thumb img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9; /* Enforce strict horizontal rectangle ratio */
    object-fit: cover !important;
    transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.tp-journal-card:hover .postbox__thumb img {
    transform: scale(1.05); /* Slight zoom on hover */
}

/* 2. Hide Excerpts / Text content */
.tp-journal-card .tp-postbox-text {
    display: none !important;
}

/* 3. Smaller Title */
.tp-journal-card .tp-postbox-title {
    font-size: 18px !important;
    line-height: 1.4 !important;
    margin-top: 15px !important;
    margin-bottom: 15px !important;
    font-weight: 500 !important;
}

/* Adjust meta info (date, category) to be tighter */
.tp-journal-card .tp-postbox-meta {
    margin-bottom: 8px !important;
}

/* Dark Mode specific card fixes if needed */
.liko-dark-active .tp-journal-card {
    background: transparent !important;
    border: none !important;
}




/* 4. Hide 'Read More' Button since excerpt is removed */
.tp-journal-card .postbox__read-more {
    display: none !important;
}

/* Make sure title and image links are clear targets */
.tp-journal-card .tp-postbox-title a {
    text-decoration: none;
    transition: color 0.3s ease;
}

.tp-journal-card:hover .tp-postbox-title a {
    color: var(--tp-theme-primary);
}


<!-- Anti-Cache timestamp: 02/22/2026 17:43:34 -->



/* ==========================================================================
   FORCE OVERRIDE FOR ELEMENTOR/THEME POST GRIDS (V6)
   ========================================================================== */

/* 1. Force Image Aspect Ratio (16:9) */
.elementor-posts-container .elementor-post__thumbnail img,
.elementor-post__thumbnail__link img,
.tp-blog-area .postbox__thumb img,
article .postbox__thumb img,
.postbox__item .postbox__thumb img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    object-fit: cover !important;
    border-radius: 4px !important;
    transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}

/* 2. Hide Excerpts (Z
ciana tekstu) completely */
.elementor-post__excerpt,
.elementor-posts-container .elementor-post__excerpt,
.tp-blog-area .tp-postbox-text,
.postbox__item .tp-postbox-text,
article .tp-postbox-text {
    display: none !important;
}

/* 3. Hide 'Read More' Buttons */
.elementor-post__read-more,
.elementor-posts-container .elementor-post__read-more,
.tp-blog-area .postbox__read-more,
.postbox__item .postbox__read-more,
article .postbox__read-more {
    display: none !important;
}

/* 4. Smaller Post Titles */
.elementor-post__title,
.elementor-posts-container .elementor-post__title,
.tp-blog-area .tp-postbox-title,
.postbox__item .tp-postbox-title,
article .tp-postbox-title {
    font-size: 18px !important;
    line-height: 1.4 !important;
    margin-top: 15px !important;
    margin-bottom: 15px !important;
    font-weight: 500 !important;
}

/* 5. Post Card Hover Animations */
.elementor-post,
.postbox__item,
article.post {
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.elementor-post:hover,
.postbox__item:hover,
article.post:hover {
    transform: translateY(-8px) !important;
}

.elementor-post:hover .elementor-post__thumbnail img,
.postbox__item:hover .postbox__thumb img,
article.post:hover .postbox__thumb img {
    transform: scale(1.05) !important;
}

/* Ensure title changes color on hover */
.elementor-post:hover .elementor-post__title a,
.postbox__item:hover .tp-postbox-title a,
article.post:hover .tp-postbox-title a {
    color: var(--tp-theme-primary) !important;
}

/* 6. Tabs styling for Elementor/Theme taxonomy filters */
.elementor-portfolio__filters,
.tp-journal-tabs {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 30px !important;
    margin-bottom: 20px !important;
    justify-content: flex-start !important;
    border-bottom: 1px solid rgba(0,0,0,0.1) !important;
    padding-bottom: 0 !important;
    width: 100% !important;
}

.elementor-portfolio__filter,
.tp-journal-tab {
    font-size: 13px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    color: #888 !important;
    background-color: transparent !important;
    padding: 0 0 15px 0 !important;
    border: none !important;
    margin-bottom: -1px !important;
    transition: color 0.3s ease !important;
    position: relative !important;
}

.elementor-portfolio__filter.elementor-active,
.tp-journal-tab.active {
    color: var(--tp-common-black) !important;
}

.elementor-portfolio__filter.elementor-active::after,
.tp-journal-tab.active::after {
    display: block !important;
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 2px !important;
    background-color: var(--tp-theme-primary) !important;
}


<!-- Anti-Cache timestamp #2: 02/22/2026 17:51:02 -->