/* Touch-Friendly CSS for IPAC Telecom */

/* Ensure all interactive elements have adequate touch targets */
@media (max-width: 991px) {
    /* Buttons */
    .btn,
    button,
    input[type="button"],
    input[type="submit"],
    .nav-link,
    a.card,
    .shop_grid a,
    .product-link {
        min-height: 44px;
        min-width: 44px;
        padding: 10px 15px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    
    /* Form controls */
    input,
    select,
    textarea,
    .form-control {
        min-height: 44px;
        padding: 10px;
        font-size: 16px !important; /* Prevents iOS zoom */
    }
    
    /* Checkboxes and radio buttons */
    input[type="checkbox"],
    input[type="radio"] {
        min-width: 22px;
        min-height: 22px;
        margin-right: 10px;
    }
    
    /* Links in lists */
    li > a {
        padding: 10px 0;
        display: inline-block;
    }
    
    /* Navigation items */
    .nav-menu > li > a {
        padding: 12px 15px !important;
    }
    
    /* Dropdown toggles */
    .dropdown-toggle {
        padding-right: 30px !important; /* Extra space for the caret */
    }
    
    /* Card elements */
    .card-header,
    .card-footer {
        padding: 15px !important;
    }
    
    /* Product grid items */
    .shop_grid_caption {
        padding: 15px !important;
    }
    
    /* Footer links */
    .footer_widget a {
        padding: 8px 0;
        display: inline-block;
    }
    
    /* Social media icons */
    .list-inline-item a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
    }
    
    /* Back to top button */
    #back2Top {
        width: 44px;
        height: 44px;
        line-height: 44px;
    }
    
    /* Cart and wishlist icons */
    .headd-sty-last .nav-menu-social li a {
        padding: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    /* Mobile navigation */
    .mobile_nav ul li a {
        padding: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    /* Improve tap targets for close buttons */
    .close_slide,
    .nav-menus-wrapper-close-button {
        width: 44px;
        height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    /* Add spacing between interactive elements */
    .btn + .btn,
    .form-group + .form-group,
    .nav-item + .nav-item {
        margin-top: 10px;
    }
    
    /* Ensure adequate spacing in grid layouts */
    .row {
        margin-left: -10px;
        margin-right: -10px;
    }
    
    .col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, 
    .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, 
    .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, 
    .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, 
    .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, 
    .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, 
    .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, 
    .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, 
    .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, 
    .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, 
    .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, 
    .col-xl-auto {
        padding-left: 10px;
        padding-right: 10px;
    }
    
    /* Improve scrolling experience */
    .nav-menus-wrapper,
    .cart_select_items,
    .right-ch-sideBar {
        -webkit-overflow-scrolling: touch;
    }
    
    /* Prevent text selection on navigation elements */
    .nav-menu,
    .nav-menu > li > a,
    .btn,
    button {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
    
    /* Add active state for better touch feedback */
    .btn:active,
    .nav-menu > li > a:active,
    .shop_grid:active,
    .card:active {
        opacity: 0.7;
    }
}