/* ============================================
   STYLE.CSS - FILE CSS CHÍNH
   ============================================
   
   File này import tất cả các file CSS module
   để dễ dàng quản lý và bảo trì
   
   Cấu trúc thư mục:
   assets/css/
   ├── variables.css (biến CSS)
   ├── reset.css (reset style mặc định)
   ├── utilities.css (utility classes)
   ├── components/ (các component chung)
   │   ├── buttons.css
   │   ├── header.css
   │   ├── footer.css
   │   ├── swiper.css
   │   └── forms.css
   ├── pages/ (CSS cho từng trang)
   │   ├── home.css (trang chủ)
   │   └── other.css (các trang khác)
   ├── responsive.css (media queries)
   └── style.css (file này)
   
   ============================================ */

/* Import biến CSS */
@import 'variables.css';

/* Import reset styles */
@import 'reset.css';

/* Import utilities */
@import 'utilities.css';

/* Import components */
@import 'components/buttons.css';
@import 'components/header.css';
@import 'components/footer.css';
@import 'components/swiper.css';
@import 'components/forms.css';
@import 'components/post-info.css';
@import 'components/cart.css';
@import 'components/modal.css';

/* Import page styles */
@import 'pages/home.css';
@import 'pages/other.css';
@import 'pages/about.css';
@import 'pages/tripod-model.css';
@import 'pages/expert-team.css';
@import 'pages/gallery.css';
@import 'pages/auth.css';
@import 'pages/contact.css';
@import 'pages/news.css';
@import 'pages/marketplace.css';
@import 'pages/order.css';
@import 'pages/personal.css';
@import 'pages/12-skills-landing.css';
@import 'pages/payment.css';

.vl-shown {
    overflow: hidden;
}

.vl-overlay {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    align-items: center;
    display: none;
    justify-content: center;
    overflow: hidden;
    z-index: 9999;
}

    .vl-overlay.vl-active {
        display: flex;
    }

    .vl-overlay.vl-full-page {
        z-index: 9999;
        position: fixed;
    }

    .vl-overlay .vl-background {
        bottom: 0;
        left: 0;
        position: absolute;
        right: 0;
        top: 0;
        background: #fff;
        opacity: 0.5;
    }

    .vl-overlay .vl-icon, .vl-parent {
        position: relative;
    }

/* ============================================
   KẾT THÚC STYLE.CSS
   
   Lưu ý: Responsive CSS đã được tích hợp
   vào từng file component tương ứng
   ============================================ */