/*
Theme Name: Roslyn Child
Theme URI: http://roslyn.qodeinteractive.com
Description: A child theme of Roslyn Theme
Author: Elated Themes
Author URI: http://themeforest.net/user/elated-themes
Version: 1.0.3
Text Domain: roslyn
Template: roslyn
*/

/* ==========================================================================
   Header & Menu Responsive Fixes
   ========================================================================== */



.eltdf-menu-area {
    display: flex;
    align-items: center;
    position: relative;
}
.eltdf-header-widget-menu-area {
    flex: 0 0 auto; 
    min-width: 40px; 
    margin-right: 20px;
}

.eltdf-position-right-inner .eltdf-side-menu-button-opener  {
    display: none;
}

.eltdf-menu-area > #block-47 {
    display: none;
}

/* .eltdf-vertical-align-containers {
    display: flex;
    align-items: center;
    justify-content: space-between;
} */

/* Menu spacing fix for laptops and smaller desktops (1025px - 1600px) */
@media only screen and (min-width: 1025px) and (max-width: 1600px) {
    /* Reduce padding between menu items to fit all 6 items */
    .eltdf-main-menu > ul > li > a {
        padding: 0 12px !important; /* Reduced from default padding */
    }
    
    /* Reduce margins if any */
    .eltdf-main-menu > ul > li {
        margin: 0 2px !important; /* Minimal margin between items */
    }
    
    /* Ensure menu container has enough space */
    .eltdf-menu-area .eltdf-main-menu {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
    }
    
    /* Adjust menu wrapper if needed */
    .eltdf-main-menu > ul {
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: space-between !important;
        width: 100% !important;
    }
}

/* Additional optimization for very tight spaces (1025px - 1200px) */
@media only screen and (min-width: 1025px) and (max-width: 1200px) {
    .eltdf-main-menu > ul > li > a {
        padding: 0 8px !important; /* Even tighter spacing */
        font-size: 14px !important; /* Slightly smaller font if needed */
    }
}

/* Ensure mobile menu still works properly */
@media only screen and (max-width: 1024px) {
    /* Reset any desktop menu styles for mobile */
    .eltdf-main-menu > ul > li > a {
        padding: initial !important;
        font-size: initial !important;
    }
}

/* ==========================================================================
   Typography - Migrated from Additional CSS
   ========================================================================== 
   MIGRATED: [28/08/2025]
   DEVELOPER: [Emmanuel Adetoro]
   STATUS: ✅ MIGRATED
   ========================================================================== */

/* Font changes for specific pages and content */
body.page-id-12, body.single-post, body.page-id-6350 {
    font-family: 'IBM Plex Serif' !important;
    font-size: 18px !important;
}

/* Social share dropdown font */
.eltdf-social-share-dropdown-opener {
    font-family: Montserrat !important;
}

/* Post content typography */
.single-post h2, .single-post h3, .single-post h4, .single-post h5, .single-post h6, 
.eltdf-post-text-main a, .eltdf-post-excerpt, .eldtf-post-title, .entry-title, 
.eltdf-sidebar a, body.home {
    font-family: 'IBM Plex Serif' !important;
}

/* Button text styling */
.eltdf-btn-text {
    font-size: 15px !important;
    font-weight: 500;
}

/* Post excerpt styling */
.eltdf-post-excerpt {
    font-size: 15px;
}

/* Main menu font */
#menu-main-menu {
    font-family: Montserrat, sans-serif !important;
}

/* About container headings */
#about-container h5 {
    font-family: 'IBM Plex Serif' !important;
}

/* Page-specific separator styling */
body.page-id-5576 .vc_separator.vc_separator_align_center h4 {
    color: white;
    font-family: 'IBM Plex Serif';
}

/* News holder post titles */
body:not(.home) .eltdf-news-holder .eltdf-post-title {
    font-family: Montserrat, sans-serif;
    font-weight: 600;
}

/* Bold text styling */
b, strong {
    font-weight: 600;
}

/* IDX heading styling */
.h-idx {
    line-height: 1.62em;
    letter-spacing: .16em;
    font-family: Montserrat, sans-serif;
    text-transform: uppercase;
}

/* Submit IDX headings */
#submit-idx h4 {
    font-size: 28px !important;
    font-weight: 600;
}

/* Separator headings */
.vc_separator h4 {
    font-size: 30px !important;
}

/* ==========================================================================
   Typography Responsive Design
   ========================================================================== */

/* Submit IDX responsive typography */
@media (max-width: 1440px) {
    #submit-idx h4 {
        font-size: 26px !important;
    }
}

@media (max-width: 1280px) {
    #submit-idx h4 {
        font-size: 24px !important;
    }
}

@media (max-width: 1025px) {
    #submit-idx h4 {
        font-size: 22px !important;
    }
}

@media (max-width: 768px) {
    #submit-idx h4 {
        font-size: 20px !important;
    }
    
    .vc_separator h4 {
        font-size: 24px !important;
    }
}

@media (max-width: 480px) {
    #submit-idx h4 {
        font-size: 18px !important;
    }
    
    .vc_separator h4 {
        font-size: 17px !important;
    }
}

@media (max-width: 320px) {
    #submit-idx h4 {
        font-size: 16px !important;
    }
}

/* Remove position for flexbox header columns */
/* .eltdf-position-left,
.eltdf-position-center {
    position: unset !important;
} */

/* Unset width for flexbox header center column */
/* .eltdf-position-center {
    width: unset !important;
} */

/* ========================================
   CUSTOM UNIFIED GRID SYSTEM
   ======================================== */

/* Base container width - applies to all screen sizes above mobile */
.eltdf-container-inner,
.eltdf-grid,
.eltdf-row-grid-section {
    margin: 0 auto !important;
}

/* Override all existing grid classes to use consistent widths */
@media only screen and (min-width: 768px) {
    /* Tablet and up - 900px container */
    .eltdf-container-inner,
    .eltdf-grid,
    .eltdf-row-grid-section,
    .eltdf-grid-800 .eltdf-container-inner,
    .eltdf-grid-800 .eltdf-grid,
    .eltdf-grid-800 .eltdf-row-grid-section,
    .eltdf-grid-1000 .eltdf-container-inner,
    .eltdf-grid-1000 .eltdf-grid,
    .eltdf-grid-1000 .eltdf-row-grid-section,
    .eltdf-grid-1200 .eltdf-container-inner,
    .eltdf-grid-1200 .eltdf-grid,
    .eltdf-grid-1200 .eltdf-row-grid-section,
    .eltdf-grid-1300 .eltdf-container-inner,
    .eltdf-grid-1300 .eltdf-grid,
    .eltdf-grid-1300 .eltdf-row-grid-section,
    .eltdf-grid-1500 .eltdf-container-inner,
    .eltdf-grid-1500 .eltdf-grid,
    .eltdf-grid-1500 .eltdf-row-grid-section {
        width: 900px !important;
    }
}

@media only screen and (min-width: 1024px) {
    /* Desktop small - 1000px container */
    .eltdf-container-inner,
    .eltdf-grid,
    .eltdf-row-grid-section,
    .eltdf-grid-800 .eltdf-container-inner,
    .eltdf-grid-800 .eltdf-grid,
    .eltdf-grid-800 .eltdf-row-grid-section,
    .eltdf-grid-1000 .eltdf-container-inner,
    .eltdf-grid-1000 .eltdf-grid,
    .eltdf-grid-1000 .eltdf-row-grid-section,
    .eltdf-grid-1200 .eltdf-container-inner,
    .eltdf-grid-1200 .eltdf-grid,
    .eltdf-grid-1200 .eltdf-row-grid-section,
    .eltdf-grid-1300 .eltdf-container-inner,
    .eltdf-grid-1300 .eltdf-grid,
    .eltdf-grid-1300 .eltdf-row-grid-section,
    .eltdf-grid-1500 .eltdf-container-inner,
    .eltdf-grid-1500 .eltdf-grid,
    .eltdf-grid-1500 .eltdf-row-grid-section {
        width: 1000px !important;
    }
}

@media only screen and (min-width: 1200px) {
    /* Desktop medium - 1100px container */
    .eltdf-container-inner,
    .eltdf-grid,
    .eltdf-row-grid-section,
    .eltdf-grid-800 .eltdf-container-inner,
    .eltdf-grid-800 .eltdf-grid,
    .eltdf-grid-800 .eltdf-row-grid-section,
    .eltdf-grid-1000 .eltdf-container-inner,
    .eltdf-grid-1000 .eltdf-grid,
    .eltdf-grid-1000 .eltdf-row-grid-section,
    .eltdf-grid-1200 .eltdf-container-inner,
    .eltdf-grid-1200 .eltdf-grid,
    .eltdf-grid-1200 .eltdf-row-grid-section,
    .eltdf-grid-1300 .eltdf-container-inner,
    .eltdf-grid-1300 .eltdf-grid,
    .eltdf-grid-1300 .eltdf-row-grid-section,
    .eltdf-grid-1500 .eltdf-container-inner,
    .eltdf-grid-1500 .eltdf-grid,
    .eltdf-grid-1500 .eltdf-row-grid-section {
        width: 1100px !important;
    }
}

@media only screen and (min-width: 1400px) {
    /* Desktop large - 1300px container */
    .eltdf-container-inner,
    .eltdf-grid,
    .eltdf-row-grid-section,
    .eltdf-grid-800 .eltdf-container-inner,
    .eltdf-grid-800 .eltdf-grid,
    .eltdf-grid-800 .eltdf-row-grid-section,
    .eltdf-grid-1000 .eltdf-container-inner,
    .eltdf-grid-1000 .eltdf-grid,
    .eltdf-grid-1000 .eltdf-row-grid-section,
    .eltdf-grid-1200 .eltdf-container-inner,
    .eltdf-grid-1200 .eltdf-grid,
    .eltdf-grid-1200 .eltdf-row-grid-section,
    .eltdf-grid-1300 .eltdf-container-inner,
    .eltdf-grid-1300 .eltdf-grid,
    .eltdf-grid-1300 .eltdf-row-grid-section,
    .eltdf-grid-1500 .eltdf-container-inner,
    .eltdf-grid-1500 .eltdf-grid,
    .eltdf-grid-1500 .eltdf-row-grid-section {
        width: 1300px !important;
    }
}

@media only screen and (min-width: 1600px) {
    /* Desktop extra large - 1500px container */
    .eltdf-container-inner,
    .eltdf-grid,
    .eltdf-row-grid-section,
    .eltdf-grid-800 .eltdf-container-inner,
    .eltdf-grid-800 .eltdf-grid,
    .eltdf-grid-800 .eltdf-row-grid-section,
    .eltdf-grid-1000 .eltdf-container-inner,
    .eltdf-grid-1000 .eltdf-grid,
    .eltdf-grid-1000 .eltdf-row-grid-section,
    .eltdf-grid-1200 .eltdf-container-inner,
    .eltdf-grid-1200 .eltdf-grid,
    .eltdf-grid-1200 .eltdf-row-grid-section,
    .eltdf-grid-1300 .eltdf-container-inner,
    .eltdf-grid-1300 .eltdf-grid,
    .eltdf-grid-1300 .eltdf-row-grid-section,
    .eltdf-grid-1500 .eltdf-container-inner,
    .eltdf-grid-1500 .eltdf-grid,
    .eltdf-grid-1500 .eltdf-row-grid-section {
        width: 1500px !important;
    }
}

/* Boxed layout overrides */
@media only screen and (min-width: 768px) {
    .eltdf-boxed .eltdf-footer-inner,
    .eltdf-boxed .eltdf-wrapper-inner {
        width: 950px !important;
    }
    
    .eltdf-boxed .eltdf-page-header .eltdf-fixed-wrapper.fixed,
    .eltdf-boxed .eltdf-page-header .eltdf-sticky-header {
        width: 950px !important;
        left: auto !important;
    }
}

@media only screen and (min-width: 1024px) {
    .eltdf-boxed .eltdf-footer-inner,
    .eltdf-boxed .eltdf-wrapper-inner {
        width: 1050px !important;
    }
    
    .eltdf-boxed .eltdf-page-header .eltdf-fixed-wrapper.fixed,
    .eltdf-boxed .eltdf-page-header .eltdf-sticky-header {
        width: 1050px !important;
        left: auto !important;
    }
}

@media only screen and (min-width: 1200px) {
    .eltdf-boxed .eltdf-footer-inner,
    .eltdf-boxed .eltdf-wrapper-inner {
        width: 1150px !important;
    }
    
    .eltdf-boxed .eltdf-page-header .eltdf-fixed-wrapper.fixed,
    .eltdf-boxed .eltdf-page-header .eltdf-sticky-header {
        width: 1150px !important;
        left: auto !important;
    }
}

@media only screen and (min-width: 1400px) {
    .eltdf-boxed .eltdf-footer-inner,
    .eltdf-boxed .eltdf-wrapper-inner {
        width: 1350px !important;
    }
    
    .eltdf-boxed .eltdf-page-header .eltdf-fixed-wrapper.fixed,
    .eltdf-boxed .eltdf-page-header .eltdf-sticky-header {
        width: 1350px !important;
        left: auto !important;
    }
}

@media only screen and (min-width: 1600px) {
    .eltdf-boxed .eltdf-footer-inner,
    .eltdf-boxed .eltdf-wrapper-inner {
        width: 1550px !important;
    }
    
    .eltdf-boxed .eltdf-page-header .eltdf-fixed-wrapper.fixed,
    .eltdf-boxed .eltdf-page-header .eltdf-sticky-header {
        width: 1550px !important;
        left: auto !important;
    }
}

/* Wide dropdown menu content adjustments */
@media only screen and (min-width: 768px) {
    .eltdf-wide-dropdown-menu-content-in-grid .eltdf-drop-down .wide .second .inner > ul {
        width: 900px !important;
    }
}

@media only screen and (min-width: 1024px) {
    .eltdf-wide-dropdown-menu-content-in-grid .eltdf-drop-down .wide .second .inner > ul {
        width: 1000px !important;
    }
}

@media only screen and (min-width: 1200px) {
    .eltdf-wide-dropdown-menu-content-in-grid .eltdf-drop-down .wide .second .inner > ul {
        width: 1100px !important;
    }
}

@media only screen and (min-width: 1400px) {
    .eltdf-wide-dropdown-menu-content-in-grid .eltdf-drop-down .wide .second .inner > ul {
        width: 1300px !important;
    }
}

@media only screen and (min-width: 1600px) {
    .eltdf-wide-dropdown-menu-content-in-grid .eltdf-drop-down .wide .second .inner > ul {
        width: 1500px !important;
    }
}

/* Custom unified grid system end */

/* ========================================
   MOBILE RESPONSIVE OVERRIDES
   ======================================== */

/* Override parent theme's fixed mobile widths with responsive percentages */
@media only screen and (max-width: 768px) {
    .eltdf-grid,
    .eltdf-container-inner,
    .eltdf-row-grid-section {
        width: 90% !important;
    }
}

@media only screen and (max-width: 680px) {
    .eltdf-grid,
    .eltdf-container-inner,
    .eltdf-row-grid-section {
        width: 90% !important;
    }
}

@media only screen and (max-width: 480px) {
    .eltdf-grid,
    .eltdf-container-inner,
    .eltdf-row-grid-section {
        width: 90% !important;
    }
}

/* ========================================
   LOGO HEIGHT ADJUSTMENTS
   ======================================== */

/* Default logo height for desktop */
.eltdf-page-header .eltdf-menu-area .eltdf-logo-wrapper a {
    max-height: 35px !important;
}

/* Logo height for laptops and smaller screens */
@media only screen and (max-width: 1440px) {
    .eltdf-page-header .eltdf-menu-area .eltdf-logo-wrapper a {
        max-height: 25px !important;
    }
}

/* Mobile logo height */
.eltdf-mobile-header .eltdf-mobile-logo-wrapper a {
    height: 35px !important;
}

/* ==========================================================================
   Side Area - Slide From Left With Content Animation
   ========================================================================== */

/* New slide from left with content animation */
.eltdf-side-menu-slide-from-left-with-content {
    overflow-x: hidden;
    position: relative;
    left: 0;
    -webkit-overflow-scrolling: auto !important;
    -webkit-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1);
    -o-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1);
    transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1);
}

/* Position side menu on the left instead of right */
.eltdf-side-menu-slide-from-left-with-content .eltdf-side-menu {
    visibility: visible;
    right: auto;
    left: -504px;
    -webkit-box-shadow: 3px 0 3px rgba(0, 0, 0, 0.04);
    box-shadow: 3px 0 3px rgba(0, 0, 0, 0.04);
}

/* Smooth transitions for wrapper and other elements */
.eltdf-side-menu-slide-from-left-with-content footer.eltdf-footer-uncover,
.eltdf-side-menu-slide-from-left-with-content .eltdf-wrapper {
    -webkit-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1);
    -o-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1);
    transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1);
}

.eltdf-side-menu-slide-from-left-with-content .eltdf-sticky-header,
.eltdf-side-menu-slide-from-left-with-content .eltdf-fixed-wrapper.fixed,
.eltdf-side-menu-slide-from-left-with-content .eltdf-mobile-header-inner {
    -webkit-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1);
    -o-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1);
    transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1);
}

/* When opened - slide content to the right and bring side menu from left */
.eltdf-side-menu-slide-from-left-with-content.eltdf-left-side-menu-open .eltdf-wrapper,
.eltdf-side-menu-slide-from-left-with-content.eltdf-left-side-menu-open footer.eltdf-footer-uncover,
.eltdf-side-menu-slide-from-left-with-content.eltdf-left-side-menu-open .eltdf-sticky-header,
.eltdf-side-menu-slide-from-left-with-content.eltdf-left-side-menu-open .eltdf-fixed-wrapper,
.eltdf-side-menu-slide-from-left-with-content.eltdf-left-side-menu-open .eltdf-mobile-header-inner {
    left: 405px;
}

.eltdf-side-menu-slide-from-left-with-content.eltdf-left-side-menu-open .eltdf-side-menu {
    left: 0;
}

/* ==========================================================================
   Side Area Logo - Simple Approach
   ========================================================================== */

/* Logo in side area - positioned next to close button */
.eltdf-side-area-logo {
    position: absolute;
    top: 33px;
    /* left: 40px; */
    z-index: 1000;
}

.eltdf-side-area-logo img {
    height: 30px;
    width: auto;
    display: block;
}

/* Admin bar adjustment */
.admin-bar .eltdf-side-area-logo {
    top: 68px;
}

/* Add spacing between logo and side area content */
.eltdf-side-area-logo + .eltdf-side-area-inner,
.eltdf-side-area-inner {
    padding-top: 50px !important; /* Space for logo + margin */
}

/* Mobile responsive */
@media only screen and (max-width: 768px) {
    .eltdf-side-area-logo {
        top: 25px;
        left: 30px;
    }
    
    .eltdf-side-area-logo img {
        height: 25px;
    }
    
    /* Adjust spacing for mobile */
    .eltdf-side-area-logo + .eltdf-side-area-inner,
    .eltdf-side-area-inner {
        padding-top: 70px !important; /* Smaller spacing on mobile */
    }
}
