/************************************************
VNTrendy / menu-primary.min.css
MAIN ONLY
************************************************/

/* sidebar */
.vnt-main .vnt-category-menu{background:#001639;margin-top:0px;border-radius:0 0 14px 14px;box-shadow:0 8px 25px rgba(0,0,0,.12);position:relative;max-height:335px;z-index:1}
/* KHI CLICK Menu !front-end*/

/* JS mode only */

/* chỉ khi JS add class mới ẩn */
.vnt-main.is-collapsed .vnt-category-menu{display:none}
/* menu */
.vnt-main .cate-menu{display:block;margin:0;padding:0;list-style:none;background:linear-gradient(
    135deg,rgba(255,255,255,0.5),rgba(255,255,255,0.2)
  );backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,0.25);/*border-radius:0 0 14px 14px;box-shadow:0 10px 30px rgba(0,0,0,0.06),inset 0 1px 0 rgba(255,255,255,0.4);*/}
/* item */
.vnt-main .cate-menu > li{display:block;position:static;transition:.22s ease}
.vnt-main .cate-menu > li:not(:last-child){border-bottom:1px solid rgba(255,255,255,.06)}
/* link */
.vnt-main .cate-menu > li > a{display:block;padding:13px 16px;color:#fff;font-size:14px;font-weight:500;transition:.22s ease}
/* hover */
.vnt-main .cate-menu > li:hover{background:rgba(255,255,255,.05)}
.vnt-main .cate-menu > li:hover > a{padding-left:22px}
/* hide toggle */
.vnt-main .submenu-toggle{display:none!important}
/* arrow */
.vnt-main .cate-menu > li.menu-item-has-children > a:after{content:"\203A";float:right;font-size:18px;color:rgba(255,255,255,.5);transition:.22s ease}
.vnt-main .cate-menu > li:hover > a:after{color:#fff;transform:translateX(4px)}
/* category mega trigger */
.vnt-main .cate-menu > li:hover > .mega-menu-box{display:grid}
/* category mega position */
.vnt-main .vnt-category-menu .mega-menu-box{left:100%;top:0;transform:none;max-width:900px;min-height:100%;max-height:100vh;padding:20px;overflow-y:auto;border-radius:0 16px 16px 0;position:absolute}
/************************************************
VNTrendy / Slideshow
MAIN ONLY
************************************************/

/* 3. Slider fill full chiều cao cột */
#vnt-slider{flex:1;width:100%;height:100%}
/* 4. Quan trọng nhất:KHÔNG cho ảnh tự quyết chiều cao */
#vnt-slider .carousel-inner,#vnt-slider .item{height:100%}
/* 5. Ảnh bị "nhốt" trong khung */
#vnt-slider .item img{width:100%;height:319px;object-fit:cover;display:block}
#vnt-slider .carousel-inner{height:319px;display:block;position:relative;/* chỉnh theo layout */}
#vnt-slider .item.active{display:block;position:relative}
/* Reset nền mặc định của Bootstrap */
#vnt-slider .carousel-control{width:50px;height:50px;top:40%;bottom:auto;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.4);border-radius:50%}
/* Icon mũi tên */
#vnt-slider .carousel-control span{display:flex;align-items:center;justify-content:center;width:45px;height:45px;background:rgba(0,0,0,0.5);border-radius:50%;color:#fff;font-size:20px;transition:all 0.3s ease}
/* Hover đẹp hơn */
#vnt-slider .carousel-control span:hover{background:#ff5722;transform:scale(1.1)}
/* Đẩy ra sát 2 bên */
#vnt-slider .carousel-control.left{left:10px}
#vnt-slider .carousel-control.right{right:10px}
/* Hover đẹp hơn */
#vnt-slider .carousel-control span:hover{background:#ff5722;transform:scale(1.1)}
@media (max-width:991px){.vnt-slideshow .slider{padding:0}}
@media (min-width:992px){.vnt-slideshow .slider{padding:15px 15px 0 0}}
/**End**/

/* ==================================================
VNTrendy / menu-primary.min.css
TOPBAR ONLY + SHARED MEGA
================================================== */

/* ===== TOPBAR FULL WIDTH ===== */
.vnt-topbar{background:linear-gradient(
            135deg,#081224 0%,#0d2142 100%
        );/*border-top:1px solid rgba(255,255,255,0.04);border-bottom:1px solid rgba(255,255,255,0.06);*/
    box-shadow:0 8px 25px rgba(0,0,0,0.22);position:relative}
.vnt-topbar::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:linear-gradient(
            90deg,transparent,rgba(255,179,0,0.4),transparent
        )}
/* FLEX */
.vnt-topbar .topbar-inner{display:flex;height:55px}
/* CATEGORY BUTTON */
.vnt-topbar .category-toggle{background:linear-gradient(180deg,rgba(255,255,255,0.06),rgba(255,255,255,0.03));color:#fff;border-right:1px solid rgba(255,255,255,0.06);transition:0.3s ease;backdrop-filter:blur(10px);position:relative;width:100%;height:54px;padding:0 12px;/* quan trọng:gọn lại */
    
    font-weight:bold;cursor:pointer;display:flex;align-items:center;justify-content:flex-start;gap:8px}
/* Mũi tên */
.vnt-topbar .category-toggle::after{content:"→";font-size:14px;color:#ffb300;transform:rotate(0deg);margin-left:auto;/* đẩy sang phải bằng flex */
    transition:0.25s ease}
.vnt-main.is-collapsed .category-toggle::after{transform:rotate(90deg)}
/* hover */
.vnt-topbar .category-toggle:hover{background:rgba(255,179,0,0.08);color:#ffb300}
.vnt-topbar .category-toggle i{margin-right:8px;color:#ffb300}
/* NAV WRAP */
.vnt-topbar .header-nav{flex:1;display:flex;/*justify-content:center;*/
 
/*Căn giữa cả menu và mega*/
    align-items:center;min-width:0}
/* MAIN MENU */
.header-nav .main-menu{display:flex;align-items:center;gap:34px;margin:0;padding:0;list-style:none;flex-wrap:nowrap;min-width:0}
/* =========================================================
   MENU LINK
========================================================= */
.header-nav .main-menu > li{position:relative;display:flex;align-items:center;gap:8px}
/* TOP LINKS */
.header-nav .main-menu > li > a{position:relative;display:block;padding:15px 0;color:#fff;font-size:15px;font-weight:700;line-height:1;letter-spacing:.3px;text-transform:uppercase;white-space:nowrap;transition:color 0.25s ease,opacity 0.25s ease}
/* underline effect */
.header-nav .main-menu > li > a::after{content:"";position:absolute;left:0;bottom:10px;width:0;height:2px;background:linear-gradient(
            90deg,#ffb300,#ff8f00
        );transition:0.3s ease}
/* hover */
.header-nav .main-menu > li:hover > a:after,.header-nav .main-menu > li.open > a:after,.header-nav .main-menu > li.current-menu-item > a:after,.header-nav .main-menu > li.current-menu-parent > a:after{width:100%}
/* TOGGLE */
.header-nav .submenu-toggle{background:none;border:0;padding:0;margin:0;color:rgba(255,255,255,.8);font-size:11px;cursor:pointer;transition:.22s ease}
.header-nav .submenu-toggle:hover{color:#fff}
.header-nav .main-menu > li.open > .submenu-toggle{transform:rotate(180deg);color:#fff}
/* NORMAL DROPDOWN */
.header-nav .main-menu > li > ul{display:none;position:absolute;top:100%;left:0;min-width:240px;padding:12px 0;margin:0;list-style:none;background:#111;border-radius:16px;border:1px solid rgba(255,255,255,.06);box-shadow:0 18px 40px rgba(0,0,0,.35);z-index:9999}
.header-nav .main-menu > li.open > ul{display:block}
.header-nav .main-menu > li > ul > li > a{display:block;padding:12px 18px;color:#fff;font-size:14px;font-weight:600;transition:.2s ease}
.header-nav .main-menu > li > ul > li > a:hover{padding-left:24px;background:rgba(255,255,255,.05)}
/* topbar mega trigger */
.header-nav .main-menu > li.open > .mega-menu-box{display:grid}
/* topbar mega position */
.header-nav .mega-menu-box{top:100%;left:50%;transform:translateX(-50%)}
/* =========================================
SHARED MEGA
========================================= */
.mega-parent{position:relative}
.mega-menu-box{display:none;position:absolute;top:100%;left:50%;transform:translateX(-50%);/* responsive width */
width:clamp(760px,80vw,1200px);padding:28px 10px;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:16px;box-shadow:0 22px 55px rgba(0,0,0,.25);grid-template-columns:1fr;gap:30px;z-index:10000}
.header-nav .mega-menu-box{width:clamp(760px,71vw,1200px)}
/* image */
.mega-col.image img{width:100%;height:auto;object-fit:cover;border-radius:14px}
/* layout */
.mega-menu-box.no-image{grid-template-columns:1fr}
.mega-menu-box.has-one{grid-template-columns:160px 1fr}
.mega-menu-box.has-both{grid-template-columns:160px 1fr 160px}
/* links */
.mega-col.links > ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:0;padding:0;list-style:none}
@media (min-width:1200px){.mega-col.links > ul{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1600px){.mega-col.links > ul{grid-template-columns:repeat(3,minmax(0,1fr))}}
.mega-col.links > ul > li > a{display:block;margin-bottom:10px;border-bottom:1px solid #ccc;font-size:20px;font-weight:700;color:#000}
/* sub */
.mega-sub{margin:0;padding:0;list-style:none}
.mega-sub li{margin-bottom:6px}
.mega-sub li a{font-size:16px;color:#666;transition:.2s}
.mega-sub li a:hover{color:#052845;padding-left:6px}
/* responsive */
@media (max-width:1200px){.header-nav .main-menu{gap:22px}.header-nav .main-menu > li > a{font-size:14px}.mega-menu-box{gap:20px}}

/* ======================================
STICKY TOPBAR
====================================== */
.vnt-topbar.is-sticky{position:fixed;top:0;left:0;width:100%;z-index:9999;animation:topbarSticky .28s ease;box-shadow:0 10px 30px rgba(0,0,0,.18)}
/* WP ADMIN BAR */
body.admin-bar .vnt-topbar.is-sticky{top:32px}
/* FIX BOOTSTRAP ROW */
.vnt-topbar.is-sticky .topbar-inner{display:flex;height:52px;align-items:center}
/* FIX NAV */
.vnt-topbar.is-sticky .header-nav{position:relative}
/* ======================================
CATEGORY MENU STICKY MODE
====================================== */
.vnt-topbar.is-sticky .vnt-main{position:relative}
/* dropdown đóng mặc định */
.vnt-topbar.is-sticky .vnt-category-menu{display:none;position:absolute;top:100%;left:0;width:100%;z-index:999999}
/* sticky mode arrow rotate */
.vnt-topbar.is-sticky .vnt-main.active .category-toggle::after{transform:rotate(90deg)}
/* khi mở */
.vnt-topbar.is-sticky .vnt-main.active .vnt-category-menu{display:block}
/* category button compact hơn */
.vnt-topbar.is-sticky .category-toggle{border-radius:0}
/* smooth */
.vnt-topbar{transition:box-shadow .25s ease,transform .25s ease}
/* animation */
@keyframes topbarSticky{from{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}