/**
 * Fix-scaling.css
 * File CSS riêng để xử lý vấn đề OS Display Scaling 150% trên Windows
 */

/* Xử lý vấn đề OS Display Scaling 150% */
@media (-webkit-device-pixel-ratio: 1.5), (resolution: 144dpi) {
    /* Áp dụng zoom ngược lại để cân bằng với scaling của OS */
    :root {
        zoom: 0.667; /* 1/1.5 = 0.667 */
    }

    /* Điều chỉnh menu để hiển thị đúng */
    .header-container {
        transform-origin: top center;
    }

    /* Đảm bảo menu dropdown hiển thị đúng vị trí */
    .navbar-nav .dropdown-menu {
        transform-origin: top left;
    }

    /* Đảm bảo các phần tử trong menu không bị lệch */
    .navbar-nav .nav-item {
        transform: translateZ(0);
        backface-visibility: hidden;
    }
    
   .slider-home .person.left {
        left: 29vw;
    }
    .slider-home .person.right {
        right: 29vw;
    }
    .central-cups {
        display: block;
    }
    .circle-bg {
     left: -60px;
    }
    .hero {
     height: min(104vh, 820px);
    }
    .circle-wrapper .photo {
        margin: -55px 0 0 -8px;
    }
    .ice-cube { width: 100px;}

    #tea-section {
        height: 1249px;
    }
    .nkv-arrow.nkv-next{
        right: 435.4px !important;
        top: 200px !important;
    }
    .nkv-arrow.nkv-prev{
        left: 436.4px !important;
        top: 200px !important;
    }
    
}

/* Xử lý vấn đề OS Display Scaling 125% */
@media (-webkit-device-pixel-ratio: 1.25), (resolution: 120dpi) {
    /* Áp dụng zoom ngược lại để cân bằng với scaling của OS */
    :root {
        zoom: 0.8; /* 1/1.25 = 0.8 */
    }

    /* Điều chỉnh menu để hiển thị đúng */
    .header-container {
        transform-origin: top center;
    }

    /* Đảm bảo menu dropdown hiển thị đúng vị trí */
    .navbar-nav .dropdown-menu {
        transform-origin: top left;
    }
    .person.left {
        left: 20vw;
    }
    .person.right {
        right: 20vw;
    }
    .hero {
         height: min(100vh, 820px);
    }
    #tea-section {
    height: calc(var(--hero-h) + var(--rise) + 190px);
    }
    .nkv-arrow.nkv-next{
        right: 435.4px !important;
    }
    .nkv-arrow.nkv-prev{
        left: 436.4px !important;
    }
}

/* Đảm bảo các phần tử trong menu không bị lệch khi có scaling */
.menu-content-header {
    transform: translateZ(0);
    backface-visibility: hidden;
}

/* Đảm bảo logo không bị biến dạng */
.logo img {
    transform: translateZ(0);
    backface-visibility: hidden;
}

/* Đảm bảo menu dropdown hiển thị đúng */
.navbar-nav .dropdown-menu {
    transform: translateZ(0);
    backface-visibility: hidden;
}