/*
=========================================
TASKAUTOFY LIVE COMMERCE
STYLE.CSS
=========================================
*/

*{
    box-sizing:border-box;
}

.taf-store-wrapper,
.taf-search-wrapper,
.taf-dashboard{
    max-width:1400px;
    margin:20px auto;
    padding:20px;
    font-family:Arial,Helvetica,sans-serif;
}

/*
=========================================
SEARCH
=========================================
*/

.taf-search-form{
    display:flex;
    gap:10px;
    margin-bottom:30px;
}

.taf-search-form input{
    flex:1;
    padding:14px;
    border:1px solid #ddd;
    border-radius:10px;
}

.taf-search-form button{
    padding:14px 25px;
    border:none;
    border-radius:10px;
    background:#0d6efd;
    color:#fff;
    cursor:pointer;
}

/*
=========================================
STORE GRID
=========================================
*/

.taf-business-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
    gap:20px;
}

.taf-business-card{
    background:#fff;
    border-radius:15px;
    padding:20px;
    box-shadow:0 5px 15px rgba(0,0,0,.08);
    text-align:center;
    transition:.3s;
}

.taf-business-card:hover{
    transform:translateY(-4px);
}

.taf-business-logo{
    width:90px;
    height:90px;
    object-fit:cover;
    border-radius:50%;
    margin-bottom:15px;
}

.taf-rating{
    margin:10px 0;
    font-size:14px;
    color:#555;
}

.taf-btn{
    display:inline-block;
    padding:10px 18px;
    border-radius:10px;
    text-decoration:none;
    background:#198754;
    color:#fff;
}

/*
=========================================
STORE HEADER
=========================================
*/

.taf-banner img{
    width:100%;
    height:260px;
    object-fit:cover;
    border-radius:20px;
}

.taf-business-header{
    background:#fff;
    margin-top:20px;
    border-radius:20px;
    padding:30px;
    text-align:center;
    box-shadow:0 5px 15px rgba(0,0,0,.08);
}

.taf-business-logo-large{
    width:130px;
    height:130px;
    border-radius:50%;
    object-fit:cover;
    margin-bottom:15px;
}

.taf-business-header h1{
    margin:10px 0;
}

.taf-rating-large{
    font-size:20px;
    margin:10px 0;
    font-weight:bold;
}

.taf-business-info{
    margin-top:15px;
}

.taf-business-info p{
    margin:8px 0;
}

/*
=========================================
LIVE STREAM
=========================================
*/

.taf-live-stream{
    margin-top:30px;
    background:#fff;
    padding:20px;
    border-radius:20px;
    box-shadow:0 5px 15px rgba(0,0,0,.08);
}

.taf-live-stream iframe{
    border:none;
    border-radius:15px;
}

/*
=========================================
PRODUCTS
=========================================
*/

.taf-products{
    margin-top:30px;
}

.taf-products h2{
    margin-bottom:20px;
}

.taf-product-card{
    background:#fff;
    border-radius:15px;
    padding:20px;
    margin-bottom:20px;
    box-shadow:0 5px 15px rgba(0,0,0,.08);
}

.taf-product-card h3{
    margin-top:0;
}

.taf-product-card input{
    width:100%;
    padding:12px;
    margin-top:12px;
    border:1px solid #ddd;
    border-radius:10px;
}

.taf-buy-btn{
    width:100%;
    margin-top:12px;
    padding:14px;
    border:none;
    border-radius:10px;
    background:#198754;
    color:#fff;
    font-size:16px;
    cursor:pointer;
}

/*
=========================================
BOOKING FORM
=========================================
*/

.taf-booking-form{
    margin-top:15px;
}

.taf-booking-form input{
    width:100%;
    padding:12px;
    margin-bottom:10px;
    border:1px solid #ddd;
    border-radius:10px;
}

.taf-booking-total{
    font-size:18px;
    font-weight:bold;
    margin:10px 0;
}

.taf-submit-booking{
    width:100%;
    padding:14px;
    background:#0d6efd;
    color:#fff;
    border:none;
    border-radius:10px;
    cursor:pointer;
}

/*
=========================================
REVIEWS
=========================================
*/

.taf-review-form{
    margin-top:20px;
    background:#f9f9f9;
    padding:15px;
    border-radius:12px;
}

.taf-review-form input,
.taf-review-form textarea,
.taf-review-form select{
    width:100%;
    margin-bottom:10px;
    padding:10px;
    border:1px solid #ddd;
    border-radius:10px;
}

.taf-submit-review{
    width:100%;
    padding:12px;
    border:none;
    border-radius:10px;
    background:#ff9800;
    color:#fff;
    cursor:pointer;
}

.taf-review-list{
    margin-top:20px;
}

.taf-review-item{
    padding:15px;
    border-bottom:1px solid #eee;
}

.taf-review-stars{
    font-size:18px;
    margin-bottom:8px;
}

.taf-review-phone{
    font-weight:bold;
    margin-bottom:8px;
}

/*
=========================================
DASHBOARD
=========================================
*/

.taf-stats-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
    gap:15px;
    margin:25px 0;
}

.taf-stat-card{
    background:#fff;
    border-radius:15px;
    padding:20px;
    text-align:center;
    box-shadow:0 5px 15px rgba(0,0,0,.08);
}

.taf-stat-card h3{
    margin:0 0 10px;
    font-size:16px;
}

.taf-stat-card strong{
    font-size:24px;
}

/*
=========================================
TABLES
=========================================
*/

.taf-table{
    width:100%;
    border-collapse:collapse;
    margin-top:20px;
    background:#fff;
    border-radius:15px;
    overflow:hidden;
}

.taf-table th{
    background:#0d6efd;
    color:#fff;
    padding:14px;
    text-align:left;
}

.taf-table td{
    padding:12px;
    border-bottom:1px solid #eee;
}

.taf-confirm-payment{
    padding:8px 15px;
    border:none;
    border-radius:8px;
    background:#198754;
    color:#fff;
    cursor:pointer;
}

/*
=========================================
ALERTS
=========================================
*/

.taf-alert{
    background:#fff3cd;
    color:#664d03;
    padding:15px;
    border-radius:10px;
    margin:20px 0;
}

/*
=========================================
WHATSAPP BUTTON
=========================================
*/

.taf-whatsapp-btn{
    display:inline-block;
    background:#25D366;
    color:#fff;
    text-decoration:none;
    padding:12px 20px;
    border-radius:10px;
    margin-top:10px;
}

/*
=========================================
CALL BUTTON
=========================================
*/

.taf-call-btn{
    display:inline-block;
    background:#198754;
    color:#fff;
    text-decoration:none;
    padding:12px 20px;
    border-radius:10px;
    margin-top:10px;
}

/*
=========================================
RESPONSIVE
=========================================
*/

@media(max-width:768px){

    .taf-search-form{
        flex-direction:column;
    }

    .taf-business-header{
        padding:20px;
    }

    .taf-business-logo-large{
        width:100px;
        height:100px;
    }

    .taf-banner img{
        height:180px;
    }

    .taf-table{
        display:block;
        overflow-x:auto;
        white-space:nowrap;
    }

    .taf-stats-grid{
        grid-template-columns:1fr;
    }
}
.taf-toolbar{display:flex;gap:10px;margin:15px 0}.taf-toolbar input,.taf-toolbar select{padding:10px}
.taf-view-product{width:100%;padding:10px;background:#ff5722;color:#fff;border:0;border-radius:8px}
.taf-product-details{padding:15px;background:#fafafa}


/* V9 Marketplace */
.taf-toolbar{display:flex;gap:10px;flex-wrap:wrap;position:sticky;top:0;background:#fff;padding:10px;z-index:99}
.taf-products-scroll{max-height:900px;overflow:auto}
.taf-product-card{border:1px solid #eee;border-radius:15px;padding:15px;margin:10px;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.08)}
.taf-view-product{background:#ff5722;color:#fff;border:none;padding:10px 15px;border-radius:8px}
.taf-product-details{display:none}
@media(max-width:768px){
.taf-products-scroll{display:flex;overflow-x:auto;gap:10px}
.taf-product-card{min-width:260px}
}

.taf-products-scroll{display:flex;overflow-x:auto;gap:15px;padding:10px}
.taf-product-card{min-width:300px;background:#fff;border:1px solid #ddd;border-radius:12px;padding:12px}
.taf-product-image{width:100%;height:180px;object-fit:cover}
.taf-view-product{width:100%;padding:10px}


/* V11 UI */
.taf-toolbar{display:flex;gap:10px;flex-wrap:wrap;margin:15px 0}
.taf-toolbar input,.taf-toolbar select{padding:12px;border:1px solid #ddd;border-radius:10px}
.taf-products-scroll{display:flex;overflow-x:auto;gap:15px;padding:10px}
.taf-product-card{min-width:300px;max-width:300px}
.taf-product-details{display:none}