/* Global Styles */
body { 
    font-family: 'Noto Sans Bengali', Arial, sans-serif; 
    background: white; 
    color: black; 
}

header { 
    background: black; 
    color: white; 
    padding: 10px; 
}

nav { 
    display: flex; 
    justify-content: space-between; 
}

.hero { 
    background: white; 
    padding: 50px; 
    text-align: center; 
}

.card-fun { 
    border: none; 
    box-shadow: 0 4px 8px gray; 
    padding: 20px; 
    text-align: center; 
    margin: 10px; 
}

.btn-magic { 
    background: black; 
    color: white; 
    border: none; 
    padding: 10px 20px; 
}

.star { 
    font-size: 2em; 
    color: black; 
}

footer { 
    background: black; 
    color: white; 
    padding: 20px; 
    display: grid; 
    grid-template-columns: repeat(5, 1fr); 
    gap: 20px; 
}

.bengali { 
    font-family: 'Noto Sans Bengali'; 
}

/* Responsive Design */
@media (max-width: 768px) { 
    .hero h1 { 
        font-size: 2em; 
    } 
    footer { 
        grid-template-columns: 1fr; 
        text-align: center; 
    }
}

/* Search Bar */
.form-control[placeholder*="Search"] {
    background-color: #f8f9fa !important;
    border: 1px solid #dee2e6 !important;
}

/* Icons */
.bi { 
    color: #000 !important; 
    font-weight: bold; 
}

/* Promo Bar */
.bg-dark small { 
    font-size: 0.875rem;
    text-align: center !important;
}

.bg-dark .btn-close { 
    z-index: 10; 
}

/* Mobile Navigation */
@media (max-width: 992px) {
    .navbar-collapse { 
        background: rgb(255, 255, 255); 
        padding: 1rem; 
    }
}

.nav-2{  
    background: black; 
    color: white; 
    border: none; 
    padding: 10px 20px; 
}

/* Hero Image */
.hero img { 
    object-fit: contain !important;
    height: auto !important;
    max-height: 500px !important;
    border-radius: 15px !important;
}

/* Hero Section */
.hero { 
    margin-top: 0 !important; 
    padding-top: 1rem !important;
}

/* Stars */
.hero .position-absolute { 
    z-index: 2; 
    opacity: 0.9; 
    font-size: 2rem; 
}

/* Responsive Hero */
@media (max-width: 992px) {
    .hero img { 
        max-height: 300px !important; 
    }
    .hero { 
        padding-top: 0.5rem !important; 
    }
}

/* Product Cards */
.top-selling img { 
    display: block !important; 
}

.top-selling .card-img-top { 
    border-top-left-radius: 15px !important; 
    border-top-right-radius: 15px !important; 
}

.top-selling .row-cols-md-4 .col { 
    flex: 0 0 24%; 
    max-width: 24%; 
}

.top-selling .card:hover { 
    transform: scale(1.02); 
    box-shadow: 0 8px 25px rgba(0,0,0,0.1); 
}

/* Responsive Cards */
@media (max-width: 768px) { 
    .top-selling .row-cols-md-4 .col { 
        flex: 0 0 100%; 
        max-width: 100%; 
    } 
}

/* Testimonials */
.card img.rounded-circle { 
    border: 3px solid #ffc107 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1); 
}

.row-cols-md-3 .col { 
    flex: 0 0 32%; 
    max-width: 32%; 
}

.card p { 
    font-style: italic; 
}

/* Responsive Testimonials */
@media (max-width: 768px) { 
    .row-cols-md-3 .col { 
        flex: 0 0 100%; 
        max-width: 100%; 
    } 
}

/* Footer */
footer .text-start { 
    text-align: left !important; 
}

footer .text-end { 
    text-align: right !important; 
}

footer a:hover { 
    color: #ffc107 !important; 
    text-decoration: none; 
    transition: 0.3s; 
}

footer .d-flex a { 
    transition: 0.3s; 
}

footer .d-flex a:hover { 
    transform: scale(1.2); 
}

/* Responsive Footer */
@media (max-width: 768px) {
    footer .col-6 { 
        text-align: center !important; 
    }
    footer .input-group { 
        max-width: 100%; 
    }
}

/* Footer Links */
footer .row { 
    align-items: start; 
}

footer ul li { 
    margin-bottom: 0.5rem; 
}

footer a:hover { 
    color: #ffc107 !important; 
}

/* Newsletter */
footer input, footer .btn { 
    border-radius: 50px !important; 
    font-weight: 500; 
}

/* Mobile Footer */
@media (max-width: 768px) {
    footer .text-start, footer .text-end { 
        text-align: center !important; 
    }
    footer .col-md-3 { 
        margin-bottom: 1rem; 
    }
}

/* DTF Page */
main .btn-dark { 
    background: #000 !important; 
    border: none !important; 
    color: #fff !important; 
    transition: 0.3s; 
}

main .btn-dark:hover { 
    background: #333 !important; 
    transform: scale(1.05); 
}

.bengali { 
    font-family: 'Noto Sans Bengali', sans-serif !important; 
    line-height: 1.6; 
    color: #000; 
}

.bengali h5 { 
    color: #000; 
}

.bengali ul li { 
    margin-bottom: 0.5rem; 
    list-style-type: disc; 
    padding-left: 1rem; 
}

.upload-slot textarea { 
    resize: none; 
    border: 1px solid #ced4da; 
}

/* Wholesale Page */
.hero { 
    text-align: center !important; 
    min-height: 50vh !important; 
    padding-top: 1rem !important; 
    padding-bottom: 1rem !important; 
}

.hero .row { 
    justify-content: center !important; 
}

.hero img { 
    display: none; 
}

.hero h1 { 
    white-space: nowrap; 
}

.hero .btn { 
    display: none; 
}

.py-3 { 
    padding-top: 1rem !important; 
    padding-bottom: 1rem !important; 
}

.row-cols-md-4 .col { 
    flex: 0 0 24%; 
    max-width: 24%; 
}

.card-img-top { 
    border-top-left-radius: 15px !important; 
    border-top-right-radius: 15px !important; 
}

.card { 
    transition: 0.3s; 
    border-radius: 15px !important; 
}

.card:hover { 
    transform: translateY(-5px); 
    box-shadow: 0 8px 25px rgba(0,0,0,0.1); 
}

.text-warning { 
    color: #ffc107 !important; 
}

@media (max-width: 768px) { 
    .row-cols-md-4 .col { 
        flex: 0 0 100%; 
        max-width: 100%; 
    } 
}

/* Admin Panel */
.table { 
    width: 100%; 
}

.table th, .table td { 
    vertical-align: middle; 
}

.btn-sm { 
    padding: 0.25rem 0.5rem; 
    font-size: 0.875rem; 
}

.modal-content { 
    border-radius: 15px; 
}

.form-control { 
    border: 1px solid #ced4da; 
}

/* Product Details */
.card { 
    border-radius: 15px !important; 
    transition: 0.3s; 
}

.card:hover { 
    transform: translateY(-5px); 
    box-shadow: 0 8px 25px rgba(0,0,0,0.2); 
}

.card-img-top { 
    border-top-left-radius: 15px !important; 
    border-top-right-radius: 15px !important; 
}

.btn-outline-dark.active { 
    background: #000; 
    color: #fff; 
}

.btn-secondary.active { 
    border: 2px solid #fff !important; 
}

.alert-success { 
    border-radius: 10px; 
}
.modal {
    z-index: 1050;
}
.modal-backdrop {
    z-index: 1040;
}
.modal-dialog {
    z-index: 1055;
}