/* Fix for 50/50 split layout */
.wp-block-dsn-split {
    width: 100vw !important;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    transform: none;
    box-sizing: border-box;
    /* Add this to prevent any unexpected spacing */
    font-size: 0;
    line-height: 0;
}

.wp-block-dsn-split .dsn-split-container {
    display: flex !important;
    flex-direction: row !important;
    /* Add this to ensure container only takes necessary space */
    min-height: 0;
}

/* At exactly 1440px width, use true 50/50 of viewport */
@media (width: 1440px) {
    .wp-block-dsn-split .dsn-split-container {
        max-width: none !important;
        width: 100vw !important;
        margin: 0 !important;
        height: 950px !important;
    }
    
    .wp-block-dsn-split .dsn-split-container .dsn-split-image {
        height: 950px !important;
    }
    
    .wp-block-dsn-split .dsn-split-container .dsn-split-image img {
        height: 950px !important;
    }
}

/* For screens larger than 1440px, respect max width */
@media (min-width: 1441px) {
    .wp-block-dsn-split .dsn-split-container {
        max-width: 1300px !important;
        width: 100% !important;
        margin: 0 auto !important;
        height: auto !important;
    }
    
    .wp-block-dsn-split .dsn-split-container .dsn-split-image {
        height: 100% !important; /* Make image container full height */
    }
    
    .wp-block-dsn-split .dsn-split-container .dsn-split-image img {
        height: 100% !important; /* Make image full height */
        max-height: none !important; /* Remove max-height restriction */
        object-fit: cover !important;
    }
}

/* For screens between 768px and 1440px */
@media (max-width: 1440px) and (min-width: 769px) {
    .wp-block-dsn-split .dsn-split-container {
        max-width: none !important;
        width: 100% !important;
        margin: 0 !important;
        height: auto !important; /* Changed from fixed height to auto */
        min-height: 950px !important; /* Added min-height instead */
    }
    
    .wp-block-dsn-split .dsn-split-container .dsn-split-image {
        height: 100% !important; /* Make image container match container height */
    }
    
    .wp-block-dsn-split .dsn-split-container .dsn-split-image img {
        height: 100% !important;
        min-height: 950px !important; /* Minimum height for the image */
        object-fit: cover !important;
    }
}

/* Fix for desktop view to ensure container matches image height when text is shorter */
@media (min-width: 769px) {
    .wp-block-dsn-split .dsn-split-container {
        height: auto !important;
    }
    
    .wp-block-dsn-split .dsn-split-container .dsn-split-image {
        height: 100% !important;
    }
    
    .wp-block-dsn-split .dsn-split-container .dsn-split-image img {
        display: block !important;
    }
}

.wp-block-dsn-split .dsn-split-container .dsn-split-text {
    width: 50% !important;
    flex: 0 0 50% !important;
    padding: 0px 50px 30px 50px !important; 
    box-sizing: border-box;
    /* Reset font size and line height for text content */
    font-size: initial;
    line-height: initial;
}

/* Additional padding at 1440x900 and above */
@media (min-width: 1440px) {
    .wp-block-dsn-split .dsn-split-container .dsn-split-text {
        padding-right: 50px !important; /* Additional 15px padding */
    }
}

.wp-block-dsn-split .dsn-split-container .dsn-split-image {
    width: 50% !important;
    flex: 0 0 50% !important;
}

.wp-block-dsn-split .dsn-split-container .dsn-split-image img {
    width: 100% !important;
    object-fit: cover !important;
}

/* Mobile styles */
@media (max-width: 768px) {
    .wp-block-dsn-split .dsn-split-container {
        flex-direction: column !important;
        height: auto !important;
    }
    
    .wp-block-dsn-split .dsn-split-container .dsn-split-text {
        width: 100% !important;
        padding: 0px 50px 30px 50px; 
        text-align: left !important;
    }
    
    .wp-block-dsn-split .dsn-split-container .dsn-split-image {
        width: 100% !important;
        height: auto !important;
    }
    
    .wp-block-dsn-split .dsn-split-container .dsn-split-image img {
        width: 100vw !important; /* Full viewport width on mobile */
        height: auto !important;
        aspect-ratio: auto !important; /* Remove square aspect ratio */
    }
    
    .wp-block-dsn-split .dsn-split-text h1,
    .wp-block-dsn-split .dsn-split-text h2,
    .wp-block-dsn-split .dsn-split-text h3,
    .wp-block-dsn-split .dsn-split-text h4,
    .wp-block-dsn-split .dsn-split-text h5,
    .wp-block-dsn-split .dsn-split-text h6 {
        text-align: center !important;
    }

    p{
        text-align: left !important;
    }
}

/* Fix text color issues */
.wp-block-dsn-split .dsn-split-text h1,
.wp-block-dsn-split .dsn-split-text h2,
.wp-block-dsn-split .dsn-split-text h3,
.wp-block-dsn-split .dsn-split-text h4,
.wp-block-dsn-split .dsn-split-text h5,
.wp-block-dsn-split .dsn-split-text h6,
.wp-block-dsn-split .dsn-split-text p {
    color: white !important;
}

/* Paragraph specific size */
.wp-block-dsn-split .dsn-split-text p {
    font-size: 14px !important;
}


.wp-block-dsn-split .dsn-split-text a{
    color: #FFEB3B;
    font-weight: 500;
    /* text-decoration: underline; */
    text-decoration: none;
}

.wp-block-dsn-split .dsn-split-text a:hover {
  text-decoration: underline;
}