/* Event View Page Additional Fixes */

/* LightGallery overlay opacity */
.lg-backdrop {
    background-color: rgba(0, 0, 0, 0.5) !important;
}

.lg-outer {
    background-color: rgba(0, 0, 0, 0.5) !important;
}

/* Modal backdrop opacity */
.modal-backdrop {
    background-color: rgba(0, 0, 0, 0.5) !important;
}

/* Prevent overflow issues */
.ev_recent_posts, .ev_recent_posts_mobile {
    overflow: hidden !important;
    word-wrap: break-word !important;
    box-sizing: border-box !important;
}

.ev_rcnt_post_row {
    overflow: hidden !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.ev_rcnt_post_row a {
    overflow: hidden !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.ev_post_desc {
    overflow: hidden !important;
    min-width: 0 !important;
}

.ev_post_title, .ev_post_date {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

/* Ensure proper container constraints */
.right_side_area {
    overflow: hidden !important;
    box-sizing: border-box !important;
}

.left_side_area {
    overflow: hidden !important;
    box-sizing: border-box !important;
}

/* Event card hover effects */
.sm_f_proj_card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.sm_f_proj_card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}

/* Gallery image hover effects */
.gItem {
    display: block;
    overflow: hidden;
    border-radius: 8px;
}

.gItem .g-image {
    transition: transform 0.3s ease;
}

.gItem:hover .g-image {
    transform: scale(1.05);
}

/* Responsive improvements for very small screens */
@media only screen and (max-width: 320px) {
    .ev_dt_titles h3 {
        font-size: 18px !important;
    }
    
    .ev_dt_main_img_cont {
        height: 200px !important;
    }
    
    .g-image {
        height: 150px !important;
    }
    
    .sm_f_proj_card .card_img {
        height: 150px !important;
    }
    
    .ev_post_title {
        font-size: 12px !important;
    }
    
    .ev_post_date {
        font-size: 10px !important;
    }
}

/* iPad specific fixes */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
    .ev_recent_posts_mobile {
        margin: 20px auto !important;
        max-width: 95% !important;
        width: 95% !important;
        padding: 20px !important;
    }
    
    .ev_rcnt_post_row {
        padding: 15px 0 !important;
        margin-bottom: 10px !important;
    }
    
    .ev_post_thmb_container {
        width: 100px !important;
        height: 75px !important;
        margin-right: 20px !important;
    }
    
    .ev_post_title {
        font-size: 16px !important;
        line-height: 1.4 !important;
        margin-bottom: 8px !important;
    }
    
    .ev_post_date {
        font-size: 14px !important;
    }
    
    .main_body_cont {
        padding: 0 20px !important;
    }
    
    .left_side_area {
        padding: 0 10px !important;
    }
    
    .gallery_slider_container {
        padding: 0 20px !important;
    }
    
    .sm-f-p-container {
        padding: 0 20px !important;
    }
    
    .related_ev_title {
        padding: 0 20px !important;
    }
    
    /* More Events section - Force single column layout on iPad */
    .sm-f-p-container .row .col-lg-4,
    .sm-f-p-container .row .col-md-6,
    .sm-f-p-container .row .col-sm-6,
    .sm-f-p-container .row .col-6 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        margin-bottom: 20px !important;
    }
    
    .sm_f_proj_card {
        max-width: 100% !important;
        margin: 0 auto 20px auto !important;
    }
    
    /* Ensure proper card title spacing */
    .sm_f_proj_card .card_title {
        font-size: 16px !important;
        line-height: 1.4 !important;
        padding: 15px !important;
        word-wrap: break-word !important;
        hyphens: auto !important;
    }
    
    .sm_f_proj_card .card_desc {
        padding: 0 15px 15px 15px !important;
        font-size: 14px !important;
        line-height: 1.4 !important;
    }
}

/* iPad Pro and larger tablets */
@media only screen and (min-width: 1024px) and (max-width: 1366px) {
    .ev_recent_posts_mobile {
        margin: 30px auto !important;
        max-width: 90% !important;
        width: 90% !important;
        padding: 25px !important;
    }
    
    .ev_rcnt_post_row {
        padding: 18px 0 !important;
        margin-bottom: 15px !important;
    }
    
    .ev_post_thmb_container {
        width: 120px !important;
        height: 90px !important;
        margin-right: 25px !important;
    }
    
    .ev_post_title {
        font-size: 18px !important;
        line-height: 1.4 !important;
        margin-bottom: 10px !important;
    }
    
    .ev_post_date {
        font-size: 16px !important;
    }
}

/* Fix for event status positioning on cards */
.sm_f_p_card_body .p_status {
    position: absolute;
    top: 15px;
    right: 15px;
    transform: none;
}

/* Recent posts styling improvements */
.ev_cat_title {
    color: #333;
    font-weight: 600;
    margin-bottom: 15px;
}

.ev-cat-border-bottom {
    border-bottom: 2px solid #18449C;
    width: 30px;
    margin-bottom: 20px;
}

/* Additional overflow prevention */
* {
    word-wrap: break-word;
}

.container, .container-fluid {
    overflow-x: hidden;
}

/* iPad specific overflow prevention */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
    body {
        overflow-x: hidden !important;
    }
    
    .main_body_cont {
        overflow-x: hidden !important;
        width: 100% !important;
        max-width: 100vw !important;
    }
    
    .left_side_area {
        overflow-x: hidden !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    
    .ev_recent_posts_mobile {
        overflow-x: hidden !important;
        word-wrap: break-word !important;
        hyphens: auto !important;
    }
    
    .ev_rcnt_post_row {
        overflow-x: hidden !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    
    .ev_rcnt_post_row a {
        overflow-x: hidden !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    
    .ev_post_desc {
        overflow-x: hidden !important;
        word-wrap: break-word !important;
        hyphens: auto !important;
        min-width: 0 !important;
    }
}

/* Recent posts thumbnail improvements */
.ev_post_thmb_container {
    flex-shrink: 0 !important;
}

/* Text truncation for long titles */
.ev_post_title {
    max-width: 100%;
    display: block;
}

/* Viewport constraints for all devices */
html, body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
}

/* Specific fixes for Safari on iPad */
@supports (-webkit-overflow-scrolling: touch) {
    .ev_recent_posts_mobile,
    .ev_recent_posts {
        -webkit-overflow-scrolling: touch;
        overflow-x: hidden !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    
    .ev_rcnt_post_row {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        width: 100% !important;
        max-width: 100% !important;
    }
    
    .ev_post_desc {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        overflow: hidden !important;
        word-wrap: break-word !important;
    }
}

/* iPad specific layout fixes */
@media only screen and (min-width: 768px) and (max-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
    /* Force proper container sizing */
    .container {
        max-width: 100% !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    
    .container-fluid {
        max-width: 100vw !important;
        overflow-x: hidden !important;
    }
    
    /* Recent posts specific iPad fixes */
    .ev_recent_posts_mobile {
        margin: 20px auto !important;
        width: calc(100% - 40px) !important;
        max-width: calc(100% - 40px) !important;
        padding: 20px !important;
        border-radius: 10px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }
    
    .ev_rcnt_post_row {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
        padding: 12px 0 !important;
        margin-bottom: 15px !important;
        border-bottom: 1px solid #f0f0f0 !important;
    }
    
    .ev_rcnt_post_row:last-child {
        border-bottom: none !important;
    }
    
    .ev_rcnt_post_row a {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
        text-decoration: none !important;
        color: inherit !important;
    }
    
    .ev_post_thmb_container {
        flex-shrink: 0 !important;
        width: 100px !important;
        height: 75px !important;
        margin-right: 15px !important;
        overflow: hidden !important;
        border-radius: 8px !important;
    }
    
    .ev_post_thmb {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }
    
    .ev_post_desc {
        flex: 1 !important;
        min-width: 0 !important;
        overflow: hidden !important;
        word-wrap: break-word !important;
        hyphens: auto !important;
    }
    
    .ev_post_title {
        font-size: 16px !important;
        font-weight: 600 !important;
        line-height: 1.4 !important;
        margin-bottom: 5px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        color: #333 !important;
    }
    
    .ev_post_date {
        font-size: 14px !important;
        color: #666 !important;
        margin: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }
    
    /* Gallery fixes for iPad */
    .gallery_slider_container {
        padding: 0 20px !important;
        overflow: hidden !important;
    }
    
    .gallery-item-wrapper {
        padding: 10px !important;
    }
    
    .g-image {
        width: 100% !important;
        height: 280px !important;
        object-fit: cover !important;
        border-radius: 8px !important;
    }
    
    /* More Events section fixes */
    .sm-f-p-container {
        padding: 0 20px !important;
        overflow: hidden !important;
    }
    
    .related_ev_title {
        padding: 0 20px !important;
        margin-top: 50px !important;
    }
}

/* iPad Pro specific fixes */
@media only screen and (min-width: 1024px) and (max-width: 1366px) and (-webkit-min-device-pixel-ratio: 2) {
    .ev_recent_posts_mobile {
        margin: 30px auto !important;
        width: calc(100% - 60px) !important;
        max-width: calc(100% - 60px) !important;
        padding: 25px !important;
    }
    
    .ev_post_thmb_container {
        width: 120px !important;
        height: 90px !important;
        margin-right: 20px !important;
    }
    
    .ev_post_title {
        font-size: 18px !important;
    }
    
    .ev_post_date {
        font-size: 16px !important;
    }
}